<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-input 
 | 
        v-model="model.supplier" 
 | 
        label="厂家" 
 | 
        label-width="100px" 
 | 
        prop="supplier" 
 | 
        clearable 
 | 
        placeholder="请输入厂家" 
 | 
      /> 
 | 
    </wd-cell-group> 
 | 
    <wd-toast /> 
 | 
  </wd-form> 
 | 
</template> 
 | 
  
 | 
<script setup lang="ts"> 
 | 
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, // 数量 
 | 
  supplier: undefined, 
 | 
  type: "盘具", 
 | 
}); 
 | 
  
 | 
// 用于编辑时存储完整列表数据和当前编辑ID 
 | 
const allListData = ref<any[]>([]); 
 | 
const editId = ref<number>(); 
 | 
  
 | 
// 盘具类型字典数据 
 | 
const diskMaterialOptions = ref<Array<{ label: string; value: string }>>([]); 
 | 
const diskMaterialValue = ref(""); 
 | 
  
 | 
// 加载盘具类型字典数据 
 | 
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 handleDiskMaterialChange = (val: any) => { 
 | 
  model.diskMaterial = 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, 
 | 
        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.supplier = currentItem.supplier; 
 | 
    model.type = currentItem.type || "盘具"; 
 | 
    // 设置盘具类型的回显值 
 | 
    diskMaterialValue.value = currentItem.diskMaterial || ""; 
 | 
  } 
 | 
}; 
 | 
  
 | 
onLoad((options: any) => { 
 | 
  paramsId.value = options.id; 
 | 
}); 
 | 
  
 | 
onMounted(async () => { 
 | 
  await loadDiskMaterialDict(); 
 | 
}); 
 | 
  
 | 
// 监听编辑数据变化,自动回显 
 | 
watch( 
 | 
  () => props.editData, 
 | 
  (newData) => { 
 | 
    if (newData && props.mode === "edit") { 
 | 
      model.diskMaterial = newData.diskMaterial || ""; 
 | 
      model.model = newData.model || ""; 
 | 
      model.amount = newData.amount || ""; 
 | 
      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.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> 
 |