100 lines
4.0 KiB
Vue
100 lines
4.0 KiB
Vue
<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" :span="2">
|
|
<component
|
|
:is="renderDict(costItemSettingDetail.formula,'pro_calculation_formula')"
|
|
/>
|
|
</DescriptionsItem>
|
|
<DescriptionsItem :label="costItemSettingDetail.formula=='1'?'费用':'计费单价'" v-if="costItemSettingDetail.unitPrice!=null">
|
|
{{ costItemSettingDetail.unitPrice }}
|
|
</DescriptionsItem>
|
|
<DescriptionsItem label="附加费用" v-if="costItemSettingDetail.surcharge!=null">
|
|
{{ costItemSettingDetail.surcharge }}
|
|
</DescriptionsItem>
|
|
</Descriptions>
|
|
</BasicModal>
|
|
</template>
|