From d5c405a5d96015c52dc63982cc4d184032ea4a4e Mon Sep 17 00:00:00 2001 From: luyisha Date: Mon, 31 Jul 2023 10:23:57 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/cultrue/index.vue | 14 +++++---- src/views/index.vue | 58 ++++++++++++++++++++++++------------- 2 files changed, 46 insertions(+), 26 deletions(-) diff --git a/src/views/cultrue/index.vue b/src/views/cultrue/index.vue index f60f723..f253de8 100644 --- a/src/views/cultrue/index.vue +++ b/src/views/cultrue/index.vue @@ -1161,14 +1161,15 @@ export default { .center .cmid .cmdiv .cmdval { color: #fff; - font-size: 36px; + font-size: 0.4rem; } .center .cmid .cmdiv .cmdt { color: #00c6ff; - font-size: 14px; + font-size: 0.27rem; width: 6vw; - height: 2vh; + height: 0.43rem; + line-height: 0.43rem; text-align: center; background: url('../../assets/wh/ct_bg.png') no-repeat; background-size: 100% 100%; @@ -1200,7 +1201,7 @@ export default { .center .cbuttom .cbval { padding-top: 3vh; - font-size: 36px; + font-size: 0.4rem; color: #fff; height: 2vh; line-height: 2vh; @@ -1209,13 +1210,14 @@ export default { .center .cbuttom .cbt { color: #00c6ff; - height: 2vh; - line-height: 2vh; + height: 0.43rem; + line-height: 0.43rem; background: url('../../assets/wh/ct_bg.png') no-repeat; background-size: 100% 100%; background-position: center center; width: 6vw; margin: 2vh auto; + font-size: 0.27rem; } /* 右边 */ diff --git a/src/views/index.vue b/src/views/index.vue index 224b7cd..5c7c68e 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -24,18 +24,24 @@
{{ groupNameData[0] }} {{ proportionData[0] }} +
{{ groupNameData[1] }} {{ proportionData[1] }} +
{{ groupNameData[2] }} {{ proportionData[2] }} +
@@ -48,18 +54,24 @@ {{ proportionData[3] }} {{ groupNameData[3] }} +
{{ proportionData[4] }} {{ groupNameData[4] }} +
{{ proportionData[5] }} {{ groupNameData[5] }} +
@@ -270,15 +282,16 @@ export default { // var xData = ['09:00', '10:00', '11:00','12:00', '13:00', '14:00','15:00', '16:00', '17:00','18:00', '20:00', '21:00', '22:00']; // var data = [100, 200, 100, 200, 100, 200, 250, 50, 30, 130, 150, 110, 120] - var data = this.klqsDatas; - let max=this.klqsDatas[0]; - for (let i = 0; i < this.klqsDatas.length; i++) { - if (this.klqsDatas[i]>max) { - max = this.klqsDatas[i]; + let xData = this.klqsXDatas.slice(-8,this.klqsXDatas.length); + var data = this.klqsDatas.slice(-8,this.klqsDatas.length); + let max=data[0]; + for (let i = 0; i < data.length; i++) { + if (data[i]>max) { + max = data[i]; } } let dataLenArr = [], dataBGArr = []; - this.klqsDatas.map(item=>{ + data.map(item=>{ dataLenArr.push(1);// 获取和数据一样长度的底部图形数组； dataBGArr.push(max);// 数组最大值做背景柱形 }) @@ -336,7 +349,7 @@ export default { }, show: true, }, - data: this.klqsXDatas, + data: xData, type: 'category', }, yAxis: { @@ -447,29 +460,32 @@ export default { option && myChart.setOption(option); function run(myChart) { that.getHomeBarData(); - let max=that.klqsDatas[0]; - for (let i = 0; i < that.klqsDatas.length; i++) { - if (that.klqsDatas[i]>max) { - max = that.klqsDatas[i]; + let xData = that.klqsXDatas.slice(-8,that.klqsXDatas.length); + let data = that.klqsDatas.slice(-8,that.klqsDatas.length); + + let max=data[0]; + for (let i = 0; i < data.length; i++) { + if (data[i]>max) { + max = data[i]; } } let dataLenArr = [], dataBGArr = []; - that.klqsDatas.map(item=>{ + data.map(item=>{ dataLenArr.push(1);// 获取和数据一样长度的底部图形数组； dataBGArr.push(max);// 数组最大值做背景柱形 }) myChart.setOption({ xAxis: { - data: that.klqsXDatas + data: xData }, series: [ { type: 'bar', - data: that.klqsDatas + data: data }, { type: 'pictorialBar', - data: that.klqsDatas + data: data }, { type: 'bar', @@ -1036,7 +1052,7 @@ export default { .indexleftbox .cgflow_rightbox { width: 2.16rem; - text-align: right; + /* text-align: right; */ } .indexleftbox .cgflow .cgfitem { @@ -1046,20 +1062,20 @@ export default { justify-content: space-between; } -.indexleftbox .cgflow .cgflow_leftbox .cgfitem:nth-child(3) .cgtitle { +/* .indexleftbox .cgflow .cgflow_leftbox .cgfitem:nth-child(3) .cgtitle { margin-right: 5px; } .indexleftbox .cgflow .cgflow_leftbox .cgfitem:nth-child(3) .cgval { margin-right: 10px; -} +} */ .indexleftbox .cgflow .cgfitem span { /* display: block; margin-left: 12px; float: left; display: block; */ - margin-right: 14px; + /* margin-right: 14px; */ /* display: block; */ } @@ -1067,13 +1083,15 @@ export default { .indexleftbox .cgflow .cgfitem .cgtitle { color: #0096ff; font-size: 14px; - flex: 1; + /* flex: 1; */ + width: 38%; } .indexleftbox .cgflow .cgfitem .cgval { color: white; font-weight: 700; font-size: 16px; + width: 38%; } .indexleftbox .cgflow .cgfitem .cgimg img {