|
@@ -0,0 +1,423 @@
|
|
|
+<template>
|
|
|
+ <a-card :bordered="false">
|
|
|
+ <!-- 查询区域 -->
|
|
|
+ <div class="table-page-search-wrapper">
|
|
|
+ <a-form layout="inline" @keyup.enter.native="searchQuery">
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :xl="10" :lg="7" :md="8" :sm="24">
|
|
|
+ <a-form-item label="设备名称">
|
|
|
+ <a-select
|
|
|
+ v-model="queryParam.equipmentid"
|
|
|
+ placeholder="请输入设备名称或设备编号"
|
|
|
+ show-search
|
|
|
+ :filterOption="filterOptions"
|
|
|
+ @search="searchDevice"
|
|
|
+ allowClear>
|
|
|
+ <a-select-option v-for="(item, index) in deviceOptions" :key="index" :value="item.id" :label="item.equipmentname">
|
|
|
+ <span>{{item.equipmentname}}</span>
|
|
|
+ <span style="position: absolute;right: 2%;">{{ item.equipmentcode }}</span>
|
|
|
+ </a-select-option>
|
|
|
+ </a-select>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <template v-if="toggleSearchStatus">
|
|
|
+ <a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
|
+ <a-form-item label="报警日期">
|
|
|
+ <j-date v-model="queryParam.alarmtime" placeholder="请选择报警日期" style="width:100%;"></j-date>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
|
+ <a-form-item label="报警等级">
|
|
|
+ <j-dict-select-tag v-model="queryParam.alarmlevel" placeholder="请选择报警等级" dictCode="alarm_level"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
|
+ <a-form-item label="报警类型">
|
|
|
+ <j-dict-select-tag v-model="queryParam.alarmtype" placeholder="请选择报警类型" dictCode="alarm_type"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
|
+ <a-form-item label="处理状态">
|
|
|
+ <j-dict-select-tag v-model="queryParam.status" placeholder="请选择处理状态" dictCode="alarm_status"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </template>
|
|
|
+ <a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
|
+ <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
|
|
+ <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
|
|
+ <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
|
|
+ <a @click="handleToggleSearch" style="margin-left: 8px">
|
|
|
+ {{ toggleSearchStatus ? '收起' : '展开' }}
|
|
|
+ <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
|
|
|
+ </a>
|
|
|
+ </span>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-form>
|
|
|
+ </div>
|
|
|
+ <!-- 查询区域-END -->
|
|
|
+
|
|
|
+ <!-- 操作按钮区域 -->
|
|
|
+ <!-- <div class="table-operator">
|
|
|
+ <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
|
|
|
+ <a-button type="primary" icon="download" @click="handleExportXls('tpm_message_alarm')">导出</a-button>
|
|
|
+ <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
|
|
|
+ <a-button type="primary" icon="import">导入</a-button>
|
|
|
+ </a-upload> -->
|
|
|
+ <!-- 高级查询区域 -->
|
|
|
+ <!-- <j-super-query :fieldList="superFieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query>
|
|
|
+ <a-dropdown v-if="selectedRowKeys.length > 0">
|
|
|
+ <a-menu slot="overlay">
|
|
|
+ <a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
|
|
+ </a-menu>
|
|
|
+ <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>
|
|
|
+ </a-dropdown>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <!-- table区域-begin -->
|
|
|
+ <div>
|
|
|
+ <!-- <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
|
|
+ <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
|
|
|
+ <a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <a-table
|
|
|
+ ref="table"
|
|
|
+ size="middle"
|
|
|
+ :scroll="{x:true}"
|
|
|
+ bordered
|
|
|
+ rowKey="id"
|
|
|
+ :columns="columns"
|
|
|
+ :dataSource="dataSource"
|
|
|
+ :pagination="ipagination"
|
|
|
+ :loading="loading"
|
|
|
+ class="j-table-force-nowrap"
|
|
|
+ @change="handleTableChange">
|
|
|
+
|
|
|
+ <template slot="status_dictText" slot-scope="text,record">
|
|
|
+ <!-- <span v-if="text">{{record.status_dictText}}</span> -->
|
|
|
+ <a-button type="dashed" v-if="record.status == 0" size="small">{{record.status_dictText}}</a-button>
|
|
|
+ <!-- 处理中 -->
|
|
|
+ <a-button v-if="record.status == 1" class="yellow" size="small">{{record.status_dictText}}</a-button>
|
|
|
+ <!-- 已处理 -->
|
|
|
+ <a-button v-if="record.status == 2" class="green" size="small">{{record.status_dictText}}</a-button>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template slot="htmlSlot" slot-scope="text">
|
|
|
+ <div v-html="text"></div>
|
|
|
+ </template>
|
|
|
+ <template slot="imgSlot" slot-scope="text,record">
|
|
|
+ <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
|
|
|
+ <img v-else :src="getImgView(text)" :preview="record.id" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/>
|
|
|
+ </template>
|
|
|
+ <template slot="fileSlot" slot-scope="text">
|
|
|
+ <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
|
|
|
+ <a-button
|
|
|
+ v-else
|
|
|
+ :ghost="true"
|
|
|
+ type="primary"
|
|
|
+ icon="download"
|
|
|
+ size="small"
|
|
|
+ @click="downloadFile(text)">
|
|
|
+ 下载
|
|
|
+ </a-button>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <span slot="action" slot-scope="text, record">
|
|
|
+ <a @click="handleEdit(record)">处理</a>
|
|
|
+
|
|
|
+ <!-- <a-divider type="vertical" />
|
|
|
+ <a-dropdown>
|
|
|
+ <a class="ant-dropdown-link">更多 <a-icon type="down" /></a>
|
|
|
+ <a-menu slot="overlay">
|
|
|
+ <a-menu-item>
|
|
|
+ <a @click="handleDetail(record)">详情</a>
|
|
|
+ </a-menu-item>
|
|
|
+ <a-menu-item>
|
|
|
+ <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
|
|
+ <a>删除</a>
|
|
|
+ </a-popconfirm>
|
|
|
+ </a-menu-item>
|
|
|
+ </a-menu>
|
|
|
+ </a-dropdown> -->
|
|
|
+ </span>
|
|
|
+
|
|
|
+ </a-table>
|
|
|
+ </div>
|
|
|
+ </a-card>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+
|
|
|
+ import '@/assets/less/TableExpand.less'
|
|
|
+ import { mixinDevice } from '@/utils/mixin'
|
|
|
+ import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
|
|
+ import { httpAction, getAction } from '@/api/manage'
|
|
|
+
|
|
|
+ export default {
|
|
|
+ name: 'MessageAlarmList',
|
|
|
+ mixins:[JeecgListMixin, mixinDevice],
|
|
|
+ components: {
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ description: 'tpm_message_alarm管理页面',
|
|
|
+ // 表头
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ title: '序号',
|
|
|
+ dataIndex: '',
|
|
|
+ key:'rowIndex',
|
|
|
+ width:60,
|
|
|
+ align:"center",
|
|
|
+ customRender:function (t,r,index) {
|
|
|
+ return parseInt(index)+1;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title:'设备',
|
|
|
+ align:"center",
|
|
|
+ dataIndex: 'equipmentid_dictText'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title:'报警类型',
|
|
|
+ align:"center",
|
|
|
+ dataIndex: 'alarmtype_dictText'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title:'报警描述',
|
|
|
+ align:"center",
|
|
|
+ dataIndex: 'remark'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title:'报警时间',
|
|
|
+ align:"center",
|
|
|
+ dataIndex: 'alarmtime',
|
|
|
+ // customRender:function (text) {
|
|
|
+ // return !text?"":(text.length>10?text.substr(0,10):text)
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title:'报警等级',
|
|
|
+ align:"center",
|
|
|
+ dataIndex: 'alarmlevel_dictText'
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // title:'消息码',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'msgcode'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'参数编号',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'paramcode'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'参数名称',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'paramname'
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ title:'当前值',
|
|
|
+ align:"center",
|
|
|
+ dataIndex: 'nowvalue'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title:'阈值最小值',
|
|
|
+ align:"center",
|
|
|
+ dataIndex: 'vmin'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title:'阈值最大值',
|
|
|
+ align:"center",
|
|
|
+ dataIndex: 'vmax'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title:'处理状态',
|
|
|
+ align:"center",
|
|
|
+ dataIndex: 'status_dictText',
|
|
|
+ scopedSlots: { customRender: 'status_dictText' }
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // title:'处理日期',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'handletime',
|
|
|
+ // customRender:function (text) {
|
|
|
+ // return !text?"":(text.length>10?text.substr(0,10):text)
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'处理人',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'handleuser'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'处理信息',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'handleremark'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'图片地址',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'url'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'距离(摄像头用)',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'distance'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'方位(摄像头用)',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'position'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'所属年',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'year'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'所属月',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'month'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'所属周',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'week'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'日期',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'day'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'周几',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'dayofweek'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title:'所属年月',
|
|
|
+ // align:"center",
|
|
|
+ // dataIndex: 'yearmonth'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // title: '操作',
|
|
|
+ // dataIndex: 'action',
|
|
|
+ // align:"center",
|
|
|
+ // fixed:"right",
|
|
|
+ // width:147,
|
|
|
+ // scopedSlots: { customRender: 'action' }
|
|
|
+ // }
|
|
|
+ ],
|
|
|
+ url: {
|
|
|
+ list: "/tpmMessageAlarm/tpmMessageAlarm/list",
|
|
|
+ delete: "/tpmMessageAlarm/tpmMessageAlarm/delete",
|
|
|
+ deleteBatch: "/tpmMessageAlarm/tpmMessageAlarm/deleteBatch",
|
|
|
+ exportXlsUrl: "/tpmMessageAlarm/tpmMessageAlarm/exportXls",
|
|
|
+ importExcelUrl: "tpmMessageAlarm/tpmMessageAlarm/importExcel",
|
|
|
+
|
|
|
+ },
|
|
|
+ dictOptions:{},
|
|
|
+ superFieldList:[],
|
|
|
+ deviceOptions: [],
|
|
|
+ deviceOptionsAll: [],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getSuperFieldList();
|
|
|
+ this.getDeviceOption();
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ importExcelUrl: function(){
|
|
|
+ return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 获取设备下拉列表
|
|
|
+ getDeviceOption(){
|
|
|
+ getAction(`/tpmEquipment/tpmEquipment/selectEquipmentList`).then(res=>{
|
|
|
+ console.log(111,res.result)
|
|
|
+ this.deviceOptions = res.result.map((res) => {
|
|
|
+ return {
|
|
|
+ id: res.id,
|
|
|
+ equipmentname: res.equipmentname,
|
|
|
+ equipmentcode: res.equipmentcode,
|
|
|
+ }
|
|
|
+ })
|
|
|
+ // 存一个完整的设备表
|
|
|
+ this.deviceOptionsAll = this.deviceOptions
|
|
|
+ // console.log(7878,this.deviceOptionsAll)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 筛选设备
|
|
|
+ searchDevice(value) {
|
|
|
+ console.log(1212,value,value.trim().length)
|
|
|
+ // 若输入的值删除,则重新赋完整的设备列表
|
|
|
+ if (value.trim().length === 0) {
|
|
|
+ this.deviceOptions = this.deviceOptionsAll
|
|
|
+ }
|
|
|
+ // 通过判断字符串中是数字还是文字进而判断是通过设备名筛选还是设备编号筛选
|
|
|
+ let panDuan = isNaN(parseFloat(value))
|
|
|
+ if (!panDuan) {
|
|
|
+ // 数字
|
|
|
+ // console.log(777)
|
|
|
+ let filteredArray = this.deviceOptionsAll.filter(item => item.equipmentcode.includes(value));
|
|
|
+ this.deviceOptions = filteredArray
|
|
|
+ } else {
|
|
|
+ // console.log(888)
|
|
|
+ let filteredArray = this.deviceOptionsAll.filter(item => item.equipmentname.includes(value));
|
|
|
+ this.deviceOptions = filteredArray
|
|
|
+ }
|
|
|
+ // console.log(999,this.deviceOptions)
|
|
|
+ },
|
|
|
+ // 解决筛选后option不回显问题
|
|
|
+ filterOptions(input, option) {
|
|
|
+ return this.deviceOptions
|
|
|
+ },
|
|
|
+ initDictConfig(){
|
|
|
+ },
|
|
|
+ getSuperFieldList(){
|
|
|
+ let fieldList=[];
|
|
|
+ fieldList.push({type:'string',value:'remark',text:'报警描述'})
|
|
|
+ fieldList.push({type:'string',value:'equipmentid',text:'设备id'})
|
|
|
+ fieldList.push({type:'date',value:'alarmtime',text:'报警时间'})
|
|
|
+ fieldList.push({type:'string',value:'alarmtype',text:'报警类型:0通讯状态,1现场报警,2设备故障,3消防报警,4环境报警,5安全报警'})
|
|
|
+ fieldList.push({type:'string',value:'alarmlevel',text:'报警等级:0普通,1严重,2事故'})
|
|
|
+ fieldList.push({type:'string',value:'msgcode',text:'消息码'})
|
|
|
+ fieldList.push({type:'string',value:'paramcode',text:'参数编号'})
|
|
|
+ fieldList.push({type:'string',value:'paramname',text:'参数名称'})
|
|
|
+ fieldList.push({type:'number',value:'nowvalue',text:'当前值'})
|
|
|
+ fieldList.push({type:'number',value:'vmin',text:'阈值最小值'})
|
|
|
+ fieldList.push({type:'number',value:'vmax',text:'阈值最大值'})
|
|
|
+ fieldList.push({type:'int',value:'status',text:'状态:0 报警,1误报 , 2 处理中,3已处理'})
|
|
|
+ fieldList.push({type:'date',value:'handletime',text:'处理日期'})
|
|
|
+ fieldList.push({type:'string',value:'handleuser',text:'处理人'})
|
|
|
+ fieldList.push({type:'string',value:'handleremark',text:'处理信息'})
|
|
|
+ fieldList.push({type:'string',value:'url',text:'图片地址'})
|
|
|
+ fieldList.push({type:'number',value:'distance',text:'距离(摄像头用)'})
|
|
|
+ fieldList.push({type:'number',value:'position',text:'方位(摄像头用)'})
|
|
|
+ fieldList.push({type:'int',value:'year',text:'所属年'})
|
|
|
+ fieldList.push({type:'int',value:'month',text:'所属月'})
|
|
|
+ fieldList.push({type:'int',value:'week',text:'所属周'})
|
|
|
+ fieldList.push({type:'string',value:'day',text:'日期'})
|
|
|
+ fieldList.push({type:'int',value:'dayofweek',text:'周几'})
|
|
|
+ fieldList.push({type:'string',value:'yearmonth',text:'所属年月'})
|
|
|
+ this.superFieldList = fieldList
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style scoped>
|
|
|
+ @import '~@assets/less/common.less';
|
|
|
+ .green{
|
|
|
+ background-color: #E7FAF0 !important;
|
|
|
+ border-color: #D0F5E0 !important;
|
|
|
+ color: #13CE66 !important;
|
|
|
+ }
|
|
|
+ .yellow{
|
|
|
+ background-color: #FFF8E6 !important;
|
|
|
+ border-color: #FFF1CC !important;
|
|
|
+ color: #FFBA00 !important;
|
|
|
+ }
|
|
|
+</style>
|