Commit af254178 authored by xishifeng's avatar xishifeng

业绩暂存2

parent cf1e53a7
......@@ -49,13 +49,27 @@ export default {
return str;
}
},
transCn(num) {
    let e = String(num).split(''),
a = [];
e.forEach((v,i)=>{
a[i] = ['零','一','二','三','四','五','六','七','八','九'][e[i]];
});
    return a.join('');
achieveInitTime(callback) {
//获取缓存里的时间
let _this = this;
let _session_startdate = sessionStorage.getItem('achieve_search_start_date'),
_session_enddate = sessionStorage.getItem('achieve_search_end_date');
if(_session_startdate && _session_enddate) {
//当缓存里有时间时,用缓存里的时间
callback(_session_startdate, _session_enddate);
} else {
//获取当前时间
let _currentDate = new Date();
_currentDate.setDate(_currentDate.getDate() - 1);
let _year = _currentDate.getFullYear(),
_moon = _this.dealDateNum(_currentDate.getMonth() + 1),
_end_day_temp = _currentDate.getDate(),
_end_day = _this.dealDateNum(_end_day_temp),
_start_day = _end_day_temp < 7 ? '01' : _this.dealDateNum(_end_day_temp - 6),
_enddate = _year + '-' + _moon + '-' + _end_day,
_startdate = _year + '-' + _moon + '-' + _start_day;
callback(_startdate, _enddate);
}
},
jineComma(s, n) {
//金额以32, 348, 000的形式显示
......@@ -86,10 +100,10 @@ export default {
dealJineNum(num) {
//处理金额类的数字
if(isFinite(num)) {
if(parseInt(num) == num || num.toString().split('.')[1].length < 4) {
if(parseInt(num) == num || num.toString().split('.')[1].length < 3) {
return num;
} else {
return Number((num).toFixed(3));
return Number((num).toFixed(2));
}
} else {
return 0;
......
......@@ -166,7 +166,7 @@
let _this = this;
_this.userId = localStorage.getItem('userid');
_this.token = localStorage.getItem('token');
_this.initTime(function(start_date, end_date) {
_this.common.achieveInitTime(function(start_date, end_date) {
_this.startDate = start_date;
_this.endDate = end_date;
_this.ajaxMainNum(function() {
......@@ -298,28 +298,6 @@
}];
} else {};
},
initTime(callback) {
//获取缓存里的时间
let _this = this;
let _session_startdate = sessionStorage.getItem('achieve_search_start_date'),
_session_enddate = sessionStorage.getItem('achieve_search_end_date');
if(_session_startdate && _session_enddate) {
//当缓存里有时间时,用缓存里的时间
callback(_session_startdate, _session_enddate);
} else {
//获取当前时间
let _currentDate = new Date();
_currentDate.setDate(_currentDate.getDate() - 1);
let _year = _currentDate.getFullYear(),
_moon = _this.common.dealDateNum(_currentDate.getMonth() + 1),
_end_day_temp = _currentDate.getDate(),
_end_day = _this.common.dealDateNum(_end_day_temp),
_start_day = _end_day_temp < 7 ? '01' : _this.common.dealDateNum(_end_day_temp - 6),
_enddate = _year + '-' + _moon + '-' + _end_day,
_startdate = _year + '-' + _moon + '-' + _start_day;
callback(_startdate, _enddate);
}
},
search(type) {
let _this = this;
if(type == 'today') {
......
<template>
<div>
<header-pulic :data="headerData"></header-pulic>
<div class="achieve-top">
<!--顶部圈圈数据区域-->
<ul class="achieve-top-circle-area">
<li v-for="(item,key,index) in cirData" :key="key" class="pointer-click-item" :class="'achieve_l'+(index+1)+' circle-li-'+key" :data-href="item.href">
<span>{{item.title}}</span>
<span>{{item.num}}</span>
</li>
</ul>
<!--时间搜索区域-->
<div class="achieve-top-time-area poa flex">
<div class="input-area-left flex">
<div class="flex">
<div class="flex-center"><input class="flex-center" type="date" v-model="startDate" /></div>
<div class="flex-center"></div>
<div class="flex-center"><input class="flex-center" type="date" v-model="endDate" /></div>
</div>
<div class="bsb" @click.prevent.stop="search('normal')"></div>
</div>
<div class="time-btn-area flex">
<button class="flex-center" @click.prevent.stop="search('today')">今天</button>
</div>
</div>
</div>
<!--列表项-->
<div class="main-content-area">
<!--tab切换及title区域-->
<section class="ul_header por">
<p class="ul_title">
<span v-for="(item,index) in tabsMain" :key="item.title" :class="{active:index == initTabNumMain}" @click="tabMain(index)">{{item.title}}</span>
</p>
<div class="div-tri">
<div class="box-tri-1"></div>
<div class="box-tri-2" :style="'left: '+countLeft+'rem;'"></div>
</div>
<p class="ul_title_add add_zz" v-for="(item,index) in tabsMain" :key="item.title" v-show="index == initTabNumMain">
<span v-for="(item2,index2) in item.titleList">{{item2}}</span>
</p>
</section>
<!--主列表区域-->
<ul class='achieve_zz_ul' v-for="(item,index) in tabsMain" :key="item.title" v-show="index == initTabNumMain" :id="'listall_'+index">
<li v-for="(item2,index2) in item.dataList" :data-id="item2.store_id">
<div class="db-line">
<div class="ellipsis">{{item2.store_name}}</div>
<div class="ellipsis">{{item2.name}}</div>
</div>
<div>{{item2.add_house_num}}</div>
<div>{{item2.add_user_num}}</div>
<div>{{item2.march_in_num}}</div>
<div>{{item2.performance}}</div>
<div>{{item2.official_receipts}}</div>
</li>
</ul>
</div>
<div class="loading-gif-block" v-show="isLoadFlag2">正在加载...</div>
<div v-for="(item,index) in tabsMain" :key="item.title" v-show="index == initTabNumMain">
<div class="no-more-block" v-if="item.dataList.length>0">没有更多了...</div>
<div class="no-data-block" v-else>暂无数据...</div>
</div>
<div v-show="isLoadFlag1"><img src="/app/images/lazyload.gif" /></div>
</div>
</template>
<script>
import '@/assets/js/layer041002.js';
import achieveSearchBlock from '@/components/achieveMain/achieveSearchBlock';
export default {
name: '',
props: {
data: {
type: Object,
default: () => ({
message: 'hello'
})
},
dataindex: {
type: [Number, String],
default: 0
}
},
components: {
'achieve-search-block': achieveSearchBlock
},
data: () => ({
}),
created() {
data() {
let _this = this;
return {
headerData: {
'title': '门店业绩',
'noborder': true,
'isBack': false
},
token: '',
startDate: '',
endDate: '',
nowDate: _this.common.backNowDate(),
headerTitle: '',
ywyId: _this.$route.query.ywyId,
userLevel: '',
initTabNumMain: 0,
isLoadFlag1: false,
isLoadFlag2: false,
cirData: {
'fangyuan': {
'title': '房源',
'href': 'achieve_sub_dz_main?state=0',
'num': 0
},
'keyuan': {
'title': '客源',
'href': 'achieve_sub_dz_main?state=0',
'num': 0
},
'yeji': {
'title': '业绩',
'href': 'achieve_sub_dz_main?state=0',
'num': 0
},
'shishou': {
'title': '实收',
'href': 'achieve_sub_dz_main?state=0',
'num': 0
},
'yuedaikan': {
'title': '约带看',
'href': 'achieve_sub_dz_main?state=0',
'num': 0
},
'jinchang': {
'title': '进场',
'href': 'achieve_sub_dz_main?state=0',
'num': 0
},
'shoukuan': {
'title': '收款',
'href': 'achieve_sub_dz_main?state=0',
'num': 0
},
'jiandu': {
'title': '监督',
'href': 'achieve_sub_dz_main?state=0',
'num': 0
}
},
tabsMain: [{
'title': '业务员业绩排行榜',
'isLoadMain': false,
'titleList': ['业务员', '房源', '客源', '进场', '业绩', '实收'],
'dataList': []
}]
}
},
mounted() {
created() {
let _this = this;
_this.common.duringRequest({
'urlStr': '/broker/storePerformanceBySearch',
startAction() {
_this.isLoadFlag1 = true;
},
endAction() {
_this.isLoadFlag1 = false;
}
},{
'urlStr': '/broker/storeOrAgentSort',
startAction() {
_this.isLoadFlag2 = true;
},
endAction() {
_this.isLoadFlag2 = false;
}
});
_this.loadMain();
},
methods: {
loadMain() {
var _this = this;
_this.userLevel = localStorage.getItem('userlevel');
_this.token = localStorage.getItem('token');
if(_this.userLevel == '30' || _this.userLevel == '40') {
_this.headerTitle = '区域业绩';
_this.tabsMain.unshift({
'title': '门店业绩排行榜',
'isLoadMain': false,
'titleList': ['门店', '房源', '客源', '进场', '业绩', '实收'],
'dataList': []
});
} else if(_this.userLevel == '20') {
_this.headerTitle = '门店业绩';
} else {
layerTipsX('level error');
};
_this.common.achieveInitTime(function(start_date, end_date) {
_this.startDate = start_date;
_this.endDate = end_date;
_this.ajaxMainNum(function() {
if(_this.userLevel == '30' || _this.userLevel == '40') {
_this.ajaxUl(_this.initTabNumMain === 0 ? 2 : 1);
} else {
_this.ajaxUl(1);
}
});
});
},
tabMain(index) {
var _this = this;
_this.initTabNumMain = index;
if(!_this.tabsMain[index].isLoadMain) {
//Vue.set(_this.tabsMain[index], 'isLoadMain', true);
if(_this.userLevel == '30' || _this.userLevel == '40') {
_this.ajaxUl(_this.initTabNumMain === 0 ? 2 : 1);
} else {
_this.ajaxUl(1);
}
}
},
resetSomeData(type) {
var _this = this;
if(type == 1) {
_this.tabsMain.forEach(function(item, i, arr) {
item.isLoadMain = false;
})
};
},
search(type) {
var _this = this;
_this.resetSomeData(1);
if(type == 'today') {
_this.endDate = _this.startDate = _this.nowDate;
} else {
var _tempTimeNow = new Date(_this.nowDate).getTime(),
_tempTimeStart = new Date(_this.startDate).getTime(),
_tempTimeEnd = new Date(_this.endDate).getTime();
if(_tempTimeNow === _tempTimeStart && _tempTimeNow === _tempTimeEnd) {
console.log('搜索为今天');
} else {
if(_tempTimeStart > _tempTimeEnd || _tempTimeEnd >= _tempTimeNow) {
layer.open({
content: '开始时间不能大于结束时间,且搜索日期需要小于今天。请重新选择日期',
btn: ['确定', '取消'],
yes(_index) {
layer.close(_index);
}
});
return false;
};
};
};
sessionStorage.setItem('achieve_search_start_date', _this.startDate);
sessionStorage.setItem('achieve_search_end_date', _this.endDate);
_this.ajaxMainNum(function() {
if(_this.userLevel == '30' || _this.userLevel == '40') {
_this.ajaxUl(_this.initTabNumMain === 0 ? 2 : 1);
} else {
_this.ajaxUl(1);
}
});
},
ajaxMainNum(fn) {
var _this = this;
_this.axios({
method: 'get',
url: '/broker/storePerformanceBySearch',
responseType: 'json',
data: {
'AuthToken': _this.token,
'agent_id': _this.ywyId,
'start_time': _this.startDate,
'end_time': _this.endDate
}
})
.then(function(response) {
if(response.data.code == 200) {
let _data = response.data;
if(_data.data) {
_this.cirData.fangyuan.num = _data.data.add_house_num;
_this.cirData.keyuan.num = _data.data.add_user_num;
_this.cirData.yeji.num = _data.data.performance;
_this.cirData.shishou.num = _data.data.official_receipts;
_this.cirData.yuedaikan.num = _data.data.look_at_num;
_this.cirData.jinchang.num = _data.data.march_in_num;
_this.cirData.shoukuan.num = _data.data.paylog;
_this.cirData.jiandu.num = _data.data.supervision_num;
};
fn && fn();
} else {
layer.tipsX(response.data.msg);
}
})
.catch(function(error) {
layer.tipsX(error);
});
},
ajaxUl(type) {
var _this = this;
_this.axios({
method: 'get',
url: '/broker/storeOrAgentSort',
responseType: 'json',
data: {
'AuthToken': _this.token,
'agent_id': _this.ywyId,
'start_time': _this.startDate,
'end_time': _this.endDate,
'is_store': type
}
})
.then(function(response) {
if(response.data.code == 200) {
let _data = response.data;
_this.tabsMain[_this.initTabNumMain].isLoadMain = true;
if(_data.data) {
_this.tabsMain[_this.initTabNumMain].dataList = _data.data;
};
fn && fn();
} else {
layer.tipsX(response.data.msg);
}
})
.catch(function(error) {
layer.tipsX(error);
});
},
dealName(str1, str2) {
return str1 + '<br />' + str2;
}
},
computed: {
showHouseArr() {
return true;
},
countLeft() {
return this.initTabNumMain == 0 ? 1.85 : 4.85;
}
}
}
</script>
<style scoped>
.achieve-top {
width: 100%;
background: url(images/bg_yj-.png) no-repeat center center /7.5rem 4.9rem;
height: 4.9rem;
position: relative;
}
.achieve-top-circle-area {
width: 100%;
}
.achieve-top-circle-area li {
width: 1.06rem;
height: 1.06rem;
background: url(images/yuan_di.png) no-repeat center center/1.06rem 1.06rem;
position: absolute;
}
.achieve-top-circle-area li:focus{
box-shadow: 0px 3px 12px #ff9419;
border-radius: 1.06rem;
}
.achieve-top-circle-area>.achieve_l1 {
left: 0.4rem;
top: 0.4rem;
}
.achieve-top-circle-area>.achieve_l2 {
left: 2.3rem;
top: 0.4rem;
}
.achieve-top-circle-area>.achieve_l3 {
left: 4.15rem;
top: 0.4rem;
}
.achieve-top-circle-area>.achieve_l4 {
left: 6rem;
top: 0.4rem;
}
.achieve-top-circle-area>.achieve_l5 {
left: 0.4rem;
top: 1.7rem;
}
.achieve-top-circle-area>.achieve_l6 {
left: 2.3rem;
top: 1.7rem;
}
.achieve-top-circle-area>.achieve_l7 {
left: 4.15rem;
top: 1.7rem;
}
.achieve-top-circle-area>.achieve_l8 {
left: 6rem;
top: 1.7rem;
}
.achieve-top-circle-area li span{
color: #ff9419;
float: left;
width: 100%;
text-align: center;
font-weight: 400;
}
.achieve-top-circle-area li span:nth-of-type(1) {
font-size: .24rem;
margin-top: 0.2rem;
}
.achieve-top-circle-area li span:nth-of-type(2) {
font-size: .3rem;
margin-top: -0.05rem;
}
/*搜索日期部分样式重写*/
.achieve-top-time-area{
bottom: .3rem;
left: 0;
width: 100%;
height: .6rem;
justify-content: center;
color: white;
font-size: .24rem;
}
.input-area-left{
flex: 5.8rem 0 0;
border: 1px solid white;
border-radius: .06rem;
}
.input-area-left>div:nth-of-type(1){
flex: 5.2rem 0 0;
}
.input-area-left>div:nth-of-type(1)>div:nth-of-type(1),
.input-area-left>div:nth-of-type(1)>div:nth-of-type(3){
padding-left: .3rem;
}
.input-area-left>div:nth-of-type(1)>div>input{
width: 2rem;
color: white;
height: 100%;
font-size: inherit;
}
.input-area-left>div:nth-of-type(1)>div:nth-of-type(2){
width: .5rem;
}
.input-area-left>div:nth-of-type(2){
flex: .6rem 0 0;
border-left: 1px solid white;
background: url(images/suods.png) no-repeat center center/.3rem .3rem;
}
.time-btn-area{
flex: 1.2rem 0 0;
flex-direction: row-reverse;
align-items: center;
}
.time-btn-area>button{
width: 1rem;
height: .5rem;
background-color: #ff9419;
border-radius: .05rem;
color: inherit;
}
/*搜索日期部分样式重写*/
/*列表*/
.main-content-area {
width: 100%;
box-sizing: border-box;
background: white;
padding: 0 0.3rem;
}
</style>
\ No newline at end of file
/*js里的样式分离*/
/*2017-05-09 xishifeng*/
/********************************中间两行的 标题**********************************/
.ul_header>p {
border-bottom: 1px solid #F2F2F2;
overflow: hidden;
}
.ul_header>p>span{
float: left;
}
.ul_header>p.ul_title {
height: 0.9rem;
font-size: 0.32rem;
margin-top: -0.05rem;
font-weight: bold;
color: #333;
}
.ul_title>span {
font-size: 0.32rem;
margin-top: 0.25rem;
}
.ul_header>p.ul_title_add {
height: 0.7rem;
box-sizing: border-box;
}
p.ul_title_add>span {
font-size: 0.28rem;
color: #666;
line-height: .7rem;
text-align: center;
}
/*组长看到的样式*/
p.ul_title {
height: 0.8remt;
border-bottom: none;
position: relative;
}
p.ul_title>span {
margin-top: 0.25rem;
color: #333;
}
p.ul_title>span.active {
color: #ff9419;
}
p.ul_title>span:nth-of-type(1) {
box-sizing: border-box;
/*width: 3.3rem;*/
padding-left: 0.8rem;
margin-left: 0;
float: left;
}
p.ul_title>span:nth-of-type(2) {
padding-right: 0.8rem;
margin-left: 0;
/*width: 3.3rem;*/
box-sizing: border-box;
float: right;
}
.div-tri {
position: relative;
overflow: hidden;
}
.box-tri-1 {
height: 0.1rem;
border-bottom: 1px solid #ff9419;
}
.box-tri-2 {
width: 0.1rem;
height: 0.1rem;
border: 1px solid #ff9419;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
position: absolute;
top: 0.07rem;
left: 1.85rem;
background-color: white;
}
p.add_zz>span {
width: 1.18rem;
}
p.add_zz>span:nth-of-type(1) {
width: 0.9rem;
text-align: left;
}
/********************************************li项*************************************************/
.main-content-area ul li {
border-bottom: 1px solid #f2f2f2;
/*height: 1.2rem;*/
cursor: pointer;
position: relative;
overflow: hidden;
}
.main-content-area ul li::after {
content: "";
/*background: url(../images/inat.png) no-repeat right center;*/
background-size: 0.14rem 0.26rem;
position: absolute;
right: 0;
top: 0;
width: 0.4rem;
height: 1.2rem;
}
.main-content-area ul li>div {
float: left;
color: #333;
font-size: 0.3rem;
/*height: 1.2rem;*/
box-sizing: border-box;
text-align: center;
overflow: hidden;
word-break: break-all;
padding-top: .2rem .05rem;
}
/*组长看到的样式*/
.achieve_zz_ul>li>div {
/*line-height: 1.2rem;*/
/*width: 1.18rem;*/
width: 17%;
}
.achieve_zz_ul>li>div:nth-of-type(1) {
text-align: left;
white-space: nowrap;
text-overflow: ellipsis;
}
.achieve_zz_ul>li>div:nth-of-type(2) {
width: 0.9rem;
padding-right: 0.3rem;
}
/******************************案场业绩时的导航栏下拉框***************************/
/*补充*/
.db-line {
padding-top: .2rem;
}
.db-line>div {
line-height: .4rem;
font-size: .2rem;
}
</style>-->
\ No newline at end of file
<template>
<div>
<div class="timebox001 fl">
<div class="inputbox fl">
<input type="date" id="startdateid" v-model="startDate">
</div>
<img src="/app/images/yj_down_icon@2x.png" class="yj_down_icon">
<span class="fl" style="color:#FFFFFF;margin-left: 0.1rem"></span>
<div class=" inputbox fl">
<input type="date" id="enddateid" v-model="endDate">
</div>
<img src="/app/images/yj_down_icon@2x.png" class="yj_down_icon">
<div class="div_search" @click.prevent.stop="search('normal')">
<span></span>
<img src="/app/images/suods.png" />
</div>
</div>
<button id="searchBtn2" @click.prevent.stop="search('today')">今天</button>
</div>
</template>
<script>
import '@/assets/js/layer041002.js';
export default {
name: '',
props: {
data: {
type: Object,
default: () => ({
message: 'hello'
})
},
dataindex: {
type: [Number, String],
default: 0
}
},
components: {
},
data: () => ({
startDate: '',
endDate: '',
}),
created() {
let _this = this;
},
methods: {
search(type) {
var _this = this;
_this.resetSomeData(1);
if(type == 'today') {
_this.endDate = _this.startDate = _this.common.backNowDate();
} else {
var _tempTimeNow = new Date(_this.nowDate).getTime(),
_tempTimeStart = new Date(_this.startDate).getTime(),
_tempTimeEnd = new Date(_this.endDate).getTime();
if(_tempTimeNow === _tempTimeStart && _tempTimeNow === _tempTimeEnd) {
console.log('搜索为今天');
} else {
if(_tempTimeStart > _tempTimeEnd || _tempTimeEnd >= _tempTimeNow) {
layer.open({
content: '开始时间不能大于结束时间,且搜索日期需要小于今天。请重新选择日期',
btn: ['确定', '取消'],
yes(_index) {
layer.close(_index);
}
});
return false;
};
};
};
sessionStorage.setItem('achieve_search_start_date', _this.startDate);
sessionStorage.setItem('achieve_search_end_date', _this.endDate);
_this.ajaxMainNum(function() {
if(_this.userLevel == '30' || _this.userLevel == '40') {
_this.ajaxUl(_this.initTabNumMain === 0 ? 2 : 1);
} else {
_this.ajaxUl(1);
}
});
},
},
computed: {
}
}
</script>
<style scoped>
/*****************************************搜索起止时间部分******************************************/
.list-time {
width: 5.8rem;
height: 0.6rem;
box-sizing: border-box;
position: absolute;
left: 0.85rem;
border-radius: 0.06rem;
border: 1px solid #FFFFFF;
bottom: 0.3rem;
}
#searchBtn2 {
background-color: #ff9419;
width: 1rem;
height: .5rem;
border-radius: .05rem;
color: white;
position: absolute;
right: -1.2rem;
bottom: .05rem;
}
.tancu001 li a {
-webkit-touch-callout: none
}
.timebox001 {
width: 100%;
}
.timebox001 span {
font-size: 0.24rem;
color: #FFFFFF;
line-height: 0.6rem;
}
.timebox001 .inputbox {
height: 0.5rem;
width: 1.5rem;
width: 2.2rem;
overflow: hidden;
}
.timebox001 input {
float: left;
width: 90%;
color: #FFFFFF;
font-size: 0.26rem;
height: 0.6rem;
background: none;
margin-left: 11%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.timebox001 .select_a {
float: left;
padding: 0.04rem 0.3rem;
font-size: 0.25rem;
background: #ff9419;
color: #fff;
border-radius: 0.05rem;
margin-top: 0.3rem;
line-height: 0.4rem
}
.yj_down_icon {
float: left;
width: 0.2rem;
height: 0.1rem;
margin-top: 0.25rem;
margin-left: -0.1rem;
}
/*****************************搜索按钮相关************************/
.div_search {
float: left;
}
.div_search>span {
width: 0.02rem;
height: 0.3rem;
border-left: 1px solid rgba(255, 255, 255, 0.6);
display: block;
float: left;
margin-top: 0.15rem;
margin-left: 0.2rem;
}
.div_search>img {
width: 0.28rem;
height: 0.29rem;
display: block;
margin-top: 0.15rem;
float: left;
margin-left: 0.16rem;
}
/******************************************************************************************************/
</style>
\ No newline at end of file
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