From e2f129ee192ae3469848beeceac262b13ba8eacb Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期三, 14 六月 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