Browse Source

fix(部件电子档案,部件类型): 解决首次渲染下拉框失败问题

通过await等待,解决了首次渲染部件电子档案列表时状态不显示问题,通过添加一个状态,解决了部件类型中因为父组件异步请求,没有传输数据给子组件导致子组件首次渲染选择框没有文字信息的问题。
wyoujia 1 year ago
parent
commit
93adc1dac6

+ 2 - 2
admin.ui.plus-master/src/views/admin/product/components/form-edit.vue

@@ -10,7 +10,7 @@
         <el-row :gutter="35">
           <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
             <el-form-item label="部件类型" prop="type">
-              <el-select v-if="mapType" v-model="formData.editData.type" placeholder="请选择部件类型" >
+              <el-select  v-model="formData.editData.type" placeholder="请选择部件类型" >
                 <el-option v-for="(value, key) in mapType" :key="key" :label="value[1].name"  :value="Number(value[1].value)" />
               </el-select>
             </el-form-item>
@@ -27,7 +27,7 @@
           </el-col>
           <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
             <el-form-item label="状态" prop="status">
-              <el-select v-if="mapState" v-model="formData.editData.status" placeholder="请选择部件状态" >
+              <el-select  v-model="formData.editData.status" placeholder="请选择部件状态" >
                 <el-option v-for="(value, key) in mapState" :key="key" :label="value[1].name"  :value="Number(value[1].value)" />
               </el-select>
             </el-form-item>

+ 4 - 4
admin.ui.plus-master/src/views/admin/product/record/index.vue

@@ -271,12 +271,12 @@ const initComponentStatusType = async () => {
   },new Map());
 }
 
-onMounted(() => {
+onMounted(async () => {
   /**获取缓存 中化密钥、团标密钥*/
-  initComponentStatus()
+  await initComponentStatus()
   /**获取缓存 部件状态*/
-  initComponentStatusType()
-  onQuery()
+  await initComponentStatusType()
+  await onQuery()
 })
 
 

+ 10 - 7
admin.ui.plus-master/src/views/admin/product/type/index.vue

@@ -149,16 +149,16 @@
         class="fullscreen-image"
         alt="放大的图片"/>
     </el-dialog>
-    <EditDialog :mapType="mapType" :mapState="mapState" ref="editDialogRef" />
+    <EditDialog v-if="mapIsExist" :mapType="mapType" :mapState="mapState" ref="editDialogRef" />
   </div>
 </template>
 
 <script lang="ts" setup name="admin/product/bom">
-import {ref, reactive, onMounted, onBeforeMount, computed, defineAsyncComponent} from 'vue'
+import {ref, reactive, onMounted, onBeforeMount, defineAsyncComponent} from 'vue'
 import { ComponentTypeApi } from '/@/api/admin/productionManagement/ComponentType'
 // import dayjs from 'dayjs'
 import eventBus from '/@/utils/mitt'
-import { isImage } from '/@/utils/test'
+// import { isImage } from '/@/utils/test'
 import {FileGetPageOutput} from "/@/api/admin/data-contracts";
 import {PageInputFileGetPageDto} from "/@/api/admin/productionManagement/ComopnentDto";
 import {ComponentGetPageDto} from "/@/api/admin/productionManagement/ComponentTypeDto";
@@ -206,6 +206,8 @@ const getImg = (url) => {
 
 const editDialogRef = ref()
 
+const mapIsExist = ref(false)
+
 /**部件类型map*/
 const mapType = ref(new Map)
 
@@ -308,10 +310,11 @@ const initLocalState = async () => {
   },new Map());
 }
 
-onMounted(() => {
-  initLocalType()
-  initLocalState()
-  onQuery()
+onMounted(async () => {
+  await initLocalType()
+  await initLocalState()
+  await onQuery()
+  mapIsExist.value = true
   eventBus.off('refreshView')
   eventBus.on('refreshView', async () => {
     await onQuery()