update - 发泡箱体追溯查询差异明细报表页面与导出

src/api/report/reportAPI.js

@@ -125,3 +125,12 @@ export function boxTraceabilityReport(query) {
     params: query
   })
 }
+
+// 发泡箱体追溯报表
+export function boxTraceabilityDetailReport(query) {
+  return request({
+    url: '/report/productionReport/boxTraceabilityDetailReport',
+    method: 'get',
+    params: query
+  })
+}

src/views/report/boxTraceabilityReport/index.vue

@@ -11,14 +11,14 @@
           ></el-option>
         </el-select>
       </el-form-item>
-<!--      <el-form-item label="公司条码" prop="productSncode">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.productSncode"-->
-<!--          placeholder="请输入公司条码"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
+      <!--      <el-form-item label="公司条码" prop="productSncode">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.productSncode"-->
+      <!--          placeholder="请输入公司条码"-->
+      <!--          clearable-->
+      <!--          @keyup.enter.native="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
       <el-form-item label="SAP计划编号" prop="productOrderNo">
         <el-input
           v-model="queryParams.productOrderNo"
@@ -68,7 +68,16 @@
           icon="el-icon-download"
           size="mini"
           @click="handleExport"
-        >导出</el-button>
+        >导出
+        </el-button>
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleDetailExport"
+        >差异明细导出
+        </el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
     </el-row>
@@ -86,7 +95,11 @@
       <el-table-column label="订单数" align="center" prop="ORDER_AMOUNT" v-if="columns[8].visible" width="120"/>
       <el-table-column label="泡前入库数" align="center" prop="BEFORE_NUMBER" v-if="columns[9].visible" width="100"/>
       <el-table-column label="成品下线数" align="center" prop="SCAN_NUMBER" v-if="columns[10].visible"/>
-      <el-table-column label="差异数" align="center" prop="DIFF_NUMBER" v-if="columns[11].visible"/>
+      <el-table-column label="差异数" align="center" prop="DIFF_NUMBER" v-if="columns[11].visible">
+        <template slot-scope="scope">
+          <el-button type="text" @click="openDifference(scope.row)">{{ scope.row.DIFF_NUMBER }}</el-button>
+        </template>
+      </el-table-column>
       <el-table-column label="报废记录数" align="center" prop="SCRAP_NUMBER" v-if="columns[12].visible"/>
     </el-table>
 
@@ -98,16 +111,64 @@
       @pagination="getList"
     />
 
-
+    <!-- 详情信息对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
+<!--      <el-form ref="form" :model="form" :rules="rules" label-width="100px">-->
+<!--        <el-row gutter="15">-->
+<!--          <el-col :span="11">-->
+<!--            <el-form-item label="SAP订单编号" prop="ORDER_CODE">-->
+<!--              <el-input v-model="form.ORDER_CODE" placeholder="请输入SAP订单编号" :disabled="true"/>-->
+<!--            </el-form-item>-->
+<!--          </el-col>-->
+<!--          <el-col :span="11">-->
+<!--            <el-form-item label="MES条码" prop="BOX_CODE">-->
+<!--              <el-input v-model="form.BOX_CODE" placeholder="请输入MES条码" :disabled="true"/>-->
+<!--            </el-form-item>-->
+<!--          </el-col>-->
+<!--        </el-row>-->
+<!--        <el-divider content-position="center">产品检验详情信息</el-divider>-->
+        <el-table :data="reportDetailList" :row-class-name="rowDetailIndex"
+                  ref="reportDetailRef"
+        >
+          <!--          <el-table-column type="selection" width="50" align="center"/>-->
+          <el-table-column label="序号" align="center"  prop="index">
+          </el-table-column>
+          <el-table-column label="箱体码" align="center" prop="BOX_CODE" width="200">
+          </el-table-column>
+          <el-table-column label="物料编号" align="center" prop="MATERIAL_CODE" width="150">
+          </el-table-column>
+          <el-table-column label="箱体型号" align="center" prop="MATERIAL_MODEL" width="150">
+          </el-table-column>
+          <el-table-column label="最后扫描点" align="center" prop="SCAN_SPOT" width="150">
+          </el-table-column>
+          <el-table-column label="报废记录" align="center" prop="SCRAP_FLAG" width="150">
+          </el-table-column>
+        </el-table>
+        <pagination
+          v-show="detailTotal>0"
+          :total="detailTotal"
+          :page.sync="queryDetailParams.pageNum"
+          :limit.sync="queryDetailParams.pageSize"
+          @pagination="getDetailList"
+        />
+<!--      </el-form>-->
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="cancel">关 闭</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import { findProductLineList } from '@//api/base/productLine'
 import { parseTime } from '@//utils/ruoyi'
-import { boxTraceabilityReport } from '@//api/report/reportAPI'
+import {
+  boxTraceabilityDetailReport,
+  boxTraceabilityReport,
+} from '@//api/report/reportAPI'
+
 export default {
-  name: "ProductOffLine",
+  name: 'ProductOffLine',
   data() {
     return {
       // 遮罩层
@@ -122,10 +183,14 @@ export default {
       showSearch: true,
       // 总条数
       total: 0,
-      // 扫描下线记录报表表格数据
+      // 总条数
+      detailTotal: 0,
+      // 表格数据
       boxTraceabilityList: [],
+      // 详情表格数据
+      reportDetailList: [],
       // 弹出层标题
-      title: "",
+      title: '',
       // 是否显示弹出层
       open: false,
       // 查询参数
@@ -155,13 +220,14 @@ export default {
         endBeginTime: null,
         productLineCode: 'CX_02'
       },
+      // 查询参数
+      queryDetailParams: {},
       // 更新时间时间范围
       daterangeBeginTime: [],
       // 表单参数
       form: {},
       // 表单校验
-      rules: {
-      },
+      rules: {},
       columns: [
         { key: 0, label: `主键标识`, visible: false },
         { key: 1, label: `工厂`, visible: false },
@@ -175,25 +241,25 @@ export default {
         { key: 9, label: `泡前入库数`, visible: true },
         { key: 10, label: `成品下线数`, visible: true },
         { key: 11, label: `差异数`, visible: true },
-        { key: 12, label: `报废记录数`, visible: true },
+        { key: 12, label: `报废记录数`, visible: true }
       ],
       // 产线选项
-      productLineList: [],
-    };
+      productLineList: []
+    }
   },
   created() {
-    findProductLineList({productLineType: 1}).then(response => {
+    findProductLineList({ productLineType: 1 }).then(response => {
       this.productLineList = response.data
     })
     const nowDate = parseTime(new Date(), '{y}-{m}-{d}')
     this.daterangeBeginTime[0] = nowDate + ' 00:00:00'
     this.daterangeBeginTime[1] = nowDate + ' 23:59:59'
-    this.getList();
+    this.getList()
   },
   methods: {
     /** 查询扫描下线记录报表列表 */
     getList() {
-      this.loading = true;
+      this.loading = true
       if (null != this.daterangeBeginTime && '' != this.daterangeBeginTime) {
         this.queryParams.beginBeginTime = this.daterangeBeginTime[0]
         this.queryParams.endBeginTime = this.daterangeBeginTime[1]
@@ -202,15 +268,46 @@ export default {
         this.queryParams.endBeginTime = null
       }
       boxTraceabilityReport(this.queryParams).then(response => {
-        this.boxTraceabilityList = response.rows;
-        this.total = response.total;
-        this.loading = false;
-      });
+        this.boxTraceabilityList = response.rows
+        this.total = response.total
+        this.loading = false
+      })
+    },
+    // 详情表
+    openDifference(row) {
+      if (row.ORDER_CODE == null) {
+        this.$modal.msgError('订单号不为空！')
+        return
+      }
+      // this.form.ORDER_CODE = row.ORDER_CODE
+      // this.form.ORDER_AMOUNT = row.ORDER_AMOUNT
+      this.queryDetailParams = this.queryParams;
+      this.queryDetailParams.orderCode = row.ORDER_CODE
+      if (this.queryParams.productModel != null){
+        this.queryDetailParams.productModel = row.MATERIAL_MODEL
+      }
+      boxTraceabilityDetailReport(this.queryDetailParams).then(response => {
+        this.reportDetailList = response.rows
+        this.detailTotal = response.total
+        this.open = true
+        this.title = '差异明细表'
+      })
+    },
+    getDetailList(){
+      boxTraceabilityDetailReport(this.queryDetailParams).then(response => {
+        this.reportDetailList = response.rows
+        this.detailTotal = response.total
+        this.loading = false
+      })
+    },
+    /** 数据明细序号 */
+    rowDetailIndex({ row, rowIndex }) {
+      row.index = rowIndex + 1 + (this.queryDetailParams.pageNum - 1) * this.queryDetailParams.pageSize
     },
     // 取消按钮
     cancel() {
-      this.open = false;
-      this.reset();
+      this.open = false
+      this.reset()
     },
     // 表单重置
     reset() {
@@ -236,31 +333,36 @@ export default {
         productScantime: null,
         boxCode: null,
         productLineCode: null
-      };
-      this.resetForm("form");
+      }
+      this.resetForm('form')
     },
     /** 搜索按钮操作 */
     handleQuery() {
-      this.queryParams.pageNum = 1;
-      this.getList();
+      this.queryParams.pageNum = 1
+      this.getList()
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
+      this.resetForm('queryForm')
+      this.handleQuery()
     },
     // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.objId)
-      this.single = selection.length!==1
+      this.single = selection.length !== 1
       this.multiple = !selection.length
     },
     /** 导出按钮操作 */
     handleExport() {
       this.download('report/productionReport/boxTraceabilityReport/export', {
         ...this.queryParams
-      }, `productOffLine_${new Date().getTime()}.xlsx`)
+      }, `发泡箱体追溯报表_${new Date().getTime()}.xlsx`)
+    },
+    handleDetailExport() {
+      this.download('report/productionReport/boxTraceabilityDetailReport/export', {
+        ...this.queryParams
+      }, `发泡箱体追溯差异明细报表_${new Date().getTime()}.xlsx`)
     }
   }
-};
+}
 </script>