234 lines
7.4 KiB
234 lines
7.4 KiB
<template>
|
|
<div class="L-app-container home">
|
|
<div class="L_tabs">
|
|
<div class="headerText">
|
|
<div class="searchP">查询条件</div>
|
|
</div>
|
|
<el-form :inline="true" :model="form" ref="formOne">
|
|
<el-form-item label="事件标题：" prop="title">
|
|
<el-input v-model="form.title" placeholder="请输入名称"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="事件类型：" prop="msgTypeName">
|
|
<!-- <el-select v-model="form.msgTypeName" placeholder="请选择类型">
|
|
<el-option label="暴漏垃圾" value="shanghai"></el-option>
|
|
<el-option label="市容环境" value="beijing"></el-option>
|
|
</el-select> -->
|
|
<el-input v-model="form.msgTypeName" placeholder="请输入事件类型名称"></el-input>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" size="mini" icon="el-icon-search" @click="onSubmit('formOne')" class="onSubmit">查询</el-button>
|
|
<el-button size="mini" icon="el-icon-refresh-left" @click="reset('formOne')" class="reset">重置</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
<div class="tabsBottom">
|
|
<div class="foot-main">
|
|
<div class="headerText">
|
|
<div class="searchP">算法事件列表</div>
|
|
</div>
|
|
<section class="table-box">
|
|
<div class="table-item">
|
|
<el-table v-loading="loading" :data="tableData" border>
|
|
<el-table-column
|
|
type="index"
|
|
label="序号"
|
|
width="55"
|
|
align="center"
|
|
/>
|
|
<el-table-column label="时间" align="center" prop="firstWarnTimeDate">
|
|
</el-table-column>
|
|
<el-table-column label="类型" align="center" prop="msgTypeName">
|
|
</el-table-column>
|
|
<el-table-column label="标题" align="center" prop="title">
|
|
</el-table-column>
|
|
<el-table-column label="因素" align="center" prop="warnFactor">
|
|
</el-table-column>
|
|
<el-table-column label="状态" align="center" prop="state">
|
|
<template slot-scope="scope">
|
|
<div
|
|
style="
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
"
|
|
>
|
|
<div class="state-sub">
|
|
<div v-if="scope.row.state == 1" class="colors wancengColor"></div>
|
|
<div v-if="scope.row.state == 2" class="colors yichuliColor"></div>
|
|
<div v-if="scope.row.state == 3" class="colors yizhuofei"></div>
|
|
<div v-if="scope.row.state == null || scope.row.state == ''" class="colors yanqiColor"></div>
|
|
</div>
|
|
<div class="state-sub2">
|
|
<div v-if="scope.row.state == 1">未通过</div>
|
|
<div v-if="scope.row.state == 2">已办结</div>
|
|
<div v-if="scope.row.state == 3">作废</div>
|
|
<div v-if="scope.row.state == null || scope.row.state == ''">正常</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" align="center">
|
|
<template slot-scope="scope">
|
|
<button @click="toDetail(scope.row)" class="sqbtn sqbtn1">
|
|
详情
|
|
</button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
<div class="my-pagination">
|
|
<pagination
|
|
:total="total"
|
|
:page="pages.current"
|
|
:limit="pages.size"
|
|
@pagination="getPagination"
|
|
:current-page.sync="pages.current"
|
|
></pagination>
|
|
</div>
|
|
<el-dialog
|
|
title="详情"
|
|
:visible.sync="showCK"
|
|
width="40%"
|
|
@close="approveReset"
|
|
>
|
|
<div v-loading="dialogLoading">
|
|
<div class="team-main">
|
|
<div>事件集合编号:</div>
|
|
<div>{{ dialogData.innerEventId }}</div>
|
|
</div>
|
|
<div class="team-main">
|
|
<div>事件消息标题:</div>
|
|
<div>{{ dialogData.title }}</div>
|
|
</div>
|
|
<div class="team-main">
|
|
<div>事件类型编码:</div>
|
|
<div>{{ dialogData.msgType }}</div>
|
|
</div>
|
|
<div class="team-main">
|
|
<div>事件类型名称:</div>
|
|
<div>{{ dialogData.msgTypeName }}</div>
|
|
</div>
|
|
<div class="team-main">
|
|
<div>案件类型编码:</div>
|
|
<div>{{ dialogData.scenceType }}</div>
|
|
</div>
|
|
<div class="team-main">
|
|
<div>案件类型名称:</div>
|
|
<div>{{ dialogData.scenceTypename }}</div>
|
|
</div>
|
|
<div class="team-main">
|
|
<div>第一次预警时间:</div>
|
|
<div>{{ dialogData.firstWarnTimeDate }}</div>
|
|
</div>
|
|
<div class="team-main">
|
|
<div>事件发生时间:</div>
|
|
<div>{{ dialogData.eventTimeDate }}</div>
|
|
</div>
|
|
<div class="team-main">
|
|
<div>预警因素:</div>
|
|
<div>{{ dialogData.warnFactor }}</div>
|
|
</div>
|
|
<div class="team-main">
|
|
<div>预警关联的事件单号:</div>
|
|
<div>{{ dialogData.relationNums }}</div>
|
|
</div>
|
|
<!-- <div class="team-main">
|
|
<div>事件来源:</div>
|
|
<div>{{ dialogData.scenceName }}</div>
|
|
</div> -->
|
|
<div class="team-main">
|
|
<div>状态:</div>
|
|
<div>{{ dialogData.state == 1 ? '未通过' : dialogData.state == 2 ? '已办结' : dialogData.state == 3 ? '作废' : '正常' }}</div>
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
</div>
|
|
|
|
</template>
|
|
<script>
|
|
import { getEvents,getEventById } from "@/api/platform/index"
|
|
export default {
|
|
data() {
|
|
return {
|
|
form:{
|
|
msgTypeName: '',
|
|
title: '',
|
|
},
|
|
pages: {
|
|
current: 1,
|
|
size: 10,
|
|
},
|
|
loading:false,
|
|
tableData: [],
|
|
total:1,
|
|
showCK:false,
|
|
dialogLoading:false,
|
|
dialogData:{},
|
|
}
|
|
},
|
|
mounted() {
|
|
this.getList();
|
|
},
|
|
methods:{
|
|
// 页码获取
|
|
getPagination(pages){
|
|
console.log(pages);
|
|
this.pages.current = pages.page;
|
|
this.pages.size = pages.limit;
|
|
this.getList()
|
|
},
|
|
// 获取列表
|
|
getList(){
|
|
this.loading = true;
|
|
getEvents(this.pages).then(res=>{
|
|
console.log(res);
|
|
this.loading = false;
|
|
this.tableData = res.data.records;
|
|
this.total = res.data.total;
|
|
})
|
|
},
|
|
// 查询按钮
|
|
onSubmit(){
|
|
this.pages = {
|
|
current: 1,
|
|
size: 10
|
|
}
|
|
this.pages = {...this.pages,...this.form}
|
|
this.getList();
|
|
},
|
|
// 重置按钮
|
|
reset(formRef){
|
|
this.$refs[formRef].resetFields();
|
|
this.pages = {
|
|
current: 1,
|
|
size: 10
|
|
}
|
|
this.form = {
|
|
msgTypeName: '',
|
|
title: '',
|
|
}
|
|
this.getList();
|
|
},
|
|
// 查看详情
|
|
toDetail(row) {
|
|
this.dialogLoading = true;
|
|
this.showCK = true;
|
|
getEventById(row.innerEventId).then(res=>{
|
|
this.dialogData = res.data;
|
|
this.dialogLoading = false;
|
|
})
|
|
},
|
|
// 详情关闭按钮
|
|
approveReset() {
|
|
this.showCK = false;
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
|
|
</style>
|