Merge pull request '邓洁 : 修改弹窗缩放' (#159) from dengjie into dev

Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/159
This commit is contained in:
odjbin
2023-12-17 16:33:37 +00:00
4 changed files with 82 additions and 20 deletions

View File

@@ -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',

View File

@@ -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",

View File

@@ -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',

View File

@@ -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
} },
} }
] ]
} }