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/counselorRanking.vue | 186 +++++++++++++++++++++++++++++++++++----------
1 files changed, 143 insertions(+), 43 deletions(-)
diff --git a/hive-app/pages/manager/counselorRanking.vue b/hive-app/pages/manager/counselorRanking.vue
index 6b572cb..def491e 100644
--- a/hive-app/pages/manager/counselorRanking.vue
+++ b/hive-app/pages/manager/counselorRanking.vue
@@ -1,61 +1,63 @@
<template>
<!-- 顾问排行榜 -->
- <view>
- <!-- #ifndef H5 -->
- <view class="status_bar"></view>
- <!-- #endif -->
- <view class="drop-down gray font-12" v-show="isShow">
- <view class="drop-down-row center" v-for="item in Crunchies">
- <text>{{item}}</text>
- </view>
- </view>
- <view class="header flex justify-around">
- <view class="flex flex-v align-center mt-20">
+ <view class="container" @click="isShowFilter = false">
+ <view class="header flex justify-around" v-if="list.length">
+ <view class="flex flex-1 flex-v align-center mt-20">
<view class="img-box flex align-center justify-center">
- <image class="header-img" src="../../static/images/head-img.png"></image>
+ <image class="header-img" :src="secondPlace.photo?secondPlace.photo:'../../static/images/default-avatar.png'"></image>
<image class="ranking-img" mode="widthFix" src="../../static/images/small-medal2.png"></image>
</view>
- <text class="font-12 white mt-5">妍妍</text>
- <text class="font-16 white mt-5">￥9,020</text>
+ <text class="font-12 white mt-5">{{secondPlace.name}} - {{secondPlace.shopName}}</text>
+ <text class="font-16 white mt-5">￥{{secondPlace.amount | formatNum}}</text>
</view>
- <view class="flex flex-v align-center">
+ <view class="flex flex-1 flex-v align-center">
<view class="img-box flex align-center justify-center">
- <image class="header-img" src="../../static/images/head-img.png"></image>
+ <image class="header-img" :src="firstPlace.photo?firstPlace.photo:'../../static/images/default-avatar.png'"></image>
<image class="ranking-img" mode="widthFix" src="../../static/images/small-medal1.png"></image>
<image class="crown-img" mode="widthFix" src="../../static/images/crown.png"></image>
</view>
- <text class="font-12 white mt-5">倩倩</text>
- <text class="font-16 white mt-5">￥12,020</text>
+ <text class="font-12 white mt-5">{{firstPlace.name}} - {{firstPlace.shopName}}</text>
+ <text class="font-16 white mt-5">￥{{firstPlace.amount | formatNum}}</text>
</view>
- <view class="flex flex-v align-center mt-20">
+ <view class="flex flex-1 flex-v align-center mt-20">
<view class="img-box flex align-center justify-center">
- <image class="header-img" src="../../static/images/head-img.png"></image>
+ <image class="header-img" :src="thirdPlace.photo?thirdPlace.photo:'../../static/images/default-avatar.png'"></image>
<image class="ranking-img" mode="widthFix" src="../../static/images/small-medal3.png"></image>
</view>
- <text class="font-12 white mt-5">雯雯</text>
- <text class="font-16 white mt-5">￥6,020</text>
+ <text class="font-12 white mt-5">{{thirdPlace.name}} - {{thirdPlace.shopName}}</text>
+ <text class="font-16 white mt-5">￥{{thirdPlace.amount | formatNum}}</text>
</view>
</view>
- <view class="content">
+ <view class="content" v-if="selfPlace">
<view class="content-row flex align-center justify-between">
<view class="flex align-center">
- <image class="content-img ml-30" src="../../static/images/head-img.png"></image>
+ <text class="rank blue font-bold">{{selfPlace.rank}}</text>
+ <image class="content-img" :src="selfPlace.photo?selfPlace.photo:'../../static/images/default-avatar.png'"></image>
<view class="ml-20 flex flex-v">
- <text class="font-14">我的</text>
- <text class="font-12 gray mt-5">第32名</text>
+ <text class="font-14">{{selfPlace.name}}</text>
+ <text class="font-12 gray mt-5">{{selfPlace.shopName}}</text>
</view>
</view>
- <text>￥6,020</text>
+ <text>￥{{selfPlace.amount}}</text>
</view>
</view>
- <view class="content">
- <view class="content-row flex align-center justify-between" v-for="item in 4">
+ <view class="content" v-if="otherList.length">
+ <view class="content-row flex align-center justify-between" v-for="(item, index) in otherList">
<view class="flex align-center">
- <text class="font-16">4</text>
- <image class="content-img ml-20" src="../../static/images/head-img.png"></image>
- <text class="font-14 ml-20">冯丽妍</text>
+ <text class="rank">{{index+4}}</text>
+ <image class="content-img" :src="item.photo?item.photo:'../../static/images/default-avatar.png'"></image>
+ <view class="ml-20 flex flex-v">
+ <text class="font-14">{{item.name}}</text>
+ <text class="font-12 gray mt-5">{{item.shopName}}</text>
+ </view>
</view>
- <text>￥6,020</text>
+ <text>￥{{item.amount}}</text>
+ </view>
+ </view>
+ <no-record :isShow="!otherList.length && !selfPlace" txt="暂无业绩排名"></no-record>
+ <view class="drop-down" v-show="isShowFilter">
+ <view class="drop-down-row" v-for="item in timeList">
+ <text @click="timeChange(item)">{{item.label}}</text>
</view>
</view>
</view>
@@ -65,19 +67,110 @@
export default{
data(){
return{
- isShow:false,
- Crunchies:['年榜','月榜','日榜']
+ pageType: 1, //1 顾问业绩排行榜 2美疗师业绩排行榜
+ isShowFilter:false,
+ timeList: [{
+ label: '年榜',
+ value: 3
+ },{
+ label: '月榜',
+ value: 2
+ },{
+ label: '日榜',
+ value: 1
+ }],
+ type: 2,
+ list: [],
+ userId: ''
}
},
- methods:{
- onNavigationBarButtonTap(e) {
- this.isShow=!this.isShow
+ computed:{
+ firstPlace(){
+ if(this.list.length){
+ return this.list[0]
+ }
+ return {}
},
+ secondPlace(){
+ if(this.list.length>1){
+ return this.list[1]
+ }
+ return {}
+ },
+ thirdPlace(){
+ if(this.list.length>2){
+ return this.list[2]
+ }
+ return {}
+ },
+ selfPlace(){
+ let result = '';
+ this.list.forEach((item, index) => {
+ if(item.id == this.userId){
+ Object.assign(item, {rank: index+1});
+ result = item;
+ }
+ });
+ return result
+ },
+ otherList(){
+ return this.list.filter((item, index) => index >= 3)
+ }
+ },
+ onNavigationBarButtonTap(e) {
+ this.isShowFilter=!this.isShowFilter;
+ },
+ onLoad(options) {
+ this.userId = this.$httpUtils.getRoleInfo().id;
+ this.pageType = options.type;
+ uni.setNavigationBarTitle({
+ title: options.name
+ });
+ this.loadList()
+ },
+ methods:{
+ timeChange(item){
+ this.isShowFilter = false;
+ if(this.type == item.value){
+ return;
+ }
+ this.type = item.value;
+ // #ifdef APP-PLUS
+ let webView = this.$mp.page.$getAppWebview();
+ webView.setTitleNViewButtonStyle(1, {
+ text: item.label,
+ });
+ // #endif
+ this.loadList();
+ },
+ loadList(){
+ let url = '';
+ if(this.pageType == 1){
+ url = '/api/ranking/findStaffAchieveRanking'
+ }else{
+ url = '/api/ranking/findBeauticianAchieveRanking'
+ }
+ this.$httpUtils.request(url,{
+ type: this.type
+ },'POST').then((res) => {
+ if(res.status == 200){
+ this.list = res.rows;
+ }else{
+ this.list = [];
+ }
+ })
+ }
}
}
</script>
<style>
+ page{
+ height: 100%;
+ }
+ .container{
+ min-height: 100%;
+ }
.header{
background: #518EFF;
border-bottom-left-radius: 20px;
@@ -127,19 +220,26 @@
height: 48px;
border-radius: 50%;
}
+ .rank{
+ width: 30px;
+ font-size: 15px;
+ }
.drop-down{
width: 56px;
- background: #FFFFFF;
+ background: #F6F6F8;
border-radius: 4px;
padding: 0 5px;
- position: absolute;
- right: 15px;
- top: -10px;
- z-index: 999;
+ position: fixed;
+ right: 10px;
+ 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;
--
Gitblit v1.9.1