<template>
|
<vol-box v-model="show" title="组盘" :width="800" :height="600">
|
<template #content>
|
<el-form :model="formData" label-width="100px">
|
<el-form-item label="条码" style="width: 50%">
|
<el-input type="text" v-model="palletCode" placeholder="请扫码条码"> </el-input>
|
</el-form-item>
|
|
<!-- 遍历物料列表 -->
|
<el-form-item v-for="(item, index) in formData.items" :key="index" style="width: 70%">
|
<el-select
|
size="mini"
|
clearable
|
filterable
|
v-model="item.MaterilName"
|
placeholder="请选择物料"
|
style="width: 45%; margin-right: 5%"
|
>
|
<!-- 避免使用与循环变量相同的item名称 -->
|
<el-option
|
v-for="material in GetMatetils()"
|
:value="material.value"
|
:label="material.text"
|
:key="material.value"
|
></el-option>
|
</el-select>
|
|
<!-- 数量应该是数字类型 -->
|
<el-input
|
v-model="item.num"
|
placeholder="请输入数量"
|
style="width: 35%; margin-right: 5%"
|
type="number"
|
></el-input>
|
|
<el-button v-if="index > 0" type="danger" @click="removeItem(index)">X</el-button>
|
</el-form-item>
|
</el-form>
|
|
<el-button type="primary" @click="addItem" style="margin-top: 10px;">
|
添加物料
|
</el-button>
|
</template>
|
|
<template #footer>
|
<span class="dialog-footer">
|
<el-button @click="show = false">取消</el-button>
|
<el-button type="primary" @click="submitForm">确认</el-button>
|
</span>
|
</template>
|
</vol-box>
|
</template>
|
|
<script>
|
import VolBox from "@/components/basic/VolBox.vue";
|
export default {
|
components: {
|
"vol-box": VolBox,
|
},
|
data() {
|
return {
|
formData: {
|
// 每个item应该是一个包含MaterilName和num的对象
|
items: [{ MaterilName: '', num: '' }],
|
},
|
palletCode: "",
|
show: false,
|
MatetilList: [] // 假设这里会被填充物料数据
|
};
|
},
|
methods: {
|
addItem() {
|
// 保持与初始数据结构一致，添加一个对象而不是数组
|
this.formData.items.push({ MaterilName: '', num: '' });
|
},
|
removeItem(index) {
|
this.formData.items.splice(index, 1);
|
},
|
|
// 获取物料信息
|
GetMatetils() {
|
// 简化代码，直接返回列表
|
return this.MatetilList;
|
},
|
|
submitForm() {
|
// 验证条码
|
if (!this.palletCode.trim()) {
|
this.$message.error("请扫码");
|
return;
|
}
|
|
// 验证至少有一个物料且数量有效
|
const hasValidItem = this.formData.items.some(item =>
|
item.MaterilName && item.num && Number(item.num) > 0
|
);
|
|
if (!hasValidItem) {
|
this.$message.error("请添加有效的物料和数量");
|
return;
|
}
|
|
var params = {
|
MainData: {
|
jsonData: JSON.parse(JSON.stringify(this.formData.items)),
|
palletCode: this.palletCode,
|
}
|
};
|
|
this.http.post("/api/BoxingInfo/AddBoxingInfo", params, true).then((x) => {
|
if (!x.status) {
|
this.$message.error(x.message);
|
} else {
|
this.$message.success("操作成功");
|
// 重置表单
|
this.palletCode = '';
|
this.formData.items = [{ MaterilName: '', num: '' }];
|
this.show = false;
|
// 通知父组件刷新数据
|
if (window.$vue && $vue.refresh) {
|
$vue.refresh();
|
}
|
}
|
}).catch(error => {
|
this.$message.error("提交失败：" + (error.message || "网络错误"));
|
});
|
},
|
},
|
};
|
</script>
|
|
<style scoped>
|
.container {
|
font-family: 'Inter', system-ui, sans-serif;
|
}
|
</style>
|
