You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

368 lines
13 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
<el-form-item label="产线" prop="PRODUCT_LINE_NAME">
<el-select v-model="queryParams.PRODUCT_LINE_CODE" placeholder="请选择产线">
<el-option
v-for="item in productLineList"
:key="item.productLineCode"
:label="item.productLineName"
:value="item.productLineCode"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="产品编码" prop="MATERIAL_CODE">
<el-input
v-model="queryParams.MATERIAL_CODE"
placeholder="请输入产品编码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="产品名称" prop="MATERIAL_NAME">
<el-input
v-model="queryParams.MATERIAL_NAME"
placeholder="请输入产品名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="SAP订单编号" prop="ORDER_CODE">
<el-input
v-model="queryParams.ORDER_CODE"
placeholder="请输入SAP计划编号"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="MES条码" prop="BOX_CODE">
<el-input
v-model="queryParams.BOX_CODE"
placeholder="请输入MES条码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="成品条码" prop="PRODUCT_SNCODE">
<el-input
v-model="queryParams.PRODUCT_SNCODE"
placeholder="请输入SAP成品条码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="是否样品机" prop="isSample">
<el-select v-model="queryParams.isSample" placeholder="请选择是否样品机" clearable>
<el-option
v-for="item in isSampleList"
:key="item.key"
:label="item.label"
:value="item.key"
></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="是否降级品" prop="isDowngrade">-->
<!-- <el-select v-model="queryParams.isDowngrade" placeholder="请选择是否降级品" clearable>-->
<!-- <el-option-->
<!-- v-for="item in isDowngradeList"-->
<!-- :key="item.key"-->
<!-- :label="item.label"-->
<!-- :value="item.key"-->
<!-- ></el-option>-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item label="起止时间">
<el-date-picker
v-model="daterangeBeginTime"
style="width: 340px"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetimerange"
range-separator="-"
start-placeholder="开始时间"
end-placeholder="结束时间"
></el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
>导出
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="reportList" @selection-change="handleSelectionChange">
<!-- <el-table-column type="selection" width="55" align="center"/>-->
<el-table-column label="主键标识" align="center" prop="objId" v-if="columns[0].visible"/>
<!-- <el-table-column label="工厂" align="center" prop="PRODUCT_STATION" v-if="columns[1].visible"/>-->
<el-table-column label="产线" align="center" prop="PRODUCT_LINE_NAME" v-if="columns[2].visible" width="70"/>
<el-table-column label="SAP订单编号" align="center" prop="ORDER_CODE" v-if="columns[3].visible"/>
<el-table-column label="销售订单号" align="center" prop="SALEORDER_CODE" v-if="columns[4].visible"/>
<el-table-column label="销售订单行号" align="center" prop="SALEORDER_LINENUMBER" v-if="columns[5].visible"/>
<el-table-column label="产品编码" align="center" prop="MATERIAL_CODE" v-if="columns[6].visible"/>
<el-table-column label="产品名称" align="center" prop="MATERIAL_NAME" v-if="columns[7].visible" width="250"/>
<el-table-column label="MES条码" align="center" prop="BOX_CODE" v-if="columns[8].visible" width="200"/>
<el-table-column label="成品条码" align="center" prop="PRODUCT_SNCODE" v-if="columns[9].visible" width="200"/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-search"
@click="handleOrderDetails(scope.row)"
>检验详情
</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-d-arrow-right"
@click="findInspectInfo(scope.row)"
>质检材料
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@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="序号" prop="index" width="150">
</el-table-column>
<el-table-column label="质检工位" prop="PRODUCT_LINE_NAME" width="150">
</el-table-column>
<el-table-column label="质检结果" prop="TREATMENT_MEASURE" width="150">
<template slot-scope="scope">
<dict-tag :options="dict.type.treatment_measures" :value="scope.row.TREATMENT_MEASURE"/>
</template>
</el-table-column>
<el-table-column label="返修结果" prop="PROCESS_RESULT" width="150">
</el-table-column>
<el-table-column label="检验时间" prop="INSPECTOR_TIME" width="150">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.INSPECTOR_TIME, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
</template>
</el-table-column>
<el-table-column label="检验人" prop="USER_NAME" width="150">
</el-table-column>
</el-table>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
productTraceabilityDetailList,
productTraceabilityReportList
} from '@/api/report/reportAPI'
import { findProductLineList } from '@//api/base/productLine'
import { parseTime } from '@//utils/ruoyi'
export default {
name: 'ProductTraceabilityReport',
dicts: ['is_flag', 'treatment_measures'],
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 报表表格数据
reportList: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
// 更新时间时间范围
daterangeBeginTime: [],
// 查询参数
queryParams: {
// pageNum: 1,
// pageSize: 10,
beginBeginTime: null,
endBeginTime: null,
BOX_CODE: null,
PRODUCT_LINE_CODE: 'CX_02',
ORDER_CODE: null,
MATERIAL_CODE: null,
MATERIAL_NAME: null,
isSample: null,
isDowngrade: null,
PRODUCT_SNCODE: null
},
// 表单参数
form: {},
// 表单校验
rules: {},
reportDetailList: [],
isSampleList: [{ key: 1, label: '是' }, { key: 2, label: '否' }],
isDowngradeList: [{ key: 1, label: '是' }, { key: 2, label: '否' }],
columns: [
{ key: 0, label: `主键标识`, visible: false },
{ key: 1, label: `工位`, visible: true },
{ key: 2, label: `产线`, visible: true },
{ key: 3, label: `SAP订单编号`, visible: true },
{ key: 4, label: `销售订单号`, visible: false },
{ key: 5, label: `销售订单行号`, visible: false },
{ key: 6, label: `产品编码`, visible: true },
{ key: 7, label: `产品名称`, visible: true },
{ key: 8, label: `MES条码`, visible: true },
{ key: 9, label: `成品条码`, visible: true }
],
// 产线选项
productLineList: [],
// 工位选项
findStationList: []
}
},
created() {
findProductLineList({ productLineType: 1 }).then(response => {
this.productLineList = response.data
})
// findProductLineList({productLineType: 2}).then(response => {
// this.findStationList = 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()
},
methods: {
/** 查询工单信息列表 */
getList() {
this.loading = true
if (null != this.daterangeBeginTime && '' != this.daterangeBeginTime) {
this.queryParams.beginBeginTime = this.daterangeBeginTime[0]
this.queryParams.endBeginTime = this.daterangeBeginTime[1]
} else {
this.queryParams.beginBeginTime = null
this.queryParams.endBeginTime = null
}
productTraceabilityReportList(this.queryParams).then(response => {
this.reportList = response.rows
this.total = response.total
this.loading = false
})
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
/** 数据明细序号 */
rowDetailIndex({ row, rowIndex }) {
row.index = rowIndex + 1
},
// 表单重置
reset() {
this.daterangeBeginTime = []
this.form = {
WORK_CENTER_CODE: null,
PRODUCT_LINE_NAME: null,
ORDER_CODE: null,
BOX_CODE: null,
MATERIAL_CODE: null,
MATERIAL_NAME: null,
BEGIN_DATE: null
}
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery() {
// this.queryParams.pageNum = 1;
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm('queryForm')
this.handleQuery()
},
/** 查看明细 */
handleOrderDetails(row) {
// this.$tab.openPage("SAP订单信息","/order/orderInfo" , {ORDER_CODE: row.ORDER_CODE})
if (row.BOX_CODE == null) {
this.$modal.msgError('该产品无MES条码')
return
}
this.form.BOX_CODE = row.BOX_CODE
this.form.ORDER_CODE = row.ORDER_CODE
productTraceabilityDetailList({ BOX_CODE: row.BOX_CODE }).then(response => {
this.reportDetailList = response.data
this.open = true
this.title = '产品检验详情'
})
},
/** 查看质检材料 */
findInspectInfo: function(row) {
const orderCode = row.ORDER_CODE
this.$router.push('/report/quality-material/index/' + orderCode)
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.objId)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 导出按钮操作 */
handleExport() {
this.download('/report/qualityReport/productTraceabilityReportList/export', {
...this.queryParams
}, `产品追溯报表_${new Date().getTime()}.xlsx`)
}
}
}
</script>