admin/zhgdyun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 贵阳项目名称 - 污水监测功能新增

Browse Source
This commit is contained in:
kun 2023-12-13 17:56:32 +08:00
parent 5e8bcf74ce
commit db62427fff
8 changed files with 707 additions and 1233 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/assets/js/api/sewageMonitor.js Normal file
View File

@ -0,0 +1,31 @@
/**
* api接口统一管理
*/
import {post, get} from '../http'
//污水监测 —— 设备信息
export const sewageDevAdd = data => post('xmgl/sewageDev/add', data);//添加
export const sewageDevEdit = data => post('xmgl/sewageDev/edit', data);//编辑
export const sewageDevDelete = data => post('xmgl/sewageDev/delete', data);//删除
export const sewageDevPage = data => get('xmgl/sewageDev/page', data); //查询分页列表数据
export const sewageDevList = data => get('xmgl/sewageDev/list', data); //查询列表数据
// 获取负责人
export const getCrewListDataApi = data => post('xmgl/systemUser/getProjectChilderSystemUserList', data); // 查询 所有整改人员
// 污水监测 —— 监测数据
export const sewageDataPage = data => get('xmgl/sewageData/dev/data', data); //查询列表数据
export const sewageMonitorDataPage = data => get('xmgl/sewageData/page', data); //查询监测记录数据
export const sewageMonitorDataExport = data => post('xmgl/sewageData/exportXls', data); //导出监测记录数据
//污水监测 —— 告警管理
export const sewageAlarmEdit = data => post('xmgl/sewageAlarm/edit', data);//编辑
export const sewageAlarmDelete = data => post('xmgl/sewageAlarm/delete', data);//删除
export const sewageAlarmPage = data => get('xmgl/sewageAlarm/page', data); //查询分页列表数据
//污水监测 —— 阈值管理
export const sewageThresholdEdit = data => post('xmgl/sewageWarnThreshold/edit', data);//编辑
export const sewageThresholdDetail = data => get('xmgl/sewageWarnThreshold/queryByDevSn', data);//根据devSn查询

2
src/assets/js/http.js
View File

@ -83,7 +83,7 @@ if (process.env.NODE_ENV == 'development') {
// axios.defaults.baseURL ='http://101.43.164.214:45001/' //上海张江
// axios.defaults.baseURL ='http://101.43.164.214:45011/' //上海优益（上海建工）
// axios.defaults.baseURL = 'http://192.168.34.221:28888/' //郭圣雄本地
axios.defaults.baseURL ='http://192.168.34.221:30002/' //郭圣雄本地
axios.defaults.baseURL ='http://192.168.34.221:30012/' //郭圣雄本地
// axios.defaults.baseURL = 'http://182.90.224.237:51234' //郭圣雄远程
// axios.defaults.baseURL ='http://101.43.164.214:45020/' //沈阳和盈
// axios.defaults.baseURL ='http://183.249.224.118:9000/' //嘉兴王江泾公用码头

8
src/router/index.js
View File

@ -2229,14 +2229,6 @@ const routes2 = [
"@/views/projectFront/sewageMonitor/alarmManagement.vue",
], resolve),
},
{
path: "/project/sewageMonitor/thresholdSet",
name: "污水监测-阈值设置",
component: (resolve) =>
require([
"@/views/projectFront/sewageMonitor/thresholdSet.vue",
], resolve),
},
// 智能张拉
{
path: "/project/intelligentTension/devManagement",

22
src/store/index.js
View File

@ -44,19 +44,19 @@ export default new Vuex.Store({
state: {
PAGESIZRS: [10, 20, 30, 50],
// UPLOADURL:'http://192.168.34.221:30001/upload/image/',// 郭圣雄
// FILEURL:'http://192.168.34.221:30001/image/',//郭圣雄
UPLOADURL:'http://192.168.34.221:30002/upload/image/',// 郭圣雄
FILEURL:'http://192.168.34.221:30002/image/',//郭圣雄
// UPLOADURL:'http://10.0.1.43:6023/upload/image',//测试
// FILEURL:'http://10.0.1.43:6023/image/',//测试
BASEURL: baseUrl
? baseUrl
: window.location.protocol + "//" + window.location.host + "/", //正式环境
UPLOADURL:
window.location.protocol +
"//" +
window.location.host +
"/upload/image", //正式环境
FILEURL: window.location.protocol + "//" + window.location.host + "/image/", //正式环境
// BASEURL: baseUrl
// ? baseUrl
// : window.location.protocol + "//" + window.location.host + "/", //正式环境
// UPLOADURL:
// window.location.protocol +
// "//" +
// window.location.host +
// "/upload/image", //正式环境
// FILEURL: window.location.protocol + "//" + window.location.host + "/image/", //正式环境
//---------------------------------------------------------------------------------------------
// BASEURL: baseUrl
// ? baseUrl

348
src/views/projectFront/sewageMonitor/alarmManagement.vue
View File

@ -4,56 +4,43 @@
<!-- 智能张拉——设备管理 -->
<el-form :inline="true" ref="searchForm" :model="searchForm" size="medium">
<el-form-item label="设备名称">
<el-input v-model="searchForm.deviceName" placeholder="请输入"></el-input>
<el-select v-model="searchForm.devSn" clearable placeholder="请选择">
<el-option v-for="(item, index) in devList" :key="index" :label="item.devName" :value="item.devSn">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="梁场名称">
<el-input v-model="searchForm.belongBeamField" placeholder="请输入"></el-input>
<el-form-item label="出料时间">
<el-date-picker v-model="searchForm.time" type="datetimerange" value-format="yyyy-MM-dd HH:mm:ss"
range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" plain @click="getList">{{ $t('message.energyManage.waybill.query') }}</el-button>
<el-button type="warning" plain @click="refresh">{{ $t('message.deviceManage.refresh') }}</el-button>
<el-button type="primary" size="medium" @click="add">新增</el-button>
</el-form-item>
</el-form>
</div>
<div class="table_wrap whiteBlock">
<el-table class="tables" :data="List">
<!-- <el-table-column prop="image" label="照片" align="center">
<el-table-column prop="devName" align="center" label="设备名称"></el-table-column>
<el-table-column prop="monitorParam" align="center" label="监测参数"></el-table-column>
<el-table-column prop="alarmDetail" align="center" label="告警详情"></el-table-column>
<el-table-column prop="monitorValue" align="center" label="监测值"></el-table-column>
<el-table-column prop="beginTime" align="center" label="开始时间"></el-table-column>
<el-table-column prop="endTime" align="center" label="结束时间"></el-table-column>
<el-table-column prop="joinPartyDeclaration" align="center" label="状态">
<template slot-scope="scope">
<img
:preview="scope.row.image[0] ? scope.row.image[0].url : []"
:src="scope.row.image[0] ? scope.row.image[0].url : []"
alt=""
width="50px"
/>
<div>
<span :class="scope.row.alarmType == 1 ? 'status1' : scope.row.alarmType == 2 ? 'status2' : ''">{{
scope.row.alarmType == 1 ? '预警' : scope.row.alarmType == 2 ? '告警' : '正常' }}</span>
</div>
</template>
</el-table-column> -->
<el-table-column prop="deviceName" align="center" label="设备名称"></el-table-column>
<el-table-column prop="devSn" align="center" label="设备编码"></el-table-column>
<el-table-column prop="deviceModel" align="center" label="设备型号"></el-table-column>
<el-table-column prop="manufacturerName" align="center" label="厂家名称"></el-table-column>
<el-table-column prop="entryTime" align="center" label="进场时间"></el-table-column>
<el-table-column prop="dutyUserName" align="center" label="负责人"></el-table-column>
<el-table-column prop="belongBeamField" align="center" label="所属梁场">
<!-- <template slot-scope="scope">{{scope.row.politicalStatus==2?'中共预备党员':'.'}}</template> -->
</el-table-column>
<!-- <el-table-column prop="joinPartyDeclaration" align="center" label="入党誓言">
<template slot-scope="scope"
><div class="textStyle" :title="scope.row.joinPartyDeclaration">
{{ scope.row.joinPartyDeclaration }}
</div></template
>
</el-table-column> -->
<el-table-column label="操作" align="center" width="250px">
<el-table-column label="操作" align="center" width="200px">
<template slot-scope="scope">
<div class="tableBtns">
<div class="operationText" @click.stop="openDetail(scope.row)">
<i class="el-icon-tickets" style="color: #8dacfa; font-size: 16px; margin-right: 2px"></i>
<span style="white-space: nowrap;">详情</span>
</div>
<div @click="edit(scope.row)" class="operationText">
<img src="@/assets/images/icon-edit.png" width="15px" height="15px" />
<span style="white-space: nowrap;">编辑</span>
<div class="operationBtn">
<div @click="edit(scope.row)" :class="scope.row.handleDone == 1 ? 'operationStatus2' : 'operationStatus1'">
<span style="white-space: nowrap;">{{ scope.row.handleDone == 1 ? '已闭合' : '待处置' }}</span>
</div>
<div @click="deleteDev(scope.row)" class="operationText">
<img src="@/assets/images/icon-delete.png" width="15px" height="15px" />
@ -63,77 +50,38 @@
</template>
</el-table-column>
</el-table>
<el-pagination
class="pagerBox"
@size-change="SizeChange"
@current-change="CurrentChange"
:current-page="pagInfo.pageNo"
:page-sizes="$store.state.PAGESIZRS"
:page-size="pagInfo.pageSize"
layout="total, sizes, prev, pager, next"
:total="Number(pagInfo.total)"
background
></el-pagination>
<el-pagination class="pagerBox" @size-change="SizeChange" @current-change="CurrentChange"
:current-page="pagInfo.pageNo" :page-sizes="$store.state.PAGESIZRS" :page-size="pagInfo.pageSize"
layout="total, sizes, prev, pager, next" :total="Number(pagInfo.total)" background></el-pagination>
</div>
<el-dialog :modal-append-to-body="false" @close="close" :title="title" :visible.sync="dialogShow" width="667px">
<div class="dialog_content">
<el-form size="medium" ref="addEditForm" :model="addEditForm" :rules="addEditRules" label-width="120px" class="dialogFormBox">
<el-form-item label="设备名称" prop="deviceName">
<el-input :disabled="isDetail" v-model="addEditForm.deviceName" placeholder="请输入"></el-input>
<el-form size="medium" ref="addEditForm" :model="addEditForm" :rules="addEditRules" label-width="120px"
class="dialogFormBox">
<el-form-item label="处置结果" prop="handleResult">
<el-radio-group v-model="addEditForm.handleResult">
<el-radio :label='1' name='已处置'>已处置</el-radio>
<el-radio :label='2' name="误报忽略">误报忽略</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="设备编码" prop="devSn">
<el-input :disabled="isDetail" v-model="addEditForm.devSn" placeholder="请输入"></el-input>
<el-form-item label="描述" prop="description">
<el-input type="textarea" v-model="addEditForm.description" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="设备型号" prop="deviceModel">
<el-input :disabled="isDetail" v-model="addEditForm.deviceModel" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="厂家名称" prop="manufacturerName">
<el-input :disabled="isDetail" v-model="addEditForm.manufacturerName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="进场时间" prop="entryTime">
<el-date-picker
:disabled="isDetail"
value-format="yyyy-MM-dd HH:mm:ss"
v-model="addEditForm.entryTime"
type="datetime"
placeholder="请选择时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="负责人" prop="dutyUserId">
<el-select v-model="addEditForm.dutyUserId" placeholder="请选择" :disabled="isDetail" @change="dutySelectChange">
<el-option v-for="(item, index) in dutyList" :key="index" :label="item.realName" :value="item.userId"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="所属梁场" prop="belongBeamField">
<el-input :disabled="isDetail" v-model="addEditForm.belongBeamField" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="设备图片">
<el-upload
:disabled="isDetail"
:action="$store.state.UPLOADURL"
list-type="picture-card"
multiple
name="files"
:limit="1"
accept=".png, .jpg, .jpeg"
:file-list="fileUplodList"
<el-form-item label="上传图片">
<el-upload :action="$store.state.UPLOADURL" list-type="picture-card" multiple
name="files" :limit="1" accept=".png, .jpg, .jpeg" :file-list="fileUplodList"
:on-exceed="(file, fileList) => handleExceed(file, fileList)"
:on-success="(res, file) => handleSuccess(res, file)"
:on-remove="(file, fileList) => handleRemove(file, fileList)"
>
:on-remove="(file, fileList) => handleRemove(file, fileList)">
<i class="el-icon-plus"></i>
</el-upload>
</el-form-item>
<div class="dialog-footer">
<el-button class="cancleBtn" @click="dialogShow = false" icon="el-icon-circle-close" size="medium"
>{{ $t('message.deviceManage.cancel') }}
<el-button class="cancleBtn" @click="dialogShow = false" icon="el-icon-circle-close" size="medium">{{
$t('message.deviceManage.cancel') }}
</el-button>
<el-button type="primary" icon="el-icon-circle-check" @click="submit" size="medium"
>{{ $t('message.deviceManage.save') }}
<el-button type="primary" icon="el-icon-circle-check" @click="submit" size="medium">{{
$t('message.deviceManage.save') }}
</el-button>
</div>
</el-form>
@ -143,23 +91,21 @@
</template>
<script>
import {
smartTensionDevAdd,
smartTensionDevDelete,
smartTensionDevEdit,
smartTensionDevPage,
sewageAlarmDelete,
sewageAlarmEdit,
sewageAlarmPage,
sewageDevList,
getCrewListDataApi // 负责人下拉
} from '@/assets/js/api/intelligentTension.js'
} from '@/assets/js/api/sewageMonitor.js'
import { checkPhone } from '@/assets/js/util.js'
export default {
mounted() {},
mounted() { },
created() {
this.getList()
this.getDutyPerson()
this.getDevList();
},
data() {
return {
isDetail: false, //是否详情
dutyList: [], // 负责人
fileUplodList: [],
title: '',
dialogShow: false,
@ -168,153 +114,76 @@ export default {
pageSize: 10, //条数
total: 0 //总条数
},
devList: [],
List: [],
addEditForm: {
belongBeamField: '',
createTime: '',
devSn: '',
deviceModel: '',
deviceName: '',
entryTime: '',
equipmentPicture: '',
manufacturerName: '',
dutyUserId: '',
dutyUserName: '',
projectSn: '',
updateTime: ''
handleResult: 1,
description: ''
},
addEditRules: {
deviceName: [
handleResult: [
{
required: true,
message: '必填',
trigger: 'blur'
}
],
devSn: [
{
required: true,
message: '必填',
trigger: 'blur'
}
],
belongBeamField: [
{
required: true,
message: '必填',
trigger: 'blur'
message: '必选',
trigger: 'change'
}
]
},
searchForm: {
belongBeamField: '',
deviceName: ''
devSn: '',
time: ""
}
}
},
methods: {
// 负责人下拉回调
dutySelectChange(e) {
const item = this.dutyList.find(item => item.userId === e);
this.addEditForm.dutyUserName = item.realName
console.log("下拉选择",e,this.addEditForm.dutyUserName);
},
//查询负责人下拉
getDutyPerson() {
let data = {
projectSn: this.$store.state.projectSn,
}
getCrewListDataApi(data).then(res => {
if (res.code == 200) {
this.dutyList = res.result
console.log('获取负责人下拉', this.dutyList)
} else {
this.$message.error(res.message)
// 查询设备列表
getDevList() {
sewageDevList().then((result) => {
if (result.success) {
this.devList = result.result;
}
})
});
},
//查询列表
getList() {
smartTensionDevPage({
pageNo: this.pagInfo.pageNo,
pageSize: this.pagInfo.pageSize,
let requestData = {
projectSn: this.$store.state.projectSn,
deviceName: this.searchForm.deviceName,
belongBeamField: this.searchForm.belongBeamField,
}).then(result => {
devSn: this.searchForm.devSn,
pageNo: this.pagInfo.pageNo,
pageSize: this.pagInfo.pageSize
}
if (this.searchForm.time && this.searchForm.time.length > 0) {
requestData.createTime_begin = this.searchForm.time[0]
requestData.createTime_end = this.searchForm.time[1]
}
sewageAlarmPage(requestData).then(result => {
if (result.success) {
// result.result.records.map(item => {
// if (item.image.includes('[')) {
// item.image = JSON.parse(item.image)
// if (item.image.length !== 0 && !item.image[0].url.includes(this.$store.state.FILEURL)) {
// item.image[0].url = this.$store.state.FILEURL + item.image[0].url
// }
// } else {
// let url = item.image
// if (url.length !== 0 && !url.includes(this.$store.state.FILEURL)) {
// item.image = [{}]
// item.image[0].url = this.$store.state.FILEURL + url
// }
// }
// })
this.List = result.result.records
this.pagInfo.total = result.result.total
}
})
},
add() {
this.title = '新增'
this.dialogShow = true
this.fileUplodList = []
this.close()
},
edit(obj) {
this.title = '编辑'
this.dialogShow = true
this.addEditForm = JSON.parse(JSON.stringify(obj))
this.fileUplodList = JSON.parse(obj.equipmentPicture)
},
openDetail(obj) {
this.title = '详情'
this.dialogShow = true
this.isDetail = true
this.addEditForm = JSON.parse(JSON.stringify(obj))
this.fileUplodList = JSON.parse(obj.equipmentPicture)
if (obj.handleDone != 1) {
this.title = '处置详情'
this.addEditForm = { ...this.addEditForm, id: obj.id }
this.dialogShow = true
}
},
submit() {
// if (this.addEditForm.contactNumber) {
// if (!checkPhone(this.addEditForm.contactNumber)) {
// this.$message.error('请输入正确的手机号码')
// return
// }
// }
let params = JSON.parse(JSON.stringify(this.addEditForm))
params.projectSn = this.$store.state.projectSn
params.equipmentPicture = JSON.stringify(this.fileUplodList)
// if (this.fileUplodList.length > 0) {
// this.$message.error('请上传照片')
// return false
// }
params.image = JSON.stringify(this.fileUplodList)
params.handleDone = 1;
this.$refs.addEditForm.validate(valid => {
if (valid) {
if (this.title == '新增') {
smartTensionDevAdd(params).then(result => {
if (result.success) {
this.$message.success(result.message)
this.getList()
}
})
} else if (this.title == '编辑') {
smartTensionDevEdit(params).then(result => {
if (result.success) {
this.$message.success(result.message)
this.getList()
}
})
}
sewageAlarmEdit(params).then(result => {
if (result.success) {
this.$message.success(result.message)
this.getList()
}
})
this.dialogShow = false
} else {
return false
@ -328,7 +197,7 @@ export default {
type: 'warning'
})
.then(() => {
smartTensionDevDelete({ id: obj.id }).then(res => {
sewageAlarmDelete({ id: obj.id }).then(res => {
if (res.success) {
this.getList()
this.$message({
@ -356,7 +225,7 @@ export default {
this.fileUplodList = fileList
},
handleExceed(file, fileList) {
console.log("超出限制",file)
console.log("超出限制", file)
this.$message.warning("只能上传一张图片")
},
handleSuccess(res, file, type) {
@ -368,7 +237,6 @@ export default {
}
},
close() {
this.isDetail = false
this.addEditForm = {}
this.fileUplodList = []
this.$nextTick(() => {
@ -393,13 +261,37 @@ export default {
}
</script>
<style lang="less" scoped>
.tables2 {
min-height: auto;
.status1 {
color: #E69436
}
.textStyle {
width: 140px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
.status2 {
color: #EA3941
}
.operationBtn {
display: flex;
align-items: center;
justify-content: space-around;
.operationStatus1 {
width: 80px;
height: 25px;
line-height: 25px;
text-align: center;
background-color: #5181F6;
color: white;
cursor: pointer;
}
.operationStatus2 {
width: 80px;
height: 25px;
line-height: 25px;
text-align: center;
background-color: #A2A4AF;
color: white;
cursor: pointer;
}
}
</style>

481
src/views/projectFront/sewageMonitor/devManagement.vue
View File

@ -4,53 +4,39 @@
<!-- 智能张拉——设备管理 -->
<el-form :inline="true" ref="searchForm" :model="searchForm" size="medium">
<el-form-item label="设备名称">
<el-input v-model="searchForm.deviceName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="梁场名称">
<el-input v-model="searchForm.belongBeamField" placeholder="请输入"></el-input>
<el-input v-model="searchForm.devName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" plain @click="getList">{{ $t('message.energyManage.waybill.query') }}</el-button>
<el-button type="warning" plain @click="refresh">{{ $t('message.deviceManage.refresh') }}</el-button>
<el-button type="primary" plain @click="getList">{{
$t("message.energyManage.waybill.query")
}}</el-button>
<el-button type="warning" plain @click="refresh">{{
$t("message.deviceManage.refresh")
}}</el-button>
<el-button type="primary" size="medium" @click="add">新增</el-button>
</el-form-item>
</el-form>
</div>
<div class="table_wrap whiteBlock">
<el-table class="tables" :data="List">
<!-- <el-table-column prop="image" label="照片" align="center">
<template slot-scope="scope">
<img
:preview="scope.row.image[0] ? scope.row.image[0].url : []"
:src="scope.row.image[0] ? scope.row.image[0].url : []"
alt=""
width="50px"
/>
</template>
</el-table-column> -->
<el-table-column prop="deviceName" align="center" label="设备名称"></el-table-column>
<el-table-column prop="devName" align="center" label="设备名称"></el-table-column>
<el-table-column prop="devSn" align="center" label="设备编码"></el-table-column>
<el-table-column prop="deviceModel" align="center" label="设备型号"></el-table-column>
<el-table-column prop="manufacturerName" align="center" label="厂家名称"></el-table-column>
<el-table-column prop="entryTime" align="center" label="进场时间"></el-table-column>
<el-table-column prop="dutyUserName" align="center" label="负责人"></el-table-column>
<el-table-column prop="belongBeamField" align="center" label="所属梁场">
<!-- <template slot-scope="scope">{{scope.row.politicalStatus==2?'中共预备党员':'.'}}</template> -->
<el-table-column prop="installLocation" align="center" label="安装位置"></el-table-column>
<el-table-column prop="personInChargeName" align="center" label="负责人"></el-table-column>
<el-table-column prop="phoneNumber" align="center" label="负责人电话"></el-table-column>
<el-table-column prop="image" align="center" label="设备图片">
<template slot-scope="scope">
<div class="devImage">
<el-image v-if="JSON.parse(scope.row.image)[0]"
:preview-src-list="JSON.parse(scope.row.image) ? [JSON.parse(scope.row.image)[0].url] : []"
:src="JSON.parse(scope.row.image)[0] ? JSON.parse(scope.row.image)[0].url : []" alt=""></el-image>
</div>
</template>
</el-table-column>
<!-- <el-table-column prop="joinPartyDeclaration" align="center" label="入党誓言">
<template slot-scope="scope"
><div class="textStyle" :title="scope.row.joinPartyDeclaration">
{{ scope.row.joinPartyDeclaration }}
</div></template
>
</el-table-column> -->
<el-table-column label="操作" align="center" width="250px">
<el-table-column prop="remark" align="center" label="备注"></el-table-column>
<el-table-column label="操作" align="center" width="300px">
<template slot-scope="scope">
<div class="tableBtns">
<div class="operationText" @click.stop="openDetail(scope.row)">
<i class="el-icon-tickets" style="color: #8dacfa; font-size: 16px; margin-right: 2px"></i>
<span style="white-space: nowrap;">详情</span>
</div>
<div @click="edit(scope.row)" class="operationText">
<img src="@/assets/images/icon-edit.png" width="15px" height="15px" />
<span style="white-space: nowrap;">编辑</span>
@ -59,81 +45,95 @@
<img src="@/assets/images/icon-delete.png" width="15px" height="15px" />
<span style="white-space: nowrap;">删除</span>
</div>
<div @click="setYu(scope.row)" class="operationText">
<img src="@/assets/images/yu.png" width="15px" height="15px" />
<span style="white-space: nowrap;">预警值设置</span>
</div>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
class="pagerBox"
@size-change="SizeChange"
@current-change="CurrentChange"
:current-page="pagInfo.pageNo"
:page-sizes="$store.state.PAGESIZRS"
:page-size="pagInfo.pageSize"
layout="total, sizes, prev, pager, next"
:total="Number(pagInfo.total)"
background
></el-pagination>
<el-pagination class="pagerBox" @size-change="SizeChange" @current-change="CurrentChange"
:current-page="pagInfo.pageNo" :page-sizes="$store.state.PAGESIZRS" :page-size="pagInfo.pageSize"
layout="total, sizes, prev, pager, next" :total="Number(pagInfo.total)" background></el-pagination>
</div>
<el-dialog :modal-append-to-body="false" @close="close" :title="title" :visible.sync="dialogShow" width="667px">
<div class="dialog_content">
<el-form size="medium" ref="addEditForm" :model="addEditForm" :rules="addEditRules" label-width="120px" class="dialogFormBox">
<el-form-item label="设备名称" prop="deviceName">
<el-input :disabled="isDetail" v-model="addEditForm.deviceName" placeholder="请输入"></el-input>
<el-form size="medium" ref="addEditForm" :model="addEditForm" :rules="addEditRules" label-width="120px"
class="dialogFormBox">
<el-form-item label="设备名称" prop="devName">
<el-input :disabled="isDetail" v-model="addEditForm.devName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="设备编码" prop="devSn">
<el-input :disabled="isDetail" v-model="addEditForm.devSn" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="设备型号" prop="deviceModel">
<el-input :disabled="isDetail" v-model="addEditForm.deviceModel" placeholder="请输入"></el-input>
<el-form-item label="安装位置" prop="installLocation">
<el-input :disabled="isDetail" v-model="addEditForm.installLocation" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="厂家名称" prop="manufacturerName">
<el-input :disabled="isDetail" v-model="addEditForm.manufacturerName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="进场时间" prop="entryTime">
<el-date-picker
:disabled="isDetail"
value-format="yyyy-MM-dd HH:mm:ss"
v-model="addEditForm.entryTime"
type="datetime"
placeholder="请选择时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="负责人" prop="dutyUserId">
<el-select v-model="addEditForm.dutyUserId" placeholder="请选择" :disabled="isDetail" @change="dutySelectChange">
<el-option v-for="(item, index) in dutyList" :key="index" :label="item.realName" :value="item.userId"> </el-option>
<el-form-item label="负责人" prop="personInCharge">
<el-select v-model="addEditForm.personInCharge" placeholder="请选择" :disabled="isDetail"
@change="dutySelectChange">
<el-option v-for="(item, index) in dutyList" :key="index" :label="item.realName" :value="item.userId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="所属梁场" prop="belongBeamField">
<el-input :disabled="isDetail" v-model="addEditForm.belongBeamField" placeholder="请输入"></el-input>
<el-form-item label="负责人电话" prop="phoneNumber">
<el-input :disabled="isDetail" v-model="addEditForm.phoneNumber" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="设备图片">
<el-upload
:disabled="isDetail"
:action="$store.state.UPLOADURL"
list-type="picture-card"
multiple
name="files"
:limit="1"
accept=".png, .jpg, .jpeg"
:file-list="fileUplodList"
<el-form-item label="上传图片">
<el-upload :disabled="isDetail" :action="$store.state.UPLOADURL" list-type="picture-card" multiple
name="files" :limit="1" accept=".png, .jpg, .jpeg" :file-list="fileUplodList"
:on-exceed="(file, fileList) => handleExceed(file, fileList)"
:on-success="(res, file) => handleSuccess(res, file)"
:on-remove="(file, fileList) => handleRemove(file, fileList)"
>
:on-remove="(file, fileList) => handleRemove(file, fileList)">
<i class="el-icon-plus"></i>
</el-upload>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input :disabled="isDetail" v-model="addEditForm.remark" placeholder="请输入"></el-input>
</el-form-item>
<div class="dialog-footer">
<el-button class="cancleBtn" @click="dialogShow = false" icon="el-icon-circle-close" size="medium"
>{{ $t('message.deviceManage.cancel') }}
<el-button class="cancleBtn" @click="dialogShow = false" icon="el-icon-circle-close" size="medium">{{
$t("message.deviceManage.cancel") }}
</el-button>
<el-button type="primary" icon="el-icon-circle-check" @click="submit" size="medium"
>{{ $t('message.deviceManage.save') }}
<el-button type="primary" icon="el-icon-circle-check" @click="submit" size="medium">{{
$t("message.deviceManage.save") }}
</el-button>
</div>
</el-form>
</div>
</el-dialog>
<el-dialog :modal-append-to-body="false" @close="dialogSetShow = false" title="编辑预警值设置" :visible.sync="dialogSetShow"
width="667px">
<div class="dialog_content">
<el-form size="medium" ref="setEditForm" :model="setEditForm" label-width="120px" class="dialogFormBox">
<el-form-item label="PH值" prop="phValue">
<el-input v-model="setEditForm.phValue" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="电导率(μS/cm)" prop="conductivity">
<el-input v-model="setEditForm.conductivity" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="水温(℃)" prop="waterTemperature">
<el-input v-model="setEditForm.waterTemperature" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="溶解氧(mg/L)" prop="dissolvedOxygen">
<el-input v-model="setEditForm.dissolvedOxygen" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="浊度值(NTU)" prop="turbidityValue">
<el-input v-model="setEditForm.turbidityValue" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="流速(m/s)" prop="flowVelocity">
<el-input v-model="setEditForm.flowVelocity" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="水位(m)" prop="waterLevel">
<el-input v-model="setEditForm.waterLevel" placeholder="请输入"></el-input>
</el-form-item>
<div class="dialog-footer">
<el-button class="cancleBtn" @click="dialogSetShow = false" icon="el-icon-circle-close" size="medium">{{
$t("message.deviceManage.cancel") }}
</el-button>
<el-button type="primary" icon="el-icon-circle-check" @click="submitSet" size="medium">{{
$t("message.deviceManage.save") }}
</el-button>
</div>
</el-form>
@ -143,259 +143,270 @@
</template>
<script>
import {
smartTensionDevAdd,
smartTensionDevDelete,
smartTensionDevEdit,
smartTensionDevPage,
getCrewListDataApi // 负责人下拉
} from '@/assets/js/api/intelligentTension.js'
import { checkPhone } from '@/assets/js/util.js'
sewageDevAdd,
sewageDevDelete,
sewageDevEdit,
sewageDevPage,
getCrewListDataApi,
sewageThresholdDetail,
sewageThresholdEdit
} from "@/assets/js/api/sewageMonitor.js";
export default {
mounted() {},
mounted() { },
created() {
this.getList()
this.getDutyPerson()
this.getList();
this.getDutyPerson();
},
data() {
return {
isDetail: false, //是否详情
dutyList: [], // 负责人
fileUplodList: [],
title: '',
title: "",
dialogSetShow: false,
dialogShow: false,
pagInfo: {
pageNo: 1, //页数
pageSize: 10, //条数
total: 0 //总条数
total: 0, //总条数
},
List: [],
setEditForm: {
phValue: 100,
conductivity: 100,
waterTemperature: 100,
dissolvedOxygen: 100,
turbidityValue: 100,
flowVelocity: 100,
waterLevel: 100
},
addEditForm: {
belongBeamField: '',
createTime: '',
devSn: '',
deviceModel: '',
deviceName: '',
entryTime: '',
equipmentPicture: '',
manufacturerName: '',
dutyUserId: '',
dutyUserName: '',
projectSn: '',
updateTime: ''
createTime: "",
devSn: "",
installLocation: "",
devName: "",
personInChargeName: "",
personInCharge: "",
phoneNumber: "",
personInCharge: "",
image: "",
remark: "",
projectSn: "",
updateTime: "",
},
addEditRules: {
deviceName: [
devName: [
{
required: true,
message: '必填',
trigger: 'blur'
}
message: "必填",
trigger: "blur",
},
],
devSn: [
{
required: true,
message: '必填',
trigger: 'blur'
}
message: "必填",
trigger: "blur",
},
],
belongBeamField: [
phoneNumber: [
{
required: true,
message: '必填',
trigger: 'blur'
}
]
message: "请输入正确的手机号码",
trigger: "blur",
pattern: /^1(3|4|5|6|7|8|9)\d{9}$/,
},
],
},
searchForm: {
belongBeamField: '',
deviceName: ''
}
}
devName: "",
},
};
},
methods: {
// 设置阈值
async setYu(obj) {
const res = await sewageThresholdDetail({ devSn: obj.devSn })
let initForm = JSON.parse(JSON.stringify(this.setEditForm))
this.setEditForm = { ...this.setEditForm, ...res.result }
for(let i in initForm){
if(!this.setEditForm[i]){
this.setEditForm[i] = 100;
}
}
this.dialogSetShow = true;
},
// 负责人下拉回调
dutySelectChange(e) {
const item = this.dutyList.find(item => item.userId === e);
this.addEditForm.dutyUserName = item.realName
console.log("下拉选择",e,this.addEditForm.dutyUserName);
this.addEditForm.personInChargeName = item.realName
},
//查询负责人下拉
getDutyPerson() {
let data = {
projectSn: this.$store.state.projectSn,
}
getCrewListDataApi(data).then(res => {
};
getCrewListDataApi(data).then((res) => {
if (res.code == 200) {
this.dutyList = res.result
console.log('获取负责人下拉', this.dutyList)
this.dutyList = res.result;
console.log("获取负责人下拉", this.dutyList);
} else {
this.$message.error(res.message)
this.$message.error(res.message);
}
})
});
},
//查询列表
getList() {
smartTensionDevPage({
sewageDevPage({
pageNo: this.pagInfo.pageNo,
pageSize: this.pagInfo.pageSize,
projectSn: this.$store.state.projectSn,
deviceName: this.searchForm.deviceName,
belongBeamField: this.searchForm.belongBeamField,
}).then(result => {
devName: this.searchForm.devName,
}).then((result) => {
if (result.success) {
// result.result.records.map(item => {
// if (item.image.includes('[')) {
// item.image = JSON.parse(item.image)
// if (item.image.length !== 0 && !item.image[0].url.includes(this.$store.state.FILEURL)) {
// item.image[0].url = this.$store.state.FILEURL + item.image[0].url
// }
// } else {
// let url = item.image
// if (url.length !== 0 && !url.includes(this.$store.state.FILEURL)) {
// item.image = [{}]
// item.image[0].url = this.$store.state.FILEURL + url
// }
// }
// })
this.List = result.result.records
this.pagInfo.total = result.result.total
this.List = result.result.records;
this.pagInfo.total = result.result.total;
}
})
});
},
add() {
this.title = '新增'
this.dialogShow = true
this.fileUplodList = []
this.close()
this.title = "新增";
this.dialogShow = true;
this.fileUplodList = [];
this.close();
},
edit(obj) {
this.title = '编辑'
this.dialogShow = true
this.addEditForm = JSON.parse(JSON.stringify(obj))
this.fileUplodList = JSON.parse(obj.equipmentPicture)
this.title = "编辑";
this.dialogShow = true;
this.addEditForm = JSON.parse(JSON.stringify(obj));
this.fileUplodList = JSON.parse(obj.image);
},
openDetail(obj) {
this.title = '详情'
this.dialogShow = true
this.isDetail = true
this.addEditForm = JSON.parse(JSON.stringify(obj))
this.fileUplodList = JSON.parse(obj.equipmentPicture)
submitSet() {
let params = JSON.parse(JSON.stringify(this.setEditForm));
sewageThresholdEdit(params).then((result) => {
if (result.success) {
this.$message.success(result.message);
this.getList();
this.dialogSetShow = false;
}
});
},
submit() {
// if (this.addEditForm.contactNumber) {
// if (!checkPhone(this.addEditForm.contactNumber)) {
// this.$message.error('请输入正确的手机号码')
// return
// }
// }
let params = JSON.parse(JSON.stringify(this.addEditForm))
params.projectSn = this.$store.state.projectSn
params.equipmentPicture = JSON.stringify(this.fileUplodList)
let params = JSON.parse(JSON.stringify(this.addEditForm));
params.projectSn = this.$store.state.projectSn;
params.image = JSON.stringify(this.fileUplodList);
// if (this.fileUplodList.length > 0) {
// this.$message.error('请上传照片')
// return false
// }
this.$refs.addEditForm.validate(valid => {
this.$refs.addEditForm.validate((valid) => {
if (valid) {
if (this.title == '新增') {
smartTensionDevAdd(params).then(result => {
if (this.title == "新增") {
sewageDevAdd(params).then((result) => {
if (result.success) {
this.$message.success(result.message)
this.getList()
this.$message.success(result.message);
this.getList();
}
})
} else if (this.title == '编辑') {
smartTensionDevEdit(params).then(result => {
});
} else if (this.title == "编辑") {
sewageDevEdit(params).then((result) => {
if (result.success) {
this.$message.success(result.message)
this.getList()
this.$message.success(result.message);
this.getList();
}
})
});
}
this.dialogShow = false
this.dialogShow = false;
} else {
return false
return false;
}
})
});
},
deleteDev(obj) {
this.$confirm('此操作将永久删除, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
this.$confirm("此操作将永久删除, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
smartTensionDevDelete({ id: obj.id }).then(res => {
sewageDevDelete({ id: obj.id }).then((res) => {
if (res.success) {
this.getList()
this.getList();
this.$message({
type: 'success',
message: '删除成功!'
})
type: "success",
message: "删除成功!",
});
} else {
this.$message({
type: 'error',
message: res.message
})
type: "error",
message: res.message,
});
}
})
});
})
.catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
type: "info",
message: "已取消删除",
});
});
},
// 删除
handleRemove(file, fileList) {
this.fileUplodList = fileList
this.fileUplodList = fileList;
},
handleExceed(file, fileList) {
console.log("超出限制",file)
this.$message.warning("只能上传一张图片")
console.log("超出限制", file);
this.$message.warning("只能上传一张图片");
},
handleSuccess(res, file, type) {
if (res.status == 'SUCCESS') {
if (res.status == "SUCCESS") {
console.log(res);
this.fileUplodList.push({
name: file.name,
url: this.$store.state.FILEURL + file.response.data[0].imageUrl
})
url: this.$store.state.FILEURL + file.response.data[0].imageUrl,
});
}
},
close() {
this.isDetail = false
this.addEditForm = {}
this.fileUplodList = []
this.isDetail = false;
this.addEditForm = {};
this.fileUplodList = [];
this.$nextTick(() => {
this.$refs.addEditForm.clearValidate()
})
this.$refs.addEditForm.clearValidate();
});
},
SizeChange(val) {
this.pagInfo.pageSize = val
this.getList()
this.pagInfo.pageSize = val;
this.getList();
},
CurrentChange(val) {
this.pagInfo.pageNo = val
this.getList()
this.pagInfo.pageNo = val;
this.getList();
},
refresh() {
this.searchForm = {}
this.pagInfo.pageNo = 1 //页数
this.pagInfo.pageSize = 10 //条数
this.getList()
}
}
}
this.searchForm = {};
this.pagInfo.pageNo = 1; //页数
this.pagInfo.pageSize = 10; //条数
this.getList();
},
},
};
</script>
<style lang="less" scoped>
.tables2 {
min-height: auto;
}
.devImage {
/deep/ .el-image {
width: 80px;
height: 50px;
}
}
.textStyle {
width: 140px;
overflow: hidden;

643
src/views/projectFront/sewageMonitor/monitorData.vue
View File

@ -4,402 +4,355 @@
<!-- 智能张拉——设备管理 -->
<el-form :inline="true" ref="searchForm" :model="searchForm" size="medium">
<el-form-item label="设备名称">
<el-input v-model="searchForm.deviceName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="梁场名称">
<el-input v-model="searchForm.belongBeamField" placeholder="请输入"></el-input>
<el-select v-model="searchForm.devSn" placeholder="请选择">
<el-option v-for="(item, index) in devList" :key="index" :label="item.devName" :value="item.devSn">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" plain @click="getList">{{ $t('message.energyManage.waybill.query') }}</el-button>
<el-button type="warning" plain @click="refresh">{{ $t('message.deviceManage.refresh') }}</el-button>
<el-button type="primary" size="medium" @click="add">新增</el-button>
<el-button type="primary" plain @click="getList">{{
$t("message.energyManage.waybill.query")
}}</el-button>
<el-button type="warning" plain @click="refresh">{{
$t("message.deviceManage.refresh")
}}</el-button>
</el-form-item>
</el-form>
</div>
<div class="table_wrap whiteBlock">
<el-table class="tables" :data="List">
<!-- <el-table-column prop="image" label="照片" align="center">
<template slot-scope="scope">
<img
:preview="scope.row.image[0] ? scope.row.image[0].url : []"
:src="scope.row.image[0] ? scope.row.image[0].url : []"
alt=""
width="50px"
/>
</template>
</el-table-column> -->
<el-table-column prop="deviceName" align="center" label="设备名称"></el-table-column>
<el-table-column prop="devSn" align="center" label="设备编码"></el-table-column>
<el-table-column prop="deviceModel" align="center" label="设备型号"></el-table-column>
<el-table-column prop="manufacturerName" align="center" label="厂家名称"></el-table-column>
<el-table-column prop="entryTime" align="center" label="进场时间"></el-table-column>
<el-table-column prop="dutyUserName" align="center" label="负责人"></el-table-column>
<el-table-column prop="belongBeamField" align="center" label="所属梁场">
<!-- <template slot-scope="scope">{{scope.row.politicalStatus==2?'中共预备党员':'.'}}</template> -->
</el-table-column>
<!-- <el-table-column prop="joinPartyDeclaration" align="center" label="入党誓言">
<template slot-scope="scope"
><div class="textStyle" :title="scope.row.joinPartyDeclaration">
{{ scope.row.joinPartyDeclaration }}
</div></template
>
</el-table-column> -->
<el-table-column label="操作" align="center" width="250px">
<template slot-scope="scope">
<div class="tableBtns">
<div class="operationText" @click.stop="openDetail(scope.row)">
<i class="el-icon-tickets" style="color: #8dacfa; font-size: 16px; margin-right: 2px"></i>
<span style="white-space: nowrap;">详情</span>
<div class="table_wrap">
<vue-scroll style="height: calc(100% - 83px);">
<div class="list-content">
<div class="list-content-item" v-for="(item, index) in List" :key="index">
<div class="item-top">
<div class="line"></div>
<span>{{ item.devName }}</span>
<div @click="showDetail(item)">查看详情</div>
</div>
<div class="item-subtop">
{{ item.updateDate }}
</div>
<div class="item-bottom">
<div>
<span>PH值</span>
<span>{{ item.phValue }}</span>
</div>
<div @click="edit(scope.row)" class="operationText">
<img src="@/assets/images/icon-edit.png" width="15px" height="15px" />
<span style="white-space: nowrap;">编辑</span>
<div>
<span>电导率(μS/cm)</span>
<span>{{ item.conductivity }}</span>
</div>
<div @click="deleteDev(scope.row)" class="operationText">
<img src="@/assets/images/icon-delete.png" width="15px" height="15px" />
<span style="white-space: nowrap;">删除</span>
<div>
<span>水温(℃)</span>
<span>{{ item.waterTemperature }}</span>
</div>
<div>
<span>溶解氧(mg/L)</span>
<span>{{ item.dissolvedOxygen }}</span>
</div>
<div>
<span>浊度值(NTU)</span>
<span>{{ item.turbidityValue }}</span>
</div>
<div>
<span>流速(m/s)</span>
<span>{{ item.flowVelocity }}</span>
</div>
<div>
<span>水位(m)</span>
<span>{{ item.waterLevel }}</span>
</div>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
class="pagerBox"
@size-change="SizeChange"
@current-change="CurrentChange"
:current-page="pagInfo.pageNo"
:page-sizes="$store.state.PAGESIZRS"
:page-size="pagInfo.pageSize"
layout="total, sizes, prev, pager, next"
:total="Number(pagInfo.total)"
background
></el-pagination>
</div>
<el-dialog :modal-append-to-body="false" @close="close" :title="title" :visible.sync="dialogShow" width="667px">
<div class="dialog_content">
<el-form size="medium" ref="addEditForm" :model="addEditForm" :rules="addEditRules" label-width="120px" class="dialogFormBox">
<el-form-item label="设备名称" prop="deviceName">
<el-input :disabled="isDetail" v-model="addEditForm.deviceName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="设备编码" prop="devSn">
<el-input :disabled="isDetail" v-model="addEditForm.devSn" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="设备型号" prop="deviceModel">
<el-input :disabled="isDetail" v-model="addEditForm.deviceModel" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="厂家名称" prop="manufacturerName">
<el-input :disabled="isDetail" v-model="addEditForm.manufacturerName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="进场时间" prop="entryTime">
<el-date-picker
:disabled="isDetail"
value-format="yyyy-MM-dd HH:mm:ss"
v-model="addEditForm.entryTime"
type="datetime"
placeholder="请选择时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="负责人" prop="dutyUserId">
<el-select v-model="addEditForm.dutyUserId" placeholder="请选择" :disabled="isDetail" @change="dutySelectChange">
<el-option v-for="(item, index) in dutyList" :key="index" :label="item.realName" :value="item.userId"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="所属梁场" prop="belongBeamField">
<el-input :disabled="isDetail" v-model="addEditForm.belongBeamField" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="设备图片">
<el-upload
:disabled="isDetail"
:action="$store.state.UPLOADURL"
list-type="picture-card"
multiple
name="files"
:limit="1"
accept=".png, .jpg, .jpeg"
:file-list="fileUplodList"
:on-exceed="(file, fileList) => handleExceed(file, fileList)"
:on-success="(res, file) => handleSuccess(res, file)"
:on-remove="(file, fileList) => handleRemove(file, fileList)"
>
<i class="el-icon-plus"></i>
</el-upload>
</el-form-item>
<div class="dialog-footer">
<el-button class="cancleBtn" @click="dialogShow = false" icon="el-icon-circle-close" size="medium"
>{{ $t('message.deviceManage.cancel') }}
</el-button>
<el-button type="primary" icon="el-icon-circle-check" @click="submit" size="medium"
>{{ $t('message.deviceManage.save') }}
</el-button>
</div>
</el-form>
</div>
</vue-scroll>
<el-pagination class="pagerBox" @size-change="SizeChange" @current-change="CurrentChange"
:current-page="pagInfo.pageNo" :page-sizes="$store.state.PAGESIZRS" :page-size="pagInfo.pageSize"
layout="total, sizes, prev, pager, next" :total="Number(pagInfo.total)" background></el-pagination>
</div>
<el-dialog :modal-append-to-body="false" @close="close" :title="title" :visible.sync="dialogShow" width="800px">
<div class="dialog_content">
<div class="search-form">
<el-form :inline="true" ref="searchForm" :model="searchForm" size="medium">
<el-form-item label="时间">
<el-date-picker v-model="searchForm.time" type="datetimerange" value-format="yyyy-MM-dd HH:mm:ss" range-separator="至" start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" plain @click="getMonitorList">{{
$t("message.energyManage.waybill.query")
}}</el-button>
<el-button type="primary" plain @click="exportData">导出</el-button>
</el-form-item>
</el-form>
</div>
<div class="dialog-table">
<el-table class="tables" :data="historyList">
<el-table-column prop="createDate" align="center" width="200" label="上报时间"></el-table-column>
<el-table-column prop="phValue" align="center" label="PH值"></el-table-column>
<el-table-column prop="turbidityValue" align="center" label="浊度值"></el-table-column>
<el-table-column prop="conductivity" align="center" label="电导率"></el-table-column>
<el-table-column prop="dissolvedOxygen" align="center" label="溶解氧"></el-table-column>
<el-table-column prop="waterTemperature" align="center" label="水温"></el-table-column>
<el-table-column prop="flowVelocity" align="center" label="流速"></el-table-column>
<el-table-column prop="waterLevel" align="center" label="水位"></el-table-column>
</el-table>
</div>
<div class="dialog-pagination">
<el-pagination class="pagerBox" @size-change="monitorSizeChange" @current-change="monitorCurrentChange"
:current-page="pagMonitorInfo.pageNo" :page-sizes="$store.state.PAGESIZRS"
:page-size="pagMonitorInfo.pageSize" layout="total, sizes, prev, pager, next"
:total="Number(pagMonitorInfo.total)" background></el-pagination>
</div>
<div class="dialog-footer">
<el-button type="primary" @click="dialogShow = false" size="medium">关闭</el-button>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
import {
smartTensionDevAdd,
smartTensionDevDelete,
smartTensionDevEdit,
smartTensionDevPage,
getCrewListDataApi // 负责人下拉
} from '@/assets/js/api/intelligentTension.js'
import { checkPhone } from '@/assets/js/util.js'
sewageDataPage,
sewageDevList,
sewageMonitorDataPage,
sewageMonitorDataExport
} from "@/assets/js/api/sewageMonitor.js";
export default {
mounted() {},
mounted() { },
created() {
this.getList()
this.getDutyPerson()
this.getList();
this.getDevList();
},
data() {
return {
isDetail: false, //是否详情
dutyList: [], // 负责人
fileUplodList: [],
title: '',
title: "",
dialogShow: false,
pagInfo: {
pageNo: 1, //页数
pageSize: 10, //条数
total: 0 //总条数
total: 0, //总条数
},
pagMonitorInfo: {
pageNo: 1, //页数
pageSize: 10, //条数
total: 0, //总条数
},
devList: [],
List: [],
addEditForm: {
belongBeamField: '',
createTime: '',
devSn: '',
deviceModel: '',
deviceName: '',
entryTime: '',
equipmentPicture: '',
manufacturerName: '',
dutyUserId: '',
dutyUserName: '',
projectSn: '',
updateTime: ''
},
addEditRules: {
deviceName: [
{
required: true,
message: '必填',
trigger: 'blur'
}
],
devSn: [
{
required: true,
message: '必填',
trigger: 'blur'
}
],
belongBeamField: [
{
required: true,
message: '必填',
trigger: 'blur'
}
]
},
historyList: [],
searchForm: {
belongBeamField: '',
deviceName: ''
}
}
devSn: "",
time: "",
},
devSn: ""
};
},
methods: {
// 负责人下拉回调
dutySelectChange(e) {
const item = this.dutyList.find(item => item.userId === e);
this.addEditForm.dutyUserName = item.realName
console.log("下拉选择",e,this.addEditForm.dutyUserName);
},
//查询负责人下拉
getDutyPerson() {
let data = {
projectSn: this.$store.state.projectSn,
// 导出数据
async exportData(){
let requestData = {
devSn: this.devSn
}
getCrewListDataApi(data).then(res => {
if (res.code == 200) {
this.dutyList = res.result
console.log('获取负责人下拉', this.dutyList)
} else {
this.$message.error(res.message)
}
if(this.searchForm.time && this.searchForm.time.length > 0){
requestData.createDate_begin = this.searchForm.time[0]
requestData.createDate_end = this.searchForm.time[1]
}
fetch(this.$http.defaults.baseURL + 'xmgl/sewageData/exportXls', {
method: 'post',
headers: {
'Authorization': this.$store.state.userInfo.token,
'Content-Type': 'application/json' // 设置请求头的内容类型为JSON
},
body: JSON.stringify(requestData) // 将data对象转换为JSON字符串并作为请求体发送
})
.then(response => {
// 处理响应
if (!response.ok) {
throw new Error('下载失败');
}
return response.blob();
})
.then(blob => {
// 创建一个下载链接
const url = window.URL.createObjectURL(blob);
// 创建一个<a>元素
const link = document.createElement('a');
link.href = url;
link.download = '监测数据.xlsx'; // 指定下载文件的文件名
// 模拟点击下载链接
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
// 释放URL对象
window.URL.revokeObjectURL(url);
// 处理导出的文件
// 这里可以使用blob对象来获取导出的文件内容或者将其保存到本地
console.log("下载",link,url)
})
.catch(error => {
// 处理错误
console.error(error);
});
},
// 查看详情
async showDetail(obj) {
this.title = "监测记录";
this.searchForm.time = null;
this.devSn = obj.devSn
this.getMonitorList(obj.devSn);
this.dialogShow = true;
},
// 查询监测记录
async getMonitorList(devSn) {
let requestData = {
devSn,
pageNo: this.pagMonitorInfo.pageNo,
pageSize: this.pagMonitorInfo.pageSize
}
if(this.searchForm.time && this.searchForm.time.length > 0){
requestData.createDate_begin = this.searchForm.time[0]
requestData.createDate_end = this.searchForm.time[1]
}
const res = await sewageMonitorDataPage(requestData);
if (res.success) {
this.historyList = res.result.records;
this.pagMonitorInfo.total = res.result.total;
}
},
// 查询设备列表
getDevList() {
sewageDevList().then((result) => {
if (result.success) {
this.devList = result.result;
}
});
},
//查询列表
getList() {
smartTensionDevPage({
sewageDataPage({
pageNo: this.pagInfo.pageNo,
pageSize: this.pagInfo.pageSize,
projectSn: this.$store.state.projectSn,
deviceName: this.searchForm.deviceName,
belongBeamField: this.searchForm.belongBeamField,
}).then(result => {
devSn: this.searchForm.devSn,
}).then((result) => {
if (result.success) {
// result.result.records.map(item => {
// if (item.image.includes('[')) {
// item.image = JSON.parse(item.image)
// if (item.image.length !== 0 && !item.image[0].url.includes(this.$store.state.FILEURL)) {
// item.image[0].url = this.$store.state.FILEURL + item.image[0].url
// }
// } else {
// let url = item.image
// if (url.length !== 0 && !url.includes(this.$store.state.FILEURL)) {
// item.image = [{}]
// item.image[0].url = this.$store.state.FILEURL + url
// }
// }
// })
this.List = result.result.records
this.pagInfo.total = result.result.total
this.List = result.result.records;
this.pagInfo.total = result.result.total;
}
})
},
add() {
this.title = '新增'
this.dialogShow = true
this.fileUplodList = []
this.close()
},
edit(obj) {
this.title = '编辑'
this.dialogShow = true
this.addEditForm = JSON.parse(JSON.stringify(obj))
this.fileUplodList = JSON.parse(obj.equipmentPicture)
},
openDetail(obj) {
this.title = '详情'
this.dialogShow = true
this.isDetail = true
this.addEditForm = JSON.parse(JSON.stringify(obj))
this.fileUplodList = JSON.parse(obj.equipmentPicture)
},
submit() {
// if (this.addEditForm.contactNumber) {
// if (!checkPhone(this.addEditForm.contactNumber)) {
// this.$message.error('请输入正确的手机号码')
// return
// }
// }
let params = JSON.parse(JSON.stringify(this.addEditForm))
params.projectSn = this.$store.state.projectSn
params.equipmentPicture = JSON.stringify(this.fileUplodList)
// if (this.fileUplodList.length > 0) {
// this.$message.error('请上传照片')
// return false
// }
this.$refs.addEditForm.validate(valid => {
if (valid) {
if (this.title == '新增') {
smartTensionDevAdd(params).then(result => {
if (result.success) {
this.$message.success(result.message)
this.getList()
}
})
} else if (this.title == '编辑') {
smartTensionDevEdit(params).then(result => {
if (result.success) {
this.$message.success(result.message)
this.getList()
}
})
}
this.dialogShow = false
} else {
return false
}
})
},
deleteDev(obj) {
this.$confirm('此操作将永久删除, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
smartTensionDevDelete({ id: obj.id }).then(res => {
if (res.success) {
this.getList()
this.$message({
type: 'success',
message: '删除成功!'
})
} else {
this.$message({
type: 'error',
message: res.message
})
}
})
})
.catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
// 删除
handleRemove(file, fileList) {
this.fileUplodList = fileList
},
handleExceed(file, fileList) {
console.log("超出限制",file)
this.$message.warning("只能上传一张图片")
},
handleSuccess(res, file, type) {
if (res.status == 'SUCCESS') {
this.fileUplodList.push({
name: file.name,
url: this.$store.state.FILEURL + file.response.data[0].imageUrl
})
}
});
},
close() {
this.isDetail = false
this.addEditForm = {}
this.fileUplodList = []
this.$nextTick(() => {
this.$refs.addEditForm.clearValidate()
})
this.dialogShow = false;
},
monitorSizeChange(val) {
this.pagMonitorInfo.pageSize = val;
this.getMonitorList();
},
monitorCurrentChange(val) {
this.pagMonitorInfo.pageNo = val;
this.getMonitorList();
},
SizeChange(val) {
this.pagInfo.pageSize = val
this.getList()
this.pagInfo.pageSize = val;
this.getList();
},
CurrentChange(val) {
this.pagInfo.pageNo = val
this.getList()
this.pagInfo.pageNo = val;
this.getList();
},
refresh() {
this.searchForm = {}
this.pagInfo.pageNo = 1 //页数
this.pagInfo.pageSize = 10 //条数
this.getList()
this.searchForm = {};
this.pagInfo.pageNo = 1; //页数
this.pagInfo.pageSize = 10; //条数
this.getList();
},
},
};
</script>
<style lang="less" scoped>
.flex {
display: flex;
align-items: center;
}
.list-content {
width: 100%;
height: 100%;
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-gap: 20px;
&-item {
width: 330px;
height: 350px;
padding: 20px 15px;
display: flex;
flex-direction: column;
background-color: #fff;
.item-top {
.flex();
.line {
width: 3px;
height: 15px;
background-color: #5181f6;
border-radius: 10px;
margin-right: 8px;
}
>span {
margin-right: auto;
}
>div:last-child {
width: 90px;
height: 30px;
line-height: 30px;
text-align: center;
background-color: #5181f6;
border-radius: 3px;
color: white;
font-size: 14px;
cursor: pointer;
}
}
.item-subtop {
margin-top: 10px;
color: #a2a4af;
font-size: 14px;
}
.item-bottom {
>div {
margin-top: 20px;
.flex();
span:nth-child(1) {
color: #7c829e;
font-size: 18px;
margin-right: auto;
}
span:nth-child(2) {
font-size: 18px;
}
}
}
}
}
</script>
<style lang="less" scoped>
.tables2 {
min-height: auto;
.dialog_content {
padding: 0px;
.search-form {
margin: 0 20px;
}
}
.textStyle {
width: 140px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
/deep/.el-dialog__body {
padding-left: 0px;
padding-right: 0px;
}
</style>

405
src/views/projectFront/sewageMonitor/thresholdSet.vue
View File

@ -1,405 +0,0 @@
<template>
<div class="fullHeight">
<div class="searchBox whiteBlock">
<!-- 智能张拉——设备管理 -->
<el-form :inline="true" ref="searchForm" :model="searchForm" size="medium">
<el-form-item label="设备名称">
<el-input v-model="searchForm.deviceName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="梁场名称">
<el-input v-model="searchForm.belongBeamField" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" plain @click="getList">{{ $t('message.energyManage.waybill.query') }}</el-button>
<el-button type="warning" plain @click="refresh">{{ $t('message.deviceManage.refresh') }}</el-button>
<el-button type="primary" size="medium" @click="add">新增</el-button>
</el-form-item>
</el-form>
</div>
<div class="table_wrap whiteBlock">
<el-table class="tables" :data="List">
<!-- <el-table-column prop="image" label="照片" align="center">
<template slot-scope="scope">
<img
:preview="scope.row.image[0] ? scope.row.image[0].url : []"
:src="scope.row.image[0] ? scope.row.image[0].url : []"
alt=""
width="50px"
/>
</template>
</el-table-column> -->
<el-table-column prop="deviceName" align="center" label="设备名称"></el-table-column>
<el-table-column prop="devSn" align="center" label="设备编码"></el-table-column>
<el-table-column prop="deviceModel" align="center" label="设备型号"></el-table-column>
<el-table-column prop="manufacturerName" align="center" label="厂家名称"></el-table-column>
<el-table-column prop="entryTime" align="center" label="进场时间"></el-table-column>
<el-table-column prop="dutyUserName" align="center" label="负责人"></el-table-column>
<el-table-column prop="belongBeamField" align="center" label="所属梁场">
<!-- <template slot-scope="scope">{{scope.row.politicalStatus==2?'中共预备党员':'.'}}</template> -->
</el-table-column>
<!-- <el-table-column prop="joinPartyDeclaration" align="center" label="入党誓言">
<template slot-scope="scope"
><div class="textStyle" :title="scope.row.joinPartyDeclaration">
{{ scope.row.joinPartyDeclaration }}
</div></template
>
</el-table-column> -->
<el-table-column label="操作" align="center" width="250px">
<template slot-scope="scope">
<div class="tableBtns">
<div class="operationText" @click.stop="openDetail(scope.row)">
<i class="el-icon-tickets" style="color: #8dacfa; font-size: 16px; margin-right: 2px"></i>
<span style="white-space: nowrap;">详情</span>
</div>
<div @click="edit(scope.row)" class="operationText">
<img src="@/assets/images/icon-edit.png" width="15px" height="15px" />
<span style="white-space: nowrap;">编辑</span>
</div>
<div @click="deleteDev(scope.row)" class="operationText">
<img src="@/assets/images/icon-delete.png" width="15px" height="15px" />
<span style="white-space: nowrap;">删除</span>
</div>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
class="pagerBox"
@size-change="SizeChange"
@current-change="CurrentChange"
:current-page="pagInfo.pageNo"
:page-sizes="$store.state.PAGESIZRS"
:page-size="pagInfo.pageSize"
layout="total, sizes, prev, pager, next"
:total="Number(pagInfo.total)"
background
></el-pagination>
</div>
<el-dialog :modal-append-to-body="false" @close="close" :title="title" :visible.sync="dialogShow" width="667px">
<div class="dialog_content">
<el-form size="medium" ref="addEditForm" :model="addEditForm" :rules="addEditRules" label-width="120px" class="dialogFormBox">
<el-form-item label="设备名称" prop="deviceName">
<el-input :disabled="isDetail" v-model="addEditForm.deviceName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="设备编码" prop="devSn">
<el-input :disabled="isDetail" v-model="addEditForm.devSn" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="设备型号" prop="deviceModel">
<el-input :disabled="isDetail" v-model="addEditForm.deviceModel" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="厂家名称" prop="manufacturerName">
<el-input :disabled="isDetail" v-model="addEditForm.manufacturerName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="进场时间" prop="entryTime">
<el-date-picker
:disabled="isDetail"
value-format="yyyy-MM-dd HH:mm:ss"
v-model="addEditForm.entryTime"
type="datetime"
placeholder="请选择时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="负责人" prop="dutyUserId">
<el-select v-model="addEditForm.dutyUserId" placeholder="请选择" :disabled="isDetail" @change="dutySelectChange">
<el-option v-for="(item, index) in dutyList" :key="index" :label="item.realName" :value="item.userId"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="所属梁场" prop="belongBeamField">
<el-input :disabled="isDetail" v-model="addEditForm.belongBeamField" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="设备图片">
<el-upload
:disabled="isDetail"
:action="$store.state.UPLOADURL"
list-type="picture-card"
multiple
name="files"
:limit="1"
accept=".png, .jpg, .jpeg"
:file-list="fileUplodList"
:on-exceed="(file, fileList) => handleExceed(file, fileList)"
:on-success="(res, file) => handleSuccess(res, file)"
:on-remove="(file, fileList) => handleRemove(file, fileList)"
>
<i class="el-icon-plus"></i>
</el-upload>
</el-form-item>
<div class="dialog-footer">
<el-button class="cancleBtn" @click="dialogShow = false" icon="el-icon-circle-close" size="medium"
>{{ $t('message.deviceManage.cancel') }}
</el-button>
<el-button type="primary" icon="el-icon-circle-check" @click="submit" size="medium"
>{{ $t('message.deviceManage.save') }}
</el-button>
</div>
</el-form>
</div>
</el-dialog>
</div>
</template>
<script>
import {
smartTensionDevAdd,
smartTensionDevDelete,
smartTensionDevEdit,
smartTensionDevPage,
getCrewListDataApi // 负责人下拉
} from '@/assets/js/api/intelligentTension.js'
import { checkPhone } from '@/assets/js/util.js'
export default {
mounted() {},
created() {
this.getList()
this.getDutyPerson()
},
data() {
return {
isDetail: false, //是否详情
dutyList: [], // 负责人
fileUplodList: [],
title: '',
dialogShow: false,
pagInfo: {
pageNo: 1, //页数
pageSize: 10, //条数
total: 0 //总条数
},
List: [],
addEditForm: {
belongBeamField: '',
createTime: '',
devSn: '',
deviceModel: '',
deviceName: '',
entryTime: '',
equipmentPicture: '',
manufacturerName: '',
dutyUserId: '',
dutyUserName: '',
projectSn: '',
updateTime: ''
},
addEditRules: {
deviceName: [
{
required: true,
message: '必填',
trigger: 'blur'
}
],
devSn: [
{
required: true,
message: '必填',
trigger: 'blur'
}
],
belongBeamField: [
{
required: true,
message: '必填',
trigger: 'blur'
}
]
},
searchForm: {
belongBeamField: '',
deviceName: ''
}
}
},
methods: {
// 负责人下拉回调
dutySelectChange(e) {
const item = this.dutyList.find(item => item.userId === e);
this.addEditForm.dutyUserName = item.realName
console.log("下拉选择",e,this.addEditForm.dutyUserName);
},
//查询负责人下拉
getDutyPerson() {
let data = {
projectSn: this.$store.state.projectSn,
}
getCrewListDataApi(data).then(res => {
if (res.code == 200) {
this.dutyList = res.result
console.log('获取负责人下拉', this.dutyList)
} else {
this.$message.error(res.message)
}
})
},
//查询列表
getList() {
smartTensionDevPage({
pageNo: this.pagInfo.pageNo,
pageSize: this.pagInfo.pageSize,
projectSn: this.$store.state.projectSn,
deviceName: this.searchForm.deviceName,
belongBeamField: this.searchForm.belongBeamField,
}).then(result => {
if (result.success) {
// result.result.records.map(item => {
// if (item.image.includes('[')) {
// item.image = JSON.parse(item.image)
// if (item.image.length !== 0 && !item.image[0].url.includes(this.$store.state.FILEURL)) {
// item.image[0].url = this.$store.state.FILEURL + item.image[0].url
// }
// } else {
// let url = item.image
// if (url.length !== 0 && !url.includes(this.$store.state.FILEURL)) {
// item.image = [{}]
// item.image[0].url = this.$store.state.FILEURL + url
// }
// }
// })
this.List = result.result.records
this.pagInfo.total = result.result.total
}
})
},
add() {
this.title = '新增'
this.dialogShow = true
this.fileUplodList = []
this.close()
},
edit(obj) {
this.title = '编辑'
this.dialogShow = true
this.addEditForm = JSON.parse(JSON.stringify(obj))
this.fileUplodList = JSON.parse(obj.equipmentPicture)
},
openDetail(obj) {
this.title = '详情'
this.dialogShow = true
this.isDetail = true
this.addEditForm = JSON.parse(JSON.stringify(obj))
this.fileUplodList = JSON.parse(obj.equipmentPicture)
},
submit() {
// if (this.addEditForm.contactNumber) {
// if (!checkPhone(this.addEditForm.contactNumber)) {
// this.$message.error('请输入正确的手机号码')
// return
// }
// }
let params = JSON.parse(JSON.stringify(this.addEditForm))
params.projectSn = this.$store.state.projectSn
params.equipmentPicture = JSON.stringify(this.fileUplodList)
// if (this.fileUplodList.length > 0) {
// this.$message.error('请上传照片')
// return false
// }
this.$refs.addEditForm.validate(valid => {
if (valid) {
if (this.title == '新增') {
smartTensionDevAdd(params).then(result => {
if (result.success) {
this.$message.success(result.message)
this.getList()
}
})
} else if (this.title == '编辑') {
smartTensionDevEdit(params).then(result => {
if (result.success) {
this.$message.success(result.message)
this.getList()
}
})
}
this.dialogShow = false
} else {
return false
}
})
},
deleteDev(obj) {
this.$confirm('此操作将永久删除, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
smartTensionDevDelete({ id: obj.id }).then(res => {
if (res.success) {
this.getList()
this.$message({
type: 'success',
message: '删除成功!'
})
} else {
this.$message({
type: 'error',
message: res.message
})
}
})
})
.catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
// 删除
handleRemove(file, fileList) {
this.fileUplodList = fileList
},
handleExceed(file, fileList) {
console.log("超出限制",file)
this.$message.warning("只能上传一张图片")
},
handleSuccess(res, file, type) {
if (res.status == 'SUCCESS') {
this.fileUplodList.push({
name: file.name,
url: this.$store.state.FILEURL + file.response.data[0].imageUrl
})
}
},
close() {
this.isDetail = false
this.addEditForm = {}
this.fileUplodList = []
this.$nextTick(() => {
this.$refs.addEditForm.clearValidate()
})
},
SizeChange(val) {
this.pagInfo.pageSize = val
this.getList()
},
CurrentChange(val) {
this.pagInfo.pageNo = val
this.getList()
},
refresh() {
this.searchForm = {}
this.pagInfo.pageNo = 1 //页数
this.pagInfo.pageSize = 10 //条数
this.getList()
}
}
}
</script>
<style lang="less" scoped>
.tables2 {
min-height: auto;
}
.textStyle {
width: 140px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>