报表-生产进度报表-物料卡中补充【装箱单-面料】两个页面

src/api/reportForms/pro-progress-report.js

@@ -10,6 +10,13 @@ const proProgressList = params => getAction('/productionScheduleReport/productio
 // 出入库详细数据  --- 弹框
 // const outInDetailData = params => getAction('', params)
 
+// 物料卡  装箱单-面料列表
+// const packinglistFabricsList = params => getAction('', params)
+
+//  订单号   装箱单-面料
+// const detailsFabric = params => getAction('', params)
+
+
 // 获取图片
 const getImg = params => getAction('/productionScheduleReport/productionSchedule/selectPicture', params)
 

src/views/order/orderDetailDrawer.vue

@@ -150,12 +150,14 @@
       </a-table>
     </a-card>
   </a-drawer>
+  <!--  -->
 </template>
 
 <script>
 import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import JEllipsis from '@/components/jeecg/JEllipsis'
 import moment from 'moment'
+
 import { orderByNum } from '@api/document/order'
 
 export default {
@@ -260,12 +262,7 @@ export default {
     },
     // 分页变化时触发
     handleTableChange(pagination, filters, sorter) {
-      console.log('分页器信息', pagination)
-      if (Object.keys(sorter).length > 0) {
-        this.isorter.column = sorter.field
-        this.isorter.order = sorter.order == 'ascend' ? 'asc' : 'desc'
-      }
-      console.log('点击页', pagination.current)
+      // console.log('分页器信息', pagination)
       this.pagination.pageNo = pagination.current
       this.getOrderChild()
     }

src/views/packing-list/packinglist-fabrics/addFabricDrawer.vue

@@ -1,13 +1,7 @@
 <template>
   <!-- 新增面料 装箱单  -->
   <div id="addFabricDrawer">
-    <a-drawer
-      title="新增面料"
-      width="89%"
-      placement="right"
-      :closable="true"
-      :visible="visible"
-      @close="handleCancel">
+    <a-drawer title="新增面料" width="89%" placement="right" :closable="true" :visible="visible" @close="handleCancel">
       <!-- 主表信息 填写-->
       <a-card :bordered="true">
         <div class="table-page-search-wrapper">
@@ -329,6 +323,12 @@ export default {
           width: 120,
           className: 'replacecolor'
         },
+        {
+          title: '手册纱占比%',
+          dataIndex: 'aa',
+          width: 120,
+          className: 'replacecolor'
+        },
         {
           title: '柜号',
           dataIndex: 'containerNum',

src/views/packing-list/packinglist-fabrics/detailsFabricDrawer.vue

@@ -1,14 +1,8 @@
 <template>
   <!-- 详情 回显所有信息 面料 装箱单  -->
-  <div id="addFabricDrawer">
-    <a-drawer
-      title="详情"
-      width="89%"
-      placement="right"
-      :closable="true"
-      :visible="visible"
-      @close="handleCancel">
-      <!-- 主表信息 填写-->
+  <div id="detailsFabricDrawer">
+    <a-drawer title="详情" width="89%" placement="right" :closable="true" :visible="visible" @close="handleCancel">
+      <!-- 主表信息 回显-->
       <a-card :bordered="true">
         <div class="table-page-search-wrapper">
           <a-form-model layout="inline" ref="form" :model="editFabric">
@@ -120,7 +114,7 @@ import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import JEllipsis from '@/components/jeecg/JEllipsis'
 
 export default {
-  name: 'AddFabricDrawer', //  详情 装箱单 -面料
+  name: 'DetailsFabricDrawer', //  详情 装箱单 -面料
   mixins: [JeecgListMixin],
   computed: {},
   components: { JEllipsis },
@@ -292,6 +286,12 @@ export default {
           width: 120,
           className: 'replacecolor'
         },
+        {
+          title: '手册纱占比%',
+          dataIndex: 'aa',
+          width: 120,
+          className: 'replacecolor'
+        },
         {
           title: '柜号',
           dataIndex: 'containerNum',

src/views/packing-list/packinglist-fabrics/editFabricDrawer.vue

@@ -1,13 +1,7 @@
 <template>
   <!-- 编辑 回显 可编辑的 面料 装箱单  -->
   <div id="addFabricDrawer">
-    <a-drawer
-      title="编辑"
-      width="89%"
-      placement="right"
-      :closable="true"
-      :visible="visible"
-      @close="handleCancel">
+    <a-drawer title="编辑" width="89%" placement="right" :closable="true" :visible="visible" @close="handleCancel">
       <!-- 主表信息 填写-->
       <a-card :bordered="true">
         <div class="table-page-search-wrapper">
@@ -329,6 +323,12 @@ export default {
           width: 120,
           className: 'replacecolor'
         },
+        {
+          title: '手册纱占比%',
+          dataIndex: 'aa',
+          width: 120,
+          className: 'replacecolor'
+        },
         {
           title: '柜号',
           dataIndex: 'containerNum',

src/views/reportForms/pro-progress-report/detailsFabricDrawer.vue

@@ -0,0 +1,430 @@
+<template>
+  <!-- 详情 装箱单-面料 from【生产进度报表】  -->
+  <div id="detailsFabricDrawer">
+    <a-drawer title="详情" width="89%" placement="right" :closable="true" :visible="visible" @close="handleCancel">
+      <!-- 主表信息 回显-->
+      <a-card :bordered="true">
+        <div class="table-page-search-wrapper">
+          <a-form-model layout="inline" ref="form" :model="editFabric">
+            <a-row :gutter="24">
+              <a-col :md="6" :sm="8">
+                <a-form-model-item label="单号" prop="oddNum">
+                  YT67889
+                </a-form-model-item>
+              </a-col>
+
+              <a-col :md="6" :sm="8">
+                <a-form-model-item label="集装箱号" prop="styleNum">
+                  <!-- <a-input placeholder="请输入集装箱号" v-model="editFabric.containerNo"></a-input> -->
+                </a-form-model-item>
+              </a-col>
+
+              <a-col :md="6" :sm="8">
+                <a-form-model-item label="装柜日期" prop="loadingDate">
+                  <!-- <a-date-picker
+                    placeholder="请选择装柜日期"
+                    :format="dateFormat"
+                    style="width: 100%"
+                    v-model="editFabric.loadingDate"
+                  /> -->
+                </a-form-model-item>
+              </a-col>
+
+              <a-col :md="6" :sm="8">
+                <a-form-model-item label="成衣工厂" prop="clothesFactory">
+                  <!-- <a-input placeholder="请输入成衣工厂" v-model="editFabric.clothesFactory"></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="invoiceNum">
+                  <!-- <a-input placeholder="请输入发票号" v-model="editFabric.invoiceNum"></a-input> -->
+                </a-form-model-item>
+              </a-col>
+
+              <a-col :md="6" :sm="8">
+                <a-form-model-item label="制单人" prop="preparedBy">
+                  <!-- <a-input placeholder="请输入制单人" v-model="editFabric.preparedBy"></a-input> -->
+                </a-form-model-item>
+              </a-col>
+
+              <a-col :md="6" :sm="8">
+                <a-form-model-item label="制单日期" prop="preparedDate">
+                  <!-- <a-date-picker
+                    placeholder="请选择制单日期"
+                    :format="dateFormat"
+                    style="width: 100%"
+                    v-model="editFabric.preparedDate"
+                  /> -->
+                </a-form-model-item>
+              </a-col>
+
+              <a-col :md="6" :sm="8">
+                <a-form-model-item label="外销发票号" prop="exportInvoiceNo">
+                  <!-- <a-input placeholder="请输入外销发票号" v-model="editFabric.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="editFabric.bookNum"></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="editFabric.note"></a-input> -->
+                </a-form-model-item>
+              </a-col>
+            </a-row>
+          </a-form-model>
+        </div>
+      </a-card>
+
+      <!-- 子表   -->
+      <a-card :bordered="true" style="margin:10px 0 60px 0;">
+        <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="pagination"
+              :scroll="{ x: 1500 }"
+              @change="handleTableChange"
+            >
+            </a-table>
+          </a-form-model>
+        </a-spin>
+      </a-card>
+    </a-drawer>
+  </div>
+</template>
+
+<script>
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+import JEllipsis from '@/components/jeecg/JEllipsis'
+
+// import { detailsFabric } from '@api/reportForms/pro-progress-report.js'
+
+export default {
+  name: 'DetailsFabricDrawer', //  详情 装箱单 -面料
+  mixins: [JeecgListMixin],
+  computed: {},
+  components: { JEllipsis },
+  data() {
+    let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} />
+    return {
+      // 表头
+      columns: [
+        {
+          title: '业务员 Merchandiser',
+          dataIndex: 'merchandiser',
+          width: 120,
+          fixed: 'left',
+          className: 'replacecolor'
+        },
+        {
+          title: '计划单号',
+          dataIndex: 'planNum',
+          width: 160,
+          fixed: 'left',
+          className: 'replacecolor'
+        },
+        {
+          title: '款号/Kimball',
+          dataIndex: 'Kimball',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '缸号/Batch no.',
+          dataIndex: 'batchNo',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '颜色/Color',
+          dataIndex: 'color',
+          width: 120,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '项目/Item(存货编码)',
+          dataIndex: 'itemCode',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '存货名称(辅料名称)',
+          dataIndex: 'inventoryName',
+          width: 160,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '报关品名',
+          dataIndex: 'declarationName',
+          width: 120,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '成分/Composition',
+          dataIndex: 'composition',
+          width: 150,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '门幅/Width',
+          dataIndex: 'larghezza',
+          width: 140,
+          className: 'replacecolor'
+        },
+        {
+          title: '匹数/Rolls',
+          dataIndex: 'rolls',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '毛重/GW/kg',
+          dataIndex: 'roughWeigh',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '净重/NW/kg',
+          dataIndex: 'suttle',
+          width: 120,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '染后重',
+          dataIndex: 'postDyeingWweight',
+          width: 90,
+          className: 'replacecolor'
+        },
+        {
+          title: '拷布重',
+          dataIndex: 'clothWeight',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '米数/Length/m',
+          dataIndex: '米数',
+          width: 130,
+          className: 'replacecolor'
+        },
+        {
+          title: '价格',
+          dataIndex: 'price',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '克重/G',
+          dataIndex: 'gramWeight',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '供应商编码(染厂)',
+          dataIndex: 'supplierCodeDye',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '供应商(染厂)',
+          dataIndex: 'supplierDye',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '供应商编码(印厂)',
+          dataIndex: 'supplierCodePrint',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '供应商(印厂)',
+          dataIndex: 'supplierPrint',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '包装方式',
+          dataIndex: 'packingWay ',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '处理方式',
+          dataIndex: 'treatmentMethod',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '是否手册纱',
+          dataIndex: 'isManualYarn',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '手册纱单价',
+          dataIndex: 'manualYarnPrice',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '手册纱占比%',
+          dataIndex: 'aa',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '柜号',
+          dataIndex: 'containerNum',
+          width: 120,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '备注',
+          dataIndex: 'note',
+          width: 160,
+          customRender: t => ellipsis(t),
+          className: 'replacecolor'
+        },
+        {
+          title: '入库数量',
+          dataIndex: 'inQuantity',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '规格型号',
+          dataIndex: 'specificationsModels',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '实际报关数量',
+          dataIndex: 'actualDeclaredQuantity',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '超发',
+          dataIndex: 'superHair',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '单位',
+          dataIndex: 'unit',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '备注(U8)',
+          dataIndex: 'noteU8',
+          width: 160,
+          fixed: 'right',
+          customRender: t => ellipsis(t),
+          className: 'replacecolor'
+        }
+      ],
+      data: [{}, {}, {}],
+      loading: false, // 表格加载
+      editFabric: {},
+      visible: false,
+      record: {}, //点击的订单对象
+      confirmLoading: false,
+      // 分页
+      pagination: {
+        pageNo: ''
+        // total: '',
+        // current: '',
+        // pageSize: ''
+      },
+      dateFormat: 'YYYY-MM-DD'
+    }
+  },
+  created() {
+    this.getDetailsFabric()
+  },
+
+  methods: {
+    getDetailsFabric() {
+      this.$nextTick(() => {
+        // console.log('详情拿到订单号', this.record.orderNumber)
+        // detailsFabric({}).then(res => {
+        //   if (res.success) {
+        //     // 子表信息赋值
+        //     this.data = res.result.records
+        //     this.pagination = {
+        //       total: res.result.total,
+        //       current: res.result.current,
+        //       pageSize: res.result.size
+        //     }
+        //   }
+        // })
+      })
+    },
+
+    handleTableChange(pagination, filters, sorter) {
+      // console.log('当前页信息>>>>',pagination)
+      this.queryParam.pageNo = pagination.current
+      this.getDetailsFabric()
+    },
+    // 抽屉 取消
+    handleCancel() {
+      this.close()
+    },
+
+    close() {
+      this.$emit('close')
+      this.visible = false
+      this.$refs.form.resetFields()
+    }
+  }
+}
+</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;
+// }
+
+// 抽屉里的card样式
+/deep/ .ant-drawer-content {
+  background-color: #f0f2f5;
+}
+/deep/ .ant-drawer-body {
+  padding: 10px;
+}
+</style>

src/views/reportForms/pro-progress-report/packinglistFabricsDrawer.vue

@@ -0,0 +1,182 @@
+<template>
+  <!-- 列表页  装箱单-面料  from【生产进度报表】 -->
+  <div id="packinglistFabricsDrawer">
+    <a-card :bordered="false" style="marginTop:10px;">
+      <!-- 列表-->
+      <a-table
+        bordered
+        :columns="packinglistFabricsColumns"
+        :data-source="packinglistFabricsData"
+        :loading="loading"
+        :pagination="pagination"
+        :row-key="record => record.id"
+      >
+        <!-- 订单号  链接-->
+        <span slot="orderNum" slot-scope="text">
+          <a>{{ text }}</a>
+        </span>
+      </a-table>
+    </a-card>
+
+    <!-- 【订单号】 装箱单-面料 抽屉 -->
+    <detailsFabricDrawer-drawer ref="detailsFabricDrawer" @ok="modalFormOk"></detailsFabricDrawer-drawer>
+  </div>
+</template>
+
+<script>
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+import JEllipsis from '@/components/jeecg/JEllipsis'
+import moment from 'moment'
+
+import detailsFabricDrawer from '@views/reportForms/pro-progress-report/detailsFabricDrawer.vue' //装箱单-面料（查看详情）
+
+// import { packinglistFabricsList } from '@api/reportForms/pro-progress-report.js'
+
+export default {
+  name: 'packinglistFabricsDrawer', // 装箱单-面料 （查看详情）
+  mixins: [JeecgListMixin],
+  components: { JEllipsis, moment, detailsFabricDrawer },
+
+  data() {
+    // let ellipsis = (v, l = 20) => <j-ellipsis value={v} length={l} />
+    return {
+      // 表头
+      packinglistFabricsColumns: [
+        {
+          title: '订单号',
+          dataIndex: 'orderNum',
+          width: 160,
+          customCell: this.orderDetailsDrawer,
+          scopedSlots: { customRender: 'orderNum' },
+          className: 'replacecolor'
+        },
+        {
+          title: '外销发票号',
+          dataIndex: 'exportInvoiceNo',
+          width: 160,
+          className: 'replacecolor'
+        },
+        {
+          title: '集装箱号',
+          dataIndex: 'containerNo',
+          width: 140,
+          scopedSlots: { customRender: 'containerNo' },
+          className: 'replacecolor'
+        },
+
+        {
+          title: '装柜日期',
+          dataIndex: 'loadingDate ',
+          width: 120,
+          // customRender: text => {
+          //   return moment(text).format('YYYY-MM-DD')
+          // },
+          className: 'replacecolor'
+        },
+        {
+          title: '成衣工厂',
+          dataIndex: 'clothesFactory',
+          width: 160,
+          className: 'replacecolor'
+        },
+        {
+          title: '发票号',
+          dataIndex: 'invoiceNum',
+          width: 160,
+          className: 'replacecolor'
+        },
+
+        {
+          title: '制单人',
+          dataIndex: 'preparedBy',
+          width: 120,
+          className: 'replacecolor'
+        },
+        {
+          title: '制单日期',
+          dataIndex: 'preparedDate',
+          width: 120,
+          // customRender: text => {
+          //   return moment(text).format('YYYY-MM-DD')
+          // },
+          className: 'replacecolor'
+        },
+        {
+          title: '托书号',
+          dataIndex: 'bookNum',
+          width: 160,
+          className: 'replacecolor'
+        },
+        {
+          title: '预托书号',
+          dataIndex: 'preBookNum',
+          width: 120,
+          className: 'replacecolor'
+        }
+      ],
+
+      packinglistFabricsData: [{}, {}, {}],
+      loading: false, // 表格加载
+      // 分页
+      pagination: {
+        // total: '',
+        // current: 0,
+        // pageSize: 0
+      },
+      dateFormat: 'YYYY-MM-DD'
+    }
+  },
+  created() {
+    this.getpackinglistFabricsList()
+  },
+  methods: {
+    // 列表页查询
+    getpackinglistFabricsList() {
+      this.$nextTick(() => {
+        // packinglistFabricsList({}).then(res => {
+        //   if (res.success) {
+        //     this.packinglistFabricsData = res.result.records
+        //     console.log('装箱单列表', this.packinglistFabricsData)
+        //     this.pagination = {
+        //       total: res.result.total,
+        //       current: res.result.current,
+        //       pageSize: res.result.size
+        //     }
+        //   }
+        // })
+      })
+    },
+
+    // 订单号详情--【装箱单-面料】 抽屉
+    orderDetailsDrawer(record) {
+      return {
+        on: {
+          click: event => {
+            // console.log('【装箱单列表 -- 订单号】', record)
+            this.$refs.detailsFabricDrawer.visible = true
+            this.$refs.detailsFabricDrawer.record = record //接口参数,获取（主表 + 所有页签信息）
+            this.$refs.detailsFabricDrawer.getDetailsFabric()
+            console.log('【列表页 点击的销售订单对象】', this.$refs.detailsFabricDrawer.record)
+          }
+        }
+      }
+    }
+  }
+}
+</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/pro-progress-report/salesOrderDetailsDrawer.vue

@@ -212,12 +212,15 @@
             </span>
           </a-table>
         </div>
+        <!-- 物料卡结束 -->
       </a-card>
-      <!-- 物料卡结束 -->
     </a-drawer>
 
     <!-- 点击【物料编号】----出入库详细数据 抽屉 -->
     <outInDetailData-drawer ref="outInDetailDataDrawer" @ok="modalFormOk"></outInDetailData-drawer>
+
+    <!-- 【物料卡】----装箱单-面料列表 抽屉-->
+    <packinglistFabrics-drawer ref="packinglistFabricsDrawer" @ok="modalFormOk"></packinglistFabrics-drawer>
   </div>
 </template>
 
@@ -226,14 +229,15 @@ import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import JEllipsis from '@/components/jeecg/JEllipsis'
 import moment from 'moment'
 
-// import { salesOrderAll } from '@api/reportForms/pro-progress-report.js'
-
 import outInDetailDataDrawer from '@views/reportForms/pro-progress-report/outInDetailDataDrawer.vue'
+import packinglistFabricsDrawer from '@views/reportForms/pro-progress-report/packinglistFabricsDrawer.vue' //装箱单-面料（查看详情）
+
+// import { salesOrderAll } from '@api/reportForms/pro-progress-report.js'
 
 export default {
   name: 'salesOrderDetailsDrawer', // 销售订单详情
   mixins: [JeecgListMixin],
-  components: { JEllipsis, moment, outInDetailDataDrawer },
+  components: { JEllipsis, moment, outInDetailDataDrawer, packinglistFabricsDrawer },
   data() {
     return {
       loading: false, // 表格加载
@@ -408,6 +412,20 @@ export default {
       }
     },
 
+    // 物料卡 --装箱单-面料
+    getPackinglistFabrics(record) {
+      return {
+        on: {
+          click: event => {
+            console.log('传给装箱单-面料- 列表页', record)
+            this.$refs.packinglistFabricsDrawer.visible = true
+            this.$refs.packinglistFabricsDrawer.record = record
+            this.$refs.packinglistFabricsDrawer.getpackinglistFabricsList()
+          }
+        }
+      }
+    },
+
     // 物料卡----查询按钮
     searchQuery() {
       // 物料卡信息