Merge pull request 'dengjie' (#177) from dengjie into dev
Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/177
This commit is contained in:
@@ -21,10 +21,10 @@ export const getTunnelBySiteId = (siteId) => {
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
// 风压echarts数据
|
||||
// 传感器echarts数据
|
||||
export const getEchartsInfo = (equipmentId) => {
|
||||
return request({
|
||||
url: `/tunnel/large/screen/echarts/wind/pressure/${equipmentId}`,
|
||||
url: `/tunnel/large/screen/echarts/sensor/${equipmentId}`,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 3.3 KiB After Width: | Height: | Size: 8.0 KiB |
@@ -3,8 +3,7 @@
|
||||
<div class="fan-speed">
|
||||
<img src="@/assets/images/airInfo/fan-v-icon.png" alt=""/>
|
||||
<div class="fan-info" @click="handleOpenChart">
|
||||
<div class="input-fan"><span>风速</span><span>进风:{{ windSpeed }}m/s</span></div>
|
||||
<div class="output-fan"><span>出风:{{ windSpeed }}m/s</span></div>
|
||||
<div class="input-fan"><span>风速</span>{{ windSpeed }}m/s</div>
|
||||
</div>
|
||||
</div>
|
||||
<item-info
|
||||
@@ -146,7 +145,7 @@ const getAirInfo = (now) => {
|
||||
if (item.equipmentType === "dust" || item.equipmentType === "oxygen" || item.equipmentType === "temperature" || item.equipmentType === "humidness") {
|
||||
airObj = changeData(item)
|
||||
airArr.push(airObj)
|
||||
} else if (item.equipmentType === "windDirection") {
|
||||
} else if (item.equipmentType === "windSpeed") {
|
||||
windSpeed.value = item.value
|
||||
}
|
||||
})
|
||||
@@ -233,17 +232,6 @@ const initChart = () => {
|
||||
//配置项
|
||||
series: [
|
||||
{
|
||||
name: '进风口',
|
||||
data: [56, 12, 89, 34, 71, 43, 67, 20, 98, 72, 19, 61, 3, 85, 47, 92, 17, 76, 69, 25, 31, 49, 81, 63],
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
symbolSize: 24,
|
||||
lineStyle: {
|
||||
width: 5
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '出风口',
|
||||
data: [3, 85, 47, 92, 17, 76, 69, 25, 56, 12, 89, 34, 71, 43, 67, 20, 98, 72, 19, 61, 31, 49, 81, 63],
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
@@ -254,6 +242,7 @@ const initChart = () => {
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
myEcharts.setOption(option);
|
||||
//图表大小自适应窗口大小变化
|
||||
window.onresize = () => {
|
||||
@@ -391,13 +380,13 @@ const initAirChart = () => {
|
||||
.fan-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
justify-content: flex-start;
|
||||
|
||||
.input-fan {
|
||||
margin: 0 26px;
|
||||
//margin: 0 26px;
|
||||
|
||||
> span:last-child {
|
||||
margin-left: 30px;
|
||||
margin-left: 25px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -92,22 +92,6 @@ const stateC = ref(false)
|
||||
watch(() => props.transducerData, (now) => {
|
||||
getTransData(now.frequencyChangerList)
|
||||
}, {deep: true});
|
||||
watch(() => props.list, (now) => {
|
||||
transducerData.value.forEach(item => {
|
||||
now.forEach(newItem => {
|
||||
if (item.equipmentId === newItem.equipmentId) {
|
||||
if (newItem.frequencyFeedback) {
|
||||
item.frequencySetting = newItem.frequencySetting
|
||||
item.frequencyFeedback = newItem.frequencyFeedback
|
||||
} else if (newItem.phaseCurrentA) {
|
||||
item.phaseCurrentA = newItem.phaseCurrentA
|
||||
item.phaseCurrentB = newItem.phaseCurrentB
|
||||
item.phaseCurrentC = newItem.phaseCurrentC
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
}, {deep: true});
|
||||
watch(() => props.fanData, (now) => {
|
||||
getBasicData(now.frequencyChangerList)
|
||||
}, {deep: true});
|
||||
@@ -129,9 +113,9 @@ watch(() => props.list, (now) => {
|
||||
item.frequencySetting = newItem.frequencySetting
|
||||
item.frequencyFeedback = newItem.frequencyFeedback
|
||||
} else if (newItem.phaseCurrentA) {
|
||||
item.phaseCurrentA = newItem.phaseCurrentA
|
||||
item.phaseCurrentB = newItem.phaseCurrentB
|
||||
item.phaseCurrentC = newItem.phaseCurrentC
|
||||
item.valueA = newItem.phaseCurrentA
|
||||
item.valueB = newItem.phaseCurrentB
|
||||
item.valueC = newItem.phaseCurrentC
|
||||
}
|
||||
}
|
||||
})
|
||||
@@ -582,6 +566,7 @@ input[type="number"] {
|
||||
}
|
||||
|
||||
.units {
|
||||
z-index: 22;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<div class="point" ref="pointA"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wind-pressure-item" :class="{ abnormal:isWaringA }">
|
||||
<div class="wind-pressure-item" :class="{ abnormal:isWaringB }">
|
||||
<div class="label">
|
||||
B相电流:{{params.wp.valueB}}A
|
||||
</div>
|
||||
@@ -17,7 +17,7 @@
|
||||
<div class="point" ref="pointB"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wind-pressure-item" :class="{ abnormal:isWaringA }">
|
||||
<div class="wind-pressure-item" :class="{ abnormal:isWaringC }">
|
||||
<div class="label">
|
||||
C相电流:{{params.wp.valueC}}A
|
||||
</div>
|
||||
|
||||
@@ -2,14 +2,24 @@
|
||||
<div id="used-ele" :style="{ backgroundImage: 'url(' +getImageUrl(bgImage)+')' }" @click="handleOpenChart">
|
||||
<div class="content">
|
||||
<div class="item">
|
||||
<div></div>
|
||||
<div class="container" ref="length">
|
||||
<div class="value" ref="valueA"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="icon"></div>
|
||||
<span>当月用电量:{{ electricityConsumptionMonthly }}v</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div></div>
|
||||
<div class="container" ref="length">
|
||||
<div class="value" ref="valueB"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="icon"></div>
|
||||
<span>当月节省量:{{ monthlySavings }}v</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="digital-tunnel">
|
||||
<el-dialog :close-on-click-modal="false" v-model="isVisited" width="2175px" :modal="false">
|
||||
<div class="left-top-icon"></div>
|
||||
@@ -51,6 +61,8 @@ const isVisited = ref(false);
|
||||
const eleData = ref([])
|
||||
const electricityConsumptionMonthly = ref()
|
||||
const monthlySavings = ref(55555)
|
||||
const valueA = ref(electricityConsumptionMonthly.value);
|
||||
const valueB = ref(monthlySavings.value);
|
||||
const bgImage = computed(() =>
|
||||
isVisited.value
|
||||
? "bpq_active.png"
|
||||
@@ -202,17 +214,35 @@ const getImageUrl = (name) => {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
width: 60px;
|
||||
height: 210px;
|
||||
border-radius: 31px;
|
||||
border: 1px solid #0f82af;
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.value {
|
||||
width: 60px;
|
||||
height: inherit;
|
||||
background: #60ddde;
|
||||
border-radius: 31px;
|
||||
transition: width 0.5s linear 0s;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.el-dialog__header) {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
#used-ele {
|
||||
cursor: pointer;
|
||||
width: 830px;
|
||||
height: 90px;
|
||||
height: 373px;
|
||||
color: aliceblue;
|
||||
position: absolute;
|
||||
//top: 1980px;
|
||||
top: 1420px;
|
||||
top: 1680px;
|
||||
left: 68px;
|
||||
background-image: url(../../../assets/images/usedEle/bg.png);
|
||||
padding: 21px 62px 35px 62px;
|
||||
@@ -233,94 +263,28 @@ const getImageUrl = (name) => {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
cursor: pointer;
|
||||
|
||||
.item {
|
||||
margin-top: 44px;
|
||||
height: 37px;
|
||||
font-size: 28px;
|
||||
font-family: MicrosoftYaHei;
|
||||
color: #38CAFB;
|
||||
line-height: 37px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
> div {
|
||||
> div:nth-child(2) {
|
||||
display: flex;
|
||||
|
||||
.icon {
|
||||
margin-right: 10px;
|
||||
width: 29px;
|
||||
height: 33px;
|
||||
background-image: url(../../../assets/images/usedEle/white-ele.png);
|
||||
}
|
||||
|
||||
//ul {
|
||||
// font-size: 14px;
|
||||
//
|
||||
// li {
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
// //width: 270px;
|
||||
// height: 37px;
|
||||
// font-size: 28px;
|
||||
// color: #38CAFB;
|
||||
// line-height: 37px;
|
||||
// margin-bottom: 25px;
|
||||
// padding-left: 5px;
|
||||
//
|
||||
// &:hover {
|
||||
// cursor: pointer;
|
||||
// width: 280px;
|
||||
// //height: 46px;
|
||||
// background: #2E5589;
|
||||
// border-radius: 7px;
|
||||
// color: #FBF7F4;
|
||||
//
|
||||
// > div {
|
||||
// background-image: url(../../../assets/images/usedEle/white-ele.png);
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// > div {
|
||||
// width: 29px;
|
||||
// height: 33px;
|
||||
// background-image: url(../../../assets/images/usedEle/white-ele.png);
|
||||
// margin-right: 14px;
|
||||
// }
|
||||
//
|
||||
// &:nth-child(2) {
|
||||
// > div {
|
||||
// background-image: url(../../../assets/images/usedEle/icon-month.png);
|
||||
// }
|
||||
//
|
||||
// &:hover {
|
||||
// > div {
|
||||
// background-image: url(../../../assets/images/usedEle/white-ele.png);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// &:nth-child(3) {
|
||||
// > div {
|
||||
// background-image: url(../../../assets/images/usedEle/icon-day.png);
|
||||
// }
|
||||
//
|
||||
// &:hover {
|
||||
// > div {
|
||||
// background-image: url(../../../assets/images/usedEle/white-ele.png);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// & > :nth-child(2) {
|
||||
// color: #4bcb6b;
|
||||
// }
|
||||
//
|
||||
// & > :nth-child(3) {
|
||||
// color: #4bcbbc;
|
||||
// }
|
||||
//}
|
||||
}
|
||||
|
||||
//& > :nth-child(2) {
|
||||
// transform: translateX(25px);
|
||||
//}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user