From 93c0e388bc3fe955c223e1b23a1f4257b1d60d11 Mon Sep 17 00:00:00 2001
From: 王旭 <1377869194@qq.com>
Date: 星期二, 09 五月 2023 09:34:56 +0800
Subject: [PATCH] 适配提交
---
src/components/Screen/right.vue | 161 +++++++++++++++++++++++++----------------------------
1 files changed, 76 insertions(+), 85 deletions(-)
diff --git a/src/components/Screen/right.vue b/src/components/Screen/right.vue
index 48007ed..b1ae70c 100644
--- a/src/components/Screen/right.vue
+++ b/src/components/Screen/right.vue
@@ -1,27 +1,21 @@
<template>
<div class="current">
- <div
- class="rightContainer"
- v-if="currentDisplay == '澶у睆' && ChartDisplay"
- >
- <div class="current1">
+ <div class="rightContainer" v-if="currentDisplay == '澶у睆' && ChartDisplay">
+ <div class="current1 current1-1">
<div class="aside-title">椤圭洰缁熻</div>
<project-category></project-category>
</div>
- <div class="current1">
+ <div class="current1 current1-2">
<div class="aside-title">鏁版嵁缁熻</div>
<visit-count></visit-count>
</div>
- <div class="current1">
+ <div class="current1 current1-3">
<div class="aside-title">鏈嶅姟璁块棶娆℃暟</div>
<Service-Get></Service-Get>
</div>
</div>
<!-- 鍏ㄧ悆銆佸叏鍥介」鐩� -->
- <div
- class="rightContainer"
- v-if="currentDisplay == '椤圭洰'"
- >
+ <div class="rightContainer" v-if="currentDisplay == '椤圭洰'">
<div class="current1">
<div class="aside-title"></div>
<!-- <country-dimension-bar ref="barRef"></country-dimension-bar> -->
@@ -37,10 +31,7 @@
v-if="currentProject == '鍏ㄧ悆椤圭洰'"
ref="pieRef"
></country-dimension-pie>
- <province-dimension-pie
- v-else
- ref="pieRef"
- ></province-dimension-pie>
+ <province-dimension-pie v-else ref="pieRef"></province-dimension-pie>
</div>
<div class="current1">
<div class="aside-title">鏁版嵁浣跨敤鎯呭喌</div>
@@ -51,10 +42,7 @@
</div>
</div>
<!-- 鍏ㄥ浗銆佸叏鐞冪缃� -->
- <div
- class="rightContainer"
- v-if="currentDisplay == '绠＄綉'"
- >
+ <div class="rightContainer" v-if="currentDisplay == '绠＄綉'">
<div class="current1">
<div class="aside-title">绔欏満搴ф暟</div>
<!-- <country-dimension-bar ref="barRef"></country-dimension-bar> -->
@@ -79,10 +67,7 @@
</div>
</div>
<!-- 鍗曚釜宸ョ▼ -->
- <div
- class="rightContainer"
- v-if="currentDisplay == '宸ョ▼'"
- >
+ <div class="rightContainer" v-if="currentDisplay == '宸ョ▼'">
<div class="current1">
<div class="aside-title">鏁版嵁瀛樺偍閲�</div>
<base-line-chart
@@ -101,10 +86,7 @@
</div>
<div class="current1">
<div class="aside-title">绠￠亾鏉℃暟</div>
- <div
- class="content"
- style="height: 30px"
- >
+ <div class="content" style="height: 30px">
<div class="header">
<div>鏍煎紡</div>
<div>鏁伴噺</div>
@@ -115,35 +97,32 @@
</div>
<div class="rightarrow">
- <img
- :src="RightImg"
- @click="ChangeRight"
- />
+ <img :src="RightImg" @click="ChangeRight" />
</div>
</div>
</template>
<script>
-import echart11 from "@/components/echart11.vue"
-import echart12 from "@/components/echart12.vue"
-import echart13 from "@/components/echart13.vue"
-import FileFormat from "@/components/chart/FileFormat.vue"
-import ProjectCategory from "../chart/ProjectCategory.vue"
-import CountryDimensionBar from "../chart/CountryDimensionBar.vue"
-import CountryDimensionPie from "../chart/CountryDimensionPie.vue"
-import ProvinceDimensionBar from "../chart/CountryProvinceBar.vue"
-import ProvinceDimensionPie from "../chart/CountryProvincePie.vue"
-import ServiceGet from "../chart/ServiceGet.vue"
-import BaseBarChart from "../chart/BaseBarChart.vue"
-import BaseLineChart from "../chart/BaseLineChart.vue"
-import BasePieChart from "../chart/BasePieChart .vue"
-import VisitCount from "../chart/VisitCount.vue"
+import echart11 from "@/components/echart11.vue";
+import echart12 from "@/components/echart12.vue";
+import echart13 from "@/components/echart13.vue";
+import FileFormat from "@/components/chart/FileFormat.vue";
+import ProjectCategory from "../chart/ProjectCategory.vue";
+import CountryDimensionBar from "../chart/CountryDimensionBar.vue";
+import CountryDimensionPie from "../chart/CountryDimensionPie.vue";
+import ProvinceDimensionBar from "../chart/CountryProvinceBar.vue";
+import ProvinceDimensionPie from "../chart/CountryProvincePie.vue";
+import ServiceGet from "../chart/ServiceGet.vue";
+import BaseBarChart from "../chart/BaseBarChart.vue";
+import BaseLineChart from "../chart/BaseLineChart.vue";
+import BasePieChart from "../chart/BasePieChart .vue";
+import VisitCount from "../chart/VisitCount.vue";
import {
countCountryDimension,
countProvinceDimension,
countZhPipeStations,
countDownloads,
-} from "@/api/screen.js"
+} from "@/api/screen.js";
export default {
components: {
@@ -249,44 +228,44 @@
showValue: true,
},
params: {},
- }
+ };
},
created() {
- this.getZhPipeStations()
- this.getCountDownloads()
+ this.getZhPipeStations();
+ this.getCountDownloads();
},
mounted() {
- this.OpenLeftInit()
- this.$bus.$on("changeProject", name => {
+ this.OpenLeftInit();
+ this.$bus.$on("changeProject", (name) => {
if (name.includes("鍏ㄧ悆绠＄綉") || name.includes("鍏ㄥ浗绠＄綉")) {
- this.currentDisplay = "绠＄綉"
+ this.currentDisplay = "绠＄綉";
} else if (name.includes("鍏ㄧ悆椤圭洰") || name.includes("鍏ㄥ浗椤圭洰")) {
- this.currentDisplay = "椤圭洰"
+ this.currentDisplay = "椤圭洰";
} else {
- this.currentDisplay = "宸ョ▼"
+ this.currentDisplay = "宸ョ▼";
}
- this.currentProject = name
- })
- this.$bus.$on("changeProjectCode", code => {
+ this.currentProject = name;
+ });
+ this.$bus.$on("changeProjectCode", (code) => {
this.params = {
projectCode: code,
- }
- })
+ };
+ });
this.$bus.$on("closeLeftAndRightMenu", (res) => {
- this.ChartDisplay = res
+ this.ChartDisplay = res;
this.ChangeRight();
- })
+ });
},
methods: {
ChangeRight() {
if (this.leftMessage == "init") {
if (this.ChartDisplay) {
- this.RightImg = require("../../assets/img/Screen/rightArrow.png")
+ this.RightImg = require("../../assets/img/Screen/rightArrow.png");
} else {
- this.RightImg = require("../../assets/img/Screen/leftArrow.png")
+ this.RightImg = require("../../assets/img/Screen/leftArrow.png");
}
- this.ChartDisplay = !this.ChartDisplay
+ this.ChartDisplay = !this.ChartDisplay;
}
// if (this.leftMessage == "projectree") {
@@ -299,14 +278,14 @@
// }
// this.ChartDisplay = !this.ChartDisplay
- this.$parent.ChangeWidth("right")
+ this.$parent.ChangeWidth("right");
},
//鎵撳紑澶у睆宸︿晶鐣岄潰
OpenLeftInit() {
- this.currentDisplay = "澶у睆"
- this.ChartDisplay = true
- this.CourtyDisplay = false
- this.leftMessage = "init"
+ this.currentDisplay = "澶у睆";
+ this.ChartDisplay = true;
+ this.CourtyDisplay = false;
+ this.leftMessage = "init";
// this.OpenLeftInitChart();
// this.$parent.ChangeWidth("leftTree")
},
@@ -319,46 +298,46 @@
// this.$parent.ChangeWidth("leftTree")
// },
async getZhPipeStations() {
- const res = await countZhPipeStations()
+ const res = await countZhPipeStations();
if (res.code == 200) {
- const data = res.result
- this.pieconfig.data = res.result.map(item => {
+ const data = res.result;
+ this.pieconfig.data = res.result.map((item) => {
return {
name: item.杈撻�佷粙璐�,
value: item.绠￠亾鏁伴噺,
- }
- })
+ };
+ });
this.pieconfig = {
...this.pieconfig,
- }
- this.config.data = res.result.map(item => {
+ };
+ this.config.data = res.result.map((item) => {
return {
name: item.杈撻�佷粙璐�,
value: item.绠￠亾鏁伴噺,
- }
- })
+ };
+ });
this.config = {
...this.config,
- }
+ };
}
},
async getCountDownloads() {
- const res = await countDownloads()
+ const res = await countDownloads();
if (res.code == 200) {
- this.barConfig.data = res.result.map(item => {
+ this.barConfig.data = res.result.map((item) => {
return {
name: item.typename,
value: item.count,
- }
- })
+ };
+ });
this.barConfig = {
...this.barConfig,
- }
+ };
}
},
},
-}
+};
</script>
<style lang="less">
.current {
@@ -412,6 +391,7 @@
background-size: 100% 100%;
background-repeat: no-repeat;
}
+
}
.content {
width: 100%;
@@ -429,4 +409,15 @@
}
}
}
+@media (max-width: 1400px) {
+ .current .rightContainer .current1-1 {
+ height: 42%;
+ }
+ .current .rightContainer .current1-2 {
+ height: 28%;
+ }
+ .current .rightContainer .current1-3 {
+ height: 28%;
+ }
+}
</style>
--
Gitblit v1.9.3