|
@@ -17,24 +17,42 @@
|
|
<div
|
|
<div
|
|
v-for="(box, index) in merterielBoxes"
|
|
v-for="(box, index) in merterielBoxes"
|
|
:key="index"
|
|
:key="index"
|
|
- class="suit-box"
|
|
|
|
- @click="clickItem(box)"
|
|
|
|
|
|
+ :class="box.selected ? 'suit-box suit-box-select' : 'suit-box'"
|
|
>
|
|
>
|
|
- <div>
|
|
|
|
- <div class="suit-title">{{ box?.materialName }}</div>
|
|
|
|
- <div class="suit-desc">{{ box?.spec }}</div>
|
|
|
|
|
|
+ <div style="width: 100%">
|
|
|
|
+ <div class="suit-header">
|
|
|
|
+ <div>
|
|
|
|
+ <div class="suit-title">{{ box?.materialName }}</div>
|
|
|
|
+ <div class="suit-desc">{{ box?.spec }}</div>
|
|
|
|
+ </div>
|
|
|
|
+ <div>
|
|
|
|
+ <el-button
|
|
|
|
+ class="suit-btn"
|
|
|
|
+ round
|
|
|
|
+ :type="box.selected ? 'info' : 'primary'"
|
|
|
|
+ @click="clickItem(box)"
|
|
|
|
+ >
|
|
|
|
+ {{ box.selected ? "取消" : "添加" }}
|
|
|
|
+ </el-button>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
- <div>
|
|
|
|
|
|
+ <div style="width: 100%">
|
|
<div>
|
|
<div>
|
|
- <span class="suit-count">{{ box?.totalNum }}</span>
|
|
|
|
- <span class="suit-desc">{{ box?.unit }}</span>
|
|
|
|
|
|
+ <div class="suit-count">
|
|
|
|
+ <span>数量:</span><NumberInput v-model="box.totalNum" />
|
|
|
|
+ </div>
|
|
|
|
+ <span class="suit-desc">单位:{{ box?.unit }}</span>
|
|
</div>
|
|
</div>
|
|
- <div class="suit-desc">当前库存</div>
|
|
|
|
|
|
+ <!-- <div class="suit-desc">当前库存</div> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-scrollbar>
|
|
</el-scrollbar>
|
|
</div>
|
|
</div>
|
|
|
|
+ <el-button class="call-btn" round type="primary" @click="toCall">
|
|
|
|
+ 叫料
|
|
|
|
+ </el-button>
|
|
<ChangeCount
|
|
<ChangeCount
|
|
ref="changeCountRef"
|
|
ref="changeCountRef"
|
|
description="双面胶黑色"
|
|
description="双面胶黑色"
|
|
@@ -59,7 +77,36 @@ const changeRightEl = (row: any, index: number) => {
|
|
leftTreeIndex.value = index;
|
|
leftTreeIndex.value = index;
|
|
accessoriesDataList(index);
|
|
accessoriesDataList(index);
|
|
};
|
|
};
|
|
-
|
|
|
|
|
|
+const toCall = async () => {
|
|
|
|
+ let array = [];
|
|
|
|
+ for (let i = 0; i < merterielBoxes.value.length; i++) {
|
|
|
|
+ if (merterielBoxes.value[i].selected) {
|
|
|
|
+ array.push({
|
|
|
|
+ materialCode: merterielBoxes.value[i].materialNo,
|
|
|
|
+ num: merterielBoxes.value[i].totalNum,
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ sporadicCallItem({
|
|
|
|
+ materials: array,
|
|
|
|
+ processId: processStore.scanInfo.id,
|
|
|
|
+ workOrderCode: processStore.odersData.workOrderCode,
|
|
|
|
+ })
|
|
|
|
+ .then(() => {
|
|
|
|
+ ElMessage.success("叫料成功");
|
|
|
|
+ accessoriesDataList(leftTreeIndex.value, false);
|
|
|
|
+ merterielBoxes.value.forEach((element: any) => {
|
|
|
|
+ element.selected = false;
|
|
|
|
+ element.totalNum = 0;
|
|
|
|
+ });
|
|
|
|
+ })
|
|
|
|
+ .catch(() => {
|
|
|
|
+ merterielBoxes.value.forEach((element: any) => {
|
|
|
|
+ element.selected = false;
|
|
|
|
+ element.totalNum = 0;
|
|
|
|
+ });
|
|
|
|
+ });
|
|
|
|
+};
|
|
const cacheDataMap = ref(new Map());
|
|
const cacheDataMap = ref(new Map());
|
|
const accessoriesDataList = (index: number, cache: boolean = true) => {
|
|
const accessoriesDataList = (index: number, cache: boolean = true) => {
|
|
//对结果进行缓存 不频繁请求接口
|
|
//对结果进行缓存 不频繁请求接口
|
|
@@ -78,9 +125,12 @@ const accessoriesDataList = (index: number, cache: boolean = true) => {
|
|
// 获取数据
|
|
// 获取数据
|
|
loading.value = true;
|
|
loading.value = true;
|
|
accessoriesList(queryAccessoriesParam)
|
|
accessoriesList(queryAccessoriesParam)
|
|
- .then((res) => {
|
|
|
|
|
|
+ .then((res: any) => {
|
|
// console.log("onMounted", res.data);
|
|
// console.log("onMounted", res.data);
|
|
merterielBoxes.value = res.data;
|
|
merterielBoxes.value = res.data;
|
|
|
|
+ merterielBoxes.value.forEach((element: any) => {
|
|
|
|
+ element.selected = false;
|
|
|
|
+ });
|
|
cacheDataMap.value.set(index, res.data);
|
|
cacheDataMap.value.set(index, res.data);
|
|
})
|
|
})
|
|
.finally(() => {
|
|
.finally(() => {
|
|
@@ -97,28 +147,37 @@ onMounted(() => {
|
|
// =========叫料数量
|
|
// =========叫料数量
|
|
const changeCountRef = ref<InstanceType<typeof ChangeCount>>();
|
|
const changeCountRef = ref<InstanceType<typeof ChangeCount>>();
|
|
const clickItem = (box: any) => {
|
|
const clickItem = (box: any) => {
|
|
- changeCountRef.value?.showDialog(box.totalNum, (value: number) => {
|
|
|
|
- sporadicCallItem({
|
|
|
|
- materials: [
|
|
|
|
- {
|
|
|
|
- materialName: box.materialCode,
|
|
|
|
- num: value,
|
|
|
|
- },
|
|
|
|
- ],
|
|
|
|
- processId: processStore.scanInfo.id,
|
|
|
|
- workOrderCode: processStore.odersData.workOrderCode,
|
|
|
|
- }).then(() => {
|
|
|
|
- ElMessage.success("叫料成功");
|
|
|
|
- accessoriesDataList(leftTreeIndex.value, false);
|
|
|
|
- });
|
|
|
|
- });
|
|
|
|
|
|
+ box.selected = !box.selected;
|
|
|
|
+ // changeCountRef.value?.showDialog(box.totalNum, (value: number) => {
|
|
|
|
+ // sporadicCallItem({
|
|
|
|
+ // materials: [
|
|
|
|
+ // {
|
|
|
|
+ // materialName: box.materialCode,
|
|
|
|
+ // num: value,
|
|
|
|
+ // },
|
|
|
|
+ // ],
|
|
|
|
+ // processId: processStore.scanInfo.id,
|
|
|
|
+ // workOrderCode: processStore.odersData.workOrderCode,
|
|
|
|
+ // }).then(() => {
|
|
|
|
+ // ElMessage.success("叫料成功");
|
|
|
|
+ // accessoriesDataList(leftTreeIndex.value, false);
|
|
|
|
+ // });
|
|
|
|
+ // });
|
|
};
|
|
};
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
.container-desperse {
|
|
.container-desperse {
|
|
display: flex;
|
|
display: flex;
|
|
-
|
|
|
|
|
|
+ position: relative;
|
|
|
|
+ .call-btn {
|
|
|
|
+ position: fixed;
|
|
|
|
+ height: 80px;
|
|
|
|
+ width: 200px;
|
|
|
|
+ font-size: 24px;
|
|
|
|
+ top: 80px;
|
|
|
|
+ left: 650px;
|
|
|
|
+ }
|
|
.left {
|
|
.left {
|
|
width: 300px;
|
|
width: 300px;
|
|
|
|
|
|
@@ -128,6 +187,7 @@ const clickItem = (box: any) => {
|
|
line-height: 80px;
|
|
line-height: 80px;
|
|
height: 80px;
|
|
height: 80px;
|
|
border-radius: 40px;
|
|
border-radius: 40px;
|
|
|
|
+ font-size: $f24;
|
|
|
|
|
|
&:hover {
|
|
&:hover {
|
|
color: #1482f0;
|
|
color: #1482f0;
|
|
@@ -156,8 +216,19 @@ const clickItem = (box: any) => {
|
|
|
|
|
|
grid-template-columns: 1fr 1fr 1fr;
|
|
grid-template-columns: 1fr 1fr 1fr;
|
|
overflow-y: auto;
|
|
overflow-y: auto;
|
|
-
|
|
|
|
|
|
+ .suit-header {
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+ width: 100%;
|
|
|
|
+ }
|
|
|
|
+ .suit-btn {
|
|
|
|
+ font-size: $f24;
|
|
|
|
+ padding: 20px;
|
|
|
|
+ }
|
|
.suit-box {
|
|
.suit-box {
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ border: 2px solid white;
|
|
height: 210px;
|
|
height: 210px;
|
|
background-color: white;
|
|
background-color: white;
|
|
border-radius: 16px 16px 16px 16px;
|
|
border-radius: 16px 16px 16px 16px;
|
|
@@ -180,6 +251,9 @@ const clickItem = (box: any) => {
|
|
font-size: 38px;
|
|
font-size: 38px;
|
|
color: rgba(0, 0, 0, 0.9);
|
|
color: rgba(0, 0, 0, 0.9);
|
|
text-align: left;
|
|
text-align: left;
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ justify-content: space-between;
|
|
}
|
|
}
|
|
|
|
|
|
.suit-desc {
|
|
.suit-desc {
|
|
@@ -188,5 +262,8 @@ const clickItem = (box: any) => {
|
|
text-align: left;
|
|
text-align: left;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+ .suit-box-select {
|
|
|
|
+ border: 2px solid #0a59f7 !important;
|
|
|
|
+ }
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|