1

package.json

@@ -25,6 +25,7 @@
     "element-ui": "^2.14.1",
     "html2canvas": "^1.3.2",
     "js-md5": "^0.7.3",
+    "jsencrypt": "^3.2.1",
     "lockr": "^0.8.5",
     "lrz": "^4.9.41",
     "mavon-editor": "^2.9.1",

src/App.vue

@@ -20,7 +20,7 @@ export default {
 </script>
 
 <style>
-@import url("//at.alicdn.com/t/font_2077629_70it4rlfqmf.css");
+@import url("//at.alicdn.com/t/font_2077629_qyots58c4km.css");
 @font-face{
     font-family: 'din';
     src: url('./assets/font/DIN-Bold.otf') format('opentype');

src/api/work/index.js

+import request from '../../utils/request'
+/**
+ * 首页 获取业绩提成统计
+ */
+export function GetSellStatistics(data) {
+    return request({
+        url: '/SellAchievements/GetSellCenterAchievementsStatistics',
+        method: 'post',
+        data
+    })
+}
+/**
+ * 首页 获取业绩提成发放分页列表
+ */
+export function GetAchievementsEmpPageList(data) {
+    return request({
+        url: '/SellAchievements/GetAchievementsEmpPageList',
+        method: 'post',
+        data
+    })
+}
+/**
+ * 首页 获取佣金统计接口
+ */
+export function GetCenterCommissionStatistics(data) {
+    return request({
+        url: '/CustomerCommission/GetCenterCommissionStatistics',
+        method: 'post',
+        data
+    })
+}
\ No newline at end of file

src/components/work/dasbord.vue

@@ -12,9 +12,9 @@
               返佣
             </div>
             <div>
-              <el-date-picker v-model="value2" value-format="yyyy-MM" size="small" type="month" style="width:110px"
+              <!-- <el-date-picker v-model="value2" value-format="yyyy-MM" size="small" type="month" style="width:110px"
                 placeholder="选择月" class="q-mr-sm">
-              </el-date-picker>
+              </el-date-picker> -->
               <q-btn class="btn_bg" dense flat icon="more_horiz">
                 <q-menu auto-close>
                   <q-list dense>
@@ -33,13 +33,13 @@
               </q-btn>
             </div>
           </div>
-          <VueApexCharts width="100%" height="90" :options="chartOptions" :series="series" style="margin-top:90px">
-          </VueApexCharts>
+          <!-- <VueApexCharts width="100%" height="90" :options="chartOptions" :series="series" style="margin-top:90px">
+          </VueApexCharts> -->
           <div class="return-commission-Statistics flex wrap content-start">
             <div class="Statistics-block">
               <div class="Statistics-num">
                 <span class="Statistics-pre">¥</span>
-                0.00
+                {{formatInt(ReturnCommissionData.SttlementMoney)}}{{formatDecimal(ReturnCommissionData.SttlementMoney)}}
               </div>
               <div class="Statistics-label">
                 已返佣
@@ -48,28 +48,28 @@
             <div class="Statistics-block">
               <div class="Statistics-num">
                 <span class="Statistics-pre">￥</span>
-                0.00
+                {{formatInt(ReturnCommissionData.UnSettlementMoney)}}{{formatDecimal(ReturnCommissionData.UnSettlementMoney)}}
               </div>
               <div class="Statistics-label">
-                待结算
+                待返佣
               </div>
             </div>
             <div class="Statistics-block">
               <div class="Statistics-num">
                 <span class="Statistics-pre">￥</span>
-                0.00
+                {{formatInt(ReturnCommissionData.CanCashOutMoney)}}{{formatDecimal(ReturnCommissionData.CanCashOutMoney)}}
               </div>
               <div class="Statistics-label">
-                累计返佣
+                待提现
               </div>
             </div>
             <div class="Statistics-block">
               <div class="Statistics-num">
                 <span class="Statistics-pre">￥</span>
-                0.00
+               {{formatInt(ReturnCommissionData.CashOutMoney)}}{{formatDecimal(ReturnCommissionData.CashOutMoney)}}
               </div>
               <div class="Statistics-label">
-                待返佣
+                已提现
               </div>
             </div>
           </div>
@@ -136,6 +136,10 @@
 </template>
 
 <script>
+import {
+    GetCenterCommissionStatistics
+  } from '../../api/work/index'
+  import {formatInt,formatDecimal} from '../../utils/formatPrice'
   import VueApexCharts from "vue-apexcharts";
   import Bonus from './bonus'
   import Commission from './commission'
@@ -274,46 +278,6 @@
             }
           ]
         }],
-        chartOptions6: {
-          chart: {
-            type: "bar",
-            width: 100,
-            height: 35,
-            sparkline: {
-              enabled: true
-            }
-          },
-
-          plotOptions: {
-            bar: {
-              columnWidth: "80%"
-            }
-          },
-          labels: [],
-          xaxis: {
-            crosshairs: {
-              width: 1
-            }
-          },
-          tooltip: {
-            fixed: {
-              enabled: false
-            },
-            x: {
-              show: false
-            },
-            y: {
-              title: {
-                formatter: function (seriesName) {
-                  return "";
-                }
-              }
-            },
-            marker: {
-              show: false
-            }
-          }
-        },
         chartOptions: {
           chart: {
             type: "line",
@@ -342,27 +306,25 @@
             }
           }
         },
-        series4: [4, 3, 2, 20, 7],
-        chartOptions4: {
-          labels: ["A类客户", "B类客户", "C类客户", "D类客户", "E类客户"],
-          chart: {
-            type: "donut",
-            width: 40,
-            height: 40,
-            sparkline: {
-              enabled: true
-            }
-          },
-          stroke: {
-            width: 1
-          },
-          tooltip: {
-            fixed: {
-              enabled: false
-            }
-          }
+        ReturnCommissionData:{
+          UnSettlementMoney:0,//待返佣
+          SttlementMoney:0,//已返佣
+          CashOutMoney:0,//已提现
+          CanCashOutMoney:0,//待提现
         }
       };
+    },
+    mounted() {
+      this.getReturnCommission();
+    },
+    methods:{
+      formatInt,
+      formatDecimal,
+      getReturnCommission(){
+        GetCenterCommissionStatistics().then(res=>{
+          this.ReturnCommissionData=res.Data
+        })
+      }
     }
   };
 

src/utils/formatPrice.js

+//首页用
+export const formatPrice = (price, type = 1) => {
+    if (type == 1) {
+        return parseInt(price)
+    } else if (type == 2) {
+        const findDot = Number(price).toFixed(2).toString().indexOf('.')
+        if (findDot > -1) {
+            return Number(price).toFixed(2).toString().slice(findDot)
+        } else {
+            return '00'
+        }
+    }
+}
+
+export const formatInt = (price) => {
+    if (price < 9999) {
+        return parseInt(price)
+    } else {
+        const s = parseInt(price).toString().slice(0, -4);
+        const e = parseInt(price).toString().slice(-4, -3)
+        return s + '.' + e
+    }
+}
+export const formatDecimal = (price=0) => {
+    if (price < 9999) {
+        const findDot = Number(price).toFixed(2).toString().indexOf('.')
+        if (findDot > -1) {
+            return Number(price).toFixed(2).toString().slice(findDot)
+        } else {
+            return '00'
+        }
+    } else {
+        return 'w'
+    }
+}
\ No newline at end of file