表单下拉数据修改

src/components/publicPageForm/index.vue

@@ -1,8 +1,8 @@
 <template>
-  <div class="PublicPageForm">
+  <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)" class="PublicPageForm">
     <el-form ref="ruleForm" :model="tableForm" :label-width="labelWidth">
       <el-row :gutter="20">
-        <el-col v-for="(item, index) in formItem" :key="index" :span="formType == 'horizontal' ? formSpan : 24">
+        <el-col v-for="(item, index) in formItemArr" :key="index" :span="formType == 'horizontal' ? formSpan : 24">
           <el-form-item :rules="fromDataReq(item)" :prop="item.columncode" :label="item.columnname">
             <template v-if="item.dropdownlist ||item.dropdownlist == 0">
               <el-select class="input-shadow" size="small" filterable default-first-option style="width: 100%" v-model="tableForm[item.columncode]" @change="changeSelect(item.columncode, item)" placeholder="请选择" clearable @clear="tableForm[item.columncode] = ''">
@@ -63,7 +63,9 @@ export default {
   data () {
     return {
       tableForm: {},
-      tableOptions: {}
+      tableOptions: {},
+      formItemArr: [],
+      loading: false
     }
   },
   watch: {
@@ -71,7 +73,8 @@ export default {
       handler (array) {
         this.getSelectData(array)
       },
-      deep: true
+      deep: true,
+      immediate: true
     },
     formData: {
       handler (obj) {
@@ -108,15 +111,39 @@ export default {
   methods: {
     //获取表单下拉数据
     getSelectData (formItem = []) {
+      this.loading = true
       if (!formItem.length || !Array.isArray(formItem)) return
       const formItemCopy = _.cloneDeep(formItem)
-      formItemCopy.map(async ({ dropdownlist, columncode }) => {
+      const [allResult, allResultKey] = [[], []]
+      formItemCopy.map(({ dropdownlist, columncode }) => {
         if (dropdownlist || dropdownlist == 0) {
           const datacontent = { filter: { 1: 1 } }
-          const { code, returnData } = await Query({ serviceid: dropdownlist, datacontent, event: '0' })
-          this.tableOptions[columncode] = code == 0 && returnData?.length ? returnData : []
+          allResultKey.push(columncode)
+          allResult.push(Query({ serviceid: dropdownlist, datacontent, event: '0' }))
         }
       })
+      this.getAnscyData(allResultKey, allResult, formItem)
+      this.loading = false
+    },
+    //获取异步数据
+    async getAnscyData (allResultKey = [], allResult = [], formItem = []) {
+      if (allResult.length && allResultKey.length) {
+        const results = await Promise.allSettled(allResult)
+        results.map((item, index) => {
+          const { status, value } = item
+          if (status == 'fulfilled') {
+            const { code, returnData } = value
+            this.tableOptions[allResultKey[index]] = code == 0 && returnData?.length ? returnData : []
+          }
+        })
+        this.formItemArr = formItem
+      } else {
+        this.formItemArr = formItem
+      }
+    },
+    //设置下拉数据
+    formatSelectData () {
+
     },
     //获取表单下拉数据
     changeSelect (code, item) { },