Commit 51b34c9a authored by 罗超's avatar 罗超

新增销售6流程统计

parent 9953eb5c
...@@ -30,6 +30,7 @@ var sUserAgent = navigator.userAgent; ...@@ -30,6 +30,7 @@ var sUserAgent = navigator.userAgent;
} }
import chosenOpenMode from './components/commonPage/chosenOpenMode' import chosenOpenMode from './components/commonPage/chosenOpenMode'
import mycareer from './components/champion/mycareer' import mycareer from './components/champion/mycareer'
import { clearInterval } from 'timers';
export default { export default {
name: 'App', name: 'App',
components: { components: {
...@@ -62,18 +63,52 @@ export default { ...@@ -62,18 +63,52 @@ export default {
dataShow:false, dataShow:false,
haveOpenMode:false, haveOpenMode:false,
settingSys: false, settingSys: false,
timer:null,
useTime:0
// sessionStorage.getItem("mazip") ? sessionStorage.getItem("mazip") : true // sessionStorage.getItem("mazip") ? sessionStorage.getItem("mazip") : true
} }
}, },
methods: { methods: {
inited (viewer){ inited (viewer){
this.$viewer = viewer this.$viewer = viewer
}, },
show (data) { show (data) {
this.$set(this.images,data) this.$set(this.images,data)
this.$viewer.show() this.$viewer.show()
},
listeneruser(){
let that=this
window.onblur=function () {
that.plaus()
if (that.useTime) {
let params={
CreateBy:that.getLocalStorage().EmployeeId,
UsedTime:that.useTime
}
that.apipost("user_set_user_usederplog",params,r=>{
if(r.data.resultCode==1){
this.UsedTime=0
}
})
}
}
window.onfocus=function () {
that.timekeeper()
}
},
timekeeper(){
if(!this.timer){
this.timer=window.setInterval(() => {
this.useTime+=0.1
}, 1000*6);
}
},
plaus() {
if(this.timer){
window.clearInterval(this.timer);
this.timer=null
}
} }
}, },
mounted() { mounted() {
...@@ -81,6 +116,9 @@ export default { ...@@ -81,6 +116,9 @@ export default {
this.$router.push({ this.$router.push({
path: '/login' path: '/login'
}) })
}else{
this.timekeeper()
this.listeneruser()
} }
this.haveOpenMode=!localStorage.openMode this.haveOpenMode=!localStorage.openMode
this.MsgBus.$on('imgpreviewoverflow',content=>{ this.MsgBus.$on('imgpreviewoverflow',content=>{
...@@ -113,6 +151,7 @@ export default { ...@@ -113,6 +151,7 @@ export default {
this.MsgBus.$on('imgprevclear',content=>{ this.MsgBus.$on('imgprevclear',content=>{
this.images=[] this.images=[]
}) })
} }
} }
</script> </script>
......
<template> <template>
<div class="mycareer personTable" style="padding-top:25px;"> <div class="mycareer personTable" style="padding-top:25px;">
<div style="width:1532px;margin:0 auto;"> <div style="max-width:1532px;margin:0 auto;width: calc(100% - 20px);">
<div class="uer-box"> <div class="uer-box">
<el-row style="width:100%"> <el-row style="width:100%">
<el-col :span="5"> <el-col :span="5">
<div class="photo"> <div class="photo">
<img src="http://imgfile.oytour.com/Upload/User/tangping.png" /> <img :src="emp.Photo" v-if="emp.Photo" />
<div class="zezhao"></div> <div class="zezhao"></div>
<div class="bottom">周晓小</div> <div class="bottom">{{emp.EmName}}</div>
</div> </div>
</el-col> </el-col>
<el-col :span="6" class="second"> <el-col :span="6" class="second">
<div class="zhouguan">周冠</div> <div class="zhouguan">周冠</div>
<div class="total"> <div class="total">
<p style="padding-top:23px">总计</p> <p style="padding-top:23px">总计</p>
<p style="color:#1B1B1B;font-size:62px;font-family: 'pingfangR';position:relative;top:-5px">15</p> <p
style="color:#1B1B1B;font-size:62px;font-family: 'pingfangR';position:relative;top:-5px"
>{{emp.Champions}}</p>
</div> </div>
</el-col> </el-col>
<el-col :span="7"> <el-col :span="7">
...@@ -22,96 +24,114 @@ ...@@ -22,96 +24,114 @@
<el-row style="margin-top:30px"> <el-row style="margin-top:30px">
<el-col class="triggerDiv" :span="8"> <el-col class="triggerDiv" :span="8">
<span class="titlebg">年龄</span> <span class="titlebg">年龄</span>
<p class="info">24</p> <p class="info">{{emp.Year}}</p>
</el-col> </el-col>
<el-col class="triggerDiv" :span="8"> <el-col class="triggerDiv" :span="8">
<span class="titlebg">入职时间</span> <span class="titlebg">入职时间</span>
<p class="info">2019-02-20</p> <p class="info">{{emp.Join}}</p>
</el-col> </el-col>
<el-col class="triggerDiv" :span="8"> <el-col class="triggerDiv" :span="8">
<span class="titlebg">部门</span> <span class="titlebg">部门</span>
<p class="info">销售部门</p> <p class="info">{{emp.DeptName}}</p>
</el-col> </el-col>
<el-col class="triggerDiv" :span="8"> <el-col class="triggerDiv" :span="8">
<span class="titlebg">总收客数</span> <span class="titlebg">总收客数</span>
<p class="info">256</p> <p class="info">{{emp.Peoples}}</p>
</el-col> </el-col>
<el-col class="triggerDiv" :span="8"> <el-col class="triggerDiv" :span="8">
<span class="titlebg">总订单数</span> <span class="titlebg">总订单数</span>
<p class="info">256</p> <p class="info">{{emp.Orders}}</p>
</el-col> </el-col>
<el-col class="triggerDiv" :span="8"> <el-col class="triggerDiv" :span="8">
<span class="titlebg">累计销售</span> <span class="titlebg">累计销售</span>
<p class="info">¥1256154</p> <p class="info">{{emp.WeekTotalIncome?emp.WeekTotalIncome.toFixed(2):""}}</p>
</el-col> </el-col>
</el-row> </el-row>
</el-col> </el-col>
<el-col class="second" :span="6"> <el-col class="second" :span="6">
<div class="commonbg baseinfo">综合得分</div> <div class="commonbg baseinfo">综合得分</div>
<div class='score'>86</div> <div class="score">未评分</div>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
<div class="split"></div> <div class="split"></div>
<div class="listDiv"> <div class="listDiv">
<div style="padding-bottom:20px" class="change-box"> <div style="padding-bottom:20px" class="change-box">
<div class="choose"> <div class="choose">
<span @click="ClickChoose1(-1)" class="clickbtn" style="border-right:1px solid #494949"> <span @click="ClickChoose1(-1)" class="clickbtn" style="border-right:1px solid #494949">
<img v-if="index1==0" src="../../assets/img/champion/left.png" alt=""> <img v-if="index1==0" src="../../assets/img/champion/left.png" alt />
<img v-else src="../../assets/img/champion/left1.png" alt=""> <img v-else src="../../assets/img/champion/left1.png" alt />
</span> </span>
<span class="text">{{choose1[index1]}}</span> <span class="text">{{choose1[index1]}}</span>
<span @click="ClickChoose1(1)" class="clickbtn" style="border-left:1px solid #494949"> <span @click="ClickChoose1(1)" class="clickbtn" style="border-left:1px solid #494949">
<img v-if="index1==choose1.length-1" src="../../assets/img/champion/right.png" alt=""> <img v-if="index1==choose1.length-1" src="../../assets/img/champion/right.png" alt />
<img v-else src="../../assets/img/champion/right1.png" alt=""> <img v-else src="../../assets/img/champion/right1.png" alt />
</span> </span>
</div> </div>
<div class="choose" style="float:right"> <div class="choose" style="float:right">
<span @click="ClickChoose2(-1)" class="clickbtn" style="border-right:1px solid #494949"> <span @click="ClickChoose2(-1)" class="clickbtn" style="border-right:1px solid #494949">
<img v-if="index2==0" src="../../assets/img/champion/left.png" alt=""> <img v-if="index2==0" src="../../assets/img/champion/left.png" alt />
<img v-else src="../../assets/img/champion/left1.png" alt=""> <img v-else src="../../assets/img/champion/left1.png" alt />
</span> </span>
<span class="text">{{choose2[index2]}}</span> <span class="text">{{choose2[index2]}}</span>
<span @click="ClickChoose2(1)" class="clickbtn" style="border-left:1px solid #494949"> <span @click="ClickChoose2(1)" class="clickbtn" style="border-left:1px solid #494949">
<img v-if="index2==choose2.length-1" src="../../assets/img/champion/right.png" alt=""> <img v-if="index2==choose2.length-1" src="../../assets/img/champion/right.png" alt />
<img v-else src="../../assets/img/champion/right1.png" alt=""> <img v-else src="../../assets/img/champion/right1.png" alt />
</span> </span>
</div> </div>
</div> </div>
<div class="data-box-before"></div> <div class="data-box-parents">
<!-- <div class="data-box-before"></div> -->
<div class="data-box"> <div class="data-box" v-loading="isLoadingTableData">
<div class="tab-head" ref="mycareerHead"> <div class="tab-head" ref="mycareerHead">
<table> <table>
<thead> <thead>
<tr> <tr>
<th style="min-width:100px;max-width:100px;background:#fff">&nbsp;</th> <th style="min-width:100px;max-width:100px;background:#fff">&nbsp;</th>
<th>新同行增加数份1</th> <th>总分</th>
<th>Im系统同行互动2</th> <th>新增同行</th>
<th>广告系统发送数3</th> <th>IM广告</th>
<th>IM系统同行互动4</th> <th>IM互动</th>
<th>同行浏览数5</th> <th>IM时长</th>
<th>今日外出时间6</th> <th>同行PV</th>
<th>完成计划7</th> <th>外出时长</th>
<th>拜访计划8</th> <th>拜访次数</th>
<th>拜访同行9</th> <th>计划次数</th>
<th>拜访同行10</th> <th>计划同行数</th>
<th>拜访同行11</th> <th>2周内平均拜访</th>
<th>拜访同行12</th> <th>新老同行占比</th>
<th>拜访同行13</th> <th>询价目的地</th>
<th>拜访同行14</th> <th>询价人数</th>
<th>拜访同行15</th> <th>出发日期</th>
<th>拜访同行16</th> <th>老客户询价</th>
<th>下载行程</th>
<th>42助手时长</th>
<th>ERP时长</th>
<th>知识圈时长</th>
<th>7日人数</th>
<th>15日人数</th>
<th>30日人数</th>
<th>30日以外人数</th>
<th>散客人数</th>
<th>单团数量</th>
<th>拜访报名同行</th>
<th>老同行报名</th>
<th>广告制作</th>
<th>广告转发IM</th>
<th>收款次数</th>
<th>处理投诉</th>
<th>拜访老客户</th>
</tr> </tr>
</thead> </thead>
</table> </table>
</div> </div>
<div class="lft-head"> <div class="lft-head">
<table> <table>
<thead> <thead>
<tr> <tr>
<th style="background: #fff;color:#333333">时间</th> <th style="background: #fff;color:#333333">名称</th>
</tr> </tr>
</thead> </thead>
</table> </table>
...@@ -119,8 +139,14 @@ ...@@ -119,8 +139,14 @@
<div class="lft-body" ref="mycareerLeft"> <div class="lft-body" ref="mycareerLeft">
<table> <table>
<tbody> <tbody>
<tr @mouseover="LeftmouseOver(index)" @mouseleave="LeftmouseLeave(index)" :class="leftActiveIndex==index?'leftActive':''" v-for="(item,index) in dateList" :key="index"> <tr
<td class="odd">{{item}}</td> @mouseover="LeftmouseOver(index)"
@mouseleave="LeftmouseLeave(index)"
:class="leftActiveIndex==index?'leftActive':''"
v-for="(item,index) in tableData"
:key="index"
>
<td class="odd">{{item.EmName}}</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
...@@ -128,224 +154,154 @@ ...@@ -128,224 +154,154 @@
<div class="content-body" ref="mycareerContent"> <div class="content-body" ref="mycareerContent">
<table> <table>
<tbody> <tbody>
<tr :class="dataActiveIndex==index?'dataActive':''" @mouseover="DatamouseOver(index)" @mouseleave="DatamouseLeave(index)" v-for="(item,index) in data" :key="index+5000"> <tr
<td>1</td> :class="dataActiveIndex==index?'dataActive':''"
<td>2</td> @mouseover="DatamouseOver(index)"
<td>3</td> @mouseleave="DatamouseLeave(index)"
<td>4</td> v-for="(item,index) in tableData"
<td>5</td> @click="getUserInfo(item.EmployeeId)"
<td>6</td> :key="index"
<td>7</td> >
<td>8</td> <td>未生成</td>
<td>9</td> <td>{{item.AddCustomer}}</td>
<td>10</td> <td>{{item.AdSend}}</td>
<td>11</td> <td>{{item.ImUsedCount}}</td>
<td>12</td> <td>{{item.ImUsedTime}}分钟</td>
<td>13</td> <td>{{item.ClientPv}}</td>
<td>14</td> <td class="even">{{item.OutTime}}</td>
<td>15</td> <td class="even">{{item.FinishPlanCount}}</td>
<td>16</td> <td class="even">{{item.FutureCount}}</td>
<td class="even">{{item.FutureClientCount}}</td>
<td class="even">{{item.AvgFutureSee}}</td>
<td class="even">{{item.FutureSeeOldClient+"/"+item.FutureSeeNewClient}}</td>
<td>{{item.TripSite?item.TripSite.split(',').length:""}}</td>
<td>{{item.PeopleCount}}</td>
<td>{{item.TripMonth?item.TripMonth.split(',').length:""}}</td>
<td>{{item.OldClientEnquiry}}</td>
<td class="even">{{item.DownloadTrip}}</td>
<td class="even">{{(item.UsedApp/60).toFixed(1)}}小时</td>
<td class="even">{{(item.UsedErp/60).toFixed(1)}}小时</td>
<td class="even">{{item.UsedWe}}</td>
<td>{{item.SevenDayOrder}}</td>
<td>{{item.FifteenDayOrder}}</td>
<td>{{item.MonthOrder}}</td>
<td>{{item.OutMonthOrder}}</td>
<td>{{item.SanCount}}</td>
<td>{{item.DanCount}}</td>
<td>{{item.IsSeeClient}}</td>
<td>{{item.OldClientOrders}}</td>
<td class="even">{{item.BuilderAd}}</td>
<td class="even">{{item.AdToApp}}</td>
<td class="even">{{item.IncomeMoney}}</td>
<td class="even">{{item.Tousu}}</td>
<td class="even">{{item.SeeOldClient}}</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div> </div>
</div> </div>
<!-- <el-table
:data="tableData"
style="width: 100%;"
height="200">
<el-table-column
fixed
prop="date"
label="月份"
width="150">
</el-table-column>
<el-table-column
prop="name"
label="新同行增加数份"
width="150">
</el-table-column>
<el-table-column
prop="province"
label="系统同行互动次数"
width="150">
</el-table-column>
<el-table-column
prop="city"
label="广告系统发送数"
width="150">
</el-table-column>
<el-table-column
prop="address"
label="系统同行互动时数"
width="150">
</el-table-column>
<el-table-column
prop="zip"
label="老同行的网站浏览数"
width="150">
</el-table-column>
<el-table-column
prop="zip"
label="今日外出时间"
width="150">
</el-table-column>
<el-table-column
prop="address"
label="系统同行互动时数"
width="150">
</el-table-column>
<el-table-column
prop="zip"
label="老同行的网站浏览数"
width="150">
</el-table-column>
<el-table-column
prop="address"
label="系统同行互动时数"
width="150">
</el-table-column>
<el-table-column
prop="zip"
label="老同行的网站浏览数"
width="150">
</el-table-column>
</el-table> -->
</div> </div>
</div> </div>
</div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data() {
data(){ return {
return{ choose1: ["本周", "本月", "本年", "全部"],
choose1:["本周","本月","当年"], choose2: ["个人", "部门", "公司"],
choose2:["小组","团队","公司"], index1: 0,
index1:0, index2: 0,
index2:0, leftActiveIndex: -1,
leftActiveIndex:-1, dataActiveIndex: -1,
dataActiveIndex:-1, listHeight: 0,
listHeight:0, tableData: [],
dateList:["7月1日","7月2日","7月3日","7月4日","7月5日","7月6日","7月7日","7月8日"], isLoadingTableData:true,
data:[1,1,1,1,1,1,1,1], emp:{}
tableData: [{ };
date: '2016-05-03',
name: '王小虎1',
province: '上海1',
city: '普陀区1',
address: '上海市普1',
zip: 2003331
}, {
date: '2016-05-02',
name: '王小虎2',
province: '上海2',
city: '普陀区2',
address: '上海2',
zip: 200333
}, {
date: '2016-05-04',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普',
zip: 200333
}, {
date: '2016-05-01',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海',
zip: 200333
}, {
date: '2016-05-08',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普',
zip: 200333
}, {
date: '2016-05-06',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市',
zip: 200333
}, {
date: '2016-05-07',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市',
zip: 200333
}]
}
}, },
created(){ created() {
let Height = document.body.clientHeight; let Height = document.body.clientHeight;
this.listHeight=Height-470; this.listHeight = Height - 470;
// console.log("listHeight",this.listHeight) // console.log("listHeight",this.listHeight)
}, },
mounted() { mounted() {
this.$refs.mycareerContent.addEventListener( this.$refs.mycareerContent.addEventListener(
"scroll", "scroll",
this.handleScroll, this.handleScroll,
true true
); );
this.init();
}, },
methods: { methods: {
ClickChoose1(num){ init(){
if(this.index1==0){ this.isLoadingTableData=true
if(num>0){ let msg={
this.index1=this.index1+num; timeRange:this.index1+1,
userRange:this.index2+1
}
this.apipost("user_get_usedsixSatistics",msg,r=>{
this.tableData=r.data.data
this.isLoadingTableData=false
})
},
getUserInfo(empId){
if(empId!=0){
this.apipost("dmc_post_get_userTradeRank",{empId},r=>{
this.emp=r.data.data
})
} }
},
ClickChoose1(num) {
let temp=this.index1;
if (this.index1 == 0) {
if (num > 0) {
this.index1 = this.index1 + num;
} }
else if(this.index1==this.choose1.length-1){ } else if (this.index1 == this.choose1.length - 1) {
if(num<0){ if (num < 0) {
this.index1=this.index1+num; this.index1 = this.index1 + num;
} }
} else {
this.index1 = this.index1 + num;
} }
else{ if(temp!=this.index1)
this.index1=this.index1+num; {
this.init()
} }
}, },
ClickChoose2(num){ ClickChoose2(num) {
if(this.index2==0){ let temp=this.index2;
if(num>0){ if (this.index2 == 0) {
this.index2=this.index2+num; if (num > 0) {
} this.index2 = this.index2 + num;
} }
else if(this.index2==this.choose2.length-1){ } else if (this.index2 == this.choose2.length - 1) {
if(num<0){ if (num < 0) {
this.index2=this.index2+num; this.index2 = this.index2 + num;
} }
} else {
this.index2 = this.index2 + num;
} }
else{ if(temp!=this.index2)
this.index2=this.index2+num; {
this.init()
} }
}, },
LeftmouseOver(index){ LeftmouseOver(index) {
this.dataActiveIndex=index; this.dataActiveIndex = index;
this.leftActiveIndex=index; this.leftActiveIndex = index;
}, },
LeftmouseLeave(index){ LeftmouseLeave(index) {
this.dataActiveIndex=-1; this.dataActiveIndex = -1;
this.leftActiveIndex=-1; this.leftActiveIndex = -1;
}, },
DatamouseOver(index){ DatamouseOver(index) {
this.leftActiveIndex=index; this.leftActiveIndex = index;
}, },
DatamouseLeave(index){ DatamouseLeave(index) {
this.leftActiveIndex=-1; this.leftActiveIndex = -1;
}, },
handleScroll() { handleScroll() {
this.$refs.mycareerLeft.scrollTop = this.$refs.mycareerContent.scrollTop; this.$refs.mycareerLeft.scrollTop = this.$refs.mycareerContent.scrollTop;
...@@ -356,193 +312,162 @@ export default { ...@@ -356,193 +312,162 @@ export default {
</script> </script>
<style scoped> <style scoped>
.personTable
/* .personTable .el-table--border::after, .personTable .el-table--group::after, .personTable .el-table::before{ .el-table--scrollable-y
background-color: transparent; .el-table__body-wrapper::-webkit-scrollbar {
} */
.personTable .el-table--scrollable-y .el-table__body-wrapper::-webkit-scrollbar {
/*滚动条整体样式*/ /*滚动条整体样式*/
width: 5px; width: 5px;
/*高宽分别对应横竖滚动条的尺寸*/ /*高宽分别对应横竖滚动条的尺寸*/
height: 5px; height: 5px;
border:1px solid #fff; border: 1px solid #fff;
border-radius:5px; border-radius: 5px;
background: #fff; background: #fff;
padding: 2px padding: 2px;
} }
/* .personTable .el-table--scrollable-y .el-table__body-wrapper::-webkit-scrollbar-thumb { .personTable .el-table tbody td:first-child {
height:4px; background: rgba(255, 255, 255, 0.5);
width: 4px; }
background:#6A0404; .personTable .el-table thead th:first-child {
border-radius:5px;
} */
/* .personTable .el-table--scrollable-y .el-table__body-wrapper::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 2px #6A0404;
border-radius:5px;
background: transparent;
} */
/*
.personTable .el-table--striped .el-table__body tr.el-table__row--striped.current-row td,
.personTable .el-table__body tr.current-row>td,
.personTable .el-table__body tr.hover-row.current-row>td,
.personTable .el-table__body tr.hover-row.el-table__row--striped.current-row>td,
.personTable .el-table__body tr.hover-row.el-table__row--striped>td, .el-table__body tr.hover-row>td{
background:rgba(193,39,45,1)!important;
color:#fff!important;
}
.personTable .el-table .el-table__fixed .el-table__body .hover-row{
background:rgba(193,39,45,1)!important;
}
.personTable .el-table tbody tr:hover td{
background:rgba(193,39,45,1)!important;
color:#fff!important;
}
.personTable .el-table tbody tr:hover td:first-child{
color:#fff!important;
background:rgba(193,39,45,0.5)
} */
.personTable .el-table tbody td:first-child{
background:rgba(255,255,255,0.5);
}
.personTable .el-table thead th:first-child{
background: #fff; background: #fff;
color:#333333; color: #333333;
} }
.personTable .el-table thead th{ .personTable .el-table thead th {
background: #333333; background: #333333;
color:#B7B7B7; color: #b7b7b7;
padding:5px 0; padding: 5px 0;
} }
.personTable .el-table, .personTable .el-table__expanded-cell{ .personTable .el-table,
.personTable .el-table__expanded-cell {
background: transparent; background: transparent;
} }
.personTable .el-table th, .personTable .el-table tr{ .personTable .el-table th,
.personTable .el-table tr {
background: transparent; background: transparent;
} }
.personTable .el-table td, .personTable .el-table th{ .personTable .el-table td,
.personTable .el-table th {
background: transparent; background: transparent;
padding:6px 0; padding: 6px 0;
} }
.personTable .el-table td,.personTable .el-table th.is-leaf{ .personTable .el-table td,
.personTable .el-table th.is-leaf {
border: none; border: none;
} }
.personTable .leftActive td{ .personTable .leftActive td {
background:#D78884!important; background: #d78884 !important;
color: #fff!important; color: #fff !important;
} }
.personTable .dataActive td{ .personTable .dataActive td {
background:#C1272D!important; background: #c1272d !important;
color: #fff!important; color: #fff !important;
} }
.personTable .text{ .personTable .text {
text-align: center; text-align: center;
width: 120px; width: 120px;
color:#fff; color: #fff;
height:33px; height: 33px;
display: inline-block; display: inline-block;
position: relative; position: relative;
top: -8px; top: -8px;
font-family: "PingFangSC-Fine"; font-family: "PingFangSC-Fine";
} }
.personTable .clickbtn{ .personTable .clickbtn {
display: inline-block; display: inline-block;
width:50px; width: 50px;
height:33px; height: 33px;
text-align: center; text-align: center;
background: #333333; background: #333333;
} }
.personTable .clickbtn img{ .personTable .clickbtn img {
margin-top:4px; margin-top: 4px;
} }
.personTable .change-box .choose{ .personTable .change-box .choose {
height: 31px; height: 31px;
background: #333333; background: #333333;
display: inline-block; display: inline-block;
} }
.personTable .content-body table tr:hover td{ .personTable .content-body table tr:hover td {
background: #C1272D!important; background: #6a0404 !important;
color:#fff!important; color: #fff !important;
} }
.personTable .listDiv{ .personTable .listDiv {
background: rgba(255,255,255,0.2); background: rgba(255, 255, 255, 0.2);
width: 1532px; max-width: 1532px;
width: calc(100% - 20px);
/* position: relative; */ /* position: relative; */
} }
.personTable .score{ .personTable .score {
background: url("../../assets/img/champion/circle.png") no-repeat; background: url("../../assets/img/champion/circle.png") no-repeat;
width: 150px; width: 150px;
height: 150px; height: 150px;
line-height: 150px; line-height: 150px;
color: #1B1B1B; color: #1b1b1b;
text-align: center; text-align: center;
font-size: 60px; /* font-size: 60px; */
font-family: "pingfangR" font-size: 26px;
font-family: "pingfangR";
} }
.personTable .triggerDiv{ .personTable .triggerDiv {
position: relative; position: relative;
margin-bottom: 30px; margin-bottom: 30px;
} }
.personTable .uer-box .info{ .personTable .uer-box .info {
font-size:20px; font-size: 20px;
margin-top:10px; margin-top: 10px;
font-family: "pingfangR" font-family: "pingfangR";
} }
.personTable .uer-box .titlebg{ .personTable .uer-box .titlebg {
background: url("../../assets/img/champion/titlebg.png") no-repeat; background: url("../../assets/img/champion/titlebg.png") no-repeat;
height: 25px; height: 25px;
line-height: 25px; line-height: 25px;
background-size: 100% 100%; background-size: 100% 100%;
padding:0 5px 4px 10px; padding: 0 5px 4px 10px;
color:#656565; color: #656565;
font-family: "PingFangSC-Fine"; font-family: "PingFangSC-Fine";
} }
.personTable .commonbg{ .personTable .commonbg {
width: 113px; width: 113px;
background: url("../../assets/img/champion/commonbg.png"); background: url("../../assets/img/champion/commonbg.png");
height: 42px; height: 42px;
line-height: 42px; line-height: 42px;
color:#fff; color: #fff;
text-align: center; text-align: center;
font-family: "PingFangSC-Fine"; font-family: "PingFangSC-Fine";
} }
.personTable .uer-box .second{ .personTable .uer-box .second {
display: flex; display: flex;
justify-content: center; justify-content: center;
flex-direction: column; flex-direction: column;
align-items: center align-items: center;
} }
.uer-box .second .total{ .uer-box .second .total {
width: 136px; width: 136px;
background: url("../../assets/img/champion/total.png"); background: url("../../assets/img/champion/total.png");
height: 149px; height: 149px;
color:#fff; color: #fff;
text-align: center; text-align: center;
margin-top:34px; margin-top: 34px;
} }
.personTable .uer-box .second .zhouguan{ .personTable .uer-box .second .zhouguan {
width: 77px; width: 77px;
background: url("../../assets/img/champion/zg.png"); background: url("../../assets/img/champion/zg.png");
height: 42px; height: 42px;
line-height: 42px; line-height: 42px;
color:#fff; color: #fff;
font-size: 20px; font-size: 20px;
text-align: center; text-align: center;
font-family: "pingfangR" font-family: "pingfangR";
} }
.personTable { .personTable {
min-height: 100%; min-height: 100%;
width:calc(100% + 40px); width: calc(100% + 40px);
background: url("../../assets/img/champion/listbg.png"); background: url("../../assets/img/champion/listbg.png");
position: relative; position: relative;
user-select: none; user-select: none;
cursor: default; cursor: default;
margin:0 -20px; margin: 0 -20px;
} }
.personTable .title { .personTable .title {
width: 554px; width: 554px;
...@@ -573,7 +498,7 @@ export default { ...@@ -573,7 +498,7 @@ export default {
font-family: pingfangR; font-family: pingfangR;
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
text-align: center; text-align: center;
font-family: "pingfangR" font-family: "pingfangR";
} }
.personTable .title .post-name { .personTable .title .post-name {
width: 156px; width: 156px;
...@@ -591,13 +516,14 @@ export default { ...@@ -591,13 +516,14 @@ export default {
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
} }
.personTable .uer-box { .personTable .uer-box {
padding:17px 30px; padding: 17px 30px;
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
width:1532px; max-width: 1532px;
height:277px; height: 277px;
background:rgba(255,255,255,0.2); background: rgba(255, 255, 255, 0.2);
margin: 0 auto; margin: 0 auto;
width: calc(100% - 20px);
} }
.personTable .uer-box .photo { .personTable .uer-box .photo {
margin-left: 50px; margin-left: 50px;
...@@ -625,7 +551,7 @@ export default { ...@@ -625,7 +551,7 @@ export default {
left: 0; left: 0;
border-radius: 50%; border-radius: 50%;
z-index: 3; z-index: 3;
background-size:100% 100%; background-size: 100% 100%;
} }
.personTable .uer-box .photo .bottom { .personTable .uer-box .photo .bottom {
width: 195px; width: 195px;
...@@ -636,10 +562,10 @@ export default { ...@@ -636,10 +562,10 @@ export default {
position: absolute; position: absolute;
background: url("../../assets/img/champion/userbottom.png"); background: url("../../assets/img/champion/userbottom.png");
z-index: 4; z-index: 4;
color:#000000; color: #000000;
font-size: 22px; font-size: 22px;
text-align: center; text-align: center;
font-family: "pingfangR" font-family: "pingfangR";
} }
.personTable .uer-box .dashboards { .personTable .uer-box .dashboards {
...@@ -661,19 +587,24 @@ export default { ...@@ -661,19 +587,24 @@ export default {
background: url("../../assets/img/champion/fg.png"); background: url("../../assets/img/champion/fg.png");
} }
.personTable .data-box-parents {
position: absolute;
bottom: 15px;
top: 377px;
left: 10px;
right: 10px;
z-index: 2;
}
.personTable .data-box { .personTable .data-box {
overflow: hidden; overflow: hidden;
position: absolute; position: relative;
bottom: 39px; max-width: 1532px;
top: 377px; margin: 0 auto;
left: 167px; /* width: calc(100% - 20px); */
right: 165px; height: 100%;
z-index: 2; z-index: 2;
background: rgba(255,255,255,0.2); background: rgba(255, 255, 255, 0.2);
} }
.personTable .data-box .tab-head { .personTable .data-box .tab-head {
height: 43px; height: 43px;
...@@ -692,7 +623,7 @@ export default { ...@@ -692,7 +623,7 @@ export default {
background: #333333; background: #333333;
} }
.personTable .data-box .lft-body { .personTable .data-box .lft-body {
left: -1px; left: 0px;
top: 43px; top: 43px;
width: 100px; width: 100px;
bottom: 6px; bottom: 6px;
...@@ -700,7 +631,7 @@ export default { ...@@ -700,7 +631,7 @@ export default {
position: absolute; position: absolute;
overflow: hidden; overflow: hidden;
z-index: 3; z-index: 3;
background: rgba(255,255,255,0.2); background: rgba(255, 255, 255, 0.2);
/* height:100%; */ /* height:100%; */
} }
.personTable .data-box .content-body { .personTable .data-box .content-body {
...@@ -732,13 +663,13 @@ export default { ...@@ -732,13 +663,13 @@ export default {
} }
.personTable .data-box table thead th { .personTable .data-box table thead th {
height: 43px; height: 43px;
padding-top: 10px; /* padding-top: 10px; */
box-sizing: border-box; box-sizing: border-box;
text-align: left; text-align: left;
padding-left: 10px; padding-left: 10px;
font-size: 14px; font-size: 14px;
font-family: pingfangR; font-family: pingfangR;
color: #B7B7B7; color: #b7b7b7;
min-width: 100px; min-width: 100px;
} }
...@@ -760,32 +691,35 @@ export default { ...@@ -760,32 +691,35 @@ export default {
color: #333333; color: #333333;
-webkit-background-clip: unset; -webkit-background-clip: unset;
-webkit-text-fill-color: unset; -webkit-text-fill-color: unset;
font-family: "PingFangR" font-family: "PingFangR";
}
.personTable .data-box table tbody td.even{
background: rgba(255, 255, 255, 0.25);
} }
.personTable .data-box .content-body::-webkit-scrollbar { .personTable .data-box .content-body::-webkit-scrollbar {
/*滚动条整体样式*/ /*滚动条整体样式*/
width: 5px; width: 5px;
/*高宽分别对应横竖滚动条的尺寸*/ /*高宽分别对应横竖滚动条的尺寸*/
height: 5px; height: 5px;
border:1px solid rgba(161,154,147,1); border: 1px solid rgba(161, 154, 147, 1);
border-radius:5px; border-radius: 5px;
background: transparent; background: transparent;
padding: 2px padding: 2px;
} }
.personTable .data-box .content-body::-webkit-scrollbar-thumb { .personTable .data-box .content-body::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/ /*滚动条里面小方块*/
height:4px; height: 4px;
width: 4px; width: 4px;
background:#6A0404; background: #6a0404;
border-radius:5px; border-radius: 5px;
} }
.personTable .data-box .content-body::-webkit-scrollbar-track { .personTable .data-box .content-body::-webkit-scrollbar-track {
/*滚动条里面轨道*/ /*滚动条里面轨道*/
-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2); -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
border-radius:5px; border-radius: 5px;
background: transparent; background: transparent;
} }
.personTable .data-box .content-body::-webkit-scrollbar-corner{ .personTable .data-box .content-body::-webkit-scrollbar-corner {
color: transparent; color: transparent;
} }
</style> </style>
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