97 lines
3.3 KiB
Vue
97 lines
3.3 KiB
Vue
|
<script setup lang="ts">
|
|||
|
|
import type {ContingenPlanVO} from '#/api/property/customerService/contingenPlan/model';
|
|||
|
|
import {shallowRef} from 'vue';
|
|||
|
|
import {useVbenModal} from '@vben/common-ui';
|
|||
|
|
import {
|
|||
|
|
Descriptions,
|
|||
|
|
DescriptionsItem,
|
|||
|
|
Divider,
|
|||
|
|
Rate,
|
|||
|
|
Timeline,
|
|||
|
|
TimelineItem
|
|||
|
|
} from 'ant-design-vue';
|
|||
|
|
import {contingenPlanInfo} from '#/api/property/customerService/contingenPlan';
|
|||
|
|
import {renderDict} from "#/utils/render";
|
|||
|
|
|
|||
|
|
const [BasicModal, modalApi] = useVbenModal({
|
|||
|
|
onOpenChange: handleOpenChange,
|
|||
|
|
onClosed() {
|
|||
|
|
contingenPlanIDetail.value = null;
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
const contingenPlanIDetail = shallowRef<null | ContingenPlanVO>(null);
|
|||
|
|
const handleRecords = shallowRef<null | ContingenPlanVO>(null);
|
|||
|
|
async function handleOpenChange(open: boolean) {
|
|||
|
|
if (!open) {
|
|||
|
|
return null;
|
|||
|
|
}
|
|||
|
|
modalApi.modalLoading(true);
|
|||
|
|
const {id} = modalApi.getData() as { id: number | string };
|
|||
|
|
const response = await contingenPlanInfo(id);
|
|||
|
|
contingenPlanIDetail.value = response;
|
|||
|
|
handleRecords.value = response.contingenPlanRecordVos.map(item => ({
|
|||
|
|
status: item.status,
|
|||
|
|
createTime: item.createTime,
|
|||
|
|
handlerName: item.dutyPersionName
|
|||
|
|
}));
|
|||
|
|
console.log(handleRecords.value)
|
|||
|
|
modalApi.modalLoading(false);
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<template>
|
|||
|
|
<BasicModal :footer="false" :fullscreen-button="false" title="详情" class="w-[70%]">
|
|||
|
|
<Descriptions v-if="contingenPlanIDetail" size="small" :column="2" bordered :labelStyle="{width:'120px'}">
|
|||
|
|
<DescriptionsItem label="预案名称">
|
|||
|
|
{{ contingenPlanIDetail.contingenPlanName }}
|
|||
|
|
</DescriptionsItem>
|
|||
|
|
<DescriptionsItem label="创建时间">
|
|||
|
|
{{ contingenPlanIDetail.createTime }}
|
|||
|
|
</DescriptionsItem>
|
|||
|
|
<DescriptionsItem label="预案类型" v-if="contingenPlanIDetail.contingenPlanType!=null">
|
|||
|
|
<component
|
|||
|
|
:is="renderDict(contingenPlanIDetail.contingenPlanType,'type_contingency_plan')"
|
|||
|
|
/>
|
|||
|
|
</DescriptionsItem>
|
|||
|
|
<DescriptionsItem label="最后更新时间">
|
|||
|
|
{{ contingenPlanIDetail.updateTime }}
|
|||
|
|
</DescriptionsItem>
|
|||
|
|
<DescriptionsItem label="演练状态" v-if="contingenPlanIDetail.status!=null">
|
|||
|
|
<component
|
|||
|
|
:is="renderDict(contingenPlanIDetail.status,'pro_exercise_status')"
|
|||
|
|
/>
|
|||
|
|
</DescriptionsItem>
|
|||
|
|
<DescriptionsItem label="完成时间">
|
|||
|
|
{{ contingenPlanIDetail.compleTimes }}
|
|||
|
|
</DescriptionsItem>
|
|||
|
|
<DescriptionsItem label="发起人">
|
|||
|
|
{{ contingenPlanIDetail.initiatName }}
|
|||
|
|
</DescriptionsItem>
|
|||
|
|
<DescriptionsItem label="责任人">
|
|||
|
|
{{ contingenPlanIDetail.dutyPersionName}}
|
|||
|
|
</DescriptionsItem>
|
|||
|
|
<DescriptionsItem label="预案内容" :span="2">
|
|||
|
|
<div v-html="contingenPlanIDetail.contingenPlanContent"></div>
|
|||
|
|
</DescriptionsItem>
|
|||
|
|
<DescriptionsItem label="风险等级">
|
|||
|
|
<Rate :value="contingenPlanIDetail.grade" disabled />
|
|||
|
|
</DescriptionsItem>
|
|||
|
|
</Descriptions>
|
|||
|
|
|
|||
|
|
<Divider orientation="left" orientation-margin="0px">
|
|||
|
|
处理记录
|
|||
|
|
</Divider>
|
|||
|
|
<Timeline>
|
|||
|
|
<TimelineItem v-for="(item,index) in handleRecords" :key="index">
|
|||
|
|
<p style="display: flex;">类型：
|
|||
|
|
<component
|
|||
|
|
:is="renderDict(item.status,'pro_exercise_status')"
|
|||
|
|
/></p>
|
|||
|
|
<p>时间：{{item.createTime}}</p>
|
|||
|
|
<p>处理人：{{item.handlerName}}</p>
|
|||
|
|
</TimelineItem>
|
|||
|
|
</Timeline>
|
|||
|
|
</BasicModal>
|
|||
|
|
</template>
|