1

src/components/rank/components/customer.vue

@@ -51,6 +51,11 @@
       initChart() {
         const chartDom = document.getElementById('chart');
         this.chart = echarts.init(chartDom);
+         var intervalNum=0;
+            if(this.xAxisData&&this.xAxisData.length>0)
+            {
+                intervalNum=this.calculateInterval(this.xAxisData.length);
+            }
         const option = {
           tooltip: {
             trigger: 'axis', // 设置为 'axis' 以确保鼠标悬浮在曲线任意位置时都能触发事件
@@ -94,7 +99,7 @@
             },
             axisLabel: {
               color: '#121212',
-              interval: this.calculateInterval(this.xAxisData.length)
+              interval: intervalNum
             },
             axisTick: {
               show: false,

src/components/rank/components/tradecount.vue

@@ -11,22 +11,15 @@ export default {
         return {
             chart: null,
             barData: {
-                name: '新增同业数',
-                data: [123, 211, 178, 289, 90, 156, 222, 101, 267, 199, 125, 291, 187, 92, 243, 148, 212, 117, 279, 103, 137, 256, 221, 193, 88, 283, 165, 111, 239, 107],
+                name: '总订单',
+                data: []
             },
             lineData: {
-                name: '新增激活数',
-                data: [105, 219, 142, 297, 176, 84, 233, 120, 265, 199, 207, 91, 251, 153, 281, 113, 224, 168, 246, 131, 273, 185, 99, 237, 147, 292, 109, 214, 171, 260],
+                name: '小程序订单',
+                data:[]
             },
-            xAxisData: [
-                '11/01', '11/02', '11/03', '11/04', '11/05',
-                '11/06', '11/07', '11/08', '11/09', '11/10',
-                '11/11', '11/12', '11/13', '11/14', '11/15',
-                '11/16', '11/17', '11/18', '11/19', '11/20',
-                '11/21', '11/22', '11/23', '11/24', '11/25',
-                '11/26', '11/27', '11/28', '11/29', '11/30'
-            ],
-            unit: '人',
+            xAxisData: [ ],
+            unit: '单',
         };
     },
     props: {
@@ -34,12 +27,21 @@ export default {
             type: Object,
             default: null
         }
+    },
+      watch: {
+      chartData: function (old, val) {
+        if (this.chartData) {
+            this.barData.data = this.chartData.allOrderData;
+            this.lineData.data = this.chartData.appOrderData;
+            this.xAxisData = this.chartData.xAxisData;
+        }
+        this.initChart();
+      }
     },
     mounted() {
         if (this.chartData) {
-            this.barData = this.chartData.barData;
-            this.lineData = this.chartData.lineData;
-            this.unit = this.chartData.unit;
+            this.barData.data = this.chartData.allOrderData;
+            this.lineData.data = this.chartData.appOrderData;
             this.xAxisData = this.chartData.xAxisData;
         }
         this.initChart();
@@ -48,6 +50,11 @@ export default {
         initChart() {
             const chartDom = document.getElementById('tradecount');
             this.chart = echarts.init(chartDom);
+            var intervalNum=0;
+            if(this.xAxisData&&this.xAxisData.length>0)
+            {
+                intervalNum=this.calculateInterval(this.xAxisData.length);
+            }
 
             const option = {
                 tooltip: {
@@ -83,7 +90,7 @@ export default {
                     },
                     axisLabel: {
                         color: '#121212',
-                        interval: this.calculateInterval(this.xAxisData.length),
+                        interval: intervalNum,
                     },
                     axisTick: {
                         show: false,

src/components/rank/dataCount.vue

@@ -115,21 +115,25 @@
       <div class="card rounded big">
         <div class="row items-center">
           <div style="margin: 0 12px;" class="col">
-            <div class="sub-title">今日客户数据</div>
+            <div class="sub-title">客户交易数据</div>
             <div class="">
               <span class="dot"></span>
               <span class="text-info">{{ parameters.dateRange.join(' - ') }}</span>
             </div>
           </div>
-          <el-select v-model="platformId" style="width: 140px;">
+          <!-- <el-select v-model="platformId" style="width: 140px;">
             <el-option v-for="(x,i) in platforms" :key="i" :label="x.Name" :value="x.Id"></el-option>
-          </el-select>
+          </el-select> -->
         </div>
         <div class="q-mt-md row items-center">
           <div class="data-items col">
             <div>交易金额</div>
             <div class="num" style="margin: 6px 0;">
-              <span class="datanum">5000000.00</span>
+              <span class="datanum">
+                <template v-if="customerObj">
+                    {{customerObj.OrderTotalPreferPrice}}
+                </template>
+              </span>
               <span>元</span>
             </div>
           </div>
@@ -137,7 +141,11 @@
           <div class="data-items col">
             <div>收客人数</div>
             <div class="num" style="margin: 6px 0;">
-              <span class="datanum">89</span>
+              <span class="datanum">
+                 <template v-if="customerObj">
+                    {{customerObj.OrderTotalGuestNum}}
+                </template>
+              </span>
               <span>人</span>
             </div>
           </div>
@@ -145,7 +153,11 @@
           <div class="data-items col">
             <div>订单数</div>
             <div class="num" style="margin: 6px 0;">
-              <span class="datanum">455</span>
+              <span class="datanum">
+                  <template v-if="customerObj">
+                    {{customerObj.OrderTotalCount}}
+                </template>
+              </span>
               <span>个</span>
             </div>
           </div>
@@ -154,7 +166,9 @@
           <div class="data-items col">
             <div>用卷订单数</div>
             <div class="num" style="margin: 6px 0;">
-              <span class="datanum">26052</span>
+              <span class="datanum">     <template v-if="customerObj">
+                    {{customerObj.OrderTotalUseCoupinCount}}
+                </template></span>
               <span>个</span>
             </div>
           </div>
@@ -169,7 +183,7 @@
           </div>
         </div>
         <div style="height: 320px;">
-          <Tradecount></Tradecount>
+          <Tradecount :chartData="customerObj"></Tradecount>
         </div>
       </div>