修改bug

This commit is contained in:
wangyilin 2024-11-01 17:13:51 +08:00
parent c230692bda
commit e23a2618f6
2 changed files with 101 additions and 16 deletions

View File

@ -28,7 +28,15 @@
<a-input :allowClear="true" v-model:value="formDate.nature"/>
</a-form-item>
<a-form-item label="行政区划" name="administrativeDivisionCodes">
<a-cascader v-model:value="formDate.administrativeDivisionCodes" :show-search="{ filter }" :options="administrativeDivisionTree" @change="searchAdministrativeDivisionTree" />
<a-cascader
v-model:value="formDate.administrativeDivisionCodes"
:options="administrativeDivisionTree"
:load-data="loadData"
:show-search="{ filter }"
@change="searchAdministrativeDivisionTree"
placeholder="请选择行政区划"
change-on-select
/>
</a-form-item>
<a-form-item label="营业执照" name="businessLicense">
<SingleImageFileUpload v-model:value="formDate.businessLicense" ref="fileUpload"></SingleImageFileUpload>
@ -73,7 +81,7 @@ import type { Rule } from 'ant-design-vue/es/form';
import type { ShowSearchType } from 'ant-design-vue/es/cascader';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import api from "@/axios";
import {message, Modal} from 'ant-design-vue';
import {CascaderProps, message, Modal} from 'ant-design-vue';
import SingleImageFileUpload from "@/components/upload/SingleImageFileUpload.vue";
import {useRouter} from "vue-router";
import {formDatePort, statusPort} from "@/types/views/enterprise.ts";
@ -119,11 +127,36 @@ const rules: Record<string, Rule[]> = {
// 1
const DivisionTree = async ()=>{
const resp = await api.get<TreeNodeVo<string>[]>('/common/administrativeDivisionTree')
const resp = await api.get<TreeNodeVo<string>[]>('/common/administrativeDivisionByParentCode',{parentCode:'0'})
administrativeDivisionTree.value = resp.data as TreeNodeVo<string>[]
}
const loadData: CascaderProps['loadData'] = async selectedOptions => {
const targetOption = selectedOptions[selectedOptions.length - 1];
targetOption.loading = true;
const resp = await api.get<TreeNodeVo<string>[]>('/common/administrativeDivisionByParentCode',{parentCode:targetOption.value})
targetOption.loading = false;
targetOption.children = [administrativeDivisionTree.value,...resp.data]
};
//
const transformData = (val:any,tree:any)=>{
for(let i = 0; i< val.length - 1;i++){
tree.forEach(async(item:any)=>{
if(item.value === val[i]){
item.children = []
let data = await api.get<TreeNodeVo<string>[]>('/common/administrativeDivisionByParentCode',{parentCode:val[i]})
item.children = data.data.map((items:any)=>{
return {
label:items.label,
value:items.value
}
})
transformData(val,item.children)
}
})
}
}
// 2
const filter: ShowSearchType['filter'] = (inputValue, path) => {
return path.some(option => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1);
@ -133,6 +166,10 @@ const filter: ShowSearchType['filter'] = (inputValue, path) => {
const searchAdministrativeDivisionTree = (e:Array<string>)=>{
formDate.value.administrativeDivisionCodes = e as any
}
//
const onFinish = async ()=>{
//
@ -153,7 +190,12 @@ const onFinish = async ()=>{
const resp = await api.post('/common/securityUnitRegister',securityUnitRegisterParams)
message.success(resp.message)
fileUpload.value.fileDelete()
await formDateRef.value.resetFields() //
await resetForm()
}
//
const resetForm = async ()=>{
await formDateRef.value.resetFields()
formDate.value = {
name:'',
socialCode:'',
@ -164,11 +206,7 @@ const onFinish = async ()=>{
address:'',
nature:''
}
}
//
const resetForm = ()=>{
formDateRef.value.resetFields()
fileUpload.value.fileDelete()
}
//
@ -214,6 +252,9 @@ const showConfirm = (columnsDate:dataStatus) => {
};
onMounted( async ()=>{
await DivisionTree()
await transformData(formDate.value.administrativeDivisionCodes,administrativeDivisionTree.value)
})
</script>

View File

@ -1,11 +1,55 @@
<template>
<div>test</div>
<div style="margin: 100px auto;width: 500px">
<a-cascader
style="width: 500px"
v-model:value="value"
:options="options"
:load-data="loadData"
placeholder="请选择行政区划"
change-on-select
/>
{{value}}
</div>
</template>
<script setup lang="ts">
<script lang="ts" setup>
import {onMounted, ref} from 'vue';
import type {CascaderProps} from 'ant-design-vue';
import api from "@/axios";
const options = ref<CascaderProps['options']>([]);
const DivisionTree = async ()=>{
const resp = await api.get<TreeNodeVo<string>[]>('/common/administrativeDivisionByParentCode',{parentCode:'0'})
options.value = resp.data as TreeNodeVo<string>[]
}
const loadData: CascaderProps['loadData'] = async selectedOptions => {
const targetOption = selectedOptions[selectedOptions.length - 1];
targetOption.loading = true;
const resp = await api.get<TreeNodeVo<string>[]>('/common/administrativeDivisionByParentCode',{parentCode:targetOption.value})
targetOption.loading = false;
targetOption.children = [options.value,...resp.data]
};
const transformData = (val:any,tree:any)=>{
for(let i = 0; i< val.length - 1;i++){
tree.forEach(async(item:any)=>{
if(item.value === val[i]){
item.children = []
let data = await api.get<TreeNodeVo<string>[]>('/common/administrativeDivisionByParentCode',{parentCode:val[i]})
item.children = data.data.map((items:any)=>{
return {
label:items.label,
value:items.value,
isLeaf:items.isLeaf
}
})
transformData(val,item.children)
}
})
}
}
const value = ref<string[]>( [ "120000", "120100", "120115", "120115014" ]);
onMounted(async () => {
await DivisionTree()
await transformData(value.value,options.value)
});
</script>
<style scoped lang="scss">
</style>