update

src/components/card.vue

 <template>
   <div class="card">
     <div class="card-inner">
-      <div class="card-hd" v-if="title">{{ title }}</div>
+      <div class="card-hd" v-if="title">
+        <h2 class="title">{{ title }}</h2>
+        <div class="aside"><slot name="aside"></slot></div>
+      </div>
       <div class="card-bd">
         <slot></slot>
       </div>
@@ -47,11 +50,20 @@ export default {
   overflow: hidden;
 }
 .card-hd {
-  padding: 13px 13px;
+  display: flex;
+  align-items: center;
+  padding: 10px 13px 5px;
+}
+.card-hd .title {
+  flex: 1;
   font-size: 14px;
   font-weight: 400;
   color: #f3f3f3;
 }
+.card-hd .aside {
+  font-size: 12px;
+  color: #0a7199;
+}
 .card-bd {
   flex: 1;
   margin: 0 13px;

src/components/monthIncomeTrend.vue

@@ -91,11 +91,11 @@ export default {
     },
     option() {
       return {
-        title: { text: '单位：万', textStyle: { fontSize: 12, color: '#0A7199' }, padding: 0 },
+        // title: { text: '单位：万', right: 0, textStyle: { fontSize: 12, color: '#0A7199' }, padding: 0 },
         // tooltip: { trigger: 'axis', axisPointer: { type: 'none' } },
-        grid: { left: 'left', top: 40, right: 0, bottom: 40, containLabel: true },
+        grid: { left: 'left', top: 10, right: 0, bottom: 25, containLabel: true },
         legend: {
-          bottom: '10px',
+          bottom: 0,
           itemWidth: 10,
           itemHeight: 10,
           icon: 'rect',
@@ -115,7 +115,7 @@ export default {
           type: 'category',
           axisTick: { show: false },
           axisLine: { show: false },
-          axisLabel: { color: '#0A7199' },
+          axisLabel: { color: '#0A7199', interval: 0 },
           data: this.dataset.axis
         },
         series: [...this.dataset.series, this.totalBar]

src/components/weekIncome.vue

@@ -95,16 +95,15 @@ export default {
     },
     option() {
       return {
-        title: { text: '单位：万', textStyle: { fontSize: 12, color: '#0A7199' }, padding: 0 },
+        // title: { text: '单位：万', textStyle: { fontSize: 12, color: '#0A7199' }, padding: 0 },
         // tooltip: { trigger: 'axis', axisPointer: { type: 'none' } },
-        grid: { left: 'left', top: 40, right: 0, bottom: 40, containLabel: true },
+        grid: { left: 'left', top: 10, right: 0, bottom: 15, containLabel: true },
         legend: {
-          bottom: '10px',
+          bottom: 0,
           itemWidth: 10,
           itemHeight: 10,
           icon: 'rect',
           textStyle: { color: '#F3F3F3' }
-          // data: this.dataset.legend
         },
         yAxis: {
           type: 'value',
@@ -120,7 +119,7 @@ export default {
           type: 'category',
           axisTick: { show: false },
           axisLine: { show: false },
-          axisLabel: { color: '#0A7199', rotate: 45 },
+          axisLabel: { color: '#0A7199', interval: 0, rotate: 45 },
           data: this.dataset.axis
         },
         series: [...this.dataset.series, this.totalBar]

src/components/yearIncome.vue

@@ -41,7 +41,7 @@ export default {
           text: `{value|${(total / 10000).toFixed(2)}万}`,
           top: 'center',
           textStyle: {
-            rich: { value: { color: '#fff', fontSize: 16, width: this.height - 20, align: 'center' } }
+            rich: { value: { color: '#fff', fontSize: 15, width: this.height - 30, align: 'center' } }
           }
         },
         tooltip: { trigger: 'item' },
@@ -58,8 +58,8 @@ export default {
         series: [
           {
             type: 'pie',
-            radius: ['60%', '90%'],
-            left: '0',
+            radius: ['70%', '100%'],
+            left: 0,
             width: this.height - 20,
             stillShowZeroSum: false,
             avoidLabelOverlap: false,
@@ -74,6 +74,7 @@ export default {
               }
             },
             labelLine: { show: false },
+            emphasis: { scale: false },
             data
           }
         ]

src/pages/home/index.vue

@@ -11,6 +11,7 @@
       <swiper-slide>
         <div class="h100">
           <card title="项目营收走势及预测（本周）">
+            <template #aside>单位：万</template>
             <week-income></week-income>
           </card>
           <card title="项目线上投入产出比（本月）">
@@ -27,6 +28,7 @@
             <project-ranking></project-ranking>
           </card>
           <card title="营收走势（本年度）">
+            <template #aside>单位：万</template>
             <month-income-trend></month-income-trend>
           </card>
         </div>