业绩周排行2

application/index/view/houses/edit.html

@@ -566,7 +566,7 @@
 									</div>
 									<div class="form-group">
 										<label for="">招商时间</label>
-										<input type="date" class="form-control" id="kaipanTime" data-alert="请开盘招商时间！">
+										<input type="date" class="form-control" id="kaipanTime" data-alert="请填写招商时间！">
 									</div>
 									<div class="form-group">
 										<label for="">开业时间</label>

public/appnew/src/assets/css/public.css

@@ -9,15 +9,20 @@ body {
 }
 
 .fl {
-	float: left;
+	float: left!important;
 }
 
 .fr {
-	float: right;
+	float: right!important;
 }
 
+
 .tc {
-	text-align: center;
+	text-align: center!important;
+}
+
+.tr {
+	text-align: right!important;
 }
 
 .ellipsis {

public/appnew/src/assets/js/public.js

@@ -56,8 +56,12 @@ export default {
 		})
 		.then(function(response) {
 		    if(response.data.code == 200){
+		    	localStorage.removeItem('id');
+		    	localStorage.removeItem('phone');
+		    	localStorage.removeItem('name');
 		    	localStorage.setItem('token', response.data.data.token);//存储登录的token值
 		    	localStorage.setItem('userid', response.data.data.id);//存储用户id
+		    	localStorage.setItem('userlevel', response.data.data.level);//存储用户id
 				localStorage.setItem('userphone', response.data.data.phone);//存储用户名字
 				localStorage.setItem('username', response.data.data.name);//存储用户电话号码
 		    	localStorage.setItem('userinfo', encodeURIComponent(JSON.stringify(response.data.data)));//存储用户所有信息

public/appnew/src/components/achieveMain/achieveFork.vue

@@ -4,7 +4,7 @@
 		<nav>
 			<div v-for="(item, index) in mainData" :key="item.title" :class="{active:index === initTabNumMain}" @click="tabMain(index)">{{item.title}}</div>
 		</nav>
-		
+
 		<main>
 			<section class="main-sec" v-for="(item, index) in mainData" :key="item.title" v-show="index === initTabNumMain">
 				<ul>
@@ -12,6 +12,19 @@
 						<achieve-fork-li :data="item2" :dataindex="index2"></achieve-fork-li>
 					</li>
 				</ul>
+				<footer class="oh achieve-footer">
+					<achieve-fork-li :data="mainData[index].selfData" :dataindex="mainData[index].selfData.index_-1"></achieve-fork-li>
+					<p class="time-title tc">统计时间：{{statisticsStartTime+'-'+statisticsEndTime}}</p>
+					<div class="btn-area">
+						<div class="oh">
+							<a class="fl" :href="linkAchieveYwy">个人业绩</a>
+						</div>
+						<div class="oh" v-if="userLevel!=10">
+							<a v-if="userLevel==20" :href="linkAchieveQy">门店业绩</a>
+							<a v-else :href="linkAchieveQy">区域业绩</a>
+						</div>
+					</div>
+				</footer>
 			</section>
 		</main>
 	</div>
@@ -26,39 +39,55 @@
 			'header-pulic': headerPulic,
 			'achieve-fork-li': achieveForkLi
 		},
-		data() {
-			return {
-				headerData: {
-					'title': '本周业绩',
-					'noborder': true,
-					'isBack': true
-				},
-				token: '',
-				userid: '',
-				initTabNumMain: 0,
-				mainData:[{
-					'title': '人员排行',
-					'topLineNum': 5,
-					'listData': []
-				},{
-					'title': '门店排行',
-					'topLineNum': 5,
-					'listData': []
-				},{
-					'title': '部门排行',
-					'topLineNum': Number.POSITIVE_INFINITY,
-					'listData': []
-				}]
-			}
-		},
+		data: () => ({
+			headerData: {
+				'title': '本周业绩',
+				'noborder': true,
+				'isBack': true
+			},
+			token: '',
+			userid: '',
+			initTabNumMain: 0,
+			mainData: [{
+				'title': '人员排行',
+				'isLoad': false,
+				'topLineNum': 5,
+				'listData': [],
+				'selfData': {
+					'index_': 4
+				}
+			}, {
+				'title': '门店排行',
+				'isLoad': false,
+				'topLineNum': 5,
+				'listData': [],
+				'selfData': {
+					'index_': 4
+				}
+			}, {
+				'title': '部门排行',
+				'isLoad': false,
+				'topLineNum': Number.POSITIVE_INFINITY,
+				'listData': [],
+				'selfData': {
+					'index_': 4
+				}
+			}],
+			statisticsStartTime: '',
+			statisticsEndTime: '',
+			userLevel: '',
+			linkAchieveYwy: '',
+			linkAchieveQy: '',
+			linkAchieveQy: ''
+		}),
 		created() {
 			let _this = this;
 			let _token = _this.$route.query.token;
-			if(!_token){
+			if(!_token) {
 				layer.tipsX('token获取出错');
 				return false;
 			};
-			_this.common.h5PageC(_token, function(){
+			_this.common.h5PageC(_token, () => {
 				_this.loadMain();
 			});
 		},
@@ -67,52 +96,78 @@
 				let _this = this;
 				_this.token = localStorage.getItem('token');
 				_this.userid = localStorage.getItem('userid');
+				_this.userLevel = localStorage.getItem('userlevel');
+				_this.linkAchieveYwy = 'achieve_ywy?ywyId=' + _this.userid;
+				_this.linkAchieveQy = 'achieve_region?ywyId=' + _this.userid;
+				_this.ajaxUl();
+			},
+			tabMain(index) {
+				let _this = this;
+				_this.initTabNumMain = index;
+				if(!_this.mainData[index].isLoad) {
+					_this.ajaxMainNum(function() {
+						if(!_this.tabsMain[index].data[0].isLoadSub) {
+							Vue.set(_this.tabsMain[index].data[0], 'isLoadSub', true);
+							_this.ajaxUl();
+						} else {
+							console.log(_this.tabsMain[index].data[0].isLoadSub);
+						};
+					});
+				}
+			},
+			ajaxUl() {
+				let _this = this;
 				_this.axios({
-				    method: 'get',
-				    url: '/broker/selectPerformanceByTime',
-				    responseType: 'json',
-				    data: {
-				    	'agent_id': _this.userid,
-				    	'type': 1,
-				    	'AuthToken': _this.token
-				    }
+					method: 'get',
+					url: '/broker/selectPerformanceByTime',
+					responseType: 'json',
+					data: {
+						'agent_id': _this.userid,
+						'type': 1,
+						'AuthToken': _this.token
+					}
 				})
 				.then(function(response) {
-				    if(response.data.code == 200){
-				        _this.mainData[0].listData = response.data.data.list;
-				    }else{
-				        layer.tipsX(response.data.msg);
-				    }
+					if(response.data.code == 200) {
+						_this.statisticsStartTime = response.data.data.start_time.replace(/-/g, '.');
+						_this.statisticsEndTime = response.data.data.end_time.replace(/-/g, '.');
+						_this.mainData[0].listData = response.data.data.list;
+						_this.mainData[0].selfData = response.data.data.list.filter(function(item, index, array) {
+							return(item.agent_id === item.is_my);
+						})[0];
+					} else {
+						layer.tipsX(response.data.msg);
+					}
 				})
 				.catch(function(error) {
-				    layer.tipsX(error);
+					layer.tipsX(error);
 				});
-			},
-			tabMain(index) {
-				let _this = this;
-				_this.initTabNumMain = index;
 			}
 		}
 	}
 </script>
 
 <style>
-	nav{
+	nav {
 		display: flex;
 		background-color: white;
 		height: .9rem;
 		line-height: .9rem;
 		padding: 0 .3rem;
+		border-bottom: 1px solid #eee;
 	}
-	nav>div{
+	
+	nav>div {
 		flex: 1;
 		text-align: center;
 	}
-	nav>div.active{
+	
+	nav>div.active {
 		color: rgb(255, 148, 25);
 		position: relative;
 	}
-	nav>div.active::after{
+	
+	nav>div.active::after {
 		content: '';
 		position: absolute;
 		left: 50%;
@@ -123,4 +178,46 @@
 		border-radius: .03rem;
 		background-color: rgb(255, 161, 50);
 	}
+	footer{
+		background-color: white;
+		border-top: 1px solid #ccc;
+		position: fixed;
+		bottom: 0;
+		left: 0;
+	}
+	footer>p.time-title{
+		font-size: .24rem;
+		padding-top: .24rem;
+		color: rgb(153, 153, 153);
+		border-top: 1px solid #eee;
+	}
+	footer>.btn-area {
+		display: flex;
+		width: 7.5rem;
+		height: 1.5rem;
+		box-sizing: border-box;
+		padding: 0 1rem;
+	}
+	
+	footer>.btn-area>div {
+		flex: 1;
+	    height: 1.5rem;
+	    box-sizing: border-box;
+	    display: flex;
+	    text-align: center;
+	    align-items: center;
+	    justify-content: center;
+	}
+	
+	footer>.btn-area>div>a {
+		display: block;
+		width: 2.05rem;
+	    height: .68rem;
+	    border-radius: .34rem;
+	    line-height: .68rem;
+	    text-align: center;
+	    background-color: #FFA132;
+	    color: white;
+	    box-shadow: 0 0.3rem 0.5rem rgba(255,161,50,.5);
+	}
 </style>
\ No newline at end of file

public/appnew/src/components/achieveMain/achieveForkLi.vue

 <template>
-	<div class="rank-li oh">
+	<div :class="'rank-li oh '+countRankPic(dataindex)">
 		<div>{{dataindex+1}}</div>
-		<div><img :src="data.img" /></div>
 		<div>
-			<p>{{data.name}}</p>
-			<p>{{data.district_name+data.store_name}}</p>
+			<div>
+				<img :src="data.img" :onerror="onErrorImg" />
+			</div>
 		</div>
 		<div>
+			<p class="ellipsis">{{data.name}}</p>
+			<p class="ellipsis">{{data.district_name+data.store_name}}</p>
+		</div>
+		<div class="fr">
 			<p>{{data.performance_total}}</p>
-			<p>业绩</p>
+			<p class="tr">业绩</p>
 		</div>
 	</div>
 </template>
 
 <script>
+	import onErrorImg from '@/assets/images/ic_default_headpic.png';
 	export default {
 		name: '',
 		props: {
 			data: {
 				type: Object,
-				default: function() {
-					return {
-						message: 'hello'
-					}
-				}
+				default: () => ({
+					message: 'hello'
+				})
 			},
 			dataindex: {
-				type: String,
-				default: function() {
-					return '0'
-				}
-			}
-		},
-		data() {
-			return {
-				
+				type: [Number, String],
+				default: () => 0
 			}
 		},
+		data: () => ({
+			//onErrorImg: 'this.src="' + require('@/assets/images/ic_default_headpic.png') + '"'
+			onErrorImg: 'this.src="' + onErrorImg + '"'
+		}),
 		methods: {
-			
+			countRankPic(index) {
+				switch (index){
+					case 0:
+						return 'rank-first-pic';
+					case 1:
+						return 'rank-second-pic';
+					case 2:
+						return 'rank-third-pic';
+					default:
+						return '';
+				};
+			}
 		}
 	}
 </script>
@@ -58,14 +69,64 @@
 		font-size: .3rem;
 		color: rgb(102, 102, 102);
 	}
-	.rank-li>div:nth-of-type(1){
+	.rank-li>div:nth-of-type(2){
+		padding-top: .1rem;
+	}
+	.rank-li>div:nth-of-type(2)>div{
 		width: 1.21rem;
 		height: 1.21rem;
+		box-sizing: border-box;
+		padding: .11rem 0 0 .105rem;
 		overflow: hidden;
 	}
-	.rank-li>div:nth-of-type(1)>img{
+	.rank-li.rank-first-pic>div:nth-of-type(2)>div{
+		background: url(images/rank_1.png) no-repeat center center/1.15rem 1.21rem;
+	}
+	.rank-li.rank-second-pic>div:nth-of-type(2)>div{
+		background: url(images/rank_2.png) no-repeat center center/1.15rem 1.21rem;
+	}
+	.rank-li.rank-third-pic>div:nth-of-type(2)>div{
+		background: url(images/rank_3.png) no-repeat center center/1.15rem 1.21rem;
+	}
+	.rank-li>div:nth-of-type(2)>div>img{
 		float: left;
 		width: .98rem;
 		height: .98rem;
+		border-radius: 50%;
+		object-fit: cover;
+	}
+	.rank-li>div:nth-of-type(3){
+		padding-left: .2rem;
+		box-sizing: border-box;
+		width: 3.4rem;
+	}
+	.rank-li>div:nth-of-type(3)>p:nth-of-type(1){
+		padding: .3rem 0 .03rem;
+		font-size: .34rem;
+	}
+	.rank-li>div:nth-of-type(3)>p:nth-of-type(2){
+		color: rgb(153, 153, 153);
+		font-size: .24rem;
+	}
+	.rank-li.rank-first-pic>div:nth-of-type(3)>p:nth-of-type(1){
+		color: rgb(255, 97, 100);
+	}
+	.rank-li.rank-second-pic>div:nth-of-type(3)>p:nth-of-type(1){
+		color: rgb(255, 204, 52);
+	}
+	.rank-li.rank-third-pic>div:nth-of-type(3)>p:nth-of-type(1){
+		color: #339cfe;
+	}
+	.rank-li>div:nth-of-type(4){
+		max-width: 1.9rem;
+	}
+	.rank-li>div:nth-of-type(4)>p:nth-of-type(1){
+		color: rgb(255, 148, 25);
+		font-size: .3rem;
+		padding: .3rem 0 .03rem;
+	}
+	.rank-li>div:nth-of-type(4)>p:nth-of-type(2){
+		font-size: .24rem;
+		color: rgb(153, 153, 153);
 	}
 </style>
\ No newline at end of file

public/appnew/src/components/publicEg/entrance.vue

@@ -2,20 +2,24 @@
 	<div>
 		<ul>
 			<li v-for="(item, index) in navs" class="tc">
-				<router-link :to="item.url">{{item.name}}</router-link>
+				<router-link :to="item">{{item.nameCustom}}</router-link>
 			</li>
 		</ul>
 	</div>
 </template>
 
 <script>
+	let _token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJkYXRhIjp7ImlkIjozLCJuYW1lIjoiXHU0ZThlXHU3NmZjXHU3NmZjIiwicGhvbmUiOiIxMzkxODkzNzc0MSIsImxldmVsIjoyMH0sInRpbWVTdGFtcF8iOjE1MjUzOTk0Nzl9.q3Eviv399NeN8PUEeLlPVCV4bxOtkqjDhVoejmBfHNc';
 	export default {
 		name: '',
 		data() {
 			return {
 				navs: [{
-					'url': 'achieveFork',
-					'name': 'achieveFork'
+					'path': '/achieveFork',
+					'nameCustom': '业绩总入口',
+					'query': {
+						'token': _token
+					}
 				}]
 			}
 		},