<template>
|
<wd-form ref="form" :model="model" class="relative form_box">
|
<wd-cell-group :border="true">
|
<wd-picker
|
v-model="diskMaterialValue"
|
:columns="diskMaterialOptions"
|
label="盘具类型"
|
label-width="100px"
|
prop="diskMaterial"
|
placeholder="请选择盘具类型"
|
clearable
|
@confirm="handleDiskMaterialChange"
|
/>
|
<wd-input
|
v-model="model.model"
|
label="尺寸"
|
label-width="100px"
|
prop="model"
|
clearable
|
placeholder="请输入尺寸"
|
/>
|
<wd-input
|
v-model="model.amount"
|
label="数量"
|
label-width="100px"
|
prop="amount"
|
clearable
|
placeholder="请输入数量"
|
/>
|
<wd-picker
|
v-model="model.unit"
|
:columns="unitOptions"
|
label="单位"
|
label-width="100px"
|
prop="unit"
|
placeholder="请选择单位"
|
clearable
|
@confirm="handleUnitChange"
|
/>
|
<wd-picker
|
v-model="model.supplier"
|
:columns="supplierOptions"
|
label="厂家"
|
label-width="100px"
|
prop="supplier"
|
placeholder="请选择厂家"
|
clearable
|
@confirm="handleSupplierChange"
|
/>
|
</wd-cell-group>
|
<wd-toast />
|
</wd-form>
|
</template>
|
|
<script setup lang="ts">
|
import { onMounted, watch } from "vue";
|
import useFormData from "@/hooks/useFormData";
|
import TwistApi from "@/api/product/twist";
|
import ManageApi from "@/api/product/manage";
|
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 toast = useToast();
|
const { form: model } = useFormData({
|
diskMaterial: undefined, // 盘具类型
|
model: undefined, // 尺寸
|
amount: undefined, // 数量
|
unit: "只", // 单位，默认值为"只"
|
supplier: undefined,
|
type: "盘具",
|
});
|
|
// 用于编辑时存储完整列表数据和当前编辑ID
|
const allListData = ref<any[]>([]);
|
const editId = ref<number>();
|
|
// 盘具类型字典数据
|
const diskMaterialOptions = ref<Array<{ label: string; value: string }>>([]);
|
const diskMaterialValue = ref("");
|
|
// 单位字典数据
|
const unitOptions = ref<Array<{ label: string; value: string }>>([]);
|
|
// 厂家字典数据
|
const supplierOptions = ref<Array<{ label: string; value: string }>>([]);
|
|
// 加载盘具类型字典数据
|
const loadDiskMaterialDict = async () => {
|
try {
|
const res = await ManageApi.dictAPI("disk_material");
|
if (res.data && Array.isArray(res.data)) {
|
diskMaterialOptions.value = res.data.map((item: any) => ({
|
label: item.dictLabel || "",
|
value: item.dictValue || "",
|
}));
|
}
|
} catch (error) {
|
console.error("加载盘具类型字典失败:", error);
|
}
|
};
|
|
// 加载单位字典数据
|
const loadUnitDict = async () => {
|
try {
|
const res = await ManageApi.dictAPI("technical_weight_unit");
|
if (res.data && Array.isArray(res.data)) {
|
unitOptions.value = res.data.map((item: any) => ({
|
label: item.dictLabel || "",
|
value: item.dictValue || "",
|
}));
|
// 设置默认值为"只"，如果字典中有"只"选项
|
const defaultOption = unitOptions.value.find(
|
(item) => item.label === "只" || item.value === "只"
|
);
|
if (defaultOption && !model.unit) {
|
model.unit = defaultOption.value;
|
}
|
}
|
} catch (error) {
|
// 加载字典失败，静默处理
|
}
|
};
|
|
// 加载厂家字典数据
|
const loadSupplierDict = async () => {
|
try {
|
const res = await ManageApi.dictAPI("factory");
|
if (res.data && Array.isArray(res.data)) {
|
supplierOptions.value = res.data.map((item: any) => ({
|
label: item.dictLabel || "",
|
value: item.dictValue || "",
|
}));
|
}
|
} catch (error) {
|
// 加载字典失败，静默处理
|
}
|
};
|
|
// 处理盘具类型选择
|
const handleDiskMaterialChange = (val: any) => {
|
model.diskMaterial = val.value;
|
};
|
|
// 处理单位选择
|
const handleUnitChange = (val: any) => {
|
model.unit = val.value;
|
};
|
|
// 处理厂家选择
|
const handleSupplierChange = (val: any) => {
|
model.supplier = val.value;
|
};
|
|
// 监听 model.diskMaterial 变化，同步选择器显示
|
watch(
|
() => model.diskMaterial,
|
(newValue) => {
|
diskMaterialValue.value = newValue || "";
|
},
|
{ immediate: true }
|
);
|
|
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, // 先保留原有的所有数据
|
diskMaterial: model.diskMaterial,
|
model: model.model,
|
amount: model.amount,
|
unit: model.unit,
|
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.diskMaterial = currentItem.diskMaterial;
|
model.model = currentItem.model;
|
model.amount = currentItem.amount;
|
model.unit = currentItem.unit || "只";
|
model.supplier = currentItem.supplier;
|
model.type = currentItem.type || "盘具";
|
// 设置盘具类型的回显值
|
diskMaterialValue.value = currentItem.diskMaterial || "";
|
}
|
};
|
|
onLoad((options: any) => {
|
paramsId.value = options.id;
|
});
|
|
onMounted(async () => {
|
await loadDiskMaterialDict();
|
await loadUnitDict();
|
await loadSupplierDict();
|
});
|
|
// 监听编辑数据变化，自动回显
|
watch(
|
() => props.editData,
|
(newData) => {
|
if (newData && props.mode === "edit") {
|
model.diskMaterial = newData.diskMaterial || "";
|
model.model = newData.model || "";
|
model.amount = newData.amount || "";
|
model.unit = newData.unit || "只";
|
model.supplier = newData.supplier || "";
|
model.type = newData.type || "盘具";
|
diskMaterialValue.value = newData.diskMaterial || "";
|
}
|
},
|
{ immediate: true, deep: true }
|
);
|
|
// 重置表单数据
|
const resetFormData = () => {
|
model.diskMaterial = undefined;
|
model.model = undefined;
|
model.amount = undefined;
|
model.unit = "只";
|
model.supplier = undefined;
|
model.type = "盘具";
|
diskMaterialValue.value = "";
|
};
|
|
defineExpose({
|
submit,
|
submitEdit,
|
setFormData,
|
resetFormData,
|
});
|
</script>
|
<style lang="scss" scoped>
|
.submit_btn {
|
position: absolute;
|
bottom: 0;
|
width: 100%;
|
}
|
</style>
|
