diff --git a/apps/web-antd/src/api/common.d.ts b/apps/web-antd/src/api/common.d.ts
index a2b1cdfb..575a4877 100644
--- a/apps/web-antd/src/api/common.d.ts
+++ b/apps/web-antd/src/api/common.d.ts
@@ -1,3 +1,5 @@
+import type { DataNode } from 'ant-design-vue/es/tree';
+
 export type ID = number | string;
 export type IDS = (number | string)[];
 
@@ -42,15 +44,12 @@ export interface PageQuery {
   [key: string]: any;
 }
 
-export interface TreeNode<T = any> {
+export interface TreeNode<T = any> extends DataNode {
   level: number;
   code: T;
   ParentCode: T;
   label: string;
-  children: TreeNode<T>;
-
-  title?: string;
-  key?:any
-  disabled: boolean
 
+  data?: [];
+  disabled: boolean;
 }
diff --git a/apps/web-antd/src/api/property/attendanceManagement/shiftSetting/index.ts b/apps/web-antd/src/api/property/attendanceManagement/shiftSetting/index.ts
new file mode 100644
index 00000000..2ed90e67
--- /dev/null
+++ b/apps/web-antd/src/api/property/attendanceManagement/shiftSetting/index.ts
@@ -0,0 +1,61 @@
+import type { ShiftVO, ShiftForm, ShiftQuery } 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 shiftList(params?: ShiftQuery) {
+  return requestClient.get<PageResult<ShiftVO>>('/Property/shift/list', { params });
+}
+
+/**
+ * 导出班次表列表
+ * @param params
+ * @returns 班次表列表
+ */
+export function shiftExport(params?: ShiftQuery) {
+  return commonExport('/Property/shift/export', params ?? {});
+}
+
+/**
+ * 查询班次表详情
+ * @param id id
+ * @returns 班次表详情
+ */
+export function shiftInfo(id: ID) {
+  return requestClient.get<ShiftVO>(`/Property/shift/${id}`);
+}
+
+/**
+ * 新增班次表
+ * @param data
+ * @returns void
+ */
+export function shiftAdd(data: ShiftForm) {
+  return requestClient.postWithMsg<void>('/Property/shift', data);
+}
+
+/**
+ * 更新班次表
+ * @param data
+ * @returns void
+ */
+export function shiftUpdate(data: ShiftForm) {
+  return requestClient.putWithMsg<void>('/Property/shift', data);
+}
+
+/**
+ * 删除班次表
+ * @param id id
+ * @returns void
+ */
+export function shiftRemove(id: ID | IDS) {
+  return requestClient.deleteWithMsg<void>(`/Property/shift/${id}`);
+}
diff --git a/apps/web-antd/src/api/property/attendanceManagement/shiftSetting/model.d.ts b/apps/web-antd/src/api/property/attendanceManagement/shiftSetting/model.d.ts
new file mode 100644
index 00000000..76332c84
--- /dev/null
+++ b/apps/web-antd/src/api/property/attendanceManagement/shiftSetting/model.d.ts
@@ -0,0 +1,129 @@
+import type { PageQuery, BaseEntity } from '#/api/common';
+
+export interface ShiftVO {
+  /**
+   * 主键id
+   */
+  id: string | number;
+
+  /**
+   * 班次名称
+   */
+  name: string;
+
+  /**
+   * 考勤开始时间
+   */
+  startTime: string;
+
+  /**
+   * 考勤结束时间
+   */
+  endTime: string;
+
+  /**
+   * 状态（0：off，1：on）
+   */
+  status: number;
+
+  /**
+   * 是否休息（0：不休息，1：休息）
+   */
+  isRest: number;
+
+  /**
+   * 休息开始时间
+   */
+  restStartTime: string;
+
+  /**
+   * 休息结束时间
+   */
+  restEndTime: string;
+
+}
+
+export interface ShiftForm extends BaseEntity {
+  /**
+   * 主键id
+   */
+  id?: string | number;
+
+  /**
+   * 班次名称
+   */
+  name?: string;
+
+  /**
+   * 考勤开始时间
+   */
+  startTime?: string;
+
+  /**
+   * 考勤结束时间
+   */
+  endTime?: string;
+
+  /**
+   * 状态（0：off，1：on）
+   */
+  status?: number;
+
+  /**
+   * 是否休息（0：不休息，1：休息）
+   */
+  isRest?: number;
+
+  /**
+   * 休息开始时间
+   */
+  restStartTime?: string;
+
+  /**
+   * 休息结束时间
+   */
+  restEndTime?: string;
+
+}
+
+export interface ShiftQuery extends PageQuery {
+  /**
+   * 班次名称
+   */
+  name?: string;
+
+  /**
+   * 考勤开始时间
+   */
+  startTime?: string;
+
+  /**
+   * 考勤结束时间
+   */
+  endTime?: string;
+
+  /**
+   * 状态（0：off，1：on）
+   */
+  status?: number;
+
+  /**
+   * 是否休息（0：不休息，1：休息）
+   */
+  isRest?: number;
+
+  /**
+   * 休息开始时间
+   */
+  restStartTime?: string;
+
+  /**
+   * 休息结束时间
+   */
+  restEndTime?: string;
+
+  /**
+    * 日期范围参数
+    */
+  params?: any;
+}
diff --git a/apps/web-antd/src/api/property/carCharge/index.ts b/apps/web-antd/src/api/property/carCharge/index.ts
new file mode 100644
index 00000000..2eb61a11
--- /dev/null
+++ b/apps/web-antd/src/api/property/carCharge/index.ts
@@ -0,0 +1,61 @@
+import type { CarChargeVO, CarChargeForm, CarChargeQuery } 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 carChargeList(params?: CarChargeQuery) {
+  return requestClient.get<PageResult<CarChargeVO>>('/property/carCharge/list', { params });
+}
+
+/**
+ * 导出费用-车辆收费列表
+ * @param params
+ * @returns 费用-车辆收费列表
+ */
+export function carChargeExport(params?: CarChargeQuery) {
+  return commonExport('/property/carCharge/export', params ?? {});
+}
+
+/**
+ * 查询费用-车辆收费详情
+ * @param id id
+ * @returns 费用-车辆收费详情
+ */
+export function carChargeInfo(id: ID) {
+  return requestClient.get<CarChargeVO>(`/property/carCharge/${id}`);
+}
+
+/**
+ * 新增费用-车辆收费
+ * @param data
+ * @returns void
+ */
+export function carChargeAdd(data: CarChargeForm) {
+  return requestClient.postWithMsg<void>('/property/carCharge', data);
+}
+
+/**
+ * 更新费用-车辆收费
+ * @param data
+ * @returns void
+ */
+export function carChargeUpdate(data: CarChargeForm) {
+  return requestClient.putWithMsg<void>('/property/carCharge', data);
+}
+
+/**
+ * 删除费用-车辆收费
+ * @param id id
+ * @returns void
+ */
+export function carChargeRemove(id: ID | IDS) {
+  return requestClient.deleteWithMsg<void>(`/property/carCharge/${id}`);
+}
diff --git a/apps/web-antd/src/api/property/carCharge/model.d.ts b/apps/web-antd/src/api/property/carCharge/model.d.ts
new file mode 100644
index 00000000..413ef066
--- /dev/null
+++ b/apps/web-antd/src/api/property/carCharge/model.d.ts
@@ -0,0 +1,169 @@
+import type { PageQuery, BaseEntity } from '#/api/common';
+
+export interface CarChargeVO {
+  /**
+   * 主键
+   */
+  id: string | number;
+
+  /**
+   * 车牌号
+   */
+  carNumber: string;
+
+  /**
+   * 业主
+   */
+  personId: string | number;
+
+  /**
+   * 楼层
+   */
+  floorId: string | number;
+
+  /**
+   * 车位
+   */
+  location: string;
+
+  /**
+   * 状态
+   */
+  state: string;
+
+  /**
+   * 收费项目
+   */
+  costItemsId: string | number;
+
+  /**
+   * 计费开始时间
+   */
+  starTime: string;
+
+  /**
+   * 计费结束时间
+   */
+  endTime: string;
+
+  /**
+   * 说明
+   */
+  remark: string;
+
+  /**
+   * 搜索值
+   */
+  searchValue: string;
+
+}
+
+export interface CarChargeForm extends BaseEntity {
+  /**
+   * 主键
+   */
+  id?: string | number;
+
+  /**
+   * 车牌号
+   */
+  carNumber?: string;
+
+  /**
+   * 业主
+   */
+  personId?: string | number;
+
+  /**
+   * 楼层
+   */
+  floorId?: string | number;
+
+  /**
+   * 车位
+   */
+  location?: string;
+
+  /**
+   * 状态
+   */
+  state?: string;
+
+  /**
+   * 收费项目
+   */
+  costItemsId?: string | number;
+
+  /**
+   * 计费开始时间
+   */
+  starTime?: string;
+
+  /**
+   * 计费结束时间
+   */
+  endTime?: string;
+
+  /**
+   * 说明
+   */
+  remark?: string;
+
+  /**
+   * 搜索值
+   */
+  searchValue?: string;
+
+}
+
+export interface CarChargeQuery extends PageQuery {
+  /**
+   * 车牌号
+   */
+  carNumber?: string;
+
+  /**
+   * 业主
+   */
+  personId?: string | number;
+
+  /**
+   * 楼层
+   */
+  floorId?: string | number;
+
+  /**
+   * 车位
+   */
+  location?: string;
+
+  /**
+   * 状态
+   */
+  state?: string;
+
+  /**
+   * 收费项目
+   */
+  costItemsId?: string | number;
+
+  /**
+   * 计费开始时间
+   */
+  starTime?: string;
+
+  /**
+   * 计费结束时间
+   */
+  endTime?: string;
+
+  /**
+   * 搜索值
+   */
+  searchValue?: string;
+
+  /**
+    * 日期范围参数
+    */
+  params?: any;
+}
diff --git a/apps/web-antd/src/api/property/costManagement/houseCharge/index.ts b/apps/web-antd/src/api/property/costManagement/houseCharge/index.ts
new file mode 100644
index 00000000..c48acb4e
--- /dev/null
+++ b/apps/web-antd/src/api/property/costManagement/houseCharge/index.ts
@@ -0,0 +1,61 @@
+import type { HouseChargeVO, HouseChargeForm, HouseChargeQuery } 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 houseChargeList(params?: HouseChargeQuery) {
+  return requestClient.get<PageResult<HouseChargeVO>>('/property/houseCharge/list', { params });
+}
+
+/**
+ * 导出房屋收费列表
+ * @param params
+ * @returns 房屋收费列表
+ */
+export function houseChargeExport(params?: HouseChargeQuery) {
+  return commonExport('/property/houseCharge/export', params ?? {});
+}
+
+/**
+ * 查询房屋收费详情
+ * @param id id
+ * @returns 房屋收费详情
+ */
+export function houseChargeInfo(id: ID) {
+  return requestClient.get<HouseChargeVO>(`/property/houseCharge/${id}`);
+}
+
+/**
+ * 新增房屋收费
+ * @param data
+ * @returns void
+ */
+export function houseChargeAdd(data: HouseChargeForm) {
+  return requestClient.postWithMsg<void>('/property/houseCharge', data);
+}
+
+/**
+ * 更新房屋收费
+ * @param data
+ * @returns void
+ */
+export function houseChargeUpdate(data: HouseChargeForm) {
+  return requestClient.putWithMsg<void>('/property/houseCharge', data);
+}
+
+/**
+ * 删除房屋收费
+ * @param id id
+ * @returns void
+ */
+export function houseChargeRemove(id: ID | IDS) {
+  return requestClient.deleteWithMsg<void>(`/property/houseCharge/${id}`);
+}
diff --git a/apps/web-antd/src/api/property/costManagement/houseCharge/model.d.ts b/apps/web-antd/src/api/property/costManagement/houseCharge/model.d.ts
new file mode 100644
index 00000000..2188b2fb
--- /dev/null
+++ b/apps/web-antd/src/api/property/costManagement/houseCharge/model.d.ts
@@ -0,0 +1,145 @@
+import type {PageQuery, BaseEntity} from '#/api/common';
+import type {RoomVO} from "#/api/property/room/model";
+import type {CostItemSettingVO} from "#/api/property/costManagement/costItemSetting/model";
+
+export interface HouseChargeVO {
+  /**
+   * 主键
+   */
+  id: string | number;
+
+  /**
+   * 房屋
+   */
+  roomId: string | number;
+
+  /**
+   * 收费项目
+   */
+  costItemsId: string | number;
+
+  /**
+   * 应收金额
+   */
+  amountReceivable: number;
+
+  /**
+   * 计费开始时间
+   */
+  startTime: string;
+
+  /**
+   * 计费结束时间
+   */
+  endTime: string;
+
+  /**
+   * 状态
+   */
+  state: string;
+
+  /**
+   * 说明
+   */
+  remark: string;
+
+  chargeTime: any[];
+  /**
+   * 缴费周期
+   */
+  chargeCycle: number;
+  /**
+   * 支付方式
+   */
+  payType: string;
+
+  roomVo: RoomVO;
+
+  costItemsVo: CostItemSettingVO;
+
+  chargeStatus: string;
+}
+
+export interface HouseChargeForm extends BaseEntity {
+  /**
+   * 主键
+   */
+  id?: string | number;
+
+  /**
+   * 房屋
+   */
+  roomId?: string | number;
+
+  /**
+   * 收费项目
+   */
+  costItemsId?: string | number;
+
+  /**
+   * 应收金额
+   */
+  amountReceivable?: number;
+
+  /**
+   * 计费开始时间
+   */
+  startTime?: string;
+
+  /**
+   * 计费结束时间
+   */
+  endTime?: string;
+
+  /**
+   * 状态
+   */
+  state?: string;
+
+  /**
+   * 说明
+   */
+  remark?: string;
+
+  /**
+   * 缴费状态
+   */
+  chargeStatus?: string;
+}
+
+export interface HouseChargeQuery extends PageQuery {
+  /**
+   * 房屋
+   */
+  roomId?: string | number;
+
+  /**
+   * 收费项目
+   */
+  costItemsId?: string | number;
+
+  /**
+   * 应收金额
+   */
+  amountReceivable?: number;
+
+  /**
+   * 计费开始时间
+   */
+  startTime?: string;
+
+  /**
+   * 计费结束时间
+   */
+  endTime?: string;
+
+  /**
+   * 状态
+   */
+  state?: string;
+
+  /**
+   * 日期范围参数
+   */
+  params?: any;
+}
diff --git a/apps/web-antd/src/api/property/costManagement/paymentReview/index.ts b/apps/web-antd/src/api/property/costManagement/paymentReview/index.ts
new file mode 100644
index 00000000..4980e8eb
--- /dev/null
+++ b/apps/web-antd/src/api/property/costManagement/paymentReview/index.ts
@@ -0,0 +1,61 @@
+import type { PaymentReviewVO, PaymentReviewForm, PaymentReviewQuery } 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 paymentReviewList(params?: PaymentReviewQuery) {
+  return requestClient.get<PageResult<PaymentReviewVO>>('/property/payFeeAudit/list', { params });
+}
+
+/**
+ * 导出缴费审核列表
+ * @param params
+ * @returns 缴费审核列表
+ */
+export function paymentReviewExport(params?: PaymentReviewQuery) {
+  return commonExport('/property/payFeeAudit/export', params ?? {});
+}
+
+/**
+ * 查询缴费审核详情
+ * @param id id
+ * @returns 缴费审核详情
+ */
+export function paymentReviewInfo(id: ID) {
+  return requestClient.get<PaymentReviewVO>(`/property/payFeeAudit/${id}`);
+}
+
+/**
+ * 新增缴费审核
+ * @param data
+ * @returns void
+ */
+export function paymentReviewAdd(data: PaymentReviewForm) {
+  return requestClient.postWithMsg<void>('/property/payFeeAudit', data);
+}
+
+/**
+ * 更新缴费审核
+ * @param data
+ * @returns void
+ */
+export function paymentReviewUpdate(data: PaymentReviewForm) {
+  return requestClient.putWithMsg<void>('/property/payFeeAudit', data);
+}
+
+/**
+ * 删除缴费审核
+ * @param id id
+ * @returns void
+ */
+export function paymentReviewRemove(id: ID | IDS) {
+  return requestClient.deleteWithMsg<void>(`/property/payFeeAudit/${id}`);
+}
diff --git a/apps/web-antd/src/api/property/costManagement/paymentReview/model.d.ts b/apps/web-antd/src/api/property/costManagement/paymentReview/model.d.ts
new file mode 100644
index 00000000..e3bbb58f
--- /dev/null
+++ b/apps/web-antd/src/api/property/costManagement/paymentReview/model.d.ts
@@ -0,0 +1,175 @@
+import type { PageQuery, BaseEntity } from '#/api/common';
+
+export interface PaymentReviewVO {
+  /**
+   * 主键
+   */
+  id: string | number;
+
+  /**
+   * 房屋收费id
+   */
+  houseChargeId: string | number;
+
+  /**
+   * 费用项目id
+   */
+  itemId: string | number;
+
+  /**
+   * 缴费开始时间
+   */
+  startTime: string;
+
+  /**
+   * 缴费结束时间
+   */
+  endTime: string;
+
+  /**
+   * 实付金额
+   */
+  receivedAmount: string;
+
+  /**
+   * 应收金额
+   */
+  receivableAmount: number;
+
+  /**
+   * 缴费时间
+
+
+   */
+  payTime: string;
+
+  /**
+   * 审核状态
+   */
+  state: string;
+
+  /**
+   * 备注
+   */
+  remark: string;
+
+  /**
+   * 搜索值
+   */
+  searchValue: string;
+
+}
+
+export interface PaymentReviewForm extends BaseEntity {
+  /**
+   * 主键
+   */
+  id?: string | number;
+
+  /**
+   * 房屋收费id
+   */
+  houseChargeId?: string | number;
+
+  /**
+   * 费用项目id
+   */
+  itemId?: string | number;
+
+  /**
+   * 缴费开始时间
+   */
+  startTime?: string;
+
+  /**
+   * 缴费结束时间
+   */
+  endTime?: string;
+
+  /**
+   * 实付金额
+   */
+  receivedAmount?: string;
+
+  /**
+   * 应收金额
+   */
+  receivableAmount?: number;
+
+  /**
+   * 缴费时间
+
+
+   */
+  payTime?: string;
+
+  /**
+   * 审核状态
+   */
+  state?: string;
+
+  /**
+   * 备注
+   */
+  remark?: string;
+
+  /**
+   * 搜索值
+   */
+  searchValue?: string;
+
+}
+
+export interface PaymentReviewQuery extends PageQuery {
+  /**
+   * 房屋收费id
+   */
+  houseChargeId?: string | number;
+
+  /**
+   * 费用项目id
+   */
+  itemId?: string | number;
+
+  /**
+   * 缴费开始时间
+   */
+  startTime?: string;
+
+  /**
+   * 缴费结束时间
+   */
+  endTime?: string;
+
+  /**
+   * 实付金额
+   */
+  receivedAmount?: string;
+
+  /**
+   * 应收金额
+   */
+  receivableAmount?: number;
+
+  /**
+   * 缴费时间
+
+
+   */
+  payTime?: string;
+
+  /**
+   * 审核状态
+   */
+  state?: string;
+
+  /**
+   * 搜索值
+   */
+  searchValue?: string;
+
+  /**
+    * 日期范围参数
+    */
+  params?: any;
+}
diff --git a/apps/web-antd/src/api/property/costManagement/returnPayFee/index.ts b/apps/web-antd/src/api/property/costManagement/returnPayFee/index.ts
new file mode 100644
index 00000000..34a8de02
--- /dev/null
+++ b/apps/web-antd/src/api/property/costManagement/returnPayFee/index.ts
@@ -0,0 +1,61 @@
+import type { ReturnPayFeeVO, ReturnPayFeeForm, ReturnPayFeeQuery } 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 returnPayFeeList(params?: ReturnPayFeeQuery) {
+  return requestClient.get<PageResult<ReturnPayFeeVO>>('/property/returnPayFee/list', { params });
+}
+
+/**
+ * 导出退费审核列表
+ * @param params
+ * @returns 退费审核列表
+ */
+export function returnPayFeeExport(params?: ReturnPayFeeQuery) {
+  return commonExport('/property/returnPayFee/export', params ?? {});
+}
+
+/**
+ * 查询退费审核详情
+ * @param id id
+ * @returns 退费审核详情
+ */
+export function returnPayFeeInfo(id: ID) {
+  return requestClient.get<ReturnPayFeeVO>(`/property/returnPayFee/${id}`);
+}
+
+/**
+ * 新增退费审核
+ * @param data
+ * @returns void
+ */
+export function returnPayFeeAdd(data: ReturnPayFeeForm) {
+  return requestClient.postWithMsg<void>('/property/returnPayFee', data);
+}
+
+/**
+ * 更新退费审核
+ * @param data
+ * @returns void
+ */
+export function returnPayFeeUpdate(data: ReturnPayFeeForm) {
+  return requestClient.putWithMsg<void>('/property/returnPayFee', data);
+}
+
+/**
+ * 删除退费审核
+ * @param id id
+ * @returns void
+ */
+export function returnPayFeeRemove(id: ID | IDS) {
+  return requestClient.deleteWithMsg<void>(`/property/returnPayFee/${id}`);
+}
diff --git a/apps/web-antd/src/api/property/costManagement/returnPayFee/model.d.ts b/apps/web-antd/src/api/property/costManagement/returnPayFee/model.d.ts
new file mode 100644
index 00000000..b9a5d954
--- /dev/null
+++ b/apps/web-antd/src/api/property/costManagement/returnPayFee/model.d.ts
@@ -0,0 +1,154 @@
+import type { PageQuery, BaseEntity } from '#/api/common';
+
+export interface ReturnPayFeeVO {
+  /**
+   * 主键
+   */
+  id: string | number;
+
+  /**
+   * 退款单号
+   */
+  returnNo?: string;
+
+  /**
+   * 支付单号
+   */
+  payNo?: string;
+
+  /**
+   * 退款原因
+   */
+  reason?: string;
+
+  /**
+   * 费用类型id
+   */
+  itemId?: string | number;
+
+  /**
+   * 业主id
+   */
+  userId?: string | number;
+
+  /**
+   * 支付金额
+   */
+  payAcount?: number;
+
+  /**
+   * 支付时间
+   */
+  payTime?: string;
+
+  /**
+   * 退费状态
+   */
+  state: string;
+
+  /**
+   * 说明
+   */
+  remark: string;
+
+}
+
+export interface ReturnPayFeeForm extends BaseEntity {
+  /**
+   * 主键
+   */
+  id?: string | number;
+
+  /**
+   * 退款单号
+   */
+  returnNo?: string;
+
+  /**
+   * 支付单号
+   */
+  payNo?: string;
+
+  /**
+   * 退款原因
+   */
+  reason?: string;
+
+  /**
+   * 费用类型id
+   */
+  itemId?: string | number;
+
+  /**
+   * 业主id
+   */
+  userId?: string | number;
+
+  /**
+   * 支付金额
+   */
+  payAcount?: number;
+
+  /**
+   * 支付时间
+   */
+  payTime?: string;
+
+  /**
+   * 退费状态
+   */
+  state?: string;
+
+  /**
+   * 说明
+   */
+  remark?: string;
+
+}
+
+export interface ReturnPayFeeQuery extends PageQuery {
+  /**
+   * 退款单号
+   */
+  returnNo?: string;
+
+  /**
+   * 支付单号
+   */
+  payNo?: string;
+
+  /**
+   * 退款原因
+   */
+  reason?: string;
+
+  /**
+   * 费用类型id
+   */
+  itemId?: string | number;
+
+  /**
+   * 业主id
+   */
+  userId?: string | number;
+
+  /**
+   * 支付金额
+   */
+  payAcount?: number;
+
+  /**
+   * 支付时间
+   */
+  payTime?: string;
+
+  /**
+   * 退费状态
+   */
+  state?: string;
+
+  /**
+    * 日期范围参数
+    */
+  params?: any;
+}
diff --git a/apps/web-antd/src/api/property/costMeterWater/index.ts b/apps/web-antd/src/api/property/costMeterWater/index.ts
new file mode 100644
index 00000000..a258139e
--- /dev/null
+++ b/apps/web-antd/src/api/property/costMeterWater/index.ts
@@ -0,0 +1,61 @@
+import type { CostMeterWaterVO, CostMeterWaterForm, CostMeterWaterQuery } 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 costMeterWaterList(params?: CostMeterWaterQuery) {
+  return requestClient.get<PageResult<CostMeterWaterVO>>('/property/costMeterWater/list', { params });
+}
+
+/**
+ * 导出费用-水电抄列表
+ * @param params
+ * @returns 费用-水电抄列表
+ */
+export function costMeterWaterExport(params?: CostMeterWaterQuery) {
+  return commonExport('/property/costMeterWater/export', params ?? {});
+}
+
+/**
+ * 查询费用-水电抄详情
+ * @param id id
+ * @returns 费用-水电抄详情
+ */
+export function costMeterWaterInfo(id: ID) {
+  return requestClient.get<CostMeterWaterVO>(`/property/costMeterWater/${id}`);
+}
+
+/**
+ * 新增费用-水电抄
+ * @param data
+ * @returns void
+ */
+export function costMeterWaterAdd(data: CostMeterWaterForm) {
+  return requestClient.postWithMsg<void>('/property/costMeterWater', data);
+}
+
+/**
+ * 更新费用-水电抄
+ * @param data
+ * @returns void
+ */
+export function costMeterWaterUpdate(data: CostMeterWaterForm) {
+  return requestClient.putWithMsg<void>('/property/costMeterWater', data);
+}
+
+/**
+ * 删除费用-水电抄
+ * @param id id
+ * @returns void
+ */
+export function costMeterWaterRemove(id: ID | IDS) {
+  return requestClient.deleteWithMsg<void>(`/property/costMeterWater/${id}`);
+}
diff --git a/apps/web-antd/src/api/property/costMeterWater/model.d.ts b/apps/web-antd/src/api/property/costMeterWater/model.d.ts
new file mode 100644
index 00000000..c96b39b8
--- /dev/null
+++ b/apps/web-antd/src/api/property/costMeterWater/model.d.ts
@@ -0,0 +1,157 @@
+import type { PageQuery, BaseEntity } from '#/api/common';
+
+export interface CostMeterWaterVO {
+  /**
+   * 主键
+   */
+  id: string | number;
+
+  /**
+   * 费用类型id
+   */
+  itemId: string | number;
+
+  /**
+   * 抄表类型id
+   */
+  meterTypeId: string | number;
+
+  /**
+   * 对象名称
+   */
+  objName: string;
+
+  /**
+   * 本期度数
+   */
+  curDegrees: string;
+
+  /**
+   * 上期度数
+   */
+  preDegrees: string;
+
+  /**
+   * 上期读表时间
+
+   */
+  preReadingTime: string;
+
+  /**
+   * 本期读表时间
+   */
+  curReadingTime: string;
+
+  /**
+   * 备注
+   */
+  remark: string;
+
+  /**
+   * 搜索值
+   */
+  searchValue: string;
+
+}
+
+export interface CostMeterWaterForm extends BaseEntity {
+  /**
+   * 主键
+   */
+  id?: string | number;
+
+  /**
+   * 费用类型id
+   */
+  itemId?: string | number;
+
+  /**
+   * 抄表类型id
+   */
+  meterTypeId?: string | number;
+
+  /**
+   * 对象名称
+   */
+  objName?: string;
+
+  /**
+   * 本期度数
+   */
+  curDegrees?: string;
+
+  /**
+   * 上期度数
+   */
+  preDegrees?: string;
+
+  /**
+   * 上期读表时间
+
+   */
+  preReadingTime?: string;
+
+  /**
+   * 本期读表时间
+   */
+  curReadingTime?: string;
+
+  /**
+   * 备注
+   */
+  remark?: string;
+
+  /**
+   * 搜索值
+   */
+  searchValue?: string;
+
+}
+
+export interface CostMeterWaterQuery extends PageQuery {
+  /**
+   * 费用类型id
+   */
+  itemId?: string | number;
+
+  /**
+   * 抄表类型id
+   */
+  meterTypeId?: string | number;
+
+  /**
+   * 对象名称
+   */
+  objName?: string;
+
+  /**
+   * 本期度数
+   */
+  curDegrees?: string;
+
+  /**
+   * 上期度数
+   */
+  preDegrees?: string;
+
+  /**
+   * 上期读表时间
+
+   */
+  preReadingTime?: string;
+
+  /**
+   * 本期读表时间
+   */
+  curReadingTime?: string;
+
+  /**
+   * 搜索值
+   */
+  searchValue?: string;
+
+  /**
+    * 日期范围参数
+    */
+  params?: any;
+}
diff --git a/apps/web-antd/src/api/property/equipmentManagement/maintainPlan/model.d.ts b/apps/web-antd/src/api/property/equipmentManagement/maintainPlan/model.d.ts
index cfea1a69..6350b7c2 100644
--- a/apps/web-antd/src/api/property/equipmentManagement/maintainPlan/model.d.ts
+++ b/apps/web-antd/src/api/property/equipmentManagement/maintainPlan/model.d.ts
@@ -1,4 +1,4 @@
-import type { PageQuery, BaseEntity } from '#/api/common';
+import type {PageQuery, BaseEntity} from '#/api/common';
 
 export interface MaintainPlanVO {
   /**
@@ -56,6 +56,11 @@ export interface MaintainPlanVO {
    */
   state: string;
 
+  planDate: any[]
+
+  userId: string[];
+
+  machineMaintainPlanStaffBoList:any[];
 }
 
 export interface MaintainPlanForm extends BaseEntity {
@@ -168,7 +173,7 @@ export interface MaintainPlanQuery extends PageQuery {
   state?: string;
 
   /**
-    * 日期范围参数
-    */
+   * 日期范围参数
+   */
   params?: any;
 }
diff --git a/apps/web-antd/src/api/property/room/model.d.ts b/apps/web-antd/src/api/property/room/model.d.ts
index 122d596b..a01052ac 100644
--- a/apps/web-antd/src/api/property/room/model.d.ts
+++ b/apps/web-antd/src/api/property/room/model.d.ts
@@ -2,7 +2,7 @@ import type { PageQuery, BaseEntity } from '#/api/common';
 
 export interface RoomVO {
   /**
-   * 
+   *
    */
   id: string | number;
 
@@ -22,10 +22,15 @@ export interface RoomVO {
   roomType: number;
 
   /**
-   * 面积(平方米)
+   * 建筑面积(平方米)
    */
   area: number;
 
+  /**
+   * 套内面积(平方米)
+   */
+  insideInArea: number;
+
   /**
    * 户型(如2室1厅1卫)
    */
@@ -50,7 +55,7 @@ export interface RoomVO {
 
 export interface RoomForm extends BaseEntity {
   /**
-   * 
+   *
    */
   id?: string | number;
 
diff --git a/apps/web-antd/src/api/sis/deviceChannel/index.ts b/apps/web-antd/src/api/sis/deviceChannel/index.ts
new file mode 100644
index 00000000..66fe9f35
--- /dev/null
+++ b/apps/web-antd/src/api/sis/deviceChannel/index.ts
@@ -0,0 +1,74 @@
+import type {
+  DeviceChannelForm,
+  DeviceChannelQuery,
+  DeviceChannelVO,
+} from './model';
+
+import type { ID, IDS, PageResult, TreeNode } from '#/api/common';
+
+import { commonExport } from '#/api/helper';
+import { requestClient } from '#/api/request';
+
+/**
+ * 查询设备通道管理列表
+ * @param params
+ * @returns 设备通道管理列表
+ */
+export function deviceChannelList(params?: DeviceChannelQuery) {
+  return requestClient.get<PageResult<DeviceChannelVO>>(
+    '/sis/deviceChannel/list',
+    { params },
+  );
+}
+
+/**
+ * 获取通道树结构
+ */
+export function treeList() {
+  return requestClient.get<TreeNode[]>('/sis/deviceChannel/treeList');
+}
+
+/**
+ * 导出设备通道管理列表
+ * @param params
+ * @returns 设备通道管理列表
+ */
+export function deviceChannelExport(params?: DeviceChannelQuery) {
+  return commonExport('/sis/deviceChannel/export', params ?? {});
+}
+
+/**
+ * 查询设备通道管理详情
+ * @param id id
+ * @returns 设备通道管理详情
+ */
+export function deviceChannelInfo(id: ID) {
+  return requestClient.get<DeviceChannelVO>(`/sis/deviceChannel/${id}`);
+}
+
+/**
+ * 新增设备通道管理
+ * @param data
+ * @returns void
+ */
+export function deviceChannelAdd(data: DeviceChannelForm) {
+  return requestClient.postWithMsg<void>('/sis/deviceChannel', data);
+}
+
+/**
+ * 更新设备通道管理
+ * @param data
+ * @returns void
+ */
+export function deviceChannelUpdate(data: DeviceChannelForm) {
+  return requestClient.putWithMsg<void>('/sis/deviceChannel', data);
+}
+
+/**
+ * 删除设备通道管理
+ * @param id id
+ * @returns void
+ */
+export function deviceChannelRemove(id: ID | IDS) {
+  return requestClient.deleteWithMsg<void>(`/sis/deviceChannel/${id}`);
+}
diff --git a/apps/web-antd/src/api/sis/deviceChannel/model.d.ts b/apps/web-antd/src/api/sis/deviceChannel/model.d.ts
new file mode 100644
index 00000000..37055ca9
--- /dev/null
+++ b/apps/web-antd/src/api/sis/deviceChannel/model.d.ts
@@ -0,0 +1,159 @@
+import type { PageQuery, BaseEntity } from '#/api/common';
+
+export interface DeviceChannelVO {
+  /**
+   * 主键id
+   */
+  id: string | number;
+
+  /**
+   * 设备id
+   */
+  deviceId: string | number;
+
+  /**
+   * 设备名称
+   */
+  deviceName: string;
+
+  /**
+   * 通道分组组id
+   */
+  groupId: string | number;
+
+  /**
+   * 设备ip
+   */
+  deviceIp: string;
+
+  /**
+   * 设备端口
+   */
+  devicePort: number;
+
+  /**
+   * 设备账号
+   */
+  deviceAccount: string;
+
+  /**
+   * 设备密码
+   */
+  devicePwd: string;
+
+  /**
+   * 设备
+   */
+  deviceMac: string;
+
+  /**
+   * 设备通道编号
+   */
+  channelNo: string;
+
+}
+
+export interface DeviceChannelForm extends BaseEntity {
+  /**
+   * 主键id
+   */
+  id?: string | number;
+
+  /**
+   * 设备id
+   */
+  deviceId?: string | number;
+
+  /**
+   * 设备名称
+   */
+  deviceName?: string;
+
+  /**
+   * 通道分组组id
+   */
+  groupId?: string | number;
+
+  /**
+   * 设备ip
+   */
+  deviceIp?: string;
+
+  /**
+   * 设备端口
+   */
+  devicePort?: number;
+
+  /**
+   * 设备账号
+   */
+  deviceAccount?: string;
+
+  /**
+   * 设备密码
+   */
+  devicePwd?: string;
+
+  /**
+   * 设备
+   */
+  deviceMac?: string;
+
+  /**
+   * 设备通道编号
+   */
+  channelNo?: string;
+
+}
+
+export interface DeviceChannelQuery extends PageQuery {
+  /**
+   * 设备id
+   */
+  deviceId?: string | number;
+
+  /**
+   * 设备名称
+   */
+  deviceName?: string;
+
+  /**
+   * 通道分组组id
+   */
+  groupId?: string | number;
+
+  /**
+   * 设备ip
+   */
+  deviceIp?: string;
+
+  /**
+   * 设备端口
+   */
+  devicePort?: number;
+
+  /**
+   * 设备账号
+   */
+  deviceAccount?: string;
+
+  /**
+   * 设备密码
+   */
+  devicePwd?: string;
+
+  /**
+   * 设备
+   */
+  deviceMac?: string;
+
+  /**
+   * 设备通道编号
+   */
+  channelNo?: string;
+
+  /**
+    * 日期范围参数
+    */
+  params?: any;
+}
diff --git a/apps/web-antd/src/api/sis/deviceGroup/index.ts b/apps/web-antd/src/api/sis/deviceGroup/index.ts
new file mode 100644
index 00000000..bbabeadd
--- /dev/null
+++ b/apps/web-antd/src/api/sis/deviceGroup/index.ts
@@ -0,0 +1,61 @@
+import type { DeviceGroupVO, DeviceGroupForm, DeviceGroupQuery } 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 deviceGroupList(params?: DeviceGroupQuery) {
+  return requestClient.get<PageResult<DeviceGroupVO>>('/sis/deviceGroup/list', { params });
+}
+
+/**
+ * 导出设备组管理列表
+ * @param params
+ * @returns 设备组管理列表
+ */
+export function deviceGroupExport(params?: DeviceGroupQuery) {
+  return commonExport('/sis/deviceGroup/export', params ?? {});
+}
+
+/**
+ * 查询设备组管理详情
+ * @param id id
+ * @returns 设备组管理详情
+ */
+export function deviceGroupInfo(id: ID) {
+  return requestClient.get<DeviceGroupVO>(`/sis/deviceGroup/${id}`);
+}
+
+/**
+ * 新增设备组管理
+ * @param data
+ * @returns void
+ */
+export function deviceGroupAdd(data: DeviceGroupForm) {
+  return requestClient.postWithMsg<void>('/sis/deviceGroup', data);
+}
+
+/**
+ * 更新设备组管理
+ * @param data
+ * @returns void
+ */
+export function deviceGroupUpdate(data: DeviceGroupForm) {
+  return requestClient.putWithMsg<void>('/sis/deviceGroup', data);
+}
+
+/**
+ * 删除设备组管理
+ * @param id id
+ * @returns void
+ */
+export function deviceGroupRemove(id: ID | IDS) {
+  return requestClient.deleteWithMsg<void>(`/sis/deviceGroup/${id}`);
+}
diff --git a/apps/web-antd/src/api/sis/deviceGroup/model.d.ts b/apps/web-antd/src/api/sis/deviceGroup/model.d.ts
new file mode 100644
index 00000000..76dd4118
--- /dev/null
+++ b/apps/web-antd/src/api/sis/deviceGroup/model.d.ts
@@ -0,0 +1,64 @@
+import type { PageQuery, BaseEntity } from '#/api/common';
+
+export interface DeviceGroupVO {
+  /**
+   * 主键id
+   */
+  id: string | number;
+
+  /**
+   * 分组名称
+   */
+  name: string;
+
+  /**
+   * 父编码id(-1 表示根节点)
+   */
+  parentId: string | number;
+
+  /**
+   * 备注
+   */
+  remark: string;
+
+}
+
+export interface DeviceGroupForm extends BaseEntity {
+  /**
+   * 主键id
+   */
+  id?: string | number;
+
+  /**
+   * 分组名称
+   */
+  name?: string;
+
+  /**
+   * 父编码id(-1 表示根节点)
+   */
+  parentId?: string | number;
+
+  /**
+   * 备注
+   */
+  remark?: string;
+
+}
+
+export interface DeviceGroupQuery extends PageQuery {
+  /**
+   * 分组名称
+   */
+  name?: string;
+
+  /**
+   * 父编码id(-1 表示根节点)
+   */
+  parentId?: string | number;
+
+  /**
+    * 日期范围参数
+    */
+  params?: any;
+}
diff --git a/apps/web-antd/src/api/sis/deviceManage/model.d.ts b/apps/web-antd/src/api/sis/deviceManage/model.d.ts
index 46d73770..7f5e0160 100644
--- a/apps/web-antd/src/api/sis/deviceManage/model.d.ts
+++ b/apps/web-antd/src/api/sis/deviceManage/model.d.ts
@@ -1,4 +1,4 @@
-import type { PageQuery, BaseEntity } from '#/api/common';
+import type { BaseEntity, PageQuery } from '#/api/common';
 
 export interface DeviceManageVO {
   /**
@@ -80,7 +80,6 @@ export interface DeviceManageVO {
    * 门禁id
    */
   accessControlId: string | number;
-
 }
 
 export interface DeviceManageForm extends BaseEntity {
@@ -128,42 +127,6 @@ export interface DeviceManageForm extends BaseEntity {
    * 设备在线状态 0:离线 1:在线 2:未知
    */
   deviceStatus?: number;
-
-  /**
-   * 父级设备id
-   */
-  parentId?: string | number;
-
-  /**
-   * 设备通道编号
-   */
-  channelNo?: string;
-
-  /**
-   * 录像机ip
-   */
-  vcrIp?: string;
-
-  /**
-   * 录像机端口
-   */
-  vcrPort?: number;
-
-  /**
-   * 录像机账号
-   */
-  vcrAccount?: string;
-
-  /**
-   * 录像机密码
-   */
-  vcrPwd?: string;
-
-  /**
-   * 门禁id
-   */
-  accessControlId?: string | number;
-
 }
 
 export interface DeviceManageQuery extends PageQuery {
@@ -208,42 +171,7 @@ export interface DeviceManageQuery extends PageQuery {
   deviceStatus?: number;
 
   /**
-   * 父级设备id
+   * 日期范围参数
    */
-  parentId?: string | number;
-
-  /**
-   * 设备通道编号
-   */
-  channelNo?: string;
-
-  /**
-   * 录像机ip
-   */
-  vcrIp?: string;
-
-  /**
-   * 录像机端口
-   */
-  vcrPort?: number;
-
-  /**
-   * 录像机账号
-   */
-  vcrAccount?: string;
-
-  /**
-   * 录像机密码
-   */
-  vcrPwd?: string;
-
-  /**
-   * 门禁id
-   */
-  accessControlId?: string | number;
-
-  /**
-    * 日期范围参数
-    */
   params?: any;
 }
diff --git a/apps/web-antd/src/views/property/attendanceManagement/attendanceSettings/attendanceGroupSettings/index.vue b/apps/web-antd/src/views/property/attendanceManagement/attendanceGroupSettings/index.vue
similarity index 100%
rename from apps/web-antd/src/views/property/attendanceManagement/attendanceSettings/attendanceGroupSettings/index.vue
rename to apps/web-antd/src/views/property/attendanceManagement/attendanceGroupSettings/index.vue
diff --git a/apps/web-antd/src/views/property/attendanceManagement/attendanceSettings/festivalAndHoliday/index.vue b/apps/web-antd/src/views/property/attendanceManagement/attendanceSettings/festivalAndHoliday/index.vue
deleted file mode 100644
index c8764c2e..00000000
--- a/apps/web-antd/src/views/property/attendanceManagement/attendanceSettings/festivalAndHoliday/index.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<script setup lang="ts">
-
-</script>
-
-<template>
-  节假日
-</template>
-
-<style scoped lang="scss">
-
-</style>
diff --git a/apps/web-antd/src/views/property/attendanceManagement/attendanceSettings/shiftSetting/index.vue b/apps/web-antd/src/views/property/attendanceManagement/attendanceSettings/shiftSetting/index.vue
deleted file mode 100644
index cbdee30e..00000000
--- a/apps/web-antd/src/views/property/attendanceManagement/attendanceSettings/shiftSetting/index.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<script setup lang="ts">
-
-</script>
-
-<template>
-  班次设置
-</template>
-
-<style scoped lang="scss">
-
-</style>
diff --git a/apps/web-antd/src/views/property/attendanceManagement/attendanceStatistics/CheckInRecord/index.vue b/apps/web-antd/src/views/property/attendanceManagement/attendanceStatistics/CheckInRecord/index.vue
deleted file mode 100644
index 7845cc97..00000000
--- a/apps/web-antd/src/views/property/attendanceManagement/attendanceStatistics/CheckInRecord/index.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<script setup lang="ts">
-
-</script>
-
-<template>
-  打卡记录
-</template>
-
-<style scoped lang="scss">
-
-</style>
diff --git a/apps/web-antd/src/views/property/attendanceManagement/attendanceStatistics/dailyStatistics/index.vue b/apps/web-antd/src/views/property/attendanceManagement/attendanceStatistics/dailyStatistics/index.vue
deleted file mode 100644
index 178bfe9f..00000000
--- a/apps/web-antd/src/views/property/attendanceManagement/attendanceStatistics/dailyStatistics/index.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<script setup lang="ts">
-
-</script>
-
-<template>
-  每日统计
-</template>
-
-<style scoped lang="scss">
-
-</style>
diff --git a/apps/web-antd/src/views/property/attendanceManagement/holidayType/index.vue b/apps/web-antd/src/views/property/attendanceManagement/holidayType/index.vue
deleted file mode 100644
index d3035dd3..00000000
--- a/apps/web-antd/src/views/property/attendanceManagement/holidayType/index.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<script setup lang="ts">
-
-</script>
-
-<template>
-  假期类型
-</template>
-
-<style scoped lang="scss">
-
-</style>
diff --git a/apps/web-antd/src/views/property/attendanceManagement/shiftSetting/data.ts b/apps/web-antd/src/views/property/attendanceManagement/shiftSetting/data.ts
new file mode 100644
index 00000000..3f23707f
--- /dev/null
+++ b/apps/web-antd/src/views/property/attendanceManagement/shiftSetting/data.ts
@@ -0,0 +1,181 @@
+import type { FormSchemaGetter } from '#/adapter/form';
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+
+export const querySchema: FormSchemaGetter = () => [
+  {
+    component: 'Input',
+    fieldName: 'name',
+    label: '班次名称',
+  },
+  {
+    component: 'DatePicker',
+    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',
+    },
+    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',
+    field: 'id',
+  },
+  {
+    title: '班次名称',
+    field: 'name',
+  },
+  {
+    title: '考勤开始时间',
+    field: 'startTime',
+  },
+  {
+    title: '考勤结束时间',
+    field: 'endTime',
+  },
+  {
+    title: '状态',
+    field: 'status',
+  },
+  {
+    title: '是否休息',
+    field: 'isRest',
+  },
+  {
+    title: '休息开始时间',
+    field: 'restStartTime',
+  },
+  {
+    title: '休息结束时间',
+    field: 'restEndTime',
+  },
+  {
+    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: 'name',
+    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: 'endTime',
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+  },
+  {
+    label: '状态',
+    fieldName: 'status',
+    component: 'RadioGroup',
+    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',
+    },
+  },
+];
diff --git a/apps/web-antd/src/views/property/attendanceManagement/shiftSetting/index.vue b/apps/web-antd/src/views/property/attendanceManagement/shiftSetting/index.vue
new file mode 100644
index 00000000..278b8d2c
--- /dev/null
+++ b/apps/web-antd/src/views/property/attendanceManagement/shiftSetting/index.vue
@@ -0,0 +1,182 @@
+<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';
+
+import shiftModal from './shift-modal.vue';
+import { columns, querySchema } from './data';
+
+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 shiftList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  rowConfig: {
+    keyField: 'id',
+  },
+  // 表格全局唯一表示 保存列配置需要用到
+  id: 'Property-shift-index'
+};
+
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [ShiftModal, modalApi] = useVbenModal({
+  connectedComponent: shiftModal,
+});
+
+function handleAdd() {
+  modalApi.setData({});
+  modalApi.open();
+}
+
+async function handleEdit(row: Required<ShiftForm>) {
+  modalApi.setData({ id: row.id });
+  modalApi.open();
+}
+
+async function handleDelete(row: Required<ShiftForm>) {
+  await shiftRemove(row.id);
+  await tableApi.query();
+}
+
+function handleMultiDelete() {
+  const rows = tableApi.grid.getCheckboxRecords();
+  const ids = rows.map((row: Required<ShiftForm>) => row.id);
+  Modal.confirm({
+    title: '提示',
+    okType: 'danger',
+    content: `确认删除选中的${ids.length}条记录吗？`,
+    onOk: async () => {
+      await shiftRemove(ids);
+      await tableApi.query();
+    },
+  });
+}
+
+function handleDownloadExcel() {
+  commonDownloadExcel(shiftExport, '班次表数据', 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:shift:export']"
+            @click="handleDownloadExcel"
+          >
+            {{ $t('pages.common.export') }}
+          </a-button>
+          <a-button
+            :disabled="!vxeCheckboxChecked(tableApi)"
+            danger
+            type="primary"
+            v-access:code="['Property:shift:remove']"
+            @click="handleMultiDelete">
+            {{ $t('pages.common.delete') }}
+          </a-button>
+          <a-button
+            type="primary"
+            v-access:code="['Property:shift:add']"
+            @click="handleAdd"
+          >
+            {{ $t('pages.common.add') }}
+          </a-button>
+        </Space>
+      </template>
+      <template #action="{ row }">
+        <Space>
+          <ghost-button
+            v-access:code="['Property:shift: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:shift:remove']"
+              @click.stop=""
+            >
+              {{ $t('pages.common.delete') }}
+            </ghost-button>
+          </Popconfirm>
+        </Space>
+      </template>
+    </BasicTable>
+    <ShiftModal @reload="tableApi.query()" />
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/property/attendanceManagement/shiftSetting/shift-modal.vue b/apps/web-antd/src/views/property/attendanceManagement/shiftSetting/shift-modal.vue
new file mode 100644
index 00000000..8c3f0b9e
--- /dev/null
+++ b/apps/web-antd/src/views/property/attendanceManagement/shiftSetting/shift-modal.vue
@@ -0,0 +1,101 @@
+<script setup lang="ts">
+import { computed, 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 { shiftAdd, shiftInfo, shiftUpdate } from '#/api/Property/attendanceManagement/shiftSetting';
+import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
+
+import { modalSchema } from './data';
+
+const emit = defineEmits<{ reload: [] }>();
+
+const isUpdate = ref(false);
+const title = computed(() => {
+  return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
+});
+
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 80,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  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-[550px]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+
+    const { id } = modalApi.getData() as { id?: number | string };
+    isUpdate.value = !!id;
+
+    if (isUpdate.value && id) {
+      const record = await shiftInfo(id);
+      await formApi.setValues(record);
+    }
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    await (isUpdate.value ? shiftUpdate(data) : shiftAdd(data));
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+</script>
+
+<template>
+  <BasicModal :title="title">
+    <BasicForm />
+  </BasicModal>
+</template>
+
diff --git a/apps/web-antd/src/views/property/costManagement/carCharge/carCharge-add-modal.vue b/apps/web-antd/src/views/property/costManagement/carCharge/carCharge-add-modal.vue
new file mode 100644
index 00000000..e9c7ef28
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/carCharge/carCharge-add-modal.vue
@@ -0,0 +1,91 @@
+<script setup lang="ts">
+import { computed, 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 { carChargeAdd, carChargeInfo, carChargeUpdate } from '#/api/property/carCharge';
+import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
+
+import { addModalSchema } from './data';
+
+const emit = defineEmits<{ reload: [] }>();
+
+
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 140,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  schema: addModalSchema(),
+  showDefaultActions: false,
+  wrapperClass: 'grid-cols-2',
+});
+
+const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
+  {
+    initializedGetter: defaultFormValueGetter(formApi),
+    currentGetter: defaultFormValueGetter(formApi),
+  },
+);
+
+const [BasicModal, modalApi] = useVbenModal({
+  // 在这里更改宽度
+  class: 'w-[550px]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+
+    const { id } = modalApi.getData() as { id?: number | string };
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    await carChargeAdd(data);
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+</script>
+
+<template>
+  <BasicModal title="创建收费">
+    <BasicForm />
+  </BasicModal>
+</template>
+
diff --git a/apps/web-antd/src/views/property/costManagement/carCharge/carCharge-detail-modal.vue b/apps/web-antd/src/views/property/costManagement/carCharge/carCharge-detail-modal.vue
new file mode 100644
index 00000000..c806339f
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/carCharge/carCharge-detail-modal.vue
@@ -0,0 +1,101 @@
+<script setup lang="ts">
+import { computed, 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 { carChargeAdd, carChargeInfo, carChargeUpdate } from '#/api/property/carCharge';
+import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
+
+import { modalSchema } from './data';
+
+const emit = defineEmits<{ reload: [] }>();
+
+const isUpdate = ref(false);
+const title = computed(() => {
+  return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
+});
+
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 80,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  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-[550px]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+
+    const { id } = modalApi.getData() as { id?: number | string };
+    isUpdate.value = !!id;
+
+    if (isUpdate.value && id) {
+      const record = await carChargeInfo(id);
+      await formApi.setValues(record);
+    }
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    await (isUpdate.value ? carChargeUpdate(data) : carChargeAdd(data));
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+</script>
+
+<template>
+  <BasicModal :title="title">
+    <BasicForm />
+  </BasicModal>
+</template>
+
diff --git a/apps/web-antd/src/views/property/costManagement/carCharge/carCharge-pay-modal.vue b/apps/web-antd/src/views/property/costManagement/carCharge/carCharge-pay-modal.vue
new file mode 100644
index 00000000..082e6122
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/carCharge/carCharge-pay-modal.vue
@@ -0,0 +1,89 @@
+<script setup lang="ts">
+import { computed, 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 { carChargeAdd, carChargeInfo, carChargeUpdate } from '#/api/property/carCharge';
+import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
+
+import { payModalSchema } from './data';
+
+const emit = defineEmits<{ reload: [] }>();
+
+
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    formItemClass: 'col-span-1',
+    // 默认label宽度 px
+    labelWidth: 1400,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  schema: payModalSchema(),
+  showDefaultActions: false,
+  wrapperClass: 'grid-cols-2',
+});
+
+const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
+  {
+    initializedGetter: defaultFormValueGetter(formApi),
+    currentGetter: defaultFormValueGetter(formApi),
+  },
+);
+
+const [BasicModal, modalApi] = useVbenModal({
+  // 在这里更改宽度
+  class: 'w-[70%]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+
+    const { id } = modalApi.getData() as { id?: number | string };
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    await carChargeAdd(data);
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+</script>
+
+<template>
+  <BasicModal title="缴费">
+    <BasicForm />
+  </BasicModal>
+</template>
diff --git a/apps/web-antd/src/views/property/costManagement/carCharge/data.ts b/apps/web-antd/src/views/property/costManagement/carCharge/data.ts
new file mode 100644
index 00000000..b8862bfd
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/carCharge/data.ts
@@ -0,0 +1,350 @@
+import type { FormSchemaGetter } from '#/adapter/form';
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import { getDictOptions } from '#/utils/dict';
+import { renderDict } from '#/utils/render';
+
+export const querySchema: FormSchemaGetter = () => [
+  {
+    component: 'Input',
+    fieldName: 'carNumber',
+    label: '车牌号',
+  },
+  {
+    component: 'Input',
+    fieldName: 'personId',
+    label: '业主',
+  },
+  {
+    component: 'Select',
+    componentProps: {
+      // 可选从DictEnum中获取 DictEnum.WY_CSZT 便于维护
+      options: getDictOptions('wy_cszt'),
+    },
+    fieldName: 'state',
+    label: '状态',
+  },
+];
+
+// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
+// export const columns: () => VxeGridProps['columns'] = () => [
+export const columns: VxeGridProps['columns'] = [
+  { type: 'checkbox', width: 60 },
+  {
+    title: '序号',
+    field: 'id',
+    slots: {
+      default: ({ rowIndex }) => {
+        return (rowIndex + 1).toString();
+      },
+    },
+  },
+  {
+    title: '车牌号',
+    field: 'carNumber',
+  },
+  {
+    title: '车位',
+    field: 'location',
+  },
+  {
+    title: '业主',
+    field: 'personId',
+  },
+  {
+    title: '状态',
+    field: 'state',
+    slots: {
+      default: ({ row }) => {
+        // 可选从DictEnum中获取 DictEnum.WY_CSZT 便于维护
+        return renderDict(row.state, 'wy_cszt');
+      },
+    },
+  },
+  {
+    title: '收费项目',
+    field: 'costItemsId',
+  },
+  {
+    title: '计费开始时间',
+    field: 'starTime',
+  },
+  {
+    title: '计费结束时间',
+    field: 'endTime',
+  },
+  {
+    title: '说明',
+    field: 'remark',
+  },
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: { default: 'action' },
+    title: '操作',
+    width: 180,
+  },
+];
+//详情
+export const modalSchema: FormSchemaGetter = () => [
+  {
+    label: '主键',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '车牌号',
+    fieldName: 'carNumber',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '业主',
+    fieldName: 'personId',
+    component: 'Input',
+  },
+  {
+    label: '楼层',
+    fieldName: 'floorId',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '车位',
+    fieldName: 'location',
+    component: 'Input',
+  },
+  {
+    label: '状态',
+    fieldName: 'state',
+    component: 'Select',
+    componentProps: {
+      // 可选从DictEnum中获取 DictEnum.WY_CSZT 便于维护
+      options: getDictOptions('wy_cszt'),
+    },
+  },
+  {
+    label: '收费项目',
+    fieldName: 'costItemsId',
+    component: 'Input',
+  },
+  {
+    label: '计费开始时间',
+    fieldName: 'starTime',
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+  },
+  {
+    label: '计费结束时间',
+    fieldName: 'endTime',
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+  },
+  {
+    label: '说明',
+    fieldName: 'remark',
+    component: 'Input',
+  },
+  {
+    label: '搜索值',
+    fieldName: 'searchValue',
+    component: 'Input',
+  },
+];
+//创建
+export const addModalSchema: FormSchemaGetter = () => [
+  {
+    label: '主键',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '车牌号',
+    fieldName: 'carNumber',
+    component: 'Input',
+    rules: 'required',
+  },
+  // {
+  //   label: '费用类型',//一个费用下有对各费用项目
+  //   fieldName: 'personId',
+  //   component: 'Input',
+  // },
+  {
+    label: '收费项目',//一个费用收费项目对应一个费用类型
+    fieldName: 'costItemsId',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '计费开始时间',
+    fieldName: 'starTime',
+    component: 'DatePicker',
+    rules: 'required',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+  },
+  {
+    label: '计费结束时间',
+    fieldName: 'endTime',
+    component: 'DatePicker',
+    rules:'required',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+  },
+  {
+    label: '说明',
+    fieldName: 'remark',
+    component: 'Input',
+  },
+];
+//缴费
+export const payModalSchema: FormSchemaGetter = () => [
+  {
+    label: '主键',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+    {
+    label: '车牌号',
+    fieldName: 'carNumber',
+    component: 'Input',
+    rules: 'required',
+  },
+  // {
+  //   label: '费用类型',//一个费用下有对各费用项目
+  //   fieldName: 'personId',
+  //   component: 'Input',
+  // },
+  {
+    label: '收费项目',//一个费用收费项目对应一个费用类型
+    fieldName: 'costItemsId',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '计费开始时间',
+    fieldName: 'starTime',
+    component: 'DatePicker',
+    rules: 'required',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+  },
+  {
+    label: '计费结束时间',
+    fieldName: 'endTime',
+    component: 'DatePicker',
+    rules:'required',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+  },
+  {
+    label: '说明',
+    fieldName: 'remark',
+    component: 'Input',
+  },
+  {
+    label: '支付方式',
+    fieldName: 'carNumber',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '缴费周期',
+    fieldName: 'personId',
+    component: 'Input',
+  },
+  {
+    label: '实收金额',
+    fieldName: 'costItemsId',
+    component: 'Input',
+  },
+  {
+    label: '自定义周期',
+    fieldName: 'remark',
+    component: 'Input',
+  },
+];
+export const detailColumns: VxeGridProps['columns'] = [
+  {
+    title: '序号',
+    field: 'id',
+    slots: {
+      default: ({ rowIndex }) => {
+        return (rowIndex + 1).toString();
+      },
+    },
+  },
+  {
+    title: '费用项目',
+    field: 'carNumber',
+  },
+  {
+    title: '费用标识',
+    field: 'location',
+  },
+  {
+    title: '应收金额',
+    field: 'personId',
+  },
+  {
+    title: '状态',
+    field: 'state',
+    slots: {
+      default: ({ row }) => {
+        // 可选从DictEnum中获取 DictEnum.WY_CSZT 便于维护
+        return renderDict(row.state, 'wy_cszt');
+      },
+    },
+  },
+  {
+    title: '建帐时间',
+    field: 'starTime',
+  },
+  {
+    title: '应收时间',
+    field: 'endTime',
+  },
+  {
+    title: '说明',
+    field: 'remark',
+  },
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: { default: 'action' },
+    title: '操作',
+    width: 180,
+  },
+];
diff --git a/apps/web-antd/src/views/property/costManagement/carCharge/index.vue b/apps/web-antd/src/views/property/costManagement/carCharge/index.vue
new file mode 100644
index 00000000..b2f39efc
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/carCharge/index.vue
@@ -0,0 +1,173 @@
+<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 {
+  carChargeExport,
+  carChargeList,
+  carChargeRemove,
+} from '#/api/property/carCharge';
+import type { CarChargeForm } from '#/api/property/carCharge/model';
+import { commonDownloadExcel } from '#/utils/file/download';
+
+import carChargeDetailModal from './carCharge-detail-modal.vue';// 详情弹窗
+import carChargePayModal from './carCharge-pay-modal.vue';//缴费弹窗
+import carCharfeAddModal from './carCharge-add-modal.vue';//创建费用弹窗
+import { columns, querySchema } from './data';
+
+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 carChargeList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  rowConfig: {
+    keyField: 'id',
+  },
+  // 表格全局唯一表示 保存列配置需要用到
+  id: 'property-carCharge-index'
+};
+
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+// 详情弹窗
+const [CarChargeDetailModal, modalApi] = useVbenModal({
+  connectedComponent: carChargeDetailModal,
+});
+// 创建费用弹窗
+const [CarCharfeAddModal, addModalApi] = useVbenModal({
+  connectedComponent: carCharfeAddModal,
+});
+// 缴费弹窗
+const [CarChargePayModal, payModalApi] = useVbenModal({
+  connectedComponent: carChargePayModal,
+});
+//打开创建费用弹窗
+function handleAdd() {
+  addModalApi.setData({});
+  addModalApi.open();
+}
+
+//打开详情
+async function handleEdit(row: Required<CarChargeForm>) {
+  modalApi.setData({ id: row.id });
+  modalApi.open();
+}
+//打开缴费
+async function handleSave(row: Required<CarChargeForm>) {
+  payModalApi.setData({ id: row.id });
+  payModalApi.open();
+}
+
+async function handleDelete(row: Required<CarChargeForm>) {
+  await carChargeRemove(row.id);
+  await tableApi.query();
+}
+</script>
+
+<template>
+  <Page :auto-content-height="true">
+    <BasicTable table-title="费用-车辆收费列表">
+      <template #toolbar-tools>
+        <Space>
+          <a-button
+            type="primary"
+            v-access:code="['property:carCharge:add']"
+            @click="handleAdd"
+          >
+            创建费用
+          </a-button>
+        </Space>
+      </template>
+      <template #action="{ row }">
+        <Space>
+          <ghost-button
+            v-access:code="['property:carCharge:edit']"
+            @click.stop="handleSave(row)"
+          >
+            缴费
+          </ghost-button>
+          <Popconfirm
+            :get-popup-container="getVxePopupContainer"
+            placement="left"
+            title="确认删除？"
+            @confirm="handleDelete(row)"
+          >
+            <ghost-button
+              danger
+              v-access:code="['property:carCharge:remove']"
+              @click.stop=""
+            >
+              {{ $t('pages.common.delete') }}
+            </ghost-button>
+          </Popconfirm>
+            <ghost-button
+              v-access:code="['property:carCharge:edit']"
+              @click.stop="handleEdit(row)"
+            >
+              详情
+            </ghost-button>
+        </Space>
+      </template>
+    </BasicTable>
+    <!-- 详情弹窗 -->
+    <CarChargeDetailModal @reload="tableApi.query()" />
+    <CarCharfeAddModal @reload="tableApi.query()" />
+    <CarChargePayModal @reload="tableApi.query()" />
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/property/costManagement/costItemSetting/costItemSetting-detail.vue b/apps/web-antd/src/views/property/costManagement/costItemSetting/costItemSetting-detail.vue
new file mode 100644
index 00000000..e3b8ed3d
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/costItemSetting/costItemSetting-detail.vue
@@ -0,0 +1,99 @@
+<script setup lang="ts">
+import type {CostItemSettingVO} from '#/api/property/costManagement/costItemSetting/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 {costItemSettingInfo} from '#/api/property/costManagement/costItemSetting';
+import {renderDict} from "#/utils/render";
+
+dayjs.extend(duration);
+dayjs.extend(relativeTime);
+
+const [BasicModal, modalApi] = useVbenModal({
+  onOpenChange: handleOpenChange,
+  onClosed() {
+    costItemSettingDetail.value = null;
+  },
+});
+
+const costItemSettingDetail = shallowRef<null | CostItemSettingVO>(null);
+
+async function handleOpenChange(open: boolean) {
+  if (!open) {
+    return null;
+  }
+  modalApi.modalLoading(true);
+  const {id} = modalApi.getData() as { id: number | string };
+  costItemSettingDetail.value =await costItemSettingInfo(id);
+  modalApi.modalLoading(false);
+}
+</script>
+
+<template>
+  <BasicModal :footer="false" :fullscreen-button="false" title="费用项设置详情" class="w-[70%]">
+    <Descriptions v-if="costItemSettingDetail" size="small" :column="2" bordered
+                  :labelStyle="{width:'140px'}">
+      <DescriptionsItem label="费用编号">
+        {{ costItemSettingDetail.chargeNo }}
+      </DescriptionsItem>
+      <DescriptionsItem label="费用类型" v-if="costItemSettingDetail.costType!=null">
+        <component
+          :is="renderDict(costItemSettingDetail.costType,'pro_expense_type')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="收费项目">
+        {{ costItemSettingDetail.chargeItem }}
+      </DescriptionsItem>
+      <DescriptionsItem label="费用标识" v-if="costItemSettingDetail.costMark!=null">
+        <component
+          :is="renderDict(costItemSettingDetail.costMark,'pro_cost_identification')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="付费类型" v-if="costItemSettingDetail.paymentType!=null">
+        <component
+          :is="renderDict(costItemSettingDetail.paymentType,'pro_payment_type')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="费用周期（月）">
+        {{ costItemSettingDetail.chargeCycle }}
+      </DescriptionsItem>
+      <DescriptionsItem label="单位">
+        {{ costItemSettingDetail.unit }}
+      </DescriptionsItem>
+      <DescriptionsItem label="手机缴费" v-if="costItemSettingDetail.isMobilePay!=null">
+        <component
+          :is="renderDict(costItemSettingDetail.isMobilePay,'pro_mobile_payment')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="进位方式" v-if="costItemSettingDetail.roundingMode!=null">
+        <component
+          :is="renderDict(costItemSettingDetail.roundingMode,'pro_carry_method')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="保留小数" v-if="costItemSettingDetail.currencyDecimals!=null">
+        <component
+          :is="renderDict(costItemSettingDetail.currencyDecimals,'pro_keep_decimals')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="状态" v-if="costItemSettingDetail.state!=null">
+        <component
+          :is="renderDict(costItemSettingDetail.state,'wy_state')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="计算公式" v-if="costItemSettingDetail.formula!=null">
+        <component
+          :is="renderDict(costItemSettingDetail.formula,'pro_calculation_formula')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="计费单价">
+        {{ costItemSettingDetail.unitPrice }}
+      </DescriptionsItem>
+      <DescriptionsItem label="附加费用">
+        {{ costItemSettingDetail.surcharge }}
+      </DescriptionsItem>
+    </Descriptions>
+  </BasicModal>
+</template>
diff --git a/apps/web-antd/src/views/property/costManagement/costItemSetting/data.ts b/apps/web-antd/src/views/property/costManagement/costItemSetting/data.ts
index 92f9bc96..1a81f642 100644
--- a/apps/web-antd/src/views/property/costManagement/costItemSetting/data.ts
+++ b/apps/web-antd/src/views/property/costManagement/costItemSetting/data.ts
@@ -1,13 +1,12 @@
 import type { FormSchemaGetter } from '#/adapter/form';
 import type { VxeGridProps } from '#/adapter/vxe-table';
-
 import { getDictOptions } from '#/utils/dict';
 import { renderDict } from '#/utils/render';
 
 export const querySchema: FormSchemaGetter = () => [
   {
     component: 'Input',
-    fieldName: 'chargeItem',
+    fieldName: 'chargeNo',
     label: '费用编号',
   },
   {
@@ -28,20 +27,17 @@ export const querySchema: FormSchemaGetter = () => [
   },
 ];
 
-// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
-// export const columns: () => VxeGridProps['columns'] = () => [
 export const columns: VxeGridProps['columns'] = [
   { type: 'checkbox', width: 60 },
   {
     title: '费用编号',
-    field: 'chargeItem',
+    field: 'chargeNo',
   },
   {
     title: '费用类型',
     field: 'costType',
     slots: {
       default: ({ row }) => {
-        // 可选从DictEnum中获取 DictEnum.PRO_EXPENSE_TYPE 便于维护
         return renderDict(row.costType, 'pro_expense_type');
       },
     },
@@ -55,8 +51,7 @@ export const columns: VxeGridProps['columns'] = [
     field: 'costMark',
     slots: {
       default: ({ row }) => {
-        // 可选从DictEnum中获取 DictEnum.PRO_EXPENSE_TYPE 便于维护
-        return renderDict(row.costType, 'pro_cost_identification');
+        return renderDict(row.costMark, 'pro_cost_identification');
       },
     },
   },
@@ -65,8 +60,7 @@ export const columns: VxeGridProps['columns'] = [
     field: 'paymentType',
     slots: {
       default: ({ row }) => {
-        // 可选从DictEnum中获取 DictEnum.PRO_EXPENSE_TYPE 便于维护
-        return renderDict(row.costType, 'pro_payment_type');
+        return renderDict(row.paymentType, 'pro_payment_type');
       },
     },
   },
@@ -77,6 +71,11 @@ export const columns: VxeGridProps['columns'] = [
   {
     title: '计算公式',
     field: 'formula',
+    slots: {
+      default: ({ row }) => {
+        return renderDict(row.formula, 'pro_calculation_formula');
+      },
+    },
   },
   {
     title: '计费单价',
@@ -86,6 +85,12 @@ export const columns: VxeGridProps['columns'] = [
     title: '附加费用',
     field: 'surcharge',
   },
+  {
+    title: '状态',
+    field: 'state',
+    slots: {default: 'state'},
+    width: 100,
+  },
   {
     field: 'action',
     fixed: 'right',
@@ -110,7 +115,6 @@ export const modalSchema: FormSchemaGetter = () => [
     fieldName: 'costType',
     component: 'Select',
     componentProps: {
-      // 可选从DictEnum中获取 DictEnum.PRO_EXPENSE_TYPE 便于维护
       options: getDictOptions('pro_expense_type'),
     },
     rules: 'selectRequired',
@@ -126,7 +130,6 @@ export const modalSchema: FormSchemaGetter = () => [
     fieldName: 'costMark',
     component: 'Select',
     componentProps: {
-      // 可选从DictEnum中获取 DictEnum.PRO_EXPENSE_TYPE 便于维护
       options: getDictOptions('pro_cost_identification'),
     },
     rules: 'required',
@@ -144,13 +147,22 @@ export const modalSchema: FormSchemaGetter = () => [
     label: '费用周期（月）',
     fieldName: 'chargeCycle',
     component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '单位',
+    fieldName: 'unit',
+    component: 'Input',
+    rules: 'required',
+    componentProps: {
+      placeholder: '请输入（如：元）',
+    },
   },
   {
     label: '手机缴费',
     fieldName: 'isMobilePay',
     component: 'Select',
     componentProps: {
-      // 可选从DictEnum中获取 DictEnum.PRO_EXPENSE_TYPE 便于维护
       options: getDictOptions('pro_mobile_payment'),
     },
     rules: 'selectRequired',
@@ -159,7 +171,6 @@ export const modalSchema: FormSchemaGetter = () => [
     label: '进位方式',
     fieldName: 'roundingMode',
     componentProps: {
-      // 可选从DictEnum中获取 DictEnum.PRO_EXPENSE_TYPE 便于维护
       options: getDictOptions('pro_carry_method'),
     },
     component: 'Select',
@@ -170,22 +181,24 @@ export const modalSchema: FormSchemaGetter = () => [
     fieldName: 'currencyDecimals',
     component: 'Select',
     componentProps: {
-      // 可选从DictEnum中获取 DictEnum.PRO_EXPENSE_TYPE 便于维护
       options: getDictOptions('pro_keep_decimals'),
     },
     rules: 'selectRequired',
   },
   {
-    label: '启用状态',
+    component: 'Select',
+    componentProps: {
+      options: getDictOptions('wy_state'),
+    },
     fieldName: 'state',
-    component: 'Input',
+    label: '状态',
+    rules: 'selectRequired',
   },
   {
     label: '计算公式',
     fieldName: 'formula',
     component: 'Select',
     componentProps: {
-      // 可选从DictEnum中获取 DictEnum.PRO_EXPENSE_TYPE 便于维护
       options: getDictOptions('pro_calculation_formula'),
     },
     rules: 'selectRequired',
@@ -195,10 +208,12 @@ export const modalSchema: FormSchemaGetter = () => [
     label: '计费单价',
     fieldName: 'unitPrice',
     component: 'Input',
+    rules: 'required',
   },
   {
     label: '附加费',
     fieldName: 'surcharge',
     component: 'Input',
+    rules: 'required',
   },
 ];
diff --git a/apps/web-antd/src/views/property/costManagement/costItemSetting/index.vue b/apps/web-antd/src/views/property/costManagement/costItemSetting/index.vue
index 8fc762fe..1d3c3d18 100644
--- a/apps/web-antd/src/views/property/costManagement/costItemSetting/index.vue
+++ b/apps/web-antd/src/views/property/costManagement/costItemSetting/index.vue
@@ -1,23 +1,22 @@
 <script setup lang="ts">
 import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
 import { getVxePopupContainer } from '@vben/utils';
-
+import {useAccess} from "@vben/access";
 import { Modal, Popconfirm, Space } from 'ant-design-vue';
-
 import {
   useVbenVxeGrid,
   vxeCheckboxChecked,
   type VxeGridProps
 } from '#/adapter/vxe-table';
-
 import {
   costItemSettingList,
-  costItemSettingRemove,
+  costItemSettingRemove, costItemSettingUpdate,
 } from '#/api/property/costManagement/costItemSetting';
 import type { CostItemSettingForm } from '#/api/property/costManagement/costItemSetting/model';
-
 import costItemSettingModal from './costItemSetting-modal.vue';
+import costItemSettingDetal from './costItemSetting-detail.vue';
 import { columns, querySchema } from './data';
+import {TableSwitch} from "#/components/table";
 
 const formOptions: VbenFormProps = {
   commonConfig: {
@@ -77,6 +76,15 @@ function handleAdd() {
   modalApi.open();
 }
 
+const [costItemSettingDetalModal, costItemSettingDetalApi] = useVbenModal({
+  connectedComponent: costItemSettingDetal,
+});
+
+async function handleInfo(row: Required<CostItemSettingForm>) {
+  costItemSettingDetalApi.setData({ id: row.id });
+  costItemSettingDetalApi.open();
+}
+
 async function handleEdit(row: Required<CostItemSettingForm>) {
   modalApi.setData({ id: row.id });
   modalApi.open();
@@ -100,6 +108,7 @@ function handleMultiDelete() {
     },
   });
 }
+const { hasAccessByCodes } = useAccess();
 </script>
 
 <template>
@@ -124,8 +133,24 @@ function handleMultiDelete() {
           </a-button>
         </Space>
       </template>
+<!--      冒号数字类型，没冒号字符串-->
+      <template #state="{ row }">
+        <TableSwitch
+          checkedValue="1"
+          unCheckedValue="0"
+          v-model:value="row.state"
+          :api="() => costItemSettingUpdate(row)"
+          :disabled=" !hasAccessByCodes(['property:unit:edit'])"
+          @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:costItemSetting:edit']"
             @click.stop="handleEdit(row)"
@@ -150,5 +175,6 @@ function handleMultiDelete() {
       </template>
     </BasicTable>
     <CostItemSettingModal @reload="tableApi.query()" />
+    <costItemSettingDetalModal/>
   </Page>
 </template>
diff --git a/apps/web-antd/src/views/property/costManagement/costMeterWater/costMeterWater-modal.vue b/apps/web-antd/src/views/property/costManagement/costMeterWater/costMeterWater-modal.vue
new file mode 100644
index 00000000..b932f230
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/costMeterWater/costMeterWater-modal.vue
@@ -0,0 +1,101 @@
+<script setup lang="ts">
+import { computed, 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 { costMeterWaterAdd, costMeterWaterInfo, costMeterWaterUpdate } from '#/api/property/costMeterWater';
+import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
+
+import { modalSchema } from './data';
+
+const emit = defineEmits<{ reload: [] }>();
+
+const isUpdate = ref(false);
+const title = computed(() => {
+  return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
+});
+
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 80,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  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-[550px]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+
+    const { id } = modalApi.getData() as { id?: number | string };
+    isUpdate.value = !!id;
+
+    if (isUpdate.value && id) {
+      const record = await costMeterWaterInfo(id);
+      await formApi.setValues(record);
+    }
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    await (isUpdate.value ? costMeterWaterUpdate(data) : costMeterWaterAdd(data));
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+</script>
+
+<template>
+  <BasicModal :title="title">
+    <BasicForm />
+  </BasicModal>
+</template>
+
diff --git a/apps/web-antd/src/views/property/costManagement/costMeterWater/data.ts b/apps/web-antd/src/views/property/costManagement/costMeterWater/data.ts
new file mode 100644
index 00000000..7fb9f87b
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/costMeterWater/data.ts
@@ -0,0 +1,183 @@
+import type { FormSchemaGetter } from '#/adapter/form';
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+
+export const querySchema: FormSchemaGetter = () => [
+  {
+    component: 'Input',
+    fieldName: 'itemId',
+    label: '费用类型id',
+  },
+  {
+    component: 'Input',
+    fieldName: 'meterTypeId',
+    label: '抄表类型id',
+  },
+  {
+    component: 'Input',
+    fieldName: 'objName',
+    label: '对象名称',
+  },
+  {
+    component: 'Input',
+    fieldName: 'curDegrees',
+    label: '本期度数',
+  },
+  {
+    component: 'Input',
+    fieldName: 'preDegrees',
+    label: '上期度数',
+  },
+  {
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+    fieldName: 'preReadingTime',
+    label: '上期读表时间',
+  },
+  {
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+    fieldName: 'curReadingTime',
+    label: '本期读表时间',
+  },
+  {
+    component: 'Input',
+    fieldName: 'searchValue',
+    label: '搜索值',
+  },
+];
+
+// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
+// export const columns: () => VxeGridProps['columns'] = () => [
+export const columns: VxeGridProps['columns'] = [
+  { type: 'checkbox', width: 60 },
+  {
+    title: '主键',
+    field: 'id',
+  },
+  {
+    title: '费用类型id',
+    field: 'itemId',
+  },
+  {
+    title: '抄表类型id',
+    field: 'meterTypeId',
+  },
+  {
+    title: '对象名称',
+    field: 'objName',
+  },
+  {
+    title: '本期度数',
+    field: 'curDegrees',
+  },
+  {
+    title: '上期度数',
+    field: 'preDegrees',
+  },
+  {
+    title: '上期读表时间',
+    field: 'preReadingTime',
+  },
+  {
+    title: '本期读表时间',
+    field: 'curReadingTime',
+  },
+  {
+    title: '备注',
+    field: 'remark',
+  },
+  {
+    title: '搜索值',
+    field: 'searchValue',
+  },
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: { default: 'action' },
+    title: '操作',
+    width: 180,
+  },
+];
+
+export const modalSchema: FormSchemaGetter = () => [
+  {
+    label: '主键',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '费用类型id',
+    fieldName: 'itemId',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '抄表类型id',
+    fieldName: 'meterTypeId',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '对象名称',
+    fieldName: 'objName',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '本期度数',
+    fieldName: 'curDegrees',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '上期度数',
+    fieldName: 'preDegrees',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '上期读表时间',
+    fieldName: 'preReadingTime',
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+    rules: 'required',
+  },
+  {
+    label: '本期读表时间',
+    fieldName: 'curReadingTime',
+    component: 'DatePicker',
+    componentProps: {
+      showTime: true,
+      format: 'YYYY-MM-DD HH:mm:ss',
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    },
+    rules: 'required',
+  },
+  {
+    label: '备注',
+    fieldName: 'remark',
+    component: 'Textarea',
+  },
+  {
+    label: '搜索值',
+    fieldName: 'searchValue',
+    component: 'Input',
+  },
+];
diff --git a/apps/web-antd/src/views/property/costManagement/costMeterWater/index.vue b/apps/web-antd/src/views/property/costManagement/costMeterWater/index.vue
new file mode 100644
index 00000000..bc79a12a
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/costMeterWater/index.vue
@@ -0,0 +1,182 @@
+<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 {
+  costMeterWaterExport,
+  costMeterWaterList,
+  costMeterWaterRemove,
+} from '#/api/property/costMeterWater';
+import type { CostMeterWaterForm } from '#/api/property/costMeterWater/model';
+import { commonDownloadExcel } from '#/utils/file/download';
+
+import costMeterWaterModal from './costMeterWater-modal.vue';
+import { columns, querySchema } from './data';
+
+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 costMeterWaterList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  rowConfig: {
+    keyField: 'id',
+  },
+  // 表格全局唯一表示 保存列配置需要用到
+  id: 'property-costMeterWater-index'
+};
+
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [CostMeterWaterModal, modalApi] = useVbenModal({
+  connectedComponent: costMeterWaterModal,
+});
+
+function handleAdd() {
+  modalApi.setData({});
+  modalApi.open();
+}
+
+async function handleEdit(row: Required<CostMeterWaterForm>) {
+  modalApi.setData({ id: row.id });
+  modalApi.open();
+}
+
+async function handleDelete(row: Required<CostMeterWaterForm>) {
+  await costMeterWaterRemove(row.id);
+  await tableApi.query();
+}
+
+function handleMultiDelete() {
+  const rows = tableApi.grid.getCheckboxRecords();
+  const ids = rows.map((row: Required<CostMeterWaterForm>) => row.id);
+  Modal.confirm({
+    title: '提示',
+    okType: 'danger',
+    content: `确认删除选中的${ids.length}条记录吗？`,
+    onOk: async () => {
+      await costMeterWaterRemove(ids);
+      await tableApi.query();
+    },
+  });
+}
+
+function handleDownloadExcel() {
+  commonDownloadExcel(costMeterWaterExport, '费用-水电抄数据', 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:costMeterWater:export']"
+            @click="handleDownloadExcel"
+          >
+            {{ $t('pages.common.export') }}
+          </a-button>
+          <a-button
+            :disabled="!vxeCheckboxChecked(tableApi)"
+            danger
+            type="primary" 
+            v-access:code="['property:costMeterWater:remove']" 
+            @click="handleMultiDelete">
+            {{ $t('pages.common.delete') }}
+          </a-button>
+          <a-button
+            type="primary"
+            v-access:code="['property:costMeterWater:add']"
+            @click="handleAdd"
+          >
+            {{ $t('pages.common.add') }}
+          </a-button>
+        </Space>
+      </template>
+      <template #action="{ row }">
+        <Space>
+          <ghost-button
+            v-access:code="['property:costMeterWater: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:costMeterWater:remove']"
+              @click.stop=""
+            >
+              {{ $t('pages.common.delete') }}
+            </ghost-button>
+          </Popconfirm>
+        </Space>
+      </template>
+    </BasicTable>
+    <CostMeterWaterModal @reload="tableApi.query()" />
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/property/costManagement/houseCharge/data.ts b/apps/web-antd/src/views/property/costManagement/houseCharge/data.ts
new file mode 100644
index 00000000..62608784
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/houseCharge/data.ts
@@ -0,0 +1,216 @@
+import type {FormSchemaGetter} from '#/adapter/form';
+import type {VxeGridProps} from '#/adapter/vxe-table';
+import {getDictOptions} from "#/utils/dict";
+import {renderDict} from "#/utils/render";
+import {costItemSettingList} from "#/api/property/costManagement/costItemSetting";
+import { h } from 'vue';
+
+
+export const querySchema: FormSchemaGetter = () => [
+  {
+    component: 'ApiSelect',
+    componentProps: {
+      api:async ()=>{
+       return  (await costItemSettingList({pageSize: 1000, pageNum: 1}))?.rows
+      },
+      afterFetch: (data: { chargeItem: string; id: string }[]) => {
+        return data.map((item: any) => ({
+          label: item.chargeItem,
+          value: item.id,
+        }));
+      },
+    },
+    fieldName: 'costItemsId',
+    label: '收费项目',
+  },
+  {
+    component: 'Select',
+    fieldName: 'chargeStatus',
+    label: '缴费状态',
+    componentProps: {
+      options: getDictOptions('wy_fyshzt')
+    },
+  },
+];
+export const columns: VxeGridProps['columns'] = [
+  {type: 'checkbox', width: 60},
+  {
+    title: '房屋',
+    field: 'roomId',
+    minWidth: 150,
+  },
+  {
+    title: '收费项目',
+    field: 'costItemsId',
+    width: 150,
+  },
+  {
+    title: '应收金额',
+    field: 'amountReceivable',
+    width: 150,
+  },
+  {
+    title: '计费开始时间',
+    field: 'startTime',
+    width: 150,
+  },
+  {
+    title: '计费结束时间',
+    field: 'endTime',
+    width: 150,
+  },
+  {
+    title: '缴费状态',
+    field: 'chargeStatus',
+    width: 150,
+    slots: {
+      default: ({row}) => {
+        return renderDict(row.chargeStatus, 'wy_fyshzt')
+      }
+    }
+  },
+  // {
+  //   title: '状态',
+  //   field: 'state',
+  //   width: 150,
+  //   slots: {
+  //     default: ({row}) => {
+  //       return renderDict(row.state, 'wy_fysfzt')
+  //     }
+  //   }
+  // },
+  {
+    title: '说明',
+    field: 'remark',
+    width: 150,
+  },
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: {default: 'action'},
+    title: '操作',
+    width: 180,
+  },
+];
+
+export const modalSchema: FormSchemaGetter = () => [
+  {
+    label: '主键',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '房屋',
+    fieldName: 'roomId',
+    component: 'TreeSelect',
+    componentProps: {
+    },
+    rules: 'selectRequired',
+  },
+  {
+    label: '业主',
+    fieldName: 'personId',
+    component: 'ApiSelect',
+    componentProps: {
+    },
+    rules: 'selectRequired',
+  },
+  {
+    label: '费用类型',
+    fieldName: 'costType',
+    component: 'Select',
+    componentProps: {
+    },
+    rules: 'selectRequired',
+  },
+  {
+    label: '收费项目',
+    fieldName: 'costItemsId',
+    component: 'ApiSelect',
+    componentProps: {},
+    rules: 'selectRequired',
+  },
+  {
+    label: '应收金额',
+    fieldName: 'amountReceivable',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '计费时间',
+    fieldName: 'chargeTime',
+    component: 'RangePicker',
+    componentProps: {
+      format: 'YYYY-MM-DD',
+      valueFormat: 'YYYY-MM-DD',
+    },
+    rules: 'selectRequired',
+  },
+  {
+    label: '说明',
+    fieldName: 'remark',
+    component: 'Textarea',
+    formItemClass: 'col-span-2',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+];
+
+export const modalSchemaUpdate: FormSchemaGetter = () => [
+  {
+    label: '主键',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '支付方式',
+    fieldName: 'payType',
+    component: 'Select',
+    componentProps: {
+     options:getDictOptions('wy_zffs')
+    },
+    rules: 'selectRequired',
+  },
+  {
+    label: '缴费周期',
+    fieldName: 'chargeCycle',
+    component: 'InputNumber',
+    componentProps: {
+      min:1,
+      precision:0,
+      placeholder:'请输入缴费周期（月）'
+    },
+    suffix: () => h('span', { style: {fontSize: '0.875rem',fontWeight:500,} }, '月'),
+    rules: 'selectRequired',
+  },
+]
+export const modalSchemaRefund: FormSchemaGetter = () => [
+  {
+    label: '主键',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '退费原因',
+    fieldName: 'reason',
+    component: 'Textarea',
+    formItemClass: 'col-span-2'
+  },
+]
diff --git a/apps/web-antd/src/views/property/costManagement/houseCharge/house-charge-detail.vue b/apps/web-antd/src/views/property/costManagement/houseCharge/house-charge-detail.vue
new file mode 100644
index 00000000..c10c48cf
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/houseCharge/house-charge-detail.vue
@@ -0,0 +1,99 @@
+<script setup lang="ts">
+import {ref, 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 {renderDict} from "#/utils/render";
+
+dayjs.extend(duration);
+dayjs.extend(relativeTime);
+import {houseChargeInfo} from "#/api/property/costManagement/houseCharge";
+import type {HouseChargeVO} from "#/api/property/costManagement/houseCharge/model";
+import type {RoomVO} from "#/api/property/room/model";
+import type {CostItemSettingVO} from "#/api/property/costManagement/costItemSetting/model";
+
+
+const [BasicModal, modalApi] = useVbenModal({
+  onOpenChange: handleOpenChange,
+  onClosed() {
+    houseChargeDetail.value = null;
+  },
+});
+
+const houseChargeDetail = shallowRef<null | HouseChargeVO>(null);
+const room = ref<RoomVO>();
+const costItem = ref<CostItemSettingVO>();
+
+async function handleOpenChange(open: boolean) {
+  if (!open) {
+    return null;
+  }
+  modalApi.modalLoading(true);
+  const {id} = modalApi.getData() as { id: number | string };
+  houseChargeDetail.value = await houseChargeInfo(id);
+  if (houseChargeDetail.value) {
+    room.value = houseChargeDetail.value.roomVo
+    costItem.value = houseChargeDetail.value.costItemsVo
+  }
+  modalApi.modalLoading(false);
+}
+</script>
+
+<template>
+  <BasicModal :footer="false" :fullscreen-button="false" title="房屋收费详情" class="w-[70%]">
+    <Descriptions v-if="houseChargeDetail" size="small" :column="2" bordered
+                  :labelStyle="{width:'100px'}">
+      <DescriptionsItem label="费用编号">
+        {{ costItem?.id }}
+      </DescriptionsItem>
+      <DescriptionsItem label="费用项目">
+        {{ costItem?.chargeItem }}
+      </DescriptionsItem>
+      <DescriptionsItem label="费用类型">
+        <component v-if="costItem"
+                   :is="renderDict(costItem.costType,'pro_expense_type')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="计费时间">
+        {{ houseChargeDetail.startTime + ' 至 ' + houseChargeDetail.endTime }}
+      </DescriptionsItem>
+      <DescriptionsItem label="房间">
+        {{ room?.roomNumber }}
+      </DescriptionsItem>
+      <DescriptionsItem label="房间面积">
+        {{ `建筑面积：${room?.area} 套内面积：${room?.insideInArea}` }}
+      </DescriptionsItem>
+      <DescriptionsItem label="单价">
+        {{ costItem?.unitPrice }}
+      </DescriptionsItem>
+      <DescriptionsItem label="附加费">
+        {{ costItem?.surcharge }}
+      </DescriptionsItem>
+      <DescriptionsItem label="应收金额">
+        <div v-if="houseChargeDetail.amountReceivable">
+          <span style="font-size: 16px;font-weight: 600;color: red;margin-right: 10px">
+            ￥ {{ houseChargeDetail.amountReceivable }}
+          </span>
+        </div>
+      </DescriptionsItem>
+      <DescriptionsItem label="缴费状态" v-if="houseChargeDetail.chargeStatus">
+        <component
+          :is="renderDict(houseChargeDetail.chargeStatus,'wy_fyshzt')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="支付方式" v-if="houseChargeDetail.payType">
+        <component
+            :is="renderDict(houseChargeDetail.payType,'wy_zffs')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="缴费周期" v-if="houseChargeDetail.chargeCycle">
+        {{ houseChargeDetail.chargeCycle }}月
+      </DescriptionsItem>
+      <DescriptionsItem label="说明" :span="2">
+        {{ houseChargeDetail.remark }}
+      </DescriptionsItem>
+    </Descriptions>
+  </BasicModal>
+</template>
diff --git a/apps/web-antd/src/views/property/costManagement/houseCharge/house-charge-refund.vue b/apps/web-antd/src/views/property/costManagement/houseCharge/house-charge-refund.vue
new file mode 100644
index 00000000..31daf8da
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/houseCharge/house-charge-refund.vue
@@ -0,0 +1,147 @@
+<script setup lang="ts">
+import {ref} from 'vue';
+
+import {useVbenModal} from '@vben/common-ui';
+import {cloneDeep} from '@vben/utils';
+
+import {useVbenForm} from '#/adapter/form';
+import {
+  houseChargeAdd,
+  houseChargeInfo,
+  houseChargeUpdate
+} from '#/api/property/costManagement/houseCharge';
+import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
+
+import {modalSchemaRefund, modalSchemaUpdate} from './data';
+import {renderDict} from "#/utils/render";
+import {Descriptions, DescriptionsItem, Divider} from "ant-design-vue";
+import type {HouseChargeVO} from "#/api/property/costManagement/houseCharge/model";
+import type {RoomVO} from "#/api/property/room/model";
+import type {CostItemSettingVO} from "#/api/property/costManagement/costItemSetting/model";
+
+const emit = defineEmits<{ reload: [] }>();
+
+const isUpdate = ref(false);
+const record = ref<HouseChargeVO>();
+const room = ref<RoomVO>();
+const costItem = ref<CostItemSettingVO>();
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 80,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  schema: modalSchemaRefund(),
+  showDefaultActions: false,
+  wrapperClass: 'grid-cols-2',
+});
+
+const {onBeforeClose, markInitialized, resetInitialized} = useBeforeCloseDiff(
+  {
+    initializedGetter: defaultFormValueGetter(formApi),
+    currentGetter: defaultFormValueGetter(formApi),
+  },
+);
+
+const [BasicModal, modalApi] = useVbenModal({
+  // 在这里更改宽度
+  class: 'w-[550px]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+    const {id} = modalApi.getData() as { id?: number | string };
+    isUpdate.value = !!id;
+    record.value = await houseChargeInfo(id);
+    if (record.value) {
+      room.value = record.value.roomVo
+      costItem.value = record.value.costItemsVo
+    }
+    await formApi.setValues(record.value);
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const {valid} = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    record.value.reason=data.reason
+    record.value.chargeStatus = '5'
+    await houseChargeUpdate(record.value) ;
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+
+</script>
+
+<template>
+  <BasicModal title="缴费">
+    <Descriptions v-if="record" size="small" :column="2"
+                  :labelStyle="{width:'80px'}">
+      <DescriptionsItem label="费用编号">
+        {{ costItem?.id }}
+      </DescriptionsItem>
+      <DescriptionsItem label="费用项目">
+        {{ costItem?.chargeItem }}
+      </DescriptionsItem>
+      <DescriptionsItem label="费用类型">
+        <component
+            v-if="costItem"
+          :is="renderDict(costItem?.costType,'pro_expense_type')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="计费起始">
+        {{ record.startTime }}
+      </DescriptionsItem>
+      <DescriptionsItem label="房间">
+        {{ room.roomNumber }}
+      </DescriptionsItem>
+      <DescriptionsItem label="面积(㎡)">
+        {{ `${room?.area} （套内面积：${room?.insideInArea}）` }}
+      </DescriptionsItem>
+      <DescriptionsItem label="单价">
+        {{ costItem?.unitPrice }}
+      </DescriptionsItem>
+      <DescriptionsItem label="附加费">
+        {{ costItem?.surcharge }}
+      </DescriptionsItem>
+      <DescriptionsItem label="退费金额" :span="2">
+        <span style="font-size: 16px;font-weight: 600;color: red" v-if="record.amountReceivable">
+         ￥ {{ record.amountReceivable }}
+        </span>
+      </DescriptionsItem>
+    </Descriptions>
+    <Divider/>
+    <BasicForm/>
+  </BasicModal>
+</template>
+
diff --git a/apps/web-antd/src/views/property/costManagement/houseCharge/houseCharge-add.vue b/apps/web-antd/src/views/property/costManagement/houseCharge/houseCharge-add.vue
new file mode 100644
index 00000000..fd8d9861
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/houseCharge/houseCharge-add.vue
@@ -0,0 +1,226 @@
+<script setup lang="ts">
+import {computed, ref} from 'vue';
+
+import {useVbenModal} from '@vben/common-ui';
+import {$t} from '@vben/locales';
+import {cloneDeep, handleNode} from '@vben/utils';
+
+import {useVbenForm} from '#/adapter/form';
+import {
+  houseChargeAdd,
+  houseChargeInfo,
+  houseChargeUpdate
+} from '#/api/property/costManagement/houseCharge';
+import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
+
+import {modalSchema} from './data';
+import {communityTree} from "#/api/property/community";
+import {costItemSettingList} from "#/api/property/costManagement/costItemSetting";
+import type {CostItemSettingVO} from "#/api/property/costManagement/costItemSetting/model";
+import {getDictOptions} from "#/utils/dict";
+import {personList} from "#/api/property/resident/person";
+import {renderDictValue} from "#/utils/render";
+
+const emit = defineEmits<{ reload: [] }>();
+
+const isUpdate = ref(false);
+const costItemOptions = ref<CostItemSettingVO[]>([]);
+const title = computed(() => {
+  return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
+});
+
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 80,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  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-[550px]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+    await initRoomOptions()
+    await queryCostItemOptions()
+    await initCostTypeOptions()
+    await queryPersonData()
+    const {id} = modalApi.getData() as { id?: number | string };
+    isUpdate.value = !!id;
+
+    if (isUpdate.value && id) {
+      const record = await houseChargeInfo(id);
+      record.chargeTime = [record.startTime, record.endTime]
+      await formApi.setValues(record);
+    }
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const {valid} = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    if (data.chargeTime && data.chargeTime.length) {
+      data.startTime = data.chargeTime[0]
+      data.endTime = data.chargeTime[1]
+    }
+    await (isUpdate.value ? houseChargeUpdate(data) : houseChargeAdd(data));
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+
+/**
+ * 房间数据
+ */
+async function initRoomOptions() {
+  const roomList = await communityTree(5);
+  const splitStr = '/';
+  handleNode(roomList, 'label', splitStr, function (node: any) {
+    if (node.level != 5) {
+      node.disabled = true;
+    }
+  });
+  formApi.updateSchema([
+    {
+      componentProps: () => ({
+        class: 'w-full',
+        fieldNames: {
+          key: 'id',
+          label: 'label',
+          value: 'code',
+          children: 'children',
+        },
+        placeholder: '请选择房间',
+        showSearch: true,
+        treeData: roomList,
+        treeDefaultExpandAll: true,
+        treeLine: {showLeafIcon: false},
+        // 筛选的字段
+        treeNodeFilterProp: 'label',
+        // 选中后显示在输入框的值
+        treeNodeLabelProp: 'fullName',
+      }),
+      fieldName: 'roomId',
+    },
+  ]);
+}
+
+/**
+ * 查询费用项设置
+ */
+async function queryCostItemOptions(costType:string) {
+  let params = {
+    pageSize: 1000,
+    pageNum: 1,
+    costType
+  }
+  const res = await costItemSettingList(params)
+  costItemOptions.value = res.rows
+  formApi.updateSchema([{
+    componentProps: {
+      options: costItemOptions.value,
+      fieldNames: {label: 'chargeItem', value: 'id'},
+      showSearch: true,
+      optionFilterProp: 'chargeItem',
+      onChange: async (value: string) => {
+        if (value) {
+         const costItem = costItemOptions.value.find(item => item.id == value)
+          if(costItem){
+            await formApi.setFieldValue('remark', `单价：${costItem.unitPrice} 附加费：${costItem.surcharge}`);
+          }
+        }
+      }
+    },
+    fieldName: 'costItemsId'
+  }])
+}
+
+/**
+ * 初始化费用类型
+ */
+async function initCostTypeOptions(){
+  formApi.updateSchema([{
+    componentProps: {
+      options: getDictOptions('pro_expense_type'),
+      onChange: async (value: string) => {
+        if (value) {
+          await queryCostItemOptions(value)
+          await formApi.setFieldValue('costItemsId', null)
+        }
+      }
+    },
+    fieldName: 'costType'
+  }])
+}
+
+async function queryPersonData() {
+  let params = {
+    pageSize: 1000,
+    pageNum: 1,
+  }
+  const res = await personList(params);
+  const options = res.rows.map((user) => ({
+    label: user.userName + '-' + renderDictValue(user.gender, 'sys_user_sex')
+      + '-' + user.phone + '-' + user.unitName,
+    value: user.id,
+  }));
+  formApi.updateSchema([{
+    componentProps: () => ({
+      options: options,
+      showSearch: true,
+      optionFilterProp: 'label',
+      optionLabelProp: 'label',
+    }),
+    fieldName: 'personId',
+  }])
+}
+</script>
+
+<template>
+  <BasicModal :title="title">
+    <BasicForm/>
+  </BasicModal>
+</template>
+
diff --git a/apps/web-antd/src/views/property/costManagement/houseCharge/houseCharge-update.vue b/apps/web-antd/src/views/property/costManagement/houseCharge/houseCharge-update.vue
new file mode 100644
index 00000000..620cd3ef
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/houseCharge/houseCharge-update.vue
@@ -0,0 +1,148 @@
+<script setup lang="ts">
+import {ref} from 'vue';
+
+import {useVbenModal} from '@vben/common-ui';
+import {cloneDeep} from '@vben/utils';
+
+import {useVbenForm} from '#/adapter/form';
+import {
+  houseChargeAdd,
+  houseChargeInfo,
+  houseChargeUpdate
+} from '#/api/property/costManagement/houseCharge';
+import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
+
+import {modalSchemaUpdate} from './data';
+import {renderDict} from "#/utils/render";
+import {Descriptions, DescriptionsItem, Divider} from "ant-design-vue";
+import type {HouseChargeVO} from "#/api/property/costManagement/houseCharge/model";
+import type {RoomVO} from "#/api/property/room/model";
+import type {CostItemSettingVO} from "#/api/property/costManagement/costItemSetting/model";
+
+const emit = defineEmits<{ reload: [] }>();
+
+const isUpdate = ref(false);
+const record = ref<HouseChargeVO>();
+const room = ref<RoomVO>();
+const costItem = ref<CostItemSettingVO>();
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 80,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  schema: modalSchemaUpdate(),
+  showDefaultActions: false,
+  wrapperClass: 'grid-cols-2',
+});
+
+const {onBeforeClose, markInitialized, resetInitialized} = useBeforeCloseDiff(
+  {
+    initializedGetter: defaultFormValueGetter(formApi),
+    currentGetter: defaultFormValueGetter(formApi),
+  },
+);
+
+const [BasicModal, modalApi] = useVbenModal({
+  // 在这里更改宽度
+  class: 'w-[550px]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+    const {id} = modalApi.getData() as { id?: number | string };
+    isUpdate.value = !!id;
+    record.value = await houseChargeInfo(id);
+    if (record.value) {
+      room.value = record.value.roomVo
+      costItem.value = record.value.costItemsVo
+    }
+    await formApi.setValues(record.value);
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const {valid} = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    record.value.payType = data.payType
+    record.value.chargeCycle = data.chargeCycle
+    record.value.chargeStatus = '4'
+    await houseChargeUpdate(record.value);
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+
+</script>
+
+<template>
+  <BasicModal title="缴费">
+    <Descriptions v-if="record" size="small" :column="2"
+                  :labelStyle="{width:'80px'}">
+      <DescriptionsItem label="费用编号">
+        {{ costItem?.id }}
+      </DescriptionsItem>
+      <DescriptionsItem label="费用项目">
+        {{ costItem?.chargeItem }}
+      </DescriptionsItem>
+      <DescriptionsItem label="费用类型">
+        <component
+          v-if="costItem"
+          :is="renderDict(costItem?.costType,'pro_expense_type')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="计费起始">
+        {{ record.startTime }}
+      </DescriptionsItem>
+      <DescriptionsItem label="房间">
+        {{ room?.roomNumber }}
+      </DescriptionsItem>
+      <DescriptionsItem label="面积(㎡)">
+        {{ `${room?.area} （套内面积：${room?.insideInArea}）` }}
+      </DescriptionsItem>
+      <DescriptionsItem label="单价">
+        {{ costItem?.unitPrice }}
+      </DescriptionsItem>
+      <DescriptionsItem label="附加费">
+        {{ costItem?.surcharge }}
+      </DescriptionsItem>
+      <DescriptionsItem label="缴费金额" :span="2">
+        <span style="font-size: 16px;font-weight: 600;color: red" v-if="record.amountReceivable">
+         ￥ {{ record.amountReceivable }}
+        </span>
+      </DescriptionsItem>
+    </Descriptions>
+    <Divider/>
+    <BasicForm/>
+  </BasicModal>
+</template>
+
diff --git a/apps/web-antd/src/views/property/costManagement/houseCharge/index.vue b/apps/web-antd/src/views/property/costManagement/houseCharge/index.vue
new file mode 100644
index 00000000..7e449bef
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/houseCharge/index.vue
@@ -0,0 +1,211 @@
+<script setup lang="ts">
+
+import {Page, useVbenModal, type VbenFormProps} from '@vben/common-ui';
+import {getVxePopupContainer} from '@vben/utils';
+
+import {Modal, Popconfirm, Space} from 'ant-design-vue';
+
+import {
+  useVbenVxeGrid,
+  vxeCheckboxChecked,
+  type VxeGridProps
+} from '#/adapter/vxe-table';
+
+import {
+  houseChargeExport,
+  houseChargeList,
+  houseChargeRemove,
+} from '#/api/property/costManagement/houseCharge';
+import type {HouseChargeForm} from '#/api/property/costManagement/houseCharge/model';
+import {commonDownloadExcel} from '#/utils/file/download';
+
+import houseChargeAdd from './houseCharge-add.vue';
+import houseChargeUpdate from './houseCharge-update.vue';
+import houseChargeDetail from './house-charge-detail.vue';
+import houseChargeRefund from './house-charge-refund.vue';
+import {columns, querySchema} from './data';
+
+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',
+};
+
+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 houseChargeList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  rowConfig: {
+    keyField: 'id',
+  },
+  // 表格全局唯一表示 保存列配置需要用到
+  id: 'property-houseCharge-index'
+};
+
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [HouseChargeAdd, modalApi] = useVbenModal({
+  connectedComponent: houseChargeAdd,
+});
+const [HouseChargeUpdate, updateApi] = useVbenModal({
+  connectedComponent: houseChargeUpdate,
+});
+const [HouseChargeDetail, detailApi] = useVbenModal({
+  connectedComponent: houseChargeDetail,
+});
+const [HouseChargeRefund, refundApi] = useVbenModal({
+  connectedComponent: houseChargeRefund,
+});
+
+function handleAdd() {
+  modalApi.setData({});
+  modalApi.open();
+}
+
+async function handleEdit(row: Required<HouseChargeForm>) {
+  updateApi.setData({id: row.id});
+  updateApi.open();
+}
+
+async function handleInfo(row: Required<HouseChargeForm>) {
+  detailApi.setData({id: row.id});
+  detailApi.open();
+}
+
+async function handleDelete(row: Required<HouseChargeForm>) {
+  await houseChargeRemove(row.id);
+  await tableApi.query();
+}
+
+async function handleRefund(row: Required<HouseChargeForm>) {
+  refundApi.setData({id: row.id});
+  refundApi.open();
+}
+
+function handleMultiDelete() {
+  const rows = tableApi.grid.getCheckboxRecords();
+  const ids = rows.map((row: Required<HouseChargeForm>) => row.id);
+  Modal.confirm({
+    title: '提示',
+    okType: 'danger',
+    content: `确认删除选中的${ids.length}条记录吗？`,
+    onOk: async () => {
+      await houseChargeRemove(ids);
+      await tableApi.query();
+    },
+  });
+}
+
+function handleDownloadExcel() {
+  commonDownloadExcel(houseChargeExport, '房屋收费数据', 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:houseCharge:export']"
+            @click="handleDownloadExcel"
+          >
+            {{ $t('pages.common.export') }}
+          </a-button>
+          <a-button
+            :disabled="!vxeCheckboxChecked(tableApi)"
+            danger
+            type="primary"
+            v-access:code="['property:houseCharge:remove']"
+            @click="handleMultiDelete">
+            取消
+          </a-button>
+          <a-button
+            type="primary"
+            v-access:code="['property:houseCharge:add']"
+            @click="handleAdd"
+          >
+            {{ $t('pages.common.add') }}
+          </a-button>
+        </Space>
+      </template>
+      <template #action="{ row }">
+        <Space>
+          <ghost-button
+            v-access:code="['property:houseCharge:info']"
+            @click.stop="handleInfo(row)"
+          >
+            {{ $t('pages.common.info') }}
+          </ghost-button>
+          <ghost-button
+            v-if="row.chargeStatus=='2'"
+            v-access:code="['property:houseCharge:edit']"
+            @click.stop="handleEdit(row)"
+          >
+            缴费
+          </ghost-button>
+          <ghost-button
+            v-else-if="row.chargeStatus=='4'"
+            danger
+            v-access:code="['property:houseCharge:edit']"
+            @click.stop="handleRefund(row)"
+          >
+            退费
+          </ghost-button>
+          <Popconfirm
+            v-else
+            :get-popup-container="getVxePopupContainer"
+            placement="left"
+            title="确认取消？"
+            @confirm="handleDelete(row)"
+          >
+            <ghost-button
+              danger
+              v-access:code="['property:houseCharge:remove']"
+              @click.stop=""
+              :disabled="row.chargeStatus!='1'"
+            >
+              取消
+            </ghost-button>
+          </Popconfirm>
+        </Space>
+      </template>
+    </BasicTable>
+    <HouseChargeAdd @reload="tableApi.query()"/>
+    <HouseChargeUpdate @reload="tableApi.query()"/>
+    <HouseChargeRefund @reload="tableApi.query()"/>
+    <HouseChargeDetail/>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/property/costManagement/paymentReview/data.ts b/apps/web-antd/src/views/property/costManagement/paymentReview/data.ts
new file mode 100644
index 00000000..cb93ed50
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/paymentReview/data.ts
@@ -0,0 +1,109 @@
+import type { FormSchemaGetter } from '#/adapter/form';
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import { getDictOptions } from '#/utils/dict';
+import { renderDict } from '#/utils/render';
+
+export const querySchema: FormSchemaGetter = () => [
+  {
+    component: 'Input',
+    fieldName: 'roomNumber',
+    label: '房屋',
+  },
+  {
+    component: 'Select',
+    componentProps: {
+      // 可选从DictEnum中获取 DictEnum.COST_REVIEW_STATUS 便于维护
+      options: getDictOptions('pro_expense_type'),
+    },
+    fieldName: 'costType',
+    label: '费用类型',
+  },
+  {
+    component: 'Select',
+    componentProps: {
+      // 可选从DictEnum中获取 DictEnum.COST_REVIEW_STATUS 便于维护
+      options: getDictOptions('cost_review_status'),
+    },
+    fieldName: 'state',
+    label: '审核状态',
+  },
+];
+
+export const columns: VxeGridProps['columns'] = [
+  { type: 'checkbox', width: 60 },
+  {
+    title: '房屋',
+    field: 'roomNumber',
+  },
+  {
+    title: '费用项目',
+    field: 'chargeItem',
+  },
+  {
+    title: '付费周期',
+    field: 'chargeCycle',
+  },
+  {
+    title: '缴费开始时间',
+    field: 'startTime',
+  },
+  {
+    title: '缴费结束时间',
+    field: 'endTime',
+  },
+  {
+    title: '实付金额',
+    field: 'receivedAmount',
+  },
+  {
+    title: '应收金额',
+    field: 'receivableAmount',
+  },
+  {
+    title: '缴费时间',
+    field: 'payTime',
+  },
+  {
+    title: '审核状态',
+    field: 'state',
+    slots: {
+      default: ({ row }) => {
+        // 可选从DictEnum中获取 DictEnum.COST_REVIEW_STATUS 便于维护
+        return renderDict(row.state, 'cost_review_status');
+      },
+    },
+  },
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: { default: 'action' },
+    title: '操作',
+    width: 180,
+  },
+];
+
+export const modalSchema: FormSchemaGetter = () => [
+  {
+    label: '主键',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '审核状态',
+    fieldName: 'state',
+    component: 'RadioGroup',
+    componentProps: {
+      options: [
+        { label: '已审核', value: '1' },
+        { label: '已驳回', value: '2' },
+      ],
+      // options: getDictOptions('cost_review_status'),
+    },
+    rules: 'required',
+  },
+];
diff --git a/apps/web-antd/src/views/property/costManagement/paymentReview/index.vue b/apps/web-antd/src/views/property/costManagement/paymentReview/index.vue
new file mode 100644
index 00000000..91d85ef7
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/paymentReview/index.vue
@@ -0,0 +1,103 @@
+<script setup lang="ts">
+import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
+import { Space } from 'ant-design-vue';
+import {
+  useVbenVxeGrid,
+  type VxeGridProps
+} from '#/adapter/vxe-table';
+import {
+  paymentReviewList,
+} from '#/api/property/costManagement/paymentReview';
+import type { PaymentReviewForm } from '#/api/property/costManagement/paymentReview/model';
+import paymentReviewModal from './paymentReview-modal.vue';
+import paymentReviewDetail from './paymentReview-detail.vue';
+import { columns, querySchema } from './data';
+
+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',
+};
+
+const gridOptions: VxeGridProps = {
+  checkboxConfig: {
+    // 高亮
+    highlight: true,
+    // 翻页时保留选中状态
+    reserve: true,
+    // 点击行选中
+    // trigger: 'row',
+  },
+  columns,
+  height: 'auto',
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      query: async ({ page }, formValues = {}) => {
+        return await paymentReviewList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  rowConfig: {
+    keyField: 'id',
+  },
+  id: 'property-paymentReview-index'
+};
+
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [PaymentReviewModal, modalApi] = useVbenModal({
+  connectedComponent: paymentReviewModal,
+});
+
+const [paymentReviewDetailModal, paymentReviewDetailApi] = useVbenModal({
+  connectedComponent: paymentReviewDetail,
+});
+
+async function handleInfo(row: Required<PaymentReviewForm>) {
+  paymentReviewDetailApi.setData({ id: row.id });
+  paymentReviewDetailApi.open();
+}
+
+async function handleEdit(row: Required<PaymentReviewForm>) {
+  modalApi.setData({ id: row.id });
+  modalApi.open();
+}
+</script>
+
+<template>
+  <Page :auto-content-height="true">
+    <BasicTable table-title="缴费审核列表">
+      <template #action="{ row }">
+        <Space>
+          <ghost-button
+              @click.stop="handleInfo(row)"
+          >
+            {{ $t('pages.common.info') }}
+          </ghost-button>
+          <ghost-button
+              :disabled="row.state!=='0'"
+              @click.stop="handleEdit(row)"
+          >
+            {{ '审核' }}
+          </ghost-button>
+        </Space>
+      </template>
+    </BasicTable>
+    <PaymentReviewModal @reload="tableApi.query()" />
+    <paymentReviewDetailModal/>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/property/costManagement/paymentReview/paymentReview-detail.vue b/apps/web-antd/src/views/property/costManagement/paymentReview/paymentReview-detail.vue
new file mode 100644
index 00000000..875676fc
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/paymentReview/paymentReview-detail.vue
@@ -0,0 +1,70 @@
+<script setup lang="ts">
+import type {PaymentReviewVO} from '#/api/property/costManagement/paymentReview/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 {paymentReviewInfo} from '#/api/property/costManagement/paymentReview';
+import {renderDict} from "#/utils/render";
+
+dayjs.extend(duration);
+dayjs.extend(relativeTime);
+
+const [BasicModal, modalApi] = useVbenModal({
+  onOpenChange: handleOpenChange,
+  onClosed() {
+    paymentReviewDetail.value = null;
+  },
+});
+
+const paymentReviewDetail = shallowRef<null | PaymentReviewVO>(null);
+
+async function handleOpenChange(open: boolean) {
+  if (!open) {
+    return null;
+  }
+  modalApi.modalLoading(true);
+  const {id} = modalApi.getData() as { id: number | string };
+  paymentReviewDetail.value =await paymentReviewInfo(id);
+  modalApi.modalLoading(false);
+}
+</script>
+
+<template>
+  <BasicModal :footer="false" :fullscreen-button="false" title="缴费审核详情" class="w-[70%]">
+    <Descriptions v-if="paymentReviewDetail" size="small" :column="2" bordered
+                  :labelStyle="{width:'120px'}">
+      <DescriptionsItem label="房屋">
+        {{ paymentReviewDetail.roomNumber }}
+      </DescriptionsItem>
+      <DescriptionsItem label="费用项目">
+        {{ paymentReviewDetail.chargeItem }}
+      </DescriptionsItem>
+      <DescriptionsItem label="付费周期">
+        {{ paymentReviewDetail.chargeCycle }}
+      </DescriptionsItem>
+      <DescriptionsItem label="缴费开始时间">
+        {{ paymentReviewDetail.startTime }}
+      </DescriptionsItem>
+      <DescriptionsItem label="缴费结束时间">
+        {{ paymentReviewDetail.endTime }}
+      </DescriptionsItem>
+      <DescriptionsItem label="实付金额">
+        {{ paymentReviewDetail.receivedAmount }}
+      </DescriptionsItem>
+      <DescriptionsItem label="应收金额">
+        {{ paymentReviewDetail.receivableAmount }}
+      </DescriptionsItem>
+      <DescriptionsItem label="缴费时间">
+        {{ paymentReviewDetail.payTime }}
+      </DescriptionsItem>
+      <DescriptionsItem label="审核状态" v-if="paymentReviewDetail.state!=null">
+        <component
+          :is="renderDict(paymentReviewDetail.state,'cost_review_status')"
+        />
+      </DescriptionsItem>
+    </Descriptions>
+  </BasicModal>
+</template>
diff --git a/apps/web-antd/src/views/property/costManagement/paymentReview/paymentReview-modal.vue b/apps/web-antd/src/views/property/costManagement/paymentReview/paymentReview-modal.vue
new file mode 100644
index 00000000..b398b1af
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/paymentReview/paymentReview-modal.vue
@@ -0,0 +1,106 @@
+<script setup lang="ts">
+import { computed, 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 { paymentReviewAdd, paymentReviewInfo, paymentReviewUpdate } from '#/api/property/costManagement/paymentReview';
+import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
+
+import { modalSchema } from './data';
+import type {PaymentReviewVO} from "#/api/property/costManagement/paymentReview/model";
+
+const emit = defineEmits<{ reload: [] }>();
+
+const isUpdate = ref(false);
+const title = computed(() => {
+  return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
+});
+
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 80,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  schema: modalSchema(),
+  showDefaultActions: false,
+  wrapperClass: 'grid-cols-2',
+});
+
+const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
+  {
+    initializedGetter: defaultFormValueGetter(formApi),
+    currentGetter: defaultFormValueGetter(formApi),
+  },
+);
+
+const record = ref<PaymentReviewVO>({
+  state:'1'
+})
+
+const [BasicModal, modalApi] = useVbenModal({
+  // 在这里更改宽度
+  class: 'w-[550px]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+    const { id } = modalApi.getData() as { id?: number | string };
+    isUpdate.value = !!id;
+    if (isUpdate.value && id) {
+      record.value = await paymentReviewInfo(id);
+      record.value.state = '1'
+      await formApi.setValues(record.value);
+    }
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    record.value.state=data.state
+    await (isUpdate.value ? paymentReviewUpdate(record.value) : paymentReviewAdd(data));
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+</script>
+
+<template>
+  <BasicModal :title="title">
+    <BasicForm />
+  </BasicModal>
+</template>
+
diff --git a/apps/web-antd/src/views/property/costManagement/returnPayFee/data.ts b/apps/web-antd/src/views/property/costManagement/returnPayFee/data.ts
new file mode 100644
index 00000000..1a89c3e7
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/returnPayFee/data.ts
@@ -0,0 +1,103 @@
+import type { FormSchemaGetter } from '#/adapter/form';
+import type { VxeGridProps } from '#/adapter/vxe-table';
+import {getDictOptions} from "#/utils/dict";
+import {renderDict} from "#/utils/render";
+
+
+export const querySchema: FormSchemaGetter = () => [
+  {
+    component: 'Input',
+    fieldName: 'returnNo',
+    label: '退款单号',
+  },
+  {
+    component: 'Select',
+    componentProps:{
+      options:getDictOptions('wy_tfshzt')
+    },
+    fieldName: 'state',
+    label: '审核状态',
+  },
+];
+export const columns: VxeGridProps['columns'] = [
+  { type: 'checkbox', width: 60 },
+  {
+    title: '退款单号',
+    field: 'returnNo',
+    width: 180,
+  },
+  {
+    title: '支付单号',
+    field: 'payNo',
+    width: 180,
+  },
+  {
+    title: '支付金额',
+    field: 'payAcount',
+    width: 100,
+  },
+  {
+    title: '支付时间',
+    field: 'payTime',
+    width: 180,
+  },
+  {
+    title: '退款原因',
+    field: 'reason',
+    minWidth: 180,
+  },
+  {
+    title: '审核状态',
+    field: 'state',
+    width: 150,
+    slots:{
+      default:({row})=>{
+        return renderDict(row.state,'wy_tfshzt')
+      }
+    }
+  },
+  {
+    title: '审核意见',
+    field: 'remark',
+    width: 180,
+  },
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: { default: 'action' },
+    title: '操作',
+    width: 180,
+  },
+];
+
+export const stateOptions = [
+  { label: '审核通过', value: '1' },
+  { label: '审核不通过', value: '2' },
+];
+
+export const modalSchema: FormSchemaGetter = () => [
+  {
+    label: '主键',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '审核状态',
+    fieldName: 'state',
+    component: 'RadioGroup',
+    componentProps: {
+      buttonStyle: 'solid',
+      options: stateOptions,
+    },
+    rules:'required'
+  },
+  {
+    label: '审核意见',
+    fieldName: 'remark',
+    component: 'Textarea',
+  },
+];
diff --git a/apps/web-antd/src/views/property/costManagement/returnPayFee/index.vue b/apps/web-antd/src/views/property/costManagement/returnPayFee/index.vue
new file mode 100644
index 00000000..3f0f2930
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/returnPayFee/index.vue
@@ -0,0 +1,172 @@
+<script setup lang="ts">
+
+import {Page, useVbenModal, type VbenFormProps} from '@vben/common-ui';
+
+import {Modal, Popconfirm, Space} from 'ant-design-vue';
+
+import {
+  useVbenVxeGrid,
+  vxeCheckboxChecked,
+  type VxeGridProps
+} from '#/adapter/vxe-table';
+
+import {
+  returnPayFeeExport,
+  returnPayFeeList,
+  returnPayFeeRemove,
+} from '#/api/property/costManagement/returnPayFee';
+import type {ReturnPayFeeForm} from '#/api/property/costManagement/returnPayFee/model';
+import {commonDownloadExcel} from '#/utils/file/download';
+
+import returnPayFeeModal from './returnPayFee-modal.vue';
+import returnPayFeeDetail from './return-pay-detail.vue';
+import {columns, querySchema} from './data';
+
+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',
+};
+
+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 returnPayFeeList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  rowConfig: {
+    keyField: 'id',
+  },
+  // 表格全局唯一表示 保存列配置需要用到
+  id: 'property-returnPayFee-index'
+};
+
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [ReturnPayFeeModal, modalApi] = useVbenModal({
+  connectedComponent: returnPayFeeModal,
+});
+
+const [ReturnPayFeeDetail, detailApi] = useVbenModal({
+  connectedComponent: returnPayFeeDetail,
+});
+
+function handleAdd() {
+  modalApi.setData({});
+  modalApi.open();
+}
+
+async function handleEdit(row: Required<ReturnPayFeeForm>) {
+  modalApi.setData({id: row.id});
+  modalApi.open();
+}
+
+async function handleInfo(row: Required<ReturnPayFeeForm>) {
+  detailApi.setData({id: row.id});
+  detailApi.open();
+}
+
+async function handleDelete(row: Required<ReturnPayFeeForm>) {
+  await returnPayFeeRemove(row.id);
+  await tableApi.query();
+}
+
+function handleMultiDelete() {
+  const rows = tableApi.grid.getCheckboxRecords();
+  const ids = rows.map((row: Required<ReturnPayFeeForm>) => row.id);
+  Modal.confirm({
+    title: '提示',
+    okType: 'danger',
+    content: `确认删除选中的${ids.length}条记录吗？`,
+    onOk: async () => {
+      await returnPayFeeRemove(ids);
+      await tableApi.query();
+    },
+  });
+}
+
+function handleDownloadExcel() {
+  commonDownloadExcel(returnPayFeeExport, '退费审核数据', 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:returnPayFee:export']"
+            @click="handleDownloadExcel"
+          >
+            {{ $t('pages.common.export') }}
+          </a-button>
+<!--          <a-button-->
+<!--            :disabled="!vxeCheckboxChecked(tableApi)"-->
+<!--            danger-->
+<!--            type="primary"-->
+<!--            v-access:code="['property:returnPayFee:remove']"-->
+<!--            @click="handleMultiDelete">-->
+<!--            {{ $t('pages.common.delete') }}-->
+<!--          </a-button>-->
+<!--          <a-button-->
+<!--            type="primary"-->
+<!--            v-access:code="['property:returnPayFee:add']"-->
+<!--            @click="handleAdd"-->
+<!--          >-->
+<!--            {{ $t('pages.common.add') }}-->
+<!--          </a-button>-->
+        </Space>
+      </template>
+      <template #action="{ row }">
+        <Space>
+          <ghost-button
+            :disabled="row.state!='0'"
+            v-access:code="['property:returnPayFee:edit']"
+            @click.stop="handleEdit(row)"
+          >
+            审核
+          </ghost-button>
+          <ghost-button
+            v-access:code="['property:returnPayFee:info']"
+            @click.stop="handleInfo(row)"
+          >
+            {{ $t('pages.common.info') }}
+          </ghost-button>
+        </Space>
+      </template>
+    </BasicTable>
+    <ReturnPayFeeModal @reload="tableApi.query()"/>
+    <ReturnPayFeeDetail/>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/property/costManagement/returnPayFee/return-pay-detail.vue b/apps/web-antd/src/views/property/costManagement/returnPayFee/return-pay-detail.vue
new file mode 100644
index 00000000..4b9a2b91
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/returnPayFee/return-pay-detail.vue
@@ -0,0 +1,64 @@
+<script setup lang="ts">
+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 {renderDict} from "#/utils/render";
+
+dayjs.extend(duration);
+dayjs.extend(relativeTime);
+import {returnPayFeeInfo} from "#/api/property/costManagement/returnPayFee";
+import type {ReturnPayFeeVO} from "#/api/property/costManagement/returnPayFee/model";
+
+const [BasicModal, modalApi] = useVbenModal({
+  onOpenChange: handleOpenChange,
+  onClosed() {
+    returnPayDetail.value = null;
+  },
+});
+
+const returnPayDetail = shallowRef<null | ReturnPayFeeVO>(null);
+
+async function handleOpenChange(open: boolean) {
+  if (!open) {
+    return null;
+  }
+  modalApi.modalLoading(true);
+  const {id} = modalApi.getData() as { id: number | string };
+  returnPayDetail.value = await returnPayFeeInfo(id);
+  modalApi.modalLoading(false);
+}
+</script>
+
+<template>
+  <BasicModal :footer="false" :fullscreen-button="false" title="退费审核详情" class="w-[70%]">
+    <Descriptions v-if="returnPayDetail" size="small" :column="2" bordered
+                  :labelStyle="{width:'100px'}">
+      <DescriptionsItem label="退款单号">
+        {{ returnPayDetail.returnNo }}
+      </DescriptionsItem>
+      <DescriptionsItem label="支付单号">
+        {{ returnPayDetail.payNo }}
+      </DescriptionsItem>
+      <DescriptionsItem label="支付金额">
+        {{returnPayDetail.payAcount}}
+      </DescriptionsItem>
+      <DescriptionsItem label="支付时间">
+        {{ returnPayDetail.payTime }}
+      </DescriptionsItem>
+      <DescriptionsItem label="退款原因" :span="2">
+       {{returnPayDetail.reason}}
+      </DescriptionsItem>
+      <DescriptionsItem label="审核状态" :span="2">
+        <component
+          :is="renderDict(returnPayDetail.state,'wy_tfshzt')"
+        />
+      </DescriptionsItem>
+      <DescriptionsItem label="审核意见" :span="2">
+        {{returnPayDetail.remark}}
+      </DescriptionsItem>
+    </Descriptions>
+  </BasicModal>
+</template>
diff --git a/apps/web-antd/src/views/property/costManagement/returnPayFee/returnPayFee-modal.vue b/apps/web-antd/src/views/property/costManagement/returnPayFee/returnPayFee-modal.vue
new file mode 100644
index 00000000..0e706473
--- /dev/null
+++ b/apps/web-antd/src/views/property/costManagement/returnPayFee/returnPayFee-modal.vue
@@ -0,0 +1,108 @@
+<script setup lang="ts">
+import {ref} from 'vue';
+
+import {useVbenModal} from '@vben/common-ui';
+import {cloneDeep} from '@vben/utils';
+
+import {useVbenForm} from '#/adapter/form';
+import {
+  returnPayFeeInfo,
+  returnPayFeeUpdate
+} from '#/api/property/costManagement/returnPayFee';
+import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
+
+import {modalSchema} from './data';
+import type {ReturnPayFeeVO} from "#/api/property/costManagement/returnPayFee/model";
+
+const emit = defineEmits<{ reload: [] }>();
+
+const isUpdate = ref(false);
+const record = ref<ReturnPayFeeVO>({
+  id:'',
+  state:'1',
+  remark:''
+})
+
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 80,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  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-[550px]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+
+    const {id} = modalApi.getData() as { id?: number | string };
+    isUpdate.value = !!id;
+    if (isUpdate.value && id) {
+      record.value = await returnPayFeeInfo(id);
+      record.value.state = '1'
+      await formApi.setValues(record.value);
+    }
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const {valid} = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    record.value.state=data.state
+    record.value.remark=data.remark
+    await returnPayFeeUpdate(record.value);
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+</script>
+
+<template>
+  <BasicModal title="审核">
+    <BasicForm/>
+  </BasicModal>
+</template>
+
diff --git a/apps/web-antd/src/views/property/equipmentManagement/machine/data.ts b/apps/web-antd/src/views/property/equipmentManagement/machine/data.ts
index 81762779..02a7d3d1 100644
--- a/apps/web-antd/src/views/property/equipmentManagement/machine/data.ts
+++ b/apps/web-antd/src/views/property/equipmentManagement/machine/data.ts
@@ -42,16 +42,16 @@ export const columns: VxeGridProps['columns'] = [
     field: 'machineBrand',
     width:100
   },
-  {
-    title: '设备类型',
-    field: 'machineTypeId',
-    width:100
-  },
-  {
-    title: '位置详情',
-    field: 'locationId',
-    width:100
-  },
+  // {
+  //   title: '设备类型',
+  //   field: 'machineTypeId',
+  //   width:100
+  // },
+  // {
+  //   title: '位置详情',
+  //   field: 'locationId',
+  //   width:100
+  // },
   {
     title: '采购价格',
     field: 'purchasePrice',
@@ -92,11 +92,11 @@ export const columns: VxeGridProps['columns'] = [
       }
     }
   },
-  {
-    title: '责任人',
-    field: 'personId',
-    width:100
-  },
+  // {
+  //   title: '责任人',
+  //   field: 'personId',
+  //   width:100
+  // },
   {
     field: 'action',
     fixed: 'right',
diff --git a/apps/web-antd/src/views/property/equipmentManagement/machine/index.vue b/apps/web-antd/src/views/property/equipmentManagement/machine/index.vue
index 8e58bef2..896e0194 100644
--- a/apps/web-antd/src/views/property/equipmentManagement/machine/index.vue
+++ b/apps/web-antd/src/views/property/equipmentManagement/machine/index.vue
@@ -24,7 +24,7 @@ import MachineTypeTree from '../components/machine-type-tree.vue'
 import machineDetail from './machine-detail.vue'
 import {ref} from "vue";
 
-const selectTypeId = ref('')
+const selectTypeId = ref([])
 
 const formOptions: VbenFormProps = {
   commonConfig: {
@@ -36,8 +36,8 @@ const formOptions: VbenFormProps = {
   schema: querySchema(),
   wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
   handleReset: async () => {
-    selectTypeId.value = '';
-    const { formApi, reload } = tableApi;
+    selectTypeId.value = [];
+    const {formApi, reload} = tableApi;
     await formApi.resetForm();
     const formValues = formApi.form.values;
     formApi.setLatestSubmissionValues(formValues);
@@ -61,7 +61,11 @@ const gridOptions: VxeGridProps = {
   proxyConfig: {
     ajax: {
       query: async ({page}, formValues = {}) => {
-        formValues.machineTypeId = selectTypeId.value
+        if (selectTypeId.value && selectTypeId.value.length) {
+          formValues.machineTypeId = selectTypeId.value[0]
+        }else {
+          formValues.machineTypeId =[]
+        }
         return await machineList({
           pageNum: page.currentPage,
           pageSize: page.pageSize,
@@ -135,32 +139,32 @@ function handleDownloadExcel() {
   <Page :auto-content-height="true">
     <div class="flex h-full gap-[8px]">
       <MachineTypeTree
-          v-model:select-dept-id="selectTypeId"
-          class="w-[260px]"
-          @reload="() => tableApi.reload()"
-          @select="() => tableApi.reload()"
+        v-model:select-dept-id="selectTypeId"
+        class="w-[260px]"
+        @reload="() => tableApi.reload()"
+        @select="() => tableApi.reload()"
       />
       <BasicTable class="flex-1 overflow-hidden" table-title="设备列表列表">
         <template #toolbar-tools>
           <Space>
             <a-button
-                v-access:code="['property:machine:export']"
-                @click="handleDownloadExcel"
+              v-access:code="['property:machine:export']"
+              @click="handleDownloadExcel"
             >
               {{ $t('pages.common.export') }}
             </a-button>
             <a-button
-                :disabled="!vxeCheckboxChecked(tableApi)"
-                danger
-                type="primary"
-                v-access:code="['property:machine:remove']"
-                @click="handleMultiDelete">
+              :disabled="!vxeCheckboxChecked(tableApi)"
+              danger
+              type="primary"
+              v-access:code="['property:machine:remove']"
+              @click="handleMultiDelete">
               {{ $t('pages.common.delete') }}
             </a-button>
             <a-button
-                type="primary"
-                v-access:code="['property:machine:add']"
-                @click="handleAdd"
+              type="primary"
+              v-access:code="['property:machine:add']"
+              @click="handleAdd"
             >
               {{ $t('pages.common.add') }}
             </a-button>
@@ -169,27 +173,27 @@ function handleDownloadExcel() {
         <template #action="{ row }">
           <Space>
             <ghost-button
-                v-access:code="['property:machine:info']"
-                @click.stop="handleInfo(row)"
+              v-access:code="['property:machine:info']"
+              @click.stop="handleInfo(row)"
             >
               {{ $t('pages.common.info') }}
             </ghost-button>
             <ghost-button
-                v-access:code="['property:machine:edit']"
-                @click.stop="handleEdit(row)"
+              v-access:code="['property:machine:edit']"
+              @click.stop="handleEdit(row)"
             >
               {{ $t('pages.common.edit') }}
             </ghost-button>
             <Popconfirm
-                :get-popup-container="getVxePopupContainer"
-                placement="left"
-                title="确认删除？"
-                @confirm="handleDelete(row)"
+              :get-popup-container="getVxePopupContainer"
+              placement="left"
+              title="确认删除？"
+              @confirm="handleDelete(row)"
             >
               <ghost-button
-                  danger
-                  v-access:code="['property:machine:remove']"
-                  @click.stop=""
+                danger
+                v-access:code="['property:machine:remove']"
+                @click.stop=""
               >
                 {{ $t('pages.common.delete') }}
               </ghost-button>
diff --git a/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/data.ts b/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/data.ts
index fc09cfd8..a599cef5 100644
--- a/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/data.ts
+++ b/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/data.ts
@@ -2,6 +2,7 @@ import type {FormSchemaGetter} from '#/adapter/form';
 import type {VxeGridProps} from '#/adapter/vxe-table';
 import {getDictOptions} from "#/utils/dict";
 import {renderDict} from "#/utils/render";
+import {z} from "#/adapter/form";
 
 
 export const querySchema: FormSchemaGetter = () => [
@@ -22,10 +23,6 @@ export const querySchema: FormSchemaGetter = () => [
 
 export const columns: VxeGridProps['columns'] = [
   {type: 'checkbox', width: 60},
-  {
-    title: '主键',
-    field: 'id',
-  },
   {
     title: '计划名称',
     field: 'planName',
@@ -34,10 +31,10 @@ export const columns: VxeGridProps['columns'] = [
     title: '计划编号',
     field: 'planNo',
   },
-  {
-    title: '设备类型',
-    field: 'machineTypeId',
-  },
+  // {
+  //   title: '设备类型',
+  //   field: 'machineTypeId',
+  // },
   {
     title: '保养周期',
     field: 'planPeriod',
@@ -179,31 +176,14 @@ export const modalSchema: FormSchemaGetter = () => [
     },
     rules:'required'
   },
-  // {
-  //   label: '开始时间',
-  //   fieldName: 'startDate',
-  //   component: 'DatePicker',
-  //   componentProps: {
-  //     showTime: true,
-  //     format: 'YYYY-MM-DD HH:mm:ss',
-  //     valueFormat: 'YYYY-MM-DD HH:mm:ss',
-  //   },
-  //   rules:'required'
-  // },
-  // {
-  //   label: '结束时间',
-  //   fieldName: 'endDate',
-  //   component: 'DatePicker',
-  //   componentProps: {
-  //     showTime: true,
-  //     format: 'YYYY-MM-DD HH:mm:ss',
-  //     valueFormat: 'YYYY-MM-DD HH:mm:ss',
-  //   },
-  //   rules:'required'
-  // },
-  // {
-  //   label: '状态(0启用,1停用)',
-  //   fieldName: 'state',
-  //   component: 'Input',
-  // },
+  {
+    label: '巡检人员',
+    fieldName: 'userId',
+    component: 'ApiSelect',
+    componentProps:{
+      mode: 'multiple',
+    },
+    rules: z.array(z.string()).min(1, { message: '请选择巡检人员' }),
+    formItemClass: 'col-span-2'
+  },
 ];
diff --git a/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/index.vue b/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/index.vue
index 8b999fd5..46095cb2 100644
--- a/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/index.vue
+++ b/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/index.vue
@@ -182,8 +182,8 @@ function handleDownloadExcel() {
       </template>
       <template #state="{row}">
         <TableSwitch
-          :checkedValue="1"
-          :unCheckedValue="0"
+          checkedValue="1"
+          unCheckedValue="0"
           v-model:value="row.state"
           :api="() => maintainPlanUpdate(row)"
           :disabled="!hasAccessByCodes(['property:depot:edit'])"
diff --git a/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/maintainPlan-modal.vue b/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/maintainPlan-modal.vue
index e5ed2a24..c2562fe5 100644
--- a/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/maintainPlan-modal.vue
+++ b/apps/web-antd/src/views/property/equipmentManagement/maintainPlan/maintainPlan-modal.vue
@@ -15,6 +15,8 @@ import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
 
 import {modalSchema} from './data';
 import {getMachineTypeTree} from "#/api/property/machineType";
+import {personList} from "#/api/property/resident/person";
+import {renderDictValue} from "#/utils/render";
 
 const emit = defineEmits<{ reload: [] }>();
 
@@ -62,12 +64,16 @@ const [BasicModal, modalApi] = useVbenModal({
     const {id} = modalApi.getData() as { id?: number | string };
     isUpdate.value = !!id;
     await setupTypeSelect();
+    await queryPersonData()
     if (isUpdate.value && id) {
       const record = await maintainPlanInfo(id);
       record.planDate = [record.startDate, record.endDate]
       if (record.planPeriod == '1') {
-        record.maintainanceMonth = record.maintainanceMonth?.split(',')
-        record.maintainanceDay = record.maintainanceDay?.split(',')
+        record.maintainMonth = record.maintainMonth?.split(',')
+        record.maintainDay = record.maintainDay?.split(',')
+      }
+      if (record.machineMaintainPlanStaffBoList) {
+        record.userId =  record.machineMaintainPlanStaffBoList.map(item=>item.userId)
       }
       await formApi.setValues(record);
     }
@@ -91,13 +97,19 @@ async function handleConfirm() {
       data.endDate = data.planDate[1]
     }
     if (data.planPeriod == '1') {
-      data.maintainanceMonth = data.maintainanceMonth?.join(',')
-      data.maintainanceDay = data.maintainanceDay?.join(',')
-      data.maintainanceEveryday = undefined
+      data.maintainMonth = data.maintainMonth?.join(',')
+      data.maintainDay = data.maintainDay?.join(',')
+      data.maintainEveryday = undefined
     } else {
-      data.maintainanceMonth = undefined
-      data.maintainanceDay = undefined
+      data.maintainMonth = undefined
+      data.maintainDay = undefined
     }
+    data.machineMaintainPlanStaffBoList = []
+    data.userId.forEach((item: string) => {
+      data.machineMaintainPlanStaffBoList.push({
+        userId: item
+      })
+    })
     await (isUpdate.value ? maintainPlanUpdate(data) : maintainPlanAdd(data));
     resetInitialized();
     emit('reload');
@@ -143,6 +155,29 @@ async function setupTypeSelect() {
     },
   ]);
 }
+
+async function queryPersonData() {
+  let params = {
+    pageSize: 1000,
+    pageNum: 1,
+  }
+  const res = await personList(params);
+  const options = res.rows.map((user) => ({
+    label: user.userName + '-' + renderDictValue(user.gender, 'sys_user_sex')
+      + '-' + user.phone + '-' + user.unitName,
+    value: user.id,
+  }));
+  formApi.updateSchema([{
+    componentProps: () => ({
+      options: options,
+      showSearch: true,
+      optionFilterProp: 'label',
+      optionLabelProp: 'label',
+      mode: 'multiple',
+    }),
+    fieldName: 'userId',
+  }])
+}
 </script>
 
 <template>
diff --git a/apps/web-antd/src/views/property/equipmentManagement/maintainTaskDetail/data.ts b/apps/web-antd/src/views/property/equipmentManagement/maintainTaskDetail/data.ts
index fe63f9bb..98a1f8b9 100644
--- a/apps/web-antd/src/views/property/equipmentManagement/maintainTaskDetail/data.ts
+++ b/apps/web-antd/src/views/property/equipmentManagement/maintainTaskDetail/data.ts
@@ -25,35 +25,34 @@ export const querySchema: FormSchemaGetter = () => [
 // export const columns: () => VxeGridProps['columns'] = () => [
 export const columns: VxeGridProps['columns'] = [
   { type: 'checkbox', width: 60 },
-  {
-    title: '设备名称',
-    field: 'machineId',
-  },
-  {
-    title: '设备编号',
-    field: 'machineId',
-  },
+  // {
+  //   title: '设备名称',
+  //   field: 'machineId',
+  // },
+  // {
+  //   title: '设备编号',
+  //   field: 'machineId',
+  // },
     {
     title: '位置编号',
     field: 'machineId',
   },
-    {
-    title: '计划名称',
-    field: 'machineId',
-  },
-    {
-    title: '计划保养人',
-    field: 'machineId',
-  },
-      {
-    title: '计划保养时间',
-    field: 'machineId',
-  },
-        {
-    title: '实际保养时间',
-    field: 'machineId',
-  },
-
+  //   {
+  //   title: '计划名称',
+  //   field: 'machineId',
+  // },
+  //   {
+  //   title: '计划保养人',
+  //   field: 'machineId',
+  // },
+  //     {
+  //   title: '计划保养时间',
+  //   field: 'machineId',
+  // },
+  // {
+  //   title: '实际保养时间',
+  //   field: 'machineId',
+  // },
   {
     title: '保养情况',
     field: 'sendFlag',
diff --git a/apps/web-antd/src/views/property/room/data.ts b/apps/web-antd/src/views/property/room/data.ts
index 6ca0c5ac..15c165e0 100644
--- a/apps/web-antd/src/views/property/room/data.ts
+++ b/apps/web-antd/src/views/property/room/data.ts
@@ -43,9 +43,13 @@ export const columns: VxeGridProps['columns'] = [
     field: 'roomTypeName',
   },
   {
-    title: '面积',
+    title: '建筑面积',
     field: 'area',
   },
+  {
+    title: '套内面积',
+    field: 'insideInArea',
+  },
   {
     title: '户型',
     field: 'layout',
@@ -110,10 +114,18 @@ export const modalSchema: FormSchemaGetter = () => [
     },
   },
   {
-    label: '面积',
+    label: '建筑面积',
     fieldName: 'area',
     component: 'Input',
   },
+  {
+    label: '套内面积',
+    fieldName: 'insideInArea',
+    component: 'InputNumber',
+    componentProps:{
+      min:0,
+    }
+  },
   {
     label: '户型',
     fieldName: 'layout',
diff --git a/apps/web-antd/src/views/sis/deviceGroup/data.ts b/apps/web-antd/src/views/sis/deviceGroup/data.ts
new file mode 100644
index 00000000..ea58930a
--- /dev/null
+++ b/apps/web-antd/src/views/sis/deviceGroup/data.ts
@@ -0,0 +1,69 @@
+import type { FormSchemaGetter } from '#/adapter/form';
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+
+export const querySchema: FormSchemaGetter = () => [
+  {
+    component: 'Input',
+    fieldName: 'name',
+    label: '分组名称',
+  },
+];
+
+// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
+// export const columns: () => VxeGridProps['columns'] = () => [
+export const columns: VxeGridProps['columns'] = [
+  { type: 'checkbox', width: 60 },
+  {
+    title: '主键id',
+    field: 'id',
+  },
+  {
+    title: '分组名称',
+    field: 'name',
+  },
+  {
+    title: '父节点',
+    field: 'parentId',
+  },
+  {
+    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: 'name',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '父节点',
+    fieldName: 'parentId',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '备注',
+    fieldName: 'remark',
+    component: 'Input',
+  },
+];
diff --git a/apps/web-antd/src/views/sis/deviceGroup/deviceGroup-modal.vue b/apps/web-antd/src/views/sis/deviceGroup/deviceGroup-modal.vue
new file mode 100644
index 00000000..e8ffb434
--- /dev/null
+++ b/apps/web-antd/src/views/sis/deviceGroup/deviceGroup-modal.vue
@@ -0,0 +1,101 @@
+<script setup lang="ts">
+import { computed, 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 { deviceGroupAdd, deviceGroupInfo, deviceGroupUpdate } from '#/api/sis/deviceGroup';
+import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
+
+import { modalSchema } from './data';
+
+const emit = defineEmits<{ reload: [] }>();
+
+const isUpdate = ref(false);
+const title = computed(() => {
+  return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
+});
+
+const [BasicForm, formApi] = useVbenForm({
+  commonConfig: {
+    // 默认占满两列
+    formItemClass: 'col-span-2',
+    // 默认label宽度 px
+    labelWidth: 80,
+    // 通用配置项 会影响到所有表单项
+    componentProps: {
+      class: 'w-full',
+    }
+  },
+  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-[550px]',
+  fullscreenButton: false,
+  onBeforeClose,
+  onClosed: handleClosed,
+  onConfirm: handleConfirm,
+  onOpenChange: async (isOpen) => {
+    if (!isOpen) {
+      return null;
+    }
+    modalApi.modalLoading(true);
+
+    const { id } = modalApi.getData() as { id?: number | string };
+    isUpdate.value = !!id;
+
+    if (isUpdate.value && id) {
+      const record = await deviceGroupInfo(id);
+      await formApi.setValues(record);
+    }
+    await markInitialized();
+
+    modalApi.modalLoading(false);
+  },
+});
+
+async function handleConfirm() {
+  try {
+    modalApi.lock(true);
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
+    const data = cloneDeep(await formApi.getValues());
+    await (isUpdate.value ? deviceGroupUpdate(data) : deviceGroupAdd(data));
+    resetInitialized();
+    emit('reload');
+    modalApi.close();
+  } catch (error) {
+    console.error(error);
+  } finally {
+    modalApi.lock(false);
+  }
+}
+
+async function handleClosed() {
+  await formApi.resetForm();
+  resetInitialized();
+}
+</script>
+
+<template>
+  <BasicModal :title="title">
+    <BasicForm />
+  </BasicModal>
+</template>
+
diff --git a/apps/web-antd/src/views/sis/deviceGroup/index.vue b/apps/web-antd/src/views/sis/deviceGroup/index.vue
new file mode 100644
index 00000000..9a371535
--- /dev/null
+++ b/apps/web-antd/src/views/sis/deviceGroup/index.vue
@@ -0,0 +1,182 @@
+<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 {
+  deviceGroupExport,
+  deviceGroupList,
+  deviceGroupRemove,
+} from '#/api/sis/deviceGroup';
+import type { DeviceGroupForm } from '#/api/sis/deviceGroup/model';
+import { commonDownloadExcel } from '#/utils/file/download';
+
+import deviceGroupModal from './deviceGroup-modal.vue';
+import { columns, querySchema } from './data';
+
+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 deviceGroupList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  rowConfig: {
+    keyField: 'id',
+  },
+  // 表格全局唯一表示 保存列配置需要用到
+  id: 'sis-deviceGroup-index'
+};
+
+const [BasicTable, tableApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [DeviceGroupModal, modalApi] = useVbenModal({
+  connectedComponent: deviceGroupModal,
+});
+
+function handleAdd() {
+  modalApi.setData({});
+  modalApi.open();
+}
+
+async function handleEdit(row: Required<DeviceGroupForm>) {
+  modalApi.setData({ id: row.id });
+  modalApi.open();
+}
+
+async function handleDelete(row: Required<DeviceGroupForm>) {
+  await deviceGroupRemove(row.id);
+  await tableApi.query();
+}
+
+function handleMultiDelete() {
+  const rows = tableApi.grid.getCheckboxRecords();
+  const ids = rows.map((row: Required<DeviceGroupForm>) => row.id);
+  Modal.confirm({
+    title: '提示',
+    okType: 'danger',
+    content: `确认删除选中的${ids.length}条记录吗？`,
+    onOk: async () => {
+      await deviceGroupRemove(ids);
+      await tableApi.query();
+    },
+  });
+}
+
+function handleDownloadExcel() {
+  commonDownloadExcel(deviceGroupExport, '设备组管理数据', 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="['sis:deviceGroup:export']"
+            @click="handleDownloadExcel"
+          >
+            {{ $t('pages.common.export') }}
+          </a-button>
+          <a-button
+            :disabled="!vxeCheckboxChecked(tableApi)"
+            danger
+            type="primary" 
+            v-access:code="['sis:deviceGroup:remove']" 
+            @click="handleMultiDelete">
+            {{ $t('pages.common.delete') }}
+          </a-button>
+          <a-button
+            type="primary"
+            v-access:code="['sis:deviceGroup:add']"
+            @click="handleAdd"
+          >
+            {{ $t('pages.common.add') }}
+          </a-button>
+        </Space>
+      </template>
+      <template #action="{ row }">
+        <Space>
+          <ghost-button
+            v-access:code="['sis:deviceGroup: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="['sis:deviceGroup:remove']"
+              @click.stop=""
+            >
+              {{ $t('pages.common.delete') }}
+            </ghost-button>
+          </Popconfirm>
+        </Space>
+      </template>
+    </BasicTable>
+    <DeviceGroupModal @reload="tableApi.query()" />
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/sis/deviceManage/data.ts b/apps/web-antd/src/views/sis/deviceManage/data.ts
index fb21fc12..a4e1c13b 100644
--- a/apps/web-antd/src/views/sis/deviceManage/data.ts
+++ b/apps/web-antd/src/views/sis/deviceManage/data.ts
@@ -15,6 +15,11 @@ export const querySchema: FormSchemaGetter = () => [
     fieldName: 'deviceIp',
     label: '设备ip',
   },
+  {
+    component: 'Input',
+    fieldName: 'deviceType',
+    label: '设备类型',
+  },
   {
     fieldName: 'deviceStatus',
     label: '在线状态',
@@ -34,6 +39,14 @@ export const columns: VxeGridProps['columns'] = [
     title: '设备名称',
     field: 'deviceName',
   },
+  {
+    title: '厂商编号',
+    field: 'factoryNo',
+  },
+  {
+    title: '设备类型',
+    field: 'device_type',
+  },
   {
     title: '设备ip',
     field: 'deviceIp',
@@ -43,30 +56,13 @@ export const columns: VxeGridProps['columns'] = [
     field: 'devicePort',
   },
   {
-    title: '设备',
+    title: '设备mac',
     field: 'deviceMac',
   },
   {
     title: '在线状态',
     field: 'deviceStatus',
   },
-
-  {
-    title: '通道编号',
-    field: 'channelNo',
-  },
-  {
-    title: '录像机ip',
-    field: 'vcrIp',
-  },
-  {
-    title: '录像机端口',
-    field: 'vcrPort',
-  },
-  /*{
-    title: '门禁id',
-    field: 'accessControlId',
-  },*/
   {
     field: 'action',
     fixed: 'right',
@@ -92,6 +88,18 @@ export const modalSchema: FormSchemaGetter = () => [
     component: 'Input',
     rules: 'required',
   },
+  {
+    label: '设备厂商',
+    fieldName: 'facrotyNo',
+    component: 'Input',
+    rules: 'required',
+  },
+  {
+    label: '设备类型',
+    fieldName: 'deviceType',
+    component: 'Input',
+    rules: 'required',
+  },
   {
     label: '设备ip',
     fieldName: 'deviceIp',
@@ -116,53 +124,10 @@ export const modalSchema: FormSchemaGetter = () => [
     component: 'Input',
     rules: 'required',
   },
+
   {
     label: '设备Mac',
     fieldName: 'deviceMac',
     component: 'Input',
   },
-  {
-    label: '通道编号',
-    fieldName: 'channelNo',
-    component: 'Input',
-  },
-  {
-    label: '录像机ip',
-    fieldName: 'vcrIp',
-    component: 'Input',
-  },
-  {
-    label: '录像机端口',
-    fieldName: 'vcrPort',
-    component: 'Input',
-  },
-  {
-    label: '录像机账号',
-    fieldName: 'vcrAccount',
-    component: 'Input',
-  },
-  {
-    label: '录像机密码',
-    fieldName: 'vcrPwd',
-    component: 'Input',
-  },
-  /*{
-    label: '绑定门禁',
-    fieldName: 'accessControlId',
-    component: 'ApiSelect',
-    componentProps: {
-      // mode: 'multiple', // 关键属性，启用多选模式
-      resultField: 'list', // 根据API返回结构调整
-      labelField: 'accessName',
-      valueField: 'accessCode',
-      api: async () => {
-        const params: AccessControlQuery = {
-          pageNum: 1,
-          pageSize: 500,
-        };
-        const res = await accessControlList(params);
-        return res.rows;
-      },
-    },
-  },*/
 ];
diff --git a/apps/web-antd/src/views/sis/deviceManage/index.vue b/apps/web-antd/src/views/sis/deviceManage/index.vue
index 9b637156..3a56729e 100644
--- a/apps/web-antd/src/views/sis/deviceManage/index.vue
+++ b/apps/web-antd/src/views/sis/deviceManage/index.vue
@@ -126,7 +126,7 @@ function handleDownloadExcel() {
 
 <template>
   <Page :auto-content-height="true">
-    <BasicTable table-title="设备管理列表">
+    <BasicTable class="flex-1 overflow-hidden" table-title="设备管理列表">
       <template #toolbar-tools>
         <Space>
           <a-button
diff --git a/apps/web-antd/src/views/sis/video/channel-tree.vue b/apps/web-antd/src/views/sis/video/channel-tree.vue
new file mode 100644
index 00000000..2ee65e03
--- /dev/null
+++ b/apps/web-antd/src/views/sis/video/channel-tree.vue
@@ -0,0 +1,114 @@
+<script setup lang="ts">
+import type { PropType } from 'vue';
+import { onMounted, ref } from 'vue';
+import { SyncOutlined } from '@ant-design/icons-vue';
+import { InputSearch, Skeleton, Tree } from 'ant-design-vue';
+import { treeList } from '#/api/sis/deviceChannel';
+import type { TreeNode } from '#/api/common';
+
+defineOptions({ inheritAttrs: false });
+
+withDefaults(defineProps<{ showSearch?: boolean }>(), { showSearch: true });
+
+const emit = defineEmits<{
+  /**
+   * 点击刷新按钮的事件
+   */
+  reload: [];
+  /**
+   * 点击节点的事件
+   */
+  select: [];
+}>();
+
+const channelId = defineModel('channelId', {
+  required: true,
+  type: Array as PropType<string[]>,
+});
+
+const searchValue = defineModel('searchValue', {
+  type: String,
+  default: '',
+});
+
+/** 通道数据源 */
+const channelTree = ref<TreeNode[]>([]);
+/** 骨架屏加载 */
+const showTreeSkeleton = ref<boolean>(true);
+
+async function loadChannelTree() {
+  showTreeSkeleton.value = true;
+  searchValue.value = '';
+  channelId.value = [];
+  const ret = await treeList();
+  channelTree.value = ret;
+  showTreeSkeleton.value = false;
+}
+
+async function handleReload() {
+  await loadChannelTree();
+  emit('reload');
+}
+
+onMounted(loadChannelTree);
+</script>
+
+<template>
+  <div :class="$attrs.class">
+    <Skeleton
+      :loading="showTreeSkeleton"
+      :paragraph="{ rows: 8 }"
+      active
+      class="p-[8px]"
+    >
+      <div
+        class="bg-background flex h-full flex-col overflow-y-auto rounded-lg"
+      >
+        <!-- 固定在顶部 必须加上bg-background背景色 否则会产生'穿透'效果 -->
+        <div
+          v-if="showSearch"
+          class="bg-background z-100 sticky left-0 top-0 p-[8px]"
+        >
+          <InputSearch
+            v-model:value="searchValue"
+            :placeholder="$t('pages.common.search')"
+            size="small"
+          >
+            <template #enterButton>
+              <a-button @click="handleReload">
+                <SyncOutlined class="text-primary" />
+              </a-button>
+            </template>
+          </InputSearch>
+        </div>
+        <div class="h-full overflow-x-hidden px-[8px]">
+          <Tree
+            v-bind="$attrs"
+            v-if="channelTree.length > 0"
+            v-model:selected-keys="channelId"
+            :class="$attrs.class"
+            :field-names="{ title: 'label', key: 'id' }"
+            :show-line="{ showLeafIcon: false }"
+            :tree-data="channelTree"
+            :virtual="false"
+            default-expand-all
+            @select="$emit('select')"
+          >
+            <template #title="{ label }">
+              <span v-if="label.indexOf(searchValue) > -1">
+                {{ label.substring(0, label.indexOf(searchValue)) }}
+                <span style="color: #f50">{{ searchValue }}</span>
+                {{
+                  label.substring(
+                    label.indexOf(searchValue) + searchValue.length,
+                  )
+                }}
+              </span>
+              <span v-else>{{ label }}</span>
+            </template>
+          </Tree>
+        </div>
+      </div>
+    </Skeleton>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/sis/video/data.ts b/apps/web-antd/src/views/sis/video/data.ts
new file mode 100644
index 00000000..e69de29b
diff --git a/apps/web-antd/src/views/sis/video/index.vue b/apps/web-antd/src/views/sis/video/index.vue
new file mode 100644
index 00000000..fffa1987
--- /dev/null
+++ b/apps/web-antd/src/views/sis/video/index.vue
@@ -0,0 +1,37 @@
+<template>
+  <Page class="h-full w-full">
+    <!--  设备分组区域  -->
+    <div class="flex h-full gap-[8px]">
+      <ChannelTree v-model:channel-id="channelId" class="w-[260px]" />
+
+      <!--  设备分组区域  -->
+      <div class="bg-background flex-1">
+        <div class="video-play-area h-[calc(100%-40px)]">
+          <div
+            v-for="i in playerNum"
+            class="player"
+            :class="'player-' + i"
+          ></div>
+        </div>
+        <div class="player-area h-[40px]">
+
+        </div>
+      </div>
+    </div>
+  </Page>
+  >
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue';
+import { Page } from '@vben/common-ui';
+import ChannelTree from './channel-tree.vue';
+
+const channelId = ref("");
+/**
+ * 屏幕播放器数量
+ */
+const playerNum = ref(1);
+</script>
+
+<style></style>