列表页查询项

src/views/modules/sys/dept-add-or-update.vue

@@ -18,13 +18,8 @@
         <el-input v-model="dataForm.partyCode"
                   :placeholder="$t('dept.partyCode')"></el-input>
       </el-form-item>
-<!--      <el-form-item prop="allAreaCode"-->
-<!--                    :label="$t('dept.areaCode')">-->
-<!--        <el-input v-model="dataForm.allAreaCode"-->
-<!--                  :placeholder="$t('dept.areaCode')"></el-input>-->
-<!--      </el-form-item>-->
       <el-form-item prop="allAreaCode" :label="$t('dept.areaCode')">
-        <el-cascader v-model="dataForm.allAreaCode" :options="areaCodeOptions" :props="optionProps" clearable>
+        <el-cascader v-model="dataForm.allAreaCode" :options="areaCodeOptions" :props="optionProps" style="width: 320px" clearable>
         </el-cascader>
       </el-form-item>
       <el-form-item prop="parentName"

src/views/modules/sys/dept.vue

@@ -3,7 +3,8 @@
     <div class="mod-sys__dept">
       <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
         <el-form-item>
-          <el-input v-model="dataForm.areaCode" :placeholder="$t('dept.areaCode')" clearable></el-input>
+          <el-cascader v-model="dataForm.allAreaCode" :options="areaCodeOptions" :props="optionProps" style="width: 320px" change-on-select @change="changeAreaCodeParam" clearable>
+          </el-cascader>
         </el-form-item>
         <el-form-item>
           <el-button @click="getDataList()">{{ $t('query') }}</el-button>
@@ -41,12 +42,39 @@ export default {
       mixinViewModuleOptions: {
         getDataListURL: '/sys/dept/list',
         deleteURL: '/sys/dept'
-      }
+      },
+      dataForm: {
+        allAreaCode: ''
+      },
+      optionProps: {
+        value: 'code',
+        label: 'name',
+        children: 'children'
+      },
+      areaCodeOptions:[]
     }
   },
   components: {
     TableTreeColumn,
     AddOrUpdate
+  },
+  mounted() {
+    this.getAreaCodeOption()
+  },
+  methods: {
+    // 获取区域编码
+    getAreaCodeOption () {
+      return this.$http.get('/sys/dept/getEpmetAreaCode',{ params: { rootAreaCode: '370124', rootAreaLevel: 'province' }}).then(({ data: res }) => {
+        if (res.code !== 0) {
+          return this.$message.error(res.msg)
+        }
+        this.areaCodeOptions = res.data
+      }).catch(() => { })
+    },
+    changeAreaCodeParam () {
+      console.log(this.dataForm.allAreaCode)
+      this.dataForm.allAreaCode = this.dataForm.allAreaCode.toString()
+    }
   }
 }
 </script>