【装箱单】-【装箱单成衣】列表页：新增、编辑、详情

src/views/packing-list/packinglist-clothes/clothes-add.vue

@@ -1,578 +0,0 @@
-<template>
-  <!-- 新增成衣 -->
-  <a-card :bordered="false">
-    <!-- 主表信息 -->
-    <div class="table-page-search-wrapper">
-      <a-form layout="inline">
-        <a-row :gutter="24">
-          <a-col :md="6" :sm="8">
-            <a-form-item label="订单号">
-              <a-input placeholder="请输入订单号" v-model="clothesAdd.orderNum"></a-input>
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="款号">
-              <a-input placeholder="请输入款号" v-model="clothesAdd.styleNum"></a-input>
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="品名">
-              <a-input placeholder="请输入品名" v-model="clothesAdd.name"></a-input>
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="尺码范围">
-              <a-input placeholder="请输入尺码范围" v-model="clothesAdd.sizeRange"></a-input>
-              <!-- <a-select placeholder="请选择尺码范围">
-                <a-select-option value="">请选择</a-select-option>
-                <a-select-option value="0">客户1</a-select-option>
-                <a-select-option value="1">客户2</a-select-option>
-                <a-select-option value="2">客户3</a-select-option>
-              </a-select> -->
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="客户">
-              <a-input placeholder="请输入客户" v-model="clothesAdd.customer"></a-input>
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="集装箱代号">
-              <a-input placeholder="请输入集装箱代号" v-model="clothesAdd.containerCode"></a-input>
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="集装箱号">
-              <a-input placeholder="请输入集装箱号" v-model="clothesAdd.containerNo"></a-input>
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="备注">
-              <a-input placeholder="请输入备注" v-model="clothesAdd.note"></a-input>
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="成衣工厂">
-              <a-input placeholder="请输入成衣工厂" v-model="clothesAdd.clothesFactory"></a-input>
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="外销发票号">
-              <a-input placeholder="请输入外销发票号" v-model="clothesAdd.exportInvoiceNo"></a-input>
-            </a-form-item>
-          </a-col>
-
-          <a-col :md="6" :sm="8">
-            <a-form-item label="托书号">
-              <a-input placeholder="请输入托书号" v-model="clothesAdd.bookNum"></a-input>
-            </a-form-item>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-
-    <!--操作按钮区域 参照预装箱单 増行-->
-    <div class="table-operator">
-      <a-button type="primary" @click="referadvancePackingList" icon="ordered-list">参照预装箱单</a-button>
-      <a-button type="primary" @click="handleAddColumn" icon="plus" style="margin-left: 20px">増行</a-button>
-    </div>
-
-    <!-- table , y: 300 -->
-    <div>
-      <a-table
-        bordered
-        rowKey="id"
-        :columns="clothesAddColumns"
-        :data-source="clothesAddData"
-        :loading="loading"
-        :pagination="ipagination"
-        :scroll="{ x: 1500 }"
-        @change="handleTableChange"
-      >
-        <!-- 启始箱号 -->
-        <a-form-model
-          slot="inceptionBoxNo"
-          slot-scope="text, record"
-          :ref="record.index"
-          :model="record"
-          style="width:100%;height:40px"
-        >
-          <a-form-model-item prop="inceptionBoxNo">
-            <a-input style="width:100%" v-model="record.inceptionBoxNo" />
-          </a-form-model-item>
-        </a-form-model>
-
-        <!-- 结束箱号 -->
-        <a-form-model
-          slot="endBoxNo"
-          slot-scope="text, record"
-          :ref="record.index"
-          :model="record"
-          style="width:100%;height:40px"
-        >
-          <a-form-model-item prop="endBoxNo">
-            <a-input style="width:100%" v-model="record.endBoxNo" />
-          </a-form-model-item>
-        </a-form-model>
-
-        <!-- 件数/箱 输入框-->
-        <a-form-model
-          slot="packagesBox"
-          slot-scope="text, record"
-          :ref="record.index"
-          :model="record"
-          style="width:100%;height:40px"
-        >
-          <a-form-model-item prop="packagesBox">
-            <a-input style="width:100%" v-model="record.packagesBox" />
-          </a-form-model-item>
-        </a-form-model>
-
-        <!--箱数 输入框-->
-        <a-form-model
-          slot="boxes"
-          slot-scope="text, record"
-          :ref="record.index"
-          :model="record"
-          style="width:100%;height:40px"
-        >
-          <a-form-model-item prop="boxes">
-            <a-input style="width:100%" v-model="record.boxes" />
-          </a-form-model-item>
-        </a-form-model>
-
-        <!--净重/箱 输入框-->
-        <a-form-model
-          slot="suttle"
-          slot-scope="text, record"
-          :ref="record.index"
-          :model="record"
-          style="width:100%;height:40px"
-        >
-          <a-form-model-item prop="suttle">
-            <a-input style="width:100%" v-model="record.suttle" />
-          </a-form-model-item>
-        </a-form-model>
-
-        <!--毛重/箱 输入框-->
-        <a-form-model
-          slot="roughWeight"
-          slot-scope="text, record"
-          :ref="record.index"
-          :model="record"
-          style="width:100%;height:40px"
-        >
-          <a-form-model-item prop="roughWeight">
-            <a-input style="width:100%" v-model="record.roughWeight" />
-          </a-form-model-item>
-        </a-form-model>
-
-        <!--外箱长度 输入框-->
-        <a-form-model
-          slot="boxLength"
-          slot-scope="text, record"
-          :ref="record.index"
-          :model="record"
-          style="width:100%;height:40px"
-        >
-          <a-form-model-item prop="boxLength">
-            <a-input style="width:100%" v-model="record.boxLength" />
-          </a-form-model-item>
-        </a-form-model>
-
-        <!--外箱宽度 输入框-->
-        <a-form-model
-          slot="boxWidth"
-          slot-scope="text, record"
-          :ref="record.index"
-          :model="record"
-          style="width:100%;height:40px"
-        >
-          <a-form-model-item prop="boxWidth">
-            <a-input style="width:100%" v-model="record.boxWidth" />
-          </a-form-model-item>
-        </a-form-model>
-
-        <!--外箱高度 输入框-->
-        <a-form-model
-          slot="boxHeight"
-          slot-scope="text, record"
-          :ref="record.index"
-          :model="record"
-          style="width:100%;height:40px"
-        >
-          <a-form-model-item prop="boxHeight">
-            <a-input style="width:100%" v-model="record.boxHeight" />
-          </a-form-model-item>
-        </a-form-model>
-
-        <!-- 操作 -->
-        <span slot="operationSlot" slot-scope="text, record">
-          <a-popconfirm title="确定删除吗?" ok-text="是" cancel-text="否" @confirm="handleDelete(record.id)">
-            <a href="javascript:void(0);" style="color:red;">删除</a>
-          </a-popconfirm>
-          <a-divider type="vertical" />
-          <a @click="copy(record)">复制</a>
-        </span>
-      </a-table>
-    </div>
-
-    <!-- 保存 取消 -->
-    <a-row>
-      <a-col :md="24" :sm="12">
-        <span style="float: right;">
-          <a-button type="primary" @click="save" icon="save">保存</a-button>
-          <a-button type="primary" @click="backClothesList" icon="rollback" style="margin:0 10px;">取消</a-button>
-        </span>
-      </a-col>
-    </a-row>
-
-    <!-- 参照预装箱单 -->
-    <advancePackingList-modal ref="advancePackingListModal" :father="aa" @ok="modalFormOk"></advancePackingList-modal>
-  </a-card>
-</template>
-
-<script>
-import { JeecgListMixin } from '@/mixins/JeecgListMixin' // 分页等
-import JEllipsis from '@/components/jeecg/JEllipsis'
-import AdvancePackingListModal from '@views/pre-book/advancePackingListModal.vue'
-
-export default {
-  name: 'ClothesAdd', // 装箱单- 新增成衣
-  mixins: [JeecgListMixin], // 分页等
-  computed: {},
-  components: { AdvancePackingListModal, JEllipsis }, // 参照预装箱单 弹框
-  data() {
-    let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} /> // 省略
-
-    return {
-      // 表头
-      clothesAddColumns: [
-        {
-          title: '账套',
-          dataIndex: 'accountSet',
-          width: 160,
-          fixed: 'left',
-          className: 'replacecolor'
-        },
-        {
-          title: '成衣工厂',
-          dataIndex: 'clothesFactory',
-          width: 120,
-          fixed: 'left',
-          className: 'replacecolor'
-        },
-        {
-          title: 'HOD',
-          dataIndex: 'hod',
-          width: 120,
-          className: 'replacecolor'
-        },
-        {
-          title: 'STYLE NO.',
-          dataIndex: 'styleNo',
-          width: 120,
-          className: 'replacecolor'
-        },
-        {
-          title: 'PO NO.',
-          dataIndex: 'poNo',
-          width: 90,
-          className: 'replacecolor'
-        },
-
-        {
-          title: 'ITEM NO./SKU NO./UPC NO./PACKS CODE',
-          dataIndex: 'itemNo',
-          width: 340,
-          className: 'replacecolor'
-        },
-        {
-          title: '分销点/DC/LABEL',
-          dataIndex: 'dcLabel',
-          width: 200,
-          className: 'replacecolor'
-        },
-        {
-          title: 'S',
-          dataIndex: 's',
-          width: 90,
-          className: 'replacecolor'
-        },
-        {
-          title: 'M',
-          dataIndex: 'm',
-          width: 90,
-          className: 'replacecolor'
-        },
-        {
-          title: 'L',
-          dataIndex: 'l',
-          width: 90,
-          className: 'replacecolor'
-        },
-        {
-          title: 'XL',
-          dataIndex: 'xl',
-          width: 90,
-          className: 'replacecolor'
-        },
-        {
-          title: 'XXL',
-          dataIndex: 'xxl',
-          width: 90,
-          className: 'replacecolor'
-        },
-
-        {
-          title: '3XL',
-          dataIndex: '3xl',
-          width: 90,
-          className: 'replacecolor'
-        },
-
-        {
-          title: '启始箱号',
-          dataIndex: 'inceptionBoxNo',
-          scopedSlots: { customRender: 'inceptionBoxNo' },
-          width: 120,
-          className: 'replacecolor'
-        },
-
-        {
-          title: '结束箱号',
-          dataIndex: 'endBoxNo',
-          width: 120,
-          scopedSlots: { customRender: 'endBoxNo' },
-          className: 'replacecolor'
-        },
-
-        {
-          title: '颜色（中英文）',
-          dataIndex: 'colorChUsa',
-          width: 140,
-          className: 'replacecolor'
-        },
-        {
-          title: '配码',
-          dataIndex: 'configCode',
-          width: 120,
-          className: 'replacecolor'
-        },
-        {
-          title: '件数/箱',
-          dataIndex: 'packagesBox',
-          width: 120,
-          scopedSlots: { customRender: 'packagesBox' },
-          className: 'replacecolor'
-        },
-        {
-          title: '箱数',
-          dataIndex: 'boxes',
-          width: 120,
-          scopedSlots: { customRender: 'boxes' },
-          className: 'replacecolor'
-        },
-
-        {
-          title: '总件数',
-          dataIndex: 'totalPackagesNum',
-          width: 90,
-          className: 'replacecolor'
-        },
-        {
-          title: '净重/箱',
-          dataIndex: 'suttle',
-          width: 120,
-          scopedSlots: { customRender: 'suttle' },
-          className: 'replacecolor'
-        },
-        {
-          title: '总净重',
-          dataIndex: 'totalSuttle',
-          width: 90,
-          className: 'replacecolor'
-        },
-        {
-          title: '毛重/箱',
-          dataIndex: 'roughWeight',
-          width: 120,
-          scopedSlots: { customRender: 'roughWeight' },
-          className: 'replacecolor'
-        },
-        {
-          title: '总毛重',
-          dataIndex: 'totalRoughWeigh',
-          width: 90,
-          className: 'replacecolor'
-        },
-        {
-          title: '外箱长度',
-          dataIndex: 'boxLength',
-          width: 120,
-          scopedSlots: { customRender: 'boxLength' },
-          className: 'replacecolor'
-        },
-        {
-          title: '外箱宽度',
-          dataIndex: 'boxWidth',
-          width: 120,
-          scopedSlots: { customRender: 'boxWidth' },
-          className: 'replacecolor'
-        },
-        {
-          title: '外箱高度',
-          dataIndex: 'boxHeight',
-          width: 120,
-          scopedSlots: { customRender: 'boxHeight' },
-          className: 'replacecolor'
-        },
-        {
-          title: '总体积',
-          dataIndex: 'totalVolume',
-          width: 120,
-          className: 'replacecolor'
-        },
-        {
-          title: '净净重',
-          dataIndex: 'netNetWeight',
-          width: 120,
-          className: 'replacecolor'
-        },
-        {
-          title: '单价',
-          dataIndex: 'price',
-          width: 120,
-          className: 'replacecolor'
-        },
-        {
-          title: '总价',
-          dataIndex: 'totalPrices',
-          width: 120,
-          className: 'replacecolor'
-        },
-        {
-          title: '备注',
-          dataIndex: 'note',
-          width: 140,
-          customRender: t => ellipsis(t),
-          fixed: 'right',
-          className: 'replacecolor'
-        },
-        {
-          title: '操作',
-          dataIndex: 'operation',
-          scopedSlots: { customRender: 'operationSlot' },
-          width: 160,
-          fixed: 'right',
-          className: 'replacecolor'
-        }
-      ],
-      clothesAddData: [{}, {}, {}],
-      loading: false, // 表格加载
-      clothesAdd: []
-    }
-  },
-  created() {},
-  methods: {
-    // 参照预装箱单
-    referadvancePackingList() {
-      console.log('打开参照订单数据')
-      // 打开订单数据弹框
-      this.$refs.advancePackingListModal.advancePackingListModVis = true
-    },
-    // 増行
-    handleAddColumn() {
-      console.log('増行')
-
-      const addrow = {
-        accountSet: '',
-        clothesFactory: '',
-        hod: '',
-        styleNo: '',
-        poNo: '',
-        itemNo: '',
-        dcLabel: '',
-        s: '',
-        m: '',
-        l: '',
-        xl: '',
-        xxl: '',
-        xxxl: '',
-        inceptionBoxNo: '',
-        endBoxNo: '',
-        colorChUsa: '',
-        configCode: '',
-        packagesBox: '',
-        boxes: '',
-        totalPackagesNum: '',
-        suttle: '',
-        totalSuttle: '',
-        roughWeight: '',
-        totalRoughWeigh: '',
-        boxLength: '',
-        boxWidth: '',
-        boxHeight: '',
-        totalVolume: '',
-        netNetWeight: '',
-        price: '',
-        totalPrices: '',
-        note: '',
-        operation: ''
-      }
-
-      this.clothesAddData.push(addrow)
-    },
-    // -------------------------------------
-    //  操作按钮 删除
-    handleDelete() {},
-    // 操作按钮 复制
-    copy() {},
-
-    // -------------------------------------
-
-    // 分页、排序、筛选变化时触发
-    // handleTableChange(pagination, filters, sorter) {
-    //   // console.log('当前页信息>>>>',pagination)
-    //   this.queryParam.pageNo = pagination.current
-    //   this.getAnnList()
-    // }
-
-    // 保存按钮
-    save() {},
-    // 取消
-    backClothesList() {
-      this.$router.push('clothes-list')
-    },
-    // -------------------------------------
-    aa() {} // father
-  },
-
-  mounted() {}
-}
-</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;
-}
-
-// /deep/ th.replacecolor {
-//   background-color: #ccc;
-// }
-</style>

src/views/packing-list/packinglist-clothes/clothes-list.vue

@@ -61,7 +61,7 @@
       <a-button type="primary" @click="openClothesAdd" icon="plus">新增</a-button>
     </div>
 
-    <!-- table  y: 300  rowKey="id"-->
+    <!-- table  rowKey="id"-->
     <div>
       <a-table
         bordered
@@ -131,8 +131,8 @@
             <a class="ant-dropdown-link">更多<a-icon type="down"/></a>
             <a-menu slot="overlay">
               <a-menu-item><a @click="submit(record)">提交</a></a-menu-item>
-              <a-menu-item><a @click="checke(record)">查看</a></a-menu-item>
-              <a-menu-item><a @click="edit(record)">修改</a></a-menu-item>
+              <a-menu-item><a @click="details(record)">详情</a></a-menu-item>
+              <a-menu-item><a @click="edit(record)">编辑</a></a-menu-item>
               <a-menu-item>
                 <a-popconfirm title="确定删除吗?" ok-text="是" cancel-text="否" @confirm="handleDelete(record.id)">
                   <a href="javascript:void(0);" style="color:red;">删除</a>
@@ -143,16 +143,24 @@
         </span>
       </a-table>
     </div>
+    <!-- 新增 抽屉 -->
+    <clothesAdd-drawer ref="clothesAddDrawer" :father="aa" @ok="modalFormOk"></clothesAdd-drawer>
+    <detailsClothes-drawer ref="detailsClothesDrawer" :father="bb" @ok="modalFormOk"></detailsClothes-drawer>
+    <editClothes-drawer ref="editClothesDrawer" :father="cc" @ok="modalFormOk"></editClothes-drawer>
   </a-card>
 </template>
 
 <script>
 import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import JEllipsis from '@/components/jeecg/JEllipsis'
+import clothesAddDrawer from '@views/packing-list/packinglist-clothes/clothesAddDrawer.vue'
+import detailsClothesDrawer from '@views/packing-list/packinglist-clothes/detailsClothesDrawer.vue'
+import editClothesDrawer from '@views/packing-list/packinglist-clothes/editClothesDrawer.vue'
+
 export default {
   name: 'ClothesList', // 装箱单-成衣列表
   mixins: [JeecgListMixin],
-  components: { JEllipsis },
+  components: { JEllipsis, clothesAddDrawer, detailsClothesDrawer, editClothesDrawer },
   data() {
     let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} /> // 省略
 
@@ -355,7 +363,9 @@ export default {
           className: 'replacecolor'
         }
       ],
+
       clothesListData: [{}, {}, {}],
+
       selectedRowKeys: [], // 勾选航
       loading: false, // 表格加载
 
@@ -380,44 +390,55 @@ export default {
     // this.getAdPaListClothes()
   },
   methods: {
-    // 第一行 推送
+    // 推送
     push() {},
     // 导入
     importData() {},
-    // 装箱单-成衣列表 -新增
+    // 新增
     openClothesAdd() {
-      this.$router.push('clothes-add')
+      console.log('新增-成衣')
+      this.$refs.clothesAddDrawer.visible = true
     },
-
-    // 第二行
+    // --------------------------------------
     // 查询按钮
     searchQuery() {
-      // this.getAnnList() // 渲染公告
+      // this.getAnnList() // 装箱单-成衣列表
     },
     searchReset() {
       // console.log('>>>>重置')
       this.queryParam = {}
       // this.getAnnList()
     },
+    // --------------------------------------
     // 操作 附件上传
     accessoryUpload() {},
     // 操作 提交
     submit() {},
-    // 操作 取消提交
-    cancelSubmit() {},
-    // 操作 查看
-    checke() {},
-    // 操作 修改
+    // 操作 详情
+    details(record) {
+      console.log('详情')
+      console.log('点击的record', record.id)
+      this.$refs.detailsClothesDrawer.visible = true
+    },
+    // 操作 编辑
+    edit(record) {
+      console.log('编辑')
+      this.$refs.editClothesDrawer.visible = true
+    },
+    // 操作 删除
     handleDelete() {},
-    // ============================
-
+    // --------------------------------------
     // ??
     modalFormOk() {},
     // 选中行
     onSelectChange(keys, rows) {
       this.selectedRowKeys = keys
       this.selectedRows = rows
-    }
+    },
+    // --------------------------------------
+    aa() {},
+    bb() {},
+    cc() {}
     // 分页、排序、筛选变化时触发
     // handleTableChange(pagination, filters, sorter) {
     //   // console.log('当前页信息>>>>',pagination)

src/views/packing-list/packinglist-clothes/clothesAddDrawer.vue

@@ -0,0 +1,577 @@
+<template>
+  <!-- 新增成衣 -->
+  <a-card :bordered="false">
+    <a-drawer
+      title="新增成衣"
+      width="89%"
+      placement="right"
+      :closable="true"
+      :visible="visible"
+      @close="handleCancel">
+      <!-- 主表信息 填写-->
+      <div class="table-page-search-wrapper">
+        <a-form-model layout="inline" ref="form" :model="clothesAdd" :rules="validatorRules">
+          <a-row :gutter="24">
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="订单号" prop="orderNum">
+                <a-input placeholder="请输入订单号" v-model="clothesAdd.orderNum"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="款号" prop="styleNum">
+                <a-input placeholder="请输入款号" v-model="clothesAdd.styleNum"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="品名" prop="name">
+                <a-input placeholder="请输入品名" v-model="clothesAdd.name"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="尺码范围" prop="sizeRange">
+                <a-input placeholder="请输入尺码范围" v-model="clothesAdd.sizeRange"></a-input>
+                <!-- <a-select placeholder="请选择尺码范围">
+                <a-select-option value="">请选择</a-select-option>
+                <a-select-option value="0">客户1</a-select-option>
+                <a-select-option value="1">客户2</a-select-option>
+                <a-select-option value="2">客户3</a-select-option>
+              </a-select> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="客户" prop="customer">
+                <a-input placeholder="请输入客户" v-model="clothesAdd.customer"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="集装箱代号" prop="containerCode">
+                <a-input placeholder="请输入集装箱代号" v-model="clothesAdd.containerCode"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="集装箱号" prop="containerNo">
+                <a-input placeholder="请输入集装箱号" v-model="clothesAdd.containerNo"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="备注" prop="note">
+                <a-input placeholder="请输入备注" v-model="clothesAdd.note"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="成衣工厂" prop="clothesFactory">
+                <a-input placeholder="请输入成衣工厂" v-model="clothesAdd.clothesFactory"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="外销发票号" prop="exportInvoiceNo">
+                <a-input placeholder="请输入外销发票号" v-model="clothesAdd.exportInvoiceNo"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="托书号" prop="bookNum">
+                <a-input placeholder="请输入托书号" v-model="clothesAdd.bookNum"></a-input>
+              </a-form-model-item>
+            </a-col>
+          </a-row>
+        </a-form-model>
+      </div>
+
+      <!--操作按钮区域 参照预装箱单 増行-->
+      <div class="table-operator">
+        <a-button type="primary" @click="referadvancePackingList" icon="ordered-list">参照预装箱单</a-button>
+        <a-button type="primary" @click="handleAddColumn" icon="plus" style="margin-left: 20px">増行</a-button>
+      </div>
+
+      <!-- 子表 :pagination="ipagination"  -->
+      <a-spin :spinning="confirmLoading">
+        <a-form-model ref="formRef" :rules="validatorRules">
+          <a-table
+            bordered
+            :row-key="record => record.id"
+            :columns="clothesAddColumns"
+            :data-source="clothesAddData"
+            :loading="loading"
+            :pagination="false"
+            :scroll="{ x: 1500 }"
+            @change="handleTableChange"
+          >
+            <!-- 启始箱号 输入框-->
+
+            <template slot="inceptionBoxNo" slot-scope="text, record, index">
+              <a-form-model-item prop="inceptionBoxNo" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.inceptionBoxNo" />
+              </a-form-model-item>
+            </template>
+
+            <!-- 结束箱号 输入框-->
+            <template slot="endBoxNo" slot-scope="text, record, index">
+              <a-form-model-item prop="endBoxNo" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.endBoxNo" />
+              </a-form-model-item>
+            </template>
+
+            <!-- 件数/箱 输入框-->
+
+            <template slot="packagesBox" slot-scope="text, record, index">
+              <a-form-model-item prop="packagesBox" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.packagesBox" />
+              </a-form-model-item>
+            </template>
+
+            <!--箱数 输入框-->
+            <template slot="boxes" slot-scope="text, record, index">
+              <a-form-model-item prop="boxes" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.boxes" />
+              </a-form-model-item>
+            </template>
+
+            <!--净重/箱 输入框-->
+            <template slot="suttle" slot-scope="text, record, index">
+              <a-form-model-item prop="suttle" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.suttle" />
+              </a-form-model-item>
+            </template>
+
+            <!--毛重/箱 输入框-->
+            <template slot="roughWeight" slot-scope="text, record, index">
+              <a-form-model-item prop="roughWeight" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.roughWeight" />
+              </a-form-model-item>
+            </template>
+
+            <!--外箱长度 输入框-->
+            <template slot="boxLength" slot-scope="text, record, index">
+              <a-form-model-item prop="boxLength" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.boxLength" />
+              </a-form-model-item>
+            </template>
+
+            <!--外箱宽度 输入框-->
+            <template slot="boxWidth" slot-scope="text, record, index">
+              <a-form-model-item prop="boxWidth" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.boxWidth" />
+              </a-form-model-item>
+            </template>
+
+            <!--外箱高度 输入框-->
+
+            <template slot="boxHeight" slot-scope="text, record, index">
+              <a-form-model-item prop="boxHeight" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.boxHeight" />
+              </a-form-model-item>
+            </template>
+
+            <!-- 操作 -->
+            <span slot="operationSlot" slot-scope="text, record">
+              <a-popconfirm title="确定删除吗?" ok-text="是" cancel-text="否" @confirm="handleDelete(record.id)">
+                <a href="javascript:void(0);" style="color:red;">删除</a>
+              </a-popconfirm>
+              <a-divider type="vertical" />
+              <a @click="copy(record)">复制</a>
+            </span>
+          </a-table>
+        </a-form-model>
+      </a-spin>
+
+      <!-- 页面底部提交取消 -->
+      <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="submitAdd">
+          提交
+        </a-button>
+      </div>
+    </a-drawer>
+
+    <!-- 参照预装箱单 -->
+    <advancePackingList-modal ref="advancePackingListModal" :father="aa" @ok="modalFormOk"></advancePackingList-modal>
+  </a-card>
+</template>
+
+<script>
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+import JEllipsis from '@/components/jeecg/JEllipsis'
+import AdvancePackingListModal from '@views/pre-book/advancePackingListModal.vue'
+
+export default {
+  name: 'ClothesAddDrawer', //  新增-装箱单 -成衣
+  mixins: [JeecgListMixin],
+  computed: {},
+  components: { AdvancePackingListModal, JEllipsis }, // 参照预装箱单 弹框
+  data() {
+    let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} />
+
+    return {
+      // 表头
+      clothesAddColumns: [
+        {
+          title: '账套',
+          dataIndex: 'accountSet',
+          width: 160,
+          fixed: 'left',
+          className: 'replacecolor'
+        },
+        {
+          title: '成衣工厂',
+          dataIndex: 'clothesFactory',
+          width: 120,
+          fixed: 'left',
+          className: 'replacecolor'
+        },
+        {
+          title: 'HOD',
+          dataIndex: 'hod',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: 'STYLE NO.',
+          dataIndex: 'styleNo',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: 'PO NO.',
+          dataIndex: 'poNo',
+          width: 90,
+          className: 'replacecolor'
+        },
+
+        {
+          title: 'ITEM NO./SKU NO./UPC NO./PACKS CODE',
+          dataIndex: 'itemNo',
+          width: 340,
+          className: 'replacecolor'
+        },
+        {
+          title: '分销点/DC/LABEL',
+          dataIndex: 'dcLabel',
+          width: 200,
+          className: 'replacecolor'
+        },
+        {
+          title: 'S',
+          dataIndex: 's',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'M',
+          dataIndex: 'm',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'L',
+          dataIndex: 'l',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'XL',
+          dataIndex: 'xl',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'XXL',
+          dataIndex: 'xxl',
+          width: 90,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '3XL',
+          dataIndex: '3xl',
+          width: 90,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '启始箱号',
+          dataIndex: 'inceptionBoxNo',
+          scopedSlots: { customRender: 'inceptionBoxNo' },
+          width: 120,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '结束箱号',
+          dataIndex: 'endBoxNo',
+          width: 120,
+          scopedSlots: { customRender: 'endBoxNo' },
+          className: 'replacecolor'
+        },
+
+        {
+          title: '颜色（中英文）',
+          dataIndex: 'colorChUsa',
+          width: 140,
+          className: 'replacecolor'
+        },
+        {
+          title: '配码',
+          dataIndex: 'configCode',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '件数/箱',
+          dataIndex: 'packagesBox',
+          width: 120,
+          scopedSlots: { customRender: 'packagesBox' },
+          className: 'replacecolor'
+        },
+        {
+          title: '箱数',
+          dataIndex: 'boxes',
+          width: 120,
+          scopedSlots: { customRender: 'boxes' },
+          className: 'replacecolor'
+        },
+
+        {
+          title: '总件数',
+          dataIndex: 'totalPackagesNum',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: '净重/箱',
+          dataIndex: 'suttle',
+          width: 120,
+          scopedSlots: { customRender: 'suttle' },
+          className: 'replacecolor'
+        },
+        {
+          title: '总净重',
+          dataIndex: 'totalSuttle',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: '毛重/箱',
+          dataIndex: 'roughWeight',
+          width: 120,
+          scopedSlots: { customRender: 'roughWeight' },
+          className: 'replacecolor'
+        },
+        {
+          title: '总毛重',
+          dataIndex: 'totalRoughWeigh',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: '外箱长度',
+          dataIndex: 'boxLength',
+          width: 120,
+          scopedSlots: { customRender: 'boxLength' },
+          className: 'replacecolor'
+        },
+        {
+          title: '外箱宽度',
+          dataIndex: 'boxWidth',
+          width: 120,
+          scopedSlots: { customRender: 'boxWidth' },
+          className: 'replacecolor'
+        },
+        {
+          title: '外箱高度',
+          dataIndex: 'boxHeight',
+          width: 120,
+          scopedSlots: { customRender: 'boxHeight' },
+          className: 'replacecolor'
+        },
+        {
+          title: '总体积',
+          dataIndex: 'totalVolume',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '净净重',
+          dataIndex: 'netNetWeight',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '单价',
+          dataIndex: 'price',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '总价',
+          dataIndex: 'totalPrices',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '备注',
+          dataIndex: 'note',
+          width: 140,
+          customRender: t => ellipsis(t),
+          fixed: 'right',
+          className: 'replacecolor'
+        },
+        {
+          title: '操作',
+          dataIndex: 'operation',
+          scopedSlots: { customRender: 'operationSlot' },
+          width: 160,
+          fixed: 'right',
+          className: 'replacecolor'
+        }
+      ],
+      clothesAddData: [{}, {}, {}],
+      loading: false, // 表格加载
+      clothesAdd: {},
+      visible: false,
+      confirmLoading: false,
+      validatorRules: {
+        orderNum: [{ required: true, message: '订单号不能为空', trigger: 'blur' }],
+        styleNum: [{ required: true, message: '款号不能为空', trigger: 'blur' }],
+        name: [{ required: true, message: '品名不能为空', trigger: 'blur' }]
+        // 待确定还有哪些必填信息
+      }
+      // dateFormat: 'YYYY-MM-DD'
+    }
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    // 参照预装箱单
+    referadvancePackingList() {
+      console.log('打开参照订单数据')
+      // 打开订单数据弹框
+      this.$refs.advancePackingListModal.advancePackingListModVis = true
+    },
+    // 増行
+    handleAddColumn() {
+      console.log('増行')
+      const addrow = {
+        accountSet: '',
+        clothesFactory: '',
+        hod: '',
+        styleNo: '',
+        poNo: '',
+        itemNo: '',
+        dcLabel: '',
+        s: '',
+        m: '',
+        l: '',
+        xl: '',
+        xxl: '',
+        xxxl: '',
+        inceptionBoxNo: '',
+        endBoxNo: '',
+        colorChUsa: '',
+        configCode: '',
+        packagesBox: '',
+        boxes: '',
+        totalPackagesNum: '',
+        suttle: '',
+        totalSuttle: '',
+        roughWeight: '',
+        totalRoughWeigh: '',
+        boxLength: '',
+        boxWidth: '',
+        boxHeight: '',
+        totalVolume: '',
+        netNetWeight: '',
+        price: '',
+        totalPrices: '',
+        note: '',
+        operation: ''
+      }
+      this.clothesAddData.push(addrow)
+    },
+
+    // -------------------------------------
+    // 操作 删除
+    handleDelete(id) {
+      console.log('id:', id)
+    },
+    // 操作按钮 复制
+    copy(record) {},
+    // -------------------------------------
+
+    // 抽屉 取消
+    handleCancel() {
+      console.log('点击抽屉取消')
+      this.close()
+    },
+    // 抽屉 提交
+    submitAdd() {
+      console.log('保存新增、刷新发运明细列表')
+      const that = this
+      // 触发表单验证
+      this.$refs.form.validate(valid => {
+        if (valid) {
+          that.confirmLoading = true
+        }
+      })
+      this.close()
+      // this.getShipmentList() // 刷新装箱单-成衣列表
+    },
+
+    // -------------------------------------
+    close() {
+      this.$emit('close')
+      this.visible = false
+      this.$refs.form.resetFields()
+    },
+    // - father------------------------------------
+    aa() {}
+
+    // 分页、排序、筛选变化时触发
+    // handleTableChange(pagination, filters, sorter) {
+    //   // console.log('当前页信息>>>>',pagination)
+    //   this.queryParam.pageNo = pagination.current
+    //   this.getAnnList()
+    // }'
+  }
+}
+</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;
+}
+
+// /deep/ th.replacecolor {
+//   background-color: #ccc;
+// }
+</style>

src/views/packing-list/packinglist-clothes/detailsClothesDrawer.vue

@@ -0,0 +1,383 @@
+<template>
+  <!-- 详情 装箱单-成衣 全部回显  -->
+  <a-card :bordered="false">
+    <a-drawer
+      title="详情"
+      width="89%"
+      placement="right"
+      :closable="true"
+      :visible="visible"
+      @close="handleCancel">
+      <!-- 主表信息 展示-->
+      <div class="table-page-search-wrapper">
+        <a-form-model layout="inline" ref="form" :model="clothesAdd">
+          <a-row :gutter="24">
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="订单号" prop="orderNum">
+                7394jhg
+                <!-- <a-input v-model="clothesAdd.orderNum"></a-input> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="款号" prop="styleNum">
+                736485
+                <!-- <a-input v-model="clothesAdd.styleNum"></a-input> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="品名" prop="name">
+                品种6253
+                <!-- <a-input v-model="clothesAdd.name"></a-input> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="尺码范围" prop="sizeRange">
+                S-3XL
+                <!-- <a-input v-model="clothesAdd.sizeRange"></a-input> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="客户" prop="customer">
+                客户2
+                <!-- <a-input v-model="clothesAdd.customer"></a-input> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="集装箱代号" prop="containerCode">
+                HY890
+                <!-- <a-input v-model="clothesAdd.containerCode"></a-input> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="集装箱号" prop="containerNo">
+                HY89087
+                <!-- <a-input v-model="clothesAdd.containerNo"></a-input> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="备注" prop="note">
+                务必按时发货，紧急
+                <!-- <a-input v-model="clothesAdd.note"></a-input> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="成衣工厂" prop="clothesFactory">
+                成衣工厂1
+                <!-- <a-input v-model="clothesAdd.clothesFactory"></a-input> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="外销发票号" prop="exportInvoiceNo">
+                12034
+                <!-- <a-input v-model="clothesAdd.exportInvoiceNo"></a-input> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="托书号" prop="bookNum">
+                jdkd3
+                <!-- <a-input v-model="clothesAdd.bookNum"></a-input> -->
+              </a-form-model-item>
+            </a-col>
+          </a-row>
+        </a-form-model>
+      </div>
+
+      <!-- 子表 :pagination="ipagination"  -->
+      <a-spin :spinning="confirmLoading">
+        <a-form-model ref="formRef">
+          <a-table
+            bordered
+            :row-key="record => record.id"
+            :columns="columns"
+            :data-source="data"
+            :loading="loading"
+            :pagination="false"
+            :scroll="{ x: 1500 }"
+            @change="handleTableChange"
+          >
+          </a-table>
+        </a-form-model>
+      </a-spin>
+    </a-drawer>
+  </a-card>
+</template>
+
+<script>
+import { JeecgListMixin } from '@/mixins/JeecgListMixin' // 分页等
+import JEllipsis from '@/components/jeecg/JEllipsis'
+
+export default {
+  name: 'DetailsClothesDrawer', //  详情 ---装箱单 -成衣
+  mixins: [JeecgListMixin],
+
+  components: { JEllipsis },
+  data() {
+    let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} /> // 省略
+
+    return {
+      // 表头
+      columns: [
+        {
+          title: '账套',
+          dataIndex: 'accountSet',
+          width: 160,
+          fixed: 'left',
+          className: 'replacecolor'
+        },
+        {
+          title: '成衣工厂',
+          dataIndex: 'clothesFactory',
+          width: 120,
+          fixed: 'left',
+          className: 'replacecolor'
+        },
+        {
+          title: 'HOD',
+          dataIndex: 'hod',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: 'STYLE NO.',
+          dataIndex: 'styleNo',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: 'PO NO.',
+          dataIndex: 'poNo',
+          width: 90,
+          className: 'replacecolor'
+        },
+
+        {
+          title: 'ITEM NO./SKU NO./UPC NO./PACKS CODE',
+          dataIndex: 'itemNo',
+          width: 340,
+          className: 'replacecolor'
+        },
+        {
+          title: '分销点/DC/LABEL',
+          dataIndex: 'dcLabel',
+          width: 200,
+          className: 'replacecolor'
+        },
+        {
+          title: 'S',
+          dataIndex: 's',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'M',
+          dataIndex: 'm',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'L',
+          dataIndex: 'l',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'XL',
+          dataIndex: 'xl',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'XXL',
+          dataIndex: 'xxl',
+          width: 90,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '3XL',
+          dataIndex: '3xl',
+          width: 90,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '启始箱号',
+          dataIndex: 'inceptionBoxNo',
+          // scopedSlots: { customRender: 'inceptionBoxNo' },
+          width: 120,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '结束箱号',
+          dataIndex: 'endBoxNo',
+          width: 120,
+          // scopedSlots: { customRender: 'endBoxNo' },
+          className: 'replacecolor'
+        },
+
+        {
+          title: '颜色（中英文）',
+          dataIndex: 'colorChUsa',
+          width: 140,
+          className: 'replacecolor'
+        },
+        {
+          title: '配码',
+          dataIndex: 'configCode',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '件数/箱',
+          dataIndex: 'packagesBox',
+          width: 120,
+          // scopedSlots: { customRender: 'packagesBox' },
+          className: 'replacecolor'
+        },
+        {
+          title: '箱数',
+          dataIndex: 'boxes',
+          width: 120,
+          // scopedSlots: { customRender: 'boxes' },
+          className: 'replacecolor'
+        },
+
+        {
+          title: '总件数',
+          dataIndex: 'totalPackagesNum',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: '净重/箱',
+          dataIndex: 'suttle',
+          width: 120,
+          // scopedSlots: { customRender: 'suttle' },
+          className: 'replacecolor'
+        },
+        {
+          title: '总净重',
+          dataIndex: 'totalSuttle',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: '毛重/箱',
+          dataIndex: 'roughWeight',
+          width: 120,
+          // scopedSlots: { customRender: 'roughWeight' },
+          className: 'replacecolor'
+        },
+        {
+          title: '总毛重',
+          dataIndex: 'totalRoughWeigh',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: '外箱长度',
+          dataIndex: 'boxLength',
+          width: 120,
+          // scopedSlots: { customRender: 'boxLength' },
+          className: 'replacecolor'
+        },
+        {
+          title: '外箱宽度',
+          dataIndex: 'boxWidth',
+          width: 120,
+          // scopedSlots: { customRender: 'boxWidth' },
+          className: 'replacecolor'
+        },
+        {
+          title: '外箱高度',
+          dataIndex: 'boxHeight',
+          width: 120,
+          // scopedSlots: { customRender: 'boxHeight' },
+          className: 'replacecolor'
+        },
+        {
+          title: '总体积',
+          dataIndex: 'totalVolume',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '净净重',
+          dataIndex: 'netNetWeight',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '单价',
+          dataIndex: 'price',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '总价',
+          dataIndex: 'totalPrices',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '备注',
+          dataIndex: 'note',
+          width: 140,
+          customRender: t => ellipsis(t),
+          fixed: 'right',
+          className: 'replacecolor'
+        }
+      ],
+      data: [{}, {}, {}],
+      loading: false,
+      clothesAdd: {},
+      visible: false,
+      confirmLoading: false
+      // dateFormat: 'YYYY-MM-DD'
+    }
+  },
+  created() {},
+  methods: {
+    // 抽屉 取消
+    handleCancel() {
+      console.log('抽屉取消')
+      this.close()
+    },
+
+    close() {
+      this.$emit('close')
+      this.visible = false
+    }
+  },
+  computed: {},
+  mounted() {}
+}
+</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;
+}
+
+// /deep/ th.replacecolor {
+//   background-color: #ccc;
+// }
+</style>

src/views/packing-list/packinglist-clothes/editClothesDrawer.vue

@@ -0,0 +1,581 @@
+<template>
+  <!-- 编辑成衣 需要回显信息  通过是否有id判断-->
+  <a-card :bordered="false">
+    <a-drawer
+      title="编辑"
+      width="89%"
+      placement="right"
+      :closable="true"
+      :visible="visible"
+      @close="handleCancel">
+      <!-- 主表信息 编辑-->
+      <div class="table-page-search-wrapper">
+        <a-form-model layout="inline" ref="form" :model="clothesAdd" :rules="validatorRules">
+          <a-row :gutter="24">
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="订单号" prop="orderNum">
+                <a-input placeholder="请输入订单号" v-model="clothesAdd.orderNum"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="款号" prop="styleNum">
+                <a-input placeholder="请输入款号" v-model="clothesAdd.styleNum"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="品名" prop="name">
+                <a-input placeholder="请输入品名" v-model="clothesAdd.name"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="尺码范围" prop="sizeRange">
+                <a-input placeholder="请输入尺码范围" v-model="clothesAdd.sizeRange"></a-input>
+                <!-- <a-select placeholder="请选择尺码范围">
+                <a-select-option value="">请选择</a-select-option>
+                <a-select-option value="0">客户1</a-select-option>
+                <a-select-option value="1">客户2</a-select-option>
+                <a-select-option value="2">客户3</a-select-option>
+              </a-select> -->
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="客户" prop="customer">
+                <a-input placeholder="请输入客户" v-model="clothesAdd.customer"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="集装箱代号" prop="containerCode">
+                <a-input placeholder="请输入集装箱代号" v-model="clothesAdd.containerCode"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="集装箱号" prop="containerNo">
+                <a-input placeholder="请输入集装箱号" v-model="clothesAdd.containerNo"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="备注" prop="note">
+                <a-input placeholder="请输入备注" v-model="clothesAdd.note"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="成衣工厂" prop="clothesFactory">
+                <a-input placeholder="请输入成衣工厂" v-model="clothesAdd.clothesFactory"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="外销发票号" prop="exportInvoiceNo">
+                <a-input placeholder="请输入外销发票号" v-model="clothesAdd.exportInvoiceNo"></a-input>
+              </a-form-model-item>
+            </a-col>
+
+            <a-col :md="6" :sm="8">
+              <a-form-model-item label="托书号" prop="bookNum">
+                <a-input placeholder="请输入托书号" v-model="clothesAdd.bookNum"></a-input>
+              </a-form-model-item>
+            </a-col>
+          </a-row>
+        </a-form-model>
+      </div>
+
+      <!--操作按钮区域 参照预装箱单 増行-->
+      <div class="table-operator">
+        <a-button type="primary" @click="referadvancePackingList" icon="ordered-list">参照预装箱单</a-button>
+        <a-button type="primary" @click="handleAddColumn" icon="plus" style="margin-left: 20px">増行</a-button>
+      </div>
+
+      <!-- 子表 :pagination="ipagination"  -->
+      <a-spin :spinning="confirmLoading">
+        <a-form-model ref="formRef" :rules="validatorRules">
+          <a-table
+            bordered
+            :row-key="record => record.id"
+            :columns="columns"
+            :data-source="data"
+            :loading="loading"
+            :pagination="false"
+            :scroll="{ x: 1500 }"
+            @change="handleTableChange"
+          >
+            <!-- 启始箱号 输入框-->
+
+            <template slot="inceptionBoxNo" slot-scope="text, record, index">
+              <a-form-model-item prop="inceptionBoxNo" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.inceptionBoxNo" />
+              </a-form-model-item>
+            </template>
+
+            <!-- 结束箱号 输入框-->
+            <template slot="endBoxNo" slot-scope="text, record, index">
+              <a-form-model-item prop="endBoxNo" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.endBoxNo" />
+              </a-form-model-item>
+            </template>
+
+            <!-- 件数/箱 输入框-->
+
+            <template slot="packagesBox" slot-scope="text, record, index">
+              <a-form-model-item prop="packagesBox" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.packagesBox" />
+              </a-form-model-item>
+            </template>
+
+            <!--箱数 输入框-->
+            <template slot="boxes" slot-scope="text, record, index">
+              <a-form-model-item prop="boxes" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.boxes" />
+              </a-form-model-item>
+            </template>
+
+            <!--净重/箱 输入框-->
+            <template slot="suttle" slot-scope="text, record, index">
+              <a-form-model-item prop="suttle" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.suttle" />
+              </a-form-model-item>
+            </template>
+
+            <!--毛重/箱 输入框-->
+            <template slot="roughWeight" slot-scope="text, record, index">
+              <a-form-model-item prop="roughWeight" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.roughWeight" />
+              </a-form-model-item>
+            </template>
+
+            <!--外箱长度 输入框-->
+            <template slot="boxLength" slot-scope="text, record, index">
+              <a-form-model-item prop="boxLength" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.boxLength" />
+              </a-form-model-item>
+            </template>
+
+            <!--外箱宽度 输入框-->
+            <template slot="boxWidth" slot-scope="text, record, index">
+              <a-form-model-item prop="boxWidth" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.boxWidth" />
+              </a-form-model-item>
+            </template>
+
+            <!--外箱高度 输入框-->
+
+            <template slot="boxHeight" slot-scope="text, record, index">
+              <a-form-model-item prop="boxHeight" :rules="rules.styleNum" required>
+                <a-input style="width:100%" type="text" v-model="record.boxHeight" />
+              </a-form-model-item>
+            </template>
+
+            <!-- 操作 -->
+            <span slot="operationSlot" slot-scope="text, record">
+              <a-popconfirm title="确定删除吗?" ok-text="是" cancel-text="否" @confirm="handleDelete(record.id)">
+                <a href="javascript:void(0);" style="color:red;">删除</a>
+              </a-popconfirm>
+              <a-divider type="vertical" />
+              <a @click="copy(record)">复制</a>
+            </span>
+          </a-table>
+        </a-form-model>
+      </a-spin>
+
+      <!-- 页面底部提交取消 -->
+      <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="submitEdit">
+          提交
+        </a-button>
+      </div>
+    </a-drawer>
+
+    <!-- 参照预装箱单 -->
+    <advancePackingList-modal ref="advancePackingListModal" :father="aa" @ok="modalFormOk"></advancePackingList-modal>
+  </a-card>
+</template>
+
+<script>
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+import JEllipsis from '@/components/jeecg/JEllipsis'
+import AdvancePackingListModal from '@views/pre-book/advancePackingListModal.vue'
+
+export default {
+  name: 'EditClothesDrawer', //  编辑-- 装箱单 -成衣
+  mixins: [JeecgListMixin],
+  computed: {},
+  components: { AdvancePackingListModal, JEllipsis }, // 参照预装箱单 弹框
+  data() {
+    let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} />
+
+    return {
+      // 表头
+      columns: [
+        {
+          title: '账套',
+          dataIndex: 'accountSet',
+          width: 160,
+          fixed: 'left',
+          className: 'replacecolor'
+        },
+        {
+          title: '成衣工厂',
+          dataIndex: 'clothesFactory',
+          width: 120,
+          fixed: 'left',
+          className: 'replacecolor'
+        },
+        {
+          title: 'HOD',
+          dataIndex: 'hod',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: 'STYLE NO.',
+          dataIndex: 'styleNo',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: 'PO NO.',
+          dataIndex: 'poNo',
+          width: 90,
+          className: 'replacecolor'
+        },
+
+        {
+          title: 'ITEM NO./SKU NO./UPC NO./PACKS CODE',
+          dataIndex: 'itemNo',
+          width: 340,
+          className: 'replacecolor'
+        },
+        {
+          title: '分销点/DC/LABEL',
+          dataIndex: 'dcLabel',
+          width: 200,
+          className: 'replacecolor'
+        },
+        {
+          title: 'S',
+          dataIndex: 's',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'M',
+          dataIndex: 'm',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'L',
+          dataIndex: 'l',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'XL',
+          dataIndex: 'xl',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: 'XXL',
+          dataIndex: 'xxl',
+          width: 90,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '3XL',
+          dataIndex: '3xl',
+          width: 90,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '启始箱号',
+          dataIndex: 'inceptionBoxNo',
+          scopedSlots: { customRender: 'inceptionBoxNo' },
+          width: 120,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '结束箱号',
+          dataIndex: 'endBoxNo',
+          width: 120,
+          scopedSlots: { customRender: 'endBoxNo' },
+          className: 'replacecolor'
+        },
+
+        {
+          title: '颜色（中英文）',
+          dataIndex: 'colorChUsa',
+          width: 140,
+          className: 'replacecolor'
+        },
+        {
+          title: '配码',
+          dataIndex: 'configCode',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '件数/箱',
+          dataIndex: 'packagesBox',
+          width: 120,
+          scopedSlots: { customRender: 'packagesBox' },
+          className: 'replacecolor'
+        },
+        {
+          title: '箱数',
+          dataIndex: 'boxes',
+          width: 120,
+          scopedSlots: { customRender: 'boxes' },
+          className: 'replacecolor'
+        },
+
+        {
+          title: '总件数',
+          dataIndex: 'totalPackagesNum',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: '净重/箱',
+          dataIndex: 'suttle',
+          width: 120,
+          scopedSlots: { customRender: 'suttle' },
+          className: 'replacecolor'
+        },
+        {
+          title: '总净重',
+          dataIndex: 'totalSuttle',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: '毛重/箱',
+          dataIndex: 'roughWeight',
+          width: 120,
+          scopedSlots: { customRender: 'roughWeight' },
+          className: 'replacecolor'
+        },
+        {
+          title: '总毛重',
+          dataIndex: 'totalRoughWeigh',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: '外箱长度',
+          dataIndex: 'boxLength',
+          width: 120,
+          scopedSlots: { customRender: 'boxLength' },
+          className: 'replacecolor'
+        },
+        {
+          title: '外箱宽度',
+          dataIndex: 'boxWidth',
+          width: 120,
+          scopedSlots: { customRender: 'boxWidth' },
+          className: 'replacecolor'
+        },
+        {
+          title: '外箱高度',
+          dataIndex: 'boxHeight',
+          width: 120,
+          scopedSlots: { customRender: 'boxHeight' },
+          className: 'replacecolor'
+        },
+        {
+          title: '总体积',
+          dataIndex: 'totalVolume',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '净净重',
+          dataIndex: 'netNetWeight',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '单价',
+          dataIndex: 'price',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '总价',
+          dataIndex: 'totalPrices',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '备注',
+          dataIndex: 'note',
+          width: 140,
+          customRender: t => ellipsis(t),
+          fixed: 'right',
+          className: 'replacecolor'
+        },
+        {
+          title: '操作',
+          dataIndex: 'operation',
+          scopedSlots: { customRender: 'operationSlot' },
+          width: 160,
+          fixed: 'right',
+          className: 'replacecolor'
+        }
+      ],
+      data: [{}, {}, {}],
+      loading: false, // 表格加载
+      clothesAdd: {},
+      visible: false,
+      confirmLoading: false,
+      validatorRules: {
+        orderNum: [{ required: true, message: '订单号不能为空', trigger: 'blur' }],
+        styleNum: [{ required: true, message: '款号不能为空', trigger: 'blur' }],
+        name: [{ required: true, message: '品名不能为空', trigger: 'blur' }]
+        // 待确定还有哪些必填信息
+      }
+      // dateFormat: 'YYYY-MM-DD'
+    }
+  },
+  created() {},
+  methods: {
+    // 参照预装箱单
+    referadvancePackingList() {
+      console.log('打开参照订单数据')
+      // 打开订单数据弹框
+      this.$refs.advancePackingListModal.advancePackingListModVis = true
+    },
+
+    // 増行
+    handleAddColumn() {
+      console.log('増行')
+      const addrow = {
+        accountSet: '',
+        clothesFactory: '',
+        hod: '',
+        styleNo: '',
+        poNo: '',
+        itemNo: '',
+        dcLabel: '',
+        s: '',
+        m: '',
+        l: '',
+        xl: '',
+        xxl: '',
+        xxxl: '',
+        inceptionBoxNo: '',
+        endBoxNo: '',
+        colorChUsa: '',
+        configCode: '',
+        packagesBox: '',
+        boxes: '',
+        totalPackagesNum: '',
+        suttle: '',
+        totalSuttle: '',
+        roughWeight: '',
+        totalRoughWeigh: '',
+        boxLength: '',
+        boxWidth: '',
+        boxHeight: '',
+        totalVolume: '',
+        netNetWeight: '',
+        price: '',
+        totalPrices: '',
+        note: '',
+        operation: ''
+      }
+      this.data.push(addrow)
+    },
+
+    // -------------------------------------
+    // 操作 删除
+    handleDelete(id) {
+      console.log('id:', id)
+    },
+    // 操作按钮 复制
+    copy(record) {},
+
+    // -------------------------------------
+    // 抽屉 取消
+    handleCancel() {
+      console.log('抽屉取消')
+      this.close()
+    },
+    // 抽屉 提交
+    submitEdit() {
+      console.log('保存编辑、刷新装箱单-成衣列表')
+      const that = this
+      // 触发表单验证
+      this.$refs.form.validate(valid => {
+        if (valid) {
+          that.confirmLoading = true
+        }
+      })
+      this.close()
+      // this.getShipmentList() // 刷新 装箱单-成衣
+    },
+
+    close() {
+      this.$emit('close')
+      this.visible = false
+      this.$refs.form.resetFields()
+    },
+
+    // -------------------------------------
+
+    // 分页、排序、筛选变化时触发
+    // handleTableChange(pagination, filters, sorter) {
+    //   // console.log('当前页信息>>>>',pagination)
+    //   this.queryParam.pageNo = pagination.current
+    //   this.getAnnList()
+    // }'
+
+    // - father------------------------------------
+    aa() {}
+  },
+
+  mounted() {}
+}
+</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;
+}
+
+// /deep/ th.replacecolor {
+//   background-color: #ccc;
+// }
+</style>

src/views/reportForms/fabric-loss-table.vue

@@ -263,7 +263,7 @@
         <h6 class="table-title">备注信息 1</h6>
         <div class="noteDetail">
           <a-input type="textarea" v-model="noteOne" placeholder="请输入备注 1" style="minHeight:100px;" />
-          <a-button type="primary" @click="savenoteOne">保存</a-button>
+          <a-button type="primary" @click="saveNoteOne">保存</a-button>
         </div>
       </div>
 
@@ -272,7 +272,7 @@
         <h6 class="table-title">备注信息 2</h6>
         <div class="noteDetail">
           <a-input type="textarea" v-model="noteTwo" placeholder="请输入备注 2" style="minHeight:100px;" />
-          <a-button type="primary" @click="savenoteTwo">保存</a-button>
+          <a-button type="primary" @click="saveNoteTwo">保存</a-button>
         </div>
       </div>
 
@@ -821,11 +821,11 @@ export default {
     },
     // ---------------------------------
     // 保存备注 1
-    savenoteOne() {
+    saveNoteOne() {
       console.log('保存 备注 1')
     },
     // 保存备注 2
-    savenoteTwo() {
+    saveNoteTwo() {
       console.log('保存 备注 2')
     },
 

src/views/shipment-details/addShipDetDrawer.vue

@@ -12,7 +12,6 @@
       <!-- 主表信息 填写-->
       <div class="table-page-search-wrapper">
         <a-form-model layout="inline" ref="form" :model="addShipDet" :rules="validatorRules">
-          <!-- 主表信息 填写-->
           <a-row :gutter="24">
             <a-col :md="6" :sm="8">
               <a-form-model-item label="单据号" prop="orderNum">
@@ -74,17 +73,16 @@
         <a-button type="primary" @click="handleAddColumn" icon="plus" style="margin-left: 20px">増行</a-button>
       </div>
 
-      <!-- 子表  -->
+      <!-- 子表  :pagination="ipagination" -->
       <a-spin :spinning="confirmLoading">
-        <a-form-model ref="formRef" :model="form" :rules="validatorRules">
+        <a-form-model ref="formRef" :rules="validatorRules">
           <a-table
             bordered
-            rowKey="id"
-            size="middle"
+            :row-key="record => record.id"
             :columns="columns"
             :data-source="form.data"
             :loading="loading"
-            :pagination="ipagination"
+            :pagination="fasle"
             :scroll="{ x: 1500 }"
             @change="handleTableChange"
           >
@@ -399,20 +397,18 @@ export default {
         }
       ],
       // 子表数据
-      form: {
-        data: [
-          {
-            orderNum: 'AA002200001',
-            smallPo: '008',
-            // shipQuantity: '',
-            // isTC: '',
-            paymentClause: '定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%'
-          },
-          {}
-        ]
-      },
+      data: [
+        {
+          orderNum: 'AA002200001',
+          smallPo: '008',
+          // shipQuantity: '',
+          // isTC: '',
+          paymentClause: '定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%'
+        },
+        {}
+      ],
 
-      addShipDet: [], // 新增发运明细
+      addShipDet: {}, // 新增发运明细
       visible: false,
       confirmLoading: false,
       dateFormat: 'YYYY-MM-DD',

src/views/shipment-details/detailsShipDetDrawer.vue

@@ -1,5 +1,5 @@
 <template>
-  <!-- 详情 发运明细 -->
+  <!-- 详情 发运明细 全部回显-->
   <a-card :bordered="false">
     <a-drawer
       title="详情"
@@ -8,132 +8,86 @@
       :closable="true"
       :visible="visible"
       @close="handleCancel">
-      <!-- 主表信息 填写-->
+      <!-- 主表信息 展示-->
       <div class="table-page-search-wrapper">
         <a-form-model layout="inline" ref="form" :model="detailsShipDet">
           <!-- 主表信息 填写-->
           <a-row :gutter="24">
             <a-col :md="6" :sm="8">
               <a-form-model-item label="单据号" prop="orderNum">
-                <a-input v-model="detailsShipDet.orderNum"></a-input>
+                <!-- <a-input v-model="detailsShipDet.orderNum"></a-input> -->
+                132fr34
               </a-form-model-item>
             </a-col>
 
             <a-col :md="6" :sm="8">
               <a-form-model-item label="单据日期" prop="billDate">
-                <a-date-picker :format="dateFormat" style="width:100%;" v-model="detailsShipDet.billDate" />
+                2022-04-21
+                <!-- <a-date-picker :format="dateFormat" style="width:100%;" v-model="detailsShipDet.billDate" /> -->
               </a-form-model-item>
             </a-col>
 
             <a-col :md="6" :sm="8">
               <a-form-model-item label="客户" prop="customer">
-                <a-input placeholder="请输入客户" v-model="detailsShipDet.customer"></a-input>
+                chenc
+                <!-- <a-input v-model="detailsShipDet.customer"></a-input> -->
               </a-form-model-item>
             </a-col>
 
             <a-col :md="6" :sm="8">
               <a-form-model-item label="预发货日期" prop="scheduledShipDate">
-                <a-date-picker :format="dateFormat" style="width:100%;" v-model="detailsShipDet.scheduledShipDate" />
+                2022-04-28
+                <!-- <a-date-picker :format="dateFormat" style="width:100%;" v-model="detailsShipDet.scheduledShipDate" /> -->
               </a-form-model-item>
             </a-col>
 
             <a-col :md="6" :sm="8">
               <a-form-model-item label="预完工日期" prop="scheduledDoneDate">
-                <a-date-picker :format="dateFormat" style="width:100%;" v-model="detailsShipDet.scheduledDoneDate" />
+                2022-04-26
+                <!-- <a-date-picker :format="dateFormat" style="width:100%;" v-model="detailsShipDet.scheduledDoneDate" /> -->
               </a-form-model-item>
             </a-col>
 
             <a-col :md="18" :sm="18">
               <a-form-model-item label="备注" prop="note">
-                <a-input v-model="detailsShipDet.note"></a-input>
+                务必按时发货，紧急
+                <!-- <a-input v-model="detailsShipDet.note"></a-input> -->
               </a-form-model-item>
             </a-col>
           </a-row>
         </a-form-model>
       </div>
 
-      <!-- 子表  -->
+      <!-- 子表 :model="form" -->
       <a-spin :spinning="confirmLoading">
-        <a-form-model ref="formRef" :model="form">
+        <a-form-model ref="formRef">
           <a-table
             bordered
             rowKey="id"
             size="middle"
             :columns="columns"
-            :data-source="form.data"
+            :data-source="data"
             :loading="loading"
             :pagination="ipagination"
             :scroll="{ x: 1500 }"
             @change="handleTableChange"
           >
-            <!-- 款号 输入框 -->
-            <!-- <template slot="styleNum" slot-scope="text, record, index">
-              <a-form-model-item prop="styleNum" :rules="rules.styleNum">
-                <a-input style="width:100%" type="text" v-model="record.styleNum" />
-              </a-form-model-item>
-            </template> -->
-
-            <!-- 发货数量 -->
-            <!-- <template slot="shipQuantity" slot-scope="text, record, index">
-              <a-form-model-item prop="styleNum" :rules="rules.shipQuantity">
-                <a-input style="width:100%" type="text" v-model="record.shipQuantity" />
-              </a-form-model-item>
-            </template> -->
-
-            <!-- 是否TC功能 -->
-            <!-- <template slot="isTC" slot-scope="text, record, index">
-              <a-form-model-item prop="isEnable" :rules="rules.isTC">
-                <a-select v-model="record.isTC">
-                  <a-select-option :value="1">是</a-select-option>
-                  <a-select-option :value="2">否</a-select-option>
-                </a-select>
-              </a-form-model-item>
-            </template> -->
-
-            <!-- 物料成分 -->
-            <!-- <template slot="materialComposition" slot-scope="text, record, index">
-              <a-form-model-item prop="styleNum" :rules="rules.materialComposition">
-                <a-input style="width:100%" type="text" v-model="record.materialComposition" />
-              </a-form-model-item>
-            </template> -->
           </a-table>
         </a-form-model>
       </a-spin>
-
-      <!-- 页面底部保存取消 -->
-      <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="submitAdd">
-          提交
-        </a-button> -->
-      </div>
     </a-drawer>
   </a-card>
 </template>
 
 <script>
-import { JeecgListMixin } from '@/mixins/JeecgListMixin' // 分页等
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import JEllipsis from '@/components/jeecg/JEllipsis'
 import moment from 'moment'
 
 export default {
   name: 'DetailsShipDetDrawer', // 详情 发运明细 抽屉
-  mixins: [JeecgListMixin], // 分页等
-  components: { JEllipsis, moment }, // 参照订单数据 弹框 ReferOrderDataModal
+  mixins: [JeecgListMixin],
+  components: { JEllipsis, moment },
   data() {
     let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} /> // 省略
     return {
@@ -157,7 +111,7 @@ export default {
         {
           title: '款号',
           dataIndex: 'styleNum',
-          scopedSlots: { customRender: 'styleNum' },
+          // scopedSlots: { customRender: 'styleNum' },
           fixed: 'left',
           width: 180,
           className: 'replacecolor'
@@ -219,7 +173,7 @@ export default {
         {
           title: '发货数量',
           dataIndex: 'shipQuantity',
-          scopedSlots: { customRender: 'shipQuantity' },
+          // scopedSlots: { customRender: 'shipQuantity' },
           width: 120,
           className: 'replacecolor'
         },
@@ -227,13 +181,13 @@ export default {
           title: '是否TC功能',
           dataIndex: 'isTC',
           width: 90,
-          scopedSlots: { customRender: 'isTC' },
+          // scopedSlots: { customRender: 'isTC' },
           className: 'replacecolor'
         },
         {
           title: '物料成分',
           dataIndex: 'materialComposition',
-          scopedSlots: { customRender: 'materialComposition' },
+          // scopedSlots: { customRender: 'materialComposition' },
           width: 140,
           className: 'replacecolor'
         },
@@ -355,28 +309,25 @@ export default {
           className: 'replacecolor'
         }
       ],
-      form: {
-        data: [
-          {
-            orderNum: 'AA002200001',
-            smallPo: '008',
-            // shipQuantity: '',
-            // isTC: '',
-            paymentClause: '定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%'
-          },
-          {}
-        ]
-      },
 
-      detailsShipDet: [], // 新增发运明细
+      data: [
+        {
+          orderNum: 'AA002200001',
+          smallPo: '008',
+          // shipQuantity: '',
+          // isTC: '',
+          paymentClause: '定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%'
+        },
+        {}
+      ],
+
+      detailsShipDet: [], // 详情 发运明细
       visible: false,
       confirmLoading: false,
       dateFormat: 'YYYY-MM-DD'
     }
   },
-  created() {
-    // this.getShipmentList() // 发运明细列表
-  },
+  created() {},
 
   methods: {
     // 抽屉 取消
@@ -387,15 +338,7 @@ export default {
     close() {
       this.$emit('close')
       this.visible = false
-      this.$refs.form.resetFields()
     }
-    // --------------------------------------
-    // 分页、排序、筛选变化时触发
-    // handleTableChange(pagination, filters, sorter) {
-    //   // console.log('当前页信息>>>>',pagination)
-    //   this.queryParam.pageNo = pagination.current
-    //   // this.getAnnList()
-    // },
   },
   computed: {},
   mounted() {}

src/views/shipment-details/editShipDetDrawer.vue

@@ -8,7 +8,7 @@
       :closable="true"
       :visible="visible"
       @close="handleCancel">
-      <!-- 主表信息 填写-->
+      <!-- 主表信息 编辑-->
       <div class="table-page-search-wrapper">
         <a-form-model layout="inline" ref="form" :model="editShipDet" :rules="validatorRules">
           <!-- 主表信息 填写-->
@@ -397,18 +397,17 @@ export default {
           className: 'replacecolor'
         }
       ],
-      form: {
-        data: [
-          {
-            orderNum: 'AA002200001',
-            smallPo: '008',
-            // shipQuantity: '',
-            // isTC: '',
-            paymentClause: '定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%'
-          },
-          {}
-        ]
-      },
+
+      data: [
+        {
+          orderNum: 'AA002200001',
+          smallPo: '008',
+          // shipQuantity: '',
+          // isTC: '',
+          paymentClause: '定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%定金达到50%'
+        },
+        {}
+      ],
 
       editShipDet: [], // 编辑发运明细
       visible: false,
@@ -429,7 +428,7 @@ export default {
     }
   },
   created() {
-    // this.getShipmentList() // 发运明细列表
+    // this.getShipmentList() // 刷新发运明细列表
   },
 
   methods: {
@@ -505,7 +504,7 @@ export default {
         }
       })
       this.close()
-      // this.getShipmentList() // 刷新发运明细列表
+      // this.getShipmentList() // 刷新 发运明细列表
     },
     close() {
       this.$emit('close')