1

src/components/work/todayData.vue

@@ -152,6 +152,13 @@
       }
     }
   }
+  .Data_ListBottom{
+    box-sizing: border-box;
+    padding: 32px;
+    background-color: #fff;
+    margin: 0 24px 24px 0;
+    font-size: 14px;
+  }
 </style>
 <template>
   <div class="todayData">
@@ -655,6 +662,23 @@
         </div>
       </div>
     </div>
+    <div style="display:none;">
+      <div class="Check_Map">
+        <div class="check_Title">统计数据</div>
+        <div class="Data_ListContent">
+          <div class="Data_ListBottom" style="width:400px;">
+            <div>
+              <VueApexCharts width="80%" height="105" ref="bing" :options="chartOptions4" :series="series4"></VueApexCharts>
+            </div>
+          </div>
+          <div class="Data_ListBottom" style="width:700px;">
+            <div>
+              <VueApexCharts width="90%" height="405" ref="zhu" :options="chartOptions5" :series="series5"></VueApexCharts>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 <script>
@@ -759,6 +783,74 @@
             borderColor: '#f1f1f1'
           },
         },
+        series4: [4, 3, 2],
+        chartOptions4: {
+          labels: ["名单人数", "开单奖励", "线索奖励"],
+          chart: {
+            type: "donut",
+            width: 40,
+            height: 40,
+            sparkline: {
+              enabled: true
+            }
+          },
+          stroke: {
+            width: 1
+          },
+          tooltip: {
+            fixed: {
+              enabled: false
+            }
+          },
+          legend: {
+            position: 'right',
+            show: true,
+          }
+        },
+        series5:[{
+          name: 'Net Profit',
+          data: [44, 55, 57, 56, 61, 58, 63, 60, 66]
+        }, {
+          name: 'Revenue',
+          data: [76, 85, 101, 98, 87, 105, 91, 114, 94]
+        }, {
+          name: 'Free Cash Flow',
+          data: [35, 41, 36, 26, 45, 48, 52, 53, 41]
+        }],
+        chartOptions5: {
+          bar: {
+            horizontal: false,
+            columnWidth: '55%',
+            endingShape: 'rounded'
+          },
+          chart: {
+            type: 'bar',
+            height: 350
+          },
+          stroke: {
+            show: true,
+            width: 2,
+            colors: ['transparent']
+          },
+          xaxis: {
+            categories: ['Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct'],
+          },
+          yaxis: {
+            title: {
+              text: '$ (thousands)'
+            }
+          },
+           fill: {
+            opacity: 1
+          },
+          tooltip: {
+            y: {
+              formatter: function (val) {
+                return "$ " + val + " thousands"
+              }
+            }
+          }
+        },
         yesData: {}, //昨日数据
         employeeList: [],
         myEmployeeList: [],