Merge pull request 'dev' (#271) from dev into master

Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/271
This commit is contained in:
2024-02-26 09:47:55 +00:00
3 changed files with 126 additions and 87 deletions

View File

@@ -127,7 +127,7 @@ const handleOpenChart = (id, type) => {
const timeSelect = (index) => { const timeSelect = (index) => {
if (index === 0) { if (index === 0) {
getChartInfo(openDialogId.value, 'year') getChartInfo(openDialogId.value, 'years')
} else if (index === 1) { } else if (index === 1) {
getChartInfo(openDialogId.value, 'month') getChartInfo(openDialogId.value, 'month')
} else if (index === 2) { } else if (index === 2) {

View File

@@ -11,11 +11,11 @@
<!-- echarts --> <!-- echarts -->
<div class="echart"></div> <div class="echart"></div>
<!-- 风机名 --> <!-- 风机名 -->
<div class="fan-name">{{ changeNum(index + 1) }}号风机</div> <div class="fan-name">{{ changeNum(item) }}号风机</div>
<!-- 功能 --> <!-- 功能 -->
<div class="option-nav"> <div class="option-nav">
<div> <div>
<div class="state"> <div class="state" :class="{changeMargin: item.showTooltip}">
<div class="blue-state" :class="{ stopColor: item.breakdown }"> <div class="blue-state" :class="{ stopColor: item.breakdown }">
<div :style="{ backgroundImage: 'url(' +getImageUrl(item.breakdown)+')' }" class="state-icon"></div> <div :style="{ backgroundImage: 'url(' +getImageUrl(item.breakdown)+')' }" class="state-icon"></div>
状态<span class="fan-state">{{ item.breakdown ? '故障' : '运行' }}</span> 状态<span class="fan-state">{{ item.breakdown ? '故障' : '运行' }}</span>
@@ -24,14 +24,14 @@
<div <div
id="auto" id="auto"
:class="{ active: item.running }" :class="{ active: item.running }"
@click="item.running = true;editOperate(item)" @click="item.running = true;editOperate(item,'启动')"
> >
启动 启动
</div> </div>
<div <div
id="stop" id="stop"
:class="{ active: !item.running }" :class="{ active: !item.running }"
@click="item.running = false;editOperate(item)" @click="item.running = false;editOperate(item,'停止')"
> >
停止 停止
</div> </div>
@@ -45,27 +45,33 @@
</el-radio-group> </el-radio-group>
</div> </div>
<div class="edit-power"> <div class="edit-power">
<span style="color: white">给定频率</span> <div>
<!-- <span class="units"--> <span style="color: white">给定频率</span>
<!-- ><input--> <!-- <span class="units"-->
<!-- type="number"--> <!-- ><input-->
<!-- min="0"--> <!-- type="number"-->
<!-- v-model="item.frequencySetting"--> <!-- min="0"-->
<!-- onchange="changeFrequency(item)"--> <!-- v-model="item.frequencySetting"-->
<!-- :disabled="item.autoMode"--> <!-- onchange="changeFrequency(item)"-->
<!-- /></span>--> <!-- :disabled="item.autoMode"-->
<el-input type="number" min="0" v-model="item.frequencySetting" :disabled="item.autoMode" <!-- /></span>-->
@change="changeFrequency(item)"> <el-input type="number" min="0" v-model="item.frequencySetting" :disabled="item.autoMode" title=""
<template #suffix> @change="changeFrequency(item)" @focus="item.showTooltip=true" @blur="item.showTooltip=false">
<span>Hz</span> <template #suffix>
</template> <span>Hz</span>
</el-input> </template>
</el-input>
</div>
<span v-if="item.showTooltip">
正在输入中...
</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="current" @click="handleOpenChart(item,index)"> <div class="current" @click="handleOpenChart(item)">
<fan-info-item :wp="transducerData[index]"/> <fan-info-item :wp="transducerData[index]"/>
</div> </div>
<div class="line"></div> <div class="line"></div>
@@ -85,7 +91,7 @@
</div> </div>
<div class="digital-tunnel"> <div class="digital-tunnel">
<el-dialog :close-on-click-modal="false" v-model="isVisited" :title="changeNum(fanIndex)+'号风机电流监控数据'" <el-dialog :close-on-click-modal="false" v-model="isVisited" :title="fanIndex+'号风机电流监控数据'"
width="2175px" width="2175px"
:modal="false"> :modal="false">
<div class="left-top-icon"></div> <div class="left-top-icon"></div>
@@ -122,6 +128,7 @@ import {
editFrequencyOperationSwitch, editFrequencyOperationSwitch,
getFanEchartsInfo getFanEchartsInfo
} from "@/api/largeScreen"; } from "@/api/largeScreen";
import {ElMessage, ElMessageBox} from "element-plus";
const timeList = ref(["年", "月", "日"]); const timeList = ref(["年", "月", "日"]);
const selectTimeButton = ref(2); const selectTimeButton = ref(2);
@@ -155,7 +162,7 @@ const stateB = ref(false)
const stateC = ref(false) const stateC = ref(false)
const isVisited = ref(false) const isVisited = ref(false)
const showLoading = ref(false) const showLoading = ref(false)
const fanIndex = ref(0) const fanIndex = ref('')
const openEquipmentId = ref(0) const openEquipmentId = ref(0)
let myEcharts = reactive({}); let myEcharts = reactive({});
watch(() => props.loading, (now) => { watch(() => props.loading, (now) => {
@@ -199,11 +206,11 @@ watch(() => props.list, (now) => {
}, {deep: true}); }, {deep: true});
const timeSelect = (index) => { const timeSelect = (index) => {
if (index === 0) { if (index === 0) {
getFanInfo(openEquipmentId.value,'years') getFanInfo(openEquipmentId.value, 'years')
} else if (index === 1) { } else if (index === 1) {
getFanInfo(openEquipmentId.value,'month') getFanInfo(openEquipmentId.value, 'month')
} else if (index === 2) { } else if (index === 2) {
getFanInfo(openEquipmentId.value,'day') getFanInfo(openEquipmentId.value, 'day')
} }
}; };
const packageData = (item, type, flag) => { const packageData = (item, type, flag) => {
@@ -228,23 +235,45 @@ const packageData = (item, type, flag) => {
} }
} }
//启动/停止 //启动/停止
const editOperate = (item) => { const editOperate = (item, type) => {
const data = packageData(item, item.running) ElMessageBox.confirm(`是否${type}该风机?`, '系统提示', {
// editFrequencyOperationSwitch(data).then(res => { type: 'warning',
// console.log('修改风机启动', res) closeOnClickModal: false
// }) }).then(() => {
const data = packageData(item, item.running)
editFrequencyOperationSwitch(data).then(res => {
console.log('修改风机启动', res)
if (res.code === 1000) {
ElMessage.success(res.msg)
} else {
ElMessage.error(res.msg)
}
})
})
} }
const changeFrequency = (item) => { const changeFrequency = (item) => {
console.log('修改频率')
const data = packageData(item, item.frequencySetting, true) const data = packageData(item, item.frequencySetting, true)
// editFrequency(data).then(res => { editFrequency(data).then(res => {
// console.log('修改风机频率', res) console.log('修改风机频率', res)
// }) if (res.code === 1000) {
ElMessage.success(res.msg)
} else {
ElMessage.warning(res.msg)
}
})
} }
const changeModel = (item) => { const changeModel = (item) => {
const data = packageData(item, item.autoMode) const data = packageData(item, item.autoMode)
// editFrequencyModelSwitch(data).then(res => { editFrequencyModelSwitch(data).then(res => {
// console.log('修改自动模式', res) console.log('修改自动模式', res)
// }) if (res.code === 1000) {
ElMessage.success(res.msg)
} else {
ElMessage.warning(res.msg)
}
})
} }
const getFanInfo = (equipmentId, type = 'day') => { const getFanInfo = (equipmentId, type = 'day') => {
isVisited.value = true isVisited.value = true
@@ -258,10 +287,14 @@ const getFanInfo = (equipmentId, type = 'day') => {
} }
}) })
} }
const handleOpenChart = (item, index) => { const handleOpenChart = (item) => {
openEquipmentId.value = item.equipmentId openEquipmentId.value = item.equipmentId
getFanInfo(item.equipmentId, 'day') getFanInfo(item.equipmentId, 'day')
fanIndex.value = index + 1 if (item.equipmentId === 22) {
fanIndex.value = '一'
} else {
fanIndex.value = '二'
}
} }
const getTransData = (data) => { const getTransData = (data) => {
let tranObj = {} let tranObj = {}
@@ -294,14 +327,13 @@ const getImage = (type) => {
return "red-state-icon.png"; return "red-state-icon.png";
} }
} }
const changeNum = (index) => { const changeNum = (item) => {
switch (index) { console.log('1号变频器')
case 1: switch (item.equipmentId) {
case 22:
return '一'; return '一';
case 2: case 23:
return '二'; return '二';
case 3:
return '三';
} }
} }
const getBasicData = (data) => { const getBasicData = (data) => {
@@ -310,10 +342,12 @@ const getBasicData = (data) => {
data?.map(item => { data?.map(item => {
tranObj = { tranObj = {
equipmentId: item.equipmentId, equipmentId: item.equipmentId,
equipmentName: item.equipmentName,
equipmentType: item.equipmentType, equipmentType: item.equipmentType,
autoMode: item.autoMode,//自动模式 autoMode: item.autoMode,//自动模式
breakdown: item.breakdown,//故障 breakdown: item.breakdown,//故障
running: item.running,//启动, running: item.running,//启动,
showTooltip:false,
frequencyFeedback: item.frequencyFeedback, frequencyFeedback: item.frequencyFeedback,
frequencySetting: item.frequencySetting frequencySetting: item.frequencySetting
} }
@@ -414,7 +448,7 @@ const handleOnMounted = () => {
}, },
data: [ data: [
{ {
value: socketData.value[i].frequencyFeedback, value: socketData.value[i].frequencySetting,
fontSize: 2100, fontSize: 2100,
detail: { detail: {
valueAnimation: true, valueAnimation: true,
@@ -773,20 +807,22 @@ input[type="number"] {
color: #38cafb; color: #38cafb;
line-height: 35px; line-height: 35px;
text-align: center; text-align: center;
margin-right: 42px; margin-right: 25px;
transform: translateY(33%); transform: translateY(33%);
} }
.option-nav { .option-nav {
display: flex; //display: flex;
flex-direction: column; //flex-direction: column;
width: 70%; width: 70%;
> div:first-child { > div:first-child {
margin-top: 48px; margin-top: 48px;
display: flex; display: flex;
align-items: center; align-items: center;
.changeMargin{
margin-top: -40px;
}
.state { .state {
flex: 1; flex: 1;
display: flex; display: flex;
@@ -807,7 +843,7 @@ input[type="number"] {
height: 45px; height: 45px;
margin-right: 15px; margin-right: 15px;
color: #fff; color: #fff;
background-color: #127399; background-color: #3eab3f;
padding-left: 10px; padding-left: 10px;
border-radius: 8px; border-radius: 8px;
margin-left: -5px; margin-left: -5px;
@@ -853,7 +889,7 @@ input[type="number"] {
font-size: 28px; font-size: 28px;
color: #38cafb; color: #38cafb;
line-height: 37px; line-height: 37px;
gap: 33px; gap: 40px;
.check-box { .check-box {
display: flex; display: flex;
@@ -865,43 +901,44 @@ input[type="number"] {
.edit-power { .edit-power {
margin-top: 10px; margin-top: 10px;
display: flex; display: flex;
flex-direction: column;
> span:first-child { > div:first-child {
white-space: pre; display: flex;
margin-right: 14px;
}
//:deep(.is-disabled) { > span:first-child {
// .el-input__inner{ white-space: pre;
// color: #FFFFFF!important; margin-right: 14px;
// } }
//} :deep(.el-input__wrapper) {
:deep(.el-input__wrapper) { width: 160px;
width: 130px;
height: 44px;
background-color: transparent;
box-shadow: none;
border: 1px solid #38CAFB;
transform: none;
transition: none;
margin-right: 10px;
.el-input__inner {
height: 44px; height: 44px;
font-size: 30px; background-color: transparent;
font-weight: bold; box-shadow: none;
color: #38CAFB; border: 1px solid #38CAFB;
} transform: none;
transition: none;
margin-right: 10px;
.el-input__inner {
height: 44px;
font-size: 30px;
font-weight: bold;
color: #38CAFB;
}
.el-input__suffix-inner { .el-input__suffix-inner {
font-size: 30px; font-size: 30px;
color: #38CAFB; color: #38CAFB;
line-height: 40px; line-height: 40px;
font-weight: bold; font-weight: bold;
}
} }
} }
//.units { //.units {
// position: relative; // position: relative;
//} //}

View File

@@ -48,6 +48,7 @@ const props = defineProps({
loading: Number, loading: Number,
}); });
const windSort = ref(1) const windSort = ref(1)
const windSortId = ref(1)
const timeList = ref(["年", "月", "日"]); const timeList = ref(["年", "月", "日"]);
const selectTimeButton = ref(2); const selectTimeButton = ref(2);
const isVisited = ref(false); const isVisited = ref(false);
@@ -68,10 +69,10 @@ watch(() => props.winData, (now) => {
getScreenInfo(now.windPressureSensorList) getScreenInfo(now.windPressureSensorList)
}, {deep: true}); }, {deep: true});
const getWindInfo = (equipmentId) => { const getWindInfo = (equipmentId,type='day') => {
isVisited.value = true isVisited.value = true
showLoading.value=true showLoading.value=true
getEchartsInfo(equipmentId).then(res => { getEchartsInfo(equipmentId,type).then(res => {
if (res?.code === 1000) { if (res?.code === 1000) {
showLoading.value=false showLoading.value=false
nextTick(() => { nextTick(() => {
@@ -82,17 +83,18 @@ const getWindInfo = (equipmentId) => {
} }
const handleOpenChart = (item) => { const handleOpenChart = (item) => {
selectTimeButton.value=2
getWindInfo(item.equipmentId) getWindInfo(item.equipmentId)
windSort.value = item.equipmentName windSort.value = item.equipmentName
windSortId.value = item.equipmentId
} }
const timeSelect = (index) => { const timeSelect = (index) => {
console.log('选择时间', index)
if (index === 0) { if (index === 0) {
console.log('--年') getWindInfo(windSortId.value,'years')
} else if (index === 1) { } else if (index === 1) {
console.log('--月') getWindInfo(windSortId.value,'month')
} else if (index === 2) { } else if (index === 2) {
console.log('--日') getWindInfo(windSortId.value,'day')
} }
}; };
const getScreenInfo = (now) => { const getScreenInfo = (now) => {