邓洁 : 修改弹窗缩放
This commit is contained in:
@@ -179,6 +179,18 @@ const initChart = () => {
|
|||||||
fontSize: 40
|
fontSize: 40
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
toolbox: {
|
||||||
|
show: false,
|
||||||
|
right: 10,
|
||||||
|
feature: {
|
||||||
|
dataZoom: {
|
||||||
|
yAxisIndex: 'none'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
dataZoom: [{
|
||||||
|
type: 'inside'
|
||||||
|
}],
|
||||||
//X轴
|
//X轴
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
@@ -259,6 +271,18 @@ const initAirChart = () => {
|
|||||||
fontSize: 40
|
fontSize: 40
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
toolbox: {
|
||||||
|
show: false,
|
||||||
|
right: 10,
|
||||||
|
feature: {
|
||||||
|
dataZoom: {
|
||||||
|
yAxisIndex: 'none'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
dataZoom: [{
|
||||||
|
type: 'inside'
|
||||||
|
}],
|
||||||
//X轴
|
//X轴
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
|
|||||||
@@ -160,6 +160,18 @@ const initChart = () => {
|
|||||||
fontSize: 40
|
fontSize: 40
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
toolbox: {
|
||||||
|
show: false,
|
||||||
|
right: 10,
|
||||||
|
feature: {
|
||||||
|
dataZoom: {
|
||||||
|
yAxisIndex: 'none'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
dataZoom: [{
|
||||||
|
type: 'inside'
|
||||||
|
}],
|
||||||
//X轴
|
//X轴
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: "category",
|
type: "category",
|
||||||
|
|||||||
@@ -131,6 +131,18 @@ const initChart = () => {
|
|||||||
fontSize: 40
|
fontSize: 40
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
toolbox: {
|
||||||
|
show: false,
|
||||||
|
right: 10,
|
||||||
|
feature: {
|
||||||
|
dataZoom: {
|
||||||
|
yAxisIndex: 'none'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
dataZoom: [{
|
||||||
|
type: 'inside'
|
||||||
|
}],
|
||||||
//X轴
|
//X轴
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
|
|||||||
@@ -2,7 +2,8 @@
|
|||||||
<div id="wind-pressure">
|
<div id="wind-pressure">
|
||||||
<div class="name">风压</div>
|
<div class="name">风压</div>
|
||||||
<div class="list">
|
<div class="list">
|
||||||
<wind-pressure-item v-for="(item,index) in wpList" :key="item.equipmentId" :wp="item" :index="index+1" @click="handleOpenChart(item,index+1)"/>
|
<wind-pressure-item v-for="(item,index) in wpList" :key="item.equipmentId" :wp="item" :index="index+1"
|
||||||
|
@click="handleOpenChart(item,index+1)"/>
|
||||||
</div>
|
</div>
|
||||||
<div class="digital-tunnel">
|
<div class="digital-tunnel">
|
||||||
<el-dialog v-model="isVisited" :title="windSort+'号风压监控数据'" width="2175px" :modal="false">
|
<el-dialog v-model="isVisited" :title="windSort+'号风压监控数据'" width="2175px" :modal="false">
|
||||||
@@ -31,21 +32,22 @@ import WindPressureItem from "./childComps/WindPressureItem.vue";
|
|||||||
import TimeRangeBtn from "@/components/timeRangeBtn/index.vue"
|
import TimeRangeBtn from "@/components/timeRangeBtn/index.vue"
|
||||||
import * as echarts from 'echarts';
|
import * as echarts from 'echarts';
|
||||||
import {getEchartsInfo} from "../../../api/largeScreen";
|
import {getEchartsInfo} from "../../../api/largeScreen";
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
list: Array,
|
list: Array,
|
||||||
winData: Array
|
winData: Array
|
||||||
});
|
});
|
||||||
const windSort=ref(1)
|
const windSort = ref(1)
|
||||||
const timeList = ref(["年", "月", "日"]);
|
const timeList = ref(["年", "月", "日"]);
|
||||||
const selectTimeButton = ref(2);
|
const selectTimeButton = ref(2);
|
||||||
const isVisited = ref(false);
|
const isVisited = ref(false);
|
||||||
let myEcharts = reactive({});
|
let myEcharts = reactive({});
|
||||||
const wpList = ref([]);
|
const wpList = ref([]);
|
||||||
const chartData=ref()
|
const chartData = ref()
|
||||||
watch(() => props.list, (now) => {
|
watch(() => props.list, (now) => {
|
||||||
wpList.value.forEach(item=>{
|
wpList.value.forEach(item => {
|
||||||
now.forEach(newItem=>{
|
now.forEach(newItem => {
|
||||||
if(item.equipmentId === newItem.equipmentId){
|
if (item.equipmentId === newItem.equipmentId) {
|
||||||
item.value = newItem.value
|
item.value = newItem.value
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@@ -56,38 +58,38 @@ watch(() => props.winData, (now) => {
|
|||||||
getScreenInfo(now.windPressureSensorList)
|
getScreenInfo(now.windPressureSensorList)
|
||||||
}, {deep: true});
|
}, {deep: true});
|
||||||
|
|
||||||
const getWindInfo=(equipmentId)=>{
|
const getWindInfo = (equipmentId) => {
|
||||||
getEchartsInfo(equipmentId).then(res=>{
|
getEchartsInfo(equipmentId).then(res => {
|
||||||
console.log('res-wind',res)
|
console.log('res-wind', res)
|
||||||
if(res?.code===1000){
|
if (res?.code === 1000) {
|
||||||
isVisited.value = true
|
isVisited.value = true
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
initChart(res.data.dates,res.data.values)
|
initChart(res.data.dates, res.data.values)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleOpenChart = (item,index) => {
|
const handleOpenChart = (item, index) => {
|
||||||
getWindInfo(item.equipmentId)
|
getWindInfo(item.equipmentId)
|
||||||
windSort.value=index
|
windSort.value = index
|
||||||
}
|
}
|
||||||
const timeSelect = (index) => {
|
const timeSelect = (index) => {
|
||||||
console.log('选择时间', index)
|
console.log('选择时间', index)
|
||||||
if(index===0){
|
if (index === 0) {
|
||||||
console.log('--年')
|
console.log('--年')
|
||||||
}else if(index===1){
|
} else if (index === 1) {
|
||||||
console.log('--月')
|
console.log('--月')
|
||||||
}else if(index===2){
|
} else if (index === 2) {
|
||||||
console.log('--日')
|
console.log('--日')
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
const getScreenInfo = (now) => {
|
const getScreenInfo = (now) => {
|
||||||
let windPressureObj = {}
|
let windPressureObj = {}
|
||||||
let windPressureArr = []
|
let windPressureArr = []
|
||||||
now.map(item => {
|
now.map(item => {
|
||||||
windPressureObj = {
|
windPressureObj = {
|
||||||
equipmentId:item.equipmentId,
|
equipmentId: item.equipmentId,
|
||||||
max: 120,
|
max: 120,
|
||||||
value: item.value,
|
value: item.value,
|
||||||
point: item.valueThreshold,
|
point: item.valueThreshold,
|
||||||
@@ -100,7 +102,7 @@ const getScreenInfo = (now) => {
|
|||||||
/**
|
/**
|
||||||
* 初始化echarts实例方法
|
* 初始化echarts实例方法
|
||||||
*/
|
*/
|
||||||
const initChart = (type,values) => {
|
const initChart = (type, values) => {
|
||||||
//3.初始化container容器
|
//3.初始化container容器
|
||||||
myEcharts = echarts.init(document.getElementById('container'));
|
myEcharts = echarts.init(document.getElementById('container'));
|
||||||
//5.传入数据
|
//5.传入数据
|
||||||
@@ -131,6 +133,18 @@ const initChart = (type,values) => {
|
|||||||
fontSize: 40
|
fontSize: 40
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
toolbox: {
|
||||||
|
show: false,
|
||||||
|
right: 10,
|
||||||
|
feature: {
|
||||||
|
dataZoom: {
|
||||||
|
yAxisIndex: 'none'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
dataZoom: [{
|
||||||
|
type: 'inside'
|
||||||
|
}],
|
||||||
//X轴
|
//X轴
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
@@ -163,7 +177,7 @@ const initChart = (type,values) => {
|
|||||||
symbolSize: 24,
|
symbolSize: 24,
|
||||||
lineStyle: {
|
lineStyle: {
|
||||||
width: 5
|
width: 5
|
||||||
}
|
},
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user