计划单统计表-分页/排序

src/views/cost-allocation-total/inancialReconciliation.vue

@@ -1,5 +1,5 @@
 <template>
-  <!-- 【单证】 财务核对表 -->
+  <!-- 【单证】 计划单统计表 -->
   <div id="costAllocationTotal">
     <!-- 查询区域 -->
     <a-card :bordered="false">
@@ -30,16 +30,15 @@
             </a-col>
 
             <template v-if="toggleSearchStatus">
-              <a-col :md="6" :sm="8">
+              <!-- <a-col :md="6" :sm="8">
               <a-form-item label="是否存在对单人">
                 <a-select v-model="queryParam.isPlanMan"  placeholder="" >
                  <a-select-option value="">请选择</a-select-option>
                  <a-select-option value="是">是</a-select-option>
                  <a-select-option value="否">否</a-select-option>
                </a-select>
-                <!-- <a-input placeholder="请输入" v-model="queryParam.orderType"></a-input> -->
               </a-form-item>
-            </a-col>
+            </a-col> -->
               <a-col :md="6" :sm="8">
               <a-form-item label="面损表单据状态">
                 <a-select v-model="queryParam.fstatus">
@@ -92,7 +91,7 @@
                 <a-range-picker
                   :placeholder="['开始时间', '结束时间']"
                   format="YYYY-MM-DD"
-                  style="width: 100%"
+                   
                   v-model="ffirstApproveDate"
                   @change="changeFfirstApproveDate"
                 />
@@ -186,10 +185,34 @@ export default {
       costAllocationColumns: [
         { title: '计划单号', width: 120, dataIndex: 'planNo', fixed: 'left', className: 'replacecolor' },
         { title: '日期', width: 120, dataIndex: 'dverifyDate', className: 'replacecolor' },
-        { title: '部门', width: 120, dataIndex: 'department', className: 'replacecolor'},
+        { title: '部门', width: 120, dataIndex: 'department', className: 'replacecolor',
+        sorter:(a,b)=> {
+                  let temp1="";
+                  let temp2="";
+                  if(a.department!=null){
+                    temp1=a.department;
+                  }
+                  if(b.department!=null){
+                    temp2=b.department;
+                  }
+                  return temp1.localeCompare(temp2);
+              },
+      },
         { title: '业务员', width: 120, dataIndex: 'salesman', className: 'replacecolor' },
         { title: '计划师傅/制单人', width: 150, dataIndex: 'maker', className: 'replacecolor'},
-        { title: '对单人(手输人)', width: 220, dataIndex: 'planMan', align: 'left', className: 'replacecolor', scopedSlots: { customRender: 'planMan' }, },
+        { title: '对单人(手输人)', width: 220, dataIndex: 'planMan', align: 'left', className: 'replacecolor',
+        sorter:(a,b)=> {
+                  let temp1="";
+                  let temp2="";
+                  if(a.planMan!=null){
+                    temp1=a.planMan;
+                  }
+                  if(b.planMan!=null){
+                    temp2=b.planMan;
+                  }
+                  return temp1.localeCompare(temp2);
+              },
+         },
         //  {
         //   title: '创建时间',
         //   dataIndex: 'createTime',
@@ -211,7 +234,10 @@ export default {
             }
             
           },
-          className: 'replacecolor'
+          className: 'replacecolor',
+          sorter: (a, b) => {
+            return new Date(a.fsubmitDate) > new Date(b.fsubmitDate) ? 1 : -1;
+          },
         },
         {
           title: '返单日期',
@@ -225,7 +251,10 @@ export default {
             }
             
           },
-          className: 'replacecolor'
+          className: 'replacecolor',
+          sorter: (a, b) => {
+            return new Date(a.frejectDate) > new Date(b.frejectDate) ? 1 : -1;
+          },
         },
         {
           title: '审核结束日期',
@@ -239,7 +268,10 @@ export default {
             }
             
           },
-          className: 'replacecolor'
+          className: 'replacecolor',
+          sorter: (a, b) => {
+            return new Date(a.ffirstApproveDate) > new Date(b.ffirstApproveDate) ? 1 : -1;
+          },
         },
         {
           title: '核纱结束日期',
@@ -254,9 +286,24 @@ export default {
           //   }
             
           // },
-          className: 'replacecolor'
+          className: 'replacecolor',
+          sorter: (a, b) => {
+            return new Date(a.ffinalApproveDate) > new Date(b.ffinalApproveDate) ? 1 : -1;
+          },
         },
-        { title: '面损表单据状态', width: 90, dataIndex: 'fstatus', className: 'replacecolor' },
+        { title: '面损表单据状态', width: 90, dataIndex: 'fstatus', className: 'replacecolor',
+        sorter:(a,b)=> {
+                  let temp1="";
+                  let temp2="";
+                  if(a.fstatus!=null){
+                    temp1=a.fstatus;
+                  }
+                  if(b.fstatus!=null){
+                    temp2=b.fstatus;
+                  }
+                  return temp1.localeCompare(temp2);
+              },
+         },
         {
           title: '交单日期',
           width: 120,
@@ -269,7 +316,10 @@ export default {
             }
             
           },
-          className: 'replacecolor'
+          className: 'replacecolor',
+          sorter: (a, b) => {
+            return new Date(a.csubmitDate) > new Date(b.csubmitDate) ? 1 : -1;
+          },
         },
         {
           title: '返单日期',
@@ -283,7 +333,10 @@ export default {
             }
             
           },
-          className: 'replacecolor'
+          className: 'replacecolor',
+          sorter: (a, b) => {
+            return new Date(a.crejectDate) > new Date(b.crejectDate) ? 1 : -1;
+          },
         },
         {
           title: '结束日期',
@@ -297,9 +350,24 @@ export default {
             }
             
           },
-          className: 'replacecolor'
+          className: 'replacecolor',
+          sorter: (a, b) => {
+            return new Date(a.cfirstApproveDate) > new Date(b.cfirstApproveDate) ? 1 : -1;
+          },
         },
-        { title: '分配表单据状态', width: 120, dataIndex: 'cstatus', className: 'replacecolor' },
+        { title: '分配表单据状态', width: 120, dataIndex: 'cstatus', className: 'replacecolor',
+        sorter:(a,b)=> {
+                  let temp1="";
+                  let temp2="";
+                  if(a.cstatus!=null){
+                    temp1=a.cstatus;
+                  }
+                  if(b.cstatus!=null){
+                    temp2=b.cstatus;
+                  }
+                  return temp1.localeCompare(temp2);
+              },
+       },
         {
           title: '备注',
           width: 180,
@@ -323,10 +391,14 @@ export default {
         // index: '',
         // planNum: '',
         // customerShortame: '',
+        pageSize:100,
         pageNo: '' // 点击的页数
       },
       // 分页
       pagination: {
+        pageSizeOptions: ["100","150", "500"],
+        showSizeChanger: true,
+        pageSize:100
       },
       dateFormat: 'YYYY-MM-DD',
       loading: false // 表格加载
@@ -352,7 +424,9 @@ export default {
             this.pagination = {
               total: res.result.total,
               current: res.result.current,
-              pageSize: res.result.size
+              pageSize: res.result.size,
+              pageSizeOptions: ["100","150", "500"],
+              showSizeChanger: true,
             }
           }else{
             this.$message.error(res.message);
@@ -434,6 +508,7 @@ export default {
 
     handleTableChange(pagination, filters, sorter) {
       this.queryParam.pageNo = pagination.current
+      this.queryParam.pageSize = pagination.pageSize
       this.getCostList()
     },
   },