mirror of
http://112.124.100.131/GFRS/ebiz-h5.git
synced 2025-12-09 04:06:44 +08:00
397 lines
13 KiB
Vue
397 lines
13 KiB
Vue
<template>
|
||
<div>
|
||
<div
|
||
class="border-gb mt20 header mh-auto van-cell:not(:last-child)::after h50 flex align-items-c"
|
||
>
|
||
<van-button
|
||
round
|
||
@click="goDetail(order)"
|
||
size="small"
|
||
class="ml15"
|
||
type="danger"
|
||
v-no-more-click="1000"
|
||
>当月</van-button>
|
||
<div @click="timePopup" class="fs12 red ml15">
|
||
{{titleTime}}
|
||
<img src="@/assets/images/u79.png" alt class="absolute mt2 ml5" />
|
||
</div>
|
||
<van-popup v-model="dateShow" position="bottom">
|
||
<van-datetime-picker
|
||
v-model="currentDate"
|
||
type="year-month"
|
||
title="选择年月日"
|
||
:min-date="minDate"
|
||
:max-date="maxDate"
|
||
@cancel="handleCancel"
|
||
@confirm="handleEndDateConfirm"
|
||
/>
|
||
</van-popup>
|
||
</div>
|
||
<div class="c-gray-base fs13 ml25 mt10" v-if="mask=='1'">
|
||
所在机构：
|
||
<span v-if="buName!==undefined">{{buName}}></span>
|
||
<span class="red">{{Name}}</span>
|
||
</div>
|
||
<div class="flex align-items-c h86 content1 bg-white mt10">
|
||
<div
|
||
class="w40 h60 ml15 text-center relative header-box"
|
||
v-for="(item, index) in headerList"
|
||
:key="index"
|
||
>
|
||
<div @click="(InfoDetails(index))" class="w40 h60">
|
||
<div style="width:40px; height:42px;border-radius: 20px; margin-top: 2px;margin-left: 2px;" v-if="item.agentHeadUrl!==null">
|
||
<img style="width:40px; height:40px;border-radius: 20px" :src="item.agentHeadUrl | urlFormat" alt />
|
||
</div>
|
||
<div class="h40 w40" v-else>
|
||
<img class="h40 w40" src="@/assets/images/u188.png" alt />
|
||
</div>
|
||
<div class="absolute fs12 white captain" v-if="String(item.agentName)==String(Name).split('组')[0] ||String(item.agentName)==String(unitName).split('组')[0]">团队长</div>
|
||
<div :class="[item.isShowImg?'active':'']"></div>
|
||
<div class="fs13">{{item.agentName}}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="mt20">
|
||
<div class="h50 bg-white content mh-auto fs13 fw500">
|
||
<div class="pl10 pr10 pt15 flex justify-content-s align-items-c">
|
||
<div>个人承保期交（元）</div>
|
||
<div class="red">{{cbbb}}</div>
|
||
</div>
|
||
</div>
|
||
<div class="h50 bg-white content mh-auto fs13 fw500 mt5">
|
||
<div class="pl10 pr10 pt15 flex justify-content-s align-items-c">
|
||
<div>寿险承保件数</div>
|
||
<div class="red">{{cbjs}}</div>
|
||
</div>
|
||
</div>
|
||
<!-- <div class="h50 bg-white content mh-auto fs13 fw500 mt5">
|
||
<div class="pl10 pr10 pt15 flex justify-content-s align-items-c">
|
||
<div>承保FYC（元）</div>
|
||
<div class="red">{{cfyc}}</div>
|
||
</div>
|
||
</div>-->
|
||
<!-- <div class="h50 bg-white content mh-auto fs13 fw500 mt5">
|
||
<div class="pl10 pr10 pt15 flex justify-content-s align-items-c">
|
||
<div>综合开拓承保保费（元）</div>
|
||
<div class="red">{{zcbf}}</div>
|
||
</div>
|
||
</div>-->
|
||
<div class="h50 bg-white content mh-auto fs13 fw500 mt5" v-if="isShow">
|
||
<div class="pl10 pr10 pt15 flex justify-content-s align-items-c">
|
||
<div>本月预收期交（元）</div>
|
||
<div class="red">{{ysbb}}</div>
|
||
</div>
|
||
</div>
|
||
<div class="h50 bg-white content mh-auto fs13 fw500 mt5" v-if="isShow">
|
||
<div class="pl10 pr10 pt15 flex justify-content-s align-items-c">
|
||
<div>本月预收件数</div>
|
||
<div class="red">{{ysjs}}</div>
|
||
</div>
|
||
</div>
|
||
<!-- <div class="h50 bg-white content mh-auto fs13 fw500 mt5" v-if="isShow">
|
||
<div class="pl10 pr10 pt15 flex justify-content-s align-items-c">
|
||
<div>本月预收FYC（元）</div>
|
||
<div class="red">{{yfyc}}</div>
|
||
</div>
|
||
</div>-->
|
||
</div>
|
||
</div>
|
||
</template>
|
||
<script>
|
||
import { getBaseAgentInfo, getPerformanceHeader, getPerformanceDetail, getHeader,getCode } from '@/api/ebiz/performance/performance'
|
||
import utils from '@/assets/js/utils/date-utils'
|
||
import { Popup, DatetimePicker } from 'vant'
|
||
import config from '@/config'
|
||
export default {
|
||
name: 'performance',
|
||
components: {
|
||
[Popup.name]: Popup,
|
||
[DatetimePicker.name]: DatetimePicker,
|
||
},
|
||
data() {
|
||
return {
|
||
currentDate: new Date(),
|
||
dateShow: false,
|
||
minDate: new Date(2020, 0, 1),
|
||
maxDate: new Date(),
|
||
titleTime: '',
|
||
date1: {
|
||
date: '2020-07-01',
|
||
},
|
||
agentGrade: '',
|
||
isShow: true,
|
||
obj: {},
|
||
agentCode: '',
|
||
cbbb: '',
|
||
cbjs: '',
|
||
ysjs: '',
|
||
cfyc: '0.00',
|
||
zcbf: '0.00',
|
||
ysbb: '0.00',
|
||
yfyc: '0.00',
|
||
timeCode: '',
|
||
mask: '',
|
||
headerList: [],
|
||
unitName: '',
|
||
Name: '',
|
||
code: '',
|
||
isShowImg: true,
|
||
buName:''
|
||
}
|
||
},
|
||
created() {
|
||
// console.log('=======' + this.$route.params.parmas)
|
||
console.log(JSON.parse(window.localStorage.getItem('parmas2')))
|
||
if (window.localStorage.getItem('parmas') !== null) {
|
||
this.mask = JSON.parse(window.localStorage.getItem('parmas')).mask
|
||
;(this.titleTime = JSON.parse(window.localStorage.getItem('parmas')).date.slice(0, 7)),
|
||
(this.dateTime = JSON.parse(window.localStorage.getItem('parmas')).date),
|
||
(this.unitName = JSON.parse(window.localStorage.getItem('parmas')).unitName),
|
||
(this.Name = JSON.parse(window.localStorage.getItem('parmas')).Name),
|
||
(this.code = JSON.parse(window.localStorage.getItem('parmas')).code),
|
||
this.buName=JSON.parse(window.localStorage.getItem('parmas')).buName
|
||
}else if (window.localStorage.getItem('parmas2') !== null) {
|
||
this.mask = JSON.parse(window.localStorage.getItem('parmas2')).mask
|
||
;(this.titleTime = JSON.parse(window.localStorage.getItem('parmas2')).date.slice(0, 7)),
|
||
(this.dateTime = JSON.parse(window.localStorage.getItem('parmas2')).date),
|
||
(this.unitName = JSON.parse(window.localStorage.getItem('parmas2')).unitName),
|
||
(this.Name = JSON.parse(window.localStorage.getItem('parmas2')).Name),
|
||
(this.code = JSON.parse(window.localStorage.getItem('parmas2')).code),
|
||
this.buName=JSON.parse(window.localStorage.getItem('parmas2')).buName,
|
||
this.agentCode=JSON.parse(window.localStorage.getItem('parmas2')).agentCode
|
||
}else if (window.localStorage.getItem('parmas1') !== null) {
|
||
this.mask = JSON.parse(window.localStorage.getItem('parmas1')).mask
|
||
;(this.titleTime = JSON.parse(window.localStorage.getItem('parmas1')).date.slice(0, 7)),
|
||
(this.dateTime = JSON.parse(window.localStorage.getItem('parmas1')).date),
|
||
(this.unitName = JSON.parse(window.localStorage.getItem('parmas1')).unitName),
|
||
(this.code = JSON.parse(window.localStorage.getItem('parmas1')).code),
|
||
this.buName=JSON.parse(window.localStorage.getItem('parmas1')).buName
|
||
// window.localStorage.removeItem('parmas1');
|
||
}
|
||
|
||
// this.performanceData()
|
||
if (JSON.parse(window.localStorage.getItem('obj')).agentGrade.slice(0, 2) == 'A2') {
|
||
this.getPerformanceHeader1()
|
||
}else{
|
||
this.getCode1()
|
||
}
|
||
if(this.mask=="1"){
|
||
// this.getPerformanceDetailC()
|
||
}
|
||
this.formatDate1()
|
||
this.getBaseAgentInfo1()
|
||
if (this.code !== '') {
|
||
// this.getHeader1()
|
||
}
|
||
},
|
||
mounted() {
|
||
|
||
},
|
||
methods: {
|
||
timePopup() {
|
||
this.dateShow = true
|
||
},
|
||
handleCancel() {
|
||
this.dateShow = false
|
||
},
|
||
//开始时间
|
||
handleEndDateConfirm(e) {
|
||
this.dateShow = false
|
||
this.titleTime = utils.formatDate(e, 'yyyy-MM')
|
||
this.timeCode = utils.formatDate(e, 'yyyy-MM-dd')
|
||
this.obj.date = this.timeCode
|
||
this.getPerformanceDetailC()
|
||
if (String(this.titleTime) === String(utils.formatDate(new Date(), 'yyyy-MM'))) {
|
||
this.isShow = true
|
||
} else {
|
||
this.isShow = false
|
||
}
|
||
},
|
||
formatDate1() {
|
||
// console.log(utils.formatDate("2020-1-1"))
|
||
if (window.localStorage.getItem('parmas2') !== null) {
|
||
this.titleTime = JSON.parse(window.localStorage.getItem('parmas2')).date.slice(0, 7),
|
||
this.timeCode = JSON.parse(window.localStorage.getItem('parmas2')).date
|
||
}
|
||
if(window.localStorage.getItem('parmas1') !== null){
|
||
this.titleTime = JSON.parse(window.localStorage.getItem('parmas1')).date.slice(0, 7),
|
||
this.timeCode = JSON.parse(window.localStorage.getItem('parmas1')).date
|
||
}
|
||
this.obj.date = this.timeCode
|
||
// console.log(this.titleTime)
|
||
},
|
||
//获取代理人关系
|
||
getBaseAgentInfo1() {
|
||
let date = {}
|
||
getBaseAgentInfo(date).then((res) => {
|
||
// console.log(res)
|
||
if (res.result == 0) {
|
||
;(this.agentGrade = res.agentGrade),
|
||
(this.unitName = res.unitName),
|
||
(this.saleArea = res.saleArea)
|
||
if(window.localStorage.getItem('parmas2') == null){
|
||
(this.agentCode = res.jobNo)
|
||
}else{
|
||
this.agentCode=JSON.parse(window.localStorage.getItem('parmas2')).agentCode
|
||
}
|
||
|
||
(this.obj.agentGrade = this.agentGrade),
|
||
(this.obj.agentCode = this.agentCode),
|
||
(this.branchCode = res.branchCode),
|
||
(this.deptCode = res.deptCode),
|
||
(this.areaCode = res.areaCode)
|
||
if (this.agentGrade.slice(0, 2) == 'A2') {
|
||
;(this.obj.unitName = this.unitName), (this.obj.code = this.branchCode)
|
||
} else if (this.agentGrade.slice(0, 2) == 'A3') {
|
||
;(this.obj.unitName = this.saleArea), (this.obj.code = this.deptCode)
|
||
} else if (this.agentGrade.slice(0, 2) == 'A4') {
|
||
}
|
||
if (this.agentGrade == 'A101') {
|
||
this.mask = 1
|
||
}
|
||
this.getPerformanceDetailC()
|
||
}
|
||
})
|
||
},
|
||
//获取代理人下级头像
|
||
getPerformanceHeader1() {
|
||
let date = {}
|
||
getPerformanceHeader(date).then((res) => {
|
||
// console.log( res)
|
||
if (res.result == 0) {
|
||
for (let i = 0; i < res.content.length; i++) {
|
||
res.content[i].isShowImg = true
|
||
// res.content[i].agentHeadUrl=encodeURIComponent(config.imgDomain + '/returnDirectStream?imgPath=' +res.content[i].imgUrl)
|
||
}
|
||
this.headerList = res.content
|
||
console.log(this.headerList)
|
||
}
|
||
})
|
||
},
|
||
getHeader1() {
|
||
console.log(this.code)
|
||
let code = {
|
||
agentgroup: this.code,
|
||
}
|
||
getHeader(code).then((res) => {
|
||
console.log(res)
|
||
if (res.result == 0) {
|
||
for (let i = 0; i < res.content.length; i++) {
|
||
res.content[i].isShowImg = true
|
||
res.content[0].isShowImg = false
|
||
}
|
||
this.headerList = res.content
|
||
}
|
||
})
|
||
},
|
||
//获取代理人相关信息
|
||
getPerformanceDetailC() {
|
||
// console.log(this.agentCode)
|
||
let code = {
|
||
date: this.timeCode,
|
||
agentCode: this.agentCode,
|
||
}
|
||
getPerformanceDetail(code).then((res) => {
|
||
console.log(res)
|
||
if (res.result == 0) {
|
||
;(this.cbbb = res.content.list[0].cbbb),
|
||
(this.cbjs = res.content.list[0].cbjs),
|
||
(this.ysjs = res.content.list[0].ysjs),
|
||
(this.ysbb = res.content.list[0].ysbb),(this.agentCode = res.content.list[0].code)
|
||
}
|
||
})
|
||
},
|
||
getCode1(){
|
||
console.log("=========="+this.Name)
|
||
let code={
|
||
groupCode:this.Name
|
||
}
|
||
getCode(code).then(res=>{
|
||
console.log(res)
|
||
if (res.result == 0) {
|
||
this.code=res.content.groupCode
|
||
}
|
||
console.log(this.code)
|
||
this.getHeader1()
|
||
})
|
||
},
|
||
//点击头像
|
||
InfoDetails(item) {
|
||
console.log(item)
|
||
for (let i = 0; i < this.headerList.length; i++) {
|
||
this.headerList[i].isShowImg = true
|
||
}
|
||
this.headerList[item].isShowImg = false
|
||
|
||
let code = {
|
||
date: this.timeCode,
|
||
agentCode: this.headerList[item].agentCode,
|
||
}
|
||
getPerformanceDetail(code).then((res) => {
|
||
console.log(res)
|
||
if (res.result == 0) {
|
||
;(this.cbbb = res.content.list[0].cbbb),
|
||
(this.cbjs = res.content.list[0].cbjs),
|
||
(this.ysjs = res.content.list[0].ysjs),
|
||
(this.ysbb = res.content.list[0].ysbb),
|
||
(this.agentCode = res.content.list[0].code)
|
||
}
|
||
})
|
||
},
|
||
},
|
||
filters: {
|
||
urlFormat(url) {
|
||
return (config.imgDomain + `/returnImageStream?a=b.jpg&imgPath=${url}`).replace(/\+/g, '%2B')
|
||
}
|
||
},
|
||
destroyed: function () {
|
||
console.log("我已经离开了！");
|
||
let parmas1={}
|
||
parmas1.date=this.dateTime
|
||
parmas1.unitName=this.unitName
|
||
parmas1.Name=this.Name
|
||
parmas1.code=this.code
|
||
if(this.mask=="1"){
|
||
// localStorage.parmas1 = JSON.stringify(parmas1)
|
||
}else{
|
||
window.localStorage.removeItem('parmas1');
|
||
}
|
||
|
||
window.localStorage.removeItem('parmas2');
|
||
},
|
||
}
|
||
</script>
|
||
<style scoped>
|
||
.header {
|
||
width: 92%;
|
||
}
|
||
.content {
|
||
width: 86%;
|
||
}
|
||
.footer {
|
||
width: 100%;
|
||
line-height: 40px;
|
||
}
|
||
.content1 {
|
||
width: 100%;
|
||
overflow-x: scroll;
|
||
}
|
||
.active {
|
||
width: 40px !important;
|
||
height: 40px !important;
|
||
z-index: 100;
|
||
background: #ccc;
|
||
opacity: 0.5;
|
||
top: 0px;
|
||
border-radius: 20px;
|
||
position: absolute;
|
||
}
|
||
.captain{
|
||
z-index: 2000;
|
||
text-align: center;
|
||
width:40px;
|
||
margin-top:-14px;
|
||
margin-left:2px;
|
||
background:red;
|
||
}
|
||
</style> |