467010279
/
water-monitor-ui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

预警信息

master
blankk 2 years ago
parent
7d1f81c096
commit
e74b904d85
4 changed files with 1337 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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
Unescape View File

@ -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>
Write Preview
Loading…
Cancel
Save