- <template>
- <!-- 电话/网上微信投诉事件详情 -->
- <div class="publicContainer">
- <div class="publicDetail">
- <div class="part">
- <p class="title">事件名称:</p>
- <p class="content">{{ detailData.eventName }}</p>
- </div>
- <div class="part">
- <p class="title">事件编号:</p>
- <p class="content">{{ detailData.eventNo }}</p>
- </div>
- <div class="part">
- <p class="title">事件状态:</p>
- <p class="content">
- <dict-tag :options="eventStatusType" :value="detailData.eventStatus" />
- </p>
- </div>
- <div class="part">
- <p class="title">事件类型:</p>
- <p class="content">
- <dict-tag :options="eventTypes" :value="detailData.eventType" />
- </p>
- </div>
- <div class="part">
- <p class="title">事件紧急程度:</p>
- <p class="content"><dict-tag :options="urgencyType" :value="detailData.eventUrgency" /></p>
- </div>
- <div class="part">
- <p class="title">事件发生时间:</p>
- <p class="content">{{ detailData.eventHappenTime || '--' }}</p>
- </div>
- <div class="part" style="width: 100%">
- <p class="title">事件要求:</p>
- <p class="content">{{ detailData.eventRequirement || '--' }}</p>
- </div>
- <div class="part">
- <p class="title">期望完成时间:</p>
- <p class="content">{{ detailData.rpExpectTime || '--' }}</p>
- </div>
- <div class="part">
- <p class="title">实际完成时间:</p>
- <p class="content">{{ detailData.rpEndTime || '--' }}</p>
- </div>
- <div class="part">
- <p class="title">维修类型:</p>
- <p class="content">{{ detailData.rpType == 'minor' ? '小修' : '专项维修' }}</p>
- </div>
- <div class="part">
- <p class="title">事件处理前照片:</p>
- <p class="content">
- <ImagePreview :src="item.url" v-for="item in detailData.scenePhotosFileList" :key="item.id"></ImagePreview>
- </p>
- </div>
- <div class="part">
- <p class="title">维修人员:</p>
- <p class="content">{{ detailData.rpUserName || '--' }}</p>
- </div>
- <div class="part" style="width: 100%">
- <p class="title">维修完成情况说明:</p>
- <p class="content">{{ detailData.rpEndDesc || '--' }}</p>
- </div>
- <el-divider />
- <div class="part" style="width: 100%">
- <p class="title" style="width: 100%">事件处理进度:</p>
- <el-table :data="detailData.eventHistoryList" max-height="300px">
- <el-table-column label="时间" prop="createTime" />
- <el-table-column label="操作人" prop="createUserName" />
- <el-table-column label="事件状态" prop="remark" />
- <!-- <el-table-column label="事件状态" prop="eventStatus">
- <template #default="scope">
- <dict-tag :options="eventStatusType" :value="scope.row.eventStatus" />
- </template>
- </el-table-column> -->
- </el-table>
- </div>
- <el-divider />
- <div class="part" style="width: 100%">
- <p class="title" style="width: 100%">历史处理进度:</p>
- <el-table :data="detailData.operateRepairOrderVo.repairOrderHistoryList" max-height="300px">
- <el-table-column label="时间" prop="createTime" />
- <el-table-column label="现场处理描述" prop="rpOrderDesc" />
- <el-table-column label="处置照片" prop="postName">
- <template #default="scope">
- <ImagePreview :src="item.url" v-for="item in scope.row.repairPhotosFileList" :key="item.id"></ImagePreview>
- </template>
- </el-table-column>
- </el-table>
- </div>
- </div>
- </div>
- </template>
- <script setup name="page">
- import { eventManageDetail } from '@/api/floodSys/repair';
- const { proxy } = getCurrentInstance();
- const props = defineProps({
- eventId: {
- type: String,
- default: '',
- },
- });
- const detailData = ref({
- operateRepairOrderVo: {
- repairOrderHistoryList: [],
- },
- });
- const eventStatusType = proxy.fixDict['eventStatusType']; //事件处理状态
- const urgencyType = proxy.fixDict['urgencyType']; //事件紧急程度
- const eventTypes = proxy.fixDict['eventTypes']; //事件类型
- // 获取详情数据
- function getDataList() {
- proxy.$modal.loading('加载中...');
- eventManageDetail(props.eventId).then(response => {
- detailData.value = response.data;
- proxy.$modal.closeLoading(); //关闭loading
- });
- }
- onMounted(() => {
- getDataList();
- });
- </script>
- <style lang="scss"></style>