fix

src/api/common.js

@@ -1,10 +1,13 @@
 import fetch from '../api/fetch.js'
 
 export default {
-    dicList(params) {
-        return fetch('/blade-system/dict-biz/dictionary', params)
-    },
-    submit(params) { //保存上传文件素材
-        return fetch('/wutong-library/library/save', params, 'post', 'json')
-    },
+  dicList (params) {
+    return fetch('/blade-system/dict-biz/dictionary', params)
+  },
+  submit (params) { // 保存上传文件素材
+    return fetch('/wutong-library/library/save', params, 'post', 'json')
+  },
+  basicFormRequest (url) {
+    return fetch(url)
+  }
 }

src/components/basic-form/index.vue

@@ -1,17 +1,18 @@
 <template>
   <div class=' padding-bottom padding-right'>
-    <el-form v-for='item in option.column' :key='item.label' :class='option.detail ? "grey-fa-bg" : "white-bg" '
+    <el-empty v-if='form === null' description='暂无数据'></el-empty>
+    <el-form v-else v-for='item in option.column' :key='item.label' :class='option.detail ? "grey-fa-bg" : "white-bg" '
              :label-width='option.hasOwnProperty("labelWidth") ? option.labelWidth : "150px" '
              class='form'>
       <!--      input-->
-      <xsub :option='option' :item='item'/>
+      <xsub :option='option' :item='item' :form='form' :disable='option.detail'/>
       <!--row-->
       <el-col v-if='item.type === "row" ' :span='24' class='flex full-width '>
         <div class='flex full-width'>
           <div v-for='sub in item.children' :key='sub.label' class='full-width sub-item'>
             <el-col :span='24'>
               <div class='full-width item '>
-                <xsub :option='option' :item='sub'/>
+                <xsub :option='option' :item='sub' :form='form' :disable='option.detail'/>
               </div>
             </el-col>
           </div>
@@ -35,7 +36,9 @@ export default {
   watch: {
     data: {
       handler (val) {
-        this.form = val
+        if (val) {
+          this.form = val
+        }
       },
       immediate: true
     },
@@ -48,7 +51,7 @@ export default {
   },
   data () {
     return {
-      form: {},
+      form: null,
       disable: true
     }
   }

src/components/basic-form/sub.vue

@@ -9,9 +9,9 @@
             </div>
           </template>
           <div class='full-width text-left flex full-width'>
-            <input v-model='form[item.prop]' :disabled='option.detail' :placeholder='`请输入` + item.label'
+            <input v-model='form[item.prop]' :disabled='disable' :placeholder='`请输入` + item.label'
                    class='full-width'/>
-            <el-icon v-if='!option.detail' class="padding-right">
+            <el-icon v-if='!disable' class="padding-right">
               <edit/>
             </el-icon>
           </div>
@@ -30,19 +30,19 @@
           </template>
           <div class='full-width flex flex-align-start full-height text-left full-width'
                style='white-space: pre-wrap;text-overflow: ellipsis;'>
-              <textarea v-model='form[item.prop]' :disabled='option.detail'
+              <textarea v-model='form[item.prop]' :disabled='disable'
                         :placeholder='`请输入` + item.label'
                         :style='`height:` + item.rows * 35 + `px`'
                         class='full-width padding-right full-height padding-top'
                         style='line-height:20px;resize:none '/>
-            <el-icon v-if='!option.detail' class="padding-right padding-top">
+            <el-icon v-if='!disable' class="padding-right padding-top">
               <edit/>
             </el-icon>
           </div>
         </el-form-item>
       </div>
     </el-col>
-<!--    autoinput-->
+    <!--    autoinput-->
     <el-col v-if='item.type ==="autoInput" ' :style='`height:` + item.rows * 35 + `px`' class='full-width'>
       <div class='flex item full-width'>
         <el-form-item class='full-width '>
@@ -54,8 +54,41 @@
           </template>
           <div class='full-width flex flex-align-start full-height text-left full-width'
                style='white-space: pre-wrap;text-overflow: ellipsis;'>
-              <el-button>input</el-button>
-            <el-icon v-if='!option.detail' class="padding-right padding-top">
+            <el-select v-model="item.data" class="m-2" :placeholder="`请选择${item.label}`" @change='change'>
+              <el-option
+                  v-for="item in item.dict"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+              />
+            </el-select>
+            <el-icon v-if='!disable' class="padding-right padding-top">
+              <edit/>
+            </el-icon>
+          </div>
+        </el-form-item>
+      </div>
+    </el-col>
+    <el-col v-if='item.type ==="select" ' :style='`height:` + item.rows * 35 + `px`' class='full-width'>
+      <div class='flex item full-width'>
+        <el-form-item class='full-width '>
+          <template v-slot:label>
+            <div :style='`height:` + item.rows * 35 + `px`'
+                 class='label white-bg full-width text-left padding-left bold'>
+              {{ item.label }}
+            </div>
+          </template>
+          <div class='full-width flex flex-align-start full-height text-left full-width'
+               style='white-space: pre-wrap;text-overflow: ellipsis;'>
+            <el-select v-model="item.data" class="m-2" :placeholder="`请选择${item.label}`" @change='change'>
+              <el-option
+                  v-for="item in item.dict"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+              />
+            </el-select>
+            <el-icon v-if='!disable' class="padding-right padding-top">
               <edit/>
             </el-icon>
           </div>
@@ -69,21 +102,76 @@
 export default {
   name: 'sub',
   props: {
-    option: {
+    form: {
       type: Object,
       default: null
     },
     item: {
       type: Object,
       default: null
+    },
+    disable: {
+      type: Boolean,
+      default: false
+    }
+  },
+  watch: {
+    item: {
+      handler (val) {
+        if (val.type === 'autoInput') {
+          const tmp = {
+            dict: '/blade-system/region/lazy-tree?parentCode=00',
+            props: {
+              label: 'title',
+              value: 'key'
+            }
+          }
+          val.expand = JSON.stringify(tmp, null, 4)
+          val.expand = JSON.parse(val.expand)
+          this.getDic(val.expand).then(res => {
+            val.dict = res
+          })
+          console.log(val.dict)
+        } else if (val.type === 'area') {
+          const tmp = {
+            dict: '/blade-system/region/lazy-tree?parentCode=00',
+            props: {
+              label: 'title',
+              value: 'key'
+            }
+          }
+          val.expand = JSON.stringify(tmp, null, 4)
+          val.expand = JSON.parse(val.expand)
+          this.getDic(val.expand).then(res => {
+            val.dict = res
+          })
+          console.log(val.dict)
+        }
+      },
+      immediate: true
     }
   },
   data () {
     return {
-      form: {},
-      disable: true
+      data: {},
+      dic: []
+    }
+  },
+  methods: {
+    async getDic (expand) {
+      const tmp = await this.$api.common.basicFormRequest(expand.dict)
+      return tmp.data.map(item => {
+        item.label = item[expand.props.label]
+        item.value = item[expand.props.value]
+        return item
+      })
+    },
+    change (res) {
+      console.log(res)
     }
+
   }
+
 }
 </script>
 

vite.config.js

@@ -33,8 +33,8 @@ export default defineConfig({
     proxy: {
       '/api': {
         // 正式环境地址
-        // target: 'https://dev.wutongresearch.club/api',
-        target: 'http://192.168.31.181:8110',
+        target: 'https://dev.wutongresearch.club/api',
+        // target: 'http://192.168.31.181:8110',
         changeOrigin: true,
         rewrite: (path) => path.replace(/^\/api/, '')
       }