修改行政区划
This commit is contained in:
parent
13adeedf5a
commit
43db18b67b
|
@ -8,7 +8,7 @@ VITE_APP_BASE_API=/api
|
|||
VITE_APP_PROXY_URL=http://172.10.10.93:8765
|
||||
|
||||
# rsa 公钥
|
||||
VITE_APP_RSA_PUBLIC_KEY=MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCpu1C3JHZ+Ng/eVVCZtwKsOZv9RktpAL13pKy4FoRHyNv2t8TPV2AMzLzfEzlWx001nBxyVxEMR2N9jAcqFLHv7r16ciOzbtzB9dky2G+bc9jIs4/EdVK5bAZcPRh5Jrb78sC9PHyR4AeceDyCIKHLUbWBJB4NTZE0s1Wh5kMynQIDAQAB
|
||||
VITE_APP_RSA_PUBLIC_KEY=MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDJps/EXxxSpEM1Ix4R0NWIOBciHCr7P7coDT8tNKfelgR7txcJOqHCO/MIWe7T04aHQTcpQxqx9hMca7dbqz8TZpz9jvLzE/6ZonVKxHsoFnNlHMp1/CPAJ9f6D9wYicum2KltJkmQ0g//D9W2zPCYoGOmSRFcZx/KEBa4EM53jQIDAQAB
|
||||
# minio
|
||||
VITE_APP_MINIO_URL=http://118.253.177.137:9000
|
||||
VITE_APP_MINIO_BUCKET=police-security-dev
|
||||
|
|
|
@ -97,6 +97,12 @@
|
|||
:allowClear="item.componentsProps?.allowClear ?? true"
|
||||
:options="item.options"
|
||||
/>
|
||||
<AdministrativeDivisionsTree
|
||||
v-else-if="item.type ==='administrativeDivisionsTree'"
|
||||
style="width: 100%"
|
||||
v-model:value="modelValue[field]"
|
||||
v-bind="item.componentsProps"
|
||||
/>
|
||||
<a-range-picker
|
||||
v-else-if="item.type ==='rangePicker'"
|
||||
style="width: 100%"
|
||||
|
@ -145,6 +151,7 @@ import {ref} from "vue";
|
|||
import {FormExpose} from "ant-design-vue/es/form/Form";
|
||||
import {QuestionCircleOutlined} from '@ant-design/icons-vue'
|
||||
import {FormProMaxItemOptions, FormProMaxItemProps, FormProMaxProps} from "@/types/components/form/index.ts";
|
||||
import AdministrativeDivisionsTree from "@/components/tree/AdministrativeDivisionsTree.vue";
|
||||
|
||||
|
||||
const modelValue = defineModel<T>('value', {
|
||||
|
|
|
@ -0,0 +1,63 @@
|
|||
<template>
|
||||
<a-cascader
|
||||
style="width: 500px"
|
||||
v-model:value="modelValue"
|
||||
:options="options"
|
||||
:load-data="loadData"
|
||||
placeholder="请选择行政区划"
|
||||
:change-on-select="changeOnSelect"
|
||||
/>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import api from "@/axios";
|
||||
import {onMounted, ref, watch} from 'vue';
|
||||
import type {CascaderProps} from 'ant-design-vue';
|
||||
|
||||
// withDefaultsde作用是设置组件默认值属性,有两个值,第二个值是设置第一个值所有属性的默认值的
|
||||
withDefaults(defineProps<{
|
||||
changeOnSelect:boolean,
|
||||
}>(),{
|
||||
changeOnSelect:false
|
||||
})
|
||||
|
||||
const modelValue = defineModel('value', {
|
||||
default: [ ]
|
||||
})
|
||||
const options = ref<CascaderProps['options']>([]);
|
||||
const DivisionTree = async ():Promise<TreeNodeVo<string>[]> =>{
|
||||
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)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
watch(modelValue,async ()=> await transformData(modelValue.value,options.value))
|
||||
onMounted(async () => {
|
||||
await DivisionTree()
|
||||
await transformData(modelValue.value,options.value)
|
||||
});
|
||||
</script>
|
||||
|
|
@ -15,6 +15,7 @@ import {
|
|||
} from "ant-design-vue";
|
||||
import {Ref, UnwrapRef, VNode} from "vue";
|
||||
import {ComponentProps} from "vue-component-type-helpers";
|
||||
import AdministrativeDivisionsTree from "@/components/tree/AdministrativeDivisionsTree.vue";
|
||||
|
||||
type FormProMaxItemType =
|
||||
| 'custom'
|
||||
|
@ -32,7 +33,8 @@ type FormProMaxItemType =
|
|||
| 'datePicker'
|
||||
| 'rangePicker'
|
||||
| 'timeRangePicker'
|
||||
| 'timePicker';
|
||||
| 'timePicker'
|
||||
| 'administrativeDivisionsTree';
|
||||
|
||||
interface FormProMaxItemCommonProps extends ComponentProps<typeof FormItem> {
|
||||
label?: string,
|
||||
|
@ -64,6 +66,7 @@ export type FormProMaxItemOptions<T> = {
|
|||
| FormProMaxItemProps<'rangePicker', ComponentProps<typeof RangePicker>>
|
||||
| FormProMaxItemProps<'timeRangePicker', ComponentProps<typeof TimeRangePicker>>
|
||||
| FormProMaxItemProps<'timePicker', ComponentProps<typeof TimePicker>>
|
||||
| FormProMaxItemProps<'administrativeDivisionsTree', ComponentProps<typeof AdministrativeDivisionsTree>>
|
||||
}
|
||||
|
||||
export interface FormProMaxProps<T = {}> extends FormProps {
|
||||
|
|
|
@ -193,7 +193,7 @@ const columns: TableProps['columns'] = [
|
|||
<a-button danger>删除</a-button>
|
||||
</a-popconfirm>
|
||||
<a-button type="primary" onClick={ async ()=>{
|
||||
// console.log(record)
|
||||
console.log(record,'9999999')
|
||||
visible.value = true
|
||||
serviceTitle.value = '编辑服务项目'
|
||||
if(record.isRecruitSecurity === null ){
|
||||
|
@ -221,6 +221,7 @@ const columns: TableProps['columns'] = [
|
|||
formParams.value. securityUserTotal = record.securityUserTotal
|
||||
formParams.value.enterprisesUnitId = record.enterprisesUnitName
|
||||
formParams.value.administrativeDivisionCodes = record.enterprisesUnitAdministrativeDivisionCodes
|
||||
|
||||
}}>编辑</a-button>
|
||||
</a-space>
|
||||
}
|
||||
|
@ -231,7 +232,7 @@ const x: number = columns.reduce((a, b) => a + (b.width as number), 0)
|
|||
|
||||
const administrativeDivisionTree = ref<TreeNodeVo<string>[]>([]) //行政区划
|
||||
const getAdministrativeDivisionTree = 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>[]
|
||||
}
|
||||
|
||||
|
@ -260,12 +261,10 @@ const formItemOptions = ref<FormProMaxItemOptions<serviceProjectSaveOrUpdatePara
|
|||
options:userNameOptions,
|
||||
},
|
||||
administrativeDivisionCodes:{
|
||||
type:'cascader',
|
||||
type:'administrativeDivisionsTree',
|
||||
label:'行政区划',
|
||||
required: true,
|
||||
options: administrativeDivisionTree,
|
||||
componentsProps:{
|
||||
showSearch:true,
|
||||
onChange: async (values)=>{
|
||||
const resp = await api.post<SelectNodeVo<string>[]>('/enterprisesUnit/queryListByAdministrativeDivisionCodes',values)
|
||||
enterprisesUnitIdList.value = resp.data
|
||||
|
@ -420,7 +419,7 @@ const closeModal = async()=>{
|
|||
securityUserTotal:null,
|
||||
remark:''
|
||||
}
|
||||
// await formRef.value.resetFields()
|
||||
await formRef.value.resetFields()
|
||||
enterprisesUnitId.value = ''
|
||||
serviceTitle.value = '新增服务项目'
|
||||
isRecruitSecurityHidden.value = false
|
||||
|
|
|
@ -1,55 +1,11 @@
|
|||
<template>
|
||||
<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}}
|
||||
<AdministrativeDivisionsTree v-model:value="value"></AdministrativeDivisionsTree>
|
||||
</div>
|
||||
</template>
|
||||
<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)
|
||||
});
|
||||
import { ref} from 'vue';
|
||||
import AdministrativeDivisionsTree from "@/components/tree/AdministrativeDivisionsTree.vue";
|
||||
const value = ref<string[]>( ["120000", "120100", "120115", "120115014"] );
|
||||
</script>
|
||||
|
||||
|
|
Loading…
Reference in New Issue