拉取代码

src/dashoo.cn/frontend_web/src/pages/select/informationreporting/index.vue

@@ -0,0 +1,376 @@
+<template>
+  <div>
+    <!--顶部显示-->
+    <el-breadcrumb class="heading">
+      <el-breadcrumb-item :to="{ path: '/' }">平台首页</el-breadcrumb-item>
+      <el-breadcrumb-item>业务申请上报情况</el-breadcrumb-item>
+    </el-breadcrumb>
+
+    <!--内框顶部显示-->
+    <el-card class="box-card" style="height: calc(100vh - 115px);position:relative">
+      <div slot="header">
+        <span>
+          <i class="icon icon-table2"></i> 业务申请上报情况
+        </span>
+
+        <el-form
+          :model="searchForm"
+          ref="searchformRef"
+          :inline="true"
+          style="float: right;position:absolute;right:15px;top:10.5px"
+        >
+         
+          <el-form-item label="企业名称">
+            <el-input size="mini" v-model="searchForm.SupplierName" placeholder="请输入内容"></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-dropdown
+              split-button
+              type="primary"
+              size="mini"
+              @click="initDatas($event)"
+              @command="searchCommand"
+            >
+              查询
+              <el-dropdown-menu slot="dropdown">
+                <el-dropdown-item command="clear">查询重置</el-dropdown-item>
+              </el-dropdown-menu>
+            </el-dropdown>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" size="mini" @click="exportExcel">导出</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+
+      <!--内框表格显示-->
+      <el-table
+        id="rebateSetTable"
+        :data="entityList"
+        size="small"
+        border
+        height="calc(100vh - 243px)"
+        style="width: 100%"
+        @sort-change="orderby"
+        @row-click="handle"
+      >
+        <!--内框表格剩余栏显示-->
+        <el-table-column label="企业名称" prop="SupplierName" sortable align="center"></el-table-column>
+        <el-table-column label="准入类别" prop="SupplierTypeName" align="center"></el-table-column>
+      </el-table>
+
+      <!-- 分页 -->
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage"
+        :page-sizes="[10, 15, 20, 25]"
+        :page-size="size"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="currentItemCount"
+      ></el-pagination>
+    </el-card>
+
+  </div>
+</template>
+
+
+
+
+
+<script>
+import api from "@/api/oilsupplier/select";
+import FileSaver from "file-saver";
+import XLSX from "xlsx";
+import oapi from "@/api/oilsupplier/supplier";
+export default {
+  created() {
+    Object.assign(this.searchFormReset, this.searchForm);
+    // 执行初始化方法
+    this.getDictOptions();
+    this.initDatas();
+  },
+  data() {
+    return {
+      CityAry: [],
+      LinkCityAry: [],
+      countryprops: {
+        value: "adcode",
+        label: "name",
+        children: "districts"
+      },
+      CompanyTypeOptions: [],
+      dictData: null,
+      searchFormReset: {},
+      dialogVisible: false,
+      formData: {
+        SupplierName: "",
+        AccessCardNo: "",
+        SpecTypeCode: "",
+        Country: "",
+        InStyle: "",
+        ManagementUnit: "",
+        CredentialFlag: "",
+        CommercialNo: "",
+        CountryTaxNo: "",
+        OrganCode: "",
+        Address: "",
+        ZipCode: "",
+        LinkAddress: "",
+        LinkZipCode: "",
+        LegalPerson: "",
+        CompanyType: "",
+        RegCapital: "",
+        SetupTime: "",
+        DepositBank: "",
+        BankAccount: "",
+        ContactName: "",
+        Mobile: "",
+        Telphone: "",
+        Fax: "",
+        CompanyTel: "",
+        EMail: "",
+        BankCreditRating: "",
+        Level: "",
+        HseTraining: "",
+        QualitySystemCert: "",
+        ProductQualityCert: "",
+        MaunLicense: "",
+        AgentManufacturer: "",
+        SupplierCertificate: "",
+        SafetyLicense: "",
+        SpecIndustryCert: "",
+        BusinessScope: "",
+        Remark: ""
+      },
+      show: false,
+      // 定义列表数据
+      entityList: [],
+      // 分页参数
+      size: 10,
+      currentPage: 1,
+      currentItemCount: 0,
+      SetupTime: "",
+      searchForm: {
+        AccessCardNo: "",
+        SupplierName: "",
+        SupplierTypeCode: "",
+        InFlag: "",
+        LegalPerson: "",
+        ContactName: "",
+        CommercialNo: "",
+        RegCapital1: "",
+        RegCapital2: "",
+        CompanyType: "",
+        SetupTime: "",
+        Province: "",
+        City: "",
+        Street: "",
+        Address: "",
+        LinkProvince: "",
+        LinkCity: "",
+        LinkStreet: "",
+        LinkAddress: "",
+        DepositBank: "",
+        BusinessScope: ""
+      },
+      //列表排序
+      Column: {
+        Order: "",
+        Prop: ""
+      },
+      countryoptions: []
+    };
+  },
+
+  methods: {
+    handleLinkAreaChange(value) {
+      this.searchForm.LinkProvince = value[0];
+      this.searchForm.LinkCity = value[1];
+      this.searchForm.LinkStreet = value[2];
+    },
+    handleAreaChange(value) {
+      console.log(value);
+      this.searchForm.Province = value[0];
+      this.searchForm.City = value[1];
+      this.searchForm.Street = value[2];
+    },
+    getDictOptions() {
+      oapi
+        .getDictList(this.$axios)
+        .then(res => {
+          this.dictData = res.data.items;
+          this.CompanyTypeOptions = this.dictData["CompanyType"];
+          this.getCityList(this.dictData["GaodeMapChinaAreas"]);
+        })
+        .catch(err => {
+          console.error(err);
+        });
+    },
+    getCityList(val) {
+      let resultData = JSON.parse(val);
+      let countstr = JSON.stringify(resultData.districts[0].districts);
+      countstr = countstr.replace(/\,\"districts\"\:\[\]/g, "");
+      this.countryoptions = JSON.parse(countstr);
+    },
+    exportExcel() {
+      /* generate workbook object from table */
+      let wb = XLSX.utils.table_to_book(
+        document.querySelector("#rebateSetTable")
+      );
+      /* get binary string as output */
+      let wbout = XLSX.write(wb, {
+        bookType: "xlsx",
+        bookSST: true,
+        type: "array"
+      });
+      try {
+        FileSaver.saveAs(
+          new Blob([wbout], { type: "application/octet-stream" }),
+          "SupplierSituation.xlsx"
+        );
+      } catch (e) {
+        if (typeof console !== "undefined") console.log(e, wbout);
+      }
+      return wbout;
+    },
+    handle(row, column, event, cell) {
+      console.log(row);
+      this.formData.SupplierName = row.SupplierName;
+      this.formData.AccessCardNo = row.AccessCardNo;
+      this.formData.SpecTypeCode = row.SpecTypeCode;
+      this.formData.Country = row.Country;
+      this.formData.InStyle = row.InStyle;
+      this.formData.ManagementUnit = row.ManagementUnit;
+      this.formData.CredentialFlag = row.CredentialFlag;
+      this.formData.CommercialNo = row.CommercialNo;
+      this.formData.CountryTaxNo = row.CountryTaxNo;
+      this.formData.OrganCode = row.OrganCode;
+      this.formData.Address = row.Address;
+      this.formData.ZipCode = row.ZipCode;
+      this.formData.LinkAddress = row.LinkAddress;
+      this.formData.LinkZipCode = row.LinkZipCode;
+      this.formData.LegalPerson = row.LegalPerson;
+      this.formData.CompanyType = row.CompanyType;
+      this.formData.RegCapital = row.RegCapital;
+      this.formData.SetupTime = row.SetupTime;
+      this.formData.DepositBank = row.DepositBank;
+      this.formData.BankAccount = row.BankAccount;
+      this.formData.ContactName = row.ContactName;
+      this.formData.Mobile = row.Mobile;
+      this.formData.Telphone = row.Telphone;
+      this.formData.Fax = row.Fax;
+      this.formData.CompanyTel = row.CompanyTel;
+      this.formData.EMail = row.EMail;
+      this.formData.BankCreditRating = row.BankCreditRating;
+      this.formData.Level = row.Level;
+      this.formData.HseTraining = row.HseTraining;
+      this.formData.QualitySystemCert = row.QualitySystemCert;
+      this.formData.ProductQualityCert = row.ProductQualityCert;
+      this.formData.MaunLicense = row.MaunLicense;
+      this.formData.AgentManufacturer = row.AgentManufacturer;
+      this.formData.SupplierCertificate = row.SupplierCertificate;
+      this.formData.SafetyLicense = row.SafetyLicense;
+      this.formData.SpecIndustryCert = row.SpecIndustryCert;
+      this.formData.BusinessScope = row.BusinessScope;
+      this.formData.Remark = row.Remark;
+
+      this.show = true;
+    },
+
+    //列表排序功能
+    orderby(column) {
+      if (column.order == "ascending") {
+        this.Column.Order = "asc";
+      } else if (column.order == "descending") {
+        this.Column.Order = "desc";
+      }
+      this.Column.Prop = column.prop;
+      this.initDatas();
+    },
+    jstimehandle(val) {
+      if (val === "") {
+        return "----";
+      } else if (val === "0001-01-01T08:00:00+08:00") {
+        return "----";
+      } else if (val === "0001-01-01T00:00:00Z") {
+        return "----";
+      } else if (val === "5000-01-01T23:59:59+08:00") {
+        return "永久";
+      } else {
+        val = val.replace("T", " ");
+        return val.substring(0, 10);
+      }
+    },
+    //初始化列表方法
+    initDatas(event) {
+      console.log(this.searchForm);
+      if (event != null) {
+        this.currentPage = 1;
+        this.dialogVisible = false;
+      }
+      let params = {
+        _size: this.size,
+        _currentPage: this.currentPage,
+        Order: this.Column.Order,
+        Prop: this.Column.Prop,
+        SetupTime: this.searchForm.SetupTime,
+        Province: this.searchForm.Province,
+        City: this.searchForm.City,
+        Street: this.searchForm.Street,
+        Address: this.searchForm.Address,
+        LinkProvince: this.searchForm.LinkProvince,
+        LinkCity: this.searchForm.LinkCity,
+        LinkStreet: this.searchForm.LinkStreet,
+        LinkAddress: this.searchForm.LinkAddress,
+        DepositBank: this.searchForm.DepositBank
+      };
+
+      api
+        .getCompanyList(params, this.searchForm, this.$axios)
+        .then(res => {
+          this.entityList = res.data.items;
+          this.currentItemCount = res.data.currentItemCount;
+        })
+        .catch(err => {
+          console.error(err);
+        });
+    },
+    //分页方法
+    handleCurrentChange(value) {
+      this.currentPage = value;
+      this.initDatas();
+    },
+    handleSizeChange(value) {
+      this.size = value;
+      this.currentPage = 1;
+      this.initDatas();
+    },
+    searchCommand(command) {
+      if (command == "search") {
+        this.dialogVisible = true;
+      } else if (command == "clear") {
+        this.clearSearch();
+      }
+    },
+    clearSearch() {
+      Object.assign(this.searchForm, this.searchFormReset);
+      this.CityAry = [];
+      (this.LinkCityAry = []), (this.currentPage = 1);
+      this.initDatas();
+    }
+  }
+};
+</script>
+
+<style>
+.eldialog .el-input__inner {
+  border: none;
+}
+.eldialog .el-textarea__inner {
+  border: none;
+  resize: none;
+  height: 70px;
+}
+</style>
+