-
- 状态：{{ item.breakdown ? '运行' : '故障' }}
+
+
+
+ 状态：{{ item.breakdown ? '故障':'运行' }}
- 自动{{item.autoMode}}
- 手动
+ 自动
+ 手动
@@ -45,7 +45,7 @@
type="number"
min="0"
v-model="item.frequencyFeedback"
- :disabled="isSAuto1 === 'true'"
+ :disabled="item.autoMode"
/>
@@ -62,58 +62,26 @@ const props = defineProps({
list: Array,
fanData: Array
});
-//当前功率
-const powerOne = ref()
-const powerTwo = ref()
-const powerThree = ref(555)
-//状态
-const stateOne = ref()
-const stateTwo = ref()
-// 一号风机启动停止按钮
-const isStartOne = ref(true);
-const isStartTwo = ref(true);
-// 功率是否自动
-let isSAuto1 = ref("false");
-let isSAuto2 = ref("false");
const socketData = ref()
-// 一号风机echarts实例
-const info1 = ref(null);
let Echarts_info1 = null;
-// 二号风机实例
-const info2 = ref(null);
-let Echarts_info2 = null;
-const info3 = ref(null);
-let Echarts_info3 = null;
let fan01_option = reactive();
-let fan02_option = reactive();
-let fan03_option = reactive();
watch(() => props.fanData, (now) => {
getBasicData(now.frequencyChangerList)
}, {deep: true});
watch(() => props.list, (now) => {
- console.log('socketDatawatch------------', now)
socketData.value.forEach(item => {
now.forEach(newItem => {
if (item.equipmentId === newItem.equipmentId) {
- console.log('newItem',item,newItem)
- if(newItem.frequencyFeedback&&item.frequencyFeedback){
- // item.frequencyFeedback= newItem.frequencyFeedback
+ if(newItem.frequencyFeedback){
+ item.frequencyFeedback= newItem.frequencyFeedback
}
}
})
})
+ handleOnMounted()
}, {deep: true});
-const stateIconOne = computed(() =>
- stateOne.value
- ? "blue-state-icon.png"
- : "red-state-icon.png"
-);
-const stateIconTwo = computed(() =>
- stateTwo.value
- ? "blue-state-icon.png"
- : "red-state-icon.png"
-);
+
onMounted(async () => {
setTimeout(() => {
nextTick(()=>{
@@ -121,6 +89,24 @@ onMounted(async () => {
})
}, 100);
});
+const getImage = (type) => {
+ switch (type) {
+ case false:
+ return "blue-state-icon.png";
+ case true:
+ return "red-state-icon.png";
+ }
+}
+const changeNum=(index)=>{
+ switch (index) {
+ case 1:
+ return '一';
+ case 2:
+ return '二';
+ case 3:
+ return '三';
+ }
+}
const getBasicData = (data) => {
let tranObj = {}
let tranArr = []
@@ -139,7 +125,6 @@ const getBasicData = (data) => {
const handleOnMounted = () => {
const chart = document.getElementsByClassName('echart');
- console.log('chart',chart)
for(let i = 0; i < chart.length; i++ ){
Echarts_info1 = echarts.init(chart[i]);
fan01_option = {
@@ -254,125 +239,11 @@ const handleOnMounted = () => {
}
fan01_option && Echarts_info1.setOption(fan01_option);
}
-
-
- // 挂载二号风机实例
- Echarts_info2 = echarts.init(info2.value);
- fan02_option = {
- series: [
- {
- type: "gauge",
- startAngle: -120,
- endAngle: -420,
- pointer: {
- show: false,
- },
- progress: {
- show: true,
- overlap: false,
- roundCap: true,
- clip: false,
- itemStyle: {
- borderWidth: 10,
- borderColor: {
- type: "linear",
- x: 0,
- y: 1,
- x2: 0,
- y2: 0,
- colorStops: [
- {
- offset: 0,
- color: "#4BB10E", // 0% 处的颜色
- },
- {
- offset: 0.25,
- color: "#B1AD0E", // 100% 处的颜色
- },
- {
- offset: 0.75,
- color: "#B1880E", // 100% 处的颜色
- },
- {
- offset: 1,
- color: "#D77E01", // 100% 处的颜色
- },
- ],
- global: false, // 缺省为 false
- },
- color: {
- type: "linear",
- x: 0,
- y: 1,
- x2: 0,
- y2: 0,
- colorStops: [
- {
- offset: 0,
- color: "#4BB10E", // 0% 处的颜色
- },
- {
- offset: 0.25,
- color: "#B1AD0E", // 100% 处的颜色
- },
- {
- offset: 0.75,
- color: "#B1880E", // 100% 处的颜色
- },
- {
- offset: 1,
- color: "#D77E01", // 100% 处的颜色
- },
- ],
- global: false, // 缺省为 false
- }
- },
- },
- max: 1000,
- splitLine: {
- show: false,
- },
- axisTick: {
- show: true,
- splitNumber: 1,
- length: 10,
- },
- axisLabel: {
- show: false,
- },
- data: [
- {
- value: powerTwo.value,
- fontSize: 2100,
- detail: {
- valueAnimation: true,
- offsetCenter: ["0%", "0%"],
- fontSize: 40,
- color: "white",
- },
- },
- ],
- axisLine: {
- lineStyle: {
- width: 3,
- color: [[1, "#155F7C"]],
- },
- },
- detail: {
- width: 100,
- height: 14,
- fontSize: 26,
- color: "inherit",
- formatter: "{value}",
- },
- },
- ],
- }
- Echarts_info2.setOption(fan02_option);
}
const getImageUrl = (name) => {
- return new URL(`../../../assets/images/fanInfo/${name}`, import.meta.url).href
+ let icon=getImage(name)
+ return new URL(`../../../assets/images/fanInfo/${icon}`, import.meta.url).href
}
diff --git a/src/components/content/usedEle/UsedEle.vue b/src/components/content/usedEle/UsedEle.vue
index 6c598e9..e97b305 100644
--- a/src/components/content/usedEle/UsedEle.vue
+++ b/src/components/content/usedEle/UsedEle.vue
@@ -11,7 +11,7 @@
-
+
@@ -106,16 +109,14 @@ const initChart = () => {
left: 0,
textStyle: {
color: '#FFFFFF',
- fontSize: 28
- },
- // itemWidth: 20,
- // itemHeight: 20
+ fontSize: 45
+ }
},
//离容器四侧的距离
grid: {
left: 0, // 左边距
right: 20, // 右边距
- // top: 80, // 顶边距
+ top: 80, // 顶边距
bottom: 20, // 底边距
containLabel: true,
},
@@ -130,7 +131,7 @@ const initChart = () => {
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'],
axisLabel: {
textStyle: {
- fontSize: 24,
+ fontSize: 45,
color: '#D6F1FA'
},
},
@@ -140,7 +141,7 @@ const initChart = () => {
type: 'value',
axisLabel: {
textStyle: {
- fontSize: 24,
+ fontSize: 45,
color: '#D6F1FA'
},
},
@@ -148,9 +149,15 @@ const initChart = () => {
//配置项
series: [
{
+ name:'日用电量',
data: [120, 200, 150, 80, 70, 110, 130, 100, 140, 130, 160, 150, 90, 130, 110, 120, 150, 140, 130, 120, 110, 100, 90, 80, 100, 140, 130, 160, 150, 24, 50],
type: 'bar'
},
+ {
+ name:'日节省量',
+ data: [140, 130, 160, 150, 90, 130, 110, 120, 150, 140, 130, 120, 110, 100, 90, 80, 100, 140, 130, 160, 150, 24, 50,120, 200, 150, 80, 70, 110, 130, 100, ],
+ type: 'bar'
+ },
]
}
myEcharts.setOption(option);
@@ -165,6 +172,9 @@ const getImageUrl = (name) => {