change(mes): 等同物料页面的物料选择下拉框改为对话框

- 在物料信息输入框中添加物料选择按钮
- 弹出对话框供用户选择物料
- 选择物料后自动填充物料 ID 和名称
- 新增物料名称字段以便显示和选择

src/api/mes/baseEqualMaterialInfo/types.ts

@@ -54,6 +54,11 @@ export interface BaseEqualMaterialInfoVO {
    */
   updateTime: string;
 
+  /**
+   * 物料名称
+   */
+  materialName: string;//映射字段
+
 }
 
 export interface BaseEqualMaterialInfoForm extends BaseEntity {
@@ -82,6 +87,11 @@ export interface BaseEqualMaterialInfoForm extends BaseEntity {
    */
   remark?: string;
 
+  /**
+   * 物料名称
+   */
+  materialName: string;//映射字段
+
 }
 
 export interface BaseEqualMaterialInfoQuery extends PageQuery {
@@ -110,6 +120,12 @@ export interface BaseEqualMaterialInfoQuery extends PageQuery {
      * 日期范围参数
      */
     params?: any;
+
+
+  /**
+   * 物料名称
+   */
+  materialName: string;//映射字段
 }
 
 

src/views/mes/baseEqualMaterialInfo/index.vue

@@ -91,15 +91,22 @@
 <!--        <el-form-item label="主键标识" prop="equalMaterialInfoId">
           <el-input v-model="form.equalMaterialInfoId" placeholder="请输入主键标识" />
         </el-form-item>-->
+
         <el-form-item label="物料" prop="materialId">
 <!--          <el-input v-model="form.materialId" placeholder="请输入物料ID" />-->
-          <el-select v-model="form.materialId" placeholder="请选择物料" clearable >
+<!--          <el-select v-model="form.materialId" placeholder="请选择物料" clearable >
             <el-option v-for="item in materialList"
                        :key="item.materialId"
                        :label="item.materialName"
                        :value="item.materialId"/>
-          </el-select>
+          </el-select>-->
+          <el-input v-model="form.materialName" placeholder="请点击检索物料" @click="handleMaterialAdd" readonly>
+            <template #append>
+              <el-icon class="el-input__icon" ><search/></el-icon>
+            </template>
+          </el-input>
         </el-form-item>
+
         <el-form-item label="等同物料ID" prop="equalMaterialId">
           <el-input v-model="form.equalMaterialId" placeholder="请输入等同物料ID" />
         </el-form-item>
@@ -123,6 +130,18 @@
         </div>
       </template>
     </el-dialog>
+
+
+    <!-- 添加物料信息对话框 -->
+    <el-dialog title="选择物料信息" v-model="materialOpen" width='1200px' append-to-body>
+      <MaterialSelect @selection="handleSelection" ref="materialSelectRef" v-if="materialOpen"></MaterialSelect>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitMaterialForm">确 定</el-button>
+        <el-button @click="materialOpen = false">取 消</el-button>
+      </div>
+    </el-dialog>
+
+
   </div>
 </template>
 
@@ -130,6 +149,7 @@
 import { listBaseEqualMaterialInfo, getBaseEqualMaterialInfo, delBaseEqualMaterialInfo, addBaseEqualMaterialInfo, updateBaseEqualMaterialInfo } from '@/api/mes/baseEqualMaterialInfo';
 import { BaseEqualMaterialInfoVO, BaseEqualMaterialInfoQuery, BaseEqualMaterialInfoForm } from '@/api/mes/baseEqualMaterialInfo/types';
 import {getBaseMaterialInfoList} from "@/api/mes/baseMaterialInfo";
+import MaterialSelect from '@/views/mes/baseMaterialInfo/addMaterial.vue';
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const { active_flag } = toRefs<any>(proxy?.useDict('active_flag'));
@@ -173,6 +193,8 @@ const initFormData: BaseEqualMaterialInfoForm = {
   equalMaterialId: undefined,
   activeFlag: '1',
   remark: undefined,
+
+  materialName: undefined,//映射字段
 }
 const data = reactive<PageData<BaseEqualMaterialInfoForm, BaseEqualMaterialInfoQuery>>({
   form: {...initFormData},
@@ -183,6 +205,9 @@ const data = reactive<PageData<BaseEqualMaterialInfoForm, BaseEqualMaterialInfoQ
     materialId: undefined,
     equalMaterialId: undefined,
     activeFlag: undefined,
+
+    materialName: undefined,//映射字段
+
     params: {
     }
   },
@@ -289,8 +314,24 @@ const getListsSelect = async() => {
   materialList.value = res.data;
 }
 
+/*     以下为添加物料信息对话框相关方法   */
+let materialSelectRef = ref();//物料选择对话框绑定
+const materialOpen = ref(false);//物料选择对话框显示
+/** 提交物料BOM信息按钮 */
+const submitMaterialForm = () => {
+  let selectedRow = materialSelectRef.value.tableRef.store.states.currentRow.value;
+
+    form.value.materialId = selectedRow.materialId
+    form.value.materialName = selectedRow.materialName
+    materialOpen.value = false;
+};
+/** 新增按钮操作 */
+const handleMaterialAdd = () => {
+  materialOpen.value = true;
+}
+
 onMounted(() => {
-  getListsSelect();
+  // getListsSelect();
   getList();
 });
 </script>