feat(crm): 添加订单和合同的发货配卷查询功能
添加新的API接口和组件用于查询订单和合同下的发货配卷情况 在订单和合同详情页中新增"发货配卷"标签页展示相关数据
This commit is contained in:
砂糖
181
klp-ui/src/views/crm/components/CoilTable.vue
Normal file
181
klp-ui/src/views/crm/components/CoilTable.vue
Normal file
@@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<div>
|
||||
<KLPTable v-loading="loading" :data="data" :floatLayer="true" :floatLayerConfig="floatLayerConfig">
|
||||
<el-table-column label="入场钢卷号" align="center" prop="enterCoilNo">
|
||||
<template slot-scope="scope">
|
||||
<coil-no :coil-no="scope.row.enterCoilNo"></coil-no>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="当前钢卷号" align="center" prop="currentCoilNo">
|
||||
<template slot-scope="scope">
|
||||
<current-coil-no :current-coil-no="scope.row.currentCoilNo"></current-coil-no>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="厂家卷号" align="center" prop="supplierCoilNo" />
|
||||
<el-table-column label="逻辑库位" align="center" prop="warehouseName" />
|
||||
<el-table-column label="实际库区" align="center" prop="actualWarehouseName" />
|
||||
<el-table-column label="物料类型" align="center" prop="materialType" />
|
||||
<el-table-column label="产品类型" align="center" width="180">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo v-if="scope.row.itemType == 'product'" :product="scope.row" />
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="长度 (米)" align="center" prop="length" />
|
||||
<!-- <el-table-column label="关联信息" align="center" :show-overflow-tooltip="true">
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.parentCoilNos && scope.row.hasMergeSplit === 1 && scope.row.dataType === 1">
|
||||
<el-tag type="warning" size="mini">来自母卷：{{ scope.row.parentCoilNos }}</el-tag>
|
||||
</span>
|
||||
<span v-else-if="scope.row.parentCoilNos && scope.row.dataType === 0">
|
||||
<el-tag type="info" size="mini">分为子卷：{{ scope.row.parentCoilNos }}</el-tag>
|
||||
</span>
|
||||
<span v-else-if="scope.row.parentCoilNos && scope.row.hasMergeSplit === 2">
|
||||
<el-tag type="success" size="mini">合并自：{{ scope.row.parentCoilNos }}</el-tag>
|
||||
</span>
|
||||
<span v-else>—</span>
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
|
||||
<el-table-column label="质量状态" align="center" prop="qualityStatus"></el-table-column>
|
||||
|
||||
<el-table-column label="备注" align="center" prop="remark" show-overflow-tooltip />
|
||||
|
||||
<el-table-column label="发货状态" align="center" prop="status" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-tag v-if="scope.row.status === 1" type="success" size="mini">已发货</el-tag>
|
||||
<el-tag v-else type="info" size="mini">未发货</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<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-view" @click="handlePreviewLabel(scope.row)">
|
||||
预览标签
|
||||
</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-printer" @click="handlePrintLabel(scope.row)">
|
||||
打印标签
|
||||
</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-search" @click="handleTrace(scope.row)">追溯</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<!-- 钢卷追溯对话框（使用封装的组件） -->
|
||||
<el-dialog title="钢卷追溯" :visible.sync="trace.open" width="90%" append-to-body>
|
||||
<coil-trace-result v-loading="trace.loading" :trace-result="trace.result"></coil-trace-result>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 标签预览弹窗 -->
|
||||
<el-dialog title="标签预览" :visible.sync="labelRender.visible" append-to-body>
|
||||
<label-render :content="labelRender.data" :labelType="labelRender.type" />
|
||||
</el-dialog>
|
||||
|
||||
<label-render ref="labelRender" v-show="false" :content="labelRender.data" />
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getMaterialCoilTrace,
|
||||
} from "@/api/wms/coil";
|
||||
import ProductInfo from "@/components/KLPService/Renderer/ProductInfo";
|
||||
import RawMaterialInfo from "@/components/KLPService/Renderer/RawMaterialInfo";
|
||||
// 引入封装的追溯结果组件
|
||||
import CoilTraceResult from "@/views/wms/coil/panels/CoilTraceResult.vue";
|
||||
import LabelRender from "@/views/wms/coil/panels/LabelRender/index.vue";
|
||||
import CoilNo from "@/components/KLPService/Renderer/CoilNo.vue";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
data: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
},
|
||||
components: {
|
||||
ProductInfo,
|
||||
RawMaterialInfo,
|
||||
CoilTraceResult,
|
||||
LabelRender,
|
||||
CoilNo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
floatLayerConfig: {
|
||||
columns: [
|
||||
{ label: '入场钢卷号', prop: 'enterCoilNo' },
|
||||
{ label: '当前钢卷号', prop: 'currentCoilNo' },
|
||||
{ label: '厂家卷号', prop: 'supplierCoilNo' },
|
||||
{ label: '逻辑库位', prop: 'warehouseName' },
|
||||
{ label: '实际库位', prop: 'actualWarehouseName' },
|
||||
{ label: '物料类型', prop: 'materialType' },
|
||||
{ label: '班组', prop: 'team' },
|
||||
{ label: '净重', prop: 'netWeight' },
|
||||
{ label: '毛重', prop: 'grossWeight' },
|
||||
{ label: '备注', prop: 'remark' },
|
||||
{ label: '质量状态', prop: 'qualityStatus' },
|
||||
{ label: '原料材质', prop: 'packingStatus' },
|
||||
{ label: '切边要求', prop: 'edgeRequirement' },
|
||||
{ label: '包装要求', prop: 'packagingRequirement' },
|
||||
{ label: '厂家', prop: 'itemManufacturer' },
|
||||
{ label: '调制度', prop: 'temperGrade' },
|
||||
{ label: '镀层种类', prop: 'coatingType' },
|
||||
{ label: '实测长度(m)', prop: 'actualLength' },
|
||||
{ label: '实测宽度(m)', prop: 'actualWidth' },
|
||||
],
|
||||
title: '详细信息'
|
||||
},
|
||||
trace: {
|
||||
open: false,
|
||||
loading: false,
|
||||
result: {}
|
||||
},
|
||||
labelRender: {
|
||||
visible: false,
|
||||
data: '',
|
||||
type: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/** 预览标签 */
|
||||
handlePreviewLabel(row) {
|
||||
this.labelRender.visible = true;
|
||||
this.labelRender.data = {
|
||||
...row,
|
||||
itemName: itemName,
|
||||
updateTime: row.updateTime?.split(' ')[0] || '',
|
||||
};
|
||||
},
|
||||
// 打印标签
|
||||
handlePrintLabel(row) {
|
||||
this.labelRender.data = {
|
||||
...row,
|
||||
updateTime: row.updateTime?.split(' ')[0] || '',
|
||||
};
|
||||
this.$nextTick(() => {
|
||||
this.$refs.labelRender.printLabel();
|
||||
})
|
||||
},
|
||||
/** 追溯按钮操作 */
|
||||
handleTrace(row) {
|
||||
this.trace.open = true;
|
||||
this.trace.loading = true;
|
||||
this.trace.result = null; // 清空历史数据
|
||||
getMaterialCoilTrace({
|
||||
coilId: row.coilId,
|
||||
currentCoilNo: row.currentCoilNo,
|
||||
}).then(res => {
|
||||
this.trace.result = res.data; // 将结果传递给组件
|
||||
}).catch(err => {
|
||||
console.error('溯源查询失败：', err);
|
||||
this.$message.error('溯源查询失败，请重试');
|
||||
}).finally(() => {
|
||||
this.trace.loading = false;
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user