Skip to content

S
SuperMan
Commit fa055cb3 authored by 黄奎's avatar 黄奎
Browse files
Options

领队业绩修改

parent 90a26b07
Hide whitespace changes
Inline Side-by-side
Showing with 505 additions and 208 deletions
src/components/LeaderManagement/leaderPerformance.vue
View file @ fa055cb3
<style>
.guidPerformance .backBtn {float: right;margin: 30px 10px 0 0;}
.guidPerformance .listSpan span {display: inline-block;margin: 30px 0 0 10px;font-family: PingFangSC-Semibold, sans-serif;font-size: 14px;color: #333333;}
.guidPerformance .statistical {width: 100%;}
.guidPerformance .dataList li {float: left;width: 100px;height: 40px;text-align: center;color: #666666;background-color: #f1f1f1;
margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointer;}
.guidPerformance .dataList li:first-child{border-top-left-radius: 4px;}
.guidPerformance .Day_active {background-color: #fff !important;color: #000 !important;}
.guidPerformance .Day_active i {display: inline-block;width: 35px;height: 2px;background-color: #e95252;position: absolute;bottom: 0;left: 35px;}
.guidPerformance .chartsMap {width: 100%; height: 500px;background-color: #fff;padding-top: 50px;}
.guidPerformance .mainLeftdiv{margin-top:20px;float:left;}
.guidPerformance .leftTop{width:810px;height:360px;border:1px solid #E6E6E6;background-color:#fff;position:relative;border-radius:4px;margin-bottom:10px;}
.guidPerformance .dataList{position:absolute;top:0;left:0;}
.guidPerformance .leftBottom{width:100%;}
.guidPerformance .bottomList{float:left;width:399px;height:230px;border:1px solid #E6E6E6;border-radius:4px;
margin-right:10px;background-color:#fff;padding:0 20px;}
.guidPerformance .bottomList:last-child{margin-right:0;}
.guidPerformance .rightDiv{width:300px;height:600px;border:1px solid #E6E6E6;border-radius:4px;background-color:#fff;float:left;margin:20px 0 0 10px}
.guidPerformance .ChampionsLeague{width:100%;height:200px;margin-top:40px;}
.guidPerformance .championList{float:left;width:265px;position:relative;text-align: center;}
.guidPerformance .runnderUp{width:118px;height:118px;border-radius:50%;border:3px solid #9A9A9A;margin:80px 0 0 80px;}
.guidPerformance .championName{color:#333;font-size:19px;font-family:PingFangSC-Semibold,sans-serif;margin:20px 0 5px 0; }
.guidPerformance .championMoney{color:#FE9C02;font-size:19px;font-family:PingFangSC-Semibold,sans-serif;}
.guidPerformance .chamPionUp img,.runnderUp img{width:100%;height:100%;border-radius:50%;}
.guidPerformance .yajun{position: absolute;top:50px;left:103px;}
.guidPerformance .piaodai2{position:absolute;left:50px;top:151px;}
.guidPerformance .chamPionUp{width:160px;height:160px;border-radius: 50%;border:3px solid #FFD133;margin:50px 0 0 70px;}
.guidPerformance .guanjun{position: absolute;top:10px;left:100px;}
.guidPerformance .piao1{position: absolute;left: 7px;top: 138px;}
.guidPerformance .guanName{font-size:28px;color:#333;font-family:PingFangSC-Semibold,sans-serif;margin-top:10px;}
.guidPerformance .guanMoney{font-size:28px;color:#E95252;font-family:PingFangSC-Semibold,sans-serif; }
.guidPerformance .piao3{border-color:#D97D03;}
.guidPerformance .btLittle{width:100%;height:57px;border-bottom:1px solid #F6F6F6;position:relative;line-height: 57px;}
.guidPerformance .cmoney{color:#7BC877;}
.guidPerformance ._index{position: absolute;left:-20px;top:16px;width:40px;height:24px;line-height: 24px;font-size:12px;
text-align:center;color:#fff;border-top-right-radius: 12px;border-bottom-right-radius: 12px;background-color:#E95252;}
.guidPerformance .HeadPortrait{width:40px;height:40px;border-radius:50%;float:left;margin:10px 20px 0 0;}
.guidPerformance .HeadPortrait img{width:100%;height:100%;border-radius:50%;}
.guidPerformance .peopleInfo{margin-left:50px;font-size:12px;}
.guidPerformance .peopleMoney{float:right;color:#FE9C02;font-size:14px;font-family:PingFangSC-Semibold,sans-serif;}
.guidPerformance .tweleindex{float:left;margin-left:10px;color:#999999;font-size:14px;font-family:PingFangSC-Semibold,sans-serif;}
.guidPerformance .TweleEx{float:right;color:#333333;font-size:14px;margin-right:20px;font-family:PingFangSC-Semibold,sans-serif;}
.guidPerformance ._btTitle{width:100%;height:66px;border-bottom:1px solid #F6F6F6;line-height: 66px;}
.guidPerformance .TW{margin:14px 20px 0 0;}
.guidPerformance ._btTitle:last-child{border-bottom:0;}
.guidPerformance .backBtn {
float: right;
margin: 30px 10px 0 0;
}
.guidPerformance .listSpan span {
display: inline-block;
margin: 30px 0 0 10px;
font-family: PingFangSC-Semibold, sans-serif;
font-size: 14px;
color: #333333;
}
.guidPerformance .statistical {
width: 100%;
}
.guidPerformance .dataList li {
float: left;
width: 100px;
height: 40px;
text-align: center;
color: #666666;
background-color: #f1f1f1;
margin-top: 0;
line-height: 40px;
font-size: 14px;
position: relative;
cursor: pointer;
}
.guidPerformance .dataList li:first-child {
border-top-left-radius: 4px;
}
.guidPerformance .Day_active {
background-color: #fff !important;
color: #000 !important;
}
.guidPerformance .Day_active i {
display: inline-block;
width: 35px;
height: 2px;
background-color: #e95252;
position: absolute;
bottom: 0;
left: 35px;
}
.guidPerformance .chartsMap {
width: 100%;
height: 500px;
background-color: #fff;
padding-top: 50px;
}
.guidPerformance .mainLeftdiv {
margin-top: 20px;
float: left;
}
.guidPerformance .leftTop {
width: 810px;
height: 360px;
border: 1px solid #E6E6E6;
background-color: #fff;
position: relative;
border-radius: 4px;
margin-bottom: 10px;
}
.guidPerformance .dataList {
position: absolute;
top: 0;
left: 0;
}
.guidPerformance .leftBottom {
width: 100%;
}
.guidPerformance .bottomList {
float: left;
width: 399px;
height: 230px;
border: 1px solid #E6E6E6;
border-radius: 4px;
margin-right: 10px;
background-color: #fff;
padding: 0 20px;
}
.guidPerformance .bottomList:last-child {
margin-right: 0;
}
.guidPerformance .rightDiv {
width: 300px;
height: 600px;
border: 1px solid #E6E6E6;
border-radius: 4px;
background-color: #fff;
float: left;
margin: 20px 0 0 10px
}
.guidPerformance .ChampionsLeague {
width: 100%;
height: 200px;
margin-top: 40px;
}
.guidPerformance .championList {
float: left;
width: 265px;
position: relative;
text-align: center;
}
.guidPerformance .runnderUp {
width: 118px;
height: 118px;
border-radius: 50%;
border: 3px solid #9A9A9A;
margin: 80px 0 0 80px;
}
.guidPerformance .championName {
color: #333;
font-size: 19px;
font-family: PingFangSC-Semibold, sans-serif;
margin: 20px 0 5px 0;
}
.guidPerformance .championMoney {
color: #FE9C02;
font-size: 19px;
font-family: PingFangSC-Semibold, sans-serif;
}
.guidPerformance .chamPionUp img,
.runnderUp img {
width: 100%;
height: 100%;
border-radius: 50%;
}
.guidPerformance .yajun {
position: absolute;
top: 50px;
left: 103px;
}
.guidPerformance .piaodai2 {
position: absolute;
left: 50px;
top: 151px;
}
.guidPerformance .chamPionUp {
width: 160px;
height: 160px;
border-radius: 50%;
border: 3px solid #FFD133;
margin: 50px 0 0 70px;
}
.guidPerformance .guanjun {
position: absolute;
top: 10px;
left: 100px;
}
.guidPerformance .piao1 {
position: absolute;
left: 7px;
top: 138px;
}
.guidPerformance .guanName {
font-size: 28px;
color: #333;
font-family: PingFangSC-Semibold, sans-serif;
margin-top: 10px;
}
.guidPerformance .guanMoney {
font-size: 28px;
color: #E95252;
font-family: PingFangSC-Semibold, sans-serif;
}
.guidPerformance .piao3 {
border-color: #D97D03;
}
.guidPerformance .btLittle {
width: 100%;
height: 57px;
border-bottom: 1px solid #F6F6F6;
position: relative;
line-height: 57px;
}
.guidPerformance .cmoney {
color: #7BC877;
}
.guidPerformance ._index {
position: absolute;
left: -20px;
top: 16px;
width: 40px;
height: 24px;
line-height: 24px;
font-size: 12px;
text-align: center;
color: #fff;
border-top-right-radius: 12px;
border-bottom-right-radius: 12px;
background-color: #E95252;
}
.guidPerformance .HeadPortrait {
width: 40px;
height: 40px;
border-radius: 50%;
float: left;
margin: 10px 20px 0 0;
}
.guidPerformance .HeadPortrait img {
width: 100%;
height: 100%;
border-radius: 50%;
}
.guidPerformance .peopleInfo {
margin-left: 50px;
font-size: 12px;
}
.guidPerformance .peopleMoney {
float: right;
color: #FE9C02;
font-size: 14px;
font-family: PingFangSC-Semibold, sans-serif;
}
.guidPerformance .tweleindex {
float: left;
margin-left: 10px;
color: #999999;
font-size: 14px;
font-family: PingFangSC-Semibold, sans-serif;
}
.guidPerformance .TweleEx {
float: right;
color: #333333;
font-size: 14px;
margin-right: 20px;
font-family: PingFangSC-Semibold, sans-serif;
}
.guidPerformance ._btTitle {
width: 100%;
height: 66px;
border-bottom: 1px solid #F6F6F6;
line-height: 66px;
}
.guidPerformance .TW {
margin: 14px 20px 0 0;
}
.guidPerformance ._btTitle:last-child {
border-bottom: 0;
}
</style>
<template>
<div class='flexOne guidPerformance'>
<div class="listSpan">
<span>{{$t('leader.leader_List')}}</span>
<div class='flexOne guidPerformance'>
<div class="query-box">
<ul>
<li>
<span>
<em>{{$t('system.query_workType')}}</em>
<el-select v-model="msg.QLeaderType" :placeholder="$t('system.ph_choice')">
<el-option :label="$t('system.ph_buxian')" :value='0'></el-option>
<el-option v-for="item in workTypeList" :key="item.Key" :label="item.Key" :value="item.Value">
</el-option>
</el-select>
</span>
</li>
<li>
<span v-if="msg.Type==2">
<em>月份：</em>
<el-date-picker v-model="msg.MonthStr" type="month" placeholder="选择月">
</el-date-picker>
</span>
<span v-else>
<em>年份：</em>
<el-date-picker v-model="msg.MonthStr" type="year" placeholder="选择年">
</el-date-picker>
</span>
</li>
<li>
<span>
<em>类型：</em>
<el-select v-model="msg.Type" :placeholder="$t('system.ph_choice')">
<el-option label="月榜" :value='2'></el-option>
<el-option label="年榜" :value='3'></el-option>
<el-option label="总榜" :value='1'></el-option>
</el-option>
</el-select>
</span>
</li>
<li>
<input type="button" class="hollowFixedBtn" :value="$t('pub.searchBtn')" @click="getStatis()" />
</li>
</ul>
</div>
<div class="statistical clearfix" style="display:block">
<div class="mainLeftdiv">
<div class="leftTop">
<ul class="dataList clearfix">
<li :class="msg.Type==2?'Day_active':''" @click="msg.Type=2,getStatis()">
{{$t('leader.leader_Month')}}
<i></i>
</li>
<li :class="msg.Type==3?'Day_active':''" @click="msg.Type=3,getStatis()">
{{$t('leader.leader_Year')}}
<i></i>
</li>
<li :class="msg.Type==1?'Day_active':''" @click="msg.Type=1,getStatis()">
{{$t('leader.leader_All')}}
<i></i>
</li>
</ul>
<div class="ChampionsLeague clearfix">
<div class="championList" v-for="item in yajun" :key="item.subCode">
<div class="runnderUp">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div>
<img class="yajun" src="../../assets/img/runnerUp.png" />
<img class="piaodai2" src="../../assets/img/piaodai2.png" />
<div class="championName">{{item.Name}}</div>
<div class="championMoney">￥{{item.LeaderExtract}}</div>
</div>
<div class="statistical clearfix" style="display:block">
<div class="mainLeftdiv">
<div class="leftTop">
<ul class="dataList clearfix">
<li :class="monthList==true?'Day_active':''" @click="getStatis(2)">
{{$t('leader.leader_Month')}}
<i></i>
</li>
<li :class="yearList==true?'Day_active':''" @click="getStatis(3)">
{{$t('leader.leader_Year')}}
<i></i>
</li>
<li :class="allList==true?'Day_active':''" @click="getStatis(1)">
{{$t('leader.leader_All')}}
<i></i>
</li>
</ul>
<div class="ChampionsLeague clearfix">
<div class="championList" v-for="item in yajun" :key="item.subCode">
<div class="runnderUp">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/>
</div>
<img class="yajun" src="../../assets/img/runnerUp.png"/>
<img class="piaodai2" src="../../assets/img/piaodai2.png"/>
<div class="championName">{{item.Name}}</div>
<div class="championMoney">￥{{item.LeaderExtract}}</div>
</div>
<div class="championList" v-for="item in Champion" :key="item.subCode">
<div class="chamPionUp">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/>
</div>
<img class="guanjun" src="../../assets/img/chamPion.png"/>
<img class="piao1" src="../../assets/img/piao1.png"/>
<div class="guanName">{{item.Name}}</div>
<div class="guanMoney">￥{{item.LeaderExtract}}</div>
</div>
<div class="championList" v-for="item in jijun" :key="item.subCode">
<div class="runnderUp piao3">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/>
</div>
<img class="yajun" src="../../assets/img/bronze.png"/>
<img class="piaodai2" src="../../assets/img/piao3.png"/>
<div class="championName">{{item.Name}}</div>
<div class="championMoney cmoney">￥{{item.LeaderExtract}}</div>
</div>
</div>
</div>
<div class="leftBottom clearfix">
<div class="bottomList">
<div class="btLittle" v-for="(item,index) in fourToSeven" :key="item.subCode">
<div class="_index">{{4+index}}</div>
<div class="peopleInfo clearfix">
<div class="HeadPortrait">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/>
</div>
<span class="peopleName">{{item.Name}}</span>
<div class="peopleMoney">￥{{item.LeaderExtract}}</div>
</div>
</div>
</div>
<div class="bottomList">
<div class="btLittle" v-for="(item,index) in eightToeleven" :key="item.subCode">
<div class="_index">{{8+index}}</div>
<div class="peopleInfo clearfix">
<div class="HeadPortrait">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/>
</div>
<span class="peopleName">{{item.Name}}</span>
<div class="peopleMoney">￥{{item.LeaderExtract}}</div>
</div>
</div>
</div>
</div>
<div class="championList" v-for="item in Champion" :key="item.subCode">
<div class="chamPionUp">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div>
<img class="guanjun" src="../../assets/img/chamPion.png" />
<img class="piao1" src="../../assets/img/piao1.png" />
<div class="guanName">{{item.Name}}</div>
<div class="guanMoney">￥{{item.LeaderExtract}}</div>
</div>
<div class="championList" v-for="item in jijun" :key="item.subCode">
<div class="runnderUp piao3">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div>
<img class="yajun" src="../../assets/img/bronze.png" />
<img class="piaodai2" src="../../assets/img/piao3.png" />
<div class="championName">{{item.Name}}</div>
<div class="championMoney cmoney">￥{{item.LeaderExtract}}</div>
</div>
</div>
</div>
<div class="leftBottom clearfix">
<div class="bottomList">
<div class="btLittle" v-for="(item,index) in fourToSeven" :key="item.subCode">
<div class="_index">{{4+index}}</div>
<div class="peopleInfo clearfix">
<div class="HeadPortrait">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div>
<div class="rightDiv">
<div class="_btTitle" v-for="(item,index) in twelveToTwenty" :key="item.subCode">
<div class="tweleindex">{{12+index}}</div>
<div class="peopleInfo clearfix">
<div class="HeadPortrait TW">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/>
</div>
<span class="peopleName">{{item.Name}}</span>
<div class="TweleEx">￥{{item.LeaderExtract}}</div>
</div>
</div>
<span class="peopleName">{{item.Name}}</span>
<div class="peopleMoney">￥{{item.LeaderExtract}}</div>
</div>
</div>
</div>
<div class="bottomList">
<div class="btLittle" v-for="(item,index) in eightToeleven" :key="item.subCode">
<div class="_index">{{8+index}}</div>
<div class="peopleInfo clearfix">
<div class="HeadPortrait">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div>
<span class="peopleName">{{item.Name}}</span>
<div class="peopleMoney">￥{{item.LeaderExtract}}</div>
</div>
</div>
<div class="noData" v-show="noData">
{{$t('system.content_noData')}}
</div>
</div>
</div>
<div class="rightDiv">
<div class="_btTitle" v-for="(item,index) in twelveToTwenty" :key="item.subCode">
<div class="tweleindex">{{12+index}}</div>
<div class="peopleInfo clearfix">
<div class="HeadPortrait TW">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div>
<span class="peopleName">{{item.Name}}</span>
<div class="TweleEx">￥{{item.LeaderExtract}}</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
msg: {
pageIndex: 1,
pageSize: 10,
ShoppingID: ""
},
noData: false,
loading: true,
DataList: "",
Champion:[],
yajun:[],
jijun:[],
fourToSeven:'',
eightToeleven:'',
twelveToTwenty:'',
monthList: true,
yearList: false,
allList: false,
defaultImg: 'this.src="' + require('../../assets/img/default_head_img.jpg') + '"',
};
},
methods: {
getStatis(type) {
if (type == 1) {
this.allList = true;
this.monthList = false;
this.yearList = false;
} else if (type == 2) {
this.allList = false;
this.monthList = true;
this.yearList = false;
} else {
this.allList = false;
this.monthList = false;
this.yearList = true;
}
let msg = {
Type: type
export default {
data() {
return {
msg: {
pageIndex: 1,
pageSize: 10,
ShoppingID: "",
Type: 2,
MonthStr: "",
//领队类型
QLeaderType: 0,
},
//工作类型
workTypeList: [],
DataList: "",
//冠军
Champion: [],
//亚军
yajun: [],
//季军
jijun: [],
//4-7名
fourToSeven: '',
//8-11名
eightToeleven: '',
//12-20名
twelveToTwenty: '',
monthList: true,
yearList: false,
allList: false,
defaultImg: 'this.src="' + require('../../assets/img/default_head_img.jpg') + '"',
};
this.Champion = [];
this.yajun=[];
this.jijun=[];
this.fourToSeven = [];
this.eightToeleven=[];
this.twelveToTwenty=[];
this.apipost("LeaderSchedule_get_GetLeaderList",msg,res => {
if (res.data.resultCode == 1) {
if(res.data.data.length>0){
this.Champion =res.data.data.splice(0,1);
this.yajun =res.data.data.splice(0,1);
this.jijun =res.data.data.splice(0,1);
this.fourToSeven = res.data.data.splice(0,4);
this.eightToeleven = res.data.data.splice(0,4);
this.twelveToTwenty = res.data.data.splice(0,9);
},
methods: {
getStatis() {
let msg = {
Type: this.msg.Type,
QLeaderType:this.msg.QLeaderType,
QMonthStr:this.msg.MonthStr
};
this.Champion = [];
this.yajun = [];
this.jijun = [];
this.fourToSeven = [];
this.eightToeleven = [];
this.twelveToTwenty = [];
this.apipost("LeaderSchedule_get_GetLeaderList", msg, res => {
if (res.data.resultCode == 1) {
if (res.data.data.length > 0) {
this.Champion = res.data.data.splice(0, 1);
this.yajun = res.data.data.splice(0, 1);
this.jijun = res.data.data.splice(0, 1);
this.fourToSeven = res.data.data.splice(0, 4);
this.eightToeleven = res.data.data.splice(0, 4);
this.twelveToTwenty = res.data.data.splice(0, 9);
}
}
},
err => {}
);
},
goUrl(path, ID) {
this.$router.push({
path: path,
query: {
"id": ID
}
},
err => {}
);
},
goUrl(path,ID) {
this.$router.push({ path: path,query:{"id":ID}})
})
},
goUrl(path, ID, Type) {
this.$router.push({
path: path,
query: {
"id": ID,
"Type": Type
}
})
},
//获取工作类型(值获取领兼地和导游)
getWorkType() {
this.apipost(
"leader_post_GetType", {},
res => {
if (res.data.resultCode == 1) {
res.data.data.forEach(item => {
this.workTypeList.push(item);
});
}
},
err => {}
);
},
},
goUrl(path,ID,Type) {
this.$router.push({ path: path,query:{"id":ID,"Type":Type}})
mounted() {
this.getWorkType();
this.getStatis();
}
},
mounted() {
this.getStatis(2);
}
};
};
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment