Browse Source

预警信息

master
blankk 2 years ago
parent
commit
e74b904d85
  1. 319
      src/views/warning/alarm/index.vue
  2. 290
      src/views/warning/employee/index.vue
  3. 420
      src/views/warning/message/index.vue
  4. 308
      src/views/warning/threshold/index.vue

319
src/views/warning/alarm/index.vue

@ -0,0 +1,319 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="选择站点" prop="stnmId">
<el-select v-model="queryParams.stnmId" placeholder="请选择站点" clearable>
<el-option
v-for="dict in stationList"
:key="dict.id"
:label="dict.stnm"
:value="dict.id"
/>
</el-select>
</el-form-item>
<el-form-item label="预警时间" prop="alarmTime">
<el-date-picker clearable
v-model="queryParams.alarmTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择预警时间">
</el-date-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="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['warning:alarm:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['warning:alarm:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['warning:alarm:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['warning: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="序号" type="index" width="50" align="center"/>
<el-table-column label="测站名称" align="center" prop="stnmId">
<template slot-scope="scope">
<div v-for="item in stationList">
{{(scope.row.stnmId == item.id)?item.stnm:''}}
</div>
</template>
</el-table-column>
<el-table-column label="预警内容" align="center" prop="alarmContent" />
<el-table-column label="预警时间" align="center" prop="alarmTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.alarmTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['warning:alarm:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['warning:alarm:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.limit"
@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="选择站点" prop="stnmId">
<el-select v-model="form.stnmId" placeholder="请选择站点" clearable>
<el-option
v-for="dict in stationList"
:key="dict.id"
:label="dict.stnm"
:value="dict.id"
/>
</el-select>
</el-form-item>
<el-form-item label="预警内容" prop="msgContent">
<el-input v-model="form.alarmContent" type="textarea" placeholder="请输入预警内容" />
</el-form-item>
<el-form-item label="预警时间" prop="alarmTime">
<el-date-picker clearable
v-model="form.alarmTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择预警时间">
</el-date-picker>
</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>
</template>
<script>
export default {
name: "Alarm",
data() {
return {
//
loading: true,
//
ids: [],
//
single: true,
//
multiple: true,
//
showSearch: true,
//
total: 0,
//
alarmList: [],
//
title: "",
//
open: false,
//
queryParams: {
page: 1,
limit: 10,
stnmId: null,
alarmTime: null,
},
stationList: [],
//
form: {},
//
rules: {
}
};
},
created() {
this.getList();
this.getStationList();
},
methods: {
/** 查询水尺-测站信息列表 */
async getStationList() {
let res = await this.$axiosGet('/system/info/list');
if(res.code === 0){
this.stationList = res.data;
}
},
/** 查询预警管理列表 */
async getList() {
this.loading = true;
let res = await this.$axiosGet('/warning/alarm/list',this.queryParams);
if(res.code === 0){
this.alarmList = res.data;
this.total = res.count;
}
this.loading = false;
},
//
cancel() {
this.open = false;
this.reset();
},
//
reset() {
this.form = {
id: null,
stnmId: null,
alarmContent: null,
alarmTime: null,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.page = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
//
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加预警管理";
},
/** 修改按钮操作 */
async handleUpdate(row) {
this.reset();
const id = row.id || this.ids
let res = await this.$axiosGet('/warning/alarm/info/'+id);
if(res.code === 0){
this.form = res.data;
this.open = true;
this.title = "修改";
}
},
async addMethod(){
let res = await this.$axiosPost('/warning/alarm/add',this.form);
if(res.code === 0){
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
}
},
async editMethod(){
let res = await this.$axiosPost('/warning/alarm/edit',this.form);
if(res.code === 0){
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
}
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
this.editMethod();
} else {
this.addMethod();
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$confirm('此操作将永久删除数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.delAlarm(ids)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
async delAlarm(ids){
let res = await this.$axiosDelete('/warning/alarm/delete/'+ids);
if(res.code === 0){
this.$modal.msgSuccess("删除成功");
await this.getList();
}
},
/** 导出按钮操作 */
handleExport() {
this.download('warning/alarm/export', {
...this.queryParams
}, `alarm_${new Date().getTime()}.xlsx`)
}
}
};
</script>

290
src/views/warning/employee/index.vue

@ -0,0 +1,290 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="姓名" prop="name">
<el-input
v-model="queryParams.name"
placeholder="请输入姓名"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="手机号" prop="phone">
<el-input
v-model="queryParams.phone"
placeholder="请输入手机号"
clearable
@keyup.enter.native="handleQuery"
/>
</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="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['warning:employee:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['warning:employee:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['warning:employee:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['warning:employee:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="employeeList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="序号" type="index" width="50" align="center"/>
<el-table-column label="姓名" align="center" prop="name" />
<el-table-column label="手机号" align="center" prop="phone" />
<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
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['warning:employee:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['warning:employee:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.limit"
@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="姓名" prop="name">
<el-input v-model="form.name" placeholder="请输入姓名" />
</el-form-item>
<el-form-item label="手机号" prop="phone">
<el-input v-model="form.phone" 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>
</template>
<script>
export default {
name: "Employee",
data() {
return {
//
loading: true,
//
ids: [],
//
single: true,
//
multiple: true,
//
showSearch: true,
//
total: 0,
//
employeeList: [],
//
title: "",
//
open: false,
//
queryParams: {
page: 1,
limit: 10,
name: null,
phone: null,
},
//
form: {},
//
rules: {
}
};
},
created() {
this.getList();
},
methods: {
/** 查询人员管理列表 */
async getList() {
this.loading = true;
let res = await this.$axiosGet('/warning/employee/list',this.queryParams);
if(res.code === 0){
this.employeeList = res.data;
this.total = res.count;
}
this.loading = false;
},
//
cancel() {
this.open = false;
this.reset();
},
//
reset() {
this.form = {
id: null,
name: null,
phone: null,
createTime: null,
updateTime: null,
remarks: null,
deleted: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.page = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
//
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加人员管理";
},
/** 修改按钮操作 */
async handleUpdate(row) {
this.reset();
const id = row.id || this.ids
let res = await this.$axiosGet('/warning/employee/info/'+id);
if(res.code === 0){
this.form = res.data;
this.open = true;
this.title = "修改";
}
},
async addMethod(){
let res = await this.$axiosPost('/warning/employee/add',this.form);
if(res.code === 0){
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
}
},
async editMethod(){
let res = await this.$axiosPost('/warning/employee/edit',this.form);
if(res.code === 0){
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
}
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
this.editMethod();
} else {
this.addMethod();
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$confirm('此操作将永久删除数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.delEmp(ids)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
async delEmp(ids){
let res = await this.$axiosDelete('/warning/employee/delete/'+ids);
if(res.code === 0){
this.$modal.msgSuccess("删除成功");
await this.getList();
}
},
/** 导出按钮操作 */
handleExport() {
this.download('warning/employee/export', {
...this.queryParams
}, `employee_${new Date().getTime()}.xlsx`)
}
}
};
</script>

420
src/views/warning/message/index.vue

@ -0,0 +1,420 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="选择站点" prop="stnmId">
<el-select v-model="queryParams.stnmId" placeholder="请选择站点" clearable>
<el-option
v-for="dict in stationList"
:key="dict.id"
:label="dict.stnm"
:value="dict.id"
/>
</el-select>
</el-form-item>
<el-form-item label="发送时间" prop="sendTime">
<el-date-picker clearable
v-model="queryParams.sendTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择发送时间">
</el-date-picker>
</el-form-item>
<el-form-item label="消息状态" prop="sendStaus">
<el-select v-model="queryParams.sendStaus" placeholder="请选择消息状态" clearable>
<el-option
v-for="dict in dict.type.msg_status"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</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="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['warning:message:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['warning:message:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['warning:message:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['warning:message:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="messageList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="序号" type="index" width="50" align="center"/>
<el-table-column label="测站名称" align="center" prop="stnmId">
<template slot-scope="scope">
<div v-for="item in stationList">
{{(scope.row.stnmId == item.id)?item.stnm:''}}
</div>
</template>
</el-table-column>
<el-table-column label="短信名称" align="center" prop="msgName" />
<el-table-column label="发送时间" align="center" prop="sendTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.sendTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="消息状态" align="center" prop="sendStaus">
<template slot-scope="scope">
<dict-tag :options="dict.type.msg_status" :value="scope.row.sendStaus"/>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="getMsgdetails(scope.row)"
>查看</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['warning:message:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['warning:message:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.limit"
@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="短信名称" prop="msgName">
<el-input v-model="form.msgName" placeholder="请输入短信名称" />
</el-form-item>
<el-form-item label="短信内容" prop="msgContent">
<el-input v-model="form.msgContent" type="textarea" placeholder="请输入内容" />
</el-form-item>
<!-- <el-form-item label="发送时间" prop="sendTime">
<el-date-picker clearable
v-model="form.sendTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择发送时间">
</el-date-picker>
</el-form-item>
<el-form-item label="消息状态" prop="sendStaus">
<el-select v-model="form.sendStaus" placeholder="请选择消息状态">
<el-option
v-for="dict in dict.type.msg_status"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>-->
<el-form-item label="选择站点" prop="stnmId">
<el-select v-model="form.stnmId" placeholder="请选择站点" clearable>
<el-option
v-for="dict in stationList"
:key="dict.id"
:label="dict.stnm"
:value="dict.id"
/>
</el-select>
</el-form-item>
<el-form-item label="选择人员" prop="empId">
<el-select v-model="form.empId" placeholder="请选择人员" clearable>
<el-option
v-for="dict in employeeList"
:key="dict.id"
:label="dict.name"
:value="dict.id"
/>
</el-select>
</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>
<!-- 短信的详细信息弹框 -->
<el-dialog title="短信的详细信息" :visible.sync="msgOpen" width="700px" append-to-body>
<el-descriptions :colon="false" column="2">
<el-descriptions-item labelStyle="font-weight:bold;" label="短信名称:">{{ msgDetails.msgName }}</el-descriptions-item>
<el-descriptions-item labelStyle="font-weight:bold;" label="测站名称:">{{msgDetails.stnm}}</el-descriptions-item>
<el-descriptions-item labelStyle="font-weight:bold;" label="发送时间:">{{parseTime(msgDetails.sendTime, '{y}-{m}-{d}-{h}-{i}-{s}')}}</el-descriptions-item>
<el-descriptions-item labelStyle="font-weight:bold;" label="短信状态:">
<el-tag size="small" type="success" v-show="msgDetails.sendStaus==0">发送成功</el-tag>
<el-tag size="small" type="danger" v-show="msgDetails.sendStaus==1">发送失败</el-tag>
</el-descriptions-item>
<el-descriptions-item labelStyle="font-weight:bold;" label="短信内容:">
{{msgDetails.msgContent}}
</el-descriptions-item>
</el-descriptions>
</el-dialog>
</div>
</template>
<script>
export default {
name: "Message",
dicts: ['msg_status'],
data() {
return {
//
loading: true,
//
ids: [],
//
single: true,
//
multiple: true,
//
showSearch: true,
msgDetails: {},
//
total: 0,
//
messageList: [],
//
title: "",
//
open: false,
stationList: [],
//
queryParams: {
page: 1,
limit: 10,
msgName: null,
msgContent: null,
sendTime: null,
sendStaus: null,
stnmId: null,
},
//
form: {},
employeeList:[],
msgOpen: false,
//
rules: {
msgName: [
{ required: true, message: "短信名称不能为空", trigger: "blur" }
],
stnmId: [
{ required: true, message: "测站名称不能为空", trigger: "blur" }
],
empId: [
{ required: true, message: "人员名称不能为空", trigger: "blur" }
],
}
};
},
created() {
this.getList();
},
methods: {
/** 查询人员管理列表 */
async getEmployeeList() {
let res = await this.$axiosGet('/warning/employee/list',this.queryParams);
if(res.code === 0){
this.employeeList = res.data;
}
},
/** 查看短信的详细信息 */
async getMsgdetails(row){
this.reset();
const id = row.id || this.ids
let res = await this.$axiosGet('/warning/message/info/'+id);
if(res.code === 0){
this.msgDetails = res.data;
this.msgDetails.stnm = this.stationList.filter(item => item.id === res.data.stnmId)[0].stnm
this.msgOpen = true;
}
},
/** 查询水尺-测站信息列表 */
async getStationList() {
let res = await this.$axiosGet('/system/info/list');
if(res.code === 0){
this.stationList = res.data;
}
},
/** 查询短信管理列表 */
async getList() {
this.loading = true;
let res = await this.$axiosGet('/warning/message/list',this.queryParams);
if(res.code === 0){
this.messageList = res.data;
this.total = res.count;
await this.getStationList();
await this.getEmployeeList();
}
this.loading = false;
},
//
cancel() {
this.open = false;
this.reset();
},
//
reset() {
this.form = {
id: null,
msgName: null,
msgContent: null,
sendTime: null,
sendStaus: null,
stnmId: null,
empId: null,
deleted: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.page = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
//
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加短信管理";
},
/** 修改按钮操作 */
async handleUpdate(row) {
this.reset();
const id = row.id || this.ids
let res = await this.$axiosGet('/warning/message/info/'+id);
if(res.code === 0){
this.form = res.data;
this.open = true;
this.title = "修改";
}
},
async addMethod(){
let res = await this.$axiosPost('/warning/message/add',this.form);
if(res.code === 0){
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
}
},
async editMethod(){
let res = await this.$axiosPost('/warning/message/edit',this.form);
if(res.code === 0){
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
}
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
this.editMethod();
} else {
this.addMethod();
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$confirm('此操作将永久删除数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.delMsg(ids)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
async delMsg(ids){
let res = await this.$axiosDelete('/warning/message/delete/'+ids);
if(res.code === 0){
this.$modal.msgSuccess("删除成功");
await this.getList();
}
},
/** 导出按钮操作 */
handleExport() {
this.download('warning/message/export', {
...this.queryParams
}, `message_${new Date().getTime()}.xlsx`)
}
}
};
</script>

308
src/views/warning/threshold/index.vue

@ -0,0 +1,308 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="选择站点" prop="stnmId">
<el-select v-model="queryParams.stnmId" placeholder="请选择站点" clearable>
<el-option
v-for="dict in stationList"
:key="dict.id"
:label="dict.stnm"
:value="dict.id"
/>
</el-select>
</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="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['warning:threshold:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['warning:threshold:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['warning:threshold:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['warning:threshold:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="thresholdList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="序号" type="index" width="50" align="center"/>
<el-table-column label="测站名称" align="center" prop="stnmId">
<template slot-scope="scope">
<div v-for="item in stationList">
{{(scope.row.stnmId == item.id)?item.stnm:''}}
</div>
</template>
</el-table-column>
<el-table-column label="阈值一级" align="center" prop="thresholdLevelL" />
<el-table-column label="阈值二级" align="center" prop="thresholdLevelLl" />
<el-table-column label="阈值三级" align="center" prop="thresholdLevelLll" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['warning:threshold:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['warning:threshold:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.limit"
@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="选择站点" prop="stnmId">
<el-select v-model="form.stnmId" placeholder="请选择站点" clearable>
<el-option
v-for="dict in stationList"
:key="dict.id"
:label="dict.stnm"
:value="dict.id"
/>
</el-select>
</el-form-item>
<el-form-item label="阈值一级" prop="thresholdLevelL">
<el-input v-model="form.thresholdLevelL" placeholder="请输入阈值一级" />
</el-form-item>
<el-form-item label="阈值二级" prop="thresholdLevelLl">
<el-input v-model="form.thresholdLevelLl" placeholder="请输入阈值二级" />
</el-form-item>
<el-form-item label="阈值三级" prop="thresholdLevelLll">
<el-input v-model="form.thresholdLevelLll" 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>
</template>
<script>
export default {
name: "Threshold",
data() {
return {
//
loading: true,
//
ids: [],
//
single: true,
//
multiple: true,
//
showSearch: true,
//
total: 0,
//
thresholdList: [],
//
title: "",
//
open: false,
//
queryParams: {
page: 1,
limit: 10,
stnmId: null
},
//
form: {},
stationList: [],
//
rules: {
stnmId: [
{ required: true, message: "测站名称不能为空", trigger: "blur" }
]
}
};
},
created() {
this.getList();
this.getStationList();
},
methods: {
/** 查询水尺-测站信息列表 */
async getStationList() {
let res = await this.$axiosGet('/system/info/list');
if(res.code === 0){
this.stationList = res.data;
}
},
/** 查询阈值管理列表 */
async getList() {
this.loading = true;
let res = await this.$axiosGet('/warning/threshold/list',this.queryParams);
if(res.code === 0){
this.thresholdList = res.data;
this.total = res.count;
}
this.loading = false;
},
//
cancel() {
this.open = false;
this.reset();
},
//
reset() {
this.form = {
id: null,
thresholdLevelL: null,
thresholdLevelLl: null,
thresholdLevelLll: null,
stnmId: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.page = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
//
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加阈值管理";
},
/** 修改按钮操作 */
async handleUpdate(row) {
this.reset();
const id = row.id || this.ids
let res = await this.$axiosGet('/warning/threshold/info/'+id);
if(res.code === 0){
this.form = res.data;
this.open = true;
this.title = "修改";
}
},
async addMethod(){
let res = await this.$axiosPost('/warning/threshold/add',this.form);
if(res.code === 0){
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
}
},
async editMethod(){
let res = await this.$axiosPost('/warning/threshold/edit',this.form);
if(res.code === 0){
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
}
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
this.editMethod();
} else {
this.addMethod();
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$confirm('此操作将永久删除数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.delThreshold(ids)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
async delThreshold(ids){
let res = await this.$axiosDelete('/warning/threshold/delete/'+ids);
if(res.code === 0){
this.$modal.msgSuccess("删除成功");
await this.getList();
}
},
/** 导出按钮操作 */
handleExport() {
this.download('warning/threshold/export', {
...this.queryParams
}, `threshold_${new Date().getTime()}.xlsx`)
}
}
};
</script>
Loading…
Cancel
Save