|
|
@@ -4,37 +4,44 @@
|
|
|
<img :src="BackIcon" alt="back" class="back-icon" @click="router.back()" />
|
|
|
<span class="disaster-precaution-container__title">灾害损失记录明细</span>
|
|
|
</header>
|
|
|
- <TaskInfoSection :task-name="taskName" @export-loss-detail="exportLossDetail" />
|
|
|
+ <TaskInfoSection :task-name="disasterLossDetailList?.handleTaskName" @export-loss-detail="exportLossDetail" />
|
|
|
<main class="disaster-precaution-container__main">
|
|
|
<section class="info-container">
|
|
|
<CollapseItem
|
|
|
- v-for="item in [1, 2, 3]"
|
|
|
- :key="item"
|
|
|
- :name="`上报单位:${item}`"
|
|
|
- :isActive="activeId === item"
|
|
|
- @toggle="handleCollapseToggle(item)"
|
|
|
+ v-for="reportTask in disasterLossDetailList?.reportTaskList"
|
|
|
+ :key="reportTask.reportDeptId"
|
|
|
+ :name="reportTask.reportDeptName"
|
|
|
+ :isActive="activeId === reportTask.reportDeptId"
|
|
|
+ @toggle="handleCollapseToggle(reportTask.reportDeptId)"
|
|
|
>
|
|
|
<template #view-operation>
|
|
|
<div class="rectification-info">
|
|
|
- <span class="num">26</span>
|
|
|
- <span>条,整改完成16条</span>
|
|
|
+ <span class="num">{{ reportTask.lossRecordCount }}</span>
|
|
|
+ <span>条,整改完成{{ reportTask.fixFinishCount }}条</span>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template #right-header>
|
|
|
- <span class="collapse-item__header--right">{{ activeId === item ? '收起' : '立即查看' }}</span>
|
|
|
+ <span class="collapse-item__header--right">
|
|
|
+ {{ activeId === reportTask.reportTaskId ? '收起' : '立即查看' }}
|
|
|
+ </span>
|
|
|
</template>
|
|
|
<template #main-table>
|
|
|
<div class="rectification-table">
|
|
|
<section class="damaged-list-container">
|
|
|
- <DamagedList :damagedList="damagedList" :activeId="0" />
|
|
|
+ <DamagedList
|
|
|
+ :damagedList="reportTask.lossRecordList"
|
|
|
+ :active-id="activeTaskId"
|
|
|
+ @update:activeId="handleActiveTask"
|
|
|
+ />
|
|
|
</section>
|
|
|
<section class="disaster-info-container">
|
|
|
- <DisasterInfo :LossReportItemFormData="lossReportItem" rectification v-if="lossReportItem?.isLoss" />
|
|
|
+ <DisasterInfo :LossReportItemFormData="lossRecordListInfo" rectification v-if="lossRecordListInfo" />
|
|
|
<Rectification
|
|
|
- :rectification-list="rectificationList"
|
|
|
- :rectification-dept-name="rectificationDeptName"
|
|
|
+ v-if="lossRecordListInfo?.fixRecordList"
|
|
|
+ :rectification-list="lossRecordListInfo?.fixRecordList"
|
|
|
+ :rectification-dept-name="lossRecordListInfo?.responsibleDeptName"
|
|
|
:rectification-responsible-user-list="rectificationResponsibleUserList"
|
|
|
- :rectification-priority="rectificationPriority"
|
|
|
+ :rectification-priority="lossRecordListInfo?.priority"
|
|
|
/>
|
|
|
</section>
|
|
|
</div>
|
|
|
@@ -55,76 +62,75 @@
|
|
|
import DisasterInfo from './src/components/DisasterInfo.vue';
|
|
|
import Rectification from './src/components/Rectification.vue';
|
|
|
import { useDisasterControlHook } from './src/hook';
|
|
|
+ import { useUserInfoHook } from '../hooks';
|
|
|
import type { PersonGroupItem } from '@/types/person-group/type';
|
|
|
- import type { DisposalRectificationFormData } from '@/types/disaster-control';
|
|
|
- import { getRectificationList } from '@/api/disaster-control';
|
|
|
+ import type { ReportTaskListDetail, LossRecordListDetail } from '@/types/disaster-control';
|
|
|
import { queryUserInfoByIds } from '@/api/system/person-group';
|
|
|
import BackIcon from 'assets/svg/back.svg';
|
|
|
|
|
|
const router = useRouter();
|
|
|
const route = useRoute();
|
|
|
const handleTaskId = Number(route.params.id);
|
|
|
- const { taskName, lossTaskId, fixTaskId } = route.query as unknown as {
|
|
|
- taskName: string;
|
|
|
+ const { lossTaskId, fixTaskId, deptId } = route.query as unknown as {
|
|
|
lossTaskId: number;
|
|
|
fixTaskId: number;
|
|
|
+ deptId: number;
|
|
|
+ };
|
|
|
+ const activeTaskId = ref<number>(Number(fixTaskId));
|
|
|
+
|
|
|
+ const handleActiveTask = (fixTaskId: number) => {
|
|
|
+ activeTaskId.value = fixTaskId;
|
|
|
+ if (!lossRecordList.value.length) return;
|
|
|
+ lossRecordListInfo.value = lossRecordList.value.find((item) => item.fixTaskId === activeTaskId.value);
|
|
|
+ getFixUserList(lossRecordListInfo.value?.fixPrincipals);
|
|
|
};
|
|
|
- const { lossReportItem, getLossReportItem } = useDisasterControlHook();
|
|
|
+ const { id: fixerId } = useUserInfoHook();
|
|
|
+ const { getDisasterLossDetailList, disasterLossDetailList } = useDisasterControlHook();
|
|
|
|
|
|
const exportLossDetail = () => {
|
|
|
ElMessage.warning('暂未开放');
|
|
|
};
|
|
|
- const activeId = ref<number | null>(1);
|
|
|
+ const activeId = ref<number | null>(null);
|
|
|
const handleCollapseToggle = (itemId: number) => {
|
|
|
if (activeId.value === itemId) {
|
|
|
activeId.value = null;
|
|
|
} else {
|
|
|
activeId.value = itemId;
|
|
|
+ reportTaskListInfo.value = reportTaskList.value.find((item) => item.reportDeptId === activeId.value);
|
|
|
+ if (!reportTaskListInfo.value) return;
|
|
|
+ lossRecordList.value = reportTaskListInfo.value?.lossRecordList;
|
|
|
+ activeTaskId.value = lossRecordList.value[0].fixTaskId;
|
|
|
+ lossRecordListInfo.value = lossRecordList.value.find((item) => item.fixTaskId === activeTaskId.value);
|
|
|
+ getFixUserList(lossRecordListInfo.value?.fixPrincipals);
|
|
|
}
|
|
|
};
|
|
|
- const damagedList: string[] = [
|
|
|
- '玻璃破损6处',
|
|
|
- '树木倒伏',
|
|
|
- '道闸杆',
|
|
|
- '摄像机支架',
|
|
|
- '支架鸭嘴(不锈钢)',
|
|
|
- '遥控器',
|
|
|
- '室外防水设备箱',
|
|
|
- ];
|
|
|
- const rectificationDeptName = ref<string>('建设管理部');
|
|
|
- const rectificationResponsibleUserList = ref<PersonGroupItem[]>([
|
|
|
- {
|
|
|
- id: 1,
|
|
|
- realname: '张三',
|
|
|
- staffNo: '123456',
|
|
|
- },
|
|
|
- {
|
|
|
- id: 2,
|
|
|
- realname: '李四',
|
|
|
- staffNo: '123456',
|
|
|
- },
|
|
|
- {
|
|
|
- id: 3,
|
|
|
- realname: '王五',
|
|
|
- staffNo: '123456',
|
|
|
- },
|
|
|
- ]);
|
|
|
- const rectificationPriority = ref<string>('normal');
|
|
|
- const rectificationList = ref<DisposalRectificationFormData[]>([]);
|
|
|
+ const rectificationResponsibleUserList = ref<PersonGroupItem[]>([]);
|
|
|
+ const reportTaskList = ref<ReportTaskListDetail[]>([]);
|
|
|
+ const lossRecordList = ref<LossRecordListDetail[]>([]);
|
|
|
+ const reportTaskListInfo = ref<ReportTaskListDetail>();
|
|
|
+ const lossRecordListInfo = ref<LossRecordListDetail>();
|
|
|
+ const getFixUserList = async (userIds: string | undefined) => {
|
|
|
+ if (!userIds) return;
|
|
|
+ const ids = JSON.parse(userIds);
|
|
|
+ const res = await queryUserInfoByIds(ids);
|
|
|
+ rectificationResponsibleUserList.value = res;
|
|
|
+ };
|
|
|
onMounted(async () => {
|
|
|
- const res = await getRectificationList([lossTaskId]);
|
|
|
- rectificationList.value = res[0].disasterLossFixRecordList;
|
|
|
- // 直接for循环查
|
|
|
- for (const item of rectificationList.value) {
|
|
|
- item.remark = item.remark ? item.remark : '--';
|
|
|
- if (item.createdBy) {
|
|
|
- const userInfo = await queryUserInfoByIds([Number(item.createdBy)]);
|
|
|
- item.createdByName = userInfo[0]?.realname || '--';
|
|
|
- } else {
|
|
|
- item.createdByName = '--';
|
|
|
- }
|
|
|
+ await getDisasterLossDetailList({
|
|
|
+ handleTaskId,
|
|
|
+ fixerId,
|
|
|
+ });
|
|
|
+ if (!disasterLossDetailList.value?.reportTaskList.length) return;
|
|
|
+ reportTaskList.value = disasterLossDetailList.value?.reportTaskList;
|
|
|
+ activeId.value = deptId ? Number(deptId) : reportTaskList.value[0].reportDeptId;
|
|
|
+ reportTaskListInfo.value = reportTaskList.value.find((item) => item.reportDeptId === activeId.value);
|
|
|
+ if (!reportTaskListInfo.value) return;
|
|
|
+ lossRecordList.value = reportTaskListInfo.value?.lossRecordList;
|
|
|
+ if (isNaN(activeTaskId.value)) {
|
|
|
+ activeTaskId.value = lossRecordList.value[0].fixTaskId;
|
|
|
}
|
|
|
- getLossReportItem(Number(handleTaskId), Number(lossTaskId));
|
|
|
+ lossRecordListInfo.value = lossRecordList.value.find((item) => item.fixTaskId === activeTaskId.value);
|
|
|
+ getFixUserList(lossRecordListInfo.value?.fixPrincipals);
|
|
|
});
|
|
|
</script>
|
|
|
|