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/2] 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 @@
             <p class="title">2021年总业绩</p>
             <p class="money" v-if="year_count_order_money">¥{{year_count_order_money | capitalize}}</p>
         </div>
-        <div class="time">
+        <!-- <div class="time">
             <div class="active">月</div>
-        </div>
+        </div> -->
         <div class="list">
             <div class="title">营业额</div>
             <div class="money" v-if="money_count_order_money"><span>¥</span>{{money_count_order_money | capitalize}}
             </div>
             <div class="name">轻未来阻燃粉：{{order_goods_num | capitalize}}/盒</div>
             <div class="cartogram" ref="cartogram"></div>
+
+            <div class="bar" ref="bar"></div>
         </div>
     </div>
 </template>
@@ -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);
+            },
         },
     }
 </script>
@@ -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 @@
         <div class="ranking">
             <p class="title">代理城市排名</p>
             <div class="rankingCity">
-                <div v-for="(item,index) in rankArea" :key="index">
-                    <div class="item" v-if="item.top == 1">
+                <div v-for="(item,index) in city" :key="index">
+                    <div class="item">
                         <div class="city">
-                            <p class="rankNum">1</p>
-                            <p class="cityName">{{item.cityName}}</p>
+                            <p class="rankNum">{{index+1}}</p>
+                            <p class="cityName">{{item.name}}</p>
                         </div>
-                        <p class="number">{{item.counts | capitalize}}</p>
-                    </div>
-                    <div class="item" v-if="item.top == 2">
-                        <div class="city">
-                            <p class="rankNum">2</p>
-                            <p class="cityName">{{item.cityName}}</p>
-                        </div>
-                        <p class="number">{{item.counts | capitalize}}</p>
-                    </div>
-                    <div class="item" v-if="item.top == 3">
-                        <div class="city">
-                            <p class="rankNum">3</p>
-                            <p class="cityName">{{item.cityName}}</p>
-                        </div>
-                        <p class="number">{{item.counts | capitalize}}</p>
-                    </div>
-                    <div class="item" v-if="item.top == 4">
-                        <div class="city">
-                            <p class="rankNum">4</p>
-                            <p class="cityName">{{item.cityName}}</p>
-                        </div>
-                        <p class="number">{{item.counts |capitalize}}</p>
-                    </div>
-                    <div class="item" v-if="item.top == 5">
-                        <div class="city">
-                            <p class="rankNum">5</p>
-                            <p class="cityName">{{item.cityName}}</p>
-                        </div>
-                        <p class="number">{{item.counts | capitalize}}</p>
+                        <p class="number">{{item.num.counts | capitalize}}</p>
                     </div>
                 </div>
             </div>
@@ -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",
+      });
     },
   };
 </script>
-- 
2.30.2


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/2] 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",
+      // });
     },
   };
 </script>
-- 
2.30.2