分利看板数据联调

src/api/api.js

@@ -2,6 +2,10 @@ import { getAction, deleteAction, putAction, postAction, httpAction } from '@/ap
 import Vue from 'vue'
 import {UI_CACHE_DB_DICT_DATA } from "@/store/mutation-types"
 
+// 统计数据
+const getDataStatisticsApi = (params)=>getAction("/property-central/partners/partnersInfo/statistics",params);
+const shareBoardApi = (params)=>getAction("/property-community/order/paymentOrder/shareBoard",params);
+
 //商铺
 const partnersShopByDepId = (params)=>getAction("/property-central/partners/partnersShop/queryById",params);
 const partnersShopAudit = (params)=>postAction("/property-central/partners/partnersShop/audit",params);
@@ -14,9 +18,6 @@ const shareBenefitList = (params)=>getAction("/property-central/partners/shareBe
 const shareBalanceByDepId = (params)=>getAction("/property-central/partners/shareBalance/queryById",params);
 const getShareruleApi = (params)=>getAction("/property-central/sharerule/settlementSet/queryById",params);
 
-// 首页统计数据
-const getDataStatisticsApi = (params)=>getAction("/property-central/partners/partnersInfo/statistics",params);
-
 //角色管理
 const addRole = (params)=>postAction("/sys/role/add",params);
 const editRole = (params)=>putAction("/sys/role/edit",params);
@@ -121,6 +122,7 @@ export {
   partnersShopOperateApi,
   getQrCode,
   getDataStatisticsApi,
+  shareBoardApi,
   shareBenefitShopByDepId,
   shareBenefitList,
   shareBalanceByDepId,

src/components/chart/Bar.vue

@@ -33,7 +33,7 @@
       }
     },
     data() {
-      return { padding: ['auto', 'auto', '40', '50'] }
+      return { padding: ['auto', 'auto', '50', '50'] }
     },
     computed: {
       scale() {

src/views/statistical/IndexChart.vue

 <template>
   <div class="page-header-index-wide">
     <div class="query-box">
-      <a-range-picker @change="onChangeData" />
+      <a-month-picker placeholder="选择日期" @change="onChange" />
       <a-button type="primary" @click="searchQuery" style="margin-left: 20px;">查询</a-button>
     </div>
     <div class="data-box">
       <div class="statistics">
         <p style="color:#666;margin-bottom:5px;">绑定商铺数量</p>
-        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">100</p>
+        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">{{data.bindShops || 0}}</p>
       </div>
       <div class="statistics">
         <p style="color:#666;margin-bottom:5px;">平台总小区数量</p>
-        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">100</p>
+        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">{{data.bindCommunity || 0}}</p>
       </div>
 
       <div class="statistics">
         <p style="color:#666;margin-bottom:5px;">平台总业主数量</p>
-        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">100</p>
+        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">{{data.bindOwner || 0}}</p>
       </div>
 
       <div class="statistics">
         <p style="color:#666;margin-bottom:5px;">合作伙伴分利</p>
-        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">¥100.00</p>
+        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">¥{{data.partnerShare || 0}}</p>
       </div>
 
       <div class="statistics">
         <p style="color:#666;margin-bottom:5px;">新增订单数量</p>
-        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">100</p>
+        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">{{data.newOrderAmount || 0}}</p>
       </div>
       <div class="statistics">
         <p style="color:#666;margin-bottom:5px;">总营收</p>
-        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">¥100.00</p>
+        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">¥{{data.totalMoney || 0}}</p>
       </div>
       <div class="statistics">
         <p style="color:#666;margin-bottom:5px;">本月营收</p>
-        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">¥100.00</p>
+        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">¥{{data.monthMoney || 0}}</p>
       </div>
       <div class="statistics" style="margin-right: 0;">
         <p style="color:#666;margin-bottom:5px;">今日营收</p>
-        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">¥100.00</p>
+        <p style="margin-bottom:0;color:#333;font-size:24px;line-height:1;">¥{{data.todayMoney || 0}}</p>
       </div>
     </div>
     <a-row :gutter="24">
@@ -47,11 +47,11 @@
           <h3 class="box-title">最新成交订单</h3>
           <div class="order">
             <div class="order-title"><span
-                style="width: 30%;">订单编号</span><span>提交时间</span><span>用户账号</span><span>订单金额</span></div>
-            <vue-seamless-scroll :data="listData" class="seamless-warp" :class-option="defineScroll">
-              <div v-for="(item, index) in listData" :key="index" class="item">
+                style="width: 30%;">订单编号</span><span>提交时间</span><span>买家名称</span><span>订单金额</span></div>
+            <vue-seamless-scroll :data="data.shareOrder" class="seamless-warp" :class-option="defineScroll">
+              <div v-for="(item, index) in data.shareOrder" :key="index" class="item">
                 <span
-                  style="width: 30%;">{{ item.num }}</span><span>{{ item.date }}</span><span>{{ item.account }}</span><span>{{ item.amount }}</span>
+                  style="width: 30%;">{{ item.order_num }}</span><span>{{ item.create_time }}</span><span>{{ item.buyer_name }}</span><span>¥{{ item.total_money }}</span>
               </div>
             </vue-seamless-scroll>
           </div>
@@ -60,7 +60,7 @@
       <a-col :sm="24" :md="12" :xl="12" :style="{ marginBottom: '20px' }">
         <div class="t-box">
           <h3 class="box-title">月成交金额</h3>
-          <line-chart-multid :dataSource="dayData" :fields="dayFields" style="padding: 0;" />
+          <line-chart-multid :dataSource="dataList1" :fields="dayFields1" style="padding: 0;" />
         </div>
       </a-col>
     </a-row>
@@ -69,14 +69,14 @@
         <div class="t-box">
           <h3 class="box-title">月成交订单数量</h3>
           <div>
-            <line-chart-multid :dataSource="dayData" :fields="dayFields" style="padding: 0;" />
+            <line-chart-multid :dataSource="dataList2" :fields="dayFields2" style="padding: 0;" />
           </div>
         </div>
       </a-col>
       <a-col :sm="24" :md="12" :xl="12" :style="{ marginBottom: '20px' }">
         <div class="t-box">
           <h3 class="box-title">入驻商铺新增数量</h3>
-          <bar :dataSource="barData" style="padding: 0;" />
+          <bar :dataSource="dataList3" style="padding:0;" />
         </div>
       </a-col>
     </a-row>
@@ -85,14 +85,14 @@
         <div class="t-box">
           <h3 class="box-title">巡报订单数量</h3>
           <div>
-            <line-chart-multid :dataSource="dayData1" :fields="dayFields1" style="padding: 0;" />
+            <line-chart-multid :dataSource="dataList4" :fields="dayFields4" style="padding: 0;" />
           </div>
         </div>
       </a-col>
       <a-col :sm="24" :md="12" :xl="12" :style="{ marginBottom: '20px' }">
         <div class="t-box">
           <h3 class="box-title">巡报订单金额</h3>
-          <line-chart-multid :dataSource="dayData1" :fields="dayFields1" style="padding: 0;" />
+          <line-chart-multid :dataSource="dataList5" :fields="dayFields5" style="padding: 0;" />
         </div>
       </a-col>
     </a-row>
@@ -103,7 +103,7 @@
 import Bar from '@/components/chart/Bar'
 import LineChartMultid from '@/components/chart/LineChartMultid'
 import vueSeamlessScroll from 'vue-seamless-scroll'
-import { getDataStatisticsApi, getLoginfo, getVisitInfo, auditPropertyApi } from '@/api/api'
+import { shareBoardApi } from '@/api/api'
 export default {
   name: 'statistical',
   components: {
@@ -114,105 +114,31 @@ export default {
   data() {
     return {
       loading: true,
-      payData: [],
-      barData: [],
-      dayFields: ['月成交订单数量'],
-      dayData: [
-        { type: '1月', 月成交订单数量: 71 },
-        { type: '2月', 月成交订单数量: 61.9 },
-        { type: '3月', 月成交订单数量: 19.5 },
-        { type: '4月', 月成交订单数量: 141.5 },
-        { type: '5月', 月成交订单数量: 118.4 },
-        { type: '6月', 月成交订单数量: 211.5 },
-        { type: '7月', 月成交订单数量: 251.2 },
-        { type: '8月', 月成交订单数量: 216.5 },
-        { type: '9月', 月成交订单数量: 213.3 },
-        { type: '10月', 月成交订单数量: 181.3 },
-        { type: '11月', 月成交订单数量: 131.9 },
-        { type: '12月', 月成交订单数量: 91.6 },
-      ],
-      listData: [
-        {
-          num: '201707196398345',
-          date: '2023-07-19',
-          account: '18000000000',
-          amount: '¥200.00',
-        },
-        {
-          num: '201707196398345',
-          date: '2023-07-19',
-          account: '18000000000',
-          amount: '¥200.00',
-        },
-        {
-          num: '201707196398345',
-          date: '2023-07-19',
-          account: '18000000000',
-          amount: '¥200.00',
-        },
-        {
-          num: '201707196398345',
-          date: '2023-07-19',
-          account: '18000000000',
-          amount: '¥200.00',
-        },
-        {
-          num: '201707196398345',
-          date: '2023-07-19',
-          account: '18000000000',
-          amount: '¥200.00',
-        },
-        {
-          num: '201707196398345',
-          date: '2023-07-19',
-          account: '18000000000',
-          amount: '¥200.00',
-        },
-        {
-          num: '201707196398345',
-          date: '2023-07-19',
-          account: '18000000000',
-          amount: '¥200.00',
-        },
-        {
-          num: '201707196398345',
-          date: '2023-07-19',
-          account: '18000000000',
-          amount: '¥200.00',
-        },
-      ],
-      dayFields1: ['巡报订单数量'],
-      dayFields2: ['巡报订单金额'],
-      dayData1: [
-        { type: '7月1日', 巡报订单数量: 171 },
-        { type: '7月10日', 巡报订单数量: 161.9 },
-        { type: '7月20日', 巡报订单数量: 119.5 },
-        { type: '7月30日', 巡报订单数量: 141.5 },
-        { type: '8月10日', 巡报订单数量: 118.4 },
-        { type: '8月20日', 巡报订单数量: 211.5 },
-        { type: '8月30日', 巡报订单数量: 251.2 },
-        { type: '9月10日', 巡报订单数量: 216.5 },
-        { type: '9月20日', 巡报订单数量: 213.3 },
-        { type: '9月30日', 巡报订单数量: 81.3 },
-      ],
+      time: '',
+      data: {},
+      dayFields1: ['月成交金额'],
+      dataList1: [],
+      dayFields2: ['月成交订单数量'],
+      dataList2: [],
+      dataList3: [],
+      dayFields4: ['巡报订单数量'],
+      dataList4: [],
+      dayFields5: ['巡报订单金额'],
+      dataList5: [],
     }
   },
   created() {
     setTimeout(() => {
       this.loading = !this.loading
     }, 1000)
-    for (let i = 0; i < 12; i += 1) {
-      this.barData.push({
-        x: `${i + 1}月`,
-        y: i + 10,
-      })
-    }
+    this.getDataStatistics()
   },
   computed: {
     defineScroll() {
       return {
+        data: {},
         step: 0.5, // 数值越大速度滚动越快
-        limitMoveNum: 2, // 开始无缝滚动的数据量 this.dataList.length
+        limitMoveNum: 5, // 开始无缝滚动的数据量 this.dataList.length
         hoverStop: true, // 是否开启鼠标悬停stop
         direction: 1, // 0向下 1向上 2向左 3向右
         openWatch: true, // 开启数据实时监控刷新dom
@@ -223,16 +149,58 @@ export default {
     },
   },
   methods: {
-    onChangeData(date, dateString) {
-      if (dateString.length > 0) {
-        this.queryParam.createTime_begin = dateString[0]
-        this.queryParam.createTime_end = dateString[1]
-      } else {
-        this.queryParam.createTime_begin = ''
-        this.queryParam.createTime_end = ''
+    async getDataStatistics() {
+      let { result } = await shareBoardApi({ platformType: 'partner', date: this.time })
+      if (result) {
+        this.data = result
+        this.dataList1 =
+          result.shareByMonth.map((item) => {
+            return {
+              type: item.MONTH,
+              月成交金额: item.shareMoney,
+            }
+          }) || []
+        this.dataList2 =
+          result.orderCountByMonth.map((item) => {
+            return {
+              type: item.MONTH,
+              月成交订单数量: item.orderCount,
+            }
+          }) || []
+        this.dataList3 =
+          result.shopCountByMonth.map((item) => {
+            return {
+              x: item.MONTH,
+              y: item.shopCount,
+            }
+          }) || []
+        this.dataList4 =
+          result.shareList.map((item) => {
+            return {
+              type: item.st_date_day,
+              巡报订单数量: item.order_num,
+            }
+          }) || []
+        this.dataList5 =
+          result.shareList.map((item) => {
+            return {
+              type: item.st_date_day,
+              巡报订单金额: item.share_money,
+            }
+          }) || []
       }
     },
-    searchQuery() {},
+    onChange(date, dateString) {
+      if (dateString) {
+        this.time = dateString.replace('-', '')
+      }else{
+        this.time = ''
+        this.getDataStatistics()
+      }
+    },
+    searchQuery() {
+      this.getDataStatistics()
+    },
   },
 }
 </script>
@@ -245,6 +213,8 @@ export default {
     background: #fff;
     padding: 20px;
     margin-bottom: 20px;
+    display: flex;
+    justify-content: flex-end;
   }
   .data-box {
     display: flex;
@@ -302,8 +272,10 @@ export default {
       span {
         width: 25%;
         border-right: 1px solid #e8e8e8;
-        border-top: 1px solid #e8e8e8;
+        //border-top: 1px solid #e8e8e8;
+        border-bottom: 1px solid #e8e8e8;
         text-align: center;
+        overflow: hidden;
       }
     }
   }