<template>
|
<wd-form ref="form" :model="model" class="relative form_box">
|
<wd-cell-group :border="true">
|
<wd-input
|
v-model="model.model"
|
label="规格型号"
|
label-width="100px"
|
prop="model"
|
clearable
|
placeholder="请输入规格型号"
|
/>
|
<wd-input
|
v-model="model.monofilamentNumber"
|
label="样品编号"
|
label-width="100px"
|
prop="monofilamentNumber"
|
clearable
|
placeholder="请输入盘号"
|
/>
|
<wd-input
|
v-model="model.amount"
|
label="数量"
|
label-width="100px"
|
prop="amount"
|
clearable
|
placeholder="请输入长度"
|
/>
|
<wd-input
|
v-model="model.weight"
|
label="重量"
|
label-width="100px"
|
prop="weight"
|
clearable
|
placeholder="请输入重量"
|
/>
|
<wd-input
|
v-model="model.supplier"
|
label="厂家"
|
label-width="100px"
|
prop="supplier"
|
clearable
|
placeholder="请输入厂家"
|
/>
|
</wd-cell-group>
|
</wd-form>
|
</template>
|
|
<script lang="ts" setup>
|
import useFormData from "@/hooks/useFormData";
|
import TwistApi from "@/api/product/twist";
|
import { useToast } from "wot-design-uni";
|
|
const props = defineProps({
|
mode: {
|
type: String,
|
default: "add",
|
},
|
editData: {
|
type: Object,
|
default: null,
|
},
|
});
|
|
const emits = defineEmits(["refresh"]);
|
const paramsId = ref();
|
const editId = ref(); // 编辑时的ID
|
const allListData = ref<any[]>([]); // 存储完整列表数据
|
const toast = useToast();
|
const { form: model } = useFormData({
|
model: undefined, // 规格型号
|
monofilamentNumber: undefined, // 样品编号
|
amount: undefined, // 数量
|
weight: undefined, // 重量
|
supplier: undefined, // 厂家
|
type: "钢芯",
|
});
|
|
// 新增提交
|
const submit = async () => {
|
const { code } = await TwistApi.addStrandedWireDish([
|
{
|
wireId: paramsId.value,
|
...model,
|
},
|
]);
|
if (code == 200) {
|
toast.success("新增成功");
|
emits("refresh");
|
return true;
|
}
|
return false;
|
};
|
|
// 编辑提交(也走新增接口,提交整个列表)
|
const submitEdit = async (list?: any[], id?: number) => {
|
const currentList = list || allListData.value;
|
const currentId = id || editId.value;
|
|
if (!currentId) {
|
toast.error("缺少记录ID");
|
return false;
|
}
|
|
// 更新列表中对应的数据项
|
const updatedList = currentList.map((item) => {
|
if (item.id === currentId) {
|
// 保留原有数据,然后更新修改的字段
|
const updatedItem = {
|
...item, // 先保留原有的所有数据
|
model: model.model,
|
monofilamentNumber: model.monofilamentNumber,
|
amount: model.amount,
|
weight: model.weight,
|
supplier: model.supplier,
|
type: model.type,
|
};
|
return updatedItem;
|
}
|
return item;
|
});
|
|
// 提交整个列表
|
const { code } = await TwistApi.addStrandedWireDish(updatedList);
|
|
if (code == 200) {
|
toast.success("更新成功");
|
return true;
|
}
|
return false;
|
};
|
|
// 设置表单数据(用于编辑时回显)
|
const setFormData = (list: any[], currentEditId: number) => {
|
// 安全检查:确保list是数组
|
if (!Array.isArray(list)) {
|
console.error("setFormData: list 参数不是数组", list);
|
return;
|
}
|
|
// 存储完整列表数据
|
allListData.value = list;
|
editId.value = currentEditId;
|
|
// 找到当前编辑项并回显到表单
|
const currentItem = list.find((item) => item.id === currentEditId);
|
if (currentItem) {
|
model.model = currentItem.model;
|
model.monofilamentNumber = currentItem.monofilamentNumber;
|
model.amount = currentItem.amount;
|
model.weight = currentItem.weight;
|
model.supplier = currentItem.supplier;
|
model.type = currentItem.type || "钢芯";
|
}
|
};
|
|
// 监听编辑数据变化,自动回显
|
watch(
|
() => props.editData,
|
(newData) => {
|
if (newData && props.mode === "edit") {
|
model.model = newData.model || "";
|
model.monofilamentNumber = newData.monofilamentNumber || "";
|
model.amount = newData.amount || "";
|
model.weight = newData.weight || "";
|
model.supplier = newData.supplier || "";
|
model.type = newData.type || "钢芯";
|
}
|
},
|
{ immediate: true, deep: true }
|
);
|
|
// 重置表单数据
|
const resetFormData = () => {
|
model.model = undefined;
|
model.monofilamentNumber = undefined;
|
model.amount = undefined;
|
model.weight = undefined;
|
model.supplier = undefined;
|
model.type = "钢芯";
|
};
|
|
onLoad((options: any) => {
|
paramsId.value = options.id;
|
});
|
|
defineExpose({
|
submit,
|
submitEdit,
|
setFormData,
|
resetFormData,
|
});
|
</script>
|
|
<style lang="scss" scoped>
|
.submit_btn {
|
position: absolute;
|
bottom: 0;
|
width: 100%;
|
}
|
</style>
|