1、房屋收费退费

2025-07-19 14:43:45 +08:00 · 2025-07-19 14:43:45 +08:00 · 89b1c527fa
commit 89b1c527fa
parent 2684133491
7 changed files with 291 additions and 38 deletions
--- a/apps/web-antd/src/api/property/costManagement/houseCharge/model.d.ts
+++ b/apps/web-antd/src/api/property/costManagement/houseCharge/model.d.ts
@ -1,4 +1,6 @@
 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 {
  /**
@ -46,7 +48,16 @@ export interface HouseChargeVO {
   * 缴费周期
   */
  chargeCycle: number;
+  /**
+   * 支付方式
+   */
+  payType: string;

+  roomVo: RoomVO;
+
+  costItemsVo: CostItemSettingVO;
+
+  chargeStatus: string;
 }

 export interface HouseChargeForm extends BaseEntity {
@ -90,6 +101,10 @@ export interface HouseChargeForm extends BaseEntity {
   */
  remark?: string;

+  /**
+   * 缴费状态
+   */
+  chargeStatus?: string;
 }

 export interface HouseChargeQuery extends PageQuery {
--- a/apps/web-antd/src/views/property/costManagement/houseCharge/data.ts
+++ b/apps/web-antd/src/views/property/costManagement/houseCharge/data.ts
@ -25,10 +25,10 @@ export const querySchema: FormSchemaGetter = () => [
  },
  {
    component: 'Select',
-    fieldName: 'state',
-    label: '状态',
+    fieldName: 'chargeStatus',
+    label: '缴费状态',
    componentProps: {
-      options: getDictOptions('wy_fysfzt')
+      options: getDictOptions('wy_fyshzt')
    },
  },
 ];
@ -60,15 +60,25 @@ export const columns: VxeGridProps['columns'] = [
    width: 150,
  },
  {
-    title: '状态',
-    field: 'state',
+    title: '缴费状态',
+    field: 'chargeStatus',
    width: 150,
    slots: {
      default: ({row}) => {
-        return renderDict(row.state, 'wy_fysfzt')
+        return renderDict(row.chargeStatus, 'wy_fyshzt')
      }
    }
  },
+  // {
+  //   title: '状态',
+  //   field: 'state',
+  //   width: 150,
+  //   slots: {
+  //     default: ({row}) => {
+  //       return renderDict(row.state, 'wy_fysfzt')
+  //     }
+  //   }
+  // },
  {
    title: '说明',
    field: 'remark',
@ -101,6 +111,14 @@ export const modalSchema: FormSchemaGetter = () => [
    },
    rules: 'selectRequired',
  },
+  {
+    label: '业主',
+    fieldName: 'personId',
+    component: 'ApiSelect',
+    componentProps: {
+    },
+    rules: 'selectRequired',
+  },
  {
    label: '费用类型',
    fieldName: 'costType',
@ -179,3 +197,20 @@ export const modalSchemaUpdate: FormSchemaGetter = () => [
    rules: 'selectRequired',
  },
 ]
+export const modalSchemaRefund: FormSchemaGetter = () => [
+  {
+    label: '主键',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '退费原因',
+    fieldName: 'reason',
+    component: 'Textarea',
+    formItemClass: 'col-span-2'
+  },
+]
--- 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
@ -23,8 +23,9 @@ const [BasicModal, modalApi] = useVbenModal({
 });

 const houseChargeDetail = shallowRef<null | HouseChargeVO>(null);
-const room=ref<RoomVO>();
-const costItem=ref<CostItemSettingVO>();
+const room = ref<RoomVO>();
+const costItem = ref<CostItemSettingVO>();
+
 async function handleOpenChange(open: boolean) {
  if (!open) {
    return null;
@ -32,9 +33,9 @@ async function handleOpenChange(open: boolean) {
  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
+  if (houseChargeDetail.value) {
+    room.value = houseChargeDetail.value.roomVo
+    costItem.value = houseChargeDetail.value.costItemsVo
  }
  modalApi.modalLoading(false);
 }
@ -52,39 +53,46 @@ async function handleOpenChange(open: boolean) {
      </DescriptionsItem>
      <DescriptionsItem label="费用类型">
        <component v-if="costItem"
-          :is="renderDict(costItem.costType,'pro_expense_type')"
+                   :is="renderDict(costItem.costType,'pro_expense_type')"
        />
      </DescriptionsItem>
      <DescriptionsItem label="计费时间">
-        {{ houseChargeDetail.startTime+' 至 '+houseChargeDetail.endTime }}
+        {{ houseChargeDetail.startTime + ' 至 ' + houseChargeDetail.endTime }}
      </DescriptionsItem>
      <DescriptionsItem label="房间">
-        {{room?.roomNumber}}
+        {{ room?.roomNumber }}
      </DescriptionsItem>
      <DescriptionsItem label="房间面积">
-        {{`建筑面积：${room?.area} 套内面积：${room?.insideInArea}`}}
+        {{ `建筑面积：${room?.area} 套内面积：${room?.insideInArea}` }}
      </DescriptionsItem>
      <DescriptionsItem label="单价">
        {{ costItem?.unitPrice }}
      </DescriptionsItem>
      <DescriptionsItem label="附加费">
-        {{costItem?.surcharge}}
+        {{ costItem?.surcharge }}
      </DescriptionsItem>
      <DescriptionsItem label="应收金额">
-        <span style="font-size: 16px;font-weight: 600;color: red" v-if="houseChargeDetail.amountReceivable">
-         ￥ {{houseChargeDetail.amountReceivable}}
-        </span>
+        <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')"
+            :is="renderDict(houseChargeDetail.payType,'wy_zffs')"
        />
      </DescriptionsItem>
      <DescriptionsItem label="缴费周期" v-if="houseChargeDetail.chargeCycle">
-        {{houseChargeDetail.chargeCycle}}月
+        {{ houseChargeDetail.chargeCycle }}月
      </DescriptionsItem>
      <DescriptionsItem label="说明" :span="2">
-        {{houseChargeDetail.remark}}
+        {{ houseChargeDetail.remark }}
      </DescriptionsItem>
    </Descriptions>
  </BasicModal>
--- 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
@ -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>
+
--- a/apps/web-antd/src/views/property/costManagement/houseCharge/houseCharge-add.vue
+++ b/apps/web-antd/src/views/property/costManagement/houseCharge/houseCharge-add.vue
@ -18,6 +18,8 @@ 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: [] }>();

@ -65,6 +67,7 @@ const [BasicModal, modalApi] = useVbenModal({
    await initRoomOptions()
    await queryCostItemOptions()
    await initCostTypeOptions()
+    await queryPersonData()
    const {id} = modalApi.getData() as { id?: number | string };
    isUpdate.value = !!id;

@ -191,6 +194,28 @@ async function initCostTypeOptions(){
    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>
--- a/apps/web-antd/src/views/property/costManagement/houseCharge/houseCharge-update.vue
+++ b/apps/web-antd/src/views/property/costManagement/houseCharge/houseCharge-update.vue
@ -85,7 +85,8 @@ async function handleConfirm() {
    const data = cloneDeep(await formApi.getValues());
    record.value.payType = data.payType
    record.value.chargeCycle = data.chargeCycle
-    await houseChargeUpdate(record.value) ;
+    record.value.chargeStatus = '4'
+    await houseChargeUpdate(record.value);
    resetInitialized();
    emit('reload');
    modalApi.close();
@ -115,7 +116,7 @@ async function handleClosed() {
      </DescriptionsItem>
      <DescriptionsItem label="费用类型">
        <component
-            v-if="costItem"
+          v-if="costItem"
          :is="renderDict(costItem?.costType,'pro_expense_type')"
        />
      </DescriptionsItem>
@ -123,7 +124,7 @@ async function handleClosed() {
        {{ record.startTime }}
      </DescriptionsItem>
      <DescriptionsItem label="房间">
-        {{ room.roomNumber }}
+        {{ room?.roomNumber }}
      </DescriptionsItem>
      <DescriptionsItem label="面积(㎡)">
        {{ `${room?.area} （套内面积：${room?.insideInArea}）` }}
@ -134,7 +135,7 @@ async function handleClosed() {
      <DescriptionsItem label="附加费">
        {{ costItem?.surcharge }}
      </DescriptionsItem>
-      <DescriptionsItem label="应收金额" :span="2">
+      <DescriptionsItem label="缴费金额" :span="2">
        <span style="font-size: 16px;font-weight: 600;color: red" v-if="record.amountReceivable">
         ￥ {{ record.amountReceivable }}
        </span>
--- a/apps/web-antd/src/views/property/costManagement/houseCharge/index.vue
+++ b/apps/web-antd/src/views/property/costManagement/houseCharge/index.vue
@ -1,9 +1,9 @@
 <script setup lang="ts">

-import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
-import { getVxePopupContainer } from '@vben/utils';
+import {Page, useVbenModal, type VbenFormProps} from '@vben/common-ui';
+import {getVxePopupContainer} from '@vben/utils';

-import { Modal, Popconfirm, Space } from 'ant-design-vue';
+import {Modal, Popconfirm, Space} from 'ant-design-vue';

 import {
  useVbenVxeGrid,
@ -16,13 +16,14 @@ import {
  houseChargeList,
  houseChargeRemove,
 } from '#/api/property/costManagement/houseCharge';
-import type { HouseChargeForm } from '#/api/property/costManagement/houseCharge/model';
-import { commonDownloadExcel } from '#/utils/file/download';
+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 { columns, querySchema } from './data';
+import houseChargeRefund from './house-charge-refund.vue';
+import {columns, querySchema} from './data';

 const formOptions: VbenFormProps = {
  commonConfig: {
@ -52,7 +53,7 @@ const gridOptions: VxeGridProps = {
  pagerConfig: {},
  proxyConfig: {
    ajax: {
-      query: async ({ page }, formValues = {}) => {
+      query: async ({page}, formValues = {}) => {
        return await houseChargeList({
          pageNum: page.currentPage,
          pageSize: page.pageSize,
@ -82,6 +83,9 @@ const [HouseChargeUpdate, updateApi] = useVbenModal({
 const [HouseChargeDetail, detailApi] = useVbenModal({
  connectedComponent: houseChargeDetail,
 });
+const [HouseChargeRefund, refundApi] = useVbenModal({
+  connectedComponent: houseChargeRefund,
+});

 function handleAdd() {
  modalApi.setData({});
@ -89,11 +93,12 @@ function handleAdd() {
 }

 async function handleEdit(row: Required<HouseChargeForm>) {
-  updateApi.setData({ id: row.id });
+  updateApi.setData({id: row.id});
  updateApi.open();
 }
+
 async function handleInfo(row: Required<HouseChargeForm>) {
-  detailApi.setData({ id: row.id });
+  detailApi.setData({id: row.id});
  detailApi.open();
 }

@ -102,6 +107,11 @@ async function handleDelete(row: Required<HouseChargeForm>) {
  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);
@ -160,12 +170,22 @@ function handleDownloadExcel() {
            {{ $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="确认取消？"
@ -175,15 +195,17 @@ function handleDownloadExcel() {
              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()" />
+    <HouseChargeAdd @reload="tableApi.query()"/>
+    <HouseChargeUpdate @reload="tableApi.query()"/>
+    <HouseChargeRefund @reload="tableApi.query()"/>
    <HouseChargeDetail/>
  </Page>
 </template>