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/Report.vue |  448 ++++++++++++++++++++++++++++++++++---------------------
 1 files changed, 278 insertions(+), 170 deletions(-)

diff --git a/src/views/Admin/Report.vue b/src/views/Admin/Report.vue
index eecfb70..d90fbd7 100644
--- a/src/views/Admin/Report.vue
+++ b/src/views/Admin/Report.vue
@@ -1,175 +1,283 @@
 <template>
   <div class="inner">
-	  <a-radio-group v-model="category">
-	  	<a-radio-button value="default">
-	  		全部
-	  	</a-radio-button>
-	  	<a-radio-button value="1">
-	  		已审核
-	  	</a-radio-button>
-	  	<a-radio-button value="2">
-	  		未审核
-	  	</a-radio-button>
-	  </a-radio-group>
-	  <div style="float:right">
-	  	时间区间筛选:<a-range-picker :placeholder="['开始时间', '结束时间']"/>
-	  </div>
-	  <br/><br/>
-	  <!-- 表格实体部分-->
-	  <a-table :columns="columns" :data-source="data" bordered>
-		  <span slot="level" slot-scope="text">
-		  	<a-tag :color="text === '黄色' ? 'yellow' :text === '橙色'? 'orange':text === '红色'?'red':'blue'">
-		  		{{ text }}
-		  	</a-tag>
-		  </span>
-		  <template slot="attachment" slot-scope="text">
-		  	<span v-if="text==='无'">无</span>
-		  	<a v-else><b><a-icon type="paper-clip" /> {{text}}</b></a>
-		  </template >
-	  	<template slot="operation" slot-scope="text, record, index">
-	  		<div class="editable-row-operations">
-				<a-button v-if="record.audit==='已审核'" type="primary" @click="showModal(record.id)" >
-					确认发布</a-button>&nbsp;&nbsp;
-	  			<router-link :to="{path:'/details',query: {id: record.id}}">信息详情</router-link>
-				&nbsp;&nbsp;<a style="color:red">删除</a>
-	  		</div>
-	  	</template>
-	  </a-table>
-	  <!-- 对话框 -->
-	  <a-modal title="信息发布" 
-	  okText="确认发布"
-	  cancelText="取消"
-	  :visible="visible" :confirm-loading="confirmLoading" @ok="handleOk" @cancel="handleCancel">
-	  <p>确认发布 “[{{show_id}}]2023年5月23日,全疆黄色高温预警信息”?</p>
-	  </a-modal>
+    <a-row type="flex" justify="space-between" style="margin-bottom: 20px">
+      <a-col :span="8">
+        <a-radio-group v-model="search.searchParams.reviewStatus" @change="getData">
+          <a-radio-button :value="null">
+            全部
+          </a-radio-button>
+          <a-radio-button :value="2">
+            审核通过
+          </a-radio-button>
+          <a-radio-button :value="1">
+            未审核
+          </a-radio-button>
+          <a-radio-button :value="3">
+            审核驳回
+          </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="onOk"
+                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" :rowKey="record=>record.id">
+        <template #index="text,record,index">
+          {{ index+1 }}
+        </template>
+        <template #disasterType="text">
+          {{ getRiskName(text) }}
+        </template>
+        <template #attachment="text">
+          <span v-if="text==='无'">无</span>
+          <a v-else><b><a-icon type="paper-clip" /> {{text}}</b></a>
+        </template >
+        <template #reviewStatus="reviewStatus">
+          <a-tag
+              :color="reviewStatus === 1 ? 'blue' : reviewStatus === 2 ? 'green' : 'red'"
+          >
+            {{ reviewStatus==1?'未审核':reviewStatus==2?'已审核':reviewStatus==3?'审核驳回':'' }}
+          </a-tag>
+        </template>
+        <template #operation="text, record, index">
+          <a-button type="primary" v-if="record.reviewStatus == 2" @click="confirmPost(record.id)">确认发布</a-button>
+          <a-button type="link" v-if="record.reviewStatus == 2 || record.reviewStatus == 3" @click="openMod('view',record)">查看信息详情</a-button>
+          <a-button class="del" type="link" @click="delData(record.id)">删除</a-button>
+        </template>
+      </a-table>
+    </div>
+    <msg-edit-mod ref="msgEdit" @refresh="getData"></msg-edit-mod>
   </div>
 </template>
-<script>
-	const columns = [{
-			title: '编号',
-			dataIndex: 'id',
-			width: '8%',
-		},
-		{
-			title: '提交审核时间',
-			dataIndex: 'time',
-			width: '13%',
-			scopedSlots: {
-				customRender: 'time'
-			}, //设置定制化表格数据
-		},
-		{
-			title: '发布单位',
-			dataIndex: 'department',
-			width: '12%',
-		},
-		{
-			title: '类别',
-			dataIndex: 'category',
-			width: '6%',
-		},
-		{
-			title: '级别',
-			dataIndex: 'level',
-			scopedSlots: {
-				customRender: 'level'
-			}, //设置定制化表格数据
-			width: '6%',
-		},
-		{
-			title: '信息标题',
-			dataIndex: 'title',
-			width: '16%',
-		},
-		{
-			title: '附件',
-			dataIndex: 'attachment',
-			width: '6%',
-			scopedSlots: {
-				customRender: 'attachment'
-			},
-		},
-		{
-			title: '审核情况',
-			dataIndex: 'audit',
-			width: '10%',
-			scopedSlots: {
-				customRender: 'audit'
-			}, //设置定制化表格数据
-		},
-		{
-			title: '操作',
-			dataIndex: 'operation',
-			scopedSlots: {
-				customRender: 'operation'
-			},
-		},
-	];
-	const data = [{
-			key: 1,
-			id:1001,
-			readed:false,
-			time: '2023年5月3日 15:30',
-			department: '自治区预警中心',
-			category: '气象',
-			level: '黄色',
-			title: '全疆高温红色预警',
-			attachment: '1',
-			audit: '已审核'
-		},
-		{
-				key: 2,
-				id:1002,
-				readed:false,
-				time: '2023年5月3日 15:30',
-				department: '自治区预警中心',
-				category: '气象',
-				level: '黄色',
-				title: '全疆高温红色预警',
-				attachment: '1',
-				audit: '未审核'
-			},{
-				key: 3,
-				id:1003,
-				readed:false,
-				time: '2023年5月3日 15:30',
-				department: '自治区预警中心',
-				category: '气象',
-				level: '黄色',
-				title: '全疆高温红色预警',
-				attachment: '1',
-				audit: '已审核'
-			}]
-	export default {
-		data() {
-			return {
-				category: 'default',
-				data,
-				columns,
-				visible: false,
-				confirmLoading: false,
-				show_id:''
-			}
-		},
-		methods: {
-			showModal(id) {
-				this.visible = true;
-				this.show_id=id
-			},
-			//确认发布
-			handleOk(e) {
-				this.ModalText = '正在发布,请稍候...';
-				this.confirmLoading = true;
-				setTimeout(() => {
-					this.visible = false;
-					this.confirmLoading = false;
-				}, 2000);
-			},
-			handleCancel(e) {
-				this.visible = false;
-			},
 
-		}
-		}
-		
-</script>
\ No newline at end of file
+<script>
+
+import {getReviewDetail, getReviewRecord} from "@/api/review";
+import msgEditMod from '@/views/Admin/components/msgEditMod'
+import {delRecipient} from "@/api/user";
+import {deleteMsg, publishMsg} from "@/api/send";
+
+export default {
+  name: 'msgReview',
+  components: { msgEditMod },
+  data () {
+    return {
+      search:{
+        pageIndex: 1,
+        pageSize: 10,
+        searchParams:{
+          reviewStatus: null,
+          startTime: '',
+          endTime: ''
+        }
+      },
+      timeRange: [],
+      riskOptions: [
+        {name: '地震',value: 1},
+        {name: '洪涝',value: 2},
+        {name: '气象',value: 3},
+        {name: '泥石流',value: 4},
+        {name: '水旱',value: 5},
+        {name: '森林草原火灾',value: 6}
+      ],
+      pagination: {
+        current: 1,
+        defaultCurrent: 1,
+        defaultPageSize: 10,
+        total: 0,
+        onChange: ( page, pageSize ) => this.onPageChange(page,pageSize),
+        showTotal: total => `共 ${total} 条`
+      },
+      columns: [
+        {
+          title: '序号',
+          key: 'index',
+          scopedSlots: {
+            customRender: 'index'
+          },
+        },
+        {
+          title: '提交审核时间',
+          key: 'gmtReviewSubmit',
+          dataIndex: 'gmtReviewSubmit',
+        },
+        {
+          title: '发布单位',
+          key: 'publishingUnit',
+          dataIndex: 'publishingUnit',
+        },
+        {
+          title: '灾种',
+          dataIndex: 'disasterType',
+          key: 'disasterType',
+          scopedSlots: {
+            customRender: 'disasterType'
+          }, //设置定制化表格数据
+        },
+        {
+          title: '信息标题',
+          key: 'title',
+          dataIndex: 'title',
+        },
+        {
+          title: '附件',
+          key: 'attachment',
+          dataIndex: 'attachment',
+          scopedSlots: {
+            customRender: 'attachment'
+          },
+        },
+        {
+          title: '审核情况',
+          dataIndex: 'reviewStatus',
+          scopedSlots: {
+            customRender: 'reviewStatus'
+          }, //设置定制化表格数据
+        },
+        {
+          title: '操作',
+          dataIndex: 'operation',
+          scopedSlots: {
+            customRender: 'operation'
+          },
+        },
+      ],
+      data: []
+    }
+  },
+  created() {
+    const t = this
+    t.getData()
+  },
+  methods:{
+    async getData(){
+      const t = this
+      const res = await getReviewRecord(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)
+      }
+    },
+
+    resetSearch(){
+      const t = this
+      t.search = {
+        pageIndex: 1,
+        pageSize: 10,
+        searchParams:{
+          reviewStatus: null,
+          startTime: '',
+          endTime: ''
+        }
+      }
+      t.timeRange = []
+      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')
+      }
+    },
+
+    confirmPost(id){
+      const t = this
+      this.$confirm({
+        title: '提示',
+        content: h => <div>是否发布该条信息?</div>,
+        cancelText: '取消',
+        okText: '确认',
+        centered: true,
+        async onOk() {
+          let res = await publishMsg(id)
+          if(res.data.code == 100){
+            t.$message.success('信息发布成功');
+            t.getData()
+          }else{
+            t.$message.warning(res.data.msg);
+          }
+        },
+        onCancel() {
+          console.log('Cancel');
+        },
+      });
+    },
+
+    delData(id){
+      const t = this
+      this.$confirm({
+        title: '提示',
+        content: h => <div>是否删除该条信息?</div>,
+        cancelText: '取消',
+        okText: '确认',
+        centered: true,
+        async onOk() {
+          let res = await deleteMsg(id)
+          if(res.data.code == 100){
+            t.$message.success('信息删除成功');
+            t.getData()
+          }else{
+            t.$message.warning(res.data.msg);
+          }
+        },
+        onCancel() {
+          console.log('Cancel');
+        },
+      });
+    },
+
+    openMod(type,data){
+      const t = this
+      getReviewDetail(data.id).then(res=>{
+        if(res.data.code == 100){
+          t.$refs.msgEdit.openMod(type,res.data.data)
+        }else{
+          this.$message.error(res.data.msg)
+        }
+      })
+    },
+
+    onPageChange(page, pageSize) {
+      const t= this
+      t.pagination.current = page
+      t.search.pageIndex = page
+      t.getData()
+    },
+
+    onOk(value) {
+      console.log('onOk: ', value);
+    },
+    getRiskName(disasterType){
+      return this.riskOptions.find(i => i.value === disasterType)?.name;
+    }
+
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.del{
+  color: @danger;
+}
+</style>

--
Gitblit v1.9.2