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

站点 摄像头

master
blankk 2 years ago
parent
86fd6bfc68
commit
d8d5b76af8
2 changed files with 188 additions and 18548 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. 18507
      package-lock.json
  2. 229
      src/views/basic/station/index.vue

18507
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

229
src/views/basic/station/index.vue
Unescape View File

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

Write Preview
Loading…
Cancel
Save