Skip to content

Z
zhengyuan-danger-chemistry-manage
Commit 8e795399 authored by 耿迪迪's avatar 耿迪迪
Browse files
Options

Merge branch 'master' of ssh://111.61.77.35:15/gengdidi/zhengyuan-danger-chemistry-manage

parents 1fde1ba1 a223e0f8
Hide whitespace changes
Inline Side-by-side
Showing with 413 additions and 0 deletions
danger-manage-web/src/views/system/limitTime/limitTime.vue 0 → 100644
View file @ 8e795399
<template>
<!-- <el-tabs v-model="activeName" type="card" @tab-click="handleClick">s -->
<!-- <el-tab-pane label="报警列表" name="first"> -->
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="报警类型" prop="alarmContent">
<el-select v-model="queryParams.alarmContent" placeholder="请选择预警类型">
<el-option
v-for="dict in alarmContentOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="parseInt(dict.dictValue)"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="报警级别" prop="alarmLevel">
<el-select v-model="queryParams.alarmLevel" placeholder="请选择报警级别">
<el-option
v-for="dict in alarmLevelOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="parseInt(dict.dictValue)"
></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="报警状态" prop="alarmStatus">
<el-select v-model="queryParams.alarmStatus" placeholder="请选择报警状态" clearable size="small">
<el-option label="正在报警" value="0" />
<el-option label="自动消警" value="1" />
<el-option label="手动消警" value="2" />
</el-select>
</el-form-item> -->
<el-form-item label="报警时间" prop="alarmStatus">
<el-time-picker
is-range
v-model="queryParams.alarmStatus"
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
placeholder="选择时间范围">
</el-time-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
:loading="exportLoading"
@click="handleExport"
v-hasPermi="['system:alarm:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="alarmList" @selection-change="handleSelectionChange">
<!--<el-table-column type="selection" width="55" align="center" />-->
<!--<el-table-column label="id" align="center" prop="alarmId" />-->
<el-table-column label="报警设备" align="center" prop="deviceName" />
<el-table-column label="预警类型" align="center" prop="alarmContent" :formatter="alarmContentFormat" />
<el-table-column label="报警级别" align="center" prop="alarmLevel" >
<template slot-scope="scope">
<span :style="colorList[scope.row.alarmLevel]" >{{alarmLevelFormat(scope.row,null)}}</span>
</template>
</el-table-column>
<!--:formatter="alarmLevelFormat"-->
<el-table-column label="报警开始时间" align="center" prop="alarmBeginTime" width="180"/>
<el-table-column label="报警结束时间" align="center" prop="alarmEndTime" width="180"/>
<el-table-column label="报警状态" align="center" prop="alarmStatus" >
<template slot-scope="scope">
<span style="color: red" v-if="scope.row.alarmStatus==0">正在报警</span>
<span v-if="scope.row.alarmStatus==1">自动消警</span>
<span v-if="scope.row.alarmStatus==2">手动消警</span>
</template>
<span></span>
<span></span>
</el-table-column>
<el-table-column label="预警图片" align="center" prop="alarmImageUrl" >
<template slot-scope="scope">
<img :src="scope.row.alarmImageUrl" style="width: 20%;vertical-align:middle;cursor:pointer;" @click="showPicture(scope.row)"/>
<el-image :ref="'a'+scope.row.id" :src="scope.row.alarmImageUrl" v-show="false" :preview-src-list="[scope.row.alarmImageUrl]" v-if="scope.row.alarmImageUrl != '' && scope.row.alarmImageUrl != null"></el-image>
</template>
</el-table-column>
<el-table-column label="预警值" align="center" prop="alarmVaule" />
<!--<el-table-column label="备注" align="center" prop="remarks" />-->
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
v-if="scope.row.alarmStatus==0"
size="mini"
type="text"
icon="el-icon-edit"
@click="handleXiao(scope.row)"
>手动消警</el-button>
<!--<el-button-->
<!--size="mini"-->
<!--type="text"-->
<!--icon="el-icon-delete"-->
<!--@click="handleDelete(scope.row)"-->
<!--v-hasPermi="['system:alarm:remove']"-->
<!--&gt;删除</el-button>-->
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改报警记录对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="关联设备id" prop="relationDeviceId">
<el-input v-model="form.relationDeviceId" placeholder="请输入关联设备id" />
</el-form-item>
<el-form-item label="预警类型" prop="alarmContent">
<el-select v-model="form.alarmContent" placeholder="请选择预警类型">
<el-option
v-for="dict in alarmContentOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="parseInt(dict.dictValue)"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="报警级别" prop="alarmLevel">
<el-select v-model="form.alarmLevel" placeholder="请选择报警级别">
<el-option
v-for="dict in alarmLevelOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="parseInt(dict.dictValue)"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="预警开始时间" prop="alarmBeginTime">
<el-date-picker clearable size="small"
v-model="form.alarmBeginTime"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="选择预警开始时间">
</el-date-picker>
</el-form-item>
<el-form-item label="预警结束时间" prop="alarmEndTime">
<el-date-picker clearable size="small"
v-model="form.alarmEndTime"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="选择预警结束时间">
</el-date-picker>
</el-form-item>
<el-form-item label="预警图片" prop="alarmImageUrl">
<el-input v-model="form.alarmImageUrl" type="textarea" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="预警值" prop="alarmVaule">
<el-input v-model="form.alarmVaule" placeholder="请输入预警值" />
</el-form-item>
<!--<el-form-item label="备注" prop="remarks">-->
<!--<el-input v-model="form.remarks" placeholder="请输入备注" />-->
<!--</el-form-item>-->
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
<!-- </el-tab-pane> -->
<!-- <el-tab-pane label="报警统计" name="second">
<div style="width: 100%;">
<chartindex></chartindex>
</div>
</el-tab-pane> -->
<!-- </el-tabs> -->
</template>
<script>
import { listAlarm, getAlarm, delAlarm, addAlarm, updateAlarm, exportAlarm,getStatistics } from "@/api/system/alarm";
import chartindex from "@/views/system/alarm/chartindex";
export default {
name: "Alarm",
components: {
chartindex,
},
data() {
return {
// 遮罩层
loading: true,
activeName: 'second',
// 导出遮罩层
exportLoading: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 报警记录表格数据
alarmList: [],
colorList:[
"color:red",
"color:red;font-weight: bolder;",
"color:#ff7744",
"color:#ffaa33",
"color:#bbbb00",
"color:#ccff33",
],
ceshi:"color:#ff00ff",
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 预警类型字典
alarmContentOptions: [],
// 报警级别字典
alarmLevelOptions: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
alarmBeginTime: null,
alarmEndTime: null,
alarmStatus: null,
},
// 表单参数
form: {},
// 表单校验
rules: {
}
};
},
created() {
this.getList();
this.getDicts("t_alarm_content").then(response => {
this.alarmContentOptions = response.data;
});
this.getDicts("t_alarm_level").then(response => {
this.alarmLevelOptions = response.data;
});
},
methods: {
/** 查询报警记录列表 */
getList() {
this.loading = true;
listAlarm(this.queryParams).then(response => {
// this.alarmList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 预警类型字典翻译
alarmContentFormat(row, column) {
return this.selectDictLabel(this.alarmContentOptions, row.alarmContent);
},
// 报警级别字典翻译
alarmLevelFormat(row, column) {
return this.selectDictLabel(this.alarmLevelOptions, row.alarmLevel);
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
alarmId: null,
relationDeviceId: null,
alarmContent: null,
alarmLevel: null,
alarmBeginTime: null,
alarmEndTime: null,
alarmStatus: "0",
alarmImageUrl: null,
alarmVaule: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
isDel: null,
remarks: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
//tabs切换
handleClick(tab, event) {
console.log(tab, event);
},
showPicture(row){
this.$refs['a'+row.id].showViewer = true;
console.log("===",row.id);
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.alarmId)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加报警记录";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const alarmId = row.alarmId || this.ids
getAlarm(alarmId).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改报警记录";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.alarmId != null) {
updateAlarm(this.form).then(response => {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addAlarm(this.form).then(response => {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const alarmIds = row.alarmId || this.ids;
this.$confirm('是否确认删除报警记录编号为"' + alarmIds + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return delAlarm(alarmIds);
}).then(() => {
this.getList();
this.msgSuccess("删除成功");
}).catch(() => {});
},
handleXiao(row) {
const alarmIds = row.alarmId || this.ids;
this.$confirm('是否确认消除这项报警状态?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return updateAlarm({alarmId:row.alarmId,alarmStatus:2});
}).then(() => {
this.getList();
this.msgSuccess("手动消警成功");
}).catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
const queryParams = this.queryParams;
this.$confirm('是否确认导出所有报警记录数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
this.exportLoading = true;
return exportAlarm(queryParams);
}).then(response => {
this.download(response.msg);
this.exportLoading = false;
}).catch(() => {});
}
}
};
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment