Skip to content

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

领队业绩修改

parent 90a26b07
Show whitespace changes
Inline Side-by-side
Showing with 505 additions and 208 deletions
src/components/LeaderManagement/leaderPerformance.vue
View file @ fa055cb3
<style> <style>
.guidPerformance .backBtn {float: right;margin: 30px 10px 0 0;} .guidPerformance .backBtn {
.guidPerformance .listSpan span {display: inline-block;margin: 30px 0 0 10px;font-family: PingFangSC-Semibold, sans-serif;font-size: 14px;color: #333333;} float: right;
.guidPerformance .statistical {width: 100%;} margin: 30px 10px 0 0;
.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 .listSpan span {
.guidPerformance .Day_active {background-color: #fff !important;color: #000 !important;} display: inline-block;
.guidPerformance .Day_active i {display: inline-block;width: 35px;height: 2px;background-color: #e95252;position: absolute;bottom: 0;left: 35px;} margin: 30px 0 0 10px;
.guidPerformance .chartsMap {width: 100%; height: 500px;background-color: #fff;padding-top: 50px;} font-family: PingFangSC-Semibold, sans-serif;
.guidPerformance .mainLeftdiv{margin-top:20px;float:left;} font-size: 14px;
.guidPerformance .leftTop{width:810px;height:360px;border:1px solid #E6E6E6;background-color:#fff;position:relative;border-radius:4px;margin-bottom:10px;} color: #333333;
.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; .guidPerformance .statistical {
margin-right:10px;background-color:#fff;padding:0 20px;} width: 100%;
.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 .dataList li {
.guidPerformance .championList{float:left;width:265px;position:relative;text-align: center;} float: left;
.guidPerformance .runnderUp{width:118px;height:118px;border-radius:50%;border:3px solid #9A9A9A;margin:80px 0 0 80px;} width: 100px;
.guidPerformance .championName{color:#333;font-size:19px;font-family:PingFangSC-Semibold,sans-serif;margin:20px 0 5px 0; } height: 40px;
.guidPerformance .championMoney{color:#FE9C02;font-size:19px;font-family:PingFangSC-Semibold,sans-serif;} text-align: center;
.guidPerformance .chamPionUp img,.runnderUp img{width:100%;height:100%;border-radius:50%;} color: #666666;
.guidPerformance .yajun{position: absolute;top:50px;left:103px;} background-color: #f1f1f1;
.guidPerformance .piaodai2{position:absolute;left:50px;top:151px;} margin-top: 0;
.guidPerformance .chamPionUp{width:160px;height:160px;border-radius: 50%;border:3px solid #FFD133;margin:50px 0 0 70px;} line-height: 40px;
.guidPerformance .guanjun{position: absolute;top:10px;left:100px;} font-size: 14px;
.guidPerformance .piao1{position: absolute;left: 7px;top: 138px;} position: relative;
.guidPerformance .guanName{font-size:28px;color:#333;font-family:PingFangSC-Semibold,sans-serif;margin-top:10px;} cursor: pointer;
.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 .dataList li:first-child {
.guidPerformance .cmoney{color:#7BC877;} border-top-left-radius: 4px;
.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 .Day_active {
.guidPerformance .HeadPortrait img{width:100%;height:100%;border-radius:50%;} background-color: #fff !important;
.guidPerformance .peopleInfo{margin-left:50px;font-size:12px;} color: #000 !important;
.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 .Day_active i {
.guidPerformance ._btTitle{width:100%;height:66px;border-bottom:1px solid #F6F6F6;line-height: 66px;} display: inline-block;
.guidPerformance .TW{margin:14px 20px 0 0;} width: 35px;
.guidPerformance ._btTitle:last-child{border-bottom:0;} 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> </style>
<template> <template>
<div class='flexOne guidPerformance'> <div class='flexOne guidPerformance'>
<div class="listSpan"> <div class="query-box">
<span>{{$t('leader.leader_List')}}</span> <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>
<div class="statistical clearfix" style="display:block"> <div class="statistical clearfix" style="display:block">
<div class="mainLeftdiv"> <div class="mainLeftdiv">
<div class="leftTop"> <div class="leftTop">
<ul class="dataList clearfix"> <ul class="dataList clearfix">
<li :class="monthList==true?'Day_active':''" @click="getStatis(2)"> <li :class="msg.Type==2?'Day_active':''" @click="msg.Type=2,getStatis()">
{{$t('leader.leader_Month')}} {{$t('leader.leader_Month')}}
<i></i> <i></i>
</li> </li>
<li :class="yearList==true?'Day_active':''" @click="getStatis(3)"> <li :class="msg.Type==3?'Day_active':''" @click="msg.Type=3,getStatis()">
{{$t('leader.leader_Year')}} {{$t('leader.leader_Year')}}
<i></i> <i></i>
</li> </li>
<li :class="allList==true?'Day_active':''" @click="getStatis(1)"> <li :class="msg.Type==1?'Day_active':''" @click="msg.Type=1,getStatis()">
{{$t('leader.leader_All')}} {{$t('leader.leader_All')}}
<i></i> <i></i>
</li> </li>
...@@ -70,30 +344,30 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe ...@@ -70,30 +344,30 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe
<div class="championList" v-for="item in yajun" :key="item.subCode"> <div class="championList" v-for="item in yajun" :key="item.subCode">
<div class="runnderUp"> <div class="runnderUp">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg"> <img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/> <img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div> </div>
<img class="yajun" src="../../assets/img/runnerUp.png"/> <img class="yajun" src="../../assets/img/runnerUp.png" />
<img class="piaodai2" src="../../assets/img/piaodai2.png"/> <img class="piaodai2" src="../../assets/img/piaodai2.png" />
<div class="championName">{{item.Name}}</div> <div class="championName">{{item.Name}}</div>
<div class="championMoney">￥{{item.LeaderExtract}}</div> <div class="championMoney">￥{{item.LeaderExtract}}</div>
</div> </div>
<div class="championList" v-for="item in Champion" :key="item.subCode"> <div class="championList" v-for="item in Champion" :key="item.subCode">
<div class="chamPionUp"> <div class="chamPionUp">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg"> <img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/> <img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div> </div>
<img class="guanjun" src="../../assets/img/chamPion.png"/> <img class="guanjun" src="../../assets/img/chamPion.png" />
<img class="piao1" src="../../assets/img/piao1.png"/> <img class="piao1" src="../../assets/img/piao1.png" />
<div class="guanName">{{item.Name}}</div> <div class="guanName">{{item.Name}}</div>
<div class="guanMoney">￥{{item.LeaderExtract}}</div> <div class="guanMoney">￥{{item.LeaderExtract}}</div>
</div> </div>
<div class="championList" v-for="item in jijun" :key="item.subCode"> <div class="championList" v-for="item in jijun" :key="item.subCode">
<div class="runnderUp piao3"> <div class="runnderUp piao3">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg"> <img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/> <img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div> </div>
<img class="yajun" src="../../assets/img/bronze.png"/> <img class="yajun" src="../../assets/img/bronze.png" />
<img class="piaodai2" src="../../assets/img/piao3.png"/> <img class="piaodai2" src="../../assets/img/piao3.png" />
<div class="championName">{{item.Name}}</div> <div class="championName">{{item.Name}}</div>
<div class="championMoney cmoney">￥{{item.LeaderExtract}}</div> <div class="championMoney cmoney">￥{{item.LeaderExtract}}</div>
</div> </div>
...@@ -106,7 +380,7 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe ...@@ -106,7 +380,7 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe
<div class="peopleInfo clearfix"> <div class="peopleInfo clearfix">
<div class="HeadPortrait"> <div class="HeadPortrait">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg"> <img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/> <img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div> </div>
<span class="peopleName">{{item.Name}}</span> <span class="peopleName">{{item.Name}}</span>
<div class="peopleMoney">￥{{item.LeaderExtract}}</div> <div class="peopleMoney">￥{{item.LeaderExtract}}</div>
...@@ -119,7 +393,7 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe ...@@ -119,7 +393,7 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe
<div class="peopleInfo clearfix"> <div class="peopleInfo clearfix">
<div class="HeadPortrait"> <div class="HeadPortrait">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg"> <img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/> <img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div> </div>
<span class="peopleName">{{item.Name}}</span> <span class="peopleName">{{item.Name}}</span>
<div class="peopleMoney">￥{{item.LeaderExtract}}</div> <div class="peopleMoney">￥{{item.LeaderExtract}}</div>
...@@ -127,7 +401,6 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe ...@@ -127,7 +401,6 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="rightDiv"> <div class="rightDiv">
<div class="_btTitle" v-for="(item,index) in twelveToTwenty" :key="item.subCode"> <div class="_btTitle" v-for="(item,index) in twelveToTwenty" :key="item.subCode">
...@@ -135,7 +408,7 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe ...@@ -135,7 +408,7 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe
<div class="peopleInfo clearfix"> <div class="peopleInfo clearfix">
<div class="HeadPortrait TW"> <div class="HeadPortrait TW">
<img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg"> <img v-if="!item.EmPhoto" src="../../assets/img/default_head_img.jpg">
<img v-else :src="item.EmPhoto" :onerror='defaultImg'/> <img v-else :src="item.EmPhoto" :onerror='defaultImg' />
</div> </div>
<span class="peopleName">{{item.Name}}</span> <span class="peopleName">{{item.Name}}</span>
<div class="TweleEx">￥{{item.LeaderExtract}}</div> <div class="TweleEx">￥{{item.LeaderExtract}}</div>
...@@ -143,29 +416,37 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe ...@@ -143,29 +416,37 @@ margin-top:0;line-height: 40px;font-size: 14px;position: relative;cursor: pointe
</div> </div>
</div> </div>
</div> </div>
<div class="noData" v-show="noData">
{{$t('system.content_noData')}}
</div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
msg: { msg: {
pageIndex: 1, pageIndex: 1,
pageSize: 10, pageSize: 10,
ShoppingID: "" ShoppingID: "",
Type: 2,
MonthStr: "",
//领队类型
QLeaderType: 0,
}, },
noData: false, //工作类型
loading: true, workTypeList: [],
DataList: "", DataList: "",
Champion:[], //冠军
yajun:[], Champion: [],
jijun:[], //亚军
fourToSeven:'', yajun: [],
eightToeleven:'', //季军
twelveToTwenty:'', jijun: [],
//4-7名
fourToSeven: '',
//8-11名
eightToeleven: '',
//12-20名
twelveToTwenty: '',
monthList: true, monthList: true,
yearList: false, yearList: false,
allList: false, allList: false,
...@@ -173,53 +454,69 @@ export default { ...@@ -173,53 +454,69 @@ export default {
}; };
}, },
methods: { methods: {
getStatis(type) { getStatis() {
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 = { let msg = {
Type: type Type: this.msg.Type,
QLeaderType:this.msg.QLeaderType,
QMonthStr:this.msg.MonthStr
}; };
this.Champion = []; this.Champion = [];
this.yajun=[]; this.yajun = [];
this.jijun=[]; this.jijun = [];
this.fourToSeven = []; this.fourToSeven = [];
this.eightToeleven=[]; this.eightToeleven = [];
this.twelveToTwenty=[]; this.twelveToTwenty = [];
this.apipost("LeaderSchedule_get_GetLeaderList",msg,res => { this.apipost("LeaderSchedule_get_GetLeaderList", msg, res => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
if(res.data.data.length>0){ if (res.data.data.length > 0) {
this.Champion =res.data.data.splice(0,1); this.Champion = res.data.data.splice(0, 1);
this.yajun =res.data.data.splice(0,1); this.yajun = res.data.data.splice(0, 1);
this.jijun =res.data.data.splice(0,1); this.jijun = res.data.data.splice(0, 1);
this.fourToSeven = res.data.data.splice(0,4); this.fourToSeven = res.data.data.splice(0, 4);
this.eightToeleven = res.data.data.splice(0,4); this.eightToeleven = res.data.data.splice(0, 4);
this.twelveToTwenty = res.data.data.splice(0,9); this.twelveToTwenty = res.data.data.splice(0, 9);
} }
} }
}, },
err => {} err => {}
); );
}, },
goUrl(path,ID) { goUrl(path, ID) {
this.$router.push({ path: path,query:{"id":ID}}) this.$router.push({
path: path,
query: {
"id": ID
}
})
},
goUrl(path, ID, Type) {
this.$router.push({
path: path,
query: {
"id": ID,
"Type": Type
}
})
}, },
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 => {}
);
},
},
mounted() { mounted() {
this.getStatis(2); this.getWorkType();
this.getStatis();
} }
}; };
</script> </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