|
@@ -10,10 +10,10 @@
|
|
|
<el-select v-model="queryParams.eventType" placeholder="全部" clearable>
|
|
|
<el-option label="全部" value=""></el-option>
|
|
|
<el-option
|
|
|
- v-for="item in data.eventTypeSelection"
|
|
|
- :key="item.dictValue"
|
|
|
- :label="item.dictLabel"
|
|
|
- :value="item.dictValue"
|
|
|
+ v-for="item in mm_event_type"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
@@ -23,10 +23,10 @@
|
|
|
<el-select v-model="queryParams.eventLevel" placeholder="全部" clearable>
|
|
|
<el-option label="全部" value=""></el-option>
|
|
|
<el-option
|
|
|
- v-for="item in data.eventLevelSelection"
|
|
|
- :key="item.dictValue"
|
|
|
- :label="item.dictLabel"
|
|
|
- :value="item.dictValue"
|
|
|
+ v-for="item in mm_event_level"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
@@ -36,10 +36,10 @@
|
|
|
<el-select v-model="queryParams.eventStatus" placeholder="全部" clearable>
|
|
|
<el-option label="全部" value=""></el-option>
|
|
|
<el-option
|
|
|
- v-for="item in data.eventStatusSelection"
|
|
|
- :key="item.dictValue"
|
|
|
- :label="item.dictLabel"
|
|
|
- :value="item.dictValue"
|
|
|
+ v-for="item in mm_event_state"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
@@ -48,7 +48,7 @@
|
|
|
<el-form-item label="行政区划" prop="regionCode">
|
|
|
<el-select v-model="queryParams.regionCode" placeholder="全部" clearable>
|
|
|
<el-option label="全部" value=""></el-option>
|
|
|
- <el-option v-for="item in data.regionSelection" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue"></el-option>
|
|
|
+ <el-option v-for="item in region" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue"></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
@@ -83,16 +83,27 @@
|
|
|
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete(selectedRow)">删除事件 </el-button>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
-
|
|
|
- <!-- 表格组w件 -->
|
|
|
+ <!-- 表格组件 -->
|
|
|
<el-table v-loading="loading" :data="eventList" @selection-change="handleSelectionChange">
|
|
|
<el-table-column type="selection" width="55" align="center" />
|
|
|
<el-table-column label="事件编号" align="center" prop="eventId" />
|
|
|
<el-table-column label="事件标题" align="center" prop="eventTitle" />
|
|
|
- <el-table-column label="事件类型" align="center" prop="eventType" />
|
|
|
- <el-table-column label="事件等级" align="center" prop="eventLevel" />
|
|
|
+ <el-table-column label="事件类型" align="center" prop="eventType">
|
|
|
+ <template #default="scope">
|
|
|
+ <dict-tag :options="mm_event_type" :value="scope.row.eventType" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="事件等级" align="center" prop="eventLevel">
|
|
|
+ <template #default="scope">
|
|
|
+ <dict-tag :options="mm_event_level" :value="scope.row.eventLevel" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column label="事件地点" align="center" prop="address" />
|
|
|
- <el-table-column label="事件状态" align="center" prop="eventStatus" />
|
|
|
+ <el-table-column label="事件状态" align="center" prop="eventStatus">
|
|
|
+ <template #default="scope">
|
|
|
+ <dict-tag :options="mm_event_state" :value="scope.row.eventStatus" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column label="事件时间" align="center" prop="eventTime" />
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
<template #default="scope">
|
|
@@ -112,31 +123,30 @@
|
|
|
<pagination v-show="total > 0" v-model:page="queryParams.page" v-model:limit="queryParams.pageSize" :total="total" @pagination="getList" />
|
|
|
|
|
|
<!-- 新增/修改弹窗 -->
|
|
|
- <el-dialog v-model="dialog.visible" :title="dialog.title" width="750px" append-to-body>
|
|
|
+ <el-dialog v-model="dialog.visible" :title="dialog.title" width="650px" append-to-body>
|
|
|
<el-form ref="eventFormRef" :model="form" :rules="rules" label-width="80px">
|
|
|
-
|
|
|
<el-form-item label="事件标题" prop="eventTitle">
|
|
|
<el-input v-model="form.eventTitle" placeholder="请输入事件标题" />
|
|
|
</el-form-item>
|
|
|
-
|
|
|
<el-form-item label="事件类型" prop="eventType">
|
|
|
<el-select v-model="form.eventType" placeholder="请选择事件类型" clearable>
|
|
|
- <el-option v-for="item in data.eventTypeSelection" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue"></el-option>
|
|
|
+ <el-option v-for="item in mm_event_type" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
-
|
|
|
<el-form-item label="事件等级" prop="eventLevel">
|
|
|
- <el-select v-model="form.eventLevel" placeholder="请选择事件等级" clearable style="width:calc(100% - 30px)">
|
|
|
- <el-option @click.native v-for="item in data.eventLevelSelection" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue"></el-option>
|
|
|
+ <el-select v-model="form.eventLevel" placeholder="请选择事件等级" clearable>
|
|
|
+ <el-option v-for="item in mm_event_level" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
|
|
</el-select>
|
|
|
- <el-icon @click="eventLevelDialogVisible = true" size="large" style="margin-left:8px"><WarningFilled /></el-icon>
|
|
|
</el-form-item>
|
|
|
-
|
|
|
<el-form-item label="事件状态" prop="eventStatus">
|
|
|
<el-select v-model="form.eventStatus" placeholder="请选择事件状态" clearable>
|
|
|
- <el-option v-for="item in data.eventStatusSelection" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue"></el-option>
|
|
|
+ <el-option v-for="item in mm_event_state" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="事件地点" prop="address">
|
|
|
+ <el-button type="primary" @click="openMapDialog">地图定位</el-button>
|
|
|
+ <el-input v-model="form.address" placeholder="请输入事件地点" readonly />
|
|
|
+ </el-form-item>
|
|
|
<el-form-item label="事发时间" prop="eventTime">
|
|
|
<el-date-picker v-model="form.eventTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="选择事发时间"></el-date-picker>
|
|
|
</el-form-item>
|
|
@@ -145,15 +155,6 @@
|
|
|
</el-form-item>
|
|
|
<el-form-item label="伤亡情况">
|
|
|
<el-row :gutter="10">
|
|
|
- <el-col :span="3">
|
|
|
- <el-switch
|
|
|
- size="large"
|
|
|
- v-model="form.casualty"
|
|
|
- inline-prompt
|
|
|
- active-text="已上报"
|
|
|
- inactive-text="未上报"
|
|
|
- />
|
|
|
- </el-col>
|
|
|
<el-col :span="6">
|
|
|
<el-input v-model="form.deaths" placeholder="死亡">
|
|
|
<template #suffix>人</template>
|
|
@@ -174,16 +175,8 @@
|
|
|
<el-form-item label="事件来源" prop="eventSource">
|
|
|
<el-input v-model="form.eventSource" placeholder="请输入事件来源" />
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="事件地点" prop="address">
|
|
|
- <el-input v-model="form.address" placeholder="请输入事件地点" readonly >
|
|
|
- <template #append>
|
|
|
- <el-button @click="openMapDialog">地图定位</el-button>
|
|
|
- </template>
|
|
|
- </el-input>
|
|
|
-
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="事件概要" prop="event_description">
|
|
|
- <el-input v-model="form.event_description" placeholder="请输入事件概要描述" type="textarea" :rows="5" />
|
|
|
+ <el-form-item label="事件描述" prop="eventDescription">
|
|
|
+ <el-input type="textarea" v-model="form.eventDescription" placeholder="请输入事件描述" />
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
<template #footer>
|
|
@@ -196,27 +189,15 @@
|
|
|
|
|
|
<!-- 地图弹窗 -->
|
|
|
<company-map v-model:visible="mapDialogVisible" :address="form.address" @confirm="handleMapChange"></company-map>
|
|
|
-
|
|
|
- <el-dialog v-model="eventLevelDialogVisible" title="突发事故分级标准" width="450px" append-to-body>
|
|
|
- <p><strong>一般突发事故:</strong>是指造成3人以下死亡(含失踪),或者10人以下重伤,或者1000万元以下直接经济损失,或产生一定社会影响的。</p>
|
|
|
- <p><strong>较大突发事故:</strong>是指造成3人以上10人以下死亡(含失踪),或者10人以上50人以下重伤,或者1000万元以上5000万元以下直接经济损失,或产生较大社会影响的。</p>
|
|
|
- <p><strong>重大突发事故:</strong>是指造成10人以上30人以下死亡(含失踪),或者50人以上100人以下重伤,或者5000万元以上1亿元以下直接经济损失,或产生重大社会影响的。</p>
|
|
|
- <p><strong>特别重大突发事故:</strong>是指造成30人以上死亡(含失踪),或者100人以上重伤(包括急性工业中毒),或者1亿元以上直接经济损失,或产生特别重大社会影响的。</p>
|
|
|
- <template #footer>
|
|
|
- <div class="dialog-footer">
|
|
|
- <el-button type="primary" @click="eventLevelDialogVisible = false">关闭</el-button>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
import { ref, reactive, toRefs, onMounted } from 'vue';
|
|
|
-import { getDicts } from '@/api/system/dict/data';
|
|
|
import { addEvent, getEvent } from '@/api/duty/eventing';
|
|
|
-import { WarningFilled } from '@element-plus/icons-vue';
|
|
|
|
|
|
+const proxy = getCurrentInstance()?.proxy;
|
|
|
+const { mm_event_type, mm_event_level, mm_event_state, region } = toRefs<any>(proxy?.useDict('mm_event_type', 'mm_event_level', 'mm_event_state', 'region'));
|
|
|
const router = useRouter();
|
|
|
const eventList = ref([]);
|
|
|
const buttonLoading = ref(false);
|
|
@@ -235,26 +216,25 @@ const dialog = reactive({
|
|
|
visible: false,
|
|
|
title: ''
|
|
|
});
|
|
|
-
|
|
|
+ // 表单初始数据
|
|
|
const initFormData = {
|
|
|
- eventId: '',
|
|
|
- eventTitle: '',
|
|
|
- eventType: '',
|
|
|
- eventLevel: '',
|
|
|
- eventStatus: '',
|
|
|
- address: '',
|
|
|
- longitude: '',
|
|
|
- latitude: '',
|
|
|
- eventTime: '',
|
|
|
- reportTime: '',
|
|
|
- casualty: false,
|
|
|
+ // eventId: '',
|
|
|
+ eventTitle: '', // 事件标题
|
|
|
+ eventType: '', // 事件类型
|
|
|
+ eventLevel: '', // 事件等级
|
|
|
+ eventStatus: '', // 事件状态
|
|
|
+ address: '', // 事件地点
|
|
|
+ longitude: '', // 经度
|
|
|
+ latitude: '', // 纬度
|
|
|
+ eventTime: '',// 事发时间
|
|
|
+ reportTime: '',// 上报时间
|
|
|
deaths: '',
|
|
|
injuries: '',
|
|
|
missing: '',
|
|
|
- eventSource: '',
|
|
|
- event_description: ''
|
|
|
+ eventSource: '', // 事件来源
|
|
|
+ eventDescription: '' // 事件描述
|
|
|
};
|
|
|
-
|
|
|
+// 表单数据
|
|
|
const data = reactive({
|
|
|
form: { ...initFormData },
|
|
|
queryParams: {
|
|
@@ -276,9 +256,8 @@ const data = reactive({
|
|
|
eventTime: [{ required: true, message: '事发时间不能为空', trigger: 'blur' }],
|
|
|
reportTime: [{ required: true, message: '上报时间不能为空', trigger: 'blur' }],
|
|
|
eventSource: [{ required: true, message: '事件来源不能为空', trigger: 'blur' }],
|
|
|
- event_description: [{ required: true, message: '事件概要不能为空', trigger: 'blur' }]
|
|
|
+ eventDescription: [{ required: true, message: '事件描述不能为空', trigger: 'blur' }]
|
|
|
},
|
|
|
- eventTypeSelection: [],
|
|
|
eventLevelSelection: [],
|
|
|
eventStatusSelection: [],
|
|
|
regionSelection: []
|
|
@@ -313,6 +292,7 @@ const handleQuery = () => {
|
|
|
getList();
|
|
|
};
|
|
|
|
|
|
+// 重置查询条件
|
|
|
const resetQuery = () => {
|
|
|
queryParams.value = { page: 1, pageSize: 10, eventType: '', eventLevel: '', eventStatus: '', eventTime: '', regionCode: '', keyword: '' };
|
|
|
handleQuery();
|
|
@@ -346,6 +326,8 @@ const submitForm = () => {
|
|
|
eventFormRef.value?.validate((valid) => {
|
|
|
if (valid) {
|
|
|
buttonLoading.value = true;
|
|
|
+ // 打印表单数据
|
|
|
+ console.log('表单数据', form.value);
|
|
|
addEvent(form.value)
|
|
|
.then(() => {
|
|
|
dialog.visible = false;
|
|
@@ -393,7 +375,6 @@ const handleView = (row) => {
|
|
|
|
|
|
// 地图定位
|
|
|
const mapDialogVisible = ref(false);
|
|
|
-const eventLevelDialogVisible = ref(false);
|
|
|
|
|
|
const openMapDialog = () => {
|
|
|
mapDialogVisible.value = true;
|
|
@@ -401,24 +382,13 @@ const openMapDialog = () => {
|
|
|
|
|
|
const handleMapChange = (data) => {
|
|
|
form.value.address = data.address;
|
|
|
- form.value.longitude = data.lnglat[0].toString();
|
|
|
- form.value.latitude = data.lnglat[1].toString();
|
|
|
- mapDialogVisible.value = false;
|
|
|
-};
|
|
|
-
|
|
|
-const confirmMapLocation = () => {
|
|
|
+ form.value.longitude = data.lnglat[0];
|
|
|
+ form.value.latitude = data.lnglat[1];
|
|
|
mapDialogVisible.value = false;
|
|
|
};
|
|
|
|
|
|
onMounted(() => {
|
|
|
getList();
|
|
|
- Promise.all([getDicts('mm_event_type'), getDicts('mm_event_level'), getDicts('mm_event_state'), getDicts('region')]).then(
|
|
|
- ([eventTypeRes, eventLevelRes, eventStatusRes, regionRes]) => {
|
|
|
- data.eventTypeSelection = eventTypeRes.data;
|
|
|
- data.eventLevelSelection = eventLevelRes.data;
|
|
|
- data.eventStatusSelection = eventStatusRes.data;
|
|
|
- data.regionSelection = regionRes.data;
|
|
|
- }
|
|
|
- );
|
|
|
});
|
|
|
+
|
|
|
</script>
|