|
|
|
@ -1,10 +1,10 @@
@@ -1,10 +1,10 @@
|
|
|
|
|
<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="stnm"> |
|
|
|
|
<el-form-item label="测站名称" prop="stnm"> |
|
|
|
|
<el-input |
|
|
|
|
v-model="queryParams.stnm" |
|
|
|
|
placeholder="请输入站点名称" |
|
|
|
|
placeholder="请输入测站名称" |
|
|
|
|
clearable |
|
|
|
|
@keyup.enter.native="handleQuery" |
|
|
|
|
/> |
|
|
|
@ -23,6 +23,7 @@
@@ -23,6 +23,7 @@
|
|
|
|
|
icon="el-icon-plus" |
|
|
|
|
size="mini" |
|
|
|
|
@click="handleAdd" |
|
|
|
|
v-hasPermi="['system:info:add']" |
|
|
|
|
>新增</el-button> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="1.5"> |
|
|
|
@ -33,6 +34,7 @@
@@ -33,6 +34,7 @@
|
|
|
|
|
size="mini" |
|
|
|
|
:disabled="single" |
|
|
|
|
@click="handleUpdate" |
|
|
|
|
v-hasPermi="['system:info:edit']" |
|
|
|
|
>修改</el-button> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="1.5"> |
|
|
|
@ -43,6 +45,7 @@
@@ -43,6 +45,7 @@
|
|
|
|
|
size="mini" |
|
|
|
|
:disabled="multiple" |
|
|
|
|
@click="handleDelete" |
|
|
|
|
v-hasPermi="['system:info:remove']" |
|
|
|
|
>删除</el-button> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="1.5"> |
|
|
|
@ -52,22 +55,25 @@
@@ -52,22 +55,25 @@
|
|
|
|
|
icon="el-icon-download" |
|
|
|
|
size="mini" |
|
|
|
|
@click="handleExport" |
|
|
|
|
v-hasPermi="['system:info:export']" |
|
|
|
|
>导出</el-button> |
|
|
|
|
</el-col> |
|
|
|
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> |
|
|
|
|
</el-row> |
|
|
|
|
|
|
|
|
|
<el-table border v-loading="loading" :data="infoList" @selection-change="handleSelectionChange"> |
|
|
|
|
<el-table v-loading="loading" :data="infoList" @selection-change="handleSelectionChange"> |
|
|
|
|
<el-table-column type="selection" width="55" align="center" /> |
|
|
|
|
<el-table-column label="站点名称" align="center" prop="stnm" /> |
|
|
|
|
<el-table-column label="测站id" align="center" prop="id" /> |
|
|
|
|
<el-table-column label="测站名称" align="center" prop="stnm" /> |
|
|
|
|
<el-table-column label="经度" align="center" prop="longitude" /> |
|
|
|
|
<el-table-column label="纬度" align="center" prop="latitude" /> |
|
|
|
|
<el-table-column label="测站编码" align="center" prop="staid" /> |
|
|
|
|
<el-table-column label="站址" align="center" prop="stlc" /> |
|
|
|
|
|
|
|
|
|
<el-table-column label="状态" align="center" prop="status"> |
|
|
|
|
<el-table-column label="测站编码" align="center" prop="isState" /> |
|
|
|
|
<el-table-column label="保证水位" align="center" prop="bzsw" /> |
|
|
|
|
<el-table-column label="测站状态" align="center" prop="status"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
<span v-if="scope.row.status==0">正常</span> |
|
|
|
|
<span v-if="scope.row.status==1">异常</span> |
|
|
|
|
<dict-tag :options="stationStatusList" :value="scope.row.status"/> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> |
|
|
|
@ -77,12 +83,14 @@
@@ -77,12 +83,14 @@
|
|
|
|
|
type="text" |
|
|
|
|
icon="el-icon-edit" |
|
|
|
|
@click="handleUpdate(scope.row)" |
|
|
|
|
v-hasPermi="['system:info:edit']" |
|
|
|
|
>修改</el-button> |
|
|
|
|
<el-button |
|
|
|
|
size="mini" |
|
|
|
|
type="text" |
|
|
|
|
icon="el-icon-delete" |
|
|
|
|
@click="handleDelete(scope.row)" |
|
|
|
|
v-hasPermi="['system:info:remove']" |
|
|
|
|
>删除</el-button> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
@ -96,11 +104,11 @@
@@ -96,11 +104,11 @@
|
|
|
|
|
@pagination="getList" |
|
|
|
|
/> |
|
|
|
|
|
|
|
|
|
<!-- 添加或修改站点信息对话框 --> |
|
|
|
|
<el-dialog class="edit-dialog" :title="title" :visible.sync="open" width="900px" append-to-body> |
|
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="100px"> |
|
|
|
|
<el-form-item label="站点名称" prop="stnm"> |
|
|
|
|
<el-input v-model="form.stnm" placeholder="请输入站点名称" /> |
|
|
|
|
<!-- 添加或修改水尺-测站信息对话框 --> |
|
|
|
|
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body> |
|
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> |
|
|
|
|
<el-form-item label="测站名称" prop="stnm"> |
|
|
|
|
<el-input v-model="form.stnm" placeholder="请输入测站名称" /> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="经度" prop="longitude"> |
|
|
|
|
<el-input v-model="form.longitude" placeholder="请输入经度" /> |
|
|
|
@ -108,15 +116,47 @@
@@ -108,15 +116,47 @@
|
|
|
|
|
<el-form-item label="纬度" prop="latitude"> |
|
|
|
|
<el-input v-model="form.latitude" placeholder="请输入纬度" /> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="状态" prop="status"> |
|
|
|
|
<el-select v-model="form.status" placeholder="请选择状态"> |
|
|
|
|
<el-option value="0">正常</el-option> |
|
|
|
|
<el-option value="1">异常</el-option> |
|
|
|
|
<el-form-item label="测站状态"> |
|
|
|
|
<el-select v-model="form.status" placeholder="请选择测站状态"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="dict in stationStatusList" |
|
|
|
|
:key="dict.id" |
|
|
|
|
:label="dict.name" |
|
|
|
|
:value="dict.id" |
|
|
|
|
></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="测站编码" prop="staid"> |
|
|
|
|
<el-input v-model="form.staid" placeholder="请输入测站编码" /> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="河流" prop="rvnm"> |
|
|
|
|
<el-input v-model="form.rvnm" placeholder="请输入河流" /> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="水系" prop="hnnm"> |
|
|
|
|
<el-input v-model="form.hnnm" placeholder="请输入水系" /> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="流域" prop="bsnm"> |
|
|
|
|
<el-input v-model="form.bsnm" placeholder="请输入流域" /> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="站址" prop="stlc"> |
|
|
|
|
<el-input v-model="form.stlc" placeholder="请输入站址" /> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="测站编码" prop="isState"> |
|
|
|
|
<el-input v-model="form.isState" placeholder="请输入测站编码" /> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="保证水位" prop="bzsw"> |
|
|
|
|
<el-input v-model="form.bzsw" placeholder="请输入保证水位" /> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="摄像头"> |
|
|
|
|
<el-select v-model="form.cameraSn" placeholder="请选择摄像头"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="dict in cameraList" |
|
|
|
|
:key="dict.id" |
|
|
|
|
:label="dict.name" |
|
|
|
|
:value="dict.devsn" |
|
|
|
|
></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-form> |
|
|
|
|
<div slot="footer" class="dialog-footer"> |
|
|
|
|
<el-button type="primary" @click="submitForm">确 定</el-button> |
|
|
|
@ -125,18 +165,10 @@
@@ -125,18 +165,10 @@
|
|
|
|
|
</el-dialog> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
<style> |
|
|
|
|
.stcd-item .el-form-item__content{ |
|
|
|
|
margin-left: 0 !important; |
|
|
|
|
} |
|
|
|
|
.edit-dialog .el-dialog{ |
|
|
|
|
height: 800px; |
|
|
|
|
overflow: auto; |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
export default { |
|
|
|
|
name: "Station", |
|
|
|
|
name: "Info", |
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
// 遮罩层 |
|
|
|
@ -150,9 +182,11 @@ export default {
@@ -150,9 +182,11 @@ export default {
|
|
|
|
|
// 显示搜索条件 |
|
|
|
|
showSearch: true, |
|
|
|
|
// 总条数 |
|
|
|
|
total: 100, |
|
|
|
|
// 站点信息表格数据 |
|
|
|
|
stationList: [], |
|
|
|
|
total: 0, |
|
|
|
|
// 水尺-测站信息表格数据 |
|
|
|
|
infoList: [], |
|
|
|
|
//摄像头列表 |
|
|
|
|
cameraList:[], |
|
|
|
|
// 弹出层标题 |
|
|
|
|
title: "", |
|
|
|
|
// 是否显示弹出层 |
|
|
|
@ -163,33 +197,56 @@ export default {
@@ -163,33 +197,56 @@ export default {
|
|
|
|
|
pageSize: 10, |
|
|
|
|
stnm: null, |
|
|
|
|
}, |
|
|
|
|
//站点状态 |
|
|
|
|
stationStatusList:[ |
|
|
|
|
{name: '正常',id: '0'}, |
|
|
|
|
{name: '信道故障',id: '2'}, |
|
|
|
|
{name: '站点关闭',id: '5'} |
|
|
|
|
], |
|
|
|
|
// 表单参数 |
|
|
|
|
form: { |
|
|
|
|
}, |
|
|
|
|
form: {}, |
|
|
|
|
// 表单校验 |
|
|
|
|
rules: { |
|
|
|
|
}, |
|
|
|
|
// 站点信息 |
|
|
|
|
infoList: [ |
|
|
|
|
{stnmId: 1,stnm:'姜山',longitude:121.66613,latitude:29.848543,stlc:'宁波鄞州姜山镇仪门村',status: 0}, |
|
|
|
|
{stnmId: 2,stnm:'画龙',longitude:121.76419,latitude:29.7645,stlc:'宁波鄞州东吴镇画龙村',status: 0}, |
|
|
|
|
{stnmId: 3,stnm:'大盘山',longitude:121.80467,latitude:29.781157,stlc:'宁波鄞州东吴镇大盘山水库',status: 0}, |
|
|
|
|
{stnmId: 4,stnm:'大石门',longitude:121.84172,latitude:29.735273,stlc:'宁波鄞州瞻岐镇大石门水库',status: 0}, |
|
|
|
|
{stnmId: 5,stnm:'云龙',longitude:121.60029,latitude:29.77453,stlc:'宁波鄞州云龙镇荻江村',status: 0}, |
|
|
|
|
{stnmId: 6,stnm:'华家山',longitude:121.66076,latitude:29.68349,stlc:'宁波鄞州咸祥镇华家山水库',status: 0}, |
|
|
|
|
{stnmId: 7,stnm:'东钱湖',longitude:121.66983,latitude:29.783585,stlc:'宁波鄞州东钱湖',status: 0}, |
|
|
|
|
{stnmId: 8,stnm:'横溪水库',longitude:121.59165,latitude:29.707834,stlc:'宁波鄞州横溪镇上街村',status: 0}, |
|
|
|
|
{stnmId: 9,stnm:'咸祥',longitude:121.76529,latitude:29.698639,stlc:'宁波鄞州咸祥镇咸三村',status: 0}, |
|
|
|
|
{stnmId: 10,stnm:'白鹤',longitude:121.55989,latitude:29.854578,stlc:'宁波鄞州白鹤街道白鹤街道',status: 0} |
|
|
|
|
], |
|
|
|
|
stnm: [ |
|
|
|
|
{ required: true, message: "测站名称不能为空", trigger: "blur" } |
|
|
|
|
], |
|
|
|
|
status: [ |
|
|
|
|
{ required: true, message: "测站状态不能为空", trigger: "change" } |
|
|
|
|
], |
|
|
|
|
longitude: [ |
|
|
|
|
{ required: true, message: "经度不能为空", trigger: "blur" } |
|
|
|
|
], |
|
|
|
|
latitude: [ |
|
|
|
|
{ required: true, message: "纬度不能为空", trigger: "blur" } |
|
|
|
|
], |
|
|
|
|
staid: [ |
|
|
|
|
{ required: true, message: "测站编码不能为空", trigger: "blur" } |
|
|
|
|
], |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
created() { |
|
|
|
|
this.getList() |
|
|
|
|
this.getList(); |
|
|
|
|
this.getCameraList(); |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
/** 查询测站区域信息列表 */ |
|
|
|
|
getList() { |
|
|
|
|
/** |
|
|
|
|
* 查询未绑定的摄像头 |
|
|
|
|
*/ |
|
|
|
|
async getCameraList(){ |
|
|
|
|
let res = await this.$axiosGet('/web/camera/cameraNoList'); |
|
|
|
|
if(res.code === 0){ |
|
|
|
|
this.cameraList = res.data; |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
/** 查询水尺-测站信息列表 */ |
|
|
|
|
async getList() { |
|
|
|
|
this.loading = true; |
|
|
|
|
let res = await this.$axiosGet('/system/info/list',this.queryParams); |
|
|
|
|
if(res.code === 0){ |
|
|
|
|
this.infoList = res.data; |
|
|
|
|
this.total = res.count; |
|
|
|
|
} |
|
|
|
|
this.loading = false; |
|
|
|
|
}, |
|
|
|
|
// 取消按钮 |
|
|
|
@ -200,18 +257,29 @@ export default {
@@ -200,18 +257,29 @@ export default {
|
|
|
|
|
// 表单重置 |
|
|
|
|
reset() { |
|
|
|
|
this.form = { |
|
|
|
|
id: null, |
|
|
|
|
stnm: null, |
|
|
|
|
stnmId: null, |
|
|
|
|
longitude: null, |
|
|
|
|
latitude: null, |
|
|
|
|
status: null, |
|
|
|
|
staid: null, |
|
|
|
|
rvnm: null, |
|
|
|
|
hnnm: null, |
|
|
|
|
bsnm: null, |
|
|
|
|
stlc: null, |
|
|
|
|
isState: null, |
|
|
|
|
bzsw: null, |
|
|
|
|
cameraSn: null, |
|
|
|
|
delFlag: null, |
|
|
|
|
createTime: null, |
|
|
|
|
updateTime: null |
|
|
|
|
}; |
|
|
|
|
this.resetForm("form"); |
|
|
|
|
}, |
|
|
|
|
/** 搜索按钮操作 */ |
|
|
|
|
handleQuery() { |
|
|
|
|
this.queryParams.pageNum = 1; |
|
|
|
|
this.getInfoList(); |
|
|
|
|
this.getList(); |
|
|
|
|
}, |
|
|
|
|
/** 重置按钮操作 */ |
|
|
|
|
resetQuery() { |
|
|
|
@ -220,7 +288,7 @@ export default {
@@ -220,7 +288,7 @@ export default {
|
|
|
|
|
}, |
|
|
|
|
// 多选框选中数据 |
|
|
|
|
handleSelectionChange(selection) { |
|
|
|
|
this.ids = selection.map(item => item.stnmId) |
|
|
|
|
this.ids = selection.map(item => item.id) |
|
|
|
|
this.single = selection.length!==1 |
|
|
|
|
this.multiple = !selection.length |
|
|
|
|
}, |
|
|
|
@ -228,33 +296,62 @@ export default {
@@ -228,33 +296,62 @@ export default {
|
|
|
|
|
handleAdd() { |
|
|
|
|
this.reset(); |
|
|
|
|
this.open = true; |
|
|
|
|
this.title = "添加站点信息"; |
|
|
|
|
this.title = "添加水尺-测站信息"; |
|
|
|
|
}, |
|
|
|
|
/** 修改按钮操作 */ |
|
|
|
|
handleUpdate(row) { |
|
|
|
|
async handleUpdate(row) { |
|
|
|
|
this.reset(); |
|
|
|
|
this.open = true; |
|
|
|
|
this.title = "修改站点信息"; |
|
|
|
|
const id = row.id || this.ids |
|
|
|
|
let res = await this.$axiosGet('/system/info/info/'+id); |
|
|
|
|
if(res.code === 0){ |
|
|
|
|
this.form = res.data; |
|
|
|
|
this.open = true; |
|
|
|
|
this.title = "修改"; |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
async addMethod(){ |
|
|
|
|
let res = await this.$axiosPost('/system/info/add',this.form); |
|
|
|
|
if(res.code === 0){ |
|
|
|
|
this.$modal.msgSuccess("新增成功"); |
|
|
|
|
this.open = false; |
|
|
|
|
this.getList(); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
async editMethod(){ |
|
|
|
|
let res = await this.$axiosPost('/system/info/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 stnmIds = row.stnmId || this.ids; |
|
|
|
|
this.$modal.confirm('是否确认删除站点信息编号为"' + stnmIds + '"的数据项?').then(function() { |
|
|
|
|
|
|
|
|
|
}).then(() => { |
|
|
|
|
this.getList(); |
|
|
|
|
async handleDelete(row) { |
|
|
|
|
const ids = row.id || this.ids; |
|
|
|
|
let res = await this.$axiosDelete('/system/info/delete/'+ids); |
|
|
|
|
if(res.code === 0){ |
|
|
|
|
this.$modal.msgSuccess("删除成功"); |
|
|
|
|
}).catch(() => {}); |
|
|
|
|
this.getList(); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
/** 导出按钮操作 */ |
|
|
|
|
handleExport() { |
|
|
|
|
this.download('basic/station/export', { |
|
|
|
|
this.download('system/info/export', { |
|
|
|
|
...this.queryParams |
|
|
|
|
}, `station_${new Date().getTime()}.xlsx`) |
|
|
|
|
}, |
|
|
|
|
}, `info_${new Date().getTime()}.xlsx`) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
|