备份
This commit is contained in:
861
src/views/device-manage/index-new.vue
Normal file
861
src/views/device-manage/index-new.vue
Normal file
@@ -0,0 +1,861 @@
|
||||
<template>
|
||||
<div class="tunnel-bgc">
|
||||
<div class="box-top">
|
||||
<div class="back-tunnel" @click="router.back(-1)">
|
||||
<div class="back-icon"></div>
|
||||
<span>返回</span>
|
||||
</div>
|
||||
<div class="tunnel-name">
|
||||
{{ tunnelName }}
|
||||
</div>
|
||||
<tunnel-title/>
|
||||
</div>
|
||||
<div class="device-content">
|
||||
<div class="device-box">
|
||||
<div class="box-left">
|
||||
<el-menu
|
||||
default-active="1"
|
||||
@select="handleChangeMenu"
|
||||
>
|
||||
<el-menu-item index="1">
|
||||
<span>风机</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="2">
|
||||
<span>风压</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="3">
|
||||
<span>其他传感器</span>
|
||||
</el-menu-item>
|
||||
<!-- <el-menu-item index="4">-->
|
||||
<!-- <span>分流器</span>-->
|
||||
<!-- </el-menu-item>-->
|
||||
</el-menu>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==1">
|
||||
<div class="device-title">
|
||||
<span>风机设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="fanFrequency">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;" table-layout="auto"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="fanData">
|
||||
<el-table-column prop="equipmentName" label="设备名称" align="center"/>
|
||||
<el-table-column prop="ratedPower" label="额定功率" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="额定功率" v-model="scope.row.ratedPower"
|
||||
></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phaseCurrentAOffset" label="A电流偏移量" align="center"/>
|
||||
<el-table-column prop="acurrentValue" label="A电流阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="A电流" v-model="scope.row.acurrentValue"
|
||||
></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phaseCurrentBOffset" label="B电流偏移量" align="center"/>
|
||||
<el-table-column prop="bcurrentValue" label="B电流阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="B电流" v-model="scope.row.bcurrentValue"
|
||||
></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phaseCurrentCOffset" label="C电流偏移量" align="center"/>
|
||||
<el-table-column prop="ccurrentValue" label="C电流阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="C电流" v-model="scope.row.ccurrentValue"
|
||||
></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="serialNumber" label="序列号" align="center" width="500">
|
||||
<template #default="scope">
|
||||
<!-- {{scope.row.serialNumberOption.filter(item => item.value == scope.row.serialNumber).map(item => item.label)[0]}}?-->
|
||||
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"-->
|
||||
<!-- clearable class="serialNumber">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in scope.row.serialNumberOption"-->
|
||||
<!-- :key="item.value"-->
|
||||
<!-- :label="item.label"-->
|
||||
<!-- :value="item.value"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click="scope.row.state = 1; "
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0; "
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="editEquip">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==2">
|
||||
<div class="device-title">
|
||||
<span>风压设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="windFrequency">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe table-layout="auto"
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="winData">
|
||||
<el-table-column prop="equipmentName" label="设备名称" align="center"/>
|
||||
<el-table-column prop="offset" label="偏移量" align="center"/>
|
||||
<el-table-column prop="unit" label="单位" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="单位" v-model="scope.row.unit" ></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="alarmValue" label="阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="阈值" v-model="scope.row.alarmValue"
|
||||
></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="miniRange" label="最小范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最小范围" v-model="scope.row.miniRange"
|
||||
></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="maxRange" label="最大范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最大范围" v-model="scope.row.maxRange"
|
||||
></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="serialNumber" label="序列号" align="center" width="500">
|
||||
<template #default="scope">
|
||||
<el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"
|
||||
clearable class="serialNumber" @clear="clearWinDataSelectedOption" >
|
||||
<!-- @change="changeWindDataSerialNumber($event,scope.row.serialNumberOption)"-->
|
||||
<el-option
|
||||
v-for="item in scope.row.serialNumberOption"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
|
||||
/>
|
||||
<!-- :disabled="serialNumberOptionDisabled(item)"-->
|
||||
<!-- :title="serialNumberOptionDisabled(item)?'该4G序列号已选择':''"-->
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch wind-switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click=" scope.row.state = 1; "
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0; "
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="editEquip">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==3">
|
||||
<div class="device-title">
|
||||
<span>其他传感器设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="otherFrequency">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe table-layout="auto"
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="otherData">
|
||||
<el-table-column prop="equipmentName" label="设备名称" align="center"/>
|
||||
<el-table-column prop="offset" label="偏移量" align="center"/>
|
||||
<el-table-column prop="unit" label="单位" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="单位" v-model="scope.row.unit" ></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="alarmValue" label="阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="阈值" v-model="scope.row.alarmValue"
|
||||
></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="miniRange" label="最小范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最小范围" v-model="scope.row.miniRange"
|
||||
></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="maxRange" label="最大范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最大范围" v-model="scope.row.maxRange"
|
||||
></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="serialNumber" label="序列号" align="center" width="500">
|
||||
<template #default="scope">
|
||||
<el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"
|
||||
clearable class="serialNumber">
|
||||
<el-option
|
||||
v-for="item in otherSensorSerialNumberOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch wind-switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click=" scope.row.state = 1; "
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0; "
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="editEquip">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==4">
|
||||
<div class="device-title">
|
||||
<span>分流器设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="fenFrequency">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="fenLiuData">
|
||||
<el-table-column prop="name" label="设备名称" align="center"/>
|
||||
<el-table-column prop="offset" label="偏移量" align="center"/>
|
||||
<el-table-column prop="thresholdValue" label="阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="阈值" v-model="scope.row.thresholdValue"
|
||||
@change="changeFenData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click=" scope.row.state = 1;changeFenData(scope.row)"
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0;changeFenData(scope.row)"
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="handleEditFen">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {ElLoading, ElMessage} from "element-plus";
|
||||
import {getEquipmentList, editEquipment, getTunnelDetail,getOtherSensorSerialNumberOptions, getWindPressureSerialNumberOptions} from "@/api/tunnelManage";
|
||||
import TunnelTitle from "@/components/tunnelTitle/index.vue";
|
||||
import {debounce} from 'lodash'
|
||||
|
||||
const router = useRouter()
|
||||
const tunnelId = reactive(router.currentRoute.value.params.tunnelId)
|
||||
const userId = reactive(router.currentRoute.value.params.userId)
|
||||
const type = reactive(router.currentRoute.value.params.type)
|
||||
const fanFrequency = ref(0)
|
||||
const windFrequency = ref(0)
|
||||
const otherFrequency = ref(0)
|
||||
const changeIndex = ref(1)
|
||||
const fanData = ref([])
|
||||
const winData = ref([])
|
||||
const windPressureDataSerialNumberOptions = ref([])
|
||||
const otherSensorSerialNumberOptions = ref([])
|
||||
const otherData = ref([])
|
||||
const winDataSelectedOption = ref([])
|
||||
const fenLiuData = ref([])
|
||||
const siteId = ref(0)
|
||||
const tunnelName = ref('')
|
||||
const getWindPressureOptions =async () => {
|
||||
let {data,code,msg}=await getWindPressureSerialNumberOptions(tunnelId)
|
||||
if(code===1000){
|
||||
windPressureDataSerialNumberOptions.value= data
|
||||
}else{
|
||||
ElMessage.error(msg)
|
||||
}
|
||||
}
|
||||
getWindPressureOptions()
|
||||
const getOtherSensorOptions =async () => {
|
||||
let {data,code,msg}=await getOtherSensorSerialNumberOptions(tunnelId)
|
||||
if(code===1000){
|
||||
otherSensorSerialNumberOptions.value= data
|
||||
}else{
|
||||
ElMessage.error(msg)
|
||||
}
|
||||
}
|
||||
getOtherSensorOptions()
|
||||
const clearWinDataSelectedOption=()=>{
|
||||
winDataSelectedOption.value=[]
|
||||
}
|
||||
const changeWindDataSerialNumber = (value,options) => {
|
||||
options?.forEach(item=>{
|
||||
if(item.value==value){
|
||||
if(item.label.indexOf('4G')>=0){
|
||||
winDataSelectedOption.value.push(value)
|
||||
}else{
|
||||
winDataSelectedOption.value=[]
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
const serialNumberOptionDisabled=(item)=>{
|
||||
return winDataSelectedOption.value.indexOf(item.value) >= 0;
|
||||
}
|
||||
const changeData = (item) => {
|
||||
return {
|
||||
equipmentId: item.equipmentId,
|
||||
unit: item.unit,
|
||||
alarmValue: item.alarmValue,
|
||||
serialNumber:item.serialNumber,
|
||||
miniRange: parseInt(item.miniRange),
|
||||
maxRange: parseInt(item.maxRange),
|
||||
state: item.state,
|
||||
}
|
||||
}
|
||||
const editEquip = debounce(() => {
|
||||
const loading = ElLoading.service({
|
||||
lock: true,
|
||||
text: '修改中...',
|
||||
background: 'rgba(0, 0, 0, 0.7)',
|
||||
customClass: 'allLoading'
|
||||
})
|
||||
let newFrequency = [{
|
||||
acquisitionPeriod: fanFrequency.value * 1000,
|
||||
tunnelId: parseInt(tunnelId),
|
||||
typeKey: 'frequency'
|
||||
}, {
|
||||
acquisitionPeriod: windFrequency.value * 1000,
|
||||
tunnelId: parseInt(tunnelId),
|
||||
typeKey: 'windPressure'
|
||||
}, {
|
||||
acquisitionPeriod: otherFrequency.value * 1000,
|
||||
tunnelId: parseInt(tunnelId),
|
||||
typeKey: 'sensor'
|
||||
}]
|
||||
let newFan = []
|
||||
let newWind = []
|
||||
let newSensor = []
|
||||
fanData.value.forEach(item => {
|
||||
let obj = {
|
||||
equipmentId: item.equipmentId,
|
||||
ratedPower: parseInt(item.ratedPower),
|
||||
acurrentValue: parseInt(item.acurrentValue),
|
||||
bcurrentValue: parseInt(item.bcurrentValue),
|
||||
ccurrentValue: parseInt(item.ccurrentValue),
|
||||
serialNumber:item.serialNumber,
|
||||
state: parseInt(item.state)
|
||||
}
|
||||
newFan.push(obj)
|
||||
})
|
||||
winData.value.forEach(item => {
|
||||
newWind.push(changeData(item))
|
||||
})
|
||||
otherData.value.forEach(item => {
|
||||
newSensor.push(changeData(item))
|
||||
})
|
||||
const basicData = {
|
||||
tunnelId: tunnelId,
|
||||
acquisitionList: newFrequency,
|
||||
frequencyChangerList: newFan,
|
||||
windPressureSensorList: newWind,
|
||||
sensorList: newSensor,
|
||||
// shuntList: editFenLiuData.value,
|
||||
}
|
||||
// console.info("🚀 ~ file:index method: line:478 -----",basicData)
|
||||
editEquipment(basicData).then(res => {
|
||||
if (res.code === 1000) {
|
||||
loading.close()
|
||||
ElMessage.success('修改成功')
|
||||
router.push('/tunnel/' + siteId.value + '/' + type + '/' + userId)
|
||||
} else {
|
||||
ElMessage.error(res.msg)
|
||||
loading.close()
|
||||
|
||||
}
|
||||
})
|
||||
}, 100)
|
||||
|
||||
const handleChangeMenu = (e) => {
|
||||
changeIndex.value = e
|
||||
}
|
||||
|
||||
const getList = () => {
|
||||
const loading = ElLoading.service({
|
||||
lock: true,
|
||||
text: '正在加载系统资源...',
|
||||
background: 'rgba(0, 0, 0, 0.7)',
|
||||
customClass: 'allLoading'
|
||||
})
|
||||
getEquipmentList(tunnelId).then( res => {
|
||||
if (res.code === 1000) {
|
||||
fanData.value = res.data.frequencyChangerList
|
||||
res.data.windPressureSensorList?.forEach(item => {
|
||||
item.offset = item.offset + 4000
|
||||
})
|
||||
winData.value = res.data.windPressureSensorList
|
||||
winData.value?.forEach(item => {
|
||||
for (const equipmentId in windPressureDataSerialNumberOptions.value) {
|
||||
if(item.equipmentId == equipmentId){
|
||||
item.serialNumberOption =windPressureDataSerialNumberOptions.value[equipmentId]
|
||||
}
|
||||
}
|
||||
})
|
||||
res.data.sensorList?.forEach(item => {
|
||||
item.offset = item.offset + 4000
|
||||
})
|
||||
otherData.value = res.data.sensorList
|
||||
res.data.acquisitionList.map(item => {
|
||||
item.acquisitionPeriod = item.acquisitionPeriod / 1000
|
||||
if (item.typeKey === 'frequency') {
|
||||
fanFrequency.value = item.acquisitionPeriod
|
||||
} else if (item.typeKey === 'windPressure') {
|
||||
windFrequency.value = item.acquisitionPeriod
|
||||
} else if (item.typeKey === 'sensor') {
|
||||
otherFrequency.value = item.acquisitionPeriod
|
||||
}
|
||||
})
|
||||
}
|
||||
loading.close()
|
||||
})
|
||||
}
|
||||
const getTunnel = () => {
|
||||
getTunnelDetail(tunnelId).then((res) => {
|
||||
if (res?.code === 1000) {
|
||||
siteId.value = res.data.siteId
|
||||
tunnelName.value = res.data.tunnelName
|
||||
}
|
||||
});
|
||||
}
|
||||
getTunnel()
|
||||
getList()
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.serialNumber{
|
||||
.el-input{
|
||||
width: 580px!important;
|
||||
}
|
||||
.el-input__suffix-inner{
|
||||
.el-icon{
|
||||
width: 3em!important;
|
||||
height: 3em!important;
|
||||
color: #fff!important;
|
||||
svg{
|
||||
width: 3em!important;
|
||||
height: 3em!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-select.serialNumber {
|
||||
border-radius: 6px!important;
|
||||
border: 1px solid #05FEFF!important;
|
||||
background-color: transparent!important;
|
||||
.el-select__wrapper{
|
||||
height: 54px!important;
|
||||
color: #FFFFFF!important;
|
||||
font-size: 40px!important;
|
||||
//height: auto!important;
|
||||
line-height: normal!important;
|
||||
border-radius: 6px!important;
|
||||
border: 1px solid #05FEFF!important;
|
||||
background-color: transparent!important;
|
||||
}
|
||||
.el-select__placeholder {
|
||||
height: 54px;
|
||||
line-height: 54px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.serialNumber-select.el-popper {
|
||||
background: #064B66 !important;
|
||||
border: 2px solid #05FEFF !important;
|
||||
|
||||
.el-select-dropdown {
|
||||
min-width: 130px !important;
|
||||
}
|
||||
.el-select-dropdown__item.is-hovering{
|
||||
background-color: #064B66 !important;
|
||||
}
|
||||
.el-select-dropdown__item {
|
||||
color: #FFFFFF;
|
||||
border-bottom: 1px solid #05FEFF;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
.el-select-dropdown__item.selected {
|
||||
background-color: transparent !important;
|
||||
color: #F7B500;
|
||||
}
|
||||
.el-select-dropdown__item.hover,
|
||||
.el-select-dropdown__item:hover {
|
||||
background-color: transparent !important;
|
||||
color: #F7B500;
|
||||
}
|
||||
.el-select-dropdown__item.is-disabled{
|
||||
background-color: transparent !important;
|
||||
color: #fff!important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
.tunnel-bgc {
|
||||
padding: 85px 0 0 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url('@/assets/images/tunnel/sd_bj.png');
|
||||
|
||||
.box-top {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
|
||||
.tunnel-name {
|
||||
margin-left: 120px;
|
||||
height: 61px;
|
||||
font-size: 46px;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
line-height: 61px;
|
||||
}
|
||||
|
||||
.back-tunnel {
|
||||
cursor: pointer;
|
||||
margin: 0 0 0 70px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 178px;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
border-radius: 11px;
|
||||
border: 2px solid #08B7B8;
|
||||
font-size: 38px;
|
||||
color: #FFFFFF;
|
||||
|
||||
.back-icon {
|
||||
margin-right: 20px;
|
||||
margin-left: 23px;
|
||||
width: 33px;
|
||||
height: 33px;
|
||||
background-image: url('@/assets/images/site/zdgl_icon_fh.png');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.device-content {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 190px;
|
||||
|
||||
.device-box {
|
||||
display: flex;
|
||||
width: 3500px;
|
||||
height: 1600px;
|
||||
background: #064B66;
|
||||
border-radius: 20px;
|
||||
border: 2px solid #05FEFF;
|
||||
box-sizing: border-box;
|
||||
|
||||
.box-left {
|
||||
padding-left: 24px;
|
||||
width: 300px;
|
||||
height: 1596px;
|
||||
background: #0D5A7A;
|
||||
border-radius: 20px 0px 0px 20px;
|
||||
|
||||
:deep(.el-menu) {
|
||||
border-right: none;
|
||||
margin-top: 261px;
|
||||
background-color: #0D5A7A;
|
||||
|
||||
.el-menu-item.is-active {
|
||||
background-image: url(../../assets/images/device/sdgl_xz.png);
|
||||
}
|
||||
|
||||
.el-menu-item {
|
||||
color: #fff;
|
||||
height: 90px;
|
||||
font-size: 40px;
|
||||
|
||||
&:hover {
|
||||
background-color: #0D5A7A;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
letter-spacing: 120px;
|
||||
}
|
||||
|
||||
&:nth-child(2) {
|
||||
letter-spacing: 120px;
|
||||
}
|
||||
|
||||
//&:nth-child(4) {
|
||||
// letter-spacing: 40px;
|
||||
//}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
|
||||
.device-title {
|
||||
margin-top: 60px;
|
||||
line-height: 61px;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
> span:first-child {
|
||||
font-size: 46px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.collection-frequency {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
right: 102px;
|
||||
|
||||
> span:first-child {
|
||||
font-size: 38px !important;
|
||||
white-space: pre;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
:deep(.el-input__wrapper) {
|
||||
width: 166px;
|
||||
height: 56px;
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #05FEFF;
|
||||
transform: none;
|
||||
transition: none;
|
||||
|
||||
.el-input__inner {
|
||||
height: 54px;
|
||||
font-size: 30px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.el-input__suffix-inner {
|
||||
font-size: 30px;
|
||||
color: #08B7B8;
|
||||
line-height: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btns {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
position: absolute;
|
||||
bottom: 70px;
|
||||
}
|
||||
|
||||
.device-table {
|
||||
margin-top: 50px;
|
||||
margin-left: 50px;
|
||||
margin-right: 50px;
|
||||
|
||||
.active {
|
||||
color: #FFFFFF;
|
||||
background: #0f7da9;
|
||||
}
|
||||
|
||||
.wind-switch {
|
||||
//margin-left: 26px;
|
||||
}
|
||||
|
||||
.switch {
|
||||
margin-top: 22px;
|
||||
|
||||
display: flex;
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #05FEFF;
|
||||
overflow: hidden;
|
||||
color: #51A2B3;
|
||||
line-height: 40px;
|
||||
font-size: 36px;
|
||||
|
||||
& > div {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-table--fit) {
|
||||
//width: 1780px !important;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
:deep(.cell) {
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
color: #fff;
|
||||
font-size: 38px;
|
||||
}
|
||||
|
||||
:deep(.el-table tr) {
|
||||
background-color: #1C5971;
|
||||
}
|
||||
|
||||
:deep(.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell) {
|
||||
background-color: #1C5971;
|
||||
}
|
||||
|
||||
:deep(.el-table__row--striped) {
|
||||
background-color: #13849C !important;
|
||||
}
|
||||
|
||||
:deep(.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell) {
|
||||
background-color: #13849C !important;
|
||||
}
|
||||
|
||||
:deep(.el-table__cell) {
|
||||
.el-input {
|
||||
width: 180px;
|
||||
height: 53px;
|
||||
}
|
||||
|
||||
.el-input__wrapper {
|
||||
border-radius: 6px;
|
||||
border: 1px solid #05FEFF;
|
||||
background-color: transparent;
|
||||
|
||||
.el-input__inner {
|
||||
color: #FFFFFF;
|
||||
font-size: 40px;
|
||||
height: auto;
|
||||
line-height: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-table__inner-wrapper::before) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
860
src/views/device-manage/index-or.vue
Normal file
860
src/views/device-manage/index-or.vue
Normal file
@@ -0,0 +1,860 @@
|
||||
<template>
|
||||
<div class="tunnel-bgc">
|
||||
<div class="box-top">
|
||||
<div class="back-tunnel" @click="router.back(-1)">
|
||||
<div class="back-icon"></div>
|
||||
<span>返回</span>
|
||||
</div>
|
||||
<div class="tunnel-name">
|
||||
{{ tunnelName }}
|
||||
</div>
|
||||
<tunnel-title/>
|
||||
</div>
|
||||
<div class="device-content">
|
||||
<div class="device-box">
|
||||
<div class="box-left">
|
||||
<el-menu
|
||||
default-active="1"
|
||||
@select="handleChangeMenu"
|
||||
>
|
||||
<el-menu-item index="1">
|
||||
<span>风机</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="2">
|
||||
<span>风压</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="3">
|
||||
<span>其他传感器</span>
|
||||
</el-menu-item>
|
||||
<!-- <el-menu-item index="4">-->
|
||||
<!-- <span>分流器</span>-->
|
||||
<!-- </el-menu-item>-->
|
||||
</el-menu>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==1">
|
||||
<div class="device-title">
|
||||
<span>风机设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="fanFrequency" @change="changeFan">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;" table-layout="auto"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="fanData">
|
||||
<el-table-column prop="equipmentName" label="设备名称" align="center"/>
|
||||
<el-table-column prop="ratedPower" label="额定功率" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="额定功率" v-model="scope.row.ratedPower"
|
||||
@change="changeFanData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phaseCurrentAOffset" label="A电流偏移量" align="center"/>
|
||||
<el-table-column prop="acurrentValue" label="A电流阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="A电流" v-model="scope.row.acurrentValue"
|
||||
@change="changeFanData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phaseCurrentBOffset" label="B电流偏移量" align="center"/>
|
||||
<el-table-column prop="bcurrentValue" label="B电流阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="B电流" v-model="scope.row.bcurrentValue"
|
||||
@change="changeFanData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phaseCurrentCOffset" label="C电流偏移量" align="center"/>
|
||||
<el-table-column prop="ccurrentValue" label="C电流阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="C电流" v-model="scope.row.ccurrentValue"
|
||||
@change="changeFanData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">-->
|
||||
<!-- <template #default="scope">-->
|
||||
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"-->
|
||||
<!-- @change="changeFanData(scope.row)" class="serialNumber">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in scope.row.serialNumberOption"-->
|
||||
<!-- :key="item.value"-->
|
||||
<!-- :label="item.label"-->
|
||||
<!-- :value="item.value"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click="scope.row.state = 1;changeFanData(scope.row)"
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0;changeFanData(scope.row)"
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="editEquip">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==2">
|
||||
<div class="device-title">
|
||||
<span>风压设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="windFrequency" @change="changeWind">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe table-layout="auto"
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="winData">
|
||||
<el-table-column prop="equipmentName" label="设备名称" align="center"/>
|
||||
<el-table-column prop="offset" label="偏移量" align="center"/>
|
||||
<el-table-column prop="unit" label="单位" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="单位" v-model="scope.row.unit" @change="changeWindData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="alarmValue" label="阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="阈值" v-model="scope.row.alarmValue"
|
||||
@change="changeWindData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="miniRange" label="最小范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最小范围" v-model="scope.row.miniRange"
|
||||
@change="changeWindData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="maxRange" label="最大范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最大范围" v-model="scope.row.maxRange"
|
||||
@change="changeWindData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">-->
|
||||
<!-- <template #default="scope">-->
|
||||
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"-->
|
||||
<!-- @change="changeWindData(scope.row)" class="serialNumber">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in scope.row.serialNumberOption"-->
|
||||
<!-- :key="item.value"-->
|
||||
<!-- :label="item.label"-->
|
||||
<!-- :value="item.value"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch wind-switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click=" scope.row.state = 1;changeWindData(scope.row)"
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0;changeWindData(scope.row)"
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="editEquip">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==3">
|
||||
<div class="device-title">
|
||||
<span>其他传感器设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="otherFrequency" @change="changeOther">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe table-layout="auto"
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="otherData">
|
||||
<el-table-column prop="equipmentName" label="设备名称" align="center"/>
|
||||
<el-table-column prop="offset" label="偏移量" align="center"/>
|
||||
<el-table-column prop="unit" label="单位" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="单位" v-model="scope.row.unit" @change="changeOtherData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="alarmValue" label="阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="阈值" v-model="scope.row.alarmValue"
|
||||
@change="changeOtherData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="miniRange" label="最小范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最小范围" v-model="scope.row.miniRange"
|
||||
@change="changeOtherData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="maxRange" label="最大范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最大范围" v-model="scope.row.maxRange"
|
||||
@change="changeOtherData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">-->
|
||||
<!-- <template #default="scope">-->
|
||||
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"-->
|
||||
<!-- @change="changeOtherData(scope.row)" clearable class="serialNumber">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in scope.row.serialNumberOption"-->
|
||||
<!-- :key="item.value"-->
|
||||
<!-- :label="item.label"-->
|
||||
<!-- :value="item.value"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch wind-switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click=" scope.row.state = 1;changeOtherData(scope.row)"
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0;changeOtherData(scope.row)"
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="editEquip">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==4">
|
||||
<div class="device-title">
|
||||
<span>分流器设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="fenFrequency">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="fenLiuData">
|
||||
<el-table-column prop="name" label="设备名称" align="center"/>
|
||||
<el-table-column prop="offset" label="偏移量" align="center"/>
|
||||
<el-table-column prop="thresholdValue" label="阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="阈值" v-model="scope.row.thresholdValue"
|
||||
@change="changeFenData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click=" scope.row.state = 1;changeFenData(scope.row)"
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0;changeFenData(scope.row)"
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="handleEditFen">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {ElLoading, ElMessage} from "element-plus";
|
||||
import {getEquipmentList, editEquipment, getTunnelDetail, getEquipmentSerialNumberOptions} from "@/api/tunnelManage";
|
||||
import TunnelTitle from "@/components/tunnelTitle/index.vue";
|
||||
import {debounce} from 'lodash'
|
||||
|
||||
const router = useRouter()
|
||||
const tunnelId = reactive(router.currentRoute.value.params.tunnelId)
|
||||
const userId = reactive(router.currentRoute.value.params.userId)
|
||||
const type = reactive(router.currentRoute.value.params.type)
|
||||
const fanFrequency = ref(0)
|
||||
const windFrequency = ref(0)
|
||||
const otherFrequency = ref(0)
|
||||
const changeIndex = ref(1)
|
||||
const fanData = ref([])
|
||||
const editFanData = ref([])
|
||||
const winData = ref([])
|
||||
const editWinData = ref([])
|
||||
const otherData = ref([])
|
||||
const editOtherData = ref([])
|
||||
const fenLiuData = ref([])
|
||||
const editFenLiuData = ref([])
|
||||
const frequencyData = ref([])
|
||||
const serialNumberOptions = ref([])
|
||||
const siteId = ref(0)
|
||||
const tunnelName = ref('')
|
||||
const getSerialNumberOptions =async (equipmentId) => {
|
||||
console.log('tunnelId',tunnelId)
|
||||
let {data,code,msg}=await getEquipmentSerialNumberOptions(tunnelId,equipmentId)
|
||||
if(code===1000){
|
||||
return data
|
||||
}else{
|
||||
ElMessage.error(msg)
|
||||
}
|
||||
// getEquipmentSerialNumberOptions(tunnelId,equipmentId).then(res => {
|
||||
// if (res.code === 1000) {
|
||||
// serialNumberOptions.value = res.data
|
||||
// } else {
|
||||
// ElMessage.error(res.msg)
|
||||
// }
|
||||
// })
|
||||
}
|
||||
// getSerialNumberOptions()
|
||||
const changeFan = (e) => {
|
||||
// const fanObj = {
|
||||
// acquisitionPeriod: e * 1000,
|
||||
// tunnelId: tunnelId,
|
||||
// typeKey: 'frequency'
|
||||
// }
|
||||
// frequencyData.value.push(fanObj)
|
||||
}
|
||||
const changeFanData = (row) => {
|
||||
// editFanData.value.push(row)
|
||||
}
|
||||
const changeWind = (e) => {
|
||||
// const windObj = {
|
||||
// acquisitionPeriod: e * 1000,
|
||||
// tunnelId: tunnelId,
|
||||
// typeKey: 'windPressure'
|
||||
// }
|
||||
// frequencyData.value.push(windObj)
|
||||
}
|
||||
const changeWindData = (row) => {
|
||||
// editWinData.value.push(row)
|
||||
}
|
||||
const changeOther = (e) => {
|
||||
// const otherObj = {
|
||||
// acquisitionPeriod: e * 1000,
|
||||
// tunnelId: tunnelId,
|
||||
// typeKey: 'sensor'
|
||||
// }
|
||||
// frequencyData.value.push(otherObj)
|
||||
}
|
||||
const changeOtherData = (row) => {
|
||||
// editOtherData.value.push(row)
|
||||
}
|
||||
const changeData = (item) => {
|
||||
return {
|
||||
equipmentId: item.equipmentId,
|
||||
unit: item.unit,
|
||||
alarmValue: item.alarmValue,
|
||||
serialNumber:item.serialNumber,
|
||||
miniRange: parseInt(item.miniRange),
|
||||
maxRange: parseInt(item.maxRange),
|
||||
state: item.state,
|
||||
}
|
||||
}
|
||||
const editEquip = debounce(() => {
|
||||
let newFrequency = [{
|
||||
acquisitionPeriod: fanFrequency.value * 1000,
|
||||
tunnelId: parseInt(tunnelId),
|
||||
typeKey: 'frequency'
|
||||
}, {
|
||||
acquisitionPeriod: windFrequency.value * 1000,
|
||||
tunnelId: parseInt(tunnelId),
|
||||
typeKey: 'windPressure'
|
||||
}, {
|
||||
acquisitionPeriod: otherFrequency.value * 1000,
|
||||
tunnelId: parseInt(tunnelId),
|
||||
typeKey: 'sensor'
|
||||
}]
|
||||
let newFan = []
|
||||
let newWind = []
|
||||
let newSensor = []
|
||||
fanData.value.forEach(item => {
|
||||
let obj = {
|
||||
equipmentId: item.equipmentId,
|
||||
ratedPower: parseInt(item.ratedPower),
|
||||
acurrentValue: parseInt(item.acurrentValue),
|
||||
bcurrentValue: parseInt(item.bcurrentValue),
|
||||
ccurrentValue: parseInt(item.ccurrentValue),
|
||||
serialNumber:item.serialNumber,
|
||||
state: parseInt(item.state)
|
||||
}
|
||||
newFan.push(obj)
|
||||
})
|
||||
winData.value.forEach(item => {
|
||||
newWind.push(changeData(item))
|
||||
})
|
||||
otherData.value.forEach(item => {
|
||||
newSensor.push(changeData(item))
|
||||
})
|
||||
const basicData = {
|
||||
tunnelId: tunnelId,
|
||||
acquisitionList: newFrequency,
|
||||
frequencyChangerList: newFan,
|
||||
windPressureSensorList: newWind,
|
||||
sensorList: newSensor,
|
||||
// shuntList: editFenLiuData.value,
|
||||
}
|
||||
// console.info("🚀 ~ file:index method: line:478 -----",basicData)
|
||||
editEquipment(basicData).then(res => {
|
||||
if (res.code === 1000) {
|
||||
ElMessage.success('修改成功')
|
||||
router.push('/tunnel/' + siteId.value + '/' + type + '/' + userId)
|
||||
} else {
|
||||
ElMessage.error(res.msg)
|
||||
}
|
||||
})
|
||||
}, 100)
|
||||
|
||||
const handleChangeMenu = (e) => {
|
||||
changeIndex.value = e
|
||||
}
|
||||
|
||||
const getList =async () => {
|
||||
const loading = ElLoading.service({
|
||||
lock: true,
|
||||
text: '正在加载系统资源...',
|
||||
background: 'rgba(0, 0, 0, 0.7)',
|
||||
customClass: 'allLoading'
|
||||
})
|
||||
await getEquipmentList(tunnelId).then( res => {
|
||||
if (res.code === 1000) {
|
||||
fanData.value = res.data.frequencyChangerList
|
||||
fanData.value?.forEach( async item => {
|
||||
item.serialNumberOption =await getSerialNumberOptions(item.equipmentId)
|
||||
})
|
||||
res.data.windPressureSensorList?.forEach(item => {
|
||||
item.offset = item.offset + 4000
|
||||
})
|
||||
winData.value = res.data.windPressureSensorList
|
||||
winData.value?.forEach( async item => {
|
||||
item.serialNumberOption =await getSerialNumberOptions(item.equipmentId)
|
||||
})
|
||||
res.data.sensorList?.forEach(item => {
|
||||
item.offset = item.offset + 4000
|
||||
})
|
||||
otherData.value = res.data.sensorList
|
||||
otherData.value?.forEach( async item => {
|
||||
item.serialNumberOption =await getSerialNumberOptions(item.equipmentId)
|
||||
})
|
||||
res.data.acquisitionList.map(item => {
|
||||
item.acquisitionPeriod = item.acquisitionPeriod / 1000
|
||||
if (item.typeKey === 'frequency') {
|
||||
fanFrequency.value = item.acquisitionPeriod
|
||||
} else if (item.typeKey === 'windPressure') {
|
||||
windFrequency.value = item.acquisitionPeriod
|
||||
} else if (item.typeKey === 'sensor') {
|
||||
otherFrequency.value = item.acquisitionPeriod
|
||||
}
|
||||
})
|
||||
}
|
||||
loading.close()
|
||||
})
|
||||
}
|
||||
const getTunnel = () => {
|
||||
getTunnelDetail(tunnelId).then((res) => {
|
||||
if (res?.code === 1000) {
|
||||
siteId.value = res.data.siteId
|
||||
tunnelName.value = res.data.tunnelName
|
||||
}
|
||||
});
|
||||
}
|
||||
getTunnel()
|
||||
getList()
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.serialNumber{
|
||||
.el-input{
|
||||
width: 580px!important;
|
||||
}
|
||||
.el-input__suffix-inner{
|
||||
.el-icon{
|
||||
width: 3em!important;
|
||||
height: 3em!important;
|
||||
color: #fff!important;
|
||||
svg{
|
||||
width: 3em!important;
|
||||
height: 3em!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-select.serialNumber {
|
||||
border-radius: 6px!important;
|
||||
border: 1px solid #05FEFF!important;
|
||||
background-color: transparent!important;
|
||||
.el-select__wrapper{
|
||||
height: 54px!important;
|
||||
color: #FFFFFF!important;
|
||||
font-size: 40px!important;
|
||||
//height: auto!important;
|
||||
line-height: normal!important;
|
||||
border-radius: 6px!important;
|
||||
border: 1px solid #05FEFF!important;
|
||||
background-color: transparent!important;
|
||||
}
|
||||
.el-select__placeholder {
|
||||
height: 54px;
|
||||
line-height: 54px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.serialNumber-select.el-popper {
|
||||
background: #064B66 !important;
|
||||
border: 2px solid #05FEFF !important;
|
||||
|
||||
.el-select-dropdown {
|
||||
min-width: 130px !important;
|
||||
}
|
||||
.el-select-dropdown__item.is-hovering{
|
||||
background-color: #064B66 !important;
|
||||
}
|
||||
.el-select-dropdown__item {
|
||||
color: #FFFFFF;
|
||||
border-bottom: 1px solid #05FEFF;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
.el-select-dropdown__item.hover,
|
||||
.el-select-dropdown__item:hover {
|
||||
background-color: transparent !important;
|
||||
color: #F7B500;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
.tunnel-bgc {
|
||||
padding: 85px 0 0 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url('@/assets/images/tunnel/sd_bj.png');
|
||||
|
||||
.box-top {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
|
||||
.tunnel-name {
|
||||
margin-left: 120px;
|
||||
height: 61px;
|
||||
font-size: 46px;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
line-height: 61px;
|
||||
}
|
||||
|
||||
.back-tunnel {
|
||||
cursor: pointer;
|
||||
margin: 0 0 0 70px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 178px;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
border-radius: 11px;
|
||||
border: 2px solid #08B7B8;
|
||||
font-size: 38px;
|
||||
color: #FFFFFF;
|
||||
|
||||
.back-icon {
|
||||
margin-right: 20px;
|
||||
margin-left: 23px;
|
||||
width: 33px;
|
||||
height: 33px;
|
||||
background-image: url('@/assets/images/site/zdgl_icon_fh.png');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.device-content {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 190px;
|
||||
|
||||
.device-box {
|
||||
display: flex;
|
||||
width: 3500px;
|
||||
height: 1600px;
|
||||
background: #064B66;
|
||||
border-radius: 20px;
|
||||
border: 2px solid #05FEFF;
|
||||
box-sizing: border-box;
|
||||
|
||||
.box-left {
|
||||
padding-left: 24px;
|
||||
width: 300px;
|
||||
height: 1596px;
|
||||
background: #0D5A7A;
|
||||
border-radius: 20px 0px 0px 20px;
|
||||
|
||||
:deep(.el-menu) {
|
||||
border-right: none;
|
||||
margin-top: 261px;
|
||||
background-color: #0D5A7A;
|
||||
|
||||
.el-menu-item.is-active {
|
||||
background-image: url(../../assets/images/device/sdgl_xz.png);
|
||||
}
|
||||
|
||||
.el-menu-item {
|
||||
color: #fff;
|
||||
height: 90px;
|
||||
font-size: 40px;
|
||||
|
||||
&:hover {
|
||||
background-color: #0D5A7A;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
letter-spacing: 120px;
|
||||
}
|
||||
|
||||
&:nth-child(2) {
|
||||
letter-spacing: 120px;
|
||||
}
|
||||
|
||||
//&:nth-child(4) {
|
||||
// letter-spacing: 40px;
|
||||
//}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
|
||||
.device-title {
|
||||
margin-top: 60px;
|
||||
line-height: 61px;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
> span:first-child {
|
||||
font-size: 46px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.collection-frequency {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
right: 102px;
|
||||
|
||||
> span:first-child {
|
||||
font-size: 38px !important;
|
||||
white-space: pre;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
:deep(.el-input__wrapper) {
|
||||
width: 166px;
|
||||
height: 56px;
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #05FEFF;
|
||||
transform: none;
|
||||
transition: none;
|
||||
|
||||
.el-input__inner {
|
||||
height: 54px;
|
||||
font-size: 30px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.el-input__suffix-inner {
|
||||
font-size: 30px;
|
||||
color: #08B7B8;
|
||||
line-height: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btns {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
position: absolute;
|
||||
bottom: 70px;
|
||||
}
|
||||
|
||||
.device-table {
|
||||
margin-top: 50px;
|
||||
margin-left: 50px;
|
||||
margin-right: 50px;
|
||||
|
||||
.active {
|
||||
color: #FFFFFF;
|
||||
background: #0f7da9;
|
||||
}
|
||||
|
||||
.wind-switch {
|
||||
margin-left: 26px;
|
||||
}
|
||||
|
||||
.switch {
|
||||
margin-top: 22px;
|
||||
|
||||
display: flex;
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #05FEFF;
|
||||
overflow: hidden;
|
||||
color: #51A2B3;
|
||||
line-height: 40px;
|
||||
font-size: 36px;
|
||||
|
||||
& > div {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-table--fit) {
|
||||
//width: 1780px !important;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
:deep(.cell) {
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
color: #fff;
|
||||
font-size: 38px;
|
||||
}
|
||||
|
||||
:deep(.el-table tr) {
|
||||
background-color: #1C5971;
|
||||
}
|
||||
|
||||
:deep(.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell) {
|
||||
background-color: #1C5971;
|
||||
}
|
||||
|
||||
:deep(.el-table__row--striped) {
|
||||
background-color: #13849C !important;
|
||||
}
|
||||
|
||||
:deep(.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell) {
|
||||
background-color: #13849C !important;
|
||||
}
|
||||
|
||||
:deep(.el-table__cell) {
|
||||
.el-input {
|
||||
width: 180px;
|
||||
height: 53px;
|
||||
}
|
||||
|
||||
.el-input__wrapper {
|
||||
border-radius: 6px;
|
||||
border: 1px solid #05FEFF;
|
||||
background-color: transparent;
|
||||
|
||||
.el-input__inner {
|
||||
color: #FFFFFF;
|
||||
font-size: 40px;
|
||||
height: auto;
|
||||
line-height: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-table__inner-wrapper::before) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
860
src/views/device-manage/index-origanl.vue
Normal file
860
src/views/device-manage/index-origanl.vue
Normal file
@@ -0,0 +1,860 @@
|
||||
<template>
|
||||
<div class="tunnel-bgc">
|
||||
<div class="box-top">
|
||||
<div class="back-tunnel" @click="router.back(-1)">
|
||||
<div class="back-icon"></div>
|
||||
<span>返回</span>
|
||||
</div>
|
||||
<div class="tunnel-name">
|
||||
{{ tunnelName }}
|
||||
</div>
|
||||
<tunnel-title/>
|
||||
</div>
|
||||
<div class="device-content">
|
||||
<div class="device-box">
|
||||
<div class="box-left">
|
||||
<el-menu
|
||||
default-active="1"
|
||||
@select="handleChangeMenu"
|
||||
>
|
||||
<el-menu-item index="1">
|
||||
<span>风机</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="2">
|
||||
<span>风压</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="3">
|
||||
<span>其他传感器</span>
|
||||
</el-menu-item>
|
||||
<!-- <el-menu-item index="4">-->
|
||||
<!-- <span>分流器</span>-->
|
||||
<!-- </el-menu-item>-->
|
||||
</el-menu>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==1">
|
||||
<div class="device-title">
|
||||
<span>风机设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="fanFrequency" @change="changeFan">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;" table-layout="auto"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="fanData">
|
||||
<el-table-column prop="equipmentName" label="设备名称" align="center"/>
|
||||
<el-table-column prop="ratedPower" label="额定功率" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="额定功率" v-model="scope.row.ratedPower"
|
||||
@change="changeFanData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phaseCurrentAOffset" label="A电流偏移量" align="center"/>
|
||||
<el-table-column prop="acurrentValue" label="A电流阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="A电流" v-model="scope.row.acurrentValue"
|
||||
@change="changeFanData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phaseCurrentBOffset" label="B电流偏移量" align="center"/>
|
||||
<el-table-column prop="bcurrentValue" label="B电流阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="B电流" v-model="scope.row.bcurrentValue"
|
||||
@change="changeFanData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phaseCurrentCOffset" label="C电流偏移量" align="center"/>
|
||||
<el-table-column prop="ccurrentValue" label="C电流阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="C电流" v-model="scope.row.ccurrentValue"
|
||||
@change="changeFanData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">-->
|
||||
<!-- <template #default="scope">-->
|
||||
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"-->
|
||||
<!-- @change="changeFanData(scope.row)" class="serialNumber">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in scope.row.serialNumberOption"-->
|
||||
<!-- :key="item.value"-->
|
||||
<!-- :label="item.label"-->
|
||||
<!-- :value="item.value"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click="scope.row.state = 1;changeFanData(scope.row)"
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0;changeFanData(scope.row)"
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="editEquip">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==2">
|
||||
<div class="device-title">
|
||||
<span>风压设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="windFrequency" @change="changeWind">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe table-layout="auto"
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="winData">
|
||||
<el-table-column prop="equipmentName" label="设备名称" align="center"/>
|
||||
<el-table-column prop="offset" label="偏移量" align="center"/>
|
||||
<el-table-column prop="unit" label="单位" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="单位" v-model="scope.row.unit" @change="changeWindData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="alarmValue" label="阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="阈值" v-model="scope.row.alarmValue"
|
||||
@change="changeWindData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="miniRange" label="最小范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最小范围" v-model="scope.row.miniRange"
|
||||
@change="changeWindData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="maxRange" label="最大范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最大范围" v-model="scope.row.maxRange"
|
||||
@change="changeWindData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">-->
|
||||
<!-- <template #default="scope">-->
|
||||
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"-->
|
||||
<!-- @change="changeWindData(scope.row)" class="serialNumber">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in scope.row.serialNumberOption"-->
|
||||
<!-- :key="item.value"-->
|
||||
<!-- :label="item.label"-->
|
||||
<!-- :value="item.value"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch wind-switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click=" scope.row.state = 1;changeWindData(scope.row)"
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0;changeWindData(scope.row)"
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="editEquip">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==3">
|
||||
<div class="device-title">
|
||||
<span>其他传感器设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="otherFrequency" @change="changeOther">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe table-layout="auto"
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="otherData">
|
||||
<el-table-column prop="equipmentName" label="设备名称" align="center"/>
|
||||
<el-table-column prop="offset" label="偏移量" align="center"/>
|
||||
<el-table-column prop="unit" label="单位" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="单位" v-model="scope.row.unit" @change="changeOtherData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="alarmValue" label="阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="阈值" v-model="scope.row.alarmValue"
|
||||
@change="changeOtherData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="miniRange" label="最小范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最小范围" v-model="scope.row.miniRange"
|
||||
@change="changeOtherData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="maxRange" label="最大范围" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="最大范围" v-model="scope.row.maxRange"
|
||||
@change="changeOtherData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="serialNumber" label="序列号" align="center" width="500">-->
|
||||
<!-- <template #default="scope">-->
|
||||
<!-- <el-select placeholder="请选择" v-model="scope.row.serialNumber" popper-class="serialNumber-select"-->
|
||||
<!-- @change="changeOtherData(scope.row)" clearable class="serialNumber">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in scope.row.serialNumberOption"-->
|
||||
<!-- :key="item.value"-->
|
||||
<!-- :label="item.label"-->
|
||||
<!-- :value="item.value"-->
|
||||
<!-- />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch wind-switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click=" scope.row.state = 1;changeOtherData(scope.row)"
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0;changeOtherData(scope.row)"
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="editEquip">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-right" v-if="changeIndex==4">
|
||||
<div class="device-title">
|
||||
<span>分流器设备管理</span>
|
||||
<div class="collection-frequency">
|
||||
<span>采集频率</span>
|
||||
<el-input type="number" v-model="fenFrequency">
|
||||
<template #suffix>
|
||||
<span>秒/次</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-table">
|
||||
<el-table stripe
|
||||
style="border-bottom: 1px #06e5e5 solid;background-color: #011c29;--el-table-border-color: none;"
|
||||
:header-cell-style="{backgroundColor: '#064B66',color: '#fff',fontSize: '40px',borderBottom: 'none' }"
|
||||
:cell-style="{textAlign: 'center',borderBottom: 'none'}" :data="fenLiuData">
|
||||
<el-table-column prop="name" label="设备名称" align="center"/>
|
||||
<el-table-column prop="offset" label="偏移量" align="center"/>
|
||||
<el-table-column prop="thresholdValue" label="阈值" align="center">
|
||||
<template #default="scope">
|
||||
<el-input placeholder="阈值" v-model="scope.row.thresholdValue"
|
||||
@change="changeFenData(scope.row)"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="state" label="状态" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<div class="switch">
|
||||
<div
|
||||
:class="{ active: scope.row.state }"
|
||||
@click=" scope.row.state = 1;changeFenData(scope.row)"
|
||||
>
|
||||
启用
|
||||
</div>
|
||||
<div
|
||||
:class="{ active: ! scope.row.state }"
|
||||
@click=" scope.row.state = 0;changeFenData(scope.row)"
|
||||
>
|
||||
停用
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="cancel-btn" @click="router.back(-1)">
|
||||
取消
|
||||
</div>
|
||||
<div class="sure-btn" @click="handleEditFen">
|
||||
确定
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {ElLoading, ElMessage} from "element-plus";
|
||||
import {getEquipmentList, editEquipment, getTunnelDetail, getEquipmentSerialNumberOptions} from "@/api/tunnelManage";
|
||||
import TunnelTitle from "@/components/tunnelTitle/index.vue";
|
||||
import {debounce} from 'lodash'
|
||||
|
||||
const router = useRouter()
|
||||
const tunnelId = reactive(router.currentRoute.value.params.tunnelId)
|
||||
const userId = reactive(router.currentRoute.value.params.userId)
|
||||
const type = reactive(router.currentRoute.value.params.type)
|
||||
const fanFrequency = ref(0)
|
||||
const windFrequency = ref(0)
|
||||
const otherFrequency = ref(0)
|
||||
const changeIndex = ref(1)
|
||||
const fanData = ref([])
|
||||
const editFanData = ref([])
|
||||
const winData = ref([])
|
||||
const editWinData = ref([])
|
||||
const otherData = ref([])
|
||||
const editOtherData = ref([])
|
||||
const fenLiuData = ref([])
|
||||
const editFenLiuData = ref([])
|
||||
const frequencyData = ref([])
|
||||
const serialNumberOptions = ref([])
|
||||
const siteId = ref(0)
|
||||
const tunnelName = ref('')
|
||||
const getSerialNumberOptions =async (equipmentId) => {
|
||||
console.log('tunnelId',tunnelId)
|
||||
let {data,code,msg}=await getEquipmentSerialNumberOptions(tunnelId,equipmentId)
|
||||
if(code===1000){
|
||||
return data
|
||||
}else{
|
||||
ElMessage.error(msg)
|
||||
}
|
||||
// getEquipmentSerialNumberOptions(tunnelId,equipmentId).then(res => {
|
||||
// if (res.code === 1000) {
|
||||
// serialNumberOptions.value = res.data
|
||||
// } else {
|
||||
// ElMessage.error(res.msg)
|
||||
// }
|
||||
// })
|
||||
}
|
||||
// getSerialNumberOptions()
|
||||
const changeFan = (e) => {
|
||||
// const fanObj = {
|
||||
// acquisitionPeriod: e * 1000,
|
||||
// tunnelId: tunnelId,
|
||||
// typeKey: 'frequency'
|
||||
// }
|
||||
// frequencyData.value.push(fanObj)
|
||||
}
|
||||
const changeFanData = (row) => {
|
||||
// editFanData.value.push(row)
|
||||
}
|
||||
const changeWind = (e) => {
|
||||
// const windObj = {
|
||||
// acquisitionPeriod: e * 1000,
|
||||
// tunnelId: tunnelId,
|
||||
// typeKey: 'windPressure'
|
||||
// }
|
||||
// frequencyData.value.push(windObj)
|
||||
}
|
||||
const changeWindData = (row) => {
|
||||
// editWinData.value.push(row)
|
||||
}
|
||||
const changeOther = (e) => {
|
||||
// const otherObj = {
|
||||
// acquisitionPeriod: e * 1000,
|
||||
// tunnelId: tunnelId,
|
||||
// typeKey: 'sensor'
|
||||
// }
|
||||
// frequencyData.value.push(otherObj)
|
||||
}
|
||||
const changeOtherData = (row) => {
|
||||
// editOtherData.value.push(row)
|
||||
}
|
||||
const changeData = (item) => {
|
||||
return {
|
||||
equipmentId: item.equipmentId,
|
||||
unit: item.unit,
|
||||
alarmValue: item.alarmValue,
|
||||
serialNumber:item.serialNumber,
|
||||
miniRange: parseInt(item.miniRange),
|
||||
maxRange: parseInt(item.maxRange),
|
||||
state: item.state,
|
||||
}
|
||||
}
|
||||
const editEquip = debounce(() => {
|
||||
let newFrequency = [{
|
||||
acquisitionPeriod: fanFrequency.value * 1000,
|
||||
tunnelId: parseInt(tunnelId),
|
||||
typeKey: 'frequency'
|
||||
}, {
|
||||
acquisitionPeriod: windFrequency.value * 1000,
|
||||
tunnelId: parseInt(tunnelId),
|
||||
typeKey: 'windPressure'
|
||||
}, {
|
||||
acquisitionPeriod: otherFrequency.value * 1000,
|
||||
tunnelId: parseInt(tunnelId),
|
||||
typeKey: 'sensor'
|
||||
}]
|
||||
let newFan = []
|
||||
let newWind = []
|
||||
let newSensor = []
|
||||
fanData.value.forEach(item => {
|
||||
let obj = {
|
||||
equipmentId: item.equipmentId,
|
||||
ratedPower: parseInt(item.ratedPower),
|
||||
acurrentValue: parseInt(item.acurrentValue),
|
||||
bcurrentValue: parseInt(item.bcurrentValue),
|
||||
ccurrentValue: parseInt(item.ccurrentValue),
|
||||
serialNumber:item.serialNumber,
|
||||
state: parseInt(item.state)
|
||||
}
|
||||
newFan.push(obj)
|
||||
})
|
||||
winData.value.forEach(item => {
|
||||
newWind.push(changeData(item))
|
||||
})
|
||||
otherData.value.forEach(item => {
|
||||
newSensor.push(changeData(item))
|
||||
})
|
||||
const basicData = {
|
||||
tunnelId: tunnelId,
|
||||
acquisitionList: newFrequency,
|
||||
frequencyChangerList: newFan,
|
||||
windPressureSensorList: newWind,
|
||||
sensorList: newSensor,
|
||||
// shuntList: editFenLiuData.value,
|
||||
}
|
||||
// console.info("🚀 ~ file:index method: line:478 -----",basicData)
|
||||
editEquipment(basicData).then(res => {
|
||||
if (res.code === 1000) {
|
||||
ElMessage.success('修改成功')
|
||||
router.push('/tunnel/' + siteId.value + '/' + type + '/' + userId)
|
||||
} else {
|
||||
ElMessage.error(res.msg)
|
||||
}
|
||||
})
|
||||
}, 100)
|
||||
|
||||
const handleChangeMenu = (e) => {
|
||||
changeIndex.value = e
|
||||
}
|
||||
|
||||
const getList =async () => {
|
||||
const loading = ElLoading.service({
|
||||
lock: true,
|
||||
text: '正在加载系统资源...',
|
||||
background: 'rgba(0, 0, 0, 0.7)',
|
||||
customClass: 'allLoading'
|
||||
})
|
||||
await getEquipmentList(tunnelId).then( res => {
|
||||
if (res.code === 1000) {
|
||||
fanData.value = res.data.frequencyChangerList
|
||||
fanData.value?.forEach( async item => {
|
||||
item.serialNumberOption =await getSerialNumberOptions(item.equipmentId)
|
||||
})
|
||||
res.data.windPressureSensorList?.forEach(item => {
|
||||
item.offset = item.offset + 4000
|
||||
})
|
||||
winData.value = res.data.windPressureSensorList
|
||||
winData.value?.forEach( async item => {
|
||||
item.serialNumberOption =await getSerialNumberOptions(item.equipmentId)
|
||||
})
|
||||
res.data.sensorList?.forEach(item => {
|
||||
item.offset = item.offset + 4000
|
||||
})
|
||||
otherData.value = res.data.sensorList
|
||||
otherData.value?.forEach( async item => {
|
||||
item.serialNumberOption =await getSerialNumberOptions(item.equipmentId)
|
||||
})
|
||||
res.data.acquisitionList.map(item => {
|
||||
item.acquisitionPeriod = item.acquisitionPeriod / 1000
|
||||
if (item.typeKey === 'frequency') {
|
||||
fanFrequency.value = item.acquisitionPeriod
|
||||
} else if (item.typeKey === 'windPressure') {
|
||||
windFrequency.value = item.acquisitionPeriod
|
||||
} else if (item.typeKey === 'sensor') {
|
||||
otherFrequency.value = item.acquisitionPeriod
|
||||
}
|
||||
})
|
||||
}
|
||||
loading.close()
|
||||
})
|
||||
}
|
||||
const getTunnel = () => {
|
||||
getTunnelDetail(tunnelId).then((res) => {
|
||||
if (res?.code === 1000) {
|
||||
siteId.value = res.data.siteId
|
||||
tunnelName.value = res.data.tunnelName
|
||||
}
|
||||
});
|
||||
}
|
||||
getTunnel()
|
||||
getList()
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.serialNumber{
|
||||
.el-input{
|
||||
width: 580px!important;
|
||||
}
|
||||
.el-input__suffix-inner{
|
||||
.el-icon{
|
||||
width: 3em!important;
|
||||
height: 3em!important;
|
||||
color: #fff!important;
|
||||
svg{
|
||||
width: 3em!important;
|
||||
height: 3em!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-select.serialNumber {
|
||||
border-radius: 6px!important;
|
||||
border: 1px solid #05FEFF!important;
|
||||
background-color: transparent!important;
|
||||
.el-select__wrapper{
|
||||
height: 54px!important;
|
||||
color: #FFFFFF!important;
|
||||
font-size: 40px!important;
|
||||
//height: auto!important;
|
||||
line-height: normal!important;
|
||||
border-radius: 6px!important;
|
||||
border: 1px solid #05FEFF!important;
|
||||
background-color: transparent!important;
|
||||
}
|
||||
.el-select__placeholder {
|
||||
height: 54px;
|
||||
line-height: 54px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.serialNumber-select.el-popper {
|
||||
background: #064B66 !important;
|
||||
border: 2px solid #05FEFF !important;
|
||||
|
||||
.el-select-dropdown {
|
||||
min-width: 130px !important;
|
||||
}
|
||||
.el-select-dropdown__item.is-hovering{
|
||||
background-color: #064B66 !important;
|
||||
}
|
||||
.el-select-dropdown__item {
|
||||
color: #FFFFFF;
|
||||
border-bottom: 1px solid #05FEFF;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
.el-select-dropdown__item.hover,
|
||||
.el-select-dropdown__item:hover {
|
||||
background-color: transparent !important;
|
||||
color: #F7B500;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
.tunnel-bgc {
|
||||
padding: 85px 0 0 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url('@/assets/images/tunnel/sd_bj.png');
|
||||
|
||||
.box-top {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
|
||||
.tunnel-name {
|
||||
margin-left: 120px;
|
||||
height: 61px;
|
||||
font-size: 46px;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
line-height: 61px;
|
||||
}
|
||||
|
||||
.back-tunnel {
|
||||
cursor: pointer;
|
||||
margin: 0 0 0 70px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 178px;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
border-radius: 11px;
|
||||
border: 2px solid #08B7B8;
|
||||
font-size: 38px;
|
||||
color: #FFFFFF;
|
||||
|
||||
.back-icon {
|
||||
margin-right: 20px;
|
||||
margin-left: 23px;
|
||||
width: 33px;
|
||||
height: 33px;
|
||||
background-image: url('@/assets/images/site/zdgl_icon_fh.png');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.device-content {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 190px;
|
||||
|
||||
.device-box {
|
||||
display: flex;
|
||||
width: 3500px;
|
||||
height: 1600px;
|
||||
background: #064B66;
|
||||
border-radius: 20px;
|
||||
border: 2px solid #05FEFF;
|
||||
box-sizing: border-box;
|
||||
|
||||
.box-left {
|
||||
padding-left: 24px;
|
||||
width: 300px;
|
||||
height: 1596px;
|
||||
background: #0D5A7A;
|
||||
border-radius: 20px 0px 0px 20px;
|
||||
|
||||
:deep(.el-menu) {
|
||||
border-right: none;
|
||||
margin-top: 261px;
|
||||
background-color: #0D5A7A;
|
||||
|
||||
.el-menu-item.is-active {
|
||||
background-image: url(../../assets/images/device/sdgl_xz.png);
|
||||
}
|
||||
|
||||
.el-menu-item {
|
||||
color: #fff;
|
||||
height: 90px;
|
||||
font-size: 40px;
|
||||
|
||||
&:hover {
|
||||
background-color: #0D5A7A;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
letter-spacing: 120px;
|
||||
}
|
||||
|
||||
&:nth-child(2) {
|
||||
letter-spacing: 120px;
|
||||
}
|
||||
|
||||
//&:nth-child(4) {
|
||||
// letter-spacing: 40px;
|
||||
//}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
|
||||
.device-title {
|
||||
margin-top: 60px;
|
||||
line-height: 61px;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
> span:first-child {
|
||||
font-size: 46px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.collection-frequency {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
right: 102px;
|
||||
|
||||
> span:first-child {
|
||||
font-size: 38px !important;
|
||||
white-space: pre;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
:deep(.el-input__wrapper) {
|
||||
width: 166px;
|
||||
height: 56px;
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #05FEFF;
|
||||
transform: none;
|
||||
transition: none;
|
||||
|
||||
.el-input__inner {
|
||||
height: 54px;
|
||||
font-size: 30px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.el-input__suffix-inner {
|
||||
font-size: 30px;
|
||||
color: #08B7B8;
|
||||
line-height: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btns {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
position: absolute;
|
||||
bottom: 70px;
|
||||
}
|
||||
|
||||
.device-table {
|
||||
margin-top: 50px;
|
||||
margin-left: 50px;
|
||||
margin-right: 50px;
|
||||
|
||||
.active {
|
||||
color: #FFFFFF;
|
||||
background: #0f7da9;
|
||||
}
|
||||
|
||||
.wind-switch {
|
||||
margin-left: 26px;
|
||||
}
|
||||
|
||||
.switch {
|
||||
margin-top: 22px;
|
||||
|
||||
display: flex;
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #05FEFF;
|
||||
overflow: hidden;
|
||||
color: #51A2B3;
|
||||
line-height: 40px;
|
||||
font-size: 36px;
|
||||
|
||||
& > div {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-table--fit) {
|
||||
//width: 1780px !important;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
:deep(.cell) {
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
color: #fff;
|
||||
font-size: 38px;
|
||||
}
|
||||
|
||||
:deep(.el-table tr) {
|
||||
background-color: #1C5971;
|
||||
}
|
||||
|
||||
:deep(.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell) {
|
||||
background-color: #1C5971;
|
||||
}
|
||||
|
||||
:deep(.el-table__row--striped) {
|
||||
background-color: #13849C !important;
|
||||
}
|
||||
|
||||
:deep(.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell) {
|
||||
background-color: #13849C !important;
|
||||
}
|
||||
|
||||
:deep(.el-table__cell) {
|
||||
.el-input {
|
||||
width: 180px;
|
||||
height: 53px;
|
||||
}
|
||||
|
||||
.el-input__wrapper {
|
||||
border-radius: 6px;
|
||||
border: 1px solid #05FEFF;
|
||||
background-color: transparent;
|
||||
|
||||
.el-input__inner {
|
||||
color: #FFFFFF;
|
||||
font-size: 40px;
|
||||
height: auto;
|
||||
line-height: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-table__inner-wrapper::before) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user