Merge branch 'master' of http://47.109.37.87:3000/by2025/admin-vben5
This commit is contained in:
commit
13e2163c66
@ -71,6 +71,10 @@ export interface PersonVO {
|
||||
*/
|
||||
authGroupId?: string | number
|
||||
|
||||
authBegDate?: string
|
||||
|
||||
authEndDate?: string
|
||||
|
||||
}
|
||||
|
||||
export interface PersonForm extends BaseEntity {
|
||||
|
@ -68,7 +68,6 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
|
||||
.box{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 3fr;
|
||||
gap: 30px;
|
||||
|
||||
.right {
|
||||
width: 100%;
|
||||
|
@ -84,7 +84,8 @@
|
||||
<div class="section-header">
|
||||
<div class="header-title">日用电功率曲线</div>
|
||||
</div>
|
||||
<div class="chart-placeholder" ref="powerCurveChart">
|
||||
<!-- <div class="chart-placeholder" ref="powerCurveChart">-->
|
||||
<div class="power-chart" ref="powerCurveChart">
|
||||
</div>
|
||||
</div>
|
||||
<div class="power-peak-container">
|
||||
@ -473,7 +474,13 @@ onBeforeUnmount(() => {
|
||||
justify-content: center;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.power-chart{
|
||||
height: 47vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.peak-item {
|
||||
padding: 15px 0 0 0;
|
||||
border: 1px solid #3671e8;
|
||||
|
@ -300,7 +300,7 @@ onMounted(()=>{
|
||||
</div>
|
||||
<div id="day" style="height: 250px;width: 100%;"></div>
|
||||
</div>
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 10px;">
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 16px;">
|
||||
<div>
|
||||
<div style="display: flex;justify-content: space-between;">
|
||||
<DatePicker
|
||||
@ -311,7 +311,7 @@ onMounted(()=>{
|
||||
</div>
|
||||
<div id="month" style="height: 250px;width: 100%;"></div>
|
||||
</div>
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 10px;">
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 16px;">
|
||||
<div>
|
||||
<div style="display: flex;justify-content: space-between;">
|
||||
<DatePicker
|
||||
@ -330,7 +330,7 @@ onMounted(()=>{
|
||||
.box{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 3fr;
|
||||
gap: 30px;
|
||||
padding: 10px;
|
||||
gap: 16px;
|
||||
padding: 16px;
|
||||
}
|
||||
</style>
|
||||
|
@ -68,6 +68,5 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
|
||||
.box{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 3fr;
|
||||
gap: 30px;
|
||||
}
|
||||
</style>
|
||||
|
@ -134,7 +134,7 @@ const data = [...Array(32)].map((_, i) => ({
|
||||
<div class="box">
|
||||
<div class="left"><FloorTree></FloorTree></div>
|
||||
<div class="right">
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;margin-bottom: 10px;">
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;margin-bottom: 16px;">
|
||||
<div>
|
||||
年份
|
||||
<DatePicker
|
||||
@ -156,7 +156,7 @@ const data = [...Array(32)].map((_, i) => ({
|
||||
:columns="columns"
|
||||
:data-source="data"
|
||||
:pagination="false"
|
||||
:scroll="{ y: 270 }"
|
||||
:scroll="{ y: '50vh' }"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -167,7 +167,7 @@ const data = [...Array(32)].map((_, i) => ({
|
||||
.box{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 3fr;
|
||||
gap: 30px;
|
||||
padding: 10px;
|
||||
gap: 16px;
|
||||
padding: 16px;
|
||||
}
|
||||
</style>
|
||||
|
@ -1,11 +1,10 @@
|
||||
import type { FormSchemaGetter } from '#/adapter/form';
|
||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||
import { getDictOptions } from '#/utils/dict';
|
||||
import { renderDict } from '#/utils/render';
|
||||
import { resident_unitList } from '#/api/property/resident/unit';
|
||||
import { authGroupList } from '#/api/sis/authGroup';
|
||||
import type { AuthGroupVO, AuthGroupQuery } from '#/api/sis/authGroup/model';
|
||||
import { toRaw } from 'vue';
|
||||
import type { FormSchemaGetter } from '#/adapter/form'
|
||||
import type { VxeGridProps } from '#/adapter/vxe-table'
|
||||
import { getDictOptions } from '#/utils/dict'
|
||||
import { renderDict } from '#/utils/render'
|
||||
import { resident_unitList } from '#/api/property/resident/unit'
|
||||
import { authGroupList } from '#/api/sis/authGroup'
|
||||
import type { AuthGroupVO, AuthGroupQuery } from '#/api/sis/authGroup/model'
|
||||
|
||||
export const querySchema: FormSchemaGetter = () => [
|
||||
{
|
||||
@ -37,7 +36,7 @@ export const querySchema: FormSchemaGetter = () => [
|
||||
fieldName: 'state',
|
||||
label: '状态',
|
||||
},
|
||||
];
|
||||
]
|
||||
|
||||
export const columns: VxeGridProps['columns'] = [
|
||||
{ type: 'checkbox', width: 60 },
|
||||
@ -52,7 +51,7 @@ export const columns: VxeGridProps['columns'] = [
|
||||
// },
|
||||
{
|
||||
title: '员工编号',
|
||||
field: 'userId',
|
||||
field: 'id',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
@ -70,7 +69,7 @@ export const columns: VxeGridProps['columns'] = [
|
||||
field: 'gender',
|
||||
slots: {
|
||||
default: ({ row }) => {
|
||||
return renderDict(row.gender, 'sys_user_sex');
|
||||
return renderDict(row.gender, 'sys_user_sex')
|
||||
},
|
||||
},
|
||||
width: 100,
|
||||
@ -105,7 +104,7 @@ export const columns: VxeGridProps['columns'] = [
|
||||
field: 'state',
|
||||
slots: {
|
||||
default: ({ row }) => {
|
||||
return renderDict(row.state, 'wy_rzryzt');
|
||||
return renderDict(row.state, 'wy_rzryzt')
|
||||
},
|
||||
},
|
||||
width: 100,
|
||||
@ -122,9 +121,9 @@ export const columns: VxeGridProps['columns'] = [
|
||||
title: '操作',
|
||||
minWidth: 180,
|
||||
},
|
||||
];
|
||||
]
|
||||
|
||||
let authGroupArr: AuthGroupVO[] = [];
|
||||
let authGroupArr: AuthGroupVO[] = []
|
||||
export const modalSchema: FormSchemaGetter = () => [
|
||||
{
|
||||
label: '主键id',
|
||||
@ -140,17 +139,20 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
fieldName: 'userName',
|
||||
component: 'Input',
|
||||
rules: 'required',
|
||||
formItemClass: 'col-span-1',
|
||||
},
|
||||
{
|
||||
label: '联系电话',
|
||||
fieldName: 'phone',
|
||||
component: 'Input',
|
||||
rules: 'required',
|
||||
formItemClass: 'col-span-1',
|
||||
},
|
||||
{
|
||||
label: '性别',
|
||||
fieldName: 'gender',
|
||||
component: 'Select',
|
||||
formItemClass: 'col-span-2',
|
||||
componentProps: {
|
||||
options: getDictOptions('sys_user_sex'),
|
||||
},
|
||||
@ -161,18 +163,30 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
fieldName: 'idCard',
|
||||
component: 'Input',
|
||||
rules: 'required',
|
||||
formItemClass: 'col-span-1',
|
||||
},
|
||||
{
|
||||
label: '邮箱',
|
||||
fieldName: 'email',
|
||||
component: 'Input',
|
||||
formItemClass: 'col-span-1',
|
||||
},
|
||||
{
|
||||
label: '人员状态',
|
||||
fieldName: 'state',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options: getDictOptions('wy_rzryzt'),
|
||||
options: getDictOptions('wy_rzryzt')
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
formItemClass: 'col-span-2',
|
||||
},
|
||||
{
|
||||
label: '人员类型',
|
||||
fieldName: 'type',
|
||||
component: 'Select',
|
||||
componentProps: {
|
||||
options: getDictOptions('wy_rzrylx'),
|
||||
},
|
||||
rules: 'selectRequired',
|
||||
},
|
||||
@ -187,7 +201,7 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
label: '所属单位',
|
||||
fieldName: 'unitId',
|
||||
component: 'Select',
|
||||
formItemClass: 'col-span-2',
|
||||
formItemClass: 'col-span-4',
|
||||
rules: 'selectRequired',
|
||||
},
|
||||
// {
|
||||
@ -207,37 +221,66 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||
},
|
||||
rules: 'required',
|
||||
formItemClass: 'col-span-1',
|
||||
},
|
||||
{
|
||||
label: '车牌号码',
|
||||
fieldName: 'carNumber',
|
||||
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: '授权期限',
|
||||
fieldName: 'authTime',
|
||||
component: 'RangePicker',
|
||||
formItemClass: 'col-span-1',
|
||||
componentProps: {
|
||||
class: 'w-auto',
|
||||
showTime: true,
|
||||
format: 'YYYY-MM-DD HH:mm:ss',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||
},
|
||||
dependencies: {
|
||||
show: (values) => {
|
||||
return typeof values.id !== 'undefined';
|
||||
return typeof values.id !== 'undefined'
|
||||
},
|
||||
triggerFields: ['id'],
|
||||
disabled:(values) => {
|
||||
return !values.authSwitch
|
||||
},
|
||||
triggerFields: ['id', 'authSwitch'],
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '通行权限组',
|
||||
fieldName: 'authGroupId',
|
||||
component: 'ApiSelect',
|
||||
formItemClass: 'col-span-2',
|
||||
dependencies: {
|
||||
show: (values) => {
|
||||
return typeof values.id !== 'undefined';
|
||||
return typeof values.id !== 'undefined'
|
||||
},
|
||||
triggerFields: ['id'],
|
||||
disabled:(values) => {
|
||||
return !values.authSwitch
|
||||
},
|
||||
triggerFields: ['id', 'authSwitch'],
|
||||
},
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
@ -248,14 +291,13 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
api: async () => {
|
||||
if (!authGroupArr || authGroupArr.length == 0) {
|
||||
const params: AuthGroupQuery = {
|
||||
groupType: 2,
|
||||
pageNum: 1,
|
||||
pageSize: 500,
|
||||
};
|
||||
const res = await authGroupList(params);
|
||||
authGroupArr = res.rows;
|
||||
}
|
||||
const res = await authGroupList(params)
|
||||
authGroupArr = res.rows
|
||||
}
|
||||
return authGroupArr;
|
||||
return authGroupArr
|
||||
},
|
||||
},
|
||||
},
|
||||
@ -267,15 +309,15 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
// accept: 'image/*', // 可选拓展名或者mime类型 ,拼接
|
||||
maxCount: 1, // 最大上传文件数 默认为1 为1会绑定为string而非string[]类型
|
||||
},
|
||||
formItemClass: 'col-span-2',
|
||||
formItemClass: 'col-span-3',
|
||||
},
|
||||
{
|
||||
label: '备注',
|
||||
fieldName: 'remark',
|
||||
component: 'Textarea',
|
||||
formItemClass: 'col-span-2',
|
||||
formItemClass: 'col-span-3',
|
||||
},
|
||||
];
|
||||
]
|
||||
|
||||
//门禁记录
|
||||
export const accessControlColumns: VxeGridProps['columns'] = [
|
||||
@ -311,7 +353,7 @@ export const accessControlColumns: VxeGridProps['columns'] = [
|
||||
title: '状态',
|
||||
field: 'locathon',
|
||||
},
|
||||
];
|
||||
]
|
||||
|
||||
//车辆记录
|
||||
export const carColumns: VxeGridProps['columns'] = [
|
||||
@ -355,22 +397,22 @@ export const carColumns: VxeGridProps['columns'] = [
|
||||
title: '备注',
|
||||
field: 'remark',
|
||||
},
|
||||
];
|
||||
]
|
||||
export async function getUnitList(): Promise<
|
||||
{ value: number; label: string }[]
|
||||
> {
|
||||
const queryParam = {
|
||||
pageNum: 1000,
|
||||
pageSize: 1,
|
||||
};
|
||||
const res = await resident_unitList(queryParam);
|
||||
const data: { value: number; label: string }[] = [];
|
||||
}
|
||||
const res = await resident_unitList(queryParam)
|
||||
const data: { value: number; label: string }[] = []
|
||||
|
||||
res.rows.forEach((r: any) => {
|
||||
data.push({
|
||||
value: r.id,
|
||||
label: r.name,
|
||||
});
|
||||
});
|
||||
return data;
|
||||
})
|
||||
})
|
||||
return data
|
||||
}
|
||||
|
@ -1,38 +1,38 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, reactive, ref } from "vue";
|
||||
import { useVbenModal } from "@vben/common-ui";
|
||||
import { $t } from "@vben/locales";
|
||||
import { cloneDeep } from "@vben/utils";
|
||||
import { useVbenForm } from "#/adapter/form";
|
||||
import { computed, reactive, ref } from "vue"
|
||||
import { useVbenModal } from "@vben/common-ui"
|
||||
import { $t } from "@vben/locales"
|
||||
import { cloneDeep } from "@vben/utils"
|
||||
import { useVbenForm } from "#/adapter/form"
|
||||
import {
|
||||
personAdd,
|
||||
personInfo,
|
||||
personUpdate,
|
||||
} from "#/api/property/resident/person";
|
||||
import { defaultFormValueGetter, useBeforeCloseDiff } from "#/utils/popup";
|
||||
import { modalSchema } from "./data";
|
||||
import QueryUserList from "./query-user-list.vue";
|
||||
import QueryUnitList from "./query-unit-list.vue";
|
||||
} from "#/api/property/resident/person"
|
||||
import { defaultFormValueGetter, useBeforeCloseDiff } from "#/utils/popup"
|
||||
import { modalSchema } from "./data"
|
||||
import QueryUserList from "./query-user-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(() => {
|
||||
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({
|
||||
userId: "",
|
||||
userName: "",
|
||||
phone: "",
|
||||
gender: "",
|
||||
});
|
||||
let unitName = ref("");
|
||||
const userId = ref<number | string>(0);
|
||||
const unitId = ref<string>("");
|
||||
})
|
||||
let unitName = ref("")
|
||||
const userId = ref<number | string>(0)
|
||||
const unitId = ref<string>("")
|
||||
const [BasicForm, formApi] = useVbenForm({
|
||||
commonConfig: {
|
||||
// 默认占满两列
|
||||
formItemClass: "col-span-1",
|
||||
formItemClass: "col-span-4",
|
||||
// 默认label宽度 px
|
||||
labelWidth: 100,
|
||||
// 通用配置项 会影响到所有表单项
|
||||
@ -43,88 +43,89 @@ const [BasicForm, formApi] = useVbenForm({
|
||||
schema: modalSchema(),
|
||||
showDefaultActions: false,
|
||||
wrapperClass: "grid-cols-2",
|
||||
});
|
||||
})
|
||||
|
||||
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
||||
{
|
||||
initializedGetter: defaultFormValueGetter(formApi),
|
||||
currentGetter: defaultFormValueGetter(formApi),
|
||||
}
|
||||
);
|
||||
)
|
||||
|
||||
const [BasicModal, modalApi] = useVbenModal({
|
||||
// 在这里更改宽度
|
||||
class: "w-[70%]",
|
||||
class: "w-[75%]",
|
||||
fullscreenButton: false,
|
||||
onBeforeClose,
|
||||
onClosed: handleClosed,
|
||||
onConfirm: handleConfirm,
|
||||
onOpenChange: async (isOpen) => {
|
||||
if (!isOpen) {
|
||||
return null;
|
||||
return null
|
||||
}
|
||||
modalApi.modalLoading(true);
|
||||
modalApi.modalLoading(true)
|
||||
|
||||
const { id } = modalApi.getData() as { id?: number | string };
|
||||
isUpdate.value = !!id;
|
||||
const { id } = modalApi.getData() as { id?: number | string }
|
||||
isUpdate.value = !!id
|
||||
|
||||
if (isUpdate.value && id) {
|
||||
const record = await personInfo(id);
|
||||
userId.value = record.userId;
|
||||
unitId.value = record.unitId.toString();
|
||||
record.state = record.state?.toString();
|
||||
await formApi.setValues(record);
|
||||
const record = await personInfo(id)
|
||||
userId.value = record.userId
|
||||
unitId.value = record.unitId.toString()
|
||||
record.state = record.state?.toString()
|
||||
record.authTime = [record.authBegDate, record.authEndDate]
|
||||
await formApi.setValues(record)
|
||||
}
|
||||
await markInitialized();
|
||||
await markInitialized()
|
||||
|
||||
modalApi.modalLoading(false);
|
||||
modalApi.modalLoading(false)
|
||||
},
|
||||
});
|
||||
})
|
||||
|
||||
async function handleConfirm() {
|
||||
try {
|
||||
modalApi.lock(true);
|
||||
const { valid } = await formApi.validate();
|
||||
modalApi.lock(true)
|
||||
const { valid } = await formApi.validate()
|
||||
if (!valid) {
|
||||
return;
|
||||
return
|
||||
}
|
||||
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
||||
let data = cloneDeep(await formApi.getValues());
|
||||
let data = cloneDeep(await formApi.getValues())
|
||||
// if (userInfo) {
|
||||
// data.userName = userInfo.userName
|
||||
// data.phone = userInfo.phone
|
||||
// data.gender = userInfo.gender
|
||||
// }
|
||||
if (unitName.value) {
|
||||
data.unitName = unitName.value;
|
||||
data.unitName = unitName.value
|
||||
}
|
||||
|
||||
if (isUpdate.value && data.authTime !== 0) {
|
||||
data.authBegDate = data.authTime[0];
|
||||
data.authEndDate = data.authTime[1];
|
||||
if (isUpdate.value && data.authSwitch) {
|
||||
data.authBegDate = data.authTime[0]
|
||||
data.authEndDate = data.authTime[1]
|
||||
}
|
||||
await (isUpdate.value ? personUpdate(data) : personAdd(data));
|
||||
resetInitialized();
|
||||
emit("reload");
|
||||
modalApi.close();
|
||||
await (isUpdate.value ? personUpdate(data) : personAdd(data))
|
||||
resetInitialized()
|
||||
emit("reload")
|
||||
modalApi.close()
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
console.error(error)
|
||||
} finally {
|
||||
modalApi.lock(false);
|
||||
modalApi.lock(false)
|
||||
}
|
||||
}
|
||||
|
||||
async function handleClosed() {
|
||||
await formApi.resetForm();
|
||||
resetInitialized();
|
||||
await formApi.resetForm()
|
||||
resetInitialized()
|
||||
}
|
||||
|
||||
function getUserInfo(user: any) {
|
||||
userInfo = user;
|
||||
userInfo = user
|
||||
}
|
||||
|
||||
function getUnitInfo(unit: { name: string }) {
|
||||
unitName.value = unit.name;
|
||||
unitName.value = unit.name
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -132,16 +133,10 @@ function getUnitInfo(unit: { name: string }) {
|
||||
<BasicModal :title="title">
|
||||
<BasicForm>
|
||||
<template #userId="slotProps">
|
||||
<QueryUserList @update:userInfo="getUserInfo"
|
||||
v-bind="slotProps"
|
||||
:isUpdate="isUpdate"
|
||||
:userId="userId" />
|
||||
<QueryUserList @update:userInfo="getUserInfo" v-bind="slotProps" :isUpdate="isUpdate" :userId="userId" />
|
||||
</template>
|
||||
<template #unitId="slotProps">
|
||||
<QueryUnitList @update:unitInfo="getUnitInfo"
|
||||
v-bind="slotProps"
|
||||
:isUpdate="isUpdate"
|
||||
:unitId="unitId" />
|
||||
<QueryUnitList @update:unitInfo="getUnitInfo" v-bind="slotProps" :isUpdate="isUpdate" :unitId="unitId" />
|
||||
</template>
|
||||
</BasicForm>
|
||||
</BasicModal>
|
||||
|
@ -176,7 +176,7 @@ export const modalSchema: FormSchemaGetter = () => [
|
||||
},
|
||||
{
|
||||
label: '',
|
||||
fieldName: 'time',
|
||||
fieldName: 'Placeholder',
|
||||
component: ''
|
||||
},
|
||||
{
|
||||
|
@ -1,23 +1,23 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, ref } from 'vue';
|
||||
import { computed, ref } from 'vue'
|
||||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
import { $t } from '@vben/locales';
|
||||
import {cloneDeep, handleNode} from '@vben/utils';
|
||||
import { useVbenModal } from '@vben/common-ui'
|
||||
import { $t } from '@vben/locales'
|
||||
import { cloneDeep, handleNode } from '@vben/utils'
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
import { resident_unitAdd, resident_unitInfo, resident_unitUpdate } from '#/api/property/resident/unit';
|
||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||
import { useVbenForm } from '#/adapter/form'
|
||||
import { resident_unitAdd, resident_unitInfo, resident_unitUpdate } from '#/api/property/resident/unit'
|
||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup'
|
||||
|
||||
import { modalSchema } from './data';
|
||||
import {communityTree} from "#/api/property/community";
|
||||
import { modalSchema } from './data'
|
||||
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(() => {
|
||||
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({
|
||||
commonConfig: {
|
||||
@ -33,14 +33,14 @@ const [BasicForm, formApi] = useVbenForm({
|
||||
schema: modalSchema(),
|
||||
showDefaultActions: false,
|
||||
wrapperClass: 'grid-cols-2',
|
||||
});
|
||||
})
|
||||
|
||||
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
||||
{
|
||||
initializedGetter: defaultFormValueGetter(formApi),
|
||||
currentGetter: defaultFormValueGetter(formApi),
|
||||
},
|
||||
);
|
||||
)
|
||||
|
||||
const [BasicModal, modalApi] = useVbenModal({
|
||||
// 在这里更改宽度
|
||||
@ -51,53 +51,57 @@ const [BasicModal, modalApi] = useVbenModal({
|
||||
onConfirm: handleConfirm,
|
||||
onOpenChange: async (isOpen) => {
|
||||
if (!isOpen) {
|
||||
return null;
|
||||
return null
|
||||
}
|
||||
modalApi.modalLoading(true);
|
||||
modalApi.modalLoading(true)
|
||||
|
||||
const { id } = modalApi.getData() as { id?: number | string };
|
||||
isUpdate.value = !!id;
|
||||
const { id } = modalApi.getData() as { id?: number | string }
|
||||
isUpdate.value = !!id
|
||||
await initLocationOptions()
|
||||
if (isUpdate.value && id) {
|
||||
const record = await resident_unitInfo(id);
|
||||
await formApi.setValues(record);
|
||||
const record = await resident_unitInfo(id)
|
||||
await formApi.setValues(record)
|
||||
}
|
||||
await markInitialized();
|
||||
await markInitialized()
|
||||
|
||||
modalApi.modalLoading(false);
|
||||
modalApi.modalLoading(false)
|
||||
},
|
||||
});
|
||||
})
|
||||
|
||||
async function handleConfirm() {
|
||||
try {
|
||||
modalApi.lock(true);
|
||||
const { valid } = await formApi.validate();
|
||||
modalApi.lock(true)
|
||||
const { valid } = await formApi.validate()
|
||||
if (!valid) {
|
||||
return;
|
||||
return
|
||||
}
|
||||
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
||||
const data = cloneDeep(await formApi.getValues());
|
||||
await (isUpdate.value ? resident_unitUpdate(data) : resident_unitAdd(data));
|
||||
resetInitialized();
|
||||
emit('reload');
|
||||
modalApi.close();
|
||||
const data = cloneDeep(await formApi.getValues())
|
||||
|
||||
data.authBegDate = data.authTime[0]
|
||||
data.authEndDate = data.authTime[1]
|
||||
|
||||
await (isUpdate.value ? resident_unitUpdate(data) : resident_unitAdd(data))
|
||||
resetInitialized()
|
||||
emit('reload')
|
||||
modalApi.close()
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
console.error(error)
|
||||
} finally {
|
||||
modalApi.lock(false);
|
||||
modalApi.lock(false)
|
||||
}
|
||||
}
|
||||
/**
|
||||
* 入驻位置数据
|
||||
*/
|
||||
async function initLocationOptions() {
|
||||
const locationList = await communityTree(5);
|
||||
const splitStr = '/';
|
||||
const locationList = await communityTree(5)
|
||||
const splitStr = '/'
|
||||
handleNode(locationList, 'label', splitStr, function (node: any) {
|
||||
if (node.level != 5) {
|
||||
node.disabled = true;
|
||||
node.disabled = true
|
||||
}
|
||||
});
|
||||
})
|
||||
formApi.updateSchema([
|
||||
{
|
||||
componentProps: () => ({
|
||||
@ -120,12 +124,12 @@ async function initLocationOptions() {
|
||||
}),
|
||||
fieldName: 'location',
|
||||
},
|
||||
]);
|
||||
])
|
||||
}
|
||||
|
||||
async function handleClosed() {
|
||||
await formApi.resetForm();
|
||||
resetInitialized();
|
||||
await formApi.resetForm()
|
||||
resetInitialized()
|
||||
}
|
||||
</script>
|
||||
|
||||
|
@ -68,7 +68,6 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
|
||||
.box{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 3fr;
|
||||
gap: 30px;
|
||||
|
||||
.right {
|
||||
width: 100%;
|
||||
|
@ -68,6 +68,5 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
|
||||
.box{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 3fr;
|
||||
gap: 30px;
|
||||
}
|
||||
</style>
|
||||
|
@ -386,7 +386,7 @@ onBeforeUnmount(() => {
|
||||
}
|
||||
|
||||
.power-chart{
|
||||
height: 380px;
|
||||
height: 55vh;
|
||||
}
|
||||
|
||||
.energy-chart{
|
||||
|
@ -198,7 +198,7 @@ onMounted(()=>{
|
||||
<div class="box">
|
||||
<div class="left"><FloorTree></FloorTree></div>
|
||||
<div class="right">
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 10px;">
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;">
|
||||
<div>
|
||||
<div style="display: flex;justify-content: space-between;">
|
||||
<DatePicker
|
||||
@ -207,9 +207,9 @@ onMounted(()=>{
|
||||
picker="month"
|
||||
/>当月能耗总值:30.00t</div>
|
||||
</div>
|
||||
<div id="month" style="height: 250px;width: 100%;"></div>
|
||||
<div id="month" style="height: 350px;width: 100%;"></div>
|
||||
</div>
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 10px;">
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;margin-top: 16px;">
|
||||
<div>
|
||||
<div style="display: flex;justify-content: space-between;">
|
||||
<DatePicker
|
||||
@ -218,7 +218,7 @@ onMounted(()=>{
|
||||
picker="year"
|
||||
/>当年能耗总值:59.00t</div>
|
||||
</div>
|
||||
<div id="year" style="height: 250px;width: 100%;"></div>
|
||||
<div id="year" style="height: 350px;width: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -228,7 +228,7 @@ onMounted(()=>{
|
||||
.box{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 3fr;
|
||||
gap: 30px;
|
||||
padding: 10px;
|
||||
gap: 16px;
|
||||
padding: 16px;
|
||||
}
|
||||
</style>
|
||||
|
@ -134,7 +134,7 @@ const data = [...Array(32)].map((_, i) => ({
|
||||
<div class="box">
|
||||
<div class="left"><FloorTree></FloorTree></div>
|
||||
<div class="right">
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;margin-bottom: 10px;">
|
||||
<div style="background: #fff;border-radius: 8px;padding: 10px;margin-bottom: 16px;">
|
||||
<div>
|
||||
年份
|
||||
<DatePicker
|
||||
@ -156,7 +156,7 @@ const data = [...Array(32)].map((_, i) => ({
|
||||
:columns="columns"
|
||||
:data-source="data"
|
||||
:pagination="false"
|
||||
:scroll="{ y: 270 }"
|
||||
:scroll="{ y: '50vh' }"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -167,7 +167,7 @@ const data = [...Array(32)].map((_, i) => ({
|
||||
.box{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 3fr;
|
||||
gap: 30px;
|
||||
padding: 10px;
|
||||
gap: 16px;
|
||||
padding: 16px;
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user