fix: a1接口联调

src/api/screen.js

@@ -1,10 +1,27 @@
 import axios from '../assets/js/api.request'
-
+//  http://yapi.wisdomcity.com.cn/project/25/interface/api/26468
 export default {
-  getProjectStatistics (data) {
+  getOnlineWaterStatistics () {
     return axios.request({
-      url: '/log/bi/project/statistics',
-      params: data,
+      url: '/platform/bigData/payRecord/statistics',
+      method: 'get'
+    })
+  },
+  getOnlinePayMonth () {
+    return axios.request({
+      url: '/platform/bigData/payRecord/monthStats',
+      method: 'get'
+    })
+  },
+  getOnlinePayWeek () {
+    return axios.request({
+      url: '/platform/bigData/payRecord/weekStats',
+      method: 'get'
+    })
+  },
+  getOnlinePayDay () {
+    return axios.request({
+      url: '/platform/bigData/payRecord/dayStats',
       method: 'get'
     })
   }

src/views/hui-jia/b1-screen/index.vue

@@ -93,19 +93,19 @@ export default {
       .item-2 {
         flex: 0 0 100%;
         width: 100%;
-        height: calc(35% - $gap-padding);
+        height: calc(38% - $gap-padding);
         // background: #f5f5f5;
       }
       .item-3 {
         // background: green;
         flex: 0 0 calc(50% - $gap-padding);
         width: calc(50% - $gap-padding);
-        height: calc(65% - $gap-padding);
+        height: calc(62% - $gap-padding);
       }
       .item-4 {
         flex: 0 0 calc(50% - $gap-padding);
         width: calc(50% - $gap-padding);
-        height: calc(65% - $gap-padding);
+        height: calc(62% - $gap-padding);
         // background: green;
       }
     }

src/views/hui-jia/components/card/index.vue

@@ -44,15 +44,15 @@ export default {
     .card-header{
       color: rgba(185, 227, 244, 1);
       font-size: halfW(16);
-      padding:  halfH(6) halfW(10);
+      padding:  halfH(4) halfW(10);
       background: var(--title-bg);
       .title{
         display: inline-block;
         vertical-align: middle;
       }
       .icon{
-        width: halfW(24);
-        height: halfH(24);
+        width: halfW(28);
+        height: halfW(28);
         vertical-align: middle;
         margin-right: halfW(8);
       }
@@ -63,7 +63,7 @@ export default {
     .card-body{
       padding: halfH(16) halfW(10);
       box-sizing: border-box;
-      height: calc(100% - halfH(12) - halfH(16) - halfH(10));
+      height: calc(100% - halfH(8) - halfH(16) - halfW(28));
     }
 }
 </style>

src/views/hui-jia/components/online-pay-day/index.vue

@@ -26,6 +26,7 @@
   </template>
 <script>
 import * as echarts from 'echarts'
+import { screen } from '@/api'
 // import { getBigNumberWithUint } from '@/libs/tools.js'
 import Card from '@/views/hui-jia/components/card'
 import icon from './images/icon-title.png'
@@ -47,6 +48,8 @@ export default {
   },
   data () {
     return {
+      xAxisData: ['01:00', '04:00', '07:00', '10:00', '13:00', '16:00', '19:00', '22:00'],
+      seriesData: [0, 0, 0, 0, 0, 0, 0, 0],
       title: '线上缴费日热度',
       subTitle: '近12个月',
       icon: icon
@@ -54,8 +57,16 @@ export default {
   },
   mounted () {
     this.initChart()
+    this.getOnlinePayDay()
   },
   methods: {
+    getOnlinePayDay () {
+      screen.getOnlinePayDay().then(res => {
+        this.xAxisData = res.data.data.list.map(item => item.statData)
+        this.seriesData = res.data.data.list.map(item => item.payAmount)
+        this.initChart()
+      })
+    },
     /**
      * 获取一个和max最接近的能被5整除的无零头整数
      */
@@ -69,8 +80,8 @@ export default {
     },
     initChart () {
       const myChart = echarts.init(this.$refs.onlinePayDayBar)
-      const xAxisData = ['01:00', '04:00', '07:00', '10:00', '13:00', '16:00', '19:00', '22:00']
-      const seriesData = [10, 20, 36, 10, 10, 20, 40, 25]
+      const xAxisData = this.xAxisData
+      const seriesData = this.seriesData
       let all = seriesData.reduce((total, num) => {
         return Number(total) + Number(num)
       })
@@ -133,7 +144,7 @@ export default {
           axisLabel: {
             color: '#fff',
             margin: 15,
-            fontSize: 14,
+            fontSize: 12,
             formatter: function (val, idx) {
               let value = xAxisData[idx]
               return value
@@ -177,9 +188,9 @@ export default {
         yAxis: [
           {
             axisLabel: {
-              color: '#fff',
-              margin: 25,
-              fontSize: 14
+              color: 'rgba(160, 179, 214, 0.7)',
+              fontSize: 11,
+              margin: 12
             },
             axisLine: {
               show: false,

src/views/hui-jia/components/online-pay-week/index.vue

@@ -26,6 +26,7 @@
   </template>
 <script>
 import * as echarts from 'echarts'
+import { screen } from '@/api'
 import Card from '@/views/hui-jia/components/card'
 import icon from './images/icon-title.png'
 
@@ -46,6 +47,8 @@ export default {
   },
   data () {
     return {
+      xAxisData: ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日'],
+      seriesData: [0, 0, 0, 0, 0, 0, 0],
       title: '线上缴费周热度',
       subTitle: '近12个月',
       icon: icon
@@ -53,8 +56,16 @@ export default {
   },
   mounted () {
     this.initChart()
+    this.getOnlinePayWeek()
   },
   methods: {
+    getOnlinePayWeek () {
+      screen.getOnlinePayWeek().then(res => {
+        this.xAxisData = res.data.data.list.map(item => item.statData)
+        this.seriesData = res.data.data.list.map(item => item.payAmount)
+        this.initChart()
+      })
+    },
     /**
      * 获取一个和max最接近的能被5整除的无零头整数
      */
@@ -68,8 +79,8 @@ export default {
     },
     initChart () {
       const myChart = echarts.init(this.$refs.onlinePayWeekBar)
-      const xAxisData = ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
-      const seriesData = [10, 20, 36, 10, 10, 20, 40]
+      const xAxisData = this.xAxisData
+      const seriesData = this.seriesData
       let all = seriesData.reduce((total, num) => {
         return Number(total) + Number(num)
       })
@@ -132,7 +143,7 @@ export default {
           axisLabel: {
             color: '#fff',
             margin: 15,
-            fontSize: 14,
+            fontSize: 12,
             formatter: function (val, idx) {
               let value = xAxisData[idx]
               return value
@@ -176,9 +187,9 @@ export default {
         yAxis: [
           {
             axisLabel: {
-              color: '#fff',
-              margin: 25,
-              fontSize: 14
+              color: 'rgba(160, 179, 214, 0.7)',
+              fontSize: 11,
+              margin: 12
             },
             axisLine: {
               show: false,

src/views/hui-jia/components/online-pay/index.vue

@@ -5,7 +5,7 @@
           <img src="./images/icon-total.png" alt="" class="icon">
         </div>
         <div>
-          总缴费（近12个月）：￥234554
+          总缴费（近12个月）：￥{{ total }}
         </div>
       </div>
       <div class="bar-con">
@@ -16,6 +16,7 @@
 <script>
 import * as echarts from 'echarts'
 // import { getBigNumberWithUint } from '@/libs/tools.js'
+import { screen } from '@/api'
 import Card from '@/views/hui-jia/components/card'
 import icon from './images/icon-title.png'
 
@@ -36,6 +37,9 @@ export default {
   },
   data () {
     return {
+      xAxisData: ['十二月', '一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月'],
+      seriesData: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
+      total: 0,
       title: '线上缴费统计',
       subTitle: '近12个月',
       icon: icon
@@ -43,8 +47,17 @@ export default {
   },
   mounted () {
     this.initChart()
+    this.getOnlinePayMonth()
   },
   methods: {
+    getOnlinePayMonth () {
+      screen.getOnlinePayMonth().then(res => {
+        this.total = res.data.data.allSum
+        this.xAxisData = res.data.data.list.map(item => item.statData)
+        this.seriesData = res.data.data.list.map(item => item.payAmount)
+        this.initChart()
+      })
+    },
     /**
      * 获取一个和max最接近的能被5整除的无零头整数
      */
@@ -58,8 +71,10 @@ export default {
     },
     initChart () {
       const myChart = echarts.init(this.$refs.onlinePayBar)
-      const xAxisData = ['十二月', '一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月']
-      const seriesData = [5, 20, 36, 10, 10, 20, 40, 25, 30, 45, 50, 60]
+      // const xAxisData = ['十二月', '一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月']
+      // const seriesData = [5, 20, 36, 10, 10, 20, 40, 25, 30, 45, 50, 60]
+      const xAxisData = this.xAxisData
+      const seriesData = this.seriesData
       // let max = 0
       // max = seriesData.reduce((max, num) => {
       //   return Math.max(Number(max), Number(num))
@@ -86,7 +101,7 @@ export default {
           axisLabel: {
             color: '#fff',
             margin: 15,
-            fontSize: 14,
+            fontSize: 12,
             formatter: function (val, idx) {
               let value = xAxisData[idx]
               return value
@@ -130,9 +145,9 @@ export default {
         yAxis: [
           {
             axisLabel: {
-              color: '#fff',
-              margin: 25,
-              fontSize: 14
+              color: 'rgba(160, 179, 214, 0.7)',
+              fontSize: 11,
+              margin: 12
             },
             axisLine: {
               show: false,

src/views/hui-jia/components/online-water/index.vue

@@ -6,7 +6,7 @@
       </div>
       <div class="info">
         <p class="title">线上流水总额</p>
-        <p class="num">34656444444.55</p>
+        <p class="num">{{ onlineWaterInfo.allSum || 0 }}</p>
       </div>
     </div>
     <div class="con-center display-flex">
@@ -17,13 +17,13 @@
           </div>
           <div class="info flex-1">
             <p class="title">单笔缴费金额</p>
-            <p class="num">344.55</p>
+            <p class="num">{{ onlineWaterInfo.recentAveAmount || 0 }}</p>
             <p class="desc">(近12个月平均值)</p>
           </div>
         </div>
         <div class="bottom display-flex">
           <span class="title">单笔最大值</span>
-          <span class="num">346544.55</span>
+          <span class="num">{{ onlineWaterInfo.recentMaxAmount || 0 }}</span>
         </div>
 
       </div>
@@ -34,13 +34,13 @@
           </div>
           <div class="info flex-1">
             <p class="title">月在线缴费次数</p>
-            <p class="num">346564</p>
+            <p class="num">{{ onlineWaterInfo.avgMonPayCnt || 0 }}</p>
             <p class="desc">(近12个月平均值)</p>
           </div>
         </div>
         <div class="bottom display-flex">
           <span class="title">单笔最大值</span>
-          <span class="num">346544.55</span>
+          <span class="num">{{ onlineWaterInfo.maxMonthlyCnt || 0 }}</span>
         </div>
       </div>
     </div>
@@ -55,12 +55,13 @@
         </div>
       </div>
       <div class="num">
-        34656444444.55
+        {{ onlineWaterInfo.recentlySum || 0 }}
       </div>
     </div>
   </Card>
 </template>
 <script>
+import { screen } from '@/api'
 import Card from '@/views/hui-jia/components/card'
 import icon from './images/icon-title.png'
 
@@ -78,7 +79,18 @@ export default {
   data () {
     return {
       title: '线上流水数据',
-      icon: icon
+      icon: icon,
+      onlineWaterInfo: {}
+    }
+  },
+  mounted () {
+    this.getOnlineWaterStatistics()
+  },
+  methods: {
+    getOnlineWaterStatistics () {
+      screen.getOnlineWaterStatistics().then(res => {
+        this.onlineWaterInfo = res.data.data
+      })
     }
   }
 }

src/views/hui-jia/components/resident/index.vue

@@ -232,7 +232,6 @@ export default {
     .title{
       font-size: halfH(16);
       color: #82D1F6;
-      text-align: left;
     }
     .value{
       font-size: halfH(20);
@@ -255,8 +254,8 @@ export default {
       border-right: none;
     }
     .img{
-      width: halfW(46);
-      height: halfH(46);
+      width: halfW(40);
+      height: halfW(40);
     }
     .title{
       font-size: halfH(20);

src/views/hui-jia/components/user/index.vue

@@ -74,14 +74,15 @@ export default {
 .user{
   .content{
     width: 100%;
+    height: 100%;
   }
   .user-item{
     text-align: center;
     // line-height: halfH(50);
   }
   .img{
-    width: halfW(40);
-    height: halfH(40);
+    width: halfW(34);
+    height: halfW(34);
     object-fit: cover;
   }
   .title{