Browse Source

fix: 修复动态监测bug

sy-water-data-board-ui
panyuyi 12 months ago
parent
commit
2a4249a0b4
  1. 2
      src/views/dike/runManage/monitoring/dike/index.vue
  2. 143
      src/views/dike/runManage/monitoring/dike/manage/components/edit.vue
  3. 8
      src/views/dike/runManage/monitoring/dike/manage/index.vue
  4. 4
      src/views/dike/runManage/monitoring/dike/record/index.vue
  5. 2
      src/views/sluice/runManage/monitoring/sluice/index.vue
  6. 141
      src/views/sluice/runManage/monitoring/sluice/manage/components/edit.vue
  7. 156
      src/views/sluice/runManage/monitoring/sluice/manage/index.vue
  8. 4
      src/views/sluice/runManage/monitoring/sluice/record/index.vue

2
src/views/dike/runManage/monitoring/dike/index.vue

@ -270,7 +270,7 @@ export default {
.table-box { .table-box {
width: 100%; width: 100%;
height: calc(100% - 50px - 24px); height: calc(100% - 24px);
margin-top: 24px; margin-top: 24px;
padding: 16px; padding: 16px;
background-color: white; background-color: white;

143
src/views/dike/runManage/monitoring/dike/manage/components/edit.vue

@ -5,8 +5,8 @@ export default {
props: { props: {
model: { model: {
type: Object, type: Object,
default: null default: null,
} },
}, },
data() { data() {
return { return {
@ -16,67 +16,79 @@ export default {
xcDeviceStatus: [], xcDeviceStatus: [],
sluiceType: [], sluiceType: [],
ruleForm: { ruleForm: {
type: '', type: "",
name: '', name: "",
deviceId: '', deviceId: "",
status: '0', status: "0",
message: '', message: "",
warningType: '', warningType: "",
warningLevel: '', warningLevel: "",
reportInterval: '', reportInterval: "",
minThreshold: 0, minThreshold: 0,
maxThreshold: 0, maxThreshold: 0,
}, },
rules: { rules: {
type: [ type: [
{ required: true, message: "请选择设备类型", trigger: "blur" }, { required: true, message: "请选择设备类型", trigger: "change" },
],
name: [
{ required: true, message: "请选择设备名称", trigger: "blur" },
], ],
name: [{ required: true, message: "请输入设备名称", trigger: "blur" }],
reportInterval: [ reportInterval: [
{ required: true, validator: this.validateReportInterval, trigger: "blur" }, {
required: true,
validator: this.validateReportInterval,
trigger: "blur",
},
], ],
threshold: [ threshold: [
{ required: true, validator: this.validateThresholds, trigger: "blur" }, {
required: true,
validator: this.validateThresholds,
trigger: "blur",
},
], ],
} },
} };
}, },
methods: { methods: {
validateThresholds(rule, value, callback) { validateThresholds(rule, value, callback) {
if (!this.ruleForm.minThreshold && this.ruleForm.minThreshold !== 0) { if (!this.ruleForm.minThreshold && this.ruleForm.minThreshold !== 0) {
callback(new Error('请输入最小阈值')); callback(new Error("请输入最小阈值"));
} else if (!this.ruleForm.maxThreshold && this.ruleForm.maxThreshold !== 0) { } else if (
callback(new Error('请输入最大阈值')); !this.ruleForm.maxThreshold &&
this.ruleForm.maxThreshold !== 0
) {
callback(new Error("请输入最大阈值"));
} else if (this.ruleForm.minThreshold > this.ruleForm.maxThreshold) { } else if (this.ruleForm.minThreshold > this.ruleForm.maxThreshold) {
callback(new Error('最小阈值必须小于最大阈值')); callback(new Error("最小阈值必须小于最大阈值"));
} else { } else {
callback() callback();
} }
}, },
validateReportInterval(rule, value, callback) { validateReportInterval(rule, value, callback) {
if (!this.ruleForm.reportInterval && this.ruleForm.reportInterval !== 0) { if (!this.ruleForm.reportInterval && this.ruleForm.reportInterval !== 0) {
callback(new Error('请输入自动预警上报间隔')); callback(new Error("请输入自动预警上报间隔"));
} else if (this.ruleForm.reportInterval > 60 || this.ruleForm.reportInterval < 0) { } else if (
callback(new Error('间隔值为0-60之间的整数')); this.ruleForm.reportInterval > 60 ||
this.ruleForm.reportInterval < 0
) {
callback(new Error("间隔值为0-60之间的整数"));
} else { } else {
callback() callback();
} }
}, },
submitForm(callback) { submitForm(callback) {
this.$refs.ruleForm.validate((valid) => { this.$refs.ruleForm.validate((valid) => {
if (valid) { if (valid) {
callback({ callback({
...this.ruleForm ...this.ruleForm,
}) });
} }
}) });
}, },
handleInput(event) { handleInput(event) {
// 使 // 使
this.ruleForm.reportInterval = event.replace(/\D/g, ''); this.ruleForm.reportInterval = event.replace(/\D/g, "");
} },
}, },
async mounted() { async mounted() {
// //
@ -96,20 +108,20 @@ export default {
this.xcDeviceStatus = res.data; this.xcDeviceStatus = res.data;
}); });
if (this.model) { if (this.model) {
const data = await getDFDevice(this.model.id) const data = await getDFDevice(this.model.id);
this.ruleForm.type = data.data.type + '' this.ruleForm.type = data.data.type + "";
this.ruleForm.name = data.data.name this.ruleForm.name = data.data.name;
this.ruleForm.deviceId = data.data.deviceId this.ruleForm.deviceId = data.data.deviceId;
this.ruleForm.message = data.data.message this.ruleForm.message = data.data.message;
this.ruleForm.status = data.data.status || '0' this.ruleForm.status = data.data.status || "0";
this.ruleForm.warningType = data.data.warningType this.ruleForm.warningType = data.data.warningType;
this.ruleForm.warningLevel = data.data.warningLevel this.ruleForm.warningLevel = data.data.warningLevel;
this.ruleForm.reportInterval = data.data.configs[0].reportInterval this.ruleForm.reportInterval = data.data.configs[0].reportInterval;
this.ruleForm.minThreshold = data.data.configs[0].minThreshold this.ruleForm.minThreshold = data.data.configs[0].minThreshold;
this.ruleForm.maxThreshold = data.data.configs[0].maxThreshold this.ruleForm.maxThreshold = data.data.configs[0].maxThreshold;
}
}
} }
},
};
</script> </script>
<template> <template>
@ -133,7 +145,7 @@ export default {
label-width="100px" label-width="100px"
> >
<el-col :span="24"> <el-col :span="24">
<el-form-item label-width="120px" label="设备类型" prop="name"> <el-form-item label-width="120px" label="设备类型" prop="type">
<el-select v-model="ruleForm.type" placeholder="请选择"> <el-select v-model="ruleForm.type" placeholder="请选择">
<el-option <el-option
v-for="item in xcDeviceType" v-for="item in xcDeviceType"
@ -146,7 +158,12 @@ export default {
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label-width="120px" label="设备名称" prop="name"> <el-form-item label-width="120px" label="设备名称" prop="name">
<el-input style="width: 202px" v-model="ruleForm.name" placeholder="请输入" maxlength="50"></el-input> <el-input
style="width: 202px"
v-model="ruleForm.name"
placeholder="请输入"
maxlength="50"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
@ -218,20 +235,36 @@ export default {
</div> </div>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label-width="200px" label="自动预警上报间隔(分钟)" prop="reportInterval"> <el-form-item
<el-input style="width: 202px" v-model="ruleForm.reportInterval" @input="handleInput"></el-input> label-width="200px"
label="自动预警上报间隔(分钟)"
prop="reportInterval"
>
<el-input
style="width: 202px"
v-model="ruleForm.reportInterval"
@input="handleInput"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label-width="120px" label="预警阈值" prop="threshold"> <el-form-item label-width="120px" label="预警阈值" prop="threshold">
<el-col :span="8"> <el-col :span="12">
<el-form-item label-width="30px" label=">="> <el-form-item label-width="30px" label=">=">
<el-input style="width: 100px" v-model="ruleForm.minThreshold"></el-input> <el-input-number
:controls="false"
style="width: 100px"
v-model="ruleForm.minThreshold"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="12">
<el-form-item label-width="32px" label="<="> <el-form-item label-width="32px" label="<=">
<el-input style="width: 100px" v-model="ruleForm.maxThreshold"></el-input> <el-input-number
:controls="false"
style="width: 100px"
v-model="ruleForm.maxThreshold"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-form-item> </el-form-item>
@ -240,6 +273,4 @@ export default {
</div> </div>
</template> </template>
<style scoped lang="scss"> <style scoped lang="scss"></style>
</style>

8
src/views/dike/runManage/monitoring/dike/manage/index.vue

@ -355,7 +355,7 @@ export default {
:title="dialog.title" :title="dialog.title"
@close="closeDialog" @close="closeDialog"
:visible.sync="dialog.visible" :visible.sync="dialog.visible"
width="50%" width="820px"
> >
<component <component
v-if="dialog.visible" v-if="dialog.visible"
@ -383,9 +383,13 @@ export default {
font-weight: 600; font-weight: 600;
} }
.demo-ruleForm {
display: inline-block;
}
.table-box { .table-box {
width: 100%; width: 100%;
height: calc(100% - 50px - 24px); height: calc(100% - 24px);
margin-top: 24px; margin-top: 24px;
padding: 16px; padding: 16px;
background-color: white; background-color: white;

4
src/views/dike/runManage/monitoring/dike/record/index.vue

@ -177,7 +177,7 @@ export default {
<el-input <el-input
v-model="searchForm.dikeName" v-model="searchForm.dikeName"
class="search-input" class="search-input"
placeholder="请输入设备名称" placeholder="请输入所属堤防"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="预警类型:" prop="warningType"> <el-form-item label="预警类型:" prop="warningType">
@ -286,7 +286,7 @@ export default {
.table-box { .table-box {
width: 100%; width: 100%;
height: calc(100% - 50px - 24px); height: calc(100% - 24px);
margin-top: 24px; margin-top: 24px;
padding: 16px; padding: 16px;
background-color: white; background-color: white;

2
src/views/sluice/runManage/monitoring/sluice/index.vue

@ -255,7 +255,7 @@ export default {
.table-box { .table-box {
width: 100%; width: 100%;
height: calc(100% - 50px - 24px); height: calc(100% - 24px);
margin-top: 24px; margin-top: 24px;
padding: 16px; padding: 16px;
background-color: white; background-color: white;

141
src/views/sluice/runManage/monitoring/sluice/manage/components/edit.vue

@ -5,8 +5,8 @@ export default {
props: { props: {
model: { model: {
type: Object, type: Object,
default: null default: null,
} },
}, },
data() { data() {
return { return {
@ -16,70 +16,82 @@ export default {
xcDeviceStatus: [], xcDeviceStatus: [],
sluiceType: [], sluiceType: [],
ruleForm: { ruleForm: {
type: '', type: "",
name: '', name: "",
deviceId: '', deviceId: "",
status: '0', status: "0",
message: '', message: "",
warningType: '', warningType: "",
warningLevel: '', warningLevel: "",
reportInterval: '', reportInterval: "",
minThreshold: 0, minThreshold: 0,
maxThreshold: 0, maxThreshold: 0,
}, },
rules: { rules: {
type: [ type: [
{ required: true, message: "请选择设备类型", trigger: "blur" }, { required: true, message: "请选择设备类型", trigger: "change" },
],
name: [
{ required: true, message: "请选择设备名称", trigger: "blur" },
], ],
name: [{ required: true, message: "请输入设备名称", trigger: "blur" }],
message: [ message: [
{ required: true, message: "请输入设备信息", trigger: "blur" }, { required: true, message: "请输入设备信息", trigger: "blur" },
], ],
reportInterval: [ reportInterval: [
{ required: true, validator: this.validateReportInterval, trigger: "blur" }, {
required: true,
validator: this.validateReportInterval,
trigger: "blur",
},
], ],
threshold: [ threshold: [
{ required: true, validator: this.validateThresholds, trigger: "blur" }, {
required: true,
validator: this.validateThresholds,
trigger: "blur",
},
], ],
} },
} };
}, },
methods: { methods: {
validateThresholds(rule, value, callback) { validateThresholds(rule, value, callback) {
if (!this.ruleForm.minThreshold && this.ruleForm.minThreshold !== 0) { if (!this.ruleForm.minThreshold && this.ruleForm.minThreshold !== 0) {
callback(new Error('请输入最小阈值')); callback(new Error("请输入最小阈值"));
} else if (!this.ruleForm.maxThreshold && this.ruleForm.maxThreshold !== 0) { } else if (
callback(new Error('请输入最大阈值')); !this.ruleForm.maxThreshold &&
this.ruleForm.maxThreshold !== 0
) {
callback(new Error("请输入最大阈值"));
} else if (this.ruleForm.minThreshold > this.ruleForm.maxThreshold) { } else if (this.ruleForm.minThreshold > this.ruleForm.maxThreshold) {
callback(new Error('最小阈值必须小于最大阈值')); callback(new Error("最小阈值必须小于最大阈值"));
} else { } else {
callback() callback();
} }
}, },
validateReportInterval(rule, value, callback) { validateReportInterval(rule, value, callback) {
if (!this.ruleForm.reportInterval && this.ruleForm.reportInterval !== 0) { if (!this.ruleForm.reportInterval && this.ruleForm.reportInterval !== 0) {
callback(new Error('请输入自动预警上报间隔')); callback(new Error("请输入自动预警上报间隔"));
} else if (this.ruleForm.reportInterval > 60 || this.ruleForm.reportInterval < 0) { } else if (
callback(new Error('间隔值为0-60之间的整数')); this.ruleForm.reportInterval > 60 ||
this.ruleForm.reportInterval < 0
) {
callback(new Error("间隔值为0-60之间的整数"));
} else { } else {
callback() callback();
} }
}, },
submitForm(callback) { submitForm(callback) {
this.$refs.ruleForm.validate((valid) => { this.$refs.ruleForm.validate((valid) => {
if (valid) { if (valid) {
callback({ callback({
...this.ruleForm ...this.ruleForm,
}) });
} }
}) });
}, },
handleInput(event) { handleInput(event) {
// 使 // 使
this.ruleForm.reportInterval = event.replace(/\D/g, ''); this.ruleForm.reportInterval = event.replace(/\D/g, "");
} },
}, },
async mounted() { async mounted() {
// //
@ -99,20 +111,20 @@ export default {
this.xcDeviceStatus = res.data; this.xcDeviceStatus = res.data;
}); });
if (this.model) { if (this.model) {
const data = await getSZDevice(this.model.id) const data = await getSZDevice(this.model.id);
this.ruleForm.type = data.data.type + '' this.ruleForm.type = data.data.type + "";
this.ruleForm.name = data.data.name this.ruleForm.name = data.data.name;
this.ruleForm.deviceId = data.data.deviceId this.ruleForm.deviceId = data.data.deviceId;
this.ruleForm.message = data.data.message this.ruleForm.message = data.data.message;
this.ruleForm.status = data.data.status || '0' this.ruleForm.status = data.data.status || "0";
this.ruleForm.warningType = data.data.warningType this.ruleForm.warningType = data.data.warningType;
this.ruleForm.warningLevel = data.data.warningLevel this.ruleForm.warningLevel = data.data.warningLevel;
this.ruleForm.reportInterval = data.data.configs[0].reportInterval this.ruleForm.reportInterval = data.data.configs[0].reportInterval;
this.ruleForm.minThreshold = data.data.configs[0].minThreshold this.ruleForm.minThreshold = data.data.configs[0].minThreshold;
this.ruleForm.maxThreshold = data.data.configs[0].maxThreshold this.ruleForm.maxThreshold = data.data.configs[0].maxThreshold;
}
}
} }
},
};
</script> </script>
<template> <template>
@ -136,7 +148,7 @@ export default {
label-width="100px" label-width="100px"
> >
<el-col :span="24"> <el-col :span="24">
<el-form-item label-width="120px" label="设备类型" prop="name"> <el-form-item label-width="120px" label="设备类型" prop="type">
<el-select v-model="ruleForm.type" placeholder="请选择"> <el-select v-model="ruleForm.type" placeholder="请选择">
<el-option <el-option
v-for="item in xcDeviceType" v-for="item in xcDeviceType"
@ -149,7 +161,12 @@ export default {
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label-width="120px" label="设备名称" prop="name"> <el-form-item label-width="120px" label="设备名称" prop="name">
<el-input style="width: 202px" v-model="ruleForm.name" placeholder="请输入" maxlength="50"></el-input> <el-input
style="width: 202px"
v-model="ruleForm.name"
placeholder="请输入"
maxlength="50"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
@ -221,20 +238,34 @@ export default {
</div> </div>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label-width="200px" label="自动预警上报间隔(分钟)" prop="reportInterval"> <el-form-item
<el-input style="width: 202px" v-model="ruleForm.reportInterval" @input="handleInput"></el-input> label-width="200px"
label="自动预警上报间隔(分钟)"
prop="reportInterval"
>
<el-input
style="width: 202px"
v-model="ruleForm.reportInterval"
@input="handleInput"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label-width="120px" label="预警阈值" prop="threshold"> <el-form-item label-width="120px" label="预警阈值" prop="threshold">
<el-col :span="8"> <el-col :span="12">
<el-form-item label-width="30px" label=">="> <el-form-item label-width="30px" label=">=">
<el-input style="width: 100px" v-model="ruleForm.minThreshold"></el-input> <el-input
style="width: 100px"
v-model="ruleForm.minThreshold"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="12">
<el-form-item label-width="32px" label="<="> <el-form-item label-width="32px" label="<=">
<el-input style="width: 100px" v-model="ruleForm.maxThreshold"></el-input> <el-input
style="width: 100px"
v-model="ruleForm.maxThreshold"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-form-item> </el-form-item>
@ -243,6 +274,4 @@ export default {
</div> </div>
</template> </template>
<style scoped lang="scss"> <style scoped lang="scss"></style>
</style>

156
src/views/sluice/runManage/monitoring/sluice/manage/index.vue

@ -1,18 +1,18 @@
<!-- 巡查项目管理-水闸 --> <!-- 巡查项目管理-水闸 -->
<script> <script>
import Edit from './components/edit.vue' import Edit from "./components/edit.vue";
import { import {
getDicts, getDicts,
postSZDeviceList, postSZDeviceList,
postSZDevice, postSZDevice,
putSZDevice, putSZDevice,
delSZDevice delSZDevice,
} from "@/api/management"; } from "@/api/management";
let that let that;
export default { export default {
name: "manage", name: "manage",
components: { components: {
Edit Edit,
}, },
data() { data() {
return { return {
@ -22,13 +22,13 @@ export default {
xcDeviceStatus: [], xcDeviceStatus: [],
searchForm: { searchForm: {
type: -1, type: -1,
warningLevel: '', warningLevel: "",
name: '' name: "",
}, },
dialog: { dialog: {
title: '新增操作记录', title: "新增操作记录",
dom: '', dom: "",
visible: false visible: false,
}, },
mdl: null, mdl: null,
tableData: [], // tableData: [], //
@ -56,32 +56,32 @@ export default {
// //
resetSearch() { resetSearch() {
this.pageData.pageNum = 1; this.pageData.pageNum = 1;
if (!this.$refs['searchForm']) return if (!this.$refs["searchForm"]) return;
this.$refs['searchForm'].resetFields() this.$refs["searchForm"].resetFields();
this.getTableData(); this.getTableData();
}, },
// //
handleAdd() { handleAdd() {
this.dialog.dom = 'Edit' this.dialog.dom = "Edit";
this.dialog.visible = true this.dialog.visible = true;
}, },
handleCheck(row) { handleCheck(row) {
this.dialog.dom = 'Edit' this.dialog.dom = "Edit";
this.mdl = {...row} this.mdl = { ...row };
this.dialog.visible = true this.dialog.visible = true;
}, },
handleEdit(row) { handleEdit(row) {
this.dialog.dom = 'Edit' this.dialog.dom = "Edit";
this.mdl = { this.mdl = {
eventType: 'edit', eventType: "edit",
...row ...row,
} };
this.dialog.visible = true this.dialog.visible = true;
}, },
async handleDelete(row) { async handleDelete(row) {
await delSZDevice(row.id) await delSZDevice(row.id);
this.$message.success('删除成功') this.$message.success("删除成功");
this.getTableData() this.getTableData();
}, },
// //
submitForm() { submitForm() {
@ -94,14 +94,14 @@ export default {
{ {
maxThreshold: from.maxThreshold, maxThreshold: from.maxThreshold,
minThreshold: from.minThreshold, minThreshold: from.minThreshold,
reportInterval: from.reportInterval reportInterval: from.reportInterval,
} },
], ],
wagaCode: this.$route.query.wagaCode wagaCode: this.$route.query.wagaCode,
}) });
this.$message.success('修改成功') this.$message.success("修改成功");
this.closeDialog() this.closeDialog();
this.getTableData() this.getTableData();
} else { } else {
await postSZDevice({ await postSZDevice({
...from, ...from,
@ -109,31 +109,33 @@ export default {
{ {
maxThreshold: from.maxThreshold, maxThreshold: from.maxThreshold,
minThreshold: from.minThreshold, minThreshold: from.minThreshold,
reportInterval: from.reportInterval reportInterval: from.reportInterval,
} },
], ],
wagaCode: this.$route.query.wagaCode wagaCode: this.$route.query.wagaCode,
}) });
this.$message.success('新增成功') this.$message.success("新增成功");
this.closeDialog() this.closeDialog();
this.getTableData() this.getTableData();
} }
}) });
}, },
// dialog // dialog
closeDialog() { closeDialog() {
this.dialog.visible = false this.dialog.visible = false;
this.mdl = null this.mdl = null;
}, },
// //
getTableData() { getTableData() {
postSZDeviceList({ postSZDeviceList({
data: { data: {
type: this.searchForm.type === -1 ? '' : this.searchForm.type, type: this.searchForm.type === -1 ? "" : this.searchForm.type,
name: this.searchForm.name, name: this.searchForm.name,
warningLevel: this.searchForm.warningLevel === -1 ? '' : this.searchForm.warningLevel, warningLevel:
wagaCode: this.$route.query.wagaCode this.searchForm.warningLevel === -1
? ""
: this.searchForm.warningLevel,
wagaCode: this.$route.query.wagaCode,
}, },
cv: { cv: {
name: "name", name: "name",
@ -150,23 +152,25 @@ export default {
}, },
}, },
created() { created() {
that = this that = this;
}, },
filters: { filters: {
// //
filterwarnningType(price) { filterwarnningType(price) {
const data = that.xcWarnningType.filter((res) => res.dictValue == price) const data = that.xcWarnningType.filter((res) => res.dictValue == price);
return data[0] ? data[0].dictLabel : '/' return data[0] ? data[0].dictLabel : "/";
}, },
// //
filterwarnningLevel(price) { filterwarnningLevel(price) {
const data = that.xcWarnningLevelType.filter((res) => res.dictValue == price) const data = that.xcWarnningLevelType.filter(
return data[0] ? data[0].dictLabel : '/' (res) => res.dictValue == price
);
return data[0] ? data[0].dictLabel : "/";
}, },
// //
filterdeviceType(price) { filterdeviceType(price) {
const data = that.xcDeviceType.filter((res) => res.dictValue == price) const data = that.xcDeviceType.filter((res) => res.dictValue == price);
return data[0] ? data[0].dictLabel : '/' return data[0] ? data[0].dictLabel : "/";
}, },
// //
filterStatus(price) { filterStatus(price) {
@ -201,7 +205,12 @@ export default {
<div class="slider-right"> <div class="slider-right">
<div class="top-title">水闸动态监测管理</div> <div class="top-title">水闸动态监测管理</div>
<div class="table-box"> <div class="table-box">
<el-form inline :model="searchForm" ref="searchForm" class="demo-ruleForm"> <el-form
inline
:model="searchForm"
ref="searchForm"
class="demo-ruleForm"
>
<el-form-item label="设备类型:" prop="type"> <el-form-item label="设备类型:" prop="type">
<el-select v-model="searchForm.type" placeholder="请选择"> <el-select v-model="searchForm.type" placeholder="请选择">
<el-option <el-option
@ -225,10 +234,16 @@ export default {
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="设备名称:" prop="name"> <el-form-item label="设备名称:" prop="name">
<el-input v-model="searchForm.name" class="search-input" placeholder="请输入设备名称"></el-input> <el-input
v-model="searchForm.name"
class="search-input"
placeholder="请输入设备名称"
></el-input>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button class="search-btn" type="success" @click="search()">查询</el-button> <el-button class="search-btn" type="success" @click="search()"
>查询</el-button
>
<el-button @click="resetSearch()">重置</el-button> <el-button @click="resetSearch()">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -239,8 +254,7 @@ export default {
v-hasPermi="['sz:run:dtjc:add']" v-hasPermi="['sz:run:dtjc:add']"
@click="handleAdd()" @click="handleAdd()"
>新增 >新增
</el-button </el-button>
>
<el-table height="625" :data="tableData" border style="width: 100%"> <el-table height="625" :data="tableData" border style="width: 100%">
<el-table-column type="index" align="center" label="序号"> <el-table-column type="index" align="center" label="序号">
</el-table-column> </el-table-column>
@ -274,7 +288,12 @@ export default {
label="预警时间" label="预警时间"
> >
</el-table-column> </el-table-column>
<el-table-column prop="address" align="center" label="操作" min-width="200"> <el-table-column
prop="address"
align="center"
label="操作"
min-width="200"
>
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
style="margin-right: 16px" style="margin-right: 16px"
@ -308,8 +327,7 @@ export default {
slot="reference" slot="reference"
v-hasPermi="['sz:run:dtjc:delete']" v-hasPermi="['sz:run:dtjc:delete']"
>删除 >删除
</el-button </el-button>
>
</el-popconfirm> </el-popconfirm>
</template> </template>
</el-table-column> </el-table-column>
@ -331,15 +349,19 @@ export default {
:title="dialog.title" :title="dialog.title"
@close="closeDialog" @close="closeDialog"
:visible.sync="dialog.visible" :visible.sync="dialog.visible"
width="50%" width="820px"
> >
<component v-if="dialog.visible" :is="dialog.dom" ref="component" :model="mdl"></component> <component
v-if="dialog.visible"
:is="dialog.dom"
ref="component"
:model="mdl"
></component>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button size="mini" @click="closeDialog"> </el-button> <el-button size="mini" @click="closeDialog"> </el-button>
<el-button size="mini" type="primary" @click="submitForm" <el-button size="mini" type="primary" @click="submitForm"
>保存 >保存
</el-button </el-button>
>
</div> </div>
</el-dialog> </el-dialog>
</div> </div>
@ -355,9 +377,13 @@ export default {
font-weight: 600; font-weight: 600;
} }
.demo-ruleForm {
display: inline-block;
}
.table-box { .table-box {
width: 100%; width: 100%;
height: calc(100% - 50px - 24px); height: calc(100% - 24px);
margin-top: 24px; margin-top: 24px;
padding: 16px; padding: 16px;
background-color: white; background-color: white;

4
src/views/sluice/runManage/monitoring/sluice/record/index.vue

@ -189,7 +189,7 @@ export default {
<el-input <el-input
v-model="searchForm.wagaName" v-model="searchForm.wagaName"
class="search-input" class="search-input"
placeholder="请输入设备名称" placeholder="请输入所属水闸"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="预警类型:" prop="warningType"> <el-form-item label="预警类型:" prop="warningType">
@ -298,7 +298,7 @@ export default {
.table-box { .table-box {
width: 100%; width: 100%;
height: calc(100% - 50px - 24px); height: calc(100% - 24px);
margin-top: 24px; margin-top: 24px;
padding: 16px; padding: 16px;
background-color: white; background-color: white;

Loading…
Cancel
Save