物料 材质 远程搜索

mes-ui/mes-ui-admin-vue3/src/views/heli/hlvuestyle/compositionSelect.vue

@@ -12,7 +12,12 @@
     :loading="Loading"
     @change="onSelectChange"
   >
-    <el-option v-for="item in compositionSelectList" :key="item.id" :label="item.name" :value="item.id" />
+    <el-option
+      v-for="item in compositionSelectList"
+      :key="item.id"
+      :label="item.name"
+      :value="item.id"
+    />
   </el-select>
 </template>
 
@@ -20,6 +25,8 @@
 import { ref, onMounted, toRefs } from 'vue'
 import * as CompositionApi from '@/api/heli/composition'
 const valueName: any = ref() //选中的值
+const valueNameObject: any = ref() //选中的值
+const emit = defineEmits(['update:newValue'])
 const compositionList = ref<CompositionApi.CompositionVO[]>([]) // 用户列表
 const compositionSelectList = ref<CompositionApi.CompositionVO[]>([])
 const Loading = ref(false)
@@ -35,7 +42,6 @@ onMounted(async () => {
   }
   try {
     const data = await CompositionApi.getCompositionPage(queryParams)
-    console.log(data.list)
     compositionList.value = data.list
     // 设置初始值，如果需要的话
     remoteMethod('')
@@ -57,5 +63,8 @@ const remoteMethod = (query: any) => {
     compositionSelectList.value = compositionList.value.slice(0, 10)
   }
 }
-
+const onSelectChange = (newValue: any) => {
+  valueNameObject.value = compositionList.value.find( composition =>  composition.id === newValue); // 更新选中的完整用户对象
+  emit('update:newValue', valueNameObject.value)
+}
 </script>

mes-ui/mes-ui-admin-vue3/src/views/heli/hlvuestyle/indexFrom.vue

@@ -26,10 +26,10 @@
         <SupplierSelect v-model="formData.supplierId"  @update:newValue="handleSelectedSupplier"  />
       </el-form-item>
       <el-form-item label="材质" prop="compositionId">
-        <CompositionSelect v-model="formData.compositionId" />
+        <CompositionSelect v-model="formData.compositionId" @update:newValue="handleSelectedComposition" />
       </el-form-item>
       <el-form-item label="物料" prop="materialId">
-        <MaterialSelect v-model="formData.materialId" />
+        <MaterialSelect v-model="formData.materialId" @update:newValue="handleSelectedMaterial" />
       </el-form-item>
     </el-form>
     <template #footer>
@@ -116,8 +116,7 @@ defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 /** 提交表单 */
 const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
 const submitForm = async () => {
-  alert(formData.value.parentId)
-  alert(formData.value.leaderUserId)
+ alert('提交表单 看打印台')
 }
 
 /** 重置表单 */
@@ -168,7 +167,19 @@ const handleSelectedClient = (newValue: any) => {
 }
 //接收供应商传递的数据
 const handleSelectedSupplier = (newValue: any) => {
-  console.log('接收客户对应的数据:', newValue)
+  console.log('接收供应商对应的数据:', newValue)
   formData.value.supplierId = newValue.id
 }
+
+//接收材质传递的数据
+const handleSelectedComposition = (newValue: any) => {
+  console.log('接收材质对应的数据:', newValue)
+  formData.value.compositionId = newValue.id
+}
+
+//接收物料传递的数据
+const handleSelectedMaterial = (newValue: any) => {
+  console.log('接收物料对应的数据:', newValue)
+  formData.value. materialId = newValue.id
+}
 </script>

mes-ui/mes-ui-admin-vue3/src/views/heli/hlvuestyle/materialSelect.vue

@@ -12,7 +12,7 @@
     :loading="Loading"
     @change="onSelectChange"
   >
-    <el-option v-for="item in materialSelectList" :key="item.id" :label="item.name" :value="item.id" />
+    <el-option v-for="item in materialSelectList" :key="item.id" :label="item.code+' '+item.name" :value="item.id" />
   </el-select>
 </template>
 
@@ -20,6 +20,8 @@
 import { ref, onMounted, toRefs } from 'vue'
 import * as MaterialApi from '@/api/heli/material'
 const valueName: any = ref() //选中的值
+const valueNameObject: any = ref() //选中的值
+const emit = defineEmits(['update:newValue'])
 const materialList = ref<MaterialApi.MaterialVO[]>([]) // 用户列表
 const materialSelectList = ref<MaterialApi.MaterialVO[]>([])
 const Loading = ref(false)
@@ -35,7 +37,6 @@ onMounted(async () => {
   }
   try {
     const data = await MaterialApi.getMaterialPage(queryParams)
-    console.log(data.list)
     materialList.value = data.list
     // 设置初始值，如果需要的话
     remoteMethod('')
@@ -50,7 +51,11 @@ const remoteMethod = (query: any) => {
     setTimeout(() => {
       Loading.value = false
       materialSelectList.value = materialList.value
-        .filter((item) => item.name.toLowerCase().includes(query.toLowerCase()))
+        .filter(
+          (item) =>
+            item.code.toLowerCase().includes(query.toLowerCase()) ||
+            item.name.toLowerCase().includes(query.toLowerCase())
+        )
         .slice(0, 10) //只显示前10个
     }, 200)
   } else {
@@ -58,4 +63,8 @@ const remoteMethod = (query: any) => {
   }
 }
 
+const onSelectChange = (newValue: any) => {
+  valueNameObject.value = materialList.value.find( material =>  material.id === newValue); // 更新选中的完整用户对象
+  emit('update:newValue', valueNameObject.value)
+}
 </script>