From b83ba3cc4687f21d744e9866e10e30e91229e8a4 Mon Sep 17 00:00:00 2001 From: queenwuli <942534046@qq.com> Date: Thu, 28 Jan 2021 16:23:30 +0800 Subject: [PATCH] gx --- hive-app/pages/manager/companyReports.vue | 423 ++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 368 insertions(+), 55 deletions(-) diff --git a/hive-app/pages/manager/companyReports.vue b/hive-app/pages/manager/companyReports.vue index e29512f..e8103e8 100644 --- a/hive-app/pages/manager/companyReports.vue +++ b/hive-app/pages/manager/companyReports.vue @@ -1,72 +1,210 @@ <template> <!-- 公司经营报表 --> - <view> - <view> - <h-tabs - class="tab" - :tabData="tabs" - :config="{ - color: '#abb1cc', - activeColor: '#518EFF', - underLineColor: '#518EFF', - underLineHeight: 6, - fontSize: '28', - underLineWidth: 60, - }" - /> - </view> - <view> - <view class="content-box"> - <view class="content-box-header"> - <text class="font-16">2020年12月24日</text> + <view class="container" @click="hideFilter"> + <h-tabs + class="tab" + :tabData="tabs" + @tabClick="tabChange" + :config="{ + color: '#abb1cc', + activeColor: '#518EFF', + underLineColor: '#518EFF', + underLineHeight: 6, + fontSize: '28', + underLineWidth: 60, + }" + /> + <view v-if="tabIndex==1 || tabIndex==2"> + <view class="list-item" v-for="item in list"> + <view class="list-header"> + <text>{{item.dataTime}}</text> </view> - <view class="font-14"> - <view class="content-box-row flex justify-between"> + <view class="list-content"> + <view class="list-row"> <text>营业收入</text> - <text>¥12,122</text> + <text>¥{{item.totalPay | formatNum}}</text> </view> - <view class="content-box-row flex justify-between"> - <text>现金收入</text> - <text>¥12,122</text> + <view class="list-row"> + <text>现金收款</text> + <text>¥{{item.cashPay | formatNum}}</text> </view> - <view class="content-box-row flex justify-between"> - <text>盈划扣</text> - <text>¥12,122</text> - </view> - <view class="content-box-row flex justify-between"> - <text>本金消耗</text> - <text>¥12,122</text> - </view> - <view class="content-box-row flex justify-between"> - <text>赠送消耗</text> - <text>¥12,122</text> - </view> - <view class="content-box-row flex justify-between"> - <text>现金退款</text> - <text>¥12,122</text> - </view> - <view class="content-box-row flex justify-between"> - <text>卡项回归</text> - <text>¥12,122</text> - </view> - <view class="content-box-row flex justify-between"> + <view class="list-row"> + <text>储值卡收款</text> + <text>¥{{item.cardPay | formatNum}}</text> + </view><view class="list-row"> <text>欠款</text> - <text>¥12,122</text> + <text>¥{{item.arrearsPay | formatNum}}</text> + </view><view class="list-row"> + <text>现金退款</text> + <text>¥{{item.refundCashPay | formatNum}}</text> + </view><view class="list-row"> + <text>卡项退款</text> + <text>¥{{item.refundCardPay | formatNum}}</text> + </view><view class="list-row"> + <text>产品业绩</text> + <text>¥{{item.productAchieve | formatNum}}</text> + </view><view class="list-row"> + <text>卡项业绩</text> + <text>¥{{item.cardAchieve | formatNum}}</text> + </view><view class="list-row"> + <text>还款</text> + <text>¥{{item.refund | formatNum}}</text> + </view><view class="list-row"> + <text>客单数</text> + <text>{{item.perCustomCnt}}</text> + </view><view class="list-row"> + <text>客品数</text> + <text>{{item.customGoodsCnt}}</text> + </view><view class="list-row"> + <text>客单价</text> + <text>¥{{item.perCustomPrice | formatNum}}</text> + </view><view class="list-row"> + <text>成本</text> + <text>¥{{item.cost | formatNum}}</text> + </view> + <view class="list-row"> + <text>毛利</text> + <text>¥{{item.grossProfit | formatNum}}</text> + </view> + <view class="list-row"> + <text>毛利率</text> + <text>{{item.grossProfitRate}}</text> + </view> + <view class="list-row"> + <text>本金消耗</text> + <text>¥{{item.consumePay | formatNum}}</text> + </view> + <view class="list-row"> + <text>赠送消耗</text> + <text>¥{{item.freeConsumePay | formatNum}}</text> + </view> + <view class="list-row"> + <text>人头数</text> + <text>{{item.peopleCnt}}个</text> + </view> + <view class="list-row"> + <text>项目消耗数</text> + <text>{{item.projConsumeCnt}}个</text> + </view> + <view class="list-row"> + <text>服务时长</text> + <text>{{item.timeLength}}分钟</text> </view> </view> + </view> + <view v-if="list.length"> + <uni-load-more :status="loadStatus" color="#a5abaf"></uni-load-more> + </view> + </view> + <view v-else> + <view class="list-item"> + <view class="list-header"> + <text class="font-bold">专项数据</text> + </view> + <view class="list-content-bordered"> + <view class="list-row-bordered" @click="toAnalyse('营业收入', 1)"> + <text>营业收入</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('现金收款', 2)"> + <text>现金收款</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('储值卡收款', 3)"> + <text>储值卡收款</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('欠款', 4)"> + <text>欠款</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('现金退款', 5)"> + <text>现金退款</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('卡项退款', 6)"> + <text>卡项退款</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('产品业绩', 7)"> + <text>产品业绩</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('卡项业绩', 8)"> + <text>卡项业绩</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('还款', 9)"> + <text>还款</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('客单数', 10)"> + <text>客单数</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('客品数', 11)"> + <text>客品数</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('客单价', 12)"> + <text>客单价</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('成本', 13)"> + <text>成本</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('毛利', 14)"> + <text>毛利</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('毛利率', 15)"> + <text>毛利率</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('本金消耗', 16)"> + <text>本金消耗</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('赠送消耗', 17)"> + <text>赠送消耗</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('人头数', 18)"> + <text>人头数</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('项目消耗数', 19)"> + <text>项目消耗数</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + <view class="list-row-bordered" @click="toAnalyse('服务时长', 20)"> + <text>服务时长</text> + <text class="iconfont iconarrow-backimg"></text> + </view> + </view> + </view> + </view> + <view class="drop-down" v-if="isShowFilter"> + <view class="drop-down-row" v-for="item in storeList"> + <text :class="item.id == shopId?'blue':''" @click="storeChange(item)">{{item.shopShortName}}</text> </view> </view> </view> </template> <script> + import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue'; import HTabs from "@/components/liuyuno-tabs/liuyuno-tabs.vue"; export default { components: { - HTabs + HTabs, + uniLoadMore }, data() { return { + type: 1, //1 公司经营报表 2 门店经营报表 + tabIndex: 1, tabs:[ { state: 1, @@ -81,7 +219,130 @@ name: '专项' } ], + isShowFilter:false, + storeList: [], + shopId: '',//门店id + list: [], + loadStatus: 'more', + pageNum: 1 } + }, + onLoad(options) { + if(options.type){ + this.type = options.type; + } + if(this.type==1){ + // #ifdef APP-PLUS + let webView = this.$mp.page.$getAppWebview(); + webView.setTitleNViewButtonStyle(1, { + width: 0, + }); + // #endif + this.loadList(); + }else{ + uni.setNavigationBarTitle({ + title: '门店经营报表' + }); + this.loadShopList();; + } + }, + onPullDownRefresh(){ + this.reloadData(); + let timer = setTimeout(function () { + uni.stopPullDownRefresh(); + clearTimeout(timer); + timer = null; + }, 800); + }, + onReachBottom(){ + this.loadList() + }, + onNavigationBarButtonTap(e){ + if(e.index==0){ + uni.navigateTo({ + url:"./hint" + }) + } + if(e.width && e.index==1){ + this.isShowFilter=!this.isShowFilter + } + }, + onHide() { + this.hideFilter() + }, + methods:{ + reloadData(){ + this.list = []; + this.pageNum = 1; + this.loadStatus = 'more'; + this.loadList(); + }, + tabChange(index){ + let val = index + 1; + if(val == this.tabIndex){ + return + } + this.tabIndex = val; + if(val != 3){ + this.reloadData() + } + }, + hideFilter(){ + this.isShowFilter = false + }, + toAnalyse(title, type){ + uni.navigateTo({ + url: './analyse/index?shopId='+this.shopId+'&title='+title+'&type='+type + }) + }, + // 切换门店 + storeChange(item){ + if(item.id == this.shopId){ + return; + } + this.shopId = item.id; + uni.setNavigationBarTitle({ + title: item.shopShortName + '经营报表' + }); + this.reloadData(); + }, + loadShopList(){ + this.$httpUtils.request('/api/shop/findAllShopList').then((res) => { + if(res.status == 200){ + let result = res.rows; + this.storeList = result; + if(result.length){ + this.shopId = result[0].id; + uni.setNavigationBarTitle({ + title: result[0].shopShortName + '经营报表' + }); + } + this.loadList(); + } + }) + }, + loadList(){ + if(this.loadStatus!=='more'){ + return; + } + this.$httpUtils.request('/api/statistics/findShopBusinessesData', { + "pageNum": this.pageNum, + "pageSize": 10, + "shopId": this.shopId, + "type": this.tabIndex + }, 'POST').then((res) => { + if(res.status == 200){ + let result = res.rows; + if(result.length < 10){ + this.loadStatus = 'noMore'; + } else { + this.pageNum ++ ; + this.loadStatus = 'more'; + } + this.list = this.list.concat(result); + } + }) + } } } </script> @@ -89,6 +350,10 @@ <style> page{ background: #F6F6F8; + height: 100%; + } + .container{ + min-height: 100%; } .tab{ background: #FFFFFF; @@ -97,18 +362,66 @@ border-bottom-right-radius: 4px; box-shadow:0 6px 6px rgba(237,234,244,0.5); } - .content-box{ + .list-item{ + margin: 10px 10px 0; + padding: 0 10px; background: #FFFFFF; border: 1px solid #EDEAF4; border-radius: 4px; - margin: 10px 10px 0; - padding: 10px; } - .content-box-header{ + .list-header{ border-bottom: 1px solid #EDEAF4; - padding: 0 5px 10px; + padding: 12px 5px; + font-size: 14px; } - .content-box-row{ - padding: 10px 5px 0; + .list-content{ + padding: 8px 5px; + font-size: 13px; + color: #333; + } + .list-row{ + display: flex; + justify-content: space-between; + line-height: 30px; + } + .list-row text:nth-last-of-type(1){ + color: #666 + } + .list-content-bordered{ + padding: 0 5px; + font-size: 13px; + } + .list-row-bordered{ + display: flex; + justify-content: space-between; + line-height: 40px; + border-bottom: 1px solid #EDEAF4; + } + .list-row-bordered:nth-last-of-type(1){ + border-bottom: 0; + } + .list-row-bordered text:nth-last-of-type(1){ + color: #a5abaf + } + .drop-down{ + min-width: 56px; + background: #FFFFFF; + border: 1px solid #EDEAF4; + border-radius: 4px; + padding: 0 10px; + position: fixed; + right: 35px; + top: 0; + z-index: 99; + color: #a5abaf; + font-size: 12px; + } + .drop-down-row{ + border-bottom: 1px solid #EDEAF4; + padding: 5px 0; + text-align: center; + } + .drop-down-row:nth-last-child(1){ + border: 0; } </style> -- Gitblit v1.9.1