Merge pull request 'fix : 细节优化' (#301) from dengjie into dev
Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/301
This commit is contained in:
@@ -67,7 +67,7 @@
|
||||
<div style="width: 1px;"></div>
|
||||
</div>
|
||||
<div class="time-select">
|
||||
<choose-month v-if="selectTimeButton===1" ref="chooseMonthRef" @select="monthSelect" />
|
||||
<choose-month v-if="selectTimeButton===1" ref="chooseMonthRef" @select="monthSelect"/>
|
||||
<time-range-btn
|
||||
:buttonList="timeList"
|
||||
v-model="selectTimeButton"
|
||||
@@ -85,6 +85,7 @@ import * as echarts from 'echarts';
|
||||
import TimeRangeBtn from "@/components/timeRangeBtn/index.vue"
|
||||
import ChooseMonth from "@/components/chooseMonth/index.vue"
|
||||
import {getEleEchartsInfo} from "@/api/largeScreen";
|
||||
|
||||
const props = defineProps({
|
||||
list: Array,
|
||||
eleData: Array
|
||||
@@ -115,11 +116,11 @@ const bgImage = computed(() =>
|
||||
);
|
||||
watch(() => props.eleData, (now) => {
|
||||
if (now) {
|
||||
let fanObj={}
|
||||
now.frequencyChangerList.forEach(item=>{
|
||||
fanObj={
|
||||
let fanObj = {}
|
||||
now.frequencyChangerList.forEach(item => {
|
||||
fanObj = {
|
||||
value: item.equipmentId,
|
||||
label:changeNum(item.equipmentId)
|
||||
label: changeNum(item.equipmentId)
|
||||
}
|
||||
fanList.value.push(fanObj)
|
||||
})
|
||||
@@ -154,7 +155,7 @@ const setValueA = () => {
|
||||
if (electricityConsumptionMonthly.value === 0 || length.value === null) {
|
||||
valueA.value.style.height = `0px`;
|
||||
}
|
||||
let width = (electricityConsumptionMonthly.value * length.value?.offsetHeight) /40000;
|
||||
let width = (electricityConsumptionMonthly.value * length.value?.offsetHeight) / 40000;
|
||||
valueA.value.style.height = `${width}px`;
|
||||
}
|
||||
const setValueB = () => {
|
||||
@@ -171,7 +172,7 @@ const getBasicData = (data) => {
|
||||
|
||||
const monthSelect = (val) => {
|
||||
monthValue.value = val
|
||||
getFanInfo(openEquipmentId.value, 'month',val)
|
||||
getFanInfo(openEquipmentId.value, 'month', val)
|
||||
}
|
||||
const changeDate = (index) => {
|
||||
switch (index) {
|
||||
@@ -182,12 +183,12 @@ const changeDate = (index) => {
|
||||
}
|
||||
}
|
||||
const timeSelect = (index) => {
|
||||
monthValue.value=''
|
||||
monthValue.value = ''
|
||||
getFanInfo(openEquipmentId.value, changeDate(index))
|
||||
};
|
||||
const changeFanData = (val) => {
|
||||
selectTimeButton.value=1
|
||||
openEquipmentId.value=val
|
||||
selectTimeButton.value = 1
|
||||
openEquipmentId.value = val
|
||||
getFanInfo(val, 'month', monthValue.value)
|
||||
}
|
||||
const getFanInfo = (equipmentId, type = 'month', time = '') => {
|
||||
@@ -196,10 +197,10 @@ const getFanInfo = (equipmentId, type = 'month', time = '') => {
|
||||
getEleEchartsInfo(equipmentId, time, type).then(res => {
|
||||
if (res?.code === 1000) {
|
||||
showLoading.value = false
|
||||
totalElectricityConsumption.value=res.data.totalElectricityConsumption
|
||||
saveElectricity.value=res.data.saveElectricity
|
||||
totalElectricityConsumption.value = res.data.totalElectricityConsumption
|
||||
saveElectricity.value = res.data.saveElectricity
|
||||
nextTick(() => {
|
||||
initChart(res.data.dates,res.data.consumptionValues,res.data.saveElectricityValues)
|
||||
initChart(res.data.dates, res.data.consumptionValues, res.data.saveElectricityValues)
|
||||
})
|
||||
}
|
||||
})
|
||||
@@ -208,11 +209,11 @@ const getFanInfo = (equipmentId, type = 'month', time = '') => {
|
||||
})
|
||||
}
|
||||
const handleOpenChart = () => {
|
||||
selectTimeButton.value=1
|
||||
selectTimeButton.value = 1
|
||||
isVisited.value = true
|
||||
openEquipmentId.value=fanList.value[0].value
|
||||
chooseChartFan.value=fanList.value[0].value
|
||||
nextTick(()=>{
|
||||
openEquipmentId.value = fanList.value[0].value
|
||||
chooseChartFan.value = fanList.value[0].value
|
||||
nextTick(() => {
|
||||
chooseMonthRef.value.clearData()
|
||||
})
|
||||
getFanInfo(openEquipmentId.value, 'month')
|
||||
@@ -289,7 +290,7 @@ const initChart = (type, valueA, valueB) => {
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
// data: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31'],
|
||||
data:type,
|
||||
data: type,
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
fontSize: 45,
|
||||
@@ -333,13 +334,16 @@ const initChart = (type, valueA, valueB) => {
|
||||
<style lang="scss">
|
||||
.user-select {
|
||||
margin-bottom: 126px;
|
||||
.el-input{
|
||||
|
||||
.el-input {
|
||||
width: 300px;
|
||||
.el-input__wrapper{
|
||||
|
||||
.el-input__wrapper {
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
border-radius: 10px;
|
||||
border: 2px solid #0F82AF;
|
||||
|
||||
.el-input__inner {
|
||||
height: 80px;
|
||||
font-size: 40px;
|
||||
@@ -348,13 +352,11 @@ const initChart = (type, valueA, valueB) => {
|
||||
}
|
||||
}
|
||||
|
||||
.el-select__wrapper {
|
||||
min-height: 75px;
|
||||
height: auto !important;
|
||||
background-color: transparent;
|
||||
border: 1px solid #08B7B8;
|
||||
font-size: 35px;
|
||||
width: 476px;
|
||||
|
||||
.el-select__placeholder {
|
||||
height: 54px;
|
||||
line-height: 54px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.el-select__placeholder.is-transparent {
|
||||
@@ -399,11 +401,22 @@ const initChart = (type, valueA, valueB) => {
|
||||
.el-form-item.is-error .el-input__wrapper {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.el-select__wrapper {
|
||||
min-height: 75px;
|
||||
height: auto !important;
|
||||
background-color: transparent;
|
||||
border: 1px solid #08B7B8;
|
||||
font-size: 35px;
|
||||
width: 213px!important;
|
||||
}
|
||||
.el-select__popper {
|
||||
margin-top: -12px !important;
|
||||
background: #072247 !important;
|
||||
border: 1px solid #0F82AF !important;
|
||||
//width: 476px!important;
|
||||
.el-select-dropdown{
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.el-popper {
|
||||
@@ -523,6 +536,7 @@ const initChart = (type, valueA, valueB) => {
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
padding: 1px;
|
||||
|
||||
.value {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
|
||||
Reference in New Issue
Block a user