Эх сурвалжийг харах

Merge branch 'dev' of mangpiao/mp-ui-pc into test

lsx 2 жил өмнө
parent
commit
12a244db85

+ 9 - 0
src/api/admin/index.js

@@ -18,6 +18,15 @@ export function getPayAmtList(data) {
   })
 }
 
+// 分粒度统计时间范围内的实时毛利列表
+export function getRealTimeGrossProfit(data) {
+  return request({
+    url: '/api/v1/mp/admin/index/pay/gross',
+    method: 'post',
+    data: data
+  })
+}
+
 // 分粒度统计时间范围内的交易人员数量列表
 export function getPayUserCntList(data) {
   return request({

+ 8 - 0
src/views/business/ticket/detail.vue

@@ -54,6 +54,14 @@
           <span :class="loading ? 'el-icon-loading' : ''"></span>
           {{ info && info.boxNo }}
         </el-form-item>
+        <el-form-item label="实时毛利:">
+          <span :class="loading ? 'el-icon-loading' : ''"></span>
+          {{ info && info.realTimeGrossProfit && $numberFormat(info.realTimeGrossProfit) }}元
+        </el-form-item>
+        <el-form-item label="终极毛利:">
+          <span :class="loading ? 'el-icon-loading' : ''"></span>
+          {{ info && info.finalGrossProfit && $numberFormat(info.finalGrossProfit) }}元
+        </el-form-item>
         <el-form-item label="销售范围:">
           <span :class="loading ? 'el-icon-loading' : ''"></span>
           <span v-if="info.saleChannelType == 1"> {{ info && info.type && info.type.value == 'online'? '首页售卖' : '所有渠道' }} </span>

+ 10 - 0
src/views/business/ticket/index.vue

@@ -179,6 +179,16 @@
           {{ scope.row.type.desc }}
         </template>
       </el-table-column>
+      <el-table-column label="实时毛利" prop="type" min-width="80">
+        <template slot-scope="scope">
+          <div>¥{{ $numberFormat(scope.row.realTimeGrossProfit) }}</div>
+        </template>
+      </el-table-column>
+      <el-table-column label="终极毛利" prop="type" min-width="80">
+        <template slot-scope="scope">
+          <div>¥{{ $numberFormat(scope.row.finalGrossProfit) }}</div>
+        </template>
+      </el-table-column>
       <el-table-column label="采购单价" prop="pkgSalePrice" min-width="100" sortable="custom">
         <template slot-scope="scope">
           <div>¥{{ $numberFormat(scope.row.pkgSalePrice) }}/包</div>

+ 157 - 8
src/views/index.vue

@@ -7,8 +7,8 @@
           <span class="text">数据驾驶舱(今日实时数据)</span>
         </div>
         <div class="brief">
-          <el-row >
-             <el-col :span="6">
+          <el-row type="flex" justify="space-around">
+             <el-col :span="5">
                <div class="brief-item">
                  <div class="info">
                    <div class="m-title">
@@ -43,7 +43,42 @@
                  </div>
                </div>
              </el-col>
-             <el-col :span="6">
+             <el-col :span="5">
+               <div class="brief-item">
+                 <div class="info">
+                   <div class="m-title">
+                    实时毛利
+                   </div>
+                   <div
+                     class="number">
+                     ¥ {{ accDiv((daily.payAmt && daily.payAmt.today || 0), 100)}}
+                   </div>
+                  <div class="brief-item__others">
+                    <div class="text">
+                      昨日同期
+                    </div>
+                    <div class="rate text-one-line">
+                      <span class="rate__num">
+                        <span v-if="(daily.realPayAmt && daily.realPayAmt.yesterday || 0) > 0 ">
+                             <span v-if="((daily.realPayAmt && daily.realPayAmt.today || 0) - daily.realPayAmt.yesterday) > 0" class="el-icon-top rate__icon" style="color: green;" />
+                             <span v-if="((daily.realPayAmt && daily.realPayAmt.today || 0) - daily.realPayAmt.yesterday) < 0" class="el-icon-bottom rate__icon" style="color: red;" />
+                             <span v-if="(daily.realPayAmt && daily.realPayAmt.today || 0) >0">
+                               {{ getRate((daily.realPayAmt && daily.realPayAmt.today || 0) , daily.realPayAmt.yesterday) }}
+                             </span>
+                             <span v-else>100</span>
+                        </span>
+                        <span v-if="(daily.realPayAmt && daily.realPayAmt.yesterday || 0) == 0">
+                             <span v-if="(daily.realPayAmt && daily.realPayAmt.today || 0) > 0" class="el-icon-top rate__icon" style="color: green;" />
+                             {{(daily.realPayAmt && daily.realPayAmt.today || 0) > 0 ? 100 : 0 }}
+                        </span>
+                        %
+                      </span>
+                    </div>
+                  </div>
+                 </div>
+                </div>
+             </el-col>
+             <el-col :span="5">
                <div class="brief-item">
                  <div class="info">
                    <div class="m-title">
@@ -78,7 +113,7 @@
                  </div>
                 </div>
              </el-col>
-             <el-col :span="6">
+             <el-col :span="5">
                <div class="brief-item">
                   <div class="info">
                     <div class="m-title">
@@ -113,7 +148,7 @@
                   </div>
                 </div>
              </el-col>
-             <el-col :span="6">
+             <el-col :span="5">
                <div class="brief-item">
                  <div class="info">
                    <div class="m-title">
@@ -184,6 +219,40 @@
              <div ref="echart1" style="width: 100%;height: 250px;"></div>
           </div>
         </div>
+        <!-- 实时毛利 -->
+        <div class="brief-box">
+          <div class="brief-title">
+            <span class="icon wk wk-briefing" />
+            <span class="text">实时毛利</span>
+            <span style="margin-left: 15px;">
+              <el-date-picker
+                v-model="timeArr1"
+                style="line-height: 30px;width: 250px;"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                value-format="yyyy-MM-dd"
+                :picker-options="pickerOptions"
+                @change="dateSelect1"
+              >
+              </el-date-picker>
+            </span>
+            <el-select
+              v-model="queryParams5.level"
+              placeholder="请选择统计粒度"
+              style="width: 160px;height: 30px;line-height: 30px;float: right;"
+              filterable
+              @change="getRealTimeGrossProfit()">
+               <el-option value="day" label="日粒度">日粒度</el-option>
+               <el-option value="week" label="周粒度">周粒度</el-option>
+               <el-option value="month" label="月粒度">月粒度</el-option>
+            </el-select>
+          </div>
+          <div class="brief">
+             <div ref="echart5" style="width: 100%;height: 250px;"></div>
+          </div>
+        </div>
         <!-- 交易用户 -->
         <div class="brief-box">
           <div class="brief-title">
@@ -272,7 +341,7 @@
   </div>
 </template>
 <script>
-import { getDailyData,getPayAmtList, getPayUserCntList, getTicketBoxTop, getTicketSiteTop} from "@/api/admin/index";
+import { getDailyData,getPayAmtList,getRealTimeGrossProfit, getPayUserCntList, getTicketBoxTop, getTicketSiteTop} from "@/api/admin/index";
 import echarts from "echarts"
 import moment from 'moment'
 import { mapGetters } from 'vuex'
@@ -286,10 +355,12 @@ export default {
       chartObj2:null,
       chartObj3:null,
       chartObj4:null,
+      chartObj5:null,
       axisOption1: null,
       axisOption2: null,
       axisOption3: null,
       axisOption4: null,
+      axisOption5: null,
       queryParams1:{
         days:7,
         level:"day"
@@ -304,6 +375,10 @@ export default {
       queryParams4:{
         days:7
       },
+      queryParams5:{
+        days:7,
+        level:"day"
+      },
       pickerOptions: {
          shortcuts: [{
           text: '最近7天',
@@ -345,7 +420,8 @@ export default {
       timeArr1: [],
       timeArr2: [],
       timeArr3: [],
-      timeArr4: []
+      timeArr4: [],
+      timeArr5: [],//实时毛利
     };
   },
   mounted: function () {
@@ -373,6 +449,7 @@ export default {
       this.timeArr2 = [start,end]
       this.timeArr3 = [start,end]
       this.timeArr4 = [start,end]
+      this.timeArr5 = [start,end]
     },
 
     initChart(){
@@ -412,6 +489,42 @@ export default {
       }
       this.chartObj1.setOption(this.axisOption1, true)
 
+      // 初始化echarts实例
+      this.chartObj5 = echarts.init(this.$refs.echart5);
+      // 绘制图表
+      this.axisOption5 = {
+        title: {
+          text: ''
+        },
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'cross'
+          }
+        },
+        xAxis: {
+          data: []
+        },
+        yAxis: {},
+        series: [
+          {
+            name: '实时毛利',
+            type: 'line',
+            smooth: true,
+            data: [],
+            itemStyle: {
+                normal: {
+                    color: '#F00', //改变折线点的颜色
+                    lineStyle: {
+                        color: '#508FDE' //改变折线颜色
+                    }
+                }
+            }
+          }
+        ]
+      }
+      this.chartObj5.setOption(this.axisOption5, true)
+
       this.chartObj2 = echarts.init(this.$refs.echart2);
       // 绘制图表
       this.axisOption2 = {
@@ -552,6 +665,7 @@ export default {
       this.chartObj4.setOption(this.axisOption4, true)
 
       this.getPayAmtList()
+      this.getRealTimeGrossProfit()
       this.getPayUserCntList()
       this.getTicketBoxTop()
       this.getTicketSiteTop()
@@ -565,7 +679,7 @@ export default {
       }
     },
 
-    // 统计今日实时交易金额、交易用户、盲票销售张数、新增经销商数量
+    // 统计今日实时交易金额、毛利统计、交易用户、盲票销售张数、新增经销商数量
     getDailyData() {
       getDailyData({}).then(res => {
           // console.log("getDailyData == "+JSON.stringify(res));
@@ -599,6 +713,26 @@ export default {
       })
     },
 
+    // 统计实时毛利
+    getRealTimeGrossProfit() {
+      getRealTimeGrossProfit(this.queryParams5).then(res => {
+            // console.log("getPayAmtList == "+JSON.stringify(res));
+          let list = res.data || []
+          const xAxisData = []
+          const yAxisData = []
+          for (let index = 0; index < list.length; index++) {
+            const element = list[index]
+            xAxisData.push(element.x)
+            yAxisData.push(accDiv(element.y, 100))
+          }
+          this.axisOption5.xAxis.data = xAxisData
+          this.axisOption5.series[0].data = yAxisData
+          this.chartObj5.setOption(this.axisOption5, true)
+      }).catch(() => {
+        this.loading = false
+      })
+    },
+
     //统计交易用户数(带粒度)
     getPayUserCntList() {
       getPayUserCntList(this.queryParams2).then(res => {
@@ -674,6 +808,21 @@ export default {
       }
     },
 
+    // 选择时间
+    dateSelect5(e) {
+      if (e) {
+        this.queryParams5.startTime = e[0];
+        this.queryParams5.endTime = e[1];
+        this.queryParams5.days = 0;
+        this.getRealTimeGrossProfit();
+      } else {
+        this.queryParams5.startTime = "";
+        this.queryParams5.endTime = "";
+        this.queryParams5.days = 7;
+        this.getRealTimeGrossProfit();
+      }
+    },
+
     // 选择时间
     dateSelect2(e) {
       if (e) {