Files
admin-vben5/apps/web-antd/src/views/property/roomBooking/conferenceSettings/conferenceSettings-detail.vue
2025-07-31 15:32:59 +08:00

84 lines
3.1 KiB
Vue

<script setup lang="ts">
import type {conferenceSettingsDetail} from '#/api/property/roomBooking/conferenceSettings/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 {meetInfo} from '#/api/property/roomBooking/conferenceSettings';
import {renderDict} from "#/utils/render";
dayjs.extend(duration);
dayjs.extend(relativeTime);
const [BasicModal, modalApi] = useVbenModal({
onOpenChange: handleOpenChange,
onClosed() {
conferenceSettingsDetail.value = null;
},
});
const conferenceSettingsDetail = shallowRef<null | conferenceSettingsDetail>(null);
async function handleOpenChange(open: boolean) {
if (!open) {
return null;
}
modalApi.modalLoading(true);
const {id} = modalApi.getData() as { id: number | string };
conferenceSettingsDetail.value =await meetInfo(id);
modalApi.modalLoading(false);
}
</script>
<template>
<BasicModal :footer="false" :fullscreen-button="false" title="会议室详情" class="w-[70%]">
<Descriptions v-if="conferenceSettingsDetail" size="small" :column="2" bordered
:labelStyle="{width:'120px'}">
<DescriptionsItem label="会议室名称">
{{ conferenceSettingsDetail.name }}
</DescriptionsItem>
<DescriptionsItem label="会议室类型">
<component
:is="renderDict(conferenceSettingsDetail.meetingRoomType,'meeting_room_type')"
/>
</DescriptionsItem>
<DescriptionsItem label="可容纳人数">
{{ conferenceSettingsDetail.personNumber }}
</DescriptionsItem>
<DescriptionsItem label="会议室地址" :span="2">
{{ conferenceSettingsDetail.locationName }}
</DescriptionsItem>
<DescriptionsItem label="配套设备" :span="2">
{{ conferenceSettingsDetail.baseService }}
</DescriptionsItem>
<DescriptionsItem label="负责人" :span="2">
{{ conferenceSettingsDetail.principalsName+'-'+conferenceSettingsDetail.phoneNo }}
</DescriptionsItem>
<DescriptionsItem label="费用模式" :span="conferenceSettingsDetail.expenseType=='2'?1:2">
<component
:is="renderDict(conferenceSettingsDetail.expenseType,'wy_fyms')"
/>
</DescriptionsItem>
<DescriptionsItem label="付费金额(元)" v-if="conferenceSettingsDetail.expenseType=='2'">
{{ conferenceSettingsDetail.basePrice }}
</DescriptionsItem>
<DescriptionsItem label="会议室图片" :span="2">
{{ conferenceSettingsDetail.picture }}
</DescriptionsItem>
<DescriptionsItem label="预约是否审核">
<component
:is="renderDict(conferenceSettingsDetail.isCheck,'wy_sf')"
/>
</DescriptionsItem>
<DescriptionsItem label="开放时段" :span="2">
{{ conferenceSettingsDetail.openHours }}
</DescriptionsItem>
<DescriptionsItem label="会议室描述" :span="2">
{{ conferenceSettingsDetail.descs }}
</DescriptionsItem>
</Descriptions>
</BasicModal>
</template>