邓洁 : 修改弹窗样式
This commit is contained in:
@@ -1,8 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="bad-gas-info" :style="{ backgroundImage: 'url(' +getImageUrl(bgImage)+')' }">
|
<div id="bad-gas-info" :style="{ backgroundImage: 'url(' +getImageUrl(bgImage)+')' }" @click="handleOpenChart">
|
||||||
<div class="title">有害气体</div>
|
<div class="title">有害气体</div>
|
||||||
<div class="info-list">
|
<div class="info-list">
|
||||||
<gas-info-item v-for="item in badGasList" :key="item.equipmentId" :gasInfo="item" @click="handleOpenChart"/>
|
<gas-info-item v-for="item in badGasList" :key="item.equipmentId" :gasInfo="item"/>
|
||||||
</div>
|
</div>
|
||||||
<div class="digital-tunnel">
|
<div class="digital-tunnel">
|
||||||
<el-dialog v-model="isVisited" title="有害气体监控数据" width="2400px" :modal="false">
|
<el-dialog v-model="isVisited" title="有害气体监控数据" width="2400px" :modal="false">
|
||||||
@@ -111,11 +111,12 @@ const initChart = () => {
|
|||||||
legend: {
|
legend: {
|
||||||
left: 0,
|
left: 0,
|
||||||
textStyle: {
|
textStyle: {
|
||||||
color: '#FFFFFF',
|
color: '#60DDDE',
|
||||||
fontSize: 40
|
fontSize: 40
|
||||||
},
|
},
|
||||||
// itemWidth: 20,
|
itemWidth: 30,
|
||||||
// itemHeight: 20
|
itemHeight: 30,
|
||||||
|
icon: "circle",
|
||||||
},
|
},
|
||||||
//离容器四侧的距离
|
//离容器四侧的距离
|
||||||
grid: {
|
grid: {
|
||||||
@@ -128,7 +129,10 @@ const initChart = () => {
|
|||||||
//提示框组件
|
//提示框组件
|
||||||
tooltip: {
|
tooltip: {
|
||||||
show: true,
|
show: true,
|
||||||
trigger: 'axis'
|
trigger: 'axis',
|
||||||
|
textStyle: {
|
||||||
|
fontSize: 40
|
||||||
|
}
|
||||||
},
|
},
|
||||||
//X轴
|
//X轴
|
||||||
xAxis: {
|
xAxis: {
|
||||||
@@ -226,6 +230,7 @@ const initChart = () => {
|
|||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
#bad-gas-info {
|
#bad-gas-info {
|
||||||
|
cursor: pointer;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
width: 824px;
|
width: 824px;
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="used-ele" :style="{ backgroundImage: 'url(' +getImageUrl(bgImage)+')' }">
|
<div id="used-ele" :style="{ backgroundImage: 'url(' +getImageUrl(bgImage)+')' }" @click="handleOpenChart">
|
||||||
<div class="content" @click="handleOpenChart">
|
<div class="content" >
|
||||||
<div class="item">
|
<div class="item">
|
||||||
<div></div>
|
<div></div>
|
||||||
<span>当月用电量:{{ electricityConsumptionMonthly }}v</span>
|
<span>当月用电量:{{ electricityConsumptionMonthly }}v</span>
|
||||||
@@ -108,9 +108,12 @@ const initChart = () => {
|
|||||||
legend: {
|
legend: {
|
||||||
left: 0,
|
left: 0,
|
||||||
textStyle: {
|
textStyle: {
|
||||||
color: '#FFFFFF',
|
color: '#60DDDE',
|
||||||
fontSize: 45
|
fontSize: 45
|
||||||
}
|
},
|
||||||
|
itemWidth: 30,
|
||||||
|
itemHeight:30,
|
||||||
|
icon: "circle",
|
||||||
},
|
},
|
||||||
//离容器四侧的距离
|
//离容器四侧的距离
|
||||||
grid: {
|
grid: {
|
||||||
@@ -123,7 +126,10 @@ const initChart = () => {
|
|||||||
//提示框组件
|
//提示框组件
|
||||||
tooltip: {
|
tooltip: {
|
||||||
show: true,
|
show: true,
|
||||||
trigger: 'axis'
|
trigger: 'axis',
|
||||||
|
textStyle: {
|
||||||
|
fontSize: 40
|
||||||
|
}
|
||||||
},
|
},
|
||||||
//X轴
|
//X轴
|
||||||
xAxis: {
|
xAxis: {
|
||||||
@@ -176,6 +182,7 @@ const getImageUrl = (name) => {
|
|||||||
padding: 0!important;
|
padding: 0!important;
|
||||||
}
|
}
|
||||||
#used-ele {
|
#used-ele {
|
||||||
|
cursor: pointer;
|
||||||
width: 830px;
|
width: 830px;
|
||||||
height: 90px;
|
height: 90px;
|
||||||
color: aliceblue;
|
color: aliceblue;
|
||||||
|
|||||||
@@ -115,7 +115,10 @@ const initChart = () => {
|
|||||||
//提示框组件
|
//提示框组件
|
||||||
tooltip: {
|
tooltip: {
|
||||||
show: true,
|
show: true,
|
||||||
trigger: 'axis'
|
trigger: 'axis',
|
||||||
|
textStyle: {
|
||||||
|
fontSize: 40
|
||||||
|
}
|
||||||
},
|
},
|
||||||
//X轴
|
//X轴
|
||||||
xAxis: {
|
xAxis: {
|
||||||
|
|||||||
Reference in New Issue
Block a user