feat(property): 1
This commit is contained in:
parent
68bb70ee72
commit
7f542de90b
@ -71,6 +71,10 @@ export interface PersonVO {
|
|||||||
*/
|
*/
|
||||||
authGroupId?: string | number
|
authGroupId?: string | number
|
||||||
|
|
||||||
|
authBegDate?: string
|
||||||
|
|
||||||
|
authEndDate?: string
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface PersonForm extends BaseEntity {
|
export interface PersonForm extends BaseEntity {
|
||||||
|
@ -1,11 +1,10 @@
|
|||||||
import type { FormSchemaGetter } from '#/adapter/form';
|
import type { FormSchemaGetter } from '#/adapter/form'
|
||||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
import type { VxeGridProps } from '#/adapter/vxe-table'
|
||||||
import { getDictOptions } from '#/utils/dict';
|
import { getDictOptions } from '#/utils/dict'
|
||||||
import { renderDict } from '#/utils/render';
|
import { renderDict } from '#/utils/render'
|
||||||
import { resident_unitList } from '#/api/property/resident/unit';
|
import { resident_unitList } from '#/api/property/resident/unit'
|
||||||
import { authGroupList } from '#/api/sis/authGroup';
|
import { authGroupList } from '#/api/sis/authGroup'
|
||||||
import type { AuthGroupVO, AuthGroupQuery } from '#/api/sis/authGroup/model';
|
import type { AuthGroupVO, AuthGroupQuery } from '#/api/sis/authGroup/model'
|
||||||
import { toRaw } from 'vue';
|
|
||||||
|
|
||||||
export const querySchema: FormSchemaGetter = () => [
|
export const querySchema: FormSchemaGetter = () => [
|
||||||
{
|
{
|
||||||
@ -37,7 +36,7 @@ export const querySchema: FormSchemaGetter = () => [
|
|||||||
fieldName: 'state',
|
fieldName: 'state',
|
||||||
label: '状态',
|
label: '状态',
|
||||||
},
|
},
|
||||||
];
|
]
|
||||||
|
|
||||||
export const columns: VxeGridProps['columns'] = [
|
export const columns: VxeGridProps['columns'] = [
|
||||||
{ type: 'checkbox', width: 60 },
|
{ type: 'checkbox', width: 60 },
|
||||||
@ -52,7 +51,7 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
// },
|
// },
|
||||||
{
|
{
|
||||||
title: '员工编号',
|
title: '员工编号',
|
||||||
field: 'userId',
|
field: 'id',
|
||||||
width: 100,
|
width: 100,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -70,7 +69,7 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
field: 'gender',
|
field: 'gender',
|
||||||
slots: {
|
slots: {
|
||||||
default: ({ row }) => {
|
default: ({ row }) => {
|
||||||
return renderDict(row.gender, 'sys_user_sex');
|
return renderDict(row.gender, 'sys_user_sex')
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
width: 100,
|
width: 100,
|
||||||
@ -105,7 +104,7 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
field: 'state',
|
field: 'state',
|
||||||
slots: {
|
slots: {
|
||||||
default: ({ row }) => {
|
default: ({ row }) => {
|
||||||
return renderDict(row.state, 'wy_rzryzt');
|
return renderDict(row.state, 'wy_rzryzt')
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
width: 100,
|
width: 100,
|
||||||
@ -122,9 +121,9 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
title: '操作',
|
title: '操作',
|
||||||
minWidth: 180,
|
minWidth: 180,
|
||||||
},
|
},
|
||||||
];
|
]
|
||||||
|
|
||||||
let authGroupArr: AuthGroupVO[] = [];
|
let authGroupArr: AuthGroupVO[] = []
|
||||||
export const modalSchema: FormSchemaGetter = () => [
|
export const modalSchema: FormSchemaGetter = () => [
|
||||||
{
|
{
|
||||||
label: '主键id',
|
label: '主键id',
|
||||||
@ -140,17 +139,20 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
fieldName: 'userName',
|
fieldName: 'userName',
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
rules: 'required',
|
rules: 'required',
|
||||||
|
formItemClass: 'col-span-1',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '联系电话',
|
label: '联系电话',
|
||||||
fieldName: 'phone',
|
fieldName: 'phone',
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
rules: 'required',
|
rules: 'required',
|
||||||
|
formItemClass: 'col-span-1',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '性别',
|
label: '性别',
|
||||||
fieldName: 'gender',
|
fieldName: 'gender',
|
||||||
component: 'Select',
|
component: 'Select',
|
||||||
|
formItemClass: 'col-span-2',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
options: getDictOptions('sys_user_sex'),
|
options: getDictOptions('sys_user_sex'),
|
||||||
},
|
},
|
||||||
@ -161,20 +163,23 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
fieldName: 'idCard',
|
fieldName: 'idCard',
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
rules: 'required',
|
rules: 'required',
|
||||||
|
formItemClass: 'col-span-1',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '邮箱',
|
label: '邮箱',
|
||||||
fieldName: 'email',
|
fieldName: 'email',
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
|
formItemClass: 'col-span-1',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '人员状态',
|
label: '人员状态',
|
||||||
fieldName: 'state',
|
fieldName: 'state',
|
||||||
component: 'Select',
|
component: 'Select',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
options: getDictOptions('wy_rzryzt'),
|
options: getDictOptions('wy_rzryzt')
|
||||||
},
|
},
|
||||||
rules: 'selectRequired',
|
rules: 'selectRequired',
|
||||||
|
formItemClass: 'col-span-2',
|
||||||
},
|
},
|
||||||
// {
|
// {
|
||||||
// label: '入住员工',
|
// label: '入住员工',
|
||||||
@ -187,7 +192,7 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
label: '所属单位',
|
label: '所属单位',
|
||||||
fieldName: 'unitId',
|
fieldName: 'unitId',
|
||||||
component: 'Select',
|
component: 'Select',
|
||||||
formItemClass: 'col-span-2',
|
formItemClass: 'col-span-4',
|
||||||
rules: 'selectRequired',
|
rules: 'selectRequired',
|
||||||
},
|
},
|
||||||
// {
|
// {
|
||||||
@ -207,37 +212,66 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||||
},
|
},
|
||||||
rules: 'required',
|
rules: 'required',
|
||||||
|
formItemClass: 'col-span-1',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '车牌号码',
|
label: '车牌号码',
|
||||||
fieldName: 'carNumber',
|
fieldName: 'carNumber',
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
|
formItemClass: 'col-span-3',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '修改权限',
|
||||||
|
fieldName: 'authSwitch',
|
||||||
|
component: 'Switch',
|
||||||
|
formItemClass: 'col-span-1',
|
||||||
|
componentProps: {
|
||||||
|
class: 'w-auto',
|
||||||
|
|
||||||
|
},
|
||||||
|
defaultValue: false,
|
||||||
|
dependencies: {
|
||||||
|
show: (values) => {
|
||||||
|
return typeof values.id !== 'undefined'
|
||||||
|
},
|
||||||
|
triggerFields: ['id'],
|
||||||
|
},
|
||||||
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '授权期限',
|
label: '授权期限',
|
||||||
fieldName: 'authTime',
|
fieldName: 'authTime',
|
||||||
component: 'RangePicker',
|
component: 'RangePicker',
|
||||||
|
formItemClass: 'col-span-1',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
|
class: 'w-auto',
|
||||||
showTime: true,
|
showTime: true,
|
||||||
format: 'YYYY-MM-DD HH:mm:ss',
|
format: 'YYYY-MM-DD HH:mm:ss',
|
||||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||||
},
|
},
|
||||||
dependencies: {
|
dependencies: {
|
||||||
show: (values) => {
|
show: (values) => {
|
||||||
return typeof values.id !== 'undefined';
|
return typeof values.id !== 'undefined'
|
||||||
},
|
},
|
||||||
triggerFields: ['id'],
|
disabled:(values) => {
|
||||||
|
return !values.authSwitch
|
||||||
|
},
|
||||||
|
triggerFields: ['id', 'authSwitch'],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '通行权限组',
|
label: '通行权限组',
|
||||||
fieldName: 'authGroupId',
|
fieldName: 'authGroupId',
|
||||||
component: 'ApiSelect',
|
component: 'ApiSelect',
|
||||||
|
formItemClass: 'col-span-2',
|
||||||
dependencies: {
|
dependencies: {
|
||||||
show: (values) => {
|
show: (values) => {
|
||||||
return typeof values.id !== 'undefined';
|
return typeof values.id !== 'undefined'
|
||||||
},
|
},
|
||||||
triggerFields: ['id'],
|
disabled:(values) => {
|
||||||
|
return !values.authSwitch
|
||||||
|
},
|
||||||
|
triggerFields: ['id', 'authSwitch'],
|
||||||
},
|
},
|
||||||
componentProps: {
|
componentProps: {
|
||||||
allowClear: true,
|
allowClear: true,
|
||||||
@ -248,14 +282,13 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
api: async () => {
|
api: async () => {
|
||||||
if (!authGroupArr || authGroupArr.length == 0) {
|
if (!authGroupArr || authGroupArr.length == 0) {
|
||||||
const params: AuthGroupQuery = {
|
const params: AuthGroupQuery = {
|
||||||
groupType: 2,
|
|
||||||
pageNum: 1,
|
pageNum: 1,
|
||||||
pageSize: 500,
|
pageSize: 500,
|
||||||
};
|
|
||||||
const res = await authGroupList(params);
|
|
||||||
authGroupArr = res.rows;
|
|
||||||
}
|
}
|
||||||
return authGroupArr;
|
const res = await authGroupList(params)
|
||||||
|
authGroupArr = res.rows
|
||||||
|
}
|
||||||
|
return authGroupArr
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
@ -267,15 +300,15 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
// accept: 'image/*', // 可选拓展名或者mime类型 ,拼接
|
// accept: 'image/*', // 可选拓展名或者mime类型 ,拼接
|
||||||
maxCount: 1, // 最大上传文件数 默认为1 为1会绑定为string而非string[]类型
|
maxCount: 1, // 最大上传文件数 默认为1 为1会绑定为string而非string[]类型
|
||||||
},
|
},
|
||||||
formItemClass: 'col-span-2',
|
formItemClass: 'col-span-3',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '备注',
|
label: '备注',
|
||||||
fieldName: 'remark',
|
fieldName: 'remark',
|
||||||
component: 'Textarea',
|
component: 'Textarea',
|
||||||
formItemClass: 'col-span-2',
|
formItemClass: 'col-span-3',
|
||||||
},
|
},
|
||||||
];
|
]
|
||||||
|
|
||||||
//门禁记录
|
//门禁记录
|
||||||
export const accessControlColumns: VxeGridProps['columns'] = [
|
export const accessControlColumns: VxeGridProps['columns'] = [
|
||||||
@ -311,7 +344,7 @@ export const accessControlColumns: VxeGridProps['columns'] = [
|
|||||||
title: '状态',
|
title: '状态',
|
||||||
field: 'locathon',
|
field: 'locathon',
|
||||||
},
|
},
|
||||||
];
|
]
|
||||||
|
|
||||||
//车辆记录
|
//车辆记录
|
||||||
export const carColumns: VxeGridProps['columns'] = [
|
export const carColumns: VxeGridProps['columns'] = [
|
||||||
@ -355,22 +388,22 @@ export const carColumns: VxeGridProps['columns'] = [
|
|||||||
title: '备注',
|
title: '备注',
|
||||||
field: 'remark',
|
field: 'remark',
|
||||||
},
|
},
|
||||||
];
|
]
|
||||||
export async function getUnitList(): Promise<
|
export async function getUnitList(): Promise<
|
||||||
{ value: number; label: string }[]
|
{ value: number; label: string }[]
|
||||||
> {
|
> {
|
||||||
const queryParam = {
|
const queryParam = {
|
||||||
pageNum: 1000,
|
pageNum: 1000,
|
||||||
pageSize: 1,
|
pageSize: 1,
|
||||||
};
|
}
|
||||||
const res = await resident_unitList(queryParam);
|
const res = await resident_unitList(queryParam)
|
||||||
const data: { value: number; label: string }[] = [];
|
const data: { value: number; label: string }[] = []
|
||||||
|
|
||||||
res.rows.forEach((r: any) => {
|
res.rows.forEach((r: any) => {
|
||||||
data.push({
|
data.push({
|
||||||
value: r.id,
|
value: r.id,
|
||||||
label: r.name,
|
label: r.name,
|
||||||
});
|
})
|
||||||
});
|
})
|
||||||
return data;
|
return data
|
||||||
}
|
}
|
||||||
|
@ -1,38 +1,38 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, reactive, ref } from "vue";
|
import { computed, reactive, ref } from "vue"
|
||||||
import { useVbenModal } from "@vben/common-ui";
|
import { useVbenModal } from "@vben/common-ui"
|
||||||
import { $t } from "@vben/locales";
|
import { $t } from "@vben/locales"
|
||||||
import { cloneDeep } from "@vben/utils";
|
import { cloneDeep } from "@vben/utils"
|
||||||
import { useVbenForm } from "#/adapter/form";
|
import { useVbenForm } from "#/adapter/form"
|
||||||
import {
|
import {
|
||||||
personAdd,
|
personAdd,
|
||||||
personInfo,
|
personInfo,
|
||||||
personUpdate,
|
personUpdate,
|
||||||
} from "#/api/property/resident/person";
|
} from "#/api/property/resident/person"
|
||||||
import { defaultFormValueGetter, useBeforeCloseDiff } from "#/utils/popup";
|
import { defaultFormValueGetter, useBeforeCloseDiff } from "#/utils/popup"
|
||||||
import { modalSchema } from "./data";
|
import { modalSchema } from "./data"
|
||||||
import QueryUserList from "./query-user-list.vue";
|
import QueryUserList from "./query-user-list.vue"
|
||||||
import QueryUnitList from "./query-unit-list.vue";
|
import QueryUnitList from "./query-unit-list.vue"
|
||||||
|
|
||||||
const emit = defineEmits<{ reload: [] }>();
|
const emit = defineEmits<{ reload: [] }>()
|
||||||
|
|
||||||
const isUpdate = ref(false);
|
const isUpdate = ref(false)
|
||||||
const title = computed(() => {
|
const title = computed(() => {
|
||||||
return isUpdate.value ? $t("pages.common.edit") : $t("pages.common.add");
|
return isUpdate.value ? $t("pages.common.edit") : $t("pages.common.add")
|
||||||
});
|
})
|
||||||
let userInfo = reactive({
|
let userInfo = reactive({
|
||||||
userId: "",
|
userId: "",
|
||||||
userName: "",
|
userName: "",
|
||||||
phone: "",
|
phone: "",
|
||||||
gender: "",
|
gender: "",
|
||||||
});
|
})
|
||||||
let unitName = ref("");
|
let unitName = ref("")
|
||||||
const userId = ref<number | string>(0);
|
const userId = ref<number | string>(0)
|
||||||
const unitId = ref<string>("");
|
const unitId = ref<string>("")
|
||||||
const [BasicForm, formApi] = useVbenForm({
|
const [BasicForm, formApi] = useVbenForm({
|
||||||
commonConfig: {
|
commonConfig: {
|
||||||
// 默认占满两列
|
// 默认占满两列
|
||||||
formItemClass: "col-span-1",
|
formItemClass: "col-span-4",
|
||||||
// 默认label宽度 px
|
// 默认label宽度 px
|
||||||
labelWidth: 100,
|
labelWidth: 100,
|
||||||
// 通用配置项 会影响到所有表单项
|
// 通用配置项 会影响到所有表单项
|
||||||
@ -43,88 +43,89 @@ const [BasicForm, formApi] = useVbenForm({
|
|||||||
schema: modalSchema(),
|
schema: modalSchema(),
|
||||||
showDefaultActions: false,
|
showDefaultActions: false,
|
||||||
wrapperClass: "grid-cols-2",
|
wrapperClass: "grid-cols-2",
|
||||||
});
|
})
|
||||||
|
|
||||||
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
||||||
{
|
{
|
||||||
initializedGetter: defaultFormValueGetter(formApi),
|
initializedGetter: defaultFormValueGetter(formApi),
|
||||||
currentGetter: defaultFormValueGetter(formApi),
|
currentGetter: defaultFormValueGetter(formApi),
|
||||||
}
|
}
|
||||||
);
|
)
|
||||||
|
|
||||||
const [BasicModal, modalApi] = useVbenModal({
|
const [BasicModal, modalApi] = useVbenModal({
|
||||||
// 在这里更改宽度
|
// 在这里更改宽度
|
||||||
class: "w-[70%]",
|
class: "w-[75%]",
|
||||||
fullscreenButton: false,
|
fullscreenButton: false,
|
||||||
onBeforeClose,
|
onBeforeClose,
|
||||||
onClosed: handleClosed,
|
onClosed: handleClosed,
|
||||||
onConfirm: handleConfirm,
|
onConfirm: handleConfirm,
|
||||||
onOpenChange: async (isOpen) => {
|
onOpenChange: async (isOpen) => {
|
||||||
if (!isOpen) {
|
if (!isOpen) {
|
||||||
return null;
|
return null
|
||||||
}
|
}
|
||||||
modalApi.modalLoading(true);
|
modalApi.modalLoading(true)
|
||||||
|
|
||||||
const { id } = modalApi.getData() as { id?: number | string };
|
const { id } = modalApi.getData() as { id?: number | string }
|
||||||
isUpdate.value = !!id;
|
isUpdate.value = !!id
|
||||||
|
|
||||||
if (isUpdate.value && id) {
|
if (isUpdate.value && id) {
|
||||||
const record = await personInfo(id);
|
const record = await personInfo(id)
|
||||||
userId.value = record.userId;
|
userId.value = record.userId
|
||||||
unitId.value = record.unitId.toString();
|
unitId.value = record.unitId.toString()
|
||||||
record.state = record.state?.toString();
|
record.state = record.state?.toString()
|
||||||
await formApi.setValues(record);
|
record.authTime = [record.authBegDate, record.authEndDate]
|
||||||
|
await formApi.setValues(record)
|
||||||
}
|
}
|
||||||
await markInitialized();
|
await markInitialized()
|
||||||
|
|
||||||
modalApi.modalLoading(false);
|
modalApi.modalLoading(false)
|
||||||
},
|
},
|
||||||
});
|
})
|
||||||
|
|
||||||
async function handleConfirm() {
|
async function handleConfirm() {
|
||||||
try {
|
try {
|
||||||
modalApi.lock(true);
|
modalApi.lock(true)
|
||||||
const { valid } = await formApi.validate();
|
const { valid } = await formApi.validate()
|
||||||
if (!valid) {
|
if (!valid) {
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
||||||
let data = cloneDeep(await formApi.getValues());
|
let data = cloneDeep(await formApi.getValues())
|
||||||
// if (userInfo) {
|
// if (userInfo) {
|
||||||
// data.userName = userInfo.userName
|
// data.userName = userInfo.userName
|
||||||
// data.phone = userInfo.phone
|
// data.phone = userInfo.phone
|
||||||
// data.gender = userInfo.gender
|
// data.gender = userInfo.gender
|
||||||
// }
|
// }
|
||||||
if (unitName.value) {
|
if (unitName.value) {
|
||||||
data.unitName = unitName.value;
|
data.unitName = unitName.value
|
||||||
}
|
}
|
||||||
|
|
||||||
if (isUpdate.value && data.authTime !== 0) {
|
if (isUpdate.value && data.authSwitch) {
|
||||||
data.authBegDate = data.authTime[0];
|
data.authBegDate = data.authTime[0]
|
||||||
data.authEndDate = data.authTime[1];
|
data.authEndDate = data.authTime[1]
|
||||||
}
|
}
|
||||||
await (isUpdate.value ? personUpdate(data) : personAdd(data));
|
await (isUpdate.value ? personUpdate(data) : personAdd(data))
|
||||||
resetInitialized();
|
resetInitialized()
|
||||||
emit("reload");
|
emit("reload")
|
||||||
modalApi.close();
|
modalApi.close()
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error(error);
|
console.error(error)
|
||||||
} finally {
|
} finally {
|
||||||
modalApi.lock(false);
|
modalApi.lock(false)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function handleClosed() {
|
async function handleClosed() {
|
||||||
await formApi.resetForm();
|
await formApi.resetForm()
|
||||||
resetInitialized();
|
resetInitialized()
|
||||||
}
|
}
|
||||||
|
|
||||||
function getUserInfo(user: any) {
|
function getUserInfo(user: any) {
|
||||||
userInfo = user;
|
userInfo = user
|
||||||
}
|
}
|
||||||
|
|
||||||
function getUnitInfo(unit: { name: string }) {
|
function getUnitInfo(unit: { name: string }) {
|
||||||
unitName.value = unit.name;
|
unitName.value = unit.name
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -132,16 +133,10 @@ function getUnitInfo(unit: { name: string }) {
|
|||||||
<BasicModal :title="title">
|
<BasicModal :title="title">
|
||||||
<BasicForm>
|
<BasicForm>
|
||||||
<template #userId="slotProps">
|
<template #userId="slotProps">
|
||||||
<QueryUserList @update:userInfo="getUserInfo"
|
<QueryUserList @update:userInfo="getUserInfo" v-bind="slotProps" :isUpdate="isUpdate" :userId="userId" />
|
||||||
v-bind="slotProps"
|
|
||||||
:isUpdate="isUpdate"
|
|
||||||
:userId="userId" />
|
|
||||||
</template>
|
</template>
|
||||||
<template #unitId="slotProps">
|
<template #unitId="slotProps">
|
||||||
<QueryUnitList @update:unitInfo="getUnitInfo"
|
<QueryUnitList @update:unitInfo="getUnitInfo" v-bind="slotProps" :isUpdate="isUpdate" :unitId="unitId" />
|
||||||
v-bind="slotProps"
|
|
||||||
:isUpdate="isUpdate"
|
|
||||||
:unitId="unitId" />
|
|
||||||
</template>
|
</template>
|
||||||
</BasicForm>
|
</BasicForm>
|
||||||
</BasicModal>
|
</BasicModal>
|
||||||
|
@ -176,7 +176,7 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '',
|
label: '',
|
||||||
fieldName: 'time',
|
fieldName: 'Placeholder',
|
||||||
component: ''
|
component: ''
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -1,23 +1,23 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, ref } from 'vue';
|
import { computed, ref } from 'vue'
|
||||||
|
|
||||||
import { useVbenModal } from '@vben/common-ui';
|
import { useVbenModal } from '@vben/common-ui'
|
||||||
import { $t } from '@vben/locales';
|
import { $t } from '@vben/locales'
|
||||||
import {cloneDeep, handleNode} from '@vben/utils';
|
import { cloneDeep, handleNode } from '@vben/utils'
|
||||||
|
|
||||||
import { useVbenForm } from '#/adapter/form';
|
import { useVbenForm } from '#/adapter/form'
|
||||||
import { resident_unitAdd, resident_unitInfo, resident_unitUpdate } from '#/api/property/resident/unit';
|
import { resident_unitAdd, resident_unitInfo, resident_unitUpdate } from '#/api/property/resident/unit'
|
||||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup'
|
||||||
|
|
||||||
import { modalSchema } from './data';
|
import { modalSchema } from './data'
|
||||||
import {communityTree} from "#/api/property/community";
|
import { communityTree } from "#/api/property/community"
|
||||||
|
|
||||||
const emit = defineEmits<{ reload: [] }>();
|
const emit = defineEmits<{ reload: [] }>()
|
||||||
|
|
||||||
const isUpdate = ref(false);
|
const isUpdate = ref(false)
|
||||||
const title = computed(() => {
|
const title = computed(() => {
|
||||||
return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
|
return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add')
|
||||||
});
|
})
|
||||||
|
|
||||||
const [BasicForm, formApi] = useVbenForm({
|
const [BasicForm, formApi] = useVbenForm({
|
||||||
commonConfig: {
|
commonConfig: {
|
||||||
@ -33,14 +33,14 @@ const [BasicForm, formApi] = useVbenForm({
|
|||||||
schema: modalSchema(),
|
schema: modalSchema(),
|
||||||
showDefaultActions: false,
|
showDefaultActions: false,
|
||||||
wrapperClass: 'grid-cols-2',
|
wrapperClass: 'grid-cols-2',
|
||||||
});
|
})
|
||||||
|
|
||||||
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
||||||
{
|
{
|
||||||
initializedGetter: defaultFormValueGetter(formApi),
|
initializedGetter: defaultFormValueGetter(formApi),
|
||||||
currentGetter: defaultFormValueGetter(formApi),
|
currentGetter: defaultFormValueGetter(formApi),
|
||||||
},
|
},
|
||||||
);
|
)
|
||||||
|
|
||||||
const [BasicModal, modalApi] = useVbenModal({
|
const [BasicModal, modalApi] = useVbenModal({
|
||||||
// 在这里更改宽度
|
// 在这里更改宽度
|
||||||
@ -51,53 +51,57 @@ const [BasicModal, modalApi] = useVbenModal({
|
|||||||
onConfirm: handleConfirm,
|
onConfirm: handleConfirm,
|
||||||
onOpenChange: async (isOpen) => {
|
onOpenChange: async (isOpen) => {
|
||||||
if (!isOpen) {
|
if (!isOpen) {
|
||||||
return null;
|
return null
|
||||||
}
|
}
|
||||||
modalApi.modalLoading(true);
|
modalApi.modalLoading(true)
|
||||||
|
|
||||||
const { id } = modalApi.getData() as { id?: number | string };
|
const { id } = modalApi.getData() as { id?: number | string }
|
||||||
isUpdate.value = !!id;
|
isUpdate.value = !!id
|
||||||
await initLocationOptions()
|
await initLocationOptions()
|
||||||
if (isUpdate.value && id) {
|
if (isUpdate.value && id) {
|
||||||
const record = await resident_unitInfo(id);
|
const record = await resident_unitInfo(id)
|
||||||
await formApi.setValues(record);
|
await formApi.setValues(record)
|
||||||
}
|
}
|
||||||
await markInitialized();
|
await markInitialized()
|
||||||
|
|
||||||
modalApi.modalLoading(false);
|
modalApi.modalLoading(false)
|
||||||
},
|
},
|
||||||
});
|
})
|
||||||
|
|
||||||
async function handleConfirm() {
|
async function handleConfirm() {
|
||||||
try {
|
try {
|
||||||
modalApi.lock(true);
|
modalApi.lock(true)
|
||||||
const { valid } = await formApi.validate();
|
const { valid } = await formApi.validate()
|
||||||
if (!valid) {
|
if (!valid) {
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
||||||
const data = cloneDeep(await formApi.getValues());
|
const data = cloneDeep(await formApi.getValues())
|
||||||
await (isUpdate.value ? resident_unitUpdate(data) : resident_unitAdd(data));
|
|
||||||
resetInitialized();
|
data.authBegDate = data.authTime[0]
|
||||||
emit('reload');
|
data.authEndDate = data.authTime[1]
|
||||||
modalApi.close();
|
|
||||||
|
await (isUpdate.value ? resident_unitUpdate(data) : resident_unitAdd(data))
|
||||||
|
resetInitialized()
|
||||||
|
emit('reload')
|
||||||
|
modalApi.close()
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error(error);
|
console.error(error)
|
||||||
} finally {
|
} finally {
|
||||||
modalApi.lock(false);
|
modalApi.lock(false)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 入驻位置数据
|
* 入驻位置数据
|
||||||
*/
|
*/
|
||||||
async function initLocationOptions() {
|
async function initLocationOptions() {
|
||||||
const locationList = await communityTree(5);
|
const locationList = await communityTree(5)
|
||||||
const splitStr = '/';
|
const splitStr = '/'
|
||||||
handleNode(locationList, 'label', splitStr, function (node: any) {
|
handleNode(locationList, 'label', splitStr, function (node: any) {
|
||||||
if (node.level != 5) {
|
if (node.level != 5) {
|
||||||
node.disabled = true;
|
node.disabled = true
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
formApi.updateSchema([
|
formApi.updateSchema([
|
||||||
{
|
{
|
||||||
componentProps: () => ({
|
componentProps: () => ({
|
||||||
@ -120,12 +124,12 @@ async function initLocationOptions() {
|
|||||||
}),
|
}),
|
||||||
fieldName: 'location',
|
fieldName: 'location',
|
||||||
},
|
},
|
||||||
]);
|
])
|
||||||
}
|
}
|
||||||
|
|
||||||
async function handleClosed() {
|
async function handleClosed() {
|
||||||
await formApi.resetForm();
|
await formApi.resetForm()
|
||||||
resetInitialized();
|
resetInitialized()
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user