|
|
@@ -0,0 +1,434 @@
|
|
|
+<template>
|
|
|
+ <!-- 辅料采集详情界面 -->
|
|
|
+ <div class="popUp" v-if="modelValue">
|
|
|
+ <div class="header" style="height: 3vh">
|
|
|
+ <div class="headerTittle" style="font-weight: border; font-size: 28px">
|
|
|
+ 辅料采集详情
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="header"
|
|
|
+ style="display: flex; justify-content: center; margin: 20px"
|
|
|
+ >
|
|
|
+ <div class="box" @click.stop>
|
|
|
+ <div class="boxItem">
|
|
|
+ <div class="describeText">
|
|
|
+ 需采集物料：{{ showInfo.materialName }}
|
|
|
+ </div>
|
|
|
+ <div class="describeText">物料编码：{{ showInfo.materialCode }}</div>
|
|
|
+ <div class="describeText">型号：{{ showInfo.spec }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="body">
|
|
|
+ <div class="container1" @click.stop>
|
|
|
+ <div class="boxTittle">
|
|
|
+ 批次号列表(共 {{ batchNoTableData.length }} 批次)
|
|
|
+ </div>
|
|
|
+ <el-divider style="margin-top: 20px !important" />
|
|
|
+ <div style="display: flex; margin-bottom: 20px; align-items: center">
|
|
|
+ <div class="seqSearchInput">
|
|
|
+ <!-- <el-input
|
|
|
+ v-model="searchBatchNo"
|
|
|
+ placeholder="搜索批次号"
|
|
|
+ class="searchInput"
|
|
|
+ clearable
|
|
|
+ /> -->
|
|
|
+ </div>
|
|
|
+ <!-- <el-button style="width: 300px" type="success" @click="autoAll"
|
|
|
+ >按需全批次自动绑定</el-button
|
|
|
+ > -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-table
|
|
|
+ border
|
|
|
+ class="seqTable"
|
|
|
+ :data="showBatchNoTableData"
|
|
|
+ style="flex: 1"
|
|
|
+ >
|
|
|
+ <el-table-column align="center" label="批次号" prop="batchNo" />
|
|
|
+ <el-table-column align="center" label="绑定管号">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-scrollbar max-height="300px">
|
|
|
+ <el-select
|
|
|
+ multiple
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ placeholder="管号"
|
|
|
+ v-model="batchNoTableData[scope.$index].seqList"
|
|
|
+ >
|
|
|
+ <template #header>
|
|
|
+ <el-checkbox @change="handleCheckAll(scope.$index)">
|
|
|
+ 全选
|
|
|
+ </el-checkbox>
|
|
|
+ </template>
|
|
|
+ <el-option
|
|
|
+ v-for="item in seqList"
|
|
|
+ :key="item"
|
|
|
+ :label="item"
|
|
|
+ :value="item"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-scrollbar>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <!-- <el-table-column align="center" width="160" label="操作">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button style="width: 120px" type="primary"
|
|
|
+ >按需自动绑定</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column> -->
|
|
|
+ <template #empty>
|
|
|
+ <div class="empty">
|
|
|
+ <Empty />
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table>
|
|
|
+ <div class="btns">
|
|
|
+ <el-button type="primary" @click="submit">绑定确认</el-button>
|
|
|
+ <el-button @click="handleClose">取消</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="container2" @click.stop>
|
|
|
+ <div class="boxTittle">管号列表(共 {{ seqList.length }} 个 )</div>
|
|
|
+ <el-divider />
|
|
|
+ <div style="display: flex; margin-bottom: 20px; align-items: center">
|
|
|
+ <div class="seqSearchInput">
|
|
|
+ <el-input
|
|
|
+ v-model="searchSeqNo"
|
|
|
+ placeholder="搜索管号"
|
|
|
+ class="searchInput"
|
|
|
+ clearable
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <!-- <el-button @click="seqNoOk = true" :type="seqNoOk ? 'primary' : ''"
|
|
|
+ >完成绑定</el-button
|
|
|
+ >
|
|
|
+ <el-button :type="!seqNoOk ? 'primary' : ''" @click="seqNoOk = false"
|
|
|
+ >未完成</el-button
|
|
|
+ > -->
|
|
|
+ </div>
|
|
|
+ <el-table border class="seqTable" :data="showSeqData" style="flex: 1">
|
|
|
+ <el-table-column align="center" label="管号" prop="seqNo" />
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ label="批次号绑定情况"
|
|
|
+ prop="bodyatchNoList"
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <template
|
|
|
+ v-if="scope.row.batchNoList.length > 0"
|
|
|
+ v-for="item in scope.row.batchNoList"
|
|
|
+ >
|
|
|
+ <div>批次号: {{ item }}</div>
|
|
|
+ </template>
|
|
|
+ <span v-else>-</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <template #empty>
|
|
|
+ <div class="empty">
|
|
|
+ <Empty />
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { useProcessStore } from "@/store";
|
|
|
+import { getunProcessedList } from "@/api/prosteps";
|
|
|
+import { saveFlBatch } from "@/api/prosteps/wuliaocaiji.ts";
|
|
|
+import { useUserStore } from "@/store";
|
|
|
+import { includes } from "lodash-es";
|
|
|
+const props = defineProps({
|
|
|
+ modelValue: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false,
|
|
|
+ },
|
|
|
+ showInfo: {
|
|
|
+ type: Object,
|
|
|
+ },
|
|
|
+});
|
|
|
+const searchBatchNo = ref("");
|
|
|
+const searchSeqNo = ref("");
|
|
|
+const handleCheckAll = (index) => {
|
|
|
+ batchNoTableData.value[index].seqList = seqList.value;
|
|
|
+};
|
|
|
+const showBatchNoTableData = computed(() => {
|
|
|
+ let array = JSON.parse(JSON.stringify(batchNoTableData.value));
|
|
|
+ if (searchBatchNo.value) {
|
|
|
+ const lowerCaseSearchValue = searchBatchNo.value.toLowerCase();
|
|
|
+ array = array.filter(
|
|
|
+ (item) =>
|
|
|
+ item.batchNo &&
|
|
|
+ item.batchNo.toLowerCase().includes(lowerCaseSearchValue)
|
|
|
+ );
|
|
|
+ }
|
|
|
+ return array;
|
|
|
+});
|
|
|
+const store1 = useUserStore();
|
|
|
+const emits = defineEmits(["update:modelValue", "dataList"]);
|
|
|
+const store = useProcessStore();
|
|
|
+//批次号绑定
|
|
|
+const batchNoTableData = ref([]);
|
|
|
+const setBatchNo = () => {
|
|
|
+ const array = [];
|
|
|
+ if (props.showInfo.batchNoList.length > 0) {
|
|
|
+ for (let i = 0; i < props.showInfo.batchNoList.length; i++) {
|
|
|
+ array.push({
|
|
|
+ batchNo: props.showInfo.batchNoList[i],
|
|
|
+ seqList: [],
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //回显逻辑
|
|
|
+ if (props.showInfo.collectList.length > 0) {
|
|
|
+ for (let i = 0; i < array.length; i++) {
|
|
|
+ for (let j = 0; j < props.showInfo.collectList.length; j++) {
|
|
|
+ if (props.showInfo.collectList[j].batchNo.includes(array[i].batchNo)) {
|
|
|
+ array[i].seqList.push(props.showInfo.collectList[j].seqNo);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ batchNoTableData.value = array;
|
|
|
+};
|
|
|
+//获取当前物料绑定管号
|
|
|
+const seqTableData = ref([]);
|
|
|
+const getSeqList = async () => {
|
|
|
+ const { data } = await getunProcessedList(store.scanInfo.id);
|
|
|
+ seqList.value = data;
|
|
|
+};
|
|
|
+const setSeqTableData = () => {
|
|
|
+ seqTableData.value = [];
|
|
|
+ for (let i = 0; i < seqList.value.length; i++) {
|
|
|
+ seqTableData.value.push({
|
|
|
+ seqNo: seqList.value[i],
|
|
|
+ batchNoList: [],
|
|
|
+ });
|
|
|
+ }
|
|
|
+};
|
|
|
+const showSeqData = computed(() => {
|
|
|
+ let array = JSON.parse(JSON.stringify(seqTableData.value));
|
|
|
+ let obj = {};
|
|
|
+ for (let j = 0; j < batchNoTableData.value.length; j++) {
|
|
|
+ obj[batchNoTableData.value[j].batchNo] = batchNoTableData.value[j].seqList;
|
|
|
+ }
|
|
|
+
|
|
|
+ for (let i = 0; i < array.length; i++) {
|
|
|
+ for (let j = 0; j < batchNoTableData.value.length; j++) {
|
|
|
+ if (obj[batchNoTableData.value[j].batchNo].includes(array[i].seqNo)) {
|
|
|
+ array[i].batchNoList.push(batchNoTableData.value[j].batchNo);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (searchSeqNo.value) {
|
|
|
+ const lowerCaseSearchValue = searchSeqNo.value.toLowerCase();
|
|
|
+ array = array.filter(
|
|
|
+ (item) =>
|
|
|
+ item.seqNo && item.seqNo.toLowerCase().includes(lowerCaseSearchValue)
|
|
|
+ );
|
|
|
+ }
|
|
|
+ return array;
|
|
|
+});
|
|
|
+const submit = async () => {
|
|
|
+ const array = ref([]);
|
|
|
+ batchNoTableData.value.forEach((item) => {
|
|
|
+ if (item.seqList.length > 0) {
|
|
|
+ array.value.push({
|
|
|
+ itemCode: props.showInfo.materialCode,
|
|
|
+ itemModel: props.showInfo.spec,
|
|
|
+ itemName: props.showInfo.materialName,
|
|
|
+ operationId: store.scanInfo.operationId,
|
|
|
+ operationName: store.scanInfo.operationName,
|
|
|
+ processId: store.scanInfo.id,
|
|
|
+ workOrderCode: store.odersData.workOrderCode,
|
|
|
+ trackBy: store1.user.username,
|
|
|
+ seqNoList: item.seqList,
|
|
|
+ batchNo: item.batchNo,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (array.value.length < 1) {
|
|
|
+ ElMessage.error("请先绑定物料！");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ const { code } = await saveFlBatch(array.value);
|
|
|
+ if (code == "200") {
|
|
|
+ ElMessage.success("采集成功！");
|
|
|
+ handleClose();
|
|
|
+ dataList();
|
|
|
+ }
|
|
|
+};
|
|
|
+//更新外部列表
|
|
|
+const dataList = () => {
|
|
|
+ emits("dataList");
|
|
|
+};
|
|
|
+
|
|
|
+const handleClose = () => {
|
|
|
+ emits("update:modelValue", false);
|
|
|
+};
|
|
|
+//当前所有管号
|
|
|
+const seqList = ref([]);
|
|
|
+
|
|
|
+watch(
|
|
|
+ () => props.showInfo,
|
|
|
+ async () => {
|
|
|
+ if (props.showInfo) {
|
|
|
+ await getSeqList();
|
|
|
+ setBatchNo();
|
|
|
+ setSeqTableData();
|
|
|
+ }
|
|
|
+ }
|
|
|
+);
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+.el-table .warning-row {
|
|
|
+ --el-table-tr-bg-color: var(--el-color-warning-light-9);
|
|
|
+}
|
|
|
+.el-table .success-row {
|
|
|
+ --el-table-tr-bg-color: var(--el-color-success-light-9);
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.selectInfo {
|
|
|
+ margin-bottom: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+:deep(.el-form-item) {
|
|
|
+ margin-bottom: 5px !important;
|
|
|
+}
|
|
|
+
|
|
|
+.sumFail {
|
|
|
+ color: black;
|
|
|
+}
|
|
|
+.sumOk {
|
|
|
+ color: green;
|
|
|
+}
|
|
|
+.describeText {
|
|
|
+ font-size: 20px !important;
|
|
|
+ font-weight: bolder;
|
|
|
+ color: black;
|
|
|
+}
|
|
|
+.searchInput {
|
|
|
+ height: 40px;
|
|
|
+}
|
|
|
+:deep(.el-input__wrapper) {
|
|
|
+ height: 40px !important;
|
|
|
+}
|
|
|
+:deep(.el-table__cell) {
|
|
|
+ font-size: 18px !important;
|
|
|
+}
|
|
|
+.el-divider {
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+.el-button {
|
|
|
+ width: 180px;
|
|
|
+ height: 40px;
|
|
|
+ font-size: 18px;
|
|
|
+ border-radius: 10px;
|
|
|
+}
|
|
|
+.describeText {
|
|
|
+ line-height: 25px !important;
|
|
|
+}
|
|
|
+.seqTable {
|
|
|
+ border-radius: 16px;
|
|
|
+}
|
|
|
+.boxTittle {
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bolder;
|
|
|
+ text-align: center;
|
|
|
+ height: 1vh;
|
|
|
+}
|
|
|
+.popUp {
|
|
|
+ position: fixed;
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ z-index: 999;
|
|
|
+ background-color: #00000030;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ backdrop-filter: blur(5px);
|
|
|
+ .header {
|
|
|
+ margin: 0;
|
|
|
+ .box {
|
|
|
+ width: 95vw;
|
|
|
+ height: 6vh;
|
|
|
+ background-color: #f1f3f5;
|
|
|
+ border-radius: 16px;
|
|
|
+ padding: 10px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-evenly;
|
|
|
+ .boxItem {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 0 5%;
|
|
|
+ .describeText {
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .body {
|
|
|
+ width: 100vw;
|
|
|
+ height: 85vh;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-evenly;
|
|
|
+ .container1 {
|
|
|
+ width: 60vw;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #f1f3f5;
|
|
|
+ border-radius: 16px;
|
|
|
+ padding: 10px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ .seqSearchInput {
|
|
|
+ margin-right: 10px;
|
|
|
+ width: 40%;
|
|
|
+ max-width: 360px;
|
|
|
+ }
|
|
|
+ .btns {
|
|
|
+ padding-top: 10px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-evenly;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .container2 {
|
|
|
+ width: 32vw;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #f1f3f5;
|
|
|
+ border-radius: 16px;
|
|
|
+ padding: 10px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ .seqSearchInput {
|
|
|
+ margin-right: 10px;
|
|
|
+ width: 40%;
|
|
|
+ max-width: 360px;
|
|
|
+ }
|
|
|
+ .btns {
|
|
|
+ height: 8vh;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-evenly;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.headerTittle {
|
|
|
+ width: 100%;
|
|
|
+ height: 55px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 55px;
|
|
|
+ font-size: 38px;
|
|
|
+ font-weight: 500;
|
|
|
+}
|
|
|
+</style>
|
