手工匹配订单

src/views/order/manualModal.vue

@@ -0,0 +1,257 @@
+<template>
+    <div id="manualModal">
+      <a-modal
+        title="手工匹配订单"
+        v-model="manualModVis"
+        :confirmLoading="confirmLoading"
+        @cancel="handleCancel"
+        width="80%"
+        style="top:330px;left:100px;"
+      >
+        <!-- 主表信息 回显  -->
+        <a-card :bordered="false" >
+          <div class="table-page-search-wrapper">
+            <a-form layout="inline" @keyup.enter.native="searchQuery">
+          <a-row :gutter="24">
+            <a-col :md="6" :sm="8">
+                <a-form-item label="账套">
+                  <j-search-select-tag
+                  placeholder="请选择账套"
+                  v-model="queryParam.account"
+                  dict="view_account,account,account">
+                </j-search-select-tag>
+                </a-form-item>
+              </a-col>
+            <a-col :md="6" :sm="8">
+              <a-form-item label="销售订单号">
+                <a-input placeholder="请输入销售订单号" v-model="queryParam.orderNumber"></a-input>
+              </a-form-item>
+            </a-col>            
+            <template v-if="toggleSearchStatus">
+            </template>
+
+            <a-col :md="6" :sm="8">
+              <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+                <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
+                <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
+                <a @click="handleToggleSearch" style="margin-left: 8px">
+                  {{ toggleSearchStatus ? '收起' : '展开' }}
+                  <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
+                </a>
+              </span>
+            </a-col>
+          </a-row>
+        </a-form>
+          </div>
+        </a-card>
+  
+        <!-- 増行 子表 -->
+        <a-card :bordered="false" style="margin:10px 0;">
+          <!-- 子表 -->
+          <a-spin :spinning="confirmLoading">
+              <a-table
+                bordered
+                :row-key="record => record.id"
+                :columns="manualColumns"
+                :data-source="manualData"
+                :loading="loading"
+                :scroll="{x: 1500,y:300 }"
+                :pagination="false"
+              >
+              <span slot="operationSlot" slot-scope="text, record">
+                     <a @click="handleExportXls(record)" style="color:green;">关联委外</a>
+                     <a-divider type="vertical" />
+                     <a @click="handleExportXls(record)" style="color:red;">删行</a>
+                 </span>
+
+              </a-table>
+          </a-spin>
+        </a-card>
+  
+        <!-- 页面底部保存取消 -->
+        <div
+          :style="{
+            position: 'absolute',
+            right: 0,
+            bottom: 0,
+            width: '100%',
+            borderTop: '1px solid #e9e9e9',
+            padding: '10px 16px',
+            background: '#fff',
+            textAlign: 'right',
+            zIndex: 1
+          }"
+        >
+          <a-popconfirm title="确定放弃？" @confirm="handleCancel" okText="确定" cancelText="取消">
+            <a-button :style="{ marginRight: '8px' }">返回</a-button>
+          </a-popconfirm>
+          <a-button type="primary" @click="addSave">
+            保存
+          </a-button>
+        </div>
+      </a-modal>
+    </div>
+  </template>
+  
+  <script>
+  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+  import JEllipsis from '@/components/jeecg/JEllipsis'
+  import moment from 'moment'
+  import { syDeclarationElementsAdd,queryLatelyDeclarationElements } from '@api/document/shipmentList'
+  import {Dictionaries} from '@api/document/book.js'
+  
+  export default {
+    name: 'manualModal', // 报关要素
+    mixins: [JeecgListMixin],
+    components: { JEllipsis, moment },
+  
+    data() {
+      let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} /> // 省略
+  
+      return {
+        queryParam:{},
+        manualModVis:false,
+        confirmLoading: false,
+        manualData:[
+        {id:1,priceRemarks:2},
+        {id:1,priceRemarks:2},
+        {id:1,priceRemarks:2},
+        {id:1,priceRemarks:2},
+        {id:1,priceRemarks:2},
+        {id:1,priceRemarks:2},
+        {id:1,priceRemarks:2},
+        {id:1,priceRemarks:2},
+        {id:1,priceRemarks:2},
+        {id:1,priceRemarks:2},
+        ],
+        manualColumns:[
+        {
+          title: '销售订单账套号',
+          width: 140,
+          dataIndex: 'priceRemarks',
+          className: 'replacecolor',
+          ellipsis: true
+        },
+        {
+          title: '销售订单号',
+          width: 120,
+          dataIndex: 'priceRemarks',
+          className: 'replacecolor',
+          ellipsis: true
+        },
+        {
+          title: '销售订单行消息',
+          width: 140,
+          dataIndex: 'priceRemarks',
+          className: 'replacecolor',
+          ellipsis: true
+        },
+        {
+          title: '存货编码',
+          width: 120,
+          dataIndex: 'priceRemarks',
+          className: 'replacecolor',
+          ellipsis: true
+        },
+        {
+          title: '存货名称',
+          width: 120,
+          dataIndex: 'priceRemarks',
+          className: 'replacecolor',
+          ellipsis: true
+        },
+        {
+          title: '规格型号',
+          width: 120,
+          dataIndex: 'priceRemarks',
+          className: 'replacecolor',
+          ellipsis: true
+        },
+        {
+          title: '颜色',
+          width: 80,
+          dataIndex: 'priceRemarks',
+          className: 'replacecolor',
+          ellipsis: true
+        },
+        {
+          title: '委外订单号',
+          width: 120,
+          dataIndex: 'priceRemarks',
+          className: 'replacecolor',
+          ellipsis: true
+        },
+        {
+          title: '委外订单行号',
+          width: 120,
+          dataIndex: 'priceRemarks',
+          className: 'replacecolor',
+          ellipsis: true
+        },
+        {
+          title: '操作',
+          width: 120,
+          dataIndex: 'operation',
+          scopedSlots: { customRender: 'operationSlot' },
+          className: 'replacecolor',
+          ellipsis: true
+        },
+        ]
+      }
+    },
+    // 接收父组件 方法
+    props: {},
+  
+    created() {  
+
+    },
+    methods: {
+        //查询 
+        searchQuery(){
+
+        },
+        //重置
+        searchReset(){
+        },
+        //返回
+        handleCancel(){
+
+        },
+        //保存
+        addSave(){
+
+        },
+        //关闭弹窗
+        close(){
+
+        }
+    },
+  
+    computed: {}
+  }
+  </script>
+  <style lang="less" scoped>
+  @import '~@assets/less/common.less';
+  @import '~@assets/less/overwriter.less';
+  /deep/ .ant-table-thead > tr > th {
+    text-align: center;
+    // font-weight: 700;
+  }
+  /deep/ .ant-table-tbody {
+    text-align: center;
+  }
+  // th.replacecolor {
+  // background-color:  #ccc;
+  // }
+  // 对话框里的card样式
+  /deep/ .ant-modal-content {
+    background-color: #f0f2f5;
+  }
+  /deep/ .ant-modal-body {
+    padding: 10px;
+  }
+  /deep/.ant-form-item{
+    margin-bottom: 0px !important;
+  }
+  </style>
+  

src/views/order/orderList.vue

@@ -104,7 +104,8 @@ c<template>
               <a-input placeholder="请输入" v-model="dingDan"></a-input>
           </a-col>
             <a-button type="primary" @click="synchronizationOne" icon="reload" style="margin-right:3%">单条同步</a-button>  
-            <a-button type="primary" @click="synchronization" icon="reload">全量同步</a-button>
+            <a-button type="primary" @click="synchronization" icon="reload" style="margin-right:3%">全量同步</a-button>
+            <a-button type="primary" @click="getManualList" icon="reload">手工匹配订单</a-button>
           
        </a-row>
         
@@ -134,6 +135,7 @@ c<template>
 
     <!-- 订单数据明细 抽屉 -->
     <orderDetail-drawer ref="orderDetailDrawer" :fatherList="getOrderList" @ok="modalFormOk"></orderDetail-drawer>
+    <manualModal ref="manualModal"></manualModal>
   </div>
   </a-spin>
 </template>
@@ -143,11 +145,12 @@ import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import JEllipsis from '@/components/jeecg/JEllipsis'
 import moment from 'moment'
 import OrderDetailDrawer from '@views/order/orderDetailDrawer.vue'
+import manualModal from '@views/order/manualModal.vue'
 import { orderList, syncy,oneSyncy } from '@api/document/order'
 export default {
   name: 'OrderList', // 【单证】 订单数据
   mixins: [JeecgListMixin],
-  components: { JEllipsis, moment, OrderDetailDrawer },
+  components: { JEllipsis, moment, OrderDetailDrawer,manualModal },
 
   data() {
     // let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} />
@@ -341,6 +344,12 @@ export default {
         }
       }
     },
+
+    //手工匹配订单
+    getManualList(){
+      this.$refs.manualModal.manualModVis = true
+      debugger
+    },
     // 查询按钮
     searchQuery() {
       this.queryParam.pageNo = ''