|
@@ -33,7 +33,43 @@
|
|
|
</div>
|
|
</div>
|
|
|
</template>
|
|
</template>
|
|
|
<template #main-table>
|
|
<template #main-table>
|
|
|
- <!-- <BasicTable :tableData="item.tableData" :tableConfig="tableConfig" /> -->
|
|
|
|
|
|
|
+ <el-button type="primary" :icon="Plus" class="main-table__button">新增</el-button>
|
|
|
|
|
+ <BasicTable :tableData="item.tableData[0].disasterReportRecordDetailList" :tableConfig="tableConfig">
|
|
|
|
|
+ <template #affectedArea="scope">
|
|
|
|
|
+ <div class="affected-area-container">
|
|
|
|
|
+ <span>{{ scope.row.buildingNo + scope.row.floorNo + scope.row.roomNo }}</span>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <template #affectedItems="scope">
|
|
|
|
|
+ <el-tooltip :content="scope.row.affectedItems" placement="top-start" effect="light">
|
|
|
|
|
+ <div class="affected-items-container">
|
|
|
|
|
+ <span>{{ scope.row.affectedItems }}</span>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-tooltip>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <template #priority="scope">
|
|
|
|
|
+ <div
|
|
|
|
|
+ class="priority-container"
|
|
|
|
|
+ :class="
|
|
|
|
|
+ scope.row.priority === PRIORITY_STATUS.URGENT
|
|
|
|
|
+ ? 'priority-container--urgent'
|
|
|
|
|
+ : 'priority-container--normal'
|
|
|
|
|
+ "
|
|
|
|
|
+ >
|
|
|
|
|
+ <span>{{ getPriorityStatus(scope.row.priority) }}</span>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <template #fixStatus="scope">
|
|
|
|
|
+ <div class="fix-status-container">
|
|
|
|
|
+ <span>{{ getfixStatus(scope.row.fixStatus) }}</span>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <template #action="scope">
|
|
|
|
|
+ <ActionButton text="编辑" v-if="scope.row.fixStatus === FIX_STATUS.TO_BE_RECTIFIED" />
|
|
|
|
|
+ <ActionButton text="查看" v-if="scope.row.isLoss === IS_LOSS.NO_LOSS" />
|
|
|
|
|
+ <ActionButton text="删除" />
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </BasicTable>
|
|
|
</template>
|
|
</template>
|
|
|
</CollapseItem>
|
|
</CollapseItem>
|
|
|
</template>
|
|
</template>
|
|
@@ -58,14 +94,18 @@
|
|
|
import { Plus } from '@element-plus/icons-vue';
|
|
import { Plus } from '@element-plus/icons-vue';
|
|
|
import Search from '@/views/disaster/components/Search.vue';
|
|
import Search from '@/views/disaster/components/Search.vue';
|
|
|
import BasicTable from '@/components/BasicTable.vue';
|
|
import BasicTable from '@/components/BasicTable.vue';
|
|
|
|
|
+ import ActionButton from '@/components/ActionButton.vue';
|
|
|
import { getAllDepartments } from '@/api/auth/dept';
|
|
import { getAllDepartments } from '@/api/auth/dept';
|
|
|
import CollapseItem from './CollapseItem.vue';
|
|
import CollapseItem from './CollapseItem.vue';
|
|
|
- import { DEFAULT_PAGE_SIZE, DISASTER_CONTROL_PAGE_SIZE_CONFIG } from '../constant';
|
|
|
|
|
- import type {
|
|
|
|
|
- DisposalManagementCollapseListResponse,
|
|
|
|
|
- DisposalManagementTableResponse,
|
|
|
|
|
- } from '@/types/disaster-control';
|
|
|
|
|
- import { getDisasterControlCollapseData } from '@/api/disaster-control';
|
|
|
|
|
|
|
+ import {
|
|
|
|
|
+ DEFAULT_PAGE_SIZE,
|
|
|
|
|
+ DISASTER_CONTROL_PAGE_SIZE_CONFIG,
|
|
|
|
|
+ PRIORITY_STATUS,
|
|
|
|
|
+ IS_LOSS,
|
|
|
|
|
+ FIX_STATUS,
|
|
|
|
|
+ } from '../constant';
|
|
|
|
|
+ import type { DisposalManagementCollapseListResponse, LossRecordTableResponse } from '@/types/disaster-control';
|
|
|
|
|
+ import { getDisasterControlCollapseData, getLossRecordTableData } from '@/api/disaster-control';
|
|
|
import {
|
|
import {
|
|
|
LOSS_RECORD_LOSS_RECORD_SEARCH_CONFIG,
|
|
LOSS_RECORD_LOSS_RECORD_SEARCH_CONFIG,
|
|
|
LOSS_RECORD_TABLE_COLUMNS,
|
|
LOSS_RECORD_TABLE_COLUMNS,
|
|
@@ -75,6 +115,7 @@
|
|
|
import useTableConfig from '@/hooks/useTableConfigHook';
|
|
import useTableConfig from '@/hooks/useTableConfigHook';
|
|
|
import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
|
|
import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
|
|
|
import type { DeptTree } from '@/types/dept/type';
|
|
import type { DeptTree } from '@/types/dept/type';
|
|
|
|
|
+ import { getPriorityStatus, getfixStatus } from '../util';
|
|
|
|
|
|
|
|
const firstLevelDepts = ref<DeptTree[]>([]);
|
|
const firstLevelDepts = ref<DeptTree[]>([]);
|
|
|
|
|
|
|
@@ -84,15 +125,15 @@
|
|
|
const collapseLoading = ref(false);
|
|
const collapseLoading = ref(false);
|
|
|
const { tableConfig } = useTableConfig(LOSS_RECORD_TABLE_COLUMNS, DISPOSAL_MANAGEMENT_TABLE_OPTIONS, false);
|
|
const { tableConfig } = useTableConfig(LOSS_RECORD_TABLE_COLUMNS, DISPOSAL_MANAGEMENT_TABLE_OPTIONS, false);
|
|
|
const searchData = reactive({
|
|
const searchData = reactive({
|
|
|
- handleDeptIds: '',
|
|
|
|
|
|
|
+ handleDeptIds: [],
|
|
|
fixStatus: '',
|
|
fixStatus: '',
|
|
|
});
|
|
});
|
|
|
const handleSearch = () => {
|
|
const handleSearch = () => {
|
|
|
- console.log(searchData);
|
|
|
|
|
|
|
+ getDisposalTableData();
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
const taskIds = ref<number[]>([]);
|
|
const taskIds = ref<number[]>([]);
|
|
|
- const collapseList = ref<DisposalManagementCollapseListResponse<DisposalManagementTableResponse>[]>([]);
|
|
|
|
|
|
|
+ const collapseList = ref<DisposalManagementCollapseListResponse<LossRecordTableResponse>[]>([]);
|
|
|
const getDisposalData = async () => {
|
|
const getDisposalData = async () => {
|
|
|
collapseLoading.value = true;
|
|
collapseLoading.value = true;
|
|
|
const res = await getDisasterControlCollapseData({
|
|
const res = await getDisasterControlCollapseData({
|
|
@@ -105,7 +146,7 @@
|
|
|
tableData: [
|
|
tableData: [
|
|
|
{
|
|
{
|
|
|
handleTaskId: item.id,
|
|
handleTaskId: item.id,
|
|
|
- disasterReportTaskInfoList: [],
|
|
|
|
|
|
|
+ disasterReportRecordDetailList: [],
|
|
|
},
|
|
},
|
|
|
],
|
|
],
|
|
|
}));
|
|
}));
|
|
@@ -114,36 +155,41 @@
|
|
|
collapseLoading.value = false;
|
|
collapseLoading.value = false;
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
- // const getDisposalTableData = async () => {
|
|
|
|
|
- // tableConfig.loading = true;
|
|
|
|
|
- // const res = await getLossRecordTableData({
|
|
|
|
|
- // handleTaskIds: taskIds.value,
|
|
|
|
|
- // ...searchData,
|
|
|
|
|
- // });
|
|
|
|
|
- // collapseList.value.forEach((item) => {
|
|
|
|
|
- // item.tableData = res;
|
|
|
|
|
- // });
|
|
|
|
|
- // tableConfig.loading = false;
|
|
|
|
|
- // };
|
|
|
|
|
- const handleSizeChange = (size: number) => {
|
|
|
|
|
|
|
+ const getDisposalTableData = async () => {
|
|
|
|
|
+ tableConfig.loading = true;
|
|
|
|
|
+ const res = await getLossRecordTableData({
|
|
|
|
|
+ handleTaskIds: taskIds.value,
|
|
|
|
|
+ ...searchData,
|
|
|
|
|
+ });
|
|
|
|
|
+ collapseList.value.forEach((item) => {
|
|
|
|
|
+ item.tableData = res.filter((tableItem) => tableItem.handleTaskId === item.id);
|
|
|
|
|
+ });
|
|
|
|
|
+ tableConfig.loading = false;
|
|
|
|
|
+ };
|
|
|
|
|
+ const handleSizeChange = async (size: number) => {
|
|
|
pageSize.value = size;
|
|
pageSize.value = size;
|
|
|
|
|
+ await getDisposalData();
|
|
|
|
|
+ await getDisposalTableData();
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
- const handleCurrentChange = (page: number) => {
|
|
|
|
|
|
|
+ const handleCurrentChange = async (page: number) => {
|
|
|
currentPage.value = page;
|
|
currentPage.value = page;
|
|
|
|
|
+ await getDisposalData();
|
|
|
|
|
+ await getDisposalTableData();
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
onMounted(async () => {
|
|
onMounted(async () => {
|
|
|
const result = await getAllDepartments();
|
|
const result = await getAllDepartments();
|
|
|
firstLevelDepts.value = formatDeptTree(result);
|
|
firstLevelDepts.value = formatDeptTree(result);
|
|
|
await getDisposalData();
|
|
await getDisposalData();
|
|
|
- // await getDisposalTableData();
|
|
|
|
|
|
|
+ await getDisposalTableData();
|
|
|
});
|
|
});
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
|
@use '@/views/disaster/style/disaster.scss' as *;
|
|
@use '@/views/disaster/style/disaster.scss' as *;
|
|
|
@use '../style/collapse.scss' as *;
|
|
@use '../style/collapse.scss' as *;
|
|
|
|
|
+ @use '../style/common.scss' as *;
|
|
|
$collapse-container-height: calc(60vh - 20cpx);
|
|
$collapse-container-height: calc(60vh - 20cpx);
|
|
|
.collapse-container {
|
|
.collapse-container {
|
|
|
height: $collapse-container-height;
|
|
height: $collapse-container-height;
|
|
@@ -154,4 +200,10 @@
|
|
|
color: #999;
|
|
color: #999;
|
|
|
font-weight: 400;
|
|
font-weight: 400;
|
|
|
}
|
|
}
|
|
|
|
|
+ .affected-items-container {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ overflow: hidden;
|
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
|
+ white-space: nowrap;
|
|
|
|
|
+ }
|
|
|
</style>
|
|
</style>
|