|
@@ -57,11 +57,11 @@
|
|
|
<div class="stat-label">事件总数</div>
|
|
<div class="stat-label">事件总数</div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="stat-card stat-card-warning">
|
|
<div class="stat-card stat-card-warning">
|
|
|
- <div class="stat-value">{{ stats.totalLoss }}</div>
|
|
|
|
|
|
|
+ <div class="stat-value">{{ formatLoss(stats.totalLoss) }}</div>
|
|
|
<div class="stat-label">直接经济损失(万元)</div>
|
|
<div class="stat-label">直接经济损失(万元)</div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="stat-card stat-card-info">
|
|
<div class="stat-card stat-card-info">
|
|
|
- <div class="stat-value">{{ stats.avgLoss }}</div>
|
|
|
|
|
|
|
+ <div class="stat-value">{{ formatLoss(stats.avgLoss) }}</div>
|
|
|
<div class="stat-label">平均损失(万元)</div>
|
|
<div class="stat-label">平均损失(万元)</div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="stat-card stat-card-danger">
|
|
<div class="stat-card stat-card-danger">
|
|
@@ -73,43 +73,103 @@
|
|
|
<!-- 事件列表表格 -->
|
|
<!-- 事件列表表格 -->
|
|
|
<el-card shadow="hover">
|
|
<el-card shadow="hover">
|
|
|
<template #header>
|
|
<template #header>
|
|
|
- <div class="panel-title">事件列表 <span class="total-count">共{{ filteredData.length }}条数据</span></div>
|
|
|
|
|
|
|
+ <div class="panel-title">事件列表 <span class="total-count">共{{ total }}条数据</span>
|
|
|
|
|
+ <el-button type="primary" size="small" style="margin-left:auto" @click="openAdd">新增事件</el-button>
|
|
|
|
|
+ </div>
|
|
|
</template>
|
|
</template>
|
|
|
- <el-table :data="pagedData" border stripe style="width: 100%" size="default">
|
|
|
|
|
- <el-table-column prop="name" label="事件名称" min-width="180" show-overflow-tooltip />
|
|
|
|
|
- <el-table-column prop="type" label="类型" width="120" />
|
|
|
|
|
- <el-table-column prop="time" label="时间" width="140" />
|
|
|
|
|
|
|
+ <el-table :data="tableData" border stripe style="width: 100%" size="default">
|
|
|
|
|
+ <el-table-column prop="eventName" label="事件名称" min-width="180" show-overflow-tooltip />
|
|
|
|
|
+ <el-table-column prop="eventType" label="类型" width="100" />
|
|
|
|
|
+ <el-table-column prop="happenTime" label="发生时间" width="160" />
|
|
|
<el-table-column prop="level" label="等级" width="100">
|
|
<el-table-column prop="level" label="等级" width="100">
|
|
|
<template #default="{ row }">
|
|
<template #default="{ row }">
|
|
|
<el-tag :type="levelTagType(row.level)" size="small" effect="dark">{{ row.level }}</el-tag>
|
|
<el-tag :type="levelTagType(row.level)" size="small" effect="dark">{{ row.level }}</el-tag>
|
|
|
</template>
|
|
</template>
|
|
|
</el-table-column>
|
|
</el-table-column>
|
|
|
- <el-table-column prop="region" label="地域" width="110" />
|
|
|
|
|
- <el-table-column prop="department" label="责任部门" width="130" />
|
|
|
|
|
- <el-table-column prop="loss" label="损失(万元)" width="110" align="right" />
|
|
|
|
|
|
|
+ <el-table-column prop="region" label="地域" width="90" />
|
|
|
|
|
+ <el-table-column prop="department" label="责任部门" width="110" />
|
|
|
|
|
+ <el-table-column prop="status" label="状态" width="90">
|
|
|
|
|
+ <template #default="{ row }">
|
|
|
|
|
+ <el-tag :type="statusTagType(row.status)" size="small">{{ row.status }}</el-tag>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ <el-table-column label="损失(万元)" width="110" align="right">
|
|
|
|
|
+ <template #default="{ row }">
|
|
|
|
|
+ {{ formatLoss(row.lossAmount) }}
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ <el-table-column label="操作" width="140" align="center">
|
|
|
|
|
+ <template #default="{ row }">
|
|
|
|
|
+ <el-button link type="primary" @click="openEdit(row)">编辑</el-button>
|
|
|
|
|
+ <el-button link type="danger" @click="handleDelete(row)">删除</el-button>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
</el-table>
|
|
</el-table>
|
|
|
<el-pagination
|
|
<el-pagination
|
|
|
v-model:current-page="pageNum"
|
|
v-model:current-page="pageNum"
|
|
|
v-model:page-size="pageSize"
|
|
v-model:page-size="pageSize"
|
|
|
- :total="filteredData.length"
|
|
|
|
|
|
|
+ :total="total"
|
|
|
layout="total, prev, pager, next, sizes"
|
|
layout="total, prev, pager, next, sizes"
|
|
|
:page-sizes="[10, 20, 50]"
|
|
:page-sizes="[10, 20, 50]"
|
|
|
style="margin-top: 16px; justify-content: flex-end"
|
|
style="margin-top: 16px; justify-content: flex-end"
|
|
|
|
|
+ @current-change="loadData"
|
|
|
|
|
+ @size-change="handleSizeChange"
|
|
|
/>
|
|
/>
|
|
|
</el-card>
|
|
</el-card>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 新增/编辑弹窗 -->
|
|
|
|
|
+ <el-dialog v-model="dialogVisible" :title="dialogTitle" width="560px" destroy-on-close>
|
|
|
|
|
+ <el-form ref="formRef" :model="form" :rules="formRules" label-width="100px">
|
|
|
|
|
+ <el-form-item label="事件名称" prop="eventName">
|
|
|
|
|
+ <el-input v-model="form.eventName" placeholder="请输入事件名称" />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item label="事件类型" prop="eventType">
|
|
|
|
|
+ <el-select v-model="form.eventType" placeholder="请选择" style="width:100%">
|
|
|
|
|
+ <el-option v-for="item in eventTypeOptions.filter(o => o !== '全部')" :key="item" :label="item" :value="item" />
|
|
|
|
|
+ </el-select>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item label="发生时间" prop="eventTime">
|
|
|
|
|
+ <el-date-picker v-model="form.eventTime" type="date" value-format="YYYY-MM-DD" style="width:100%" />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item label="事件等级" prop="eventLevel">
|
|
|
|
|
+ <el-select v-model="form.eventLevel" placeholder="请选择" style="width:100%">
|
|
|
|
|
+ <el-option v-for="item in eventLevelOptions.filter(o => o !== '全部')" :key="item" :label="item" :value="item" />
|
|
|
|
|
+ </el-select>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item label="地域" prop="region">
|
|
|
|
|
+ <el-select v-model="form.region" placeholder="请选择" style="width:100%">
|
|
|
|
|
+ <el-option v-for="item in regionOptions.filter(o => o !== '全部')" :key="item" :label="item" :value="item" />
|
|
|
|
|
+ </el-select>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item label="责任部门" prop="department">
|
|
|
|
|
+ <el-select v-model="form.department" placeholder="请选择" style="width:100%">
|
|
|
|
|
+ <el-option v-for="item in departmentOptions.filter(o => o !== '全部')" :key="item" :label="item" :value="item" />
|
|
|
|
|
+ </el-select>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item label="损失(万元)" prop="lossAmount">
|
|
|
|
|
+ <el-input-number v-model="form.lossAmount" :min="0" :precision="2" style="width:100%" />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-form>
|
|
|
|
|
+ <template #footer>
|
|
|
|
|
+ <el-button @click="dialogVisible = false">取消</el-button>
|
|
|
|
|
+ <el-button type="primary" @click="submitForm">确定</el-button>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
</div>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
|
-import { ref, reactive, computed } from 'vue'
|
|
|
|
|
|
|
+import { ref, reactive } from 'vue'
|
|
|
|
|
+import { ElMessage, ElMessageBox } from 'element-plus'
|
|
|
|
|
+import { getEventPage, getEventStats, saveEventReport, updateEventInfo, deleteEventInfo } from '@/api/dispatch'
|
|
|
|
|
|
|
|
-// 查询条件选项
|
|
|
|
|
-const eventTypeOptions = ['全部', '自然灾害', '事故灾难', '公共卫生', '社会安全', '管网泄漏', '管道堵塞']
|
|
|
|
|
|
|
+// 查询条件选项(与应急预案选择/统一事件口径一致)
|
|
|
|
|
+const eventTypeOptions = ['全部', '排水', '供水', '燃气', '其他']
|
|
|
const eventLevelOptions = ['全部', '一般', '较大', '重大', '特别重大']
|
|
const eventLevelOptions = ['全部', '一般', '较大', '重大', '特别重大']
|
|
|
-const regionOptions = ['全部', '太常片区', '城东片区', '城南片区', '城北片区']
|
|
|
|
|
-const departmentOptions = ['全部', '应急管理局', '消防救援局', '市政管理局', '水务局']
|
|
|
|
|
|
|
+const regionOptions = ['全部', '城南', '城北', '太常']
|
|
|
|
|
+const departmentOptions = ['全部', '供水局', '燃气公司', '排水公司']
|
|
|
const lossRangeOptions = ['全部', '100万以下', '100-500万', '500-1000万', '1000万以上']
|
|
const lossRangeOptions = ['全部', '100万以下', '100-500万', '500-1000万', '1000万以上']
|
|
|
|
|
|
|
|
// 查询表单
|
|
// 查询表单
|
|
@@ -122,77 +182,136 @@ const queryForm = reactive({
|
|
|
lossRange: ''
|
|
lossRange: ''
|
|
|
})
|
|
})
|
|
|
|
|
|
|
|
-// Mock 数据
|
|
|
|
|
-const allData = ref([
|
|
|
|
|
- { id: 1, name: '太常片区暴雨内涝事件', type: '自然灾害', time: '2025-06-15', level: '重大', region: '太常片区', department: '应急管理局', loss: 860 },
|
|
|
|
|
- { id: 2, name: '城东主管道泄漏事故', type: '管网泄漏', time: '2025-05-22', level: '较大', region: '城东片区', department: '水务局', loss: 320 },
|
|
|
|
|
- { id: 3, name: '城南化工厂氯气泄漏', type: '事故灾难', time: '2025-04-10', level: '特别重大', region: '城南片区', department: '消防救援局', loss: 1580 },
|
|
|
|
|
- { id: 4, name: '城北管道堵塞溢流', type: '管道堵塞', time: '2025-07-03', level: '一般', region: '城北片区', department: '市政管理局', loss: 45 },
|
|
|
|
|
- { id: 5, name: '太常片区燃气管道破裂', type: '管网泄漏', time: '2025-03-18', level: '重大', region: '太常片区', department: '应急管理局', loss: 720 },
|
|
|
|
|
- { id: 6, name: '城东餐饮食物中毒', type: '公共卫生', time: '2025-08-01', level: '较大', region: '城东片区', department: '应急管理局', loss: 180 },
|
|
|
|
|
- { id: 7, name: '城南地铁施工坍塌', type: '事故灾难', time: '2025-02-14', level: '重大', region: '城南片区', department: '消防救援局', loss: 950 },
|
|
|
|
|
- { id: 8, name: '城北片区群体性事件', type: '社会安全', time: '2025-09-20', level: '一般', region: '城北片区', department: '应急管理局', loss: 60 },
|
|
|
|
|
- { id: 9, name: '太常片区排水管网堵塞', type: '管道堵塞', time: '2025-05-08', level: '较大', region: '太常片区', department: '市政管理局', loss: 260 },
|
|
|
|
|
- { id: 10, name: '城东供水主管爆裂', type: '管网泄漏', time: '2025-01-25', level: '特别重大', region: '城东片区', department: '水务局', loss: 2100 },
|
|
|
|
|
- { id: 11, name: '城南片区暴雨内涝', type: '自然灾害', time: '2025-07-18', level: '较大', region: '城南片区', department: '应急管理局', loss: 480 },
|
|
|
|
|
- { id: 12, name: '城北燃气泄漏事故', type: '管网泄漏', time: '2025-04-28', level: '一般', region: '城北片区', department: '消防救援局', loss: 88 },
|
|
|
|
|
- { id: 13, name: '太常片区路面塌陷', type: '事故灾难', time: '2025-06-30', level: '重大', region: '太常片区', department: '市政管理局', loss: 680 },
|
|
|
|
|
- { id: 14, name: '城东排水管道堵塞', type: '管道堵塞', time: '2025-03-05', level: '一般', region: '城东片区', department: '水务局', loss: 35 },
|
|
|
|
|
- { id: 15, name: '城南供水管网破裂', type: '管网泄漏', time: '2025-08-12', level: '重大', region: '城南片区', department: '水务局', loss: 780 },
|
|
|
|
|
- { id: 16, name: '城北片区洪涝灾害', type: '自然灾害', time: '2025-09-05', level: '特别重大', region: '城北片区', department: '应急管理局', loss: 1850 }
|
|
|
|
|
-])
|
|
|
|
|
-
|
|
|
|
|
-// 分页
|
|
|
|
|
|
|
+// 列表数据(接口分页)
|
|
|
|
|
+const tableData = ref([])
|
|
|
|
|
+const total = ref(0)
|
|
|
const pageNum = ref(1)
|
|
const pageNum = ref(1)
|
|
|
const pageSize = ref(10)
|
|
const pageSize = ref(10)
|
|
|
|
|
|
|
|
-// 根据条件筛选
|
|
|
|
|
-const filteredData = computed(() => {
|
|
|
|
|
- let data = [...allData.value]
|
|
|
|
|
- if (queryForm.eventType && queryForm.eventType !== '全部') {
|
|
|
|
|
- data = data.filter(d => d.type === queryForm.eventType)
|
|
|
|
|
- }
|
|
|
|
|
- if (queryForm.eventTime) {
|
|
|
|
|
- data = data.filter(d => d.time === queryForm.eventTime)
|
|
|
|
|
- }
|
|
|
|
|
- if (queryForm.eventLevel && queryForm.eventLevel !== '全部') {
|
|
|
|
|
- data = data.filter(d => d.level === queryForm.eventLevel)
|
|
|
|
|
- }
|
|
|
|
|
- if (queryForm.region && queryForm.region !== '全部') {
|
|
|
|
|
- data = data.filter(d => d.region === queryForm.region)
|
|
|
|
|
- }
|
|
|
|
|
- if (queryForm.department && queryForm.department !== '全部') {
|
|
|
|
|
- data = data.filter(d => d.department === queryForm.department)
|
|
|
|
|
- }
|
|
|
|
|
- if (queryForm.lossRange && queryForm.lossRange !== '全部') {
|
|
|
|
|
- data = data.filter(d => {
|
|
|
|
|
- switch (queryForm.lossRange) {
|
|
|
|
|
- case '100万以下': return d.loss < 100
|
|
|
|
|
- case '100-500万': return d.loss >= 100 && d.loss < 500
|
|
|
|
|
- case '500-1000万': return d.loss >= 500 && d.loss < 1000
|
|
|
|
|
- case '1000万以上': return d.loss >= 1000
|
|
|
|
|
- default: return true
|
|
|
|
|
|
|
+// 统计数据(接口计算)
|
|
|
|
|
+const stats = ref({ totalEvents: 0, totalLoss: 0, avgLoss: 0, majorEvents: 0 })
|
|
|
|
|
+
|
|
|
|
|
+// 新增/编辑弹窗状态
|
|
|
|
|
+const dialogVisible = ref(false)
|
|
|
|
|
+const dialogTitle = ref('')
|
|
|
|
|
+const formRef = ref(null)
|
|
|
|
|
+const form = reactive({ id: null, eventName: '', eventType: '', eventTime: '', eventLevel: '', region: '', department: '', lossAmount: undefined })
|
|
|
|
|
+
|
|
|
|
|
+const formRules = {
|
|
|
|
|
+ eventName: [{ required: true, message: '请输入事件名称', trigger: 'blur' }],
|
|
|
|
|
+ eventType: [{ required: true, message: '请选择事件类型', trigger: 'change' }],
|
|
|
|
|
+ eventTime: [{ required: true, message: '请选择发生时间', trigger: 'change' }],
|
|
|
|
|
+ eventLevel: [{ required: true, message: '请选择事件等级', trigger: 'change' }],
|
|
|
|
|
+ region: [{ required: true, message: '请选择地域', trigger: 'change' }],
|
|
|
|
|
+ department: [{ required: true, message: '请选择责任部门', trigger: 'change' }],
|
|
|
|
|
+ lossAmount: [{ required: true, message: '请输入损失金额', trigger: 'blur' }]
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 损失金额格式化(保留2位小数)
|
|
|
|
|
+const formatLoss = (val) => {
|
|
|
|
|
+ const num = Number(val)
|
|
|
|
|
+ return isNaN(num) ? '-' : num.toFixed(2)
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 打开新增
|
|
|
|
|
+const openAdd = () => {
|
|
|
|
|
+ Object.assign(form, { id: null, eventName: '', eventType: '', eventTime: '', eventLevel: '', region: '', department: '', lossAmount: undefined })
|
|
|
|
|
+ dialogTitle.value = '新增事件记录'
|
|
|
|
|
+ dialogVisible.value = true
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 打开编辑
|
|
|
|
|
+const openEdit = (row) => {
|
|
|
|
|
+ Object.assign(form, {
|
|
|
|
|
+ id: row.id,
|
|
|
|
|
+ eventName: row.eventName,
|
|
|
|
|
+ eventType: row.eventType,
|
|
|
|
|
+ eventTime: row.happenTime ? String(row.happenTime).slice(0, 10) : '',
|
|
|
|
|
+ eventLevel: row.level,
|
|
|
|
|
+ region: row.region,
|
|
|
|
|
+ department: row.department,
|
|
|
|
|
+ lossAmount: Number(row.lossAmount)
|
|
|
|
|
+ })
|
|
|
|
|
+ dialogTitle.value = '编辑事件记录'
|
|
|
|
|
+ dialogVisible.value = true
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 提交新增/修改(统一事件:新增即入主表参与闭环流转)
|
|
|
|
|
+const submitForm = () => {
|
|
|
|
|
+ formRef.value.validate(async (valid) => {
|
|
|
|
|
+ if (!valid) return
|
|
|
|
|
+ const payload = {
|
|
|
|
|
+ eventName: form.eventName,
|
|
|
|
|
+ eventType: form.eventType,
|
|
|
|
|
+ happenTime: form.eventTime ? form.eventTime + ' 00:00:00' : null,
|
|
|
|
|
+ level: form.eventLevel,
|
|
|
|
|
+ region: form.region,
|
|
|
|
|
+ department: form.department,
|
|
|
|
|
+ lossAmount: form.lossAmount
|
|
|
|
|
+ }
|
|
|
|
|
+ try {
|
|
|
|
|
+ if (form.id) {
|
|
|
|
|
+ await updateEventInfo({ id: form.id, ...payload })
|
|
|
|
|
+ ElMessage.success('修改成功')
|
|
|
|
|
+ } else {
|
|
|
|
|
+ await saveEventReport(payload)
|
|
|
|
|
+ ElMessage.success('新增成功')
|
|
|
}
|
|
}
|
|
|
- })
|
|
|
|
|
- }
|
|
|
|
|
- return data
|
|
|
|
|
-})
|
|
|
|
|
|
|
+ dialogVisible.value = false
|
|
|
|
|
+ loadData()
|
|
|
|
|
+ } catch (e) {
|
|
|
|
|
+ ElMessage.error(form.id ? '修改失败' : '新增失败')
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+}
|
|
|
|
|
|
|
|
-// 分页后数据
|
|
|
|
|
-const pagedData = computed(() => {
|
|
|
|
|
- const start = (pageNum.value - 1) * pageSize.value
|
|
|
|
|
- return filteredData.value.slice(start, start + pageSize.value)
|
|
|
|
|
-})
|
|
|
|
|
|
|
+// 删除
|
|
|
|
|
+const handleDelete = (row) => {
|
|
|
|
|
+ ElMessageBox.confirm(`确定删除事件「${row.eventName}」吗?`, '删除确认', {
|
|
|
|
|
+ confirmButtonText: '确定',
|
|
|
|
|
+ cancelButtonText: '取消',
|
|
|
|
|
+ type: 'warning'
|
|
|
|
|
+ }).then(async () => {
|
|
|
|
|
+ try {
|
|
|
|
|
+ await deleteEventInfo(row.id)
|
|
|
|
|
+ ElMessage.success('删除成功')
|
|
|
|
|
+ loadData()
|
|
|
|
|
+ } catch (e) {
|
|
|
|
|
+ ElMessage.error('删除失败')
|
|
|
|
|
+ }
|
|
|
|
|
+ }).catch(() => {})
|
|
|
|
|
+}
|
|
|
|
|
|
|
|
-// 统计数据
|
|
|
|
|
-const stats = computed(() => {
|
|
|
|
|
- const data = filteredData.value
|
|
|
|
|
- const totalEvents = data.length
|
|
|
|
|
- const totalLoss = data.reduce((sum, d) => sum + d.loss, 0)
|
|
|
|
|
- const avgLoss = totalEvents > 0 ? (totalLoss / totalEvents).toFixed(1) : 0
|
|
|
|
|
- const majorEvents = data.filter(d => d.level === '重大' || d.level === '特别重大').length
|
|
|
|
|
- return { totalEvents, totalLoss, avgLoss, majorEvents }
|
|
|
|
|
-})
|
|
|
|
|
|
|
+// 构建查询参数(空值与'全部'不传)
|
|
|
|
|
+const buildParams = () => {
|
|
|
|
|
+ const params = {}
|
|
|
|
|
+ if (queryForm.eventType && queryForm.eventType !== '全部') params.eventType = queryForm.eventType
|
|
|
|
|
+ if (queryForm.eventTime) {
|
|
|
|
|
+ params.startDate = queryForm.eventTime
|
|
|
|
|
+ params.endDate = queryForm.eventTime
|
|
|
|
|
+ }
|
|
|
|
|
+ if (queryForm.eventLevel && queryForm.eventLevel !== '全部') params.level = queryForm.eventLevel
|
|
|
|
|
+ if (queryForm.region && queryForm.region !== '全部') params.region = queryForm.region
|
|
|
|
|
+ if (queryForm.department && queryForm.department !== '全部') params.department = queryForm.department
|
|
|
|
|
+ if (queryForm.lossRange && queryForm.lossRange !== '全部') params.lossRange = queryForm.lossRange
|
|
|
|
|
+ return params
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 加载列表与统计(并行请求)
|
|
|
|
|
+const loadData = async () => {
|
|
|
|
|
+ try {
|
|
|
|
|
+ const params = buildParams()
|
|
|
|
|
+ const [pageRes, statsRes] = await Promise.all([
|
|
|
|
|
+ getEventPage(pageNum.value, pageSize.value, params),
|
|
|
|
|
+ getEventStats(params)
|
|
|
|
|
+ ])
|
|
|
|
|
+ tableData.value = pageRes.data?.records || []
|
|
|
|
|
+ total.value = pageRes.data?.total || 0
|
|
|
|
|
+ stats.value = statsRes.data || { totalEvents: 0, totalLoss: 0, avgLoss: 0, majorEvents: 0 }
|
|
|
|
|
+ } catch (e) {
|
|
|
|
|
+ ElMessage.error('查询失败')
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
|
|
|
// 等级tag颜色
|
|
// 等级tag颜色
|
|
|
const levelTagType = (level) => {
|
|
const levelTagType = (level) => {
|
|
@@ -200,9 +319,22 @@ const levelTagType = (level) => {
|
|
|
return map[level] || 'info'
|
|
return map[level] || 'info'
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+// 状态tag颜色
|
|
|
|
|
+const statusTagType = (status) => {
|
|
|
|
|
+ const map = { '待受理': 'warning', '待核实': 'warning', '已核实': 'primary', '处置中': 'primary', '已解除': 'warning', '已关闭': 'success', '不实事件': 'info' }
|
|
|
|
|
+ return map[status] || 'info'
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
// 查询
|
|
// 查询
|
|
|
const handleQuery = () => {
|
|
const handleQuery = () => {
|
|
|
pageNum.value = 1
|
|
pageNum.value = 1
|
|
|
|
|
+ loadData()
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 每页条数变化
|
|
|
|
|
+const handleSizeChange = () => {
|
|
|
|
|
+ pageNum.value = 1
|
|
|
|
|
+ loadData()
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
// 重置
|
|
// 重置
|
|
@@ -211,7 +343,11 @@ const handleReset = () => {
|
|
|
eventType: '', eventTime: '', eventLevel: '', region: '', department: '', lossRange: ''
|
|
eventType: '', eventTime: '', eventLevel: '', region: '', department: '', lossRange: ''
|
|
|
})
|
|
})
|
|
|
pageNum.value = 1
|
|
pageNum.value = 1
|
|
|
|
|
+ loadData()
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
|
|
+// 初始化查询
|
|
|
|
|
+loadData()
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped lang="scss">
|
|
<style scoped lang="scss">
|