柱状图数据，仪表盘配色

src/components/e-charts/bar-chart.vue

@@ -10,14 +10,15 @@ export default {
       type: Object,
       default: () => {
         return {
-          data: 40,
-          text: "模拟数据1.0"
+          xaxis: [],
+          data: []
+          
         };
       }
     },
     bar_width: {
       type: String,
-      default: "16px"
+      default: "12px"
     },
     colors: {
       type: Array,
@@ -47,12 +48,23 @@ export default {
         xAxis: [
           {
             type: "category",
-            data: ["2019Q1", "2019Q2", "2019Q3", "2019Q4"],
+            data: self.data.xaxis,
             axisLabel: {
               margin: 20,
               color: "#0d1847",
               textStyle: {
                 fontSize: 12
+              },
+              interval: 0,
+              rotate: 30,
+              formatter:  function(value) {
+                let valueTxt = "";
+                if (value.length > 6) {
+                  valueTxt = value.substring(0, 5) + "...";
+                } else {
+                  valueTxt = value;
+                }
+                return valueTxt;
               }
             },
             axisLine: {
@@ -100,7 +112,7 @@ export default {
         series: [
           {
             type: "bar",
-            data: [40, 80, 20, 16],
+            data: self.data.data,
             barWidth: self.bar_width,
             itemStyle: {
               normal: {

src/components/e-charts/dashboard.vue

@@ -10,14 +10,18 @@ export default {
       type: Object,
       default: () => {
         return {
-          data: 40,
-          text: "模拟数据1.0"
+          data: 0,
+          text: ""
         };
       }
     },
     dangerousValue: {
       type: String,
       default: ""
+    },
+    is_word: {
+      type: Boolean,
+      default: false
     }
   },
   data: () => ({
@@ -31,6 +35,7 @@ export default {
         title: [
           {
             text: self.data.data + "{a|%}",
+            show: !self.is_word,
             x: "center",
             y: "center",
             textStyle: {
@@ -47,6 +52,7 @@ export default {
           },
           {
             text: self.data.text,
+            show: !self.is_word,
             x: "center",
             y: "58%",
             textStyle: {
@@ -54,6 +60,53 @@ export default {
               fontWeight: "normal",
               color: "#707693"
             }
+          },
+          {
+            text: self.data.text,
+            show: self.is_word,
+            x: "center",
+            y: "74%",
+            textStyle: {
+              fontSize: 14,
+              fontWeight: "normal",
+              color: "#8890a7"
+            }
+          },
+          {
+            text: self.data.data + "%",
+            show: self.is_word,
+            x: "center",
+            y: "64%",
+            textStyle: {
+              fontSize: 20,
+              fontWeight: "normal",
+              color: "#242c43"
+            }
+          },
+          {
+            text:
+              self.data.data > 75
+                ? "优"
+                : self.data.data > 50
+                ? "良"
+                : self.data.data > 25
+                ? "中"
+                : "差",
+            show: self.is_word,
+            x: "center",
+            y: "40%",
+            textStyle: {
+              fontSize: 36,
+              fontWeight: "normal",
+              color:
+                self.data.data > 75
+                  ? "#00beb2" //green
+                  : self.data.data > 50
+                  ? "#ff7200" //yellow
+                  : self.data.data > 25
+                  ? "#da4251" //red
+                  : "#da4251" //red
+            }
           }
         ],
         angleAxis: {
@@ -110,12 +163,12 @@ export default {
                           ? "#f7f1d5"
                           : "#d5f7e8"
                         : self.data.data > 75
-                        ? "f7f1d5"
+                        ? "#d5f7e8"
                         : self.data.data > 50
                         ? "#ffd98f"
                         : self.data.data > 25
-                        ? "#d5f7e8"
-                        : "#d5f7e8"
+                        ? "#f7f1d5"
+                        : "#f7f1d5"
                   },
                   {
                     offset: 1,
@@ -125,12 +178,12 @@ export default {
                           ? "#da4251" // red
                           : "#00beb2" //green
                         : self.data.data > 75
-                        ? "#da4251" //red
+                        ? "#00beb2" //green
                         : self.data.data > 50
                         ? "#ff7200" //yellow
                         : self.data.data > 25
-                        ? "#00beb2" //green
-                        : "#00beb2" //green
+                        ? "#da4251" //red
+                        : "#da4251" //red
                   }
                 ])
               }

src/components/service-list/commodity-card.vue

@@ -2,7 +2,7 @@
   <div class="com_card">
     <div class="com_card_top">
       <img
-        :src="cellData.cover"
+        :src="cellData.logo"
         class="com_card_img"
       />
       <div class="com_card_name_v">

src/components/service-list/service_list.vue

@@ -475,8 +475,8 @@ export default {
     getAppArea() {
       this.$api.serviceShop.getAppArea().then(response => {
         if (response.data.success == 1) {
-          this.filterLists[1].childDomains = response.data.data;
-          this.refresh_app_1 = true;
+          this.filterLists[2].childDomains = response.data.data;
+          this.refresh_app_2 = true;
         } else {
           console.log(response.data.errMsg);
         }
@@ -485,8 +485,8 @@ export default {
     getAppType() {
       this.$api.serviceShop.getAppType().then(response => {
         if (response.data.success == 1) {
-          this.filterLists[2].childDomains = response.data.data;
-          this.refresh_app_2 = true;
+          this.filterLists[1].childDomains = response.data.data;
+          this.refresh_app_1 = true;
         } else {
           console.log(response.data.errMsg);
         }

src/pages/data-analysis/my-service.vue

@@ -11,8 +11,12 @@
           <el-col :span="24" class="in_block">
             <block-radius :show_header="true" title="服务总体概况" class="block">
               <div class="left_1">
-                <div ref="left_1_l" class="left_1_l"></div>
-                <dashboard ref="left_1_r" class="left_1_r"></dashboard>
+                <div ref="left_1_l" class="left_1_l">
+                  <img :src="require('@/assets/imgs/data_img_service.gif')" class="left_1_img" />
+                  <div class="left_1_title">服务总数</div>
+                  <div class="left_1_num">2222</div>
+                </div>
+                <dashboard ref="left_1_r" :data="das_data" :is_word="true" class="left_1_r"></dashboard>
               </div>
             </block-radius>
           </el-col>
@@ -82,7 +86,9 @@
       </el-col>
       <!-- 不可横向铺满，一般为最后一行 -->
       <el-col :span="6" class="in_block">
-        <block-radius class="block"></block-radius>
+        <block-radius :show_header="true" title="服务来源机构分析" class="block">
+          <BarChart :data="bar_data_org" :colors="['#e56600', '#e56600']" />
+        </block-radius>
       </el-col>
       <el-col :span="18" class="in_block default">
         <block-radius class="block">
@@ -152,6 +158,10 @@ export default {
         }
       ]
     },
+    das_data: {
+      data: 40,
+      text: "健康占比"
+    },
     bar_data: {
       xaxis: [
         "01-01",
@@ -163,12 +173,20 @@ export default {
         "01-07",
         "01-08"
       ],
-      data: [
-        {
-          name: "开发者应用",
-          arr: [100, 120, 130, 150, 160, 120, 110, 100]
-        }
-      ]
+      data: [100, 120, 130, 150, 160, 120, 110, 100]
+    },
+    bar_data_org: {
+      xaxis: [
+        "01-01",
+        "01-02",
+        "01-03",
+        "01-04",
+        "01-05",
+        "01-06",
+        "01-07",
+        "01-08"
+      ],
+      data: [100, 120, 130, 150, 160, 120, 110, 100]
     }
   }),
   mounted() {},
@@ -209,11 +227,28 @@ export default {
 .left_1 {
   height: 100%;
   display: flex;
+  justify-content: space-between;
 }
 .left_1_l {
-  width: 50%;
+  width: 40%;
   height: 100%;
   display: inline-block;
+  padding: 20px 0 0 0;
+}
+.left_1_title {
+  width: 100%;
+  text-align: center;
+}
+.left_1_num {
+  font-size: 32px;
+  color: #515fe7;
+  width: 100%;
+  text-align: center;
+}
+.left_1_img {
+  width: 120px;
+  display: block;
+  margin: 0 auto;
 }
 .left_1_r {
   width: 50%;