dxy

public/app/css/agent_detail.css

@@ -58,7 +58,7 @@ body{
 }
 .pingfen-area-large>small{
 	float: left;
-	margin: 0 .05rem;
+	margin: 0 .0rem;
 	width: .24rem;
 	height: .24rem;
 	background: url('/app/images/pic_bigstar_black.png') no-repeat 0 0/.24rem .24rem;
@@ -79,7 +79,7 @@ body{
 }
 .pingfen-area>small{
 	float: left;
-	margin: 0 .05rem;
+	margin: 0 .02rem;
 	width: .16rem;
 	height: .16rem;
 	background: url('/app/images/pic_smallstar_black.png') no-repeat 0 0/.16rem .16rem;
@@ -339,3 +339,10 @@ body{
 	font-size: .22rem;
 	color: #999;
 }
+.star_darl{
+	border:none ;
+	border-radius:.15rem;
+	background-color:rgba(248,249,251,.3);
+	margin-right:.26rem;
+	margin-top:.2rem;
+}

public/app/js/agent_detail.js

@@ -170,15 +170,17 @@ $(function() {
 								var _html = "";
 								$.each(data['data']['evaluate'], function(i, item) {
 									if(i < 2) {
-										_html += '<li><div class="li-top-area oh"><figure class="li-top-area-left fl"><div class="oh fl"><img src="{6}"  onerror="javascript:this.src=\'{7}\'" class="fl"></div><figcaption class="oh fl"><p>{0}</p><div class="oh"><div class="pingfen-area fl">{1}</div><p class="fl">{2}</p></div></figcaption></figure><div class="li-top-area-right fr">{3}</div></div><div class="li-bottom-area"><h3>{4}</h3><p>{5}</p></div></li>'.stringFormatObj({
+										_html += '<li><div class="li-top-area oh"><figure class="li-top-area-left fl"><div class="oh fl"><img src="{6}"  onerror="javascript:this.src=\'{7}\'" class="fl"></div><figcaption class="oh fl"><p>{0}</p><div class="oh"><p class="fl">{4}</p></div></figcaption></figure><div class="li-top-area-right fr">{3}</div></div><div class="li-bottom-area"><div class="star_row" style="overflow:hidden;width:100%;"><div class="star_darl" style="float:left;" ><span style="float:left;">专业：</span><div class="pingfen-area fl">{1}</div></div><div class="star_darl" style="float:left;" ><span style="float:left;">态度：</span><div class="pingfen-area fl">{8}</div></div><div class="star_darl" style="float:left;" ><span style="float:left;">着装：</span><div class="pingfen-area fl">{9}</div></div></div><div style="width:100%;margin-top:.3rem;"><p>{5}</p></div></div></li>'.stringFormatObj({
 											'0': $.trim(item['user_nick']) == ''?'昵称暂无':item['user_nick'],
 											'1': dealStar(item['evaluate_grade']),
 											'2': dealStarText(item['evaluate_grade']),
 											'3': item['created'],
-											'4': (item['receptiontime'] != ''||item['houserAddress'] != '')?(dealTimeKf(item['receptiontime'])+'在'+item['houserAddress']+'看房'):'暂无看房数据',
+											'4': (item['receptiontime'] != ''||item['houserAddress'] != '')?'在'+item['houserAddress']/*(dealTimeKf(item['receptiontime'])+'在'+item['houserAddress']+'看房')*/:'暂无看房数据',
 											'5': item['evaluate_content'],
 											'6': item['user_pic'],
-											'7': ServerHost+'/app/images/ic_default_headpic.png'
+											'7': ServerHost+'/app/images/ic_default_headpic.png',
+											'8': dealStar(item['evaluate_grade_attitude']),
+											'9': dealStar(item['evaluate_grade_clothing'])
 										});
 									};
 								});

public/appnew/src/components/agentScall/agent_scall.vue

+<template>
+	<div>
+		<header-pulic :data="headerData"></header-pulic>
+		<div>
+			<div style="margin-top:.9rem;" class="star_ten">
+				<div style="float:left;" class="header_img">
+					<img :src="ar" style="width:100%;height:100%;">
+				</div>
+				<div style="margin-left:.3rem;float:left;width:5rem;">
+					<div style="width:100%;">小郭</div>
+					<div v-for="item1,index1 in stars">
+						<img :src="index1*2 < person_sacall/0.5-0.5 ? sl : al" class="personScall-l" >
+						<img :src="index1*2+1 < person_sacall/0.5-0.5 ? sr : ar" class="personScall-r" >
+					</div>
+					<span style="margin-left:.52rem;font-size:.36rem;line-height:.6rem;color:rgba(255,128,24,1);font-weight:600;">{{person_sacall}}</span>
+					<div style="width:100%;font-size:.24rem;color:rgba(51,51,51,1);">当前{{pj_times}}次评价</div>
+				</div>
+			</div>
+			<div style="width:7.56rem;height:.2rem;background-color:rgba(248,249,251,1);overflow:hidden;"></div>
+			<div style="margin-top:.4rem;margin-bottom:.4rem;">
+				<div class="star_ten" style="font-weight:600;line-height:.44rem;font-size:.32rem;">您的评价对我们很重要：</div>
+				<div class="star_ten" style="margin-top:.3rem;" v-for="item,index in objs ">
+					<div style="float:left;height:.7rem;margin-right:.2rem">
+						<span style="line-height:.7rem;font-size:.28rem;font-family:PingFangSC-Regular;font-weight:500;color:rgba(39,39,39,1);">{{item.name}}</span>
+					</div>
+					<div v-for="item1,index1 in stars">
+						<img :src="index1*2 < item.scall/0.5-0.5 ? sl : al" class="personScall-l" @click="changeStarL(stars,index1,index)">
+						<img :src="index1*2+1 < item.scall/0.5-0.5 ? sr : ar" class="personScall-r" @click="changeStarR(stars,index1,index)">
+					</div>
+					<!--<img :src="index1 < item.scall ? starOn : starOff" class="starclass" v-for="item1,index1 in stars"  @click="changeStar(stars,index1,index)">-->
+					<div style="float:left;height:.7rem;margin-right:.3rem;margin-left:.3rem;">
+						<span style="line-height:.7rem;font-size:.28rem;font-family:PingFangSC-Regular;font-weight:4500;color:rgba(39,39,39,1);">{{item.pj}}</span>
+					</div>
+				</div>
+			</div>
+			<div class="star_ten">
+				<textarea class="detail" style="height:150px;" placeholder="请输入您对该经纪人服务的评价(至少5个字)" @input="autoTextarea($event,150)" v-model="desc"></textarea>
+			</div>
+		</div>
+		<div class="star_ten footer_btn" @click="commit">提交
+		</div>
+	</div>
+</template>
+
+<script>
+	import ar from '@/components/agentScall/images/ar.png';
+	import al from '@/components/agentScall/images/al.png';
+	import sr from '@/components/agentScall/images/sr.png';
+	import sl from '@/components/agentScall/images/sl.png';
+	export default {
+		data :()=>({
+			ar,al,sr,sl,
+			headerData : {
+				'title': '评价经纪人',
+				'noborder': true,
+				'isBack': true
+			},
+			person_sacall : 2.6,
+			pj_times : '298',
+			desc : '' ,
+			stars : [true,false,false,false,false] ,
+			objs : [
+				{
+					name : '专业' ,
+					scall : 1 ,
+					pj :'非常满意'
+				},
+				{
+					name : '态度' ,
+					scall : 2.5 ,
+					pj :'非常满意'
+				},
+				{
+					name : '着装' ,
+					scall : 3 ,
+					pj :'非常满意'
+				}
+			]
+		}),
+		methods : {
+			changeStarL ( obj , index ,i) {
+				let that = this ; 
+				that.objs[i].scall = index+0.5 ; 
+			},
+			changeStarR ( obj , index ,i) {
+				let that = this ; 
+				that.objs[i].scall = index+1 ; 
+			},
+			autoTextarea(e,height) {
+				if  ( e.target.scrollHeight >height ){
+					console.log(e.target.scrollHeight,height);
+					e.target.style.height = e.target.scrollHeight +'px';
+				}
+			},
+			commit (){
+				let that = this ; 
+				let data = {
+					evaluate_grade : that.objs[0].scall*2,
+					evaluate_grade_attitude : that.objs[1].scall*2,
+					evaluate_grade_clothing : that.objs[2].scall*2,
+					desc : that.desc,
+					AuthToken : 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJkYXRhIjp7ImlkIjozLCJ1c2VyTmljayI6Ilx1Njc2OFx1OTYzMyIsInBob25lIjoiMTU3MjA2ODI3NjEifSwidGltZVN0YW1wXyI6MTU2ODYxMTk4MH0.eTaMF1LGarwy_vjDwzN-Oc19CmRldC7T1ZtivJRSk0Y' , //that.$route.query.token,
+					house_id : 63,
+					source : 10 ,
+					record_id : 722 ,
+					agent_id : 6472,
+
+					
+				}
+				console.log(data);
+				that.axios({
+					method: 'post',
+					url : '/api/appraiserV2',
+					data:data,
+					responseType: 'json',
+				}).then(function(res){
+					if ( res.data.code == 200 ){
+						//跳转界面
+					} else {
+						layer.tipsX(res.data.msg);
+					}
+				})
+			}
+		},
+	}
+</script>
+
+<style scoped>
+	.star_ten{
+		width:6.78rem;
+		overflow:hidden;
+		margin-left:.36rem;
+		
+	}
+	.starclass{
+		width:.56rem;
+		height:.56rem;
+		margin-top:.1rem;
+		margin-left:.1rem;
+		float:left;
+	}
+	.detail{
+		font-size:.28rem;
+		font-family:PingFangSC-Regular;
+		font-weight:400;
+		color:rgba(39,39,39,1);
+		line-height:.4rem;
+		width:6.38rem;
+		height:1rem;
+		border:1px solid #eeeeee;
+		padding:.1rem .2rem;
+		background-color:rgba(248,249,251,1);
+	}
+	input::-webkit-input-placeholder, 
+	textarea::-webkit-input-placeholder {
+	    font-size:.28rem;
+		font-family:PingFangSC-Regular;
+		font-weight:400;
+		color:rgba(153,153,153,1);
+		line-height:.4rem;
+	}
+	textarea{
+	  outline: none;
+	  overflow: hidden;
+	  resize: none;   //调整属性指定一个元素是否是由用户调整大小的  both/horizontal 宽度/vertical 高度
+	  word-break: break-all;
+	  box-sizing: border-box;
+	}
+	.header_img{
+		height:1.36rem;
+		width:1.36rem;
+		border-radius: 50%;
+		overflow: hidden;
+	}
+	.personScall-l{
+		overflow: hidden;
+		width:.2rem;
+		height:.4rem;
+		margin-top:.1rem;
+		margin-left:.05rem;
+		float:left;
+	}
+	.personScall-r{
+		overflow: hidden;
+		width:.2rem;
+		height:.4rem;
+		margin-top:.1rem;
+		/*margin-left:.05rem;*/
+		float:left;
+	}
+	.footer_btn{
+		width:6.78rem;
+		height:.92rem;
+		background: #1a1a1a;
+		border-radius: .1rem;
+		line-height:.92rem;
+		text-align:center;
+		font-family:PingFangSC;
+		font-weight:500;
+		color:rgba(255,255,255,1);
+		position:fixed;
+		bottom:.5rem;
+		background:linear-gradient(90deg,rgba(255,160,40,1) 0%,rgba(255,128,24,1) 100%);
+	}
+</style>
+

public/appnew/src/router/index.js

@@ -180,6 +180,10 @@ export default new VueRouter({
 			path: '/propaganda',
 			name: 'v-propaganda',
 			component: resolve => require(['@/components/propaganda/propaganda'],resolve)
+		},{
+			path: '/agent_scall',
+			name: 'v-agent_scall',
+			component: resolve => require(['@/components/agentScall/agent_scall'],resolve)
 		}