master
parent
200af8d6dc
commit
4169da0cfe
|
After Width: | Height: | Size: 839 KiB |
@ -0,0 +1,514 @@ |
|||||||
|
<template> |
||||||
|
<div class="app-container home"> |
||||||
|
<el-row :gutter="20"> |
||||||
|
<el-col :span="24" :xs="24"> |
||||||
|
<el-form :model="queryParams" ref="queryRef" :inline="true" label-width="88px"> |
||||||
|
<el-form-item label="模型名称:" prop="name"> |
||||||
|
<el-select v-model="data.sceneCode" placeholder="请选择" style="width: 240px" @change="changeSl"> |
||||||
|
<el-option label='所有' value='' /> |
||||||
|
<el-option :label='item.label' :value='item.value' :key="item.value" v-for="item in queryParams"/> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button> |
||||||
|
<el-button icon="Refresh" @click="resetQuery">重置</el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<el-row :gutter="10" class="mb8"> |
||||||
|
<el-col :span="1.5"> |
||||||
|
<el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
<div class="dev_control_table"> |
||||||
|
<el-table :data="data.timingList" height="500px"> |
||||||
|
<el-table-column label="序号" align="center" prop="deviceId" width="50"/> |
||||||
|
<el-table-column label="设备名称" align="center" prop="deviceName"/> |
||||||
|
<el-table-column label="是否可控" align="center" prop="isControl" /> |
||||||
|
<el-table-column label="设备位置" align="center" prop="deviceAddress"/> |
||||||
|
<el-table-column label="设备状态" align="center" prop="devStatus"/> |
||||||
|
<el-table-column label="设备Sn" align="center" prop="deviceSn"/> |
||||||
|
<el-table-column label="当前功率" align="center" prop="totp"/> |
||||||
|
<el-table-column label="总用电量" align="center" prop="totWh"/> |
||||||
|
<el-table-column label="温度" align="center" prop="temp"/> |
||||||
|
<el-table-column label="进水温度" align="center" prop="tempIn"/> |
||||||
|
<el-table-column label="出水温度" align="center" prop="tempOut"/> |
||||||
|
<el-table-column label="操作" align="center" prop="handle" width="200"> |
||||||
|
<template v-slot="scope"> |
||||||
|
<el-button type="primary" size="small" icon="Edit" v-hasPermi="['system:cl:edit']" @click="handleXg(scope.row)">修改</el-button> |
||||||
|
<el-button type="danger" size="small" :icon="Delete" @click="handleDel(scope.row.deviceId)">删除</el-button> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
<el-pagination |
||||||
|
v-model:current-page="currentPage" |
||||||
|
v-model:page-size="pageSize" |
||||||
|
:page-sizes="[5, 10, 20, 50]" |
||||||
|
:small="small" |
||||||
|
:disabled="disabled" |
||||||
|
:background="background" |
||||||
|
layout="total, sizes, prev, pager, next, jumper" |
||||||
|
:total="data.total" |
||||||
|
@size-change="handleSizeChange" |
||||||
|
@current-change="handleCurrentChange"/> |
||||||
|
</div> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- 新增对话框 --> |
||||||
|
<el-dialog :title="title" v-model="open" width="600px" append-to-body> |
||||||
|
<el-form :model="timingForm" ref="userRef" label-width="88px"> |
||||||
|
<el-row> |
||||||
|
<el-col :span="24"> |
||||||
|
<el-form-item label="设备名称:" prop="deviceName" > |
||||||
|
<el-input v-model="timingForm.deviceName" placeholder="请输入设备名称" /> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="模型列表:" > |
||||||
|
<el-select v-model="timingForm.deviceModel" placeholder="模型列表"> |
||||||
|
<el-option v-for="item in data.queryParams" :key="item.value" :label="item.label" :value="item.value"> |
||||||
|
</el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="是否可控:" > |
||||||
|
<el-select v-model="timingForm.isControl" placeholder="是否可控"> |
||||||
|
<el-option label="可控" :value=2></el-option> |
||||||
|
<el-option label="不可控" :value=1></el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="24"> |
||||||
|
<el-form-item label="设备Sn:" prop="deviceSn" > |
||||||
|
<el-input v-model="timingForm.deviceSn" placeholder="请输入设备Sn" /> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<!-- <el-col :span="24">--> |
||||||
|
<!-- <el-form-item label="开始时间:" prop="startTime" >--> |
||||||
|
<!-- <el-input v-model="timingForm.startTime" placeholder="示例：2023-05-11 10:40:29" />--> |
||||||
|
<!-- </el-form-item>--> |
||||||
|
<!-- </el-col>--> |
||||||
|
<el-col :span="24"> |
||||||
|
<el-form-item label="设备地址:" prop="deviceAddress"> |
||||||
|
<el-input v-model="timingForm.deviceAddress" placeholder="请输入设备地址" /> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
</el-form> |
||||||
|
<template #footer> |
||||||
|
<div class="dialog-footer"> |
||||||
|
<el-button type="primary" @click="submitForm">确 定</el-button> |
||||||
|
<el-button @click="cancel">取 消</el-button> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
</el-dialog> |
||||||
|
<!-- 修改对话框 --> |
||||||
|
<el-dialog :title="title1" v-model="open1" width="600px" append-to-body> |
||||||
|
<el-form :model="timingForm1" ref="userRef" label-width="88px"> |
||||||
|
<el-row> |
||||||
|
<el-col :span="24"> |
||||||
|
<el-form-item label="设备名称:" prop="deviceName" > |
||||||
|
<el-input v-model="timingForm1.deviceName" placeholder="请输入设备名称" /> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="模型列表:" > |
||||||
|
<el-select v-model="timingForm1.deviceModel" placeholder="模型列表"> |
||||||
|
<el-option v-for="item in data.queryParams" :key="item.value" :label="item.label" :value="item.value"> |
||||||
|
</el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="是否可控:" > |
||||||
|
<el-select v-model="timingForm1.isControl" placeholder="是否可控"> |
||||||
|
<el-option label="可控" :value=2></el-option> |
||||||
|
<el-option label="不可控" :value=1></el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="24"> |
||||||
|
<el-form-item label="设备Sn:" prop="deviceSn" > |
||||||
|
<el-input v-model="timingForm1.deviceSn" placeholder="请输入设备Sn" /> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<!-- <el-col :span="24">--> |
||||||
|
<!-- <el-form-item label="开始时间:" prop="startTime" >--> |
||||||
|
<!-- <el-input v-model="timingForm.startTime" placeholder="示例：2023-05-11 10:40:29" />--> |
||||||
|
<!-- </el-form-item>--> |
||||||
|
<!-- </el-col>--> |
||||||
|
<el-col :span="24"> |
||||||
|
<el-form-item label="设备地址:" prop="deviceAddress"> |
||||||
|
<el-input v-model="timingForm1.deviceAddress" placeholder="请输入设备地址" /> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
</el-form> |
||||||
|
<template #footer> |
||||||
|
<div class="dialog-footer"> |
||||||
|
<el-button type="primary" @click="submitForm1">确 定</el-button> |
||||||
|
<el-button @click="cancel1">取 消</el-button> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup name="Index"> |
||||||
|
import {ElMessage,ElMessageBox} from 'element-plus' |
||||||
|
import {Delete} from '@element-plus/icons-vue' |
||||||
|
import {ref,reactive,watch,onMounted} from "vue"; |
||||||
|
import {getXl, getSbTab, postNew1, getSb, postXg1, postDel1, getYh, getMx,} from '../../../api/emonitor/api' |
||||||
|
onMounted(()=>{ |
||||||
|
// getSb().then((res)=>{ |
||||||
|
// var arr = [] |
||||||
|
// for(var i in res.data){ |
||||||
|
// arr=arr.concat(res.data[i].children) |
||||||
|
// } |
||||||
|
// console.log('sblb',arr) |
||||||
|
// data.sblb=arr |
||||||
|
// }) |
||||||
|
getMx().then((res)=>{ |
||||||
|
console.log(res) |
||||||
|
data.queryParams=res.data |
||||||
|
}) |
||||||
|
// getYh().then((res)=>{ |
||||||
|
// console.log(res) |
||||||
|
// data.queryParams=res.data |
||||||
|
// }) |
||||||
|
getSbTab({ |
||||||
|
"deviceId":0, |
||||||
|
|
||||||
|
"deviceModel":data.sceneCode, |
||||||
|
|
||||||
|
"pageNum": currentPage.value, |
||||||
|
|
||||||
|
"pageSize": pageSize.value |
||||||
|
}).then((res)=>{ |
||||||
|
console.log(res) |
||||||
|
data.timingList=res.rows |
||||||
|
data.total=res.total |
||||||
|
for(let i in res.rows){ |
||||||
|
if(res.rows[i].isControl==2){ |
||||||
|
res.rows[i].isControl='可控' |
||||||
|
}else if(res.rows[i].isControl==1){ |
||||||
|
res.rows[i].isControl='不可控' |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
// postNew().then((res)=>{ |
||||||
|
// console.log(res) |
||||||
|
// }) |
||||||
|
}) |
||||||
|
/** 筛选处理 */ |
||||||
|
const data = reactive({ |
||||||
|
MxList:[], |
||||||
|
sblb:[], |
||||||
|
total:'', |
||||||
|
timingList:[], |
||||||
|
queryParams: '', |
||||||
|
sceneCode:'', |
||||||
|
dateRange:[], |
||||||
|
}); |
||||||
|
//改变 |
||||||
|
function changeSl(){ |
||||||
|
console.log(data.sceneCode) |
||||||
|
} |
||||||
|
//搜索按钮 |
||||||
|
function handleQuery(){ |
||||||
|
getSbTab({ |
||||||
|
"deviceId":0, |
||||||
|
|
||||||
|
"deviceModel":data.sceneCode, |
||||||
|
|
||||||
|
"pageNum": currentPage.value, |
||||||
|
|
||||||
|
"pageSize": pageSize.value |
||||||
|
}).then((res)=>{ |
||||||
|
console.log(res) |
||||||
|
data.timingList=res.rows |
||||||
|
data.total=res.total |
||||||
|
for(let i in res.rows){ |
||||||
|
if(res.rows[i].isControl==2){ |
||||||
|
res.rows[i].isControl='可控' |
||||||
|
}else if(res.rows[i].isControl==1){ |
||||||
|
res.rows[i].isControl='不可控' |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
//重置按钮 |
||||||
|
function resetQuery(){ |
||||||
|
data.sceneCode=0 |
||||||
|
currentPage.value=1 |
||||||
|
pageSize.value=10 |
||||||
|
getSbTab({ |
||||||
|
"deviceId":0, |
||||||
|
|
||||||
|
"deviceModel":'', |
||||||
|
|
||||||
|
"pageNum": currentPage.value, |
||||||
|
|
||||||
|
"pageSize": pageSize.value |
||||||
|
}).then((res)=>{ |
||||||
|
console.log(res) |
||||||
|
data.timingList=res.rows |
||||||
|
data.total=res.total |
||||||
|
for(let i in res.rows){ |
||||||
|
if(res.rows[i].isControl==2){ |
||||||
|
res.rows[i].isControl='可控' |
||||||
|
}else if(res.rows[i].isControl==1){ |
||||||
|
res.rows[i].isControl='不可控' |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
/** 数据表格处理 */ |
||||||
|
|
||||||
|
const currentPage = ref(1) |
||||||
|
const pageSize = ref(10) |
||||||
|
const small = ref(false) |
||||||
|
const background = ref(false) |
||||||
|
const disabled = ref(false) |
||||||
|
const handleSizeChange = (val) => { |
||||||
|
console.log(`${val}`) |
||||||
|
getSbTab({ |
||||||
|
"deviceId":0, |
||||||
|
|
||||||
|
"deviceModel":data.sceneCode, |
||||||
|
|
||||||
|
"pageNum": currentPage.value, |
||||||
|
|
||||||
|
"pageSize": pageSize.value |
||||||
|
}).then((res)=>{ |
||||||
|
console.log(res) |
||||||
|
data.timingList=res.rows |
||||||
|
data.total=res.total |
||||||
|
for(let i in res.rows){ |
||||||
|
if(res.rows[i].isControl==2){ |
||||||
|
res.rows[i].isControl='可控' |
||||||
|
}else if(res.rows[i].isControl==1){ |
||||||
|
res.rows[i].isControl='不可控' |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
const handleCurrentChange = (val) => { |
||||||
|
console.log(`${val}`) |
||||||
|
getSbTab({ |
||||||
|
"deviceId":0, |
||||||
|
|
||||||
|
"deviceModel":data.sceneCode, |
||||||
|
|
||||||
|
"pageNum": currentPage.value, |
||||||
|
|
||||||
|
"pageSize": pageSize.value |
||||||
|
}).then((res)=>{ |
||||||
|
console.log(res) |
||||||
|
data.timingList=res.rows |
||||||
|
data.total=res.total |
||||||
|
for(let i in res.rows){ |
||||||
|
if(res.rows[i].isControl==2){ |
||||||
|
res.rows[i].isControl='可控' |
||||||
|
}else if(res.rows[i].isControl==1){ |
||||||
|
res.rows[i].isControl='不可控' |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
/** 新增策略处理 */ |
||||||
|
const open = ref(false); |
||||||
|
const title = ref(); |
||||||
|
const open1 = ref(false); |
||||||
|
const title1= ref(); |
||||||
|
const activeName = ref('1') |
||||||
|
const timingForm = reactive({ |
||||||
|
"parentId": 0, |
||||||
|
"userId": 1, |
||||||
|
"isControl":'', |
||||||
|
"deviceType": 2, |
||||||
|
"deviceSn": "", |
||||||
|
"deviceName": "", |
||||||
|
"hardVersion": "2.23", |
||||||
|
"softVersion": "2.24", |
||||||
|
"deviceAddress": '', |
||||||
|
"startTime": null, |
||||||
|
"deviceModel": "", |
||||||
|
"photoUrl": null |
||||||
|
}) |
||||||
|
const timingForm1 = reactive({ |
||||||
|
"deviceId":'', |
||||||
|
"parentId": 0, |
||||||
|
"userId": 1, |
||||||
|
"isControl": '', |
||||||
|
"deviceType": 2, |
||||||
|
"deviceSn": "", |
||||||
|
"deviceName": "", |
||||||
|
"hardVersion": "2.23", |
||||||
|
"softVersion": "2.24", |
||||||
|
"deviceAddress": '', |
||||||
|
"startTime": null, |
||||||
|
"deviceModel": "", |
||||||
|
"photoUrl": null |
||||||
|
|
||||||
|
}) |
||||||
|
|
||||||
|
// const watchTime = watch(()=> timingForm.executeTime, (val) => { |
||||||
|
// // console.log(val.toLocaleString()) |
||||||
|
// let date = new Date(val) |
||||||
|
// let hours = date.getHours() |
||||||
|
// let minutes = date.getMinutes() |
||||||
|
// let seconds = date.getSeconds() |
||||||
|
// console.log(`${hours}:${minutes}:${seconds}`) |
||||||
|
// }) |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
function handleAdd() { |
||||||
|
open.value = true; |
||||||
|
title.value = "新增设备"; |
||||||
|
}; |
||||||
|
function submitForm() { |
||||||
|
open.value = false; |
||||||
|
console.log(timingForm) |
||||||
|
postNew1(timingForm).then((res)=>{ |
||||||
|
console.log(res) |
||||||
|
ElMessage({type:"success",message:'新增成功！'}) |
||||||
|
handleQuery() |
||||||
|
timingForm.isControl='', |
||||||
|
timingForm.deviceSn='', |
||||||
|
timingForm.deviceName='', |
||||||
|
timingForm.deviceAddress='', |
||||||
|
timingForm.deviceModel='' |
||||||
|
}) |
||||||
|
|
||||||
|
}; |
||||||
|
function cancel() { |
||||||
|
open.value = false; |
||||||
|
timingForm.isControl='', |
||||||
|
timingForm.deviceSn='', |
||||||
|
timingForm.deviceName='', |
||||||
|
timingForm.deviceAddress='', |
||||||
|
timingForm.deviceModel='' |
||||||
|
}; |
||||||
|
function handleXg(data) { |
||||||
|
open1.value = true; |
||||||
|
title1.value = "修改设备"; |
||||||
|
console.log(data) |
||||||
|
timingForm1.isControl=data.isControl |
||||||
|
timingForm1.deviceSn=data.deviceSn |
||||||
|
timingForm1.deviceName=data.deviceName |
||||||
|
timingForm1.deviceAddress=data.deviceAddress |
||||||
|
timingForm1.deviceModel=data.deviceModel |
||||||
|
timingForm1.deviceId = data.deviceId |
||||||
|
// if(sceneContext=='出水温度'){ |
||||||
|
// timingForm1.outtemp=sceneValue |
||||||
|
// }else if (sceneContext=='进水温度'){ |
||||||
|
// timingForm1.intemp=sceneValue |
||||||
|
// }else{ |
||||||
|
// timingForm1.temp=sceneValue |
||||||
|
// } |
||||||
|
}; |
||||||
|
function submitForm1() { |
||||||
|
open1.value = false; |
||||||
|
if(timingForm1.isControl=='可控'){ |
||||||
|
timingForm1.isControl=2 |
||||||
|
}else if (timingForm1.isControl=='不可控'){ |
||||||
|
timingForm1.isControl=1 |
||||||
|
} |
||||||
|
console.log(timingForm1) |
||||||
|
postXg1({ |
||||||
|
"deviceId": timingForm1.deviceId, |
||||||
|
"parentId": 1, |
||||||
|
"userId": 1, |
||||||
|
"deviceType": 3, |
||||||
|
"deviceSn": timingForm1.deviceSn, |
||||||
|
"deviceModel": timingForm1.deviceModel, |
||||||
|
"deviceName": timingForm1.deviceName, |
||||||
|
"deviceAddress": timingForm1.deviceAddress, |
||||||
|
"isControl":timingForm1.isControl, |
||||||
|
"photoUrl": null, |
||||||
|
"createBy": null, |
||||||
|
"createTime": null, |
||||||
|
}).then((res)=>{ |
||||||
|
console.log(res) |
||||||
|
ElMessage({type:"success",message:'修改成功！'}) |
||||||
|
handleQuery() |
||||||
|
timingForm1.isControl='' |
||||||
|
timingForm1.deviceSn='' |
||||||
|
timingForm1.deviceName='' |
||||||
|
timingForm1.deviceAddress='' |
||||||
|
timingForm1.deviceModel='' |
||||||
|
timingForm1.deviceId='' |
||||||
|
}) |
||||||
|
}; |
||||||
|
function cancel1() { |
||||||
|
open1.value = false; |
||||||
|
timingForm1.isControl='' |
||||||
|
timingForm1.deviceSn='' |
||||||
|
timingForm1.deviceName='' |
||||||
|
timingForm1.deviceAddress='' |
||||||
|
timingForm1.deviceModel='' |
||||||
|
timingForm1.deviceId='' |
||||||
|
}; |
||||||
|
function handleDel(data) { |
||||||
|
ElMessageBox.confirm("是否确认删除此设备？", "提示",{ |
||||||
|
confirmButtonText: "确认", |
||||||
|
cancelButtonText: "取消", |
||||||
|
type: "warning" |
||||||
|
}).then(() => { |
||||||
|
console.log(data) |
||||||
|
postDel1([data]).then((res) => { |
||||||
|
console.log(res) |
||||||
|
ElMessage({type:"success",message:'删除成功！'}) |
||||||
|
handleQuery() |
||||||
|
}); |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const { queryParams } = toRefs(data); |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped lang="scss"> |
||||||
|
.dev_control_table{ |
||||||
|
position: relative; |
||||||
|
width: 100%; |
||||||
|
min-height: 745px; |
||||||
|
background-color: #2F3D8A; |
||||||
|
} |
||||||
|
|
||||||
|
::v-deep .el-button{ |
||||||
|
border-radius: 2px; |
||||||
|
} |
||||||
|
::v-deep .el-pagination{ |
||||||
|
position: absolute; |
||||||
|
bottom: 10px; |
||||||
|
left: 50%; |
||||||
|
transform: translateX(-50%); |
||||||
|
} |
||||||
|
::v-deep .el-pagination__total{ |
||||||
|
color: #f3ffff; |
||||||
|
} |
||||||
|
::v-deep .el-pagination__jump{ |
||||||
|
color: #f3ffff; |
||||||
|
} |
||||||
|
::v-deep .el-pager{ |
||||||
|
margin: 0 5px; |
||||||
|
} |
||||||
|
::v-deep .el-table .el-table__body-wrapper{ |
||||||
|
background-color: #2F3D8A; |
||||||
|
} |
||||||
|
::v-deep .el-form-item__content{ |
||||||
|
//display: flex; |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue