feat: dev

src/request/organization.ts

@@ -20,6 +20,9 @@ export type OrganizationType = {
     userName: string
     confirmPwd?: string,
     msgAuthCode?: string
+    cityId?: number
+    areaId?: number
+    provinceId?: number
 
 }
 
@@ -91,8 +94,9 @@ export const getCities = (provinceCode: string) => {
     });
 }
 
-export const getAreas = (provinceCode: string, cityCode: string) => {
-    return sendFetch<ResResult>(URL.getAreas + `?provinceCode=${provinceCode}&cityCode=${cityCode}`, {
+export const getAreas = (provinceCode: string, cityCode: string, zx?: boolean) => {
+    const url = zx ? URL.getAreas + `?provinceCode=${provinceCode}&cityCode=${cityCode}` : URL.getAreas + `?provinceCode=${provinceCode}&cityCode=${cityCode}&zx=true`
+    return sendFetch<ResResult>(url, {
         method: "get",
     });
 }

src/view/organization-add.vue

@@ -10,70 +10,36 @@
   "userName": "" -->
   <el-form label-width="100px" :model="data" :rules="rules" ref="baseFormRef">
     <el-form-item label="单位名称" prop="orgName" required>
-      <el-input
-        v-model.trim="data.orgName"
-        style="width: 300px"
-        :maxlength="50"
-        placeholder="请输入"
-      />
+      <el-input v-model.trim="data.orgName" style="width: 300px" :maxlength="50" placeholder="请输入" />
     </el-form-item>
     <el-form-item label="类型" prop="type" required>
       <!-- <el-input v-model="data.type" style="width: 300px" :maxlength="500" placeholder="请输入" /> -->
       <el-select style="width: 300px" v-model="data.type">
-        <el-option
-          :value="Number(key)"
-          :label="type"
-          v-for="(type, key) in OrganizationTypeDesc"
-        />
+        <el-option :value="Number(key)" :label="type" v-for="(type, key) in OrganizationTypeDesc" />
       </el-select>
     </el-form-item>
-    <el-form-item label="行政区划" prop="type">
+    <el-form-item label="行政区划">
       <el-cascader style="width: 300px" v-model="selectedValue" :props="lazyProps" :placeholder="'请选择地区'" clearable
         @change="handleChange" lazy />
     </el-form-item>
 
     <el-form-item label="上级单位" prop="parentId">
-      <el-tree-select
-        :check-strictly="true"
-        :props="{
+      <el-tree-select :check-strictly="true" :props="{
         value: 'orgId',
         label: (data: any) => data.orgName,
-      }"
-        style="width: 300px"
-        v-model="data.parentId"
-        :data="allOrgs"
-        node-key="orgId"
-        clearable
-      >
+      }" style="width: 300px" v-model="data.parentId" :data="allOrgs" node-key="orgId" clearable>
       </el-tree-select>
     </el-form-item>
     <el-form-item label="联系人" prop="contact" required>
-      <el-input
-        v-model.trim="data.contact"
-        style="width: 300px"
-        :maxlength="50"
-        placeholder="请输入"
-      />
+      <el-input v-model.trim="data.contact" style="width: 300px" :maxlength="50" placeholder="请输入" />
     </el-form-item>
     <el-form-item label="账号" prop="userName" required>
-      <el-input
-        v-model.trim="data.userName"
-        style="width: 300px"
-        :maxlength="11"
-        placeholder="请输入手机号"
-      />
+      <el-input v-model.trim="data.userName" style="width: 300px" :maxlength="11" placeholder="请输入手机号" />
     </el-form-item>
     <el-form-item label="密码" prop="password" required>
-      <el-input
-        autocomplete="off"
-        readonly
-        onfocus="this.removeAttribute('readonly');"
-        v-model.trim="data.password"
-        :type="addPassFlag ? 'text' : 'password'"
-        style="width: 300px"
-        :maxlength="500"
-        placeholder="请输入8-16位数字、字母大小写组合"
-      >
+      <el-input autocomplete="off" readonly onfocus="this.removeAttribute('readonly');" v-model.trim="data.password"
+        :type="addPassFlag ? 'text' : 'password'" style="width: 300px" :maxlength="500"
+        placeholder="请输入8-16位数字、字母大小写组合">
         <template #suffix>
           <span @click="addPassFlag = !addPassFlag" style="cursor: pointer">
             <el-icon v-if="addPassFlag">
@@ -101,7 +67,7 @@ import { getProvinces, getCities, getAreas } from '@/request/organization';
 import { View, Hide } from "@element-plus/icons-vue";
 // import { user } from '@/store/user'
 import { getOrgListFetchList } from "@/request";
-
+import type { CascaderProps, CascaderOption } from 'element-plus'
 const addPassFlag = ref(true); //图标显示标识
 const selectedValue = ref([])
 
@@ -163,6 +129,7 @@ onMounted(async () => {
   const data = await getOrgListFetchList();
   // console.log('allOrgs', data);
   allOrgs.value = data as any as SelectType[];
+  debugger
 });
 watch(
   data,
@@ -194,6 +161,7 @@ const lazyProps = ref<CascaderProps>({
 });
 
 
+
 const loadData = async (level, node) => {
   // 根据层级模拟数据
   console.log('level', level, node)
@@ -201,20 +169,30 @@ const loadData = async (level, node) => {
   switch (level) {
     case 0: // 加载省份
       const provinces = await getProvinces();
-      const resP = Array.from(provinces as any).map(p => {
-        p.leaf = false
+      const resP = Array.from(provinces as any as CascaderProps[]).map(p => {
         return p
       });
       return resP;
     case 1:
-      const cities = await getCities(node.province);
-      console.log('cities', node.province, cities)
+      let cities
+      if (node.zx) {
+        const areas = await getAreas(node.province, node.city);
+        console.log('areas', areas)
+        cities = Array.from(areas as any as CascaderOption[]).map(a => {
+          a.leaf = true
+          return a
+        })
+      } else {
+        cities = await getCities(node.province);
+        console.log('cities', node.province, cities);
+      }
+
       return cities
     // break;
     case 2: // 加载区县
       const areas = await getAreas(node.province, node.city)
       console.log('areas', areas)
-      return areas.map(a => {
+      return Array.from(areas as any as CascaderOption[]).map(a => {
         a.leaf = true
         return a
       })
@@ -222,7 +200,6 @@ const loadData = async (level, node) => {
       return [];
   }
 };
-
 // 处理选择事件
 const handleChange = (value: string) => {
   console.log('选中的省市区编码:', value);
@@ -235,6 +212,12 @@ defineExpose<QuiskExpose>({
       const res = await unref(baseFormRef)?.validate();
       if (res) {
         console.log("data", data.value);
+        if (selectedValue.value.length > 0) {
+          data.value.provinceId = selectedValue.value[0]
+          data.value.cityId = selectedValue.value[1]
+          data.value.areaId = selectedValue.value[2]
+        }
+
         await props.submit(data.value as any as OrganizationType);
       }
     } else {

src/view/organization-edit.vue

@@ -1,6 +1,7 @@
 <template>
 
   <el-form label-width="100px" :model="data" :rules="rules" ref="baseFormRef">
+
     <el-form-item label="单位名称" prop="orgName" required>
       <el-input v-model.trim="data.orgName" style="width: 300px" :maxlength="50" placeholder="请输入" />
     </el-form-item>
@@ -11,7 +12,7 @@
       </el-select>
     </el-form-item>
 
-    <el-form-item label="行政区划" prop="type">
+    <el-form-item label="行政区划">
       <el-cascader style="width: 300px" v-model="selectedValue" :props="lazyProps" :placeholder="'请选择地区'" clearable
         @change="handleChange" lazy />
     </el-form-item>
@@ -28,7 +29,7 @@ import { getProvinces, getCities, getAreas } from '@/request/organization';
 import { ref, reactive, unref, watchEffect, onMounted } from "vue";
 import { user } from '@/store/user'
 import { globalPasswordRex } from "@/util/regex";
-import type { CascaderProps } from 'element-plus'
+import type { CascaderProps, CascaderOption } from 'element-plus'
 // import areaData from '@/util/area.json';
 const selectedValue = ref([])
 
@@ -68,7 +69,10 @@ const data = ref<OrganizationType & {}>({
   parentId: 0,
   password: "",
   type: null,
-  userName: ""
+  userName: "",
+  provinceId: null,
+  cityId: null,
+  areaId: null,
 });
 
 const setParentId = () => {
@@ -80,8 +84,10 @@ const setParentId = () => {
 watchEffect(() => {
   if (props.org) {
     data.value = { ...props.org }
+    if (data.value.provinceId) {
+      selectedValue.value = [data.value.provinceId, data.value.cityId, data.value.areaId]
+    }
   }
-
 })
 
 
@@ -111,7 +117,7 @@ const loadData = async (level, node) => {
   switch (level) {
     case 0: // 加载省份
       const provinces = await getProvinces();
-      const resP = Array.from(provinces as any).map(p => {
+      const resP = Array.from(provinces as any as CascaderOption[]).map(p => {
         p.leaf = false
         return p
       });
@@ -121,6 +127,10 @@ const loadData = async (level, node) => {
       if (node.zx) {
         const areas = await getAreas(node.province, node.city);
         console.log('areas', areas)
+        cities = Array.from(areas as any as CascaderOption[]).map(a => {
+          a.leaf = true
+          return a
+        })
       } else {
         cities = await getCities(node.province);
         console.log('cities', node.province, cities);
@@ -131,7 +141,7 @@ const loadData = async (level, node) => {
     case 2: // 加载区县
       const areas = await getAreas(node.province, node.city)
       console.log('areas', areas)
-      return areas.map(a => {
+      return Array.from(areas as any as CascaderOption[]).map(a => {
         a.leaf = true
         return a
       })
@@ -152,6 +162,12 @@ defineExpose<QuiskExpose>({
       setParentId();
       const res = await unref(baseFormRef)?.validate();
       if (res) {
+        console.log("data", data.value);
+        if (selectedValue.value.length > 0) {
+          data.value.provinceId = selectedValue.value[0]
+          data.value.cityId = selectedValue.value[1]
+          data.value.areaId = selectedValue.value[2]
+        }
         await props.submit(data.value as any as OrganizationType);
       }
     } else {