Skip to content

T
tl_estate
Commit 5d756a07 authored by xishifeng's avatar xishifeng
Browse files
Options

业绩整理

parent 39bda914
Hide whitespace changes
Inline Side-by-side
Showing with 384 additions and 249 deletions
public/appnew/src/components/achieveMain/achieveAgent.vue
View file @ 5d756a07
......@@ -8,7 +8,7 @@
<div class="mulu_relate_new" v-show="showHouseArr" @click.prevent.stop="mask('show')"><span id="list_name">{{tabsMain[1].houseDataInit.internal_title}}</span><img :src="listHouseIcon"></div>
</header>
<div class="header_seat"></div>
<!--右上角的下拉列表部分-->
<div class="mask-list-area" v-show="showMaskFlag" @click.prevent.stop="mask('hide')">
<div class="pop_box">
......@@ -18,26 +18,43 @@
</ul>
</div>
</div>
<!--搜索部分，和tab切换部分-->
<div class="achieve-content-ac">
<div class="search-area">
<div><input type="date" v-model="startDate" /></div>
<span>至</span>
<div><input type="date" v-model="endDate" /></div>
<button @click.prevent.stop="search('normal')">搜索</button>
<button @click.prevent.stop="search('today')">今天</button>
</div>
<!--搜索部分，和tab切换部分-->
<ul class="nav-area" v-for="(item,index) in tabsMain" :key="item.title" v-show="index == initTabNumMain">
<li v-for="(item2,index2) in item.data" :key="item2.name" :class="{tab_selected:index2 == item.initTabNumSub}" @click="tabSub(index, index2)">
<span>{{item2.name}}</span>
<div class="achieve-top">
<!--顶部圈圈数据区域-->
<ul class="achieve-top-circle-area" v-for="(item,index) in tabsMain" :key="index" v-show="index == initTabNumMain">
<li v-for="(item2,key2,index2) in item.cirData" :key="index2" class="pointer-click-item" :class="'achieve_l'+(index2+1)+' circle-li-'+key2" :data-href="item2.href">
<span>{{item2.title}}</span>
<span>{{item2.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>
<!--约带看，进场等-->
<ul class="nav-area" v-for="(item,index) in tabsMain" :key="index" v-show="index == initTabNumMain">
<li v-for="(item2,index2) in item.data" :key="item2.name" :class="{tab_selected:index2 == item.initTabNumSub}" @click="tabSub(index, index2)">
<span>{{item2.name}}</span>
<span>{{item2.num}}</span>
</li>
</ul>
<!--组要区域部分-->
<div v-for="(item,index) in tabsMain" :key="item.title" v-show="index == initTabNumMain">
<section v-for='(item2,index2) in item.data' :key="item2.name" v-show="index2 == item.initTabNumSub" class="sec-tab">
......@@ -60,7 +77,7 @@
</section>
</div>
<div class="loading-gif-block" v-show="isLoadFlag">正在加载...</div>
</div>
</template>
......@@ -81,6 +98,28 @@
'token': '',
'initTabNumSub': 0,
'isLoadMain': 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
},
},
'data': [{
'name': '约带看',
'num': 0,
......@@ -106,6 +145,28 @@
'title': '案场',
'initTabNumSub': 0,
'isLoadMain': 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
},
},
'data': [{
'name': '约带看',
'num': 0,
......@@ -148,9 +209,9 @@
_this.isLoadFlag = true;
},
endAction() {
}
},{
}, {
'urlStr': '/broker/orderNoList',
startAction() {
_this.isLoadFlag = true;
......@@ -183,6 +244,7 @@
_this.tabsMain[index].data[0].isLoadSub = true;
_this.ajaxUl();
} else {
_this.isLoadFlag = false;
console.log(_this.tabsMain[index].data[0].isLoadSub);
};
});
......@@ -220,6 +282,28 @@
'title': '经纪人',
'initTabNumSub': 0,
'isLoadMain': 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
},
},
'data': [{
'name': '约带看',
'num': 0,
......@@ -245,6 +329,28 @@
'title': '案场',
'initTabNumSub': 0,
'isLoadMain': 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
},
},
'data': [{
'name': '约带看',
'num': 0,
......@@ -275,6 +381,28 @@
} else if(type == '2') {
//重置少部分数据
_this.tabsMain[1].initTabNumSub = 0;
_this.tabsMain[1].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
},
};
_this.tabsMain[1].data = [{
'name': '约带看',
'num': 0,
......@@ -344,35 +472,35 @@
};
_this.axios({
method: 'get',
url: '/broker/agentPerformanceBySearch',
responseType: 'json',
data: _requestData
})
.then(function(response) {
if(response.data.code == 200) {
let _data = response.data;
if(_data.data) {
if(!_this.tabsMain[_tabMainNum].isLoadMain && _tabMainNum == 1 && _data.data.house_arr) {
_this.tabsMain[1].houseData = [{
'houses_id': 'all',
'internal_title': '全部'
}, ..._data.data.house_arr];
method: 'get',
url: '/broker/agentPerformanceBySearch',
responseType: 'json',
data: _requestData
})
.then(function(response) {
if(response.data.code == 200) {
let _data = response.data;
if(_data.data) {
if(!_this.tabsMain[_tabMainNum].isLoadMain && _tabMainNum == 1 && _data.data.house_arr) {
_this.tabsMain[1].houseData = [{
'houses_id': 'all',
'internal_title': '全部'
}, ..._data.data.house_arr];
};
_this.tabsMain[_tabMainNum].isLoadFlag = true;
_this.tabsMain[_tabMainNum].data[0].num = (_data.data.look_at_num == null ? 0 : _data.data.look_at_num);
_this.tabsMain[_tabMainNum].data[1].num = (_data.data.march_in_num == null ? 0 : _data.data.march_in_num);
_this.tabsMain[_tabMainNum].data[2].num = (_data.data.paylog == null ? 0 : _data.data.paylog);
_this.tabsMain[_tabMainNum].data[3].num = (_data.data.bargain_sum == null ? 0 : _data.data.bargain_sum);
};
_this.tabsMain[_tabMainNum].isLoadFlag = true;
_this.tabsMain[_tabMainNum].data[0].num = (_data.data.look_at_num == null ? 0 : _data.data.look_at_num);
_this.tabsMain[_tabMainNum].data[1].num = (_data.data.march_in_num == null ? 0 : _data.data.march_in_num);
_this.tabsMain[_tabMainNum].data[2].num = (_data.data.paylog == null ? 0 : _data.data.paylog);
_this.tabsMain[_tabMainNum].data[3].num = (_data.data.bargain_sum == null ? 0 : _data.data.bargain_sum);
};
fn && fn();
} else {
layer.tipsX(response.data.msg);
}
})
.catch(function(error) {
layer.tipsX(error);
});
fn && fn();
} else {
layer.tipsX(response.data.msg);
}
})
.catch(function(error) {
layer.tipsX(error);
});
},
ajaxUl() {
let _this = this;
......@@ -387,28 +515,28 @@
if(_this.initTabNumMain == 1 && _this.tabsMain[1].houseDataInit.houses_id != 'all') {
_requestData['house_id'] = _this.tabsMain[1].houseDataInit.houses_id;
};
_this.axios({
method: 'get',
url: '/broker/orderNoList',
responseType: 'json',
data: _requestData
})
.then(function(response) {
if(response.data.code == 200) {
let _data = response.data;
if(_data.data) {
let _index = _this.initTabNumMain;
let _index2 = _this.tabsMain[_index].initTabNumSub;
_this.tabsMain[_index].data[_index2].dataList = (_data.data == null ? [] : _data.data);
};
} else {
layer.tipsX(response.data.msg);
}
})
.catch(function(error) {
layer.tipsX(error);
});
method: 'get',
url: '/broker/orderNoList',
responseType: 'json',
data: _requestData
})
.then(function(response) {
if(response.data.code == 200) {
let _data = response.data;
if(_data.data) {
let _index = _this.initTabNumMain;
let _index2 = _this.tabsMain[_index].initTabNumSub;
_this.tabsMain[_index].data[_index2].dataList = (_data.data == null ? [] : _data.data);
};
} else {
layer.tipsX(response.data.msg);
}
})
.catch(function(error) {
layer.tipsX(error);
});
}
},
......@@ -512,6 +640,7 @@
padding-left: 0.1rem;
}
/******************************案场业绩时的导航栏下拉框***************************/
.mask-list-area {
position: fixed;
z-index: 101;
......@@ -570,86 +699,158 @@
border-top: 1px solid #e6e6e6;
}
.achieve-content-ac {
overflow: hidden;
.sec-tab {
background-color: white;
}
/*顶部背景图，及圈圈部分样式*/
.sec-tab {
background-color: white;
.achieve-top {
width: 100%;
background: url(images/bg_yj-.png) no-repeat center center /7.5rem 4.9rem;
height: 4.9rem;
position: relative;
}
.achieve-content-ac>.search-area {
line-height: .5rem;
height: .5rem;
color: #333;
font-size: .28rem;
padding: 0.4rem 0 0.4rem 0.15rem;
border-bottom: 1px solid #F2F2F2;
overflow: hidden;
.achieve-top-circle-area {
width: 100%;
}
.achieve-content-ac>.search-area>div {
float: left;
width: 2.1rem;
height: .5rem;
border-radius: .05rem;
border: 1px solid #333;
margin-right: .16rem;
box-sizing: border-box;
font-size: 0.24rem;
overflow: hidden;
padding-left: 0.2rem;
.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-content-ac>.search-area>img {
width: .4rem;
margin-right: .16rem;
.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;
padding-top: .05rem;
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: .26rem;
}
.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;
}
.achieve-content-ac>.search-area>div>input {
.input-area-left>div:nth-of-type(1)>div>input {
width: 2rem;
height: .47rem;
box-sizing: border-box;
font-size: 0.22rem;
float: left;
color: white;
height: 100%;
font-size: inherit;
}
.achieve-content-ac>.search-area>div>input::-webkit-clear-button {
display: none;
.input-area-left>div:nth-of-type(1)>div:nth-of-type(2) {
width: .5rem;
}
.achieve-content-ac>.search-area>div>input::-webkit-inner-spin-button {
display: none;
.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;
}
.achieve-content-ac>.search-area>span {
margin-right: .16rem;
float: left;
.time-btn-area {
flex: 1.2rem 0 0;
flex-direction: row-reverse;
align-items: center;
}
.achieve-content-ac>.search-area>button {
background-color: #ff9419;
.time-btn-area>button {
width: 1rem;
height: .5rem;
background-color: #ff9419;
border-radius: .05rem;
color: white;
float: left;
color: inherit;
}
/*搜索日期部分样式重写*/
.achieve-content-ac>.search-area>button:nth-of-type(2) {
margin-left: .16rem;
}
.achieve-content-ac>.nav-area {
.nav-area {
overflow: hidden;
padding: 0 .08rem;
border-bottom: 1px solid #F2F2F2;
background-color: white;
}
.achieve-content-ac>.nav-area>li {
.nav-area>li {
float: left;
font-size: .24rem;
color: #333;
......@@ -661,11 +862,11 @@
cursor: pointer;
}
.achieve-content-ac>.nav-area>li.tab_selected {
.nav-area>li.tab_selected {
color: #ff9419;
}
.achieve-content-ac>.nav-area>li.tab_selected::after {
.nav-area>li.tab_selected::after {
content: '';
width: 0.74rem;
height: 2px;
......@@ -676,17 +877,17 @@
background-color: #FF9419;
}
.achieve-content-ac>.nav-area>li>span {
.nav-area>li>span {
float: left;
width: 100%;
text-align: center;
}
.achieve-content-ac>.nav-area>li>span:nth-of-type(1) {
.nav-area>li>span:nth-of-type(1) {
padding-top: 0.26rem;
}
.achieve-content-ac>.nav-area>li>span:nth-of-type(2) {
.nav-area>li>span:nth-of-type(2) {
padding-top: 0.16rem;
}
......
public/appnew/src/components/achieveMain/achieveRegion.vue
View file @ 5d756a07
......@@ -31,30 +31,30 @@
<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 class="ul_title flex">
<span v-for="(item,index) in tabsMain" :key="item.title" class="flex-center" :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">
<p class="ul_title_add flex" 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">
<li class="flex" 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>
<div class="flex-center">{{item2.add_house_num}}</div>
<div class="flex-center">{{item2.add_user_num}}</div>
<div class="flex-center">{{item2.march_in_num}}</div>
<div class="flex-center">{{item2.performance}}</div>
<div class="flex-center">{{item2.official_receipts}}</div>
</li>
</ul>
</div>
......@@ -82,7 +82,7 @@
headerData: {
'title': '门店业绩',
'noborder': true,
'isBack': false
'isBack': true
},
token: '',
startDate: '',
......@@ -307,7 +307,23 @@
if(_data.data) {
_this.tabsMain[_this.initTabNumMain].dataList = _data.data;
};
fn && fn();
// _this.tabsMain[_this.initTabNumMain].dataList = [{
// 'store_name': 'eterte',
// 'name': 'bb',
// 'add_house_num': 155,
// 'add_user_num': 156,
// 'march_in_num': 157,
// 'performance': 158,
// 'official_receipts': 159,
// },{
// 'store_name': 'eterte',
// 'name': 'bb',
// 'add_house_num': 155,
// 'add_user_num': 156,
// 'march_in_num': 157,
// 'performance': 158,
// 'official_receipts': 159,
// }];
} else {
layer.tipsX(response.data.msg);
}
......@@ -332,6 +348,7 @@
</script>
<style scoped>
/*顶部背景图，及圈圈部分样式*/
.achieve-top {
width: 100%;
background: url(images/bg_yj-.png) no-repeat center center /7.5rem 4.9rem;
......@@ -411,6 +428,8 @@
margin-top: -0.05rem;
}
/*搜索日期部分样式重写*/
.achieve-top-time-area{
bottom: .3rem;
......@@ -419,7 +438,7 @@
height: .6rem;
justify-content: center;
color: white;
font-size: .24rem;
font-size: .26rem;
}
.input-area-left{
flex: 5.8rem 0 0;
......@@ -461,42 +480,40 @@
}
/*搜索日期部分样式重写*/
/*列表*/
/*tab切换部分样式*/
.main-content-area {
width: 100%;
box-sizing: border-box;
background: white;
padding: 0 0.3rem;
}
/*js里的样式分离*/
/*2017-05-09 xishifeng*/
/********************************中间两行的 标题**********************************/
.ul_header>p {
.ul_header>p:nth-last-of-type(1) {
border-bottom: 1px solid #F2F2F2;
overflow: hidden;
}
.ul_header>p>span{
float: left;
}
.ul_header>p.ul_title {
height: 0.9rem;
.ul_title {
height: 0.8rem;
font-size: 0.32rem;
margin-top: -0.05rem;
font-weight: bold;
color: #333;
justify-content: center;
}
.ul_title>span {
flex: 45% 0 0;
font-size: 0.32rem;
margin-top: 0.25rem;
}
.ul_header>p.ul_title_add {
.ul_title>span.active {
color: #ff9419;
}
/*三角划线部分样式*/
p.ul_title_add {
height: 0.7rem;
box-sizing: border-box;
}
......@@ -506,38 +523,12 @@
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;
width: 1.18rem;
}
p.ul_title>span:nth-of-type(2) {
padding-right: 0.8rem;
margin-left: 0;
/*width: 3.3rem;*/
box-sizing: border-box;
float: right;
p.ul_title_add>span:nth-of-type(1) {
width: 0.9rem;
text-align: left;
}
.div-tri {
......@@ -561,78 +552,21 @@
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 {
/*主要列表区域样式*/
.achieve_zz_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;
.achieve_zz_ul>li>div{
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;
width: 1.18rem;
color: #333;
font-size: .24rem;
}
.db-line>div {
line-height: .4rem;
font-size: .2rem;
.achieve_zz_ul>li>div:nth-of-type(1){
width: .9rem;
padding: .15rem 0;
}
</style>-->
\ No newline at end of file
</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