This commit is contained in:
fyy
2025-07-19 17:27:33 +08:00
14 changed files with 1013 additions and 722 deletions

View File

@@ -1,61 +0,0 @@
import type { MeterVO, MeterForm, MeterQuery } from './model';
import type { ID, IDS } from '#/api/common';
import type { PageResult } from '#/api/common';
import { commonExport } from '#/api/helper';
import { requestClient } from '#/api/request';
/**
* 查询水电气列表
* @param params
* @returns 水电气列表
*/
export function meterList(params?: MeterQuery) {
return requestClient.get<PageResult<MeterVO>>('/property/meter/list', { params });
}
/**
* 导出水电气列表
* @param params
* @returns 水电气列表
*/
export function meterExport(params?: MeterQuery) {
return commonExport('/property/meter/export', params ?? {});
}
/**
* 查询水电气详情
* @param id id
* @returns 水电气详情
*/
export function meterInfo(id: ID) {
return requestClient.get<MeterVO>(`/property/meter/${id}`);
}
/**
* 新增水电气
* @param data
* @returns void
*/
export function meterAdd(data: MeterForm) {
return requestClient.postWithMsg<void>('/property/meter', data);
}
/**
* 更新水电气
* @param data
* @returns void
*/
export function meterUpdate(data: MeterForm) {
return requestClient.putWithMsg<void>('/property/meter', data);
}
/**
* 删除水电气
* @param id id
* @returns void
*/
export function meterRemove(id: ID | IDS) {
return requestClient.deleteWithMsg<void>(`/property/meter/${id}`);
}

View File

@@ -0,0 +1,61 @@
import type { MeterInfoVO, MeterInfoForm, MeterInfoQuery } from './model';
import type { ID, IDS } from '#/api/common';
import type { PageResult } from '#/api/common';
import { commonExport } from '#/api/helper';
import { requestClient } from '#/api/request';
/**
* 查询水电气列表
* @param params
* @returns 水电气列表
*/
export function meterInfoList(params?: MeterInfoQuery) {
return requestClient.get<PageResult<MeterInfoVO>>('/property/meterInfo/list', { params });
}
/**
* 导出水电气列表
* @param params
* @returns 水电气列表
*/
export function meterInfoExport(params?: MeterInfoQuery) {
return commonExport('/property/meterInfo/export', params ?? {});
}
/**
* 查询水电气详情
* @param id id
* @returns 水电气详情
*/
export function meterInfoInfo(id: ID) {
return requestClient.get<MeterInfoVO>(`/property/meterInfo/${id}`);
}
/**
* 新增水电气
* @param data
* @returns void
*/
export function meterInfoAdd(data: MeterInfoForm) {
return requestClient.postWithMsg<void>('/property/meterInfo', data);
}
/**
* 更新水电气
* @param data
* @returns void
*/
export function meterInfoUpdate(data: MeterInfoForm) {
return requestClient.putWithMsg<void>('/property/meterInfo', data);
}
/**
* 删除水电气
* @param id id
* @returns void
*/
export function meterInfoRemove(id: ID | IDS) {
return requestClient.deleteWithMsg<void>(`/property/meterInfo/${id}`);
}

View File

@@ -0,0 +1,184 @@
import type { PageQuery, BaseEntity } from '#/api/common';
export interface MeterInfoVO {
/**
* 主键id
*/
id: string | number;
/**
* 仪表名称
*/
meterName: string;
/**
* 仪表编码
*/
meterCode: string;
/**
* 设备厂商
*/
factoryNo: string;
/**
* 设备类型(1-电表2-水表3-气表)
*/
meterType: number;
/**
* 计量单位(1-度2-吨3-立方米)
*/
meterUnit: number;
/**
* 安装位置
*/
installLocation: string;
/**
* 初始读数
*/
initReading: number;
/**
* 最大量程
*/
maxRang: number;
/**
* 通信状态
*/
communicationState: number;
/**
* 运行状态
*/
runningState: number;
/**
* 备注
*/
remark: string;
}
export interface MeterInfoForm extends BaseEntity {
/**
* 主键id
*/
id?: string | number;
/**
* 仪表名称
*/
meterName?: string;
/**
* 仪表编码
*/
meterCode?: string;
/**
* 设备厂商
*/
factoryNo?: string;
/**
* 设备类型(1-电表2-水表3-气表)
*/
meterType?: number;
/**
* 计量单位(1-度2-吨3-立方米)
*/
meterUnit?: number;
/**
* 安装位置
*/
installLocation?: string;
/**
* 初始读数
*/
initReading?: number;
/**
* 最大量程
*/
maxRang?: number;
/**
* 通信状态
*/
communicationState?: number;
/**
* 运行状态
*/
runningState?: number;
/**
* 备注
*/
remark?: string;
}
export interface MeterInfoQuery extends PageQuery {
/**
* 仪表名称
*/
meterName?: string;
/**
* 仪表编码
*/
meterCode?: string;
/**
* 设备厂商
*/
factoryNo?: string;
/**
* 设备类型(1-电表2-水表3-气表)
*/
meterType?: number;
/**
* 计量单位(1-度2-吨3-立方米)
*/
meterUnit?: number;
/**
* 安装位置
*/
installLocation?: string;
/**
* 初始读数
*/
initReading?: number;
/**
* 最大量程
*/
maxRang?: number;
/**
* 通信状态
*/
communicationState?: number;
/**
* 运行状态
*/
runningState?: number;
/**
* 日期范围参数
*/
params?: any;
}

View File

@@ -1,229 +0,0 @@
import type { PageQuery, BaseEntity } from '#/api/common';
export interface MeterVO {
/**
* 主键id
*/
id: string | number;
/**
* 水表名称
*/
meterName: string;
/**
* 设备编码
*/
meterCode: string;
/**
* 设备厂商
*/
factoryNo: string;
/**
* 设备类型(1-电表2-水表3-气表)
*/
meterType: number;
/**
* 表用途(1-分表2-总表3-公摊表)
*/
meterPurpose: number;
/**
* 分摊类型1-不公摊2-按分表用量3-按租客面积4-按房源数量5-按固定比例)
*/
shareType: number;
/**
* 付费类型(1-先付费2-后付费)
*/
payType: number;
/**
* 当前表显示读数
*/
display: number;
/**
* 最大表显读数(超过归0)
*/
maxDisplay: number;
/**
* 计费倍率
*/
billingRate: number;
/**
* 剩余量
*/
surplus: number;
/**
* 通信状态
*/
communicationState: number;
/**
* 运行状态
*/
runningState: number;
/**
* 备注
*/
remark: string;
}
export interface MeterForm extends BaseEntity {
/**
* 主键id
*/
id?: string | number;
/**
* 水表名称
*/
meterName?: string;
/**
* 设备编码
*/
meterCode?: string;
/**
* 设备厂商
*/
factoryNo?: string;
/**
* 设备类型(1-电表2-水表3-气表)
*/
meterType?: number;
/**
* 表用途(1-分表2-总表3-公摊表)
*/
meterPurpose?: number;
/**
* 分摊类型1-不公摊2-按分表用量3-按租客面积4-按房源数量5-按固定比例)
*/
shareType?: number;
/**
* 付费类型(1-先付费2-后付费)
*/
payType?: number;
/**
* 当前表显示读数
*/
display?: number;
/**
* 最大表显读数(超过归0)
*/
maxDisplay?: number;
/**
* 计费倍率
*/
billingRate?: number;
/**
* 剩余量
*/
surplus?: number;
/**
* 通信状态
*/
communicationState?: number;
/**
* 运行状态
*/
runningState?: number;
/**
* 备注
*/
remark?: string;
}
export interface MeterQuery extends PageQuery {
/**
* 水表名称
*/
meterName?: string;
/**
* 设备编码
*/
meterCode?: string;
/**
* 设备厂商
*/
factoryNo?: string;
/**
* 设备类型(1-电表2-水表3-气表)
*/
meterType?: number;
/**
* 表用途(1-分表2-总表3-公摊表)
*/
meterPurpose?: number;
/**
* 分摊类型1-不公摊2-按分表用量3-按租客面积4-按房源数量5-按固定比例)
*/
shareType?: number;
/**
* 付费类型(1-先付费2-后付费)
*/
payType?: number;
/**
* 当前表显示读数
*/
display?: number;
/**
* 最大表显读数(超过归0)
*/
maxDisplay?: number;
/**
* 计费倍率
*/
billingRate?: number;
/**
* 剩余量
*/
surplus?: number;
/**
* 通信状态
*/
communicationState?: number;
/**
* 运行状态
*/
runningState?: number;
/**
* 日期范围参数
*/
params?: any;
}

View File

@@ -1,6 +1,6 @@
import type { FormSchemaGetter } from '#/adapter/form';
import type { VxeGridProps } from '#/adapter/vxe-table';
import {getDictOptions} from "#/utils/dict";
export const querySchema: FormSchemaGetter = () => [
{
@@ -9,68 +9,25 @@ export const querySchema: FormSchemaGetter = () => [
label: '班次名称',
},
{
component: 'DatePicker',
component: 'Select',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
fieldName: 'startTime',
label: '考勤开始时间',
},
{
component: 'DatePicker',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
fieldName: 'endTime',
label: '考勤结束时间',
},
{
component: 'RadioGroup',
componentProps: {
buttonStyle: 'solid',
optionType: 'button',
options: getDictOptions('wy_state'),
},
fieldName: 'status',
label: '状态',
},
{
component: 'Input',
fieldName: 'isRest',
label: '是否休息',
},
{
component: 'DatePicker',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
fieldName: 'restStartTime',
label: '休息开始时间',
},
{
component: 'DatePicker',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
fieldName: 'restEndTime',
label: '休息结束时间',
},
];
// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
// export const columns: () => VxeGridProps['columns'] = () => [
export const columns: VxeGridProps['columns'] = [
{ type: 'checkbox', width: 60 },
{
title: '主键id',
title: '序号',
field: 'id',
slots: {
default: ({ rowIndex }) => {
return (rowIndex + 1).toString();
},
},
},
{
title: '班次名称',
@@ -87,18 +44,7 @@ export const columns: VxeGridProps['columns'] = [
{
title: '状态',
field: 'status',
},
{
title: '是否休息',
field: 'isRest',
},
{
title: '休息开始时间',
field: 'restStartTime',
},
{
title: '休息结束时间',
field: 'restEndTime',
slots: {default: 'state'},
},
{
field: 'action',
@@ -125,57 +71,46 @@ export const modalSchema: FormSchemaGetter = () => [
component: 'Input',
},
{
label: '考勤开始时间',
fieldName: 'startTime',
component: 'DatePicker',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
label: '考勤时间',
fieldName: 'attendanceTimeRange',
component: 'Input',
rules: 'required',
slots:{
default: 'attendanceTimeRange'
}
},
{
label: '考勤结束时间',
fieldName: 'endTime',
component: 'DatePicker',
label: '是否休息',
fieldName: 'isRest',
component: 'RadioGroup',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
options: [
{ label: '不休息', value: '0' },
{ label: '休息', value: '1' },
],
},
rules: 'required',
},
{
label: '中途休息时间',
fieldName: 'restTimeRange',
component: 'Input',
rules: 'required',
slots:{
default: 'restTimeRange'
},
dependencies: {
show: (formValue) =>formValue.isRest==1 ,
triggerFields: ['isRest'],
},
},
{
label: '状态',
fieldName: 'status',
component: 'RadioGroup',
component: 'Select',
componentProps: {
buttonStyle: 'solid',
optionType: 'button',
},
},
{
label: '是否休息',
fieldName: 'isRest',
component: 'Input',
},
{
label: '休息开始时间',
fieldName: 'restStartTime',
component: 'DatePicker',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
},
},
{
label: '休息结束时间',
fieldName: 'restEndTime',
component: 'DatePicker',
componentProps: {
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
options: getDictOptions('wy_state'),
},
rules: 'required',
},
];

View File

@@ -1,30 +1,22 @@
<script setup lang="ts">
import type { Recordable } from '@vben/types';
import { ref } from 'vue';
import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
import { getVxePopupContainer } from '@vben/utils';
import { Modal, Popconfirm, Space } from 'ant-design-vue';
import dayjs from 'dayjs';
import {
useVbenVxeGrid,
vxeCheckboxChecked,
type VxeGridProps
} from '#/adapter/vxe-table';
import {
shiftExport,
shiftList,
shiftRemove,
} from '#/api/Property/attendanceManagement/shiftSetting';
import type { ShiftForm } from '#/api/Property/attendanceManagement/shiftSetting/model';
import { commonDownloadExcel } from '#/utils/file/download';
shiftUpdate
} from '#/api/property/attendanceManagement/shiftSetting';
import type { ShiftForm } from '#/api/property/attendanceManagement/shiftSetting/model';
import shiftModal from './shift-modal.vue';
import shiftDetail from './shift-detail.vue';
import { columns, querySchema } from './data';
import {TableSwitch} from "#/components/table";
const formOptions: VbenFormProps = {
commonConfig: {
@@ -35,28 +27,13 @@ const formOptions: VbenFormProps = {
},
schema: querySchema(),
wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
// 处理区间选择器RangePicker时间格式 将一个字段映射为两个字段 搜索/导出会用到
// 不需要直接删除
// fieldMappingTime: [
// [
// 'createTime',
// ['params[beginTime]', 'params[endTime]'],
// ['YYYY-MM-DD 00:00:00', 'YYYY-MM-DD 23:59:59'],
// ],
// ],
};
const gridOptions: VxeGridProps = {
checkboxConfig: {
// 高亮
highlight: true,
// 翻页时保留选中状态
reserve: true,
// 点击行选中
// trigger: 'row',
},
// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
// columns: columns(),
columns,
height: 'auto',
keepSource: true,
@@ -75,7 +52,6 @@ const gridOptions: VxeGridProps = {
rowConfig: {
keyField: 'id',
},
// 表格全局唯一表示 保存列配置需要用到
id: 'Property-shift-index'
};
@@ -84,6 +60,15 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
gridOptions,
});
const [shiftDetailModal, shiftDetailApi] = useVbenModal({
connectedComponent: shiftDetail,
});
async function handleInfo(row: Required<ShiftForm>) {
shiftDetailApi.setData({ id: row.id });
shiftDetailApi.open();
}
const [ShiftModal, modalApi] = useVbenModal({
connectedComponent: shiftModal,
});
@@ -116,12 +101,6 @@ function handleMultiDelete() {
},
});
}
function handleDownloadExcel() {
commonDownloadExcel(shiftExport, '班次表数据', tableApi.formApi.form.values, {
fieldMappingTime: formOptions.fieldMappingTime,
});
}
</script>
<template>
@@ -129,12 +108,6 @@ function handleDownloadExcel() {
<BasicTable table-title="班次表列表">
<template #toolbar-tools>
<Space>
<a-button
v-access:code="['Property:shift:export']"
@click="handleDownloadExcel"
>
{{ $t('pages.common.export') }}
</a-button>
<a-button
:disabled="!vxeCheckboxChecked(tableApi)"
danger
@@ -152,8 +125,22 @@ function handleDownloadExcel() {
</a-button>
</Space>
</template>
<template #state="{ row }">
<TableSwitch
:checkedValue="1"
:unCheckedValue="0"
v-model:value="row.status"
:api="() => shiftUpdate(row)"
@reload="() => tableApi.query()"
/>
</template>
<template #action="{ row }">
<Space>
<ghost-button
@click.stop="handleInfo(row)"
>
{{ $t('pages.common.info') }}
</ghost-button>
<ghost-button
v-access:code="['Property:shift:edit']"
@click.stop="handleEdit(row)"
@@ -178,5 +165,6 @@ function handleDownloadExcel() {
</template>
</BasicTable>
<ShiftModal @reload="tableApi.query()" />
<shiftDetailModal/>
</Page>
</template>

View File

@@ -0,0 +1,58 @@
<script setup lang="ts">
import type {ShiftVO} from '#/api/property/attendanceManagement/shiftSetting/model';
import {shallowRef} from 'vue';
import {useVbenModal} from '@vben/common-ui';
import {Descriptions, DescriptionsItem} from 'ant-design-vue';
import dayjs from 'dayjs';
import duration from 'dayjs/plugin/duration';
import relativeTime from 'dayjs/plugin/relativeTime';
import {shiftInfo} from '#/api/property/attendanceManagement/shiftSetting';
import {renderDict} from "#/utils/render";
dayjs.extend(duration);
dayjs.extend(relativeTime);
const [BasicModal, modalApi] = useVbenModal({
onOpenChange: handleOpenChange,
onClosed() {
shiftSettingDetail.value = null;
},
});
const shiftSettingDetail = shallowRef<null | ShiftVO>(null);
async function handleOpenChange(open: boolean) {
if (!open) {
return null;
}
modalApi.modalLoading(true);
const {id} = modalApi.getData() as { id: number | string };
shiftSettingDetail.value =await shiftInfo(id);
modalApi.modalLoading(false);
}
</script>
<template>
<BasicModal :footer="false" :fullscreen-button="false" title="班次管理详情" class="w-[70%]">
<Descriptions v-if="shiftSettingDetail" size="small" :column="2" bordered
:labelStyle="{width:'140px'}">
<DescriptionsItem label="班次名称">
{{ shiftSettingDetail.name }}
</DescriptionsItem>
<DescriptionsItem label="考勤时间">
{{ shiftSettingDetail.startTime ? shiftSettingDetail.startTime + '-' + shiftSettingDetail.endTime : '-' }}
</DescriptionsItem>
<DescriptionsItem label="是否休息">
{{ shiftSettingDetail.isRest===0 ? '不休息' : '休息' }}
</DescriptionsItem>
<DescriptionsItem label="中途休息时间">
{{ shiftSettingDetail.isRest===1 ? shiftSettingDetail.restStartTime + '-' + shiftSettingDetail.restEndTime : '-' }}
</DescriptionsItem>
<DescriptionsItem label="状态" v-if="shiftSettingDetail.status!=null">
<component
:is="renderDict(shiftSettingDetail.status,'wy_state')"
/>
</DescriptionsItem>
</Descriptions>
</BasicModal>
</template>

View File

@@ -1,15 +1,16 @@
<script setup lang="ts">
import { computed, ref } from 'vue';
import dayjs from 'dayjs';
import { useVbenModal } from '@vben/common-ui';
import { $t } from '@vben/locales';
import { cloneDeep } from '@vben/utils';
import { useVbenForm } from '#/adapter/form';
import { shiftAdd, shiftInfo, shiftUpdate } from '#/api/Property/attendanceManagement/shiftSetting';
import { shiftAdd, shiftInfo, shiftUpdate } from '#/api/property/attendanceManagement/shiftSetting';
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
import { modalSchema } from './data';
import {TimeRangePicker} from "ant-design-vue";
const emit = defineEmits<{ reload: [] }>();
@@ -23,7 +24,7 @@ const [BasicForm, formApi] = useVbenForm({
// 默认占满两列
formItemClass: 'col-span-2',
// 默认label宽度 px
labelWidth: 80,
labelWidth: 100,
// 通用配置项 会影响到所有表单项
componentProps: {
class: 'w-full',
@@ -76,6 +77,12 @@ async function handleConfirm() {
}
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
const data = cloneDeep(await formApi.getValues());
data.startTime = dayjs(data.attendanceTimeRange[0]).format('HH:mm:ss');
data.endTime = dayjs(data.attendanceTimeRange[1]).format('HH:mm:ss');
data.restStartTime = dayjs(data.restTimeRange[0]).format('HH:mm:ss');
data.restEndTime = dayjs(data.restTimeRange[1]).format('HH:mm:ss');
delete data.attendanceTimeRange;
delete data.restTimeRange;
await (isUpdate.value ? shiftUpdate(data) : shiftAdd(data));
resetInitialized();
emit('reload');
@@ -95,7 +102,14 @@ async function handleClosed() {
<template>
<BasicModal :title="title">
<BasicForm />
<BasicForm>
<template #attendanceTimeRange="slotProps">
<TimeRangePicker format="HH:mm:ss" v-bind="slotProps"></TimeRangePicker>
</template>
<template #restTimeRange="slotProps">
<TimeRangePicker format="HH:mm:ss" v-bind="slotProps"></TimeRangePicker>
</template>
</BasicForm>
</BasicModal>
</template>

View File

@@ -1,238 +0,0 @@
import type { FormSchemaGetter } from '#/adapter/form';
import type { VxeGridProps } from '#/adapter/vxe-table';
export const querySchema: FormSchemaGetter = () => [
{
component: 'Input',
fieldName: 'meterName',
label: '水表名称',
},
{
component: 'Input',
fieldName: 'meterCode',
label: '设备编码',
},
{
component: 'Input',
fieldName: 'factoryNo',
label: '设备厂商',
},
{
component: 'Select',
componentProps: {
},
fieldName: 'meterType',
label: '设备类型(1-电表2-水表3-气表)',
},
{
component: 'Input',
fieldName: 'meterPurpose',
label: '表用途(1-分表2-总表3-公摊表)',
},
{
component: 'Select',
componentProps: {
},
fieldName: 'shareType',
label: '分摊类型',
},
{
component: 'Select',
componentProps: {
},
fieldName: 'payType',
label: '付费类型(1-先付费2-后付费)',
},
{
component: 'Input',
fieldName: 'display',
label: '当前表显示读数',
},
{
component: 'Input',
fieldName: 'maxDisplay',
label: '最大表显读数(超过归0)',
},
{
component: 'Input',
fieldName: 'billingRate',
label: '计费倍率',
},
{
component: 'Input',
fieldName: 'surplus',
label: '剩余量',
},
{
component: 'Input',
fieldName: 'communicationState',
label: '通信状态',
},
{
component: 'Input',
fieldName: 'runningState',
label: '运行状态',
},
];
// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
// export const columns: () => VxeGridProps['columns'] = () => [
export const columns: VxeGridProps['columns'] = [
{ type: 'checkbox', width: 60 },
{
title: '主键id',
field: 'id',
},
{
title: '水表名称',
field: 'meterName',
},
{
title: '设备编码',
field: 'meterCode',
},
{
title: '设备厂商',
field: 'factoryNo',
},
{
title: '设备类型(1-电表2-水表3-气表)',
field: 'meterType',
},
{
title: '表用途(1-分表2-总表3-公摊表)',
field: 'meterPurpose',
},
{
title: '分摊类型',
field: 'shareType',
},
{
title: '付费类型(1-先付费2-后付费)',
field: 'payType',
},
{
title: '当前表显示读数',
field: 'display',
},
{
title: '最大表显读数(超过归0)',
field: 'maxDisplay',
},
{
title: '计费倍率',
field: 'billingRate',
},
{
title: '剩余量',
field: 'surplus',
},
{
title: '通信状态',
field: 'communicationState',
},
{
title: '运行状态',
field: 'runningState',
},
{
title: '备注',
field: 'remark',
},
{
field: 'action',
fixed: 'right',
slots: { default: 'action' },
title: '操作',
width: 180,
},
];
export const modalSchema: FormSchemaGetter = () => [
{
label: '主键id',
fieldName: 'id',
component: 'Input',
dependencies: {
show: () => false,
triggerFields: [''],
},
},
{
label: '水表名称',
fieldName: 'meterName',
component: 'Input',
},
{
label: '设备编码',
fieldName: 'meterCode',
component: 'Input',
},
{
label: '设备厂商',
fieldName: 'factoryNo',
component: 'Input',
},
{
label: '设备类型(1-电表2-水表3-气表)',
fieldName: 'meterType',
component: 'Select',
componentProps: {
},
},
{
label: '表用途(1-分表2-总表3-公摊表)',
fieldName: 'meterPurpose',
component: 'Input',
},
{
label: '分摊类型',
fieldName: 'shareType',
component: 'Select',
componentProps: {
},
},
{
label: '付费类型(1-先付费2-后付费)',
fieldName: 'payType',
component: 'Select',
componentProps: {
},
},
{
label: '当前表显示读数',
fieldName: 'display',
component: 'Input',
},
{
label: '最大表显读数(超过归0)',
fieldName: 'maxDisplay',
component: 'Input',
},
{
label: '计费倍率',
fieldName: 'billingRate',
component: 'Input',
},
{
label: '剩余量',
fieldName: 'surplus',
component: 'Input',
},
{
label: '通信状态',
fieldName: 'communicationState',
component: 'Input',
},
{
label: '运行状态',
fieldName: 'runningState',
component: 'Input',
},
{
label: '备注',
fieldName: 'remark',
component: 'Textarea',
},
];

View File

@@ -0,0 +1,203 @@
import type { FormSchemaGetter } from '#/adapter/form'
import type { VxeGridProps } from '#/adapter/vxe-table'
import { getDictOptions } from '#/utils/dict'
import { renderDict } from '#/utils/render'
export function initMoalForm(type: number) {
const modalSchema: FormSchemaGetter = () => [
{
label: '仪表名称',
fieldName: 'meterName',
component: 'Input',
rules: 'selectRequired',
},
{
label: '仪表编码',
fieldName: 'meterCode',
component: 'Input',
},
{
label: '设备厂商',
fieldName: 'factoryNo',
component: 'Input',
},
{
label: type === 1 ? '设备类型(电表)' : type === 2 ? '设备类型(水表)' : '设备类型(气表)',
fieldName: 'meterType',
component: 'Select',
defaultValue: type.toString(),
disabled: true,
componentProps: {
// 可选从DictEnum中获取 DictEnum.METER_TYPE 便于维护
options: getDictOptions('meter_type'),
},
rules: 'selectRequired',
},
{
label: type === 1 ? '计量单位(度)' : type === 2 ? '计量单位(吨)' : '计量单位(立方米)',
fieldName: 'meterUnit',
component: 'Select',
defaultValue: type.toString(),
disabled: true,
componentProps: {
// 可选从DictEnum中获取 DictEnum.METER_UNIT 便于维护
options: getDictOptions('meter_unit'),
},
rules: 'selectRequired',
},
{
label: '安装位置',
fieldName: 'installLocation',
component: 'Input',
},
{
label: '初始读数',
fieldName: 'initReading',
component: 'Input',
},
{
label: '最大量程',
fieldName: 'maxRang',
component: 'Input',
},
{
label: '通信状态',
fieldName: 'communicationState',
component: 'Select',
componentProps: {
// 可选从DictEnum中获取 DictEnum.SIS_DEVICE_STATUS 便于维护
options: getDictOptions('sis_device_status'),
},
},
{
label: '运行状态',
fieldName: 'runningState',
component: 'Select',
componentProps: {
// 可选从DictEnum中获取 DictEnum.SIS_DEVICE_STATUS 便于维护
options: getDictOptions('sis_device_status'),
},
},
{
label: '备注',
fieldName: 'remark',
component: 'Textarea',
},
]
return modalSchema
}
export function initQuerySchema(type: number) {
const querySchema: FormSchemaGetter = () => [
{
component: 'Input',
fieldName: 'meterName',
label: '仪表名称',
},
{
component: 'Input',
fieldName: 'meterCode',
label: '仪表编码',
},
{
component: 'Select',
disabled: true,
componentProps: {
// 可选从DictEnum中获取 DictEnum.METER_TYPE 便于维护
options: getDictOptions('meter_type'),
},
defaultValue: type.toString(),
fieldName: 'meterType',
label: '设备类型',
}
]
return querySchema
}
export function initColumns(type: number) {
// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
// export const columns: () => VxeGridProps['columns'] = () => [
const columns: VxeGridProps['columns'] = [
{ type: 'checkbox', width: 60 },
{
title: '仪表名称',
field: 'meterName',
},
{
title: '仪表编码',
field: 'meterCode',
},
{
title: '设备厂商',
field: 'factoryNo',
},
{
title: type === 1 ? '设备类型(电表)' : type === 2 ? '设备类型(水表)' : '设备类型(气表)',
field: 'meterType',
slots: {
default: ({ row }) => {
// 可选从DictEnum中获取 DictEnum.METER_TYPE 便于维护
return renderDict(row.meterType, 'meter_type')
},
},
},
{
title: type === 1 ? '计量单位(度)' : type === 2 ? '计量单位(吨)' : '计量单位(立方米)',
field: 'meterUnit',
slots: {
default: ({ row }) => {
// 可选从DictEnum中获取 DictEnum.METER_UNIT 便于维护
return renderDict(row.meterUnit, 'meter_unit')
},
},
},
{
title: '安装位置',
field: 'installLocation',
},
{
title: '初始读数',
field: 'initReading',
},
{
title: '最大量程',
field: 'maxRang',
},
{
title: '通信状态',
field: 'communicationState',
slots: {
default: ({ row }) => {
// 可选从DictEnum中获取 DictEnum.SIS_DEVICE_STATUS 便于维护
return renderDict(row.communicationState, 'sis_device_status')
},
},
},
{
title: '运行状态',
field: 'runningState',
slots: {
default: ({ row }) => {
// 可选从DictEnum中获取 DictEnum.SIS_DEVICE_STATUS 便于维护
return renderDict(row.runningState, 'sis_device_status')
},
},
},
{
title: '备注',
field: 'remark',
},
{
field: 'action',
fixed: 'right',
slots: { default: 'action' },
title: '操作',
width: 180,
},
]
return columns
}

View File

@@ -1,49 +1,61 @@
<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 } from '@vben/utils';
import { useVbenModal } from "@vben/common-ui";
import { $t } from "@vben/locales";
import { cloneDeep } from "@vben/utils";
import { useVbenForm } from '#/adapter/form';
import { meterAdd, meterInfo, meterUpdate } from '#/api/property/meter';
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
import { useVbenForm } from "#/adapter/form";
import {
meterInfoAdd,
meterInfoInfo,
meterInfoUpdate,
} from "#/api/property/meter/meterInfo";
import { defaultFormValueGetter, useBeforeCloseDiff } from "#/utils/popup";
import { modalSchema } from './data';
const props = defineProps({
meterType: {
type: Number,
required: true,
},
});
import { initMoalForm } from "./data";
const modalSchema = initMoalForm(props.meterType);
const emit = defineEmits<{ reload: [] }>();
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: {
//
formItemClass: 'col-span-2',
formItemClass: "col-span-1",
// label px
labelWidth: 80,
labelWidth: 120,
//
componentProps: {
class: 'w-full',
}
class: "w-full",
},
},
schema: modalSchema(),
showDefaultActions: false,
wrapperClass: 'grid-cols-2',
wrapperClass: "grid-cols-2",
});
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
{
initializedGetter: defaultFormValueGetter(formApi),
currentGetter: defaultFormValueGetter(formApi),
},
}
);
const [BasicModal, modalApi] = useVbenModal({
//
class: 'w-[550px]',
class: "w-[900px]",
fullscreenButton: false,
onBeforeClose,
onClosed: handleClosed,
@@ -58,7 +70,7 @@ const [BasicModal, modalApi] = useVbenModal({
isUpdate.value = !!id;
if (isUpdate.value && id) {
const record = await meterInfo(id);
const record = await meterInfoInfo(id);
await formApi.setValues(record);
}
await markInitialized();
@@ -76,9 +88,9 @@ async function handleConfirm() {
}
// getValuesreadonly
const data = cloneDeep(await formApi.getValues());
await (isUpdate.value ? meterUpdate(data) : meterAdd(data));
await (isUpdate.value ? meterInfoUpdate(data) : meterInfoAdd(data));
resetInitialized();
emit('reload');
emit("reload");
modalApi.close();
} catch (error) {
console.error(error);

View File

@@ -0,0 +1,178 @@
<script setup lang="ts">
import type { Recordable } from "@vben/types";
import { ref } from "vue";
import { Page, useVbenModal, type VbenFormProps } from "@vben/common-ui";
import { getVxePopupContainer } from "@vben/utils";
import { Modal, Popconfirm, Space } from "ant-design-vue";
import dayjs from "dayjs";
import {
useVbenVxeGrid,
vxeCheckboxChecked,
type VxeGridProps,
} from "#/adapter/vxe-table";
import {
meterInfoExport,
meterInfoList,
meterInfoRemove,
} from "#/api/property/meter/meterInfo";
import type { MeterInfoForm } from "#/api/property/meterInfo/model";
import { commonDownloadExcel } from "#/utils/file/download";
import meterInfoModal from "../components/meterInfo-modal.vue";
import { initQuerySchema, initColumns } from "../components/data";
const columns = initColumns(3);
const querySchema = initQuerySchema(3);
const formOptions: VbenFormProps = {
commonConfig: {
labelWidth: 80,
componentProps: {
allowClear: true,
},
},
schema: querySchema(),
wrapperClass: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4",
// 处理区间选择器RangePicker时间格式 将一个字段映射为两个字段 搜索/导出会用到
// 不需要直接删除
// fieldMappingTime: [
// [
// 'createTime',
// ['params[beginTime]', 'params[endTime]'],
// ['YYYY-MM-DD 00:00:00', 'YYYY-MM-DD 23:59:59'],
// ],
// ],
};
const gridOptions: VxeGridProps = {
checkboxConfig: {
// 高亮
highlight: true,
// 翻页时保留选中状态
reserve: true,
// 点击行选中
// trigger: 'row',
},
// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
// columns: columns(),
columns,
height: "auto",
keepSource: true,
pagerConfig: {},
proxyConfig: {
ajax: {
query: async ({ page }, formValues = {}) => {
return await meterInfoList({
pageNum: page.currentPage,
pageSize: page.pageSize,
...formValues,
});
},
},
},
rowConfig: {
keyField: "id",
},
// 表格全局唯一表示 保存列配置需要用到
id: "property-meterInfo-index",
};
const [BasicTable, tableApi] = useVbenVxeGrid({
formOptions,
gridOptions,
});
const [MeterInfoModal, modalApi] = useVbenModal({
connectedComponent: meterInfoModal,
});
function handleAdd() {
modalApi.setData({});
modalApi.open();
}
async function handleEdit(row: Required<MeterInfoForm>) {
modalApi.setData({ id: row.id });
modalApi.open();
}
async function handleDelete(row: Required<MeterInfoForm>) {
await meterInfoRemove(row.id);
await tableApi.query();
}
function handleMultiDelete() {
const rows = tableApi.grid.getCheckboxRecords();
const ids = rows.map((row: Required<MeterInfoForm>) => row.id);
Modal.confirm({
title: "提示",
okType: "danger",
content: `确认删除选中的${ids.length}条记录吗?`,
onOk: async () => {
await meterInfoRemove(ids);
await tableApi.query();
},
});
}
function handleDownloadExcel() {
commonDownloadExcel(
meterInfoExport,
"水电气数据",
tableApi.formApi.form.values,
{
fieldMappingTime: formOptions.fieldMappingTime,
}
);
}
</script>
<template>
<Page :auto-content-height="true">
<BasicTable table-title="水电气列表">
<template #toolbar-tools>
<Space>
<a-button v-access:code="['property:meterInfo:export']"
@click="handleDownloadExcel">
{{ $t('pages.common.export') }}
</a-button>
<a-button :disabled="!vxeCheckboxChecked(tableApi)"
danger
type="primary"
v-access:code="['property:meterInfo:remove']"
@click="handleMultiDelete">
{{ $t('pages.common.delete') }}
</a-button>
<a-button type="primary"
v-access:code="['property:meterInfo:add']"
@click="handleAdd">
{{ $t('pages.common.add') }}
</a-button>
</Space>
</template>
<template #action="{ row }">
<Space>
<ghost-button v-access:code="['property:meterInfo:edit']"
@click.stop="handleEdit(row)">
{{ $t('pages.common.edit') }}
</ghost-button>
<Popconfirm :get-popup-container="getVxePopupContainer"
placement="left"
title="确认删除?"
@confirm="handleDelete(row)">
<ghost-button danger
v-access:code="['property:meterInfo:remove']"
@click.stop="">
{{ $t('pages.common.delete') }}
</ghost-button>
</Popconfirm>
</Space>
</template>
</BasicTable>
<MeterInfoModal @reload="tableApi.query()" :meterType="3" />
</Page>
</template>

View File

@@ -16,15 +16,17 @@ import {
} from '#/adapter/vxe-table';
import {
meterExport,
meterList,
meterRemove,
} from '#/api/property/meter';
import type { MeterForm } from '#/api/property/meter/model';
meterInfoExport,
meterInfoList,
meterInfoRemove,
} from '#/api/property/meter/meterInfo';
import type { MeterInfoForm } from '#/api/property/meterInfo/model';
import { commonDownloadExcel } from '#/utils/file/download';
import meterModal from './meter-modal.vue';
import { columns, querySchema } from './data';
import meterInfoModal from "../components/meterInfo-modal.vue";
import { initQuerySchema, initColumns } from "../components/data";
const columns = initColumns(1);
const querySchema = initQuerySchema(1);
const formOptions: VbenFormProps = {
commonConfig: {
@@ -64,7 +66,7 @@ const gridOptions: VxeGridProps = {
proxyConfig: {
ajax: {
query: async ({ page }, formValues = {}) => {
return await meterList({
return await meterInfoList({
pageNum: page.currentPage,
pageSize: page.pageSize,
...formValues,
@@ -76,7 +78,7 @@ const gridOptions: VxeGridProps = {
keyField: 'id',
},
//
id: 'property-meter-index'
id: 'property-meterInfo-index'
};
const [BasicTable, tableApi] = useVbenVxeGrid({
@@ -84,8 +86,8 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
gridOptions,
});
const [MeterModal, modalApi] = useVbenModal({
connectedComponent: meterModal,
const [MeterInfoModal, modalApi] = useVbenModal({
connectedComponent: meterInfoModal,
});
function handleAdd() {
@@ -93,32 +95,32 @@ function handleAdd() {
modalApi.open();
}
async function handleEdit(row: Required<MeterForm>) {
async function handleEdit(row: Required<MeterInfoForm>) {
modalApi.setData({ id: row.id });
modalApi.open();
}
async function handleDelete(row: Required<MeterForm>) {
await meterRemove(row.id);
async function handleDelete(row: Required<MeterInfoForm>) {
await meterInfoRemove(row.id);
await tableApi.query();
}
function handleMultiDelete() {
const rows = tableApi.grid.getCheckboxRecords();
const ids = rows.map((row: Required<MeterForm>) => row.id);
const ids = rows.map((row: Required<MeterInfoForm>) => row.id);
Modal.confirm({
title: '提示',
okType: 'danger',
content: `确认删除选中的${ids.length}条记录吗?`,
onOk: async () => {
await meterRemove(ids);
await meterInfoRemove(ids);
await tableApi.query();
},
});
}
function handleDownloadExcel() {
commonDownloadExcel(meterExport, '水电气数据', tableApi.formApi.form.values, {
commonDownloadExcel(meterInfoExport, '水电气数据', tableApi.formApi.form.values, {
fieldMappingTime: formOptions.fieldMappingTime,
});
}
@@ -130,7 +132,7 @@ function handleDownloadExcel() {
<template #toolbar-tools>
<Space>
<a-button
v-access:code="['property:meter:export']"
v-access:code="['property:meterInfo:export']"
@click="handleDownloadExcel"
>
{{ $t('pages.common.export') }}
@@ -139,13 +141,13 @@ function handleDownloadExcel() {
:disabled="!vxeCheckboxChecked(tableApi)"
danger
type="primary"
v-access:code="['property:meter:remove']"
v-access:code="['property:meterInfo:remove']"
@click="handleMultiDelete">
{{ $t('pages.common.delete') }}
</a-button>
<a-button
type="primary"
v-access:code="['property:meter:add']"
v-access:code="['property:meterInfo:add']"
@click="handleAdd"
>
{{ $t('pages.common.add') }}
@@ -155,7 +157,7 @@ function handleDownloadExcel() {
<template #action="{ row }">
<Space>
<ghost-button
v-access:code="['property:meter:edit']"
v-access:code="['property:meterInfo:edit']"
@click.stop="handleEdit(row)"
>
{{ $t('pages.common.edit') }}
@@ -168,7 +170,7 @@ function handleDownloadExcel() {
>
<ghost-button
danger
v-access:code="['property:meter:remove']"
v-access:code="['property:meterInfo:remove']"
@click.stop=""
>
{{ $t('pages.common.delete') }}
@@ -177,6 +179,6 @@ function handleDownloadExcel() {
</Space>
</template>
</BasicTable>
<MeterModal @reload="tableApi.query()" />
<MeterInfoModal @reload="tableApi.query()" :meterType="1" />
</Page>
</template>

View File

@@ -0,0 +1,184 @@
<script setup lang="ts">
import type { Recordable } from '@vben/types';
import { ref } from 'vue';
import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
import { getVxePopupContainer } from '@vben/utils';
import { Modal, Popconfirm, Space } from 'ant-design-vue';
import dayjs from 'dayjs';
import {
useVbenVxeGrid,
vxeCheckboxChecked,
type VxeGridProps
} from '#/adapter/vxe-table';
import {
meterInfoExport,
meterInfoList,
meterInfoRemove,
} from '#/api/property/meter/meterInfo';
import type { MeterInfoForm } from '#/api/property/meterInfo/model';
import { commonDownloadExcel } from '#/utils/file/download';
import meterInfoModal from "../components/meterInfo-modal.vue";
import { initQuerySchema, initColumns } from "../components/data";
const columns = initColumns(2);
const querySchema = initQuerySchema(2);
const formOptions: VbenFormProps = {
commonConfig: {
labelWidth: 80,
componentProps: {
allowClear: true,
},
},
schema: querySchema(),
wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
// 处理区间选择器RangePicker时间格式 将一个字段映射为两个字段 搜索/导出会用到
// 不需要直接删除
// fieldMappingTime: [
// [
// 'createTime',
// ['params[beginTime]', 'params[endTime]'],
// ['YYYY-MM-DD 00:00:00', 'YYYY-MM-DD 23:59:59'],
// ],
// ],
};
const gridOptions: VxeGridProps = {
checkboxConfig: {
// 高亮
highlight: true,
// 翻页时保留选中状态
reserve: true,
// 点击行选中
// trigger: 'row',
},
// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
// columns: columns(),
columns,
height: 'auto',
keepSource: true,
pagerConfig: {},
proxyConfig: {
ajax: {
query: async ({ page }, formValues = {}) => {
return await meterInfoList({
pageNum: page.currentPage,
pageSize: page.pageSize,
...formValues,
});
},
},
},
rowConfig: {
keyField: 'id',
},
// 表格全局唯一表示 保存列配置需要用到
id: 'property-meterInfo-index'
};
const [BasicTable, tableApi] = useVbenVxeGrid({
formOptions,
gridOptions,
});
const [MeterInfoModal, modalApi] = useVbenModal({
connectedComponent: meterInfoModal,
});
function handleAdd() {
modalApi.setData({});
modalApi.open();
}
async function handleEdit(row: Required<MeterInfoForm>) {
modalApi.setData({ id: row.id });
modalApi.open();
}
async function handleDelete(row: Required<MeterInfoForm>) {
await meterInfoRemove(row.id);
await tableApi.query();
}
function handleMultiDelete() {
const rows = tableApi.grid.getCheckboxRecords();
const ids = rows.map((row: Required<MeterInfoForm>) => row.id);
Modal.confirm({
title: '提示',
okType: 'danger',
content: `确认删除选中的${ids.length}条记录吗?`,
onOk: async () => {
await meterInfoRemove(ids);
await tableApi.query();
},
});
}
function handleDownloadExcel() {
commonDownloadExcel(meterInfoExport, '水电气数据', tableApi.formApi.form.values, {
fieldMappingTime: formOptions.fieldMappingTime,
});
}
</script>
<template>
<Page :auto-content-height="true">
<BasicTable table-title="水电气列表">
<template #toolbar-tools>
<Space>
<a-button
v-access:code="['property:meterInfo:export']"
@click="handleDownloadExcel"
>
{{ $t('pages.common.export') }}
</a-button>
<a-button
:disabled="!vxeCheckboxChecked(tableApi)"
danger
type="primary"
v-access:code="['property:meterInfo:remove']"
@click="handleMultiDelete">
{{ $t('pages.common.delete') }}
</a-button>
<a-button
type="primary"
v-access:code="['property:meterInfo:add']"
@click="handleAdd"
>
{{ $t('pages.common.add') }}
</a-button>
</Space>
</template>
<template #action="{ row }">
<Space>
<ghost-button
v-access:code="['property:meterInfo:edit']"
@click.stop="handleEdit(row)"
>
{{ $t('pages.common.edit') }}
</ghost-button>
<Popconfirm
:get-popup-container="getVxePopupContainer"
placement="left"
title="确认删除?"
@confirm="handleDelete(row)"
>
<ghost-button
danger
v-access:code="['property:meterInfo:remove']"
@click.stop=""
>
{{ $t('pages.common.delete') }}
</ghost-button>
</Popconfirm>
</Space>
</template>
</BasicTable>
<MeterInfoModal @reload="tableApi.query()" :meterType="2" />
</Page>
</template>