企业画像

src/api/riskPrevention/BusinessPortraits.ts

@@ -40,3 +40,15 @@ export function companyDelete(data) {
     data: data
   });
 }
+
+//区划查询
+export function getZoning(parentid,leveltype) {
+  return request({
+    url: '/api/city/list',
+    method: 'get',
+    params: {
+      parentid,
+      leveltype
+    }
+  });
+};

src/types/components.d.ts

@@ -27,11 +27,14 @@ declare module 'vue' {
     ElAutocomplete: typeof import('element-plus/es')['ElAutocomplete']
     ElBadge: typeof import('element-plus/es')['ElBadge']
     ElButton: typeof import('element-plus/es')['ElButton']
+    ElCard: typeof import('element-plus/es')['ElCard']
     ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
     ElCol: typeof import('element-plus/es')['ElCol']
     ElColorPicker: typeof import('element-plus/es')['ElColorPicker']
     ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
     ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
+    ElDescriptions: typeof import('element-plus/es')['ElDescriptions']
+    ElDescriptionsItem: typeof import('element-plus/es')['ElDescriptionsItem']
     ElDialog: typeof import('element-plus/es')['ElDialog']
     ElDivider: typeof import('element-plus/es')['ElDivider']
     ElDrawer: typeof import('element-plus/es')['ElDrawer']
@@ -49,6 +52,8 @@ declare module 'vue' {
     ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
     ElPopover: typeof import('element-plus/es')['ElPopover']
+    ElRadio: typeof import('element-plus/es')['ElRadio']
+    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElSelect: typeof import('element-plus/es')['ElSelect']
@@ -63,6 +68,7 @@ declare module 'vue' {
     ElTimelineItem: typeof import('element-plus/es')['ElTimelineItem']
     ElTooltip: typeof import('element-plus/es')['ElTooltip']
     ElTree: typeof import('element-plus/es')['ElTree']
+    ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
     ElUpload: typeof import('element-plus/es')['ElUpload']
     ExcelEditor: typeof import('./../components/ExcelEditor/index.vue')['default']
     FileUpload: typeof import('./../components/FileUpload/index.vue')['default']

src/views/riskPrevention/SafetyProductionManagement/BusinessPortraits.vue

@@ -7,9 +7,17 @@
           <div v-show="showSearch" class="mb-[10px]">
             <el-form ref="queryFormRef" :model="queryParams" :inline="true">
               <el-form-item :span="5" label="辖区县：" prop="area_code" label-width="auto">
-                <el-select v-model="queryParams.area_code" placeholder="全部" clearable>
-                  <el-option v-for="item in county" :key="item.value" :label="item.label" :value="item.value"></el-option>
-                </el-select>
+<!--                <el-select v-model="queryParams.area_code" placeholder="全部" clearable>-->
+<!--                  <el-option v-for="item in county" :key="item.value" :label="item.label" :value="item.value"></el-option>-->
+<!--                </el-select>-->
+                <el-tree-select
+                  v-model="region"
+                  lazy
+                  :load="loadNodes"
+                  node-key="id"
+                  :props="props"
+                  style="width: 240px"
+                />
               </el-form-item>
               <el-form-item  :span="5"  prop="keyword" label-width="auto">
                 <el-input
@@ -69,7 +77,7 @@
 
 <script setup lang="ts">
 import { ref,reactive, onMounted, onBeforeUnmount } from "vue";
-import {companyDelete, getCompanyList} from "@/api/riskPrevention/BusinessPortraits";
+import { companyDelete, getCompanyList, getZoning } from '@/api/riskPrevention/BusinessPortraits';
 import BussinessAdd from "@/views/riskPrevention/SafetyProductionManagement/BussinessAdd.vue";
 import BussinessEdit from "./BussinessEdit.vue";
 import {to} from "await-to-js";
@@ -86,6 +94,10 @@ const maxHeight = ref(window.innerHeight * 0.8);
 const total = ref();
 const selectedRow = ref();
 const selected = ref(0);
+const region = ref();
+const districtList = ref();
+const provinceList = ref();
+const cityList = ref();
 // 处理窗口大小变化
 const handleResize = () => {
   maxHeight.value = window.innerHeight * 0.8;
@@ -206,6 +218,35 @@ onBeforeUnmount(() => {
   window.removeEventListener('resize', handleResize);
 
 });
+
+const props = {
+  label: 'name',
+  children: 'children',
+  isLeaf: 'isLeaf',
+}
+// let id = 0
+const getDistrict = (id,level) => {
+  getZoning(id,level).then((res) => {
+    if (level === 1){
+      provinceList.value = res.data;
+    } else if (level === 2) {
+      cityList.value = res.data;
+    } else if (level === 3) {
+      districtList.value = res.data;
+    }
+  })
+}
+
+const loadNodes = (node, resolve) => {
+  const level = !!node.level ? node.level+1 : 1;
+  getZoning(node.data.id,level).then((res) => {
+    res.data.forEach((item) => {
+      item.isLeaf = level === 3;
+    })
+    resolve(res.data);
+  })
+}
+
 </script>
 
 <style lang="scss" scoped></style>

src/views/riskPrevention/SafetyProductionManagement/BussinessAdd.vue

@@ -12,19 +12,19 @@
             <el-form-item label="企业名称：" prop="company_name">
               <el-input v-model="form.company_name" placeholder="请输入企业名称" style="width: 468px" />
             </el-form-item>
-<!--            <el-form-item label="辖区省：" prop="province">-->
-<!--              <el-select v-model="form.province" placeholder="请选择辖区省">-->
-<!--                <el-option v-for="item in provinceList" :label="item.label" :value="item.value" />-->
-<!--              </el-select>-->
-<!--            </el-form-item>-->
-<!--            <el-form-item label="辖区市：" prop="city">-->
-<!--              <el-select v-model="form.city" placeholder="请选择辖区市">-->
-<!--                <el-option v-for="item in cityList" :label="item.label" :value="item.value" />-->
-<!--              </el-select>-->
-<!--            </el-form-item>-->
-            <el-form-item label="辖区县：" prop="district">
-              <el-select v-model="form.district" placeholder="请选择辖区县">
-                <el-option v-for="item in district_type" :label="item.label" :value="item.value" />
+            <el-form-item label="辖区省：" prop="province_code">
+              <el-select v-model="form.province_code" placeholder="请选择辖区省" @change="getDistrict(form.province_code,2)">
+                <el-option v-for="item in provinceList" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="辖区市：" prop="city_code">
+              <el-select v-model="form.city_code" placeholder="请选择辖区市" @change="getDistrict(form.city_code,3)">
+                <el-option v-for="item in cityList" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="辖区县：" prop="district_code">
+              <el-select v-model="form.district_code" placeholder="请选择辖区县">
+                <el-option v-for="item in districtList" :label="item.name" :value="item.id" />
               </el-select>
             </el-form-item>
             <el-form-item label="企业地址：" prop="company_address">
@@ -52,22 +52,25 @@
   </div>
 </template>
 <script setup lang="ts">
-import { ref, toRefs } from 'vue';
-import {addCompany, updateCompany} from "@/api/riskPrevention/BusinessPortraits";
+import { onMounted, ref, toRefs } from 'vue';
+import { addCompany, getZoning, updateCompany } from '@/api/riskPrevention/BusinessPortraits';
 import { validatePhone } from '@/utils/validate';
 const demoFormRef = ref(null);
 const buttonLoading = ref(false);
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const { enterprise_type, district_type } = toRefs<any>(proxy?.useDict('enterprise_type','district_type'));
 const emits = defineEmits(['close']);
+const districtList = ref();
+const provinceList = ref();
+const cityList = ref();
 let form = ref({
   company_name: '',
   province: '',
-  province_code: '440000000000',
+  province_code: '',
   city: '',
-  city_code: '440900000000',
+  city_code: '',
   district: '',
-  district_code: '2',
+  district_code: '',
   company_address: '',
   responsible_person: '',
   phone: '',
@@ -77,9 +80,9 @@ let form = ref({
 // 表单验证规则
 const rules = ref({
   company_name: [{ required: true, message: '请选择企业名称', trigger: 'blur' }],
-  province: [{ required: true, message: '请选择辖区省', trigger: 'change' }],
-  city: [{ required: true, message: '请选择辖区市', trigger: 'change' }],
-  district: [{ required: true, message: '请选择辖区县', trigger: 'change' }],
+  province_code: [{ required: true, message: '请选择辖区省', trigger: 'change' }],
+  city_code: [{ required: true, message: '请选择辖区市', trigger: 'change' }],
+  district_code: [{ required: true, message: '请选择辖区县', trigger: 'change' }],
   company_address: [{ required: true, message: '请选择企业地址', trigger: 'change' }],
   responsible_person: [{ required: true, message: '请选择企业负责人', trigger: 'change' }],
   phone: [
@@ -124,4 +127,20 @@ const cancel = () => {
   emits('close');
 };
 
+const getDistrict = (id,level) => {
+  getZoning(id,level).then((res) => {
+    if (level === 1) {
+      provinceList.value = res.data;
+    } else if (level === 2) {
+      cityList.value = res.data;
+    } else if (level === 3) {
+      districtList.value = res.data;
+    }
+  })
+}
+
+
+onMounted(() => {
+  getDistrict(100000,1);
+});
 </script>

src/views/riskPrevention/SafetyProductionManagement/BussinessEdit.vue

@@ -12,16 +12,16 @@
             <el-form-item label="企业名称：" prop="company_name">
               <el-input v-model="form.company_name" placeholder="请输入企业名称" style="width: 468px" />
             </el-form-item>
-<!--            <el-form-item label="辖区省：" prop="province">-->
-<!--              <el-select v-model="form.province" placeholder="请选择辖区省">-->
-<!--                <el-option v-for="item in provinceList" :label="item.label" :value="item.value" />-->
-<!--              </el-select>-->
-<!--            </el-form-item>-->
-<!--            <el-form-item label="辖区市：" prop="city">-->
-<!--              <el-select v-model="form.city" placeholder="请选择辖区市">-->
-<!--                <el-option v-for="item in cityList" :label="item.label" :value="item.value" />-->
-<!--              </el-select>-->
-<!--            </el-form-item>-->
+            <el-form-item label="辖区省：" prop="province">
+              <el-select v-model="form.province" placeholder="请选择辖区省">
+                <el-option v-for="item in provinceList" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="辖区市：" prop="city">
+              <el-select v-model="form.city" placeholder="请选择辖区市">
+                <el-option v-for="item in cityList" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
             <el-form-item label="辖区县：" prop="district">
               <el-select v-model="form.district" placeholder="请选择辖区县">
                 <el-option v-for="item in district_type" :label="item.label" :value="item.value" />
@@ -66,11 +66,11 @@ const props = defineProps<{ eventId: string }>();
 let form = ref({
   company_name: '',
   province: '',
-  province_code: '0',
+  province_code: '',
   city: '',
-  city_code: '1',
+  city_code: '',
   district: '',
-  district_code: '2',
+  district_code: '',
   company_address: '',
   responsible_person: '',
   phone: '',
@@ -132,4 +132,6 @@ const submitForm = async () => {
 const cancel = () => {
   emit('close');
 };
+
+
 </script>