From f48666e6ce0189994ba799ac49097c8335dc14fc Mon Sep 17 00:00:00 2001 From: zhaoguoqiang <849348323@qq.com> Date: Sat, 31 Jul 2021 15:21:28 +0800 Subject: [PATCH 1/3] 1 --- src/views/PerformanceData/index.vue | 89 +++++++++++++++++++++++-- src/views/cityDistribution/index.vue | 99 ++++++++++------------------ src/views/login.vue | 28 ++++---- 3 files changed, 132 insertions(+), 84 deletions(-) diff --git a/src/views/PerformanceData/index.vue b/src/views/PerformanceData/index.vue index 0eddf0f..76de249 100644 --- a/src/views/PerformanceData/index.vue +++ b/src/views/PerformanceData/index.vue @@ -4,15 +4,17 @@

2021年总业绩

¥{{year_count_order_money | capitalize}}

-
+
营业额
¥{{money_count_order_money | capitalize}}
轻未来阻燃粉:{{order_goods_num | capitalize}}/盒
+ +
@@ -25,13 +27,14 @@ opinionData: [0, 0, 0, 0, 15904960, 0, 0, 0, 0], year_count_order_money: '', money_count_order_money: '', - order_goods_num:'', + order_goods_num: '', } }, - + async mounted() { await this.getData() this.drawLine(this.opinionData) + this.barData(this.opinionData) }, filters: { capitalize: function (val) { @@ -93,7 +96,75 @@ data: opinionData }] }) - } + }, + barData(opinionData) { + let barBox = this.$echarts.init(this.$refs.bar); + var option = { + color: ['#2860fc'], + tooltip: { + trigger: 'axis', + axisPointer: { // 坐标轴指示器,坐标轴触发有效 + type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'|'none' + } + }, + // title: { + // text: '业绩', + // top: '15', + // left: '-3', + // textStyle: { + // fontSize: 14, //字体大小 + // color: '#666666', //字体颜色 + // fontWeight: '500' + // }, + // }, + axisLabel: { + color: '#666666', + }, + grid: { + left: '3%', + right: '3%', + bottom: '3%', + containLabel: true, + + }, + xAxis: [{ + type: 'category', + data: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"], + axisLine: { // 改变x轴颜色 + lineStyle: { + color: '#c1c1c1', + width: '1', + } + }, + axisLabel: { // 改变x轴字体颜色和大小 + textStyle: { + color: "#666666", + fontSize: 12, + }, + }, + }], + yAxis: [{ + type: 'value', + axisTick: 'none', // 右边轴样式的显示 + axisLine: 'none', // 右边轴样式的显示 + // 修改网格的颜色 + splitLine: { + show: true, + lineStyle: { + type: 'solid', + color: '#f5f5f5' + } + }, + }], + series: [{ + name: '', + type: 'bar', + barWidth: '50%', + data: opinionData + }] + } + barBox.setOption(option, true); + }, }, } @@ -203,6 +274,14 @@ width: 610px; height: 490px; margin: 0 auto; + margin-bottom: 60px; + } + + .bar { + width: 610px; + height: 490px; + margin: 0 auto; + // margin-bottom: 60px; } } } diff --git a/src/views/cityDistribution/index.vue b/src/views/cityDistribution/index.vue index cb3f84d..85ef228 100644 --- a/src/views/cityDistribution/index.vue +++ b/src/views/cityDistribution/index.vue @@ -15,41 +15,13 @@

代理城市排名

-
-
+
+
-

1

-

{{item.cityName}}

+

{{index+1}}

+

{{item.name}}

-

{{item.counts | capitalize}}

-
-
-
-

2

-

{{item.cityName}}

-
-

{{item.counts | capitalize}}

-
-
-
-

3

-

{{item.cityName}}

-
-

{{item.counts | capitalize}}

-
-
-
-

4

-

{{item.cityName}}

-
-

{{item.counts |capitalize}}

-
-
-
-

5

-

{{item.cityName}}

-
-

{{item.counts | capitalize}}

+

{{item.num.counts | capitalize}}

@@ -73,7 +45,7 @@ rankArea: [], selectArea: [], regions: [], - chartBar:null, + chartBar: null, } }, filters: { @@ -83,6 +55,7 @@ }, async mounted() { await this.getData() + // return this.drawarea(); this.statistical(this.cityInfo) }, @@ -91,53 +64,50 @@ const res = await data.dataDistribution(); this.poxy_sum = res.data.poxy_sum this.city = res.data.city - this.city[this.cityName] - console.log(this.city[this.cityName], '---this.city[this.cityName]'); + console.log(this.city, '---this.city[this.cityName]'); this.cityInfo.push({ - value: this.city[this.cityName].level_id_1, + value: this.city[0].num.level_id_1, name: 'vip' }, { - value: this.city[this.cityName].level_id_2, + value: this.city[0].num.level_id_2, name: '总代' }, { - value: this.city[this.cityName].level_id_3, + value: this.city[0].num.level_id_3, name: '合伙人' }, { - value: this.city[this.cityName].level_id_4, + value: this.city[0].num.level_id_4, name: '分公司' }, { - value: this.city[this.cityName].level_id_5, + value: this.city[0].num.level_id_5, name: '股东' }) - let top5 = res.data.top5 - for (let i in top5) { - top5[i].cityName = i - this.rankArea.push(top5[i]) - } - }, drawarea() { const _this = this this.$nextTick(() => { _this.myChinaMap = echarts.init(this.$refs.area) _this.myChinaMap.on('click', function (param) { - _this.cityInfo = [] _this.cityName = param.name - _this.cityInfo.push({ - value: _this.city[_this.cityName].level_id_1, - name: 'vip' - }, { - value: _this.city[_this.cityName].level_id_2, - name: '总代' - }, { - value: _this.city[_this.cityName].level_id_3, - name: '合伙人' - }, { - value: _this.city[_this.cityName].level_id_4, - name: '分公司' - }, { - value: _this.city[_this.cityName].level_id_5, - name: '股东' + _this.cityInfo = [] + _this.city.forEach((item, index) => { + if (item.name == param.name) { + _this.cityInfo.push({ + value: item.num.level_id_1, + name: 'vip' + }, { + value: item.num.level_id_2, + name: '总代' + }, { + value: item.num.level_id_3, + name: '合伙人' + }, { + value: item.num.level_id_4, + name: '分公司' + }, { + value: item.num.level_id_5, + name: '股东' + }) + } }) _this.statistical(_this.cityInfo) }) @@ -205,7 +175,7 @@ if (this.chartBar != null && this.chartBar != "" && this.chartBar != undefined) { this.chartBar.dispose(); } - this.chartBar= echarts.init((this.$refs.chartBar)); + this.chartBar = echarts.init((this.$refs.chartBar)); var option = { title: { text: this.cityName + '数占据比', @@ -316,7 +286,6 @@ width: 690px; min-height: 509px; background: #373A4A; - margin-bottom: 40px; .title { font-size: 40px; diff --git a/src/views/login.vue b/src/views/login.vue index 5562e44..7b02c46 100644 --- a/src/views/login.vue +++ b/src/views/login.vue @@ -6,22 +6,22 @@ let url = this.$route.query; let token; let url_string = JSON.stringify(url); - if (url_string == "{}") { - this.$toast('请先登录') - } else { - token = url.token_type + " " + url.access_token; - this.$store.commit("user/setToken", token); - this.$router.push({ - path: "/home", - }); - } - - // token = - // "bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwOlwvXC90ZXN0LnFpbmd3ZWlsYWk4ODgueHl6XC9hZG1pblwvbG9naW4iLCJpYXQiOjE2Mjc0NjU1ODksImV4cCI6MTk4NzQ2NTU4OSwibmJmIjoxNjI3NDY1NTg5LCJqdGkiOiJ6clVHYnJCOXlPWkpRanRUIiwic3ViIjoxNjEsInBydiI6IjBiMzZjMGUwMjMyZGVlZTlkOTZhZDA0NGY3YWE2MjQ2YTUwYTU3ZmEifQ.aFc5fCUffmDN7zBRn-D13kx1LuLNG1Ej7vQOu4O2_AA" - // this.$store.commit("user/setToken", token); - // this.$router.push({ + // if (url_string == "{}") { + // this.$toast('请先登录') + // } else { + // token = url.token_type + " " + url.access_token; + // this.$store.commit("user/setToken", token); + // this.$router.push({ // path: "/home", // }); + // } + + token = + "bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwOlwvXC90ZXN0LnFpbmd3ZWlsYWk4ODgueHl6XC9hZG1pblwvbG9naW4iLCJpYXQiOjE2Mjc0NjU1ODksImV4cCI6MTk4NzQ2NTU4OSwibmJmIjoxNjI3NDY1NTg5LCJqdGkiOiJ6clVHYnJCOXlPWkpRanRUIiwic3ViIjoxNjEsInBydiI6IjBiMzZjMGUwMjMyZGVlZTlkOTZhZDA0NGY3YWE2MjQ2YTUwYTU3ZmEifQ.aFc5fCUffmDN7zBRn-D13kx1LuLNG1Ej7vQOu4O2_AA" + this.$store.commit("user/setToken", token); + this.$router.push({ + path: "/home", + }); }, }; From e3652cce4f356721307114837e866ca9aeb19aec Mon Sep 17 00:00:00 2001 From: zhaoguoqiang <849348323@qq.com> Date: Sat, 31 Jul 2021 15:31:39 +0800 Subject: [PATCH 2/3] 1 --- src/views/login.vue | 28 ++++++++++++++-------------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/src/views/login.vue b/src/views/login.vue index 7b02c46..5562e44 100644 --- a/src/views/login.vue +++ b/src/views/login.vue @@ -6,22 +6,22 @@ let url = this.$route.query; let token; let url_string = JSON.stringify(url); - // if (url_string == "{}") { - // this.$toast('请先登录') - // } else { - // token = url.token_type + " " + url.access_token; - // this.$store.commit("user/setToken", token); - // this.$router.push({ - // path: "/home", - // }); - // } - - token = - "bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwOlwvXC90ZXN0LnFpbmd3ZWlsYWk4ODgueHl6XC9hZG1pblwvbG9naW4iLCJpYXQiOjE2Mjc0NjU1ODksImV4cCI6MTk4NzQ2NTU4OSwibmJmIjoxNjI3NDY1NTg5LCJqdGkiOiJ6clVHYnJCOXlPWkpRanRUIiwic3ViIjoxNjEsInBydiI6IjBiMzZjMGUwMjMyZGVlZTlkOTZhZDA0NGY3YWE2MjQ2YTUwYTU3ZmEifQ.aFc5fCUffmDN7zBRn-D13kx1LuLNG1Ej7vQOu4O2_AA" - this.$store.commit("user/setToken", token); - this.$router.push({ + if (url_string == "{}") { + this.$toast('请先登录') + } else { + token = url.token_type + " " + url.access_token; + this.$store.commit("user/setToken", token); + this.$router.push({ path: "/home", }); + } + + // token = + // "bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwOlwvXC90ZXN0LnFpbmd3ZWlsYWk4ODgueHl6XC9hZG1pblwvbG9naW4iLCJpYXQiOjE2Mjc0NjU1ODksImV4cCI6MTk4NzQ2NTU4OSwibmJmIjoxNjI3NDY1NTg5LCJqdGkiOiJ6clVHYnJCOXlPWkpRanRUIiwic3ViIjoxNjEsInBydiI6IjBiMzZjMGUwMjMyZGVlZTlkOTZhZDA0NGY3YWE2MjQ2YTUwYTU3ZmEifQ.aFc5fCUffmDN7zBRn-D13kx1LuLNG1Ej7vQOu4O2_AA" + // this.$store.commit("user/setToken", token); + // this.$router.push({ + // path: "/home", + // }); }, }; From 9ac871cd464b36de1d416265906ca773989f5a2f Mon Sep 17 00:00:00 2001 From: zhaoguoqiang <849348323@qq.com> Date: Sat, 31 Jul 2021 17:15:39 +0800 Subject: [PATCH 3/3] 1 --- src/views/PerformanceData/index.vue | 8 +++----- src/views/cityDistribution/index.vue | 10 ++-------- 2 files changed, 5 insertions(+), 13 deletions(-) diff --git a/src/views/PerformanceData/index.vue b/src/views/PerformanceData/index.vue index 76de249..c9f592f 100644 --- a/src/views/PerformanceData/index.vue +++ b/src/views/PerformanceData/index.vue @@ -24,7 +24,7 @@ export default { data() { return { - opinionData: [0, 0, 0, 0, 15904960, 0, 0, 0, 0], + opinionData: [], year_count_order_money: '', money_count_order_money: '', order_goods_num: '', @@ -44,7 +44,6 @@ methods: { async getData() { this.opinionData = [] - // let data = new Date() let month = new Date().getMonth() + 1; const res = await data.earningReport(); let list = res.data.month_list_money_count @@ -83,7 +82,7 @@ xAxis: { type: 'category', boundaryGap: false, - data: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"] + data:["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"] }, yAxis: { type: 'value' @@ -125,11 +124,10 @@ right: '3%', bottom: '3%', containLabel: true, - }, xAxis: [{ type: 'category', - data: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"], + data: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"], axisLine: { // 改变x轴颜色 lineStyle: { color: '#c1c1c1', diff --git a/src/views/cityDistribution/index.vue b/src/views/cityDistribution/index.vue index 85ef228..d705a0e 100644 --- a/src/views/cityDistribution/index.vue +++ b/src/views/cityDistribution/index.vue @@ -36,15 +36,10 @@ name: 'cityDistribution', data() { return { - chinachart: null, - chartOption: null, poxy_sum: '', city: {}, cityName: '广东', cityInfo: [], - rankArea: [], - selectArea: [], - regions: [], chartBar: null, } }, @@ -55,7 +50,6 @@ }, async mounted() { await this.getData() - // return this.drawarea(); this.statistical(this.cityInfo) }, @@ -64,7 +58,7 @@ const res = await data.dataDistribution(); this.poxy_sum = res.data.poxy_sum this.city = res.data.city - console.log(this.city, '---this.city[this.cityName]'); + this.cityName = this.city[0].name this.cityInfo.push({ value: this.city[0].num.level_id_1, name: 'vip' @@ -157,7 +151,7 @@ } } }, { - name: "广东", + name: this.city[0].name, selected: true, }], itemStyle: {