From e2f129ee192ae3469848beeceac262b13ba8eacb Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: Wed, 14 Jun 2023 15:52:11 +0800
Subject: [PATCH] 新增页面和配置，对接口
---
src/views/Admin/history.vue | 278 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 278 insertions(+), 0 deletions(-)
diff --git a/src/views/Admin/history.vue b/src/views/Admin/history.vue
new file mode 100644
index 0000000..5b64b67
--- /dev/null
+++ b/src/views/Admin/history.vue
@@ -0,0 +1,278 @@
+<template>
+ <div class="inner">
+ <a-row type="flex" justify="space-between" style="margin-bottom: 20px">
+ <a-col :span="8">
+ <a-radio-group v-model="search.searchParams.emergType" @change="getData">
+ <a-radio-button :value="null">
+ 全部
+ </a-radio-button>
+ <a-radio-button :value="1">
+ 紧临
+ </a-radio-button>
+ <a-radio-button :value="2">
+ 常规
+ </a-radio-button>
+ </a-radio-group>
+ </a-col>
+ <a-col :span="16">
+ <a-row type="flex" justify="end" :gutter="12">
+ <a-col :span="8">
+ <a-range-picker
+ v-model="timeRange"
+ format="YYYY-MM-DD"
+ :placeholder="['开始时间', '结束时间']"
+ @change="timeChange"
+ @ok="timeOk"
+ style="width: 100%"
+ />
+ </a-col>
+ <a-col :span="4">
+ <a-button type="primary" @click="getData">查询</a-button>
+ <a-button style="margin-left: 12px" @click="resetSearch">重置</a-button>
+ </a-col>
+ </a-row>
+ </a-col>
+ </a-row>
+
+ <!-- 表格实体部分-->
+ <div class="table-cont">
+ <a-table :columns="columns" :data-source="data" bordered :pagination="pagination">
+ <template #index="text,record,index">
+ {{ index + 1 }}
+ </template>
+ <template #publishingTime="text">
+ {{ text }}
+ </template>
+ <template #publishingUnit="text">
+ {{ text }}
+ </template>
+ <template #disasterType="text">
+ {{ getRiskName(text) }}
+ </template>
+ <template #warningLevel="text">
+ <a-tag :color="text === 3 ? 'yellow' :text === 2? 'orange':text === 1?'red':'blue'">
+ {{ getLevelName(text) }}
+ </a-tag>
+ </template>
+ <template #attachment="text">
+ <a><b><a-icon type="paper-clip" /></b></a>
+ </template >
+ <template #responseSituation="text">
+ <a-tag :color="text === 3 ? 'red' :text === 2? 'green':text === 1?'orange':'blue'">
+ {{text == 1 ? '待叫应' : text == 2 ?'已叫应':text == 3 ?'超时未叫应' : ''}}
+ </a-tag>
+ </template>
+ <template #operation="text, record, index">
+ <a-button type="primary">叫应列表</a-button>
+ <a-button type="link" @click="openMod('view',record)">查看详情</a-button>
+ </template>
+ </a-table>
+ <msg-edit-mod ref="msgEdit" @refresh="getData"></msg-edit-mod>
+ </div>
+ <!-- 对话框 -->
+ <a-modal title="查看叫应详情"
+ okText="确认"
+ cancelText="关闭"
+ :visible="visible" :confirm-loading="confirmLoading" @ok="handleOk" @cancel="handleOk">
+ </a-modal>
+ </div>
+</template>
+<script>
+import {getHistoryRecord, getMsgRecord, getPublishRecord} from "@/api/list";
+import msgEditMod from "@/views/Admin/components/msgEditMod";
+import {getReviewDetailByWorker} from "@/api/review";
+const columns = [{
+ title: '序号',
+ dataIndex: 'index',
+ width: '8%',
+ scopedSlots: {
+ customRender: 'index'
+ }
+},
+ {
+ title: '发布时间',
+ dataIndex: 'publishingTime',
+ width: '15%',
+ scopedSlots: {
+ customRender: 'publishingTime'
+ } //设置定制化表格数据
+ },
+ {
+ title: '发布单位',
+ dataIndex: 'publishingUnit',
+ width: '12%',
+ },
+ {
+ title: '灾种',
+ dataIndex: 'disasterType',
+ width: '8%',
+ scopedSlots: {
+ customRender: 'disasterType'
+ }
+ },
+ {
+ title: '预警级别',
+ dataIndex: 'warningLevel',
+ scopedSlots: {
+ customRender: 'warningLevel'
+ }, //设置定制化表格数据
+ width: '8%',
+ },
+ {
+ title: '信息标题',
+ dataIndex: 'title',
+ width: '16%',
+ },
+ {
+ title: '附件',
+ dataIndex: 'attachment',
+ width: '6%',
+ scopedSlots: {
+ customRender: 'attachment'
+ },
+ },
+ {
+ title: '叫应情况',
+ dataIndex: 'responseSituation',
+ width: '10%',
+ scopedSlots: {
+ customRender: 'responseSituation'
+ }, //设置定制化表格数据
+ },
+ {
+ title: '操作',
+ dataIndex: 'operation',
+ scopedSlots: {
+ customRender: 'operation'
+ },
+ },
+];
+export default {
+ name: 'release',
+ components: { msgEditMod },
+ data() {
+ return {
+ search:{
+ pageIndex: 1,
+ pageSize: 10,
+ searchParams:{
+ emergType: null,
+ startTime: '',
+ endTime: ''
+ }
+ },
+ timeRange: [],
+ category: 'default',
+ data:[],
+ columns,
+ visible: false,
+ confirmLoading: false,
+ pagination: {
+ current: 1,
+ defaultCurrent: 1,
+ defaultPageSize: 10,
+ total: 0,
+ onChange: ( page, pageSize ) => this.onPageChange(page,pageSize),
+ showTotal: total => `共 ${total} 条`
+ },
+ riskOptions: [
+ {name: '地震',value: 1},
+ {name: '洪涝',value: 2},
+ {name: '气象',value: 3},
+ {name: '泥石流',value: 4},
+ {name: '水旱',value: 5},
+ {name: '森林草原火灾',value: 6}
+ ],
+ levelOptions: [
+ {name: '红色预警',value: 1},
+ {name: '橙色预警',value: 2},
+ {name: '黄色预警',value: 3},
+ {name: '蓝色预警',value: 4}
+ ]
+ }
+ },
+ created() {
+ const t = this
+ t.getData()
+ },
+ methods: {
+ async getData(){
+ const t = this
+ const res = await getHistoryRecord(this.search)
+ if(res.data.code == 100){
+ t.data = res.data.data
+ t.pagination.total = res.data.total
+ }else{
+ this.$message.error(res.data.msg)
+ }
+ },
+
+ openMod(type,data){
+ const t = this
+ getReviewDetailByWorker(data.id).then(res=>{
+ if(res.data.code == 100){
+ if(res.data.data){
+ t.$refs.msgEdit.openMod(type,res.data.data)
+ }else{
+ t.$message.error('查询信息详情失败')
+ }
+ }else{
+ this.$message.error(res.data.msg)
+ }
+ })
+ },
+
+ onPageChange(page, pageSize) {
+ const t= this
+ t.pagination.current = page
+ t.search.pageIndex = page
+ t.getData()
+ },
+
+ timeChange(value, dateString) {
+ const t = this
+ if(dateString){
+ t.search.searchParams.startTime = value[0].format('YYYY-MM-DD 00:00:00')
+ t.search.searchParams.endTime = value[1].format('YYYY-MM-DD 23:59:59')
+ }
+ },
+
+ timeOk(value) {
+ console.log('onOk: ', value);
+ },
+
+ resetSearch(){
+ const t = this
+ t.search = {
+ pageIndex: 1,
+ pageSize: 10,
+ searchParams:{
+ emergType: null,
+ startTime: '',
+ endTime: ''
+ }
+ }
+ t.timeRange = []
+ t.getData()
+ },
+
+ //弹出层
+ showModal() {
+ this.visible = true;
+ },
+
+ handleOk(e) {
+ this.visible = false;
+ },
+ getRiskName(disasterType){
+ return this.riskOptions.find(i => i.value === disasterType)?.name;
+ },
+
+ getLevelName(warningLevel){
+ return this.levelOptions.find(i => i.value === warningLevel)?.name;
+ }
+
+ }
+}
+
+</script>
\ No newline at end of file
--
Gitblit v1.9.2