a

src/views/WorkshopProcurement/OutsourcingMaterialsSearch/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-card style="width: 72%">
+    <el-card style="width: 76%">
       <div style="margin-top: 7px; margin-bottom: 7px">
         <span>供应商</span>
         <el-select v-model="supplierNameValue" style="width:200px" placeholder="供应商" size="small" filterable clearable>
@@ -20,11 +20,29 @@
             :label="item.label"
             :value="item.value"/>
         </el-select>
+<<<<<<< HEAD
         <el-button icon="el-icon-search" type="primary" plain size="small" @click="pageCurrent = 1;pageSize = 100;getTableData()">查询</el-button>
         <el-button type="primary" icon="el-icon-download" plain size="small" @click="exportExcel()">导出</el-button>
+=======
+        <span>备料时间段:</span>
+        <el-date-picker
+          v-model="dateRange"
+          :picker-options="pickerOptions"
+          size="small"
+          type="daterange"
+          align="center"
+          style="width: 300px;margin: 3px 0"
+          value-format="yyyy-MM-dd"
+          format="yyyy-MM-dd"
+          range-separator="～"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"/>
+        <el-button icon="el-icon-search" type="success" size="small" @click="pageCurrent = 1;pageSize = 100;getTableData()">查询</el-button>
+        <el-button type="primary" icon="el-icon-download" size="small" @click="exportExcel()">导出</el-button>
+>>>>>>> 6d4033c92a46c968832636b84ef2c64c7b192fe4
       </div>
     </el-card>
-    <el-card style="width: 72%">
+    <el-card style="width: 76%">
       <el-table
         v-loading="loading"
         :data="tableData"
@@ -33,7 +51,8 @@
         stripe
         size="mini"
         style="width: 100%"
-        height="760">
+        height="760"
+        @sort-change="sortChange">
         <el-table-column
           label="序号"
           align="center"
@@ -52,7 +71,11 @@
         <el-table-column
           label="供应商"
           align="center"
-          min-width="210px">
+          min-width="210px"
+          width="300"
+          prop="供应商名称"
+          sortable="custom"
+          show-overflow-tooltip>
           <template slot-scope="scope">{{ scope.row.供应商名称 }}</template>
         </el-table-column>
         <el-table-column
@@ -64,12 +87,16 @@
         <el-table-column
           label="物料名称"
           align="center"
+          prop="零件名称"
+          sortable="custom"
           width="120px">
           <template slot-scope="scope">{{ scope.row.零件名称 }}</template>
         </el-table-column>
         <el-table-column
           label="材料"
-          width="100"
+          width="90"
+          prop="材料"
+          sortable="custom"
           align="center">
           <template slot-scope="scope">{{ scope.row.材料 }}</template>
         </el-table-column>
@@ -78,7 +105,7 @@
             {{ scope.row.采购数量 }}
           </template>
         </el-table-column>
-        <el-table-column label="备料时间" align="center" width="100">
+        <el-table-column label="备料时间" align="center" prop="下单日期" sortable="custom" width="100">
           <template slot-scope="scope">
             {{ scope.row.下单日期 ? scope.row.下单日期.split(' ')[0] : '' }}
           </template>
@@ -122,6 +149,37 @@ export default {
   name: 'Index',
   data() {
     return {
+      ordername: '',
+      order: '',
+      dateRange: '',
+      expands: [],
+      pickerOptions: {
+        shortcuts: [{
+          text: '上季度',
+          onClick(picker) {
+            const end = new Date()
+            const start = new Date()
+            start.setTime(end.getTime() - 3600 * 1000 * 24 * 30 * 3)
+            picker.$emit('pick', [start, end])
+          }
+        }, {
+          text: '过去半年',
+          onClick(picker) {
+            const end = new Date()
+            const start = new Date()
+            start.setTime(end.getTime() - 3600 * 1000 * 24 * 366 / 2)
+            picker.$emit('pick', [start, end])
+          }
+        }, {
+          text: '过去一年',
+          onClick(picker) {
+            const end = new Date()
+            const start = new Date()
+            start.setTime(end.getTime() - 3600 * 1000 * 24 * 365)
+            picker.$emit('pick', [start, end])
+          }
+        }]
+      },
       supplierNameValue: '',
       supplierNames: [],
       partNumber: '',
@@ -145,7 +203,7 @@ export default {
   },
   created() {
     this.fetchData()
-    this.getTableData()
+    // this.getTableData()
   },
   methods: {
     formatJson(filterVal, jsonData) {
@@ -154,7 +212,8 @@ export default {
       }))
     },
     exportExcel() {
-      let check, check1, check2
+      let check, check1, check2, check3
+      this.dateRange ? check3 = 1 : (check3 = 0, this.dateRange = '')
       this.supplierNameValue ? check = 1 : check = 0
       this.partNumber ? check1 = 1 : check1 = 0
       if (this.MaterialsValue !== '' && this.MaterialsValue !== null) {
@@ -162,11 +221,11 @@ export default {
       } else {
         check2 = 0
       }
-      searchTablesheet(check, this.supplierNameValue, check1, this.partNumber, check2, this.MaterialsValue).then(res => {
+      searchTablesheet(check, this.supplierNameValue, check1, this.partNumber, check2, this.MaterialsValue, check3, this.dateRange[0], this.dateRange[1], this.ordername, this.order).then(res => {
         console.log(res.data, 11)
         import('@/vendor/Export2Excel').then(excel => {
-          const tHeader = ['备料状态', '供应商', '物料编码', '物料名称', '材料', '备件件数', '备料时间', '到货件数', '到货时间', '结算时间']
-          const filterVal = ['是否到货', '供应商名称', '物料编码', '零件名称', '材料', '采购数量', '下单日期', '到货数量', '日期', '开票时间']
+          const tHeader = ['备料状态', '供应商', '物料编码', '物料名称', '材料', '备料件数', '备料时间', '到货件数', '到货时间', '结算时间']
+          const filterVal = ['备料状态', '供应商名称', '物料编码', '零件名称', '材料', '采购数量', '下单日期', '到货数量', '日期', '开票时间']
           const list = res.data
           const data = this.formatJson(filterVal, list)
           excel.export_json_to_excel({
@@ -189,9 +248,31 @@ export default {
         }
       })
     },
+    // 按供应商名称，下单日期，零件名称，材料
+    sortChange(column) {
+      console.log(column + '-' + column.prop + '-' + column.order, 11111)
+      if (column.prop === '供应商名称') {
+        this.ordername = 1
+      } else if (column.prop === '零件名称') {
+        this.ordername = 2
+      } else if (column.prop === '材料') {
+        this.ordername = 3
+      } else if (column.prop === '下单日期') {
+        this.ordername = 4
+      } else {
+        this.ordername = ''
+      }
+      if (column.order === 'ascending') {
+        this.order = 1
+      } else if (column.order === 'descending') { this.order = 2 } else {
+        this.order = ''
+      }
+      this.getTableData()
+    },
     getTableData() {
       this.loading = true
-      let check, check1, check2
+      let check, check1, check2, check3
+      this.dateRange ? check3 = 1 : (check3 = 0, this.dateRange = '')
       this.supplierNameValue ? check = 1 : check = 0
       this.partNumber ? check1 = 1 : check1 = 0
       if (this.MaterialsValue !== '' && this.MaterialsValue !== null) {
@@ -199,8 +280,8 @@ export default {
       } else {
         check2 = 0
       }
-      console.log(this.MaterialsValue, check2, 123)
-      searchTable(check, this.supplierNameValue, check1, this.partNumber, check2, this.MaterialsValue, this.pageSize, this.pageCurrent).then(response => {
+      searchTable(check, this.supplierNameValue, check1, this.partNumber, check2, this.MaterialsValue, check3, this.dateRange[0], this.dateRange[1], this.ordername, this.order, this.pageSize, this.pageCurrent).then(response => {
+        console.log(response)
         this.tableData = response.data.rows
         this.total = response.data.total
         this.loading = false