Procházet zdrojové kódy

个人名片页面
服务顾问页面

zs y před 2 roky
rodič
revize
eaf5bd509b

+ 18 - 0
pages.json

@@ -239,6 +239,24 @@
 			}
 		
 		}
+        ,{
+            "path" : "pages/index/personalCard",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "个人名片",
+                "enablePullDownRefresh": false
+            }
+            
+        }
+        ,{
+            "path" : "pages/user/expertServices",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "服务专家",
+                "enablePullDownRefresh": true
+            }
+            
+        }
     ],
 	"tabBar": {
 		"color": "#8a8a8a",

+ 5 - 2
pages/index/index.vue

@@ -58,7 +58,7 @@
 		</view>
 		
 		<!-- 服务顾问 -->
-		 <view class="adviser" v-if="managerInfo" @click="goMUsers">
+		 <view class="adviser" v-if="managerInfo" @click="goMUsers()">
 			<view class="adviserLeft">
 				<img v-if="managerInfo.avatar" :src="managerInfo.avatar" alt="" class="advisertx">
 				<img v-else src="../../static/timg/pic_def_ava@2x.png" alt="" class="advisertx">
@@ -290,8 +290,11 @@
 			goMUsers(){
 				if(!this.userInfo){
 					this.authorizShow=true;
+	
 				}else{
-					
+					uni.navigateTo({
+						url:'../index/personalCard?adInfo='+JSON.stringify(this.managerInfo)
+					})
 				}
 			},
 			goGoods(item){

+ 228 - 0
pages/index/personalCard.vue

@@ -0,0 +1,228 @@
+<template>
+	<view class="content">
+		<view class="top-box">
+			<image class="bgImg" src="../../static/img/bg_mingpian@2x.png"></image>
+			<image class="headerImg" :src="avatarStr">
+			</image>
+			<view class="txtInfo-box">
+				<text class="name">{{adInfo.name}}</text>
+				<text class="work">服务顾问</text>
+			</view>
+		</view>
+		<view class="address-box" @click="addressOpra">
+			<view class="address-info">
+				<text class="store-name">{{shopNameStr}}</text>
+				<text
+					class="store-address">{{addressStr}}</text>
+			</view>
+			<view class="address-arrow">
+				<image src="../../static/img/little_rightArrow.png" mode="aspectFit"></image>
+			</view>
+		</view>
+		<view class="bottom-box">
+
+			<button open-type="share" class="share-btn-box">
+				<view class="share-btn">分享名片</view>
+			</button>
+			<view class="call-btn" @click="callOpra">拨号</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				adInfo: {
+					shopName:'',
+					shopInfo:{
+						shopName:''
+					}
+				}
+			}
+		},
+		onLoad(e) {
+			// console.log('个人名片传递的参数', e);
+			this.adInfo = JSON.parse(e.adInfo)
+			// console.log('个人名片传递的参数', this.adInfo);
+		},
+		computed: {
+	
+			avatarStr(){
+				return this.adInfo.avatar ? this.adInfo.avatar : '../../static/timg/pic_def_ava@2x.png'
+			},
+
+			shopNameStr(){
+				if (this.adInfo.shopName) {
+					// console.log('this.adInfo.shopName = ',this.adInfo.shopName)
+					return this.adInfo.shopName
+				}
+				else{
+					// console.log('this.adInfo.shopInfo.shopName = ',this.adInfo.shopInfo.shopName)
+					return this.adInfo.shopInfo.shopName
+				}
+			},
+			addressStr() {
+				if (this.adInfo.provinceName) {
+					return this.adInfo.provinceName + this.adInfo.cityName + this.adInfo.areaName + this.adInfo.address	
+				}
+				else
+				{
+					return this.adInfo.shopInfo.provinceName + this.adInfo.shopInfo.cityName + this.adInfo.shopInfo.areaName + (this.adInfo.shopInfo.Address ? this.adInfo.shopInfo.Address :'')
+				}
+			},
+		},
+		methods: {
+			// 拨号
+			callOpra() {
+				if (this.adInfo.phone) {
+					uni.makePhoneCall({
+						phoneNumber: this.adInfo.phone,
+						success(e) {
+							console.log(e)
+						},
+						fail: function(e) {
+							console.log(e)
+						}
+					})
+				}
+				else
+				{
+					uni.showToast({
+						title:'没有电话信息',
+						icon: "none",
+						duration:2000
+					})
+				}
+			},
+			// 门店地址
+			addressOpra() {
+				uni.switchTab({
+					url:'/pages/index/index'
+				})
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	/* 背景图 & 头像 */
+	.top-box {
+		text-align: center;
+		border-bottom: 1rpx solid #eee;
+	}
+
+	.bgImg {
+		width: 100%;
+		height: 426rpx;
+	}
+
+	.headerImg {
+		width: 272rpx;
+		height: 272rpx;
+		border-radius: 50%;
+		border: 6rpx solid #A38E21;
+		margin-top: -136rpx;
+	}
+
+	/* 名片信息 */
+	.txtInfo-box {
+		display: flex;
+		flex-direction: column;
+		margin-top: 34rpx;
+		margin-bottom: 32rpx;
+	}
+
+	.name {
+		font-size: 44rpx;
+		font-weight: 500;
+		color: #333;
+	}
+
+	.work {
+		color: #666;
+		font-size: 28rpx;
+		margin-top: 10rpx;
+	}
+
+	/* 地址信息 */
+	.address-box {
+		display: flex;
+		margin-top: 33rpx;
+		margin-bottom: 33rpx;
+	}
+
+	.address-info {
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+		margin-left: 44rpx;
+	}
+
+	.address-arrow {
+		width: 60rpx;
+	}
+
+	.address-arrow image {
+		width: 30rpx;
+		height: 100%;
+	}
+
+	.store-name {
+		font-size: 30rpx;
+		font-weight: 500;
+		color: #3c3c3c;
+	}
+
+	.store-address {
+		margin-top: 12rpx;
+		font-size: 24rpx;
+		color: #999;
+	}
+
+	/* 底部 */
+	.bottom-box {
+		bottom: 0;
+		position: fixed;
+		background: white;
+		width: 100%;
+		display: flex;
+
+		box-shadow: 0px -2px 10px 0px rgba(153, 153, 153, 0.2000);
+		padding-bottom: env(safe-area-inset-bottom);
+
+		height: 120rpx;
+	}
+
+	button::after {
+		border: none;
+	}
+
+	.share-btn-box {
+		width: 375rpx;
+		background: #FFFFFF;
+		margin: 0;
+		padding: 0;
+
+		.share-btn {
+			margin: 20rpx;
+			background-color: #F4F5F7;
+			border-radius: 37rpx;
+			font-size: 28rpx;
+			color: #000;
+			text-align: center;
+			line-height: 74rpx;
+		}
+	}
+
+	.call-btn {
+		flex: 1;
+		margin: 20rpx;
+		background-color: #D53533;
+		border-radius: 37rpx;
+		font-size: 28rpx;
+		color: white;
+		text-align: center;
+		line-height: 74rpx;
+	}
+</style>

+ 234 - 0
pages/user/expertServices.vue

@@ -0,0 +1,234 @@
+<template>
+	<view class="content">
+		<!-- 我的服务顾问 -->
+		<view class="ad-bg-box" v-if="users">
+			<view class="ad-box">
+				<view class="ad-sec-tit">
+					我的服务顾问
+				</view>
+				<view class="ad-con-box">
+					<view class="ad-con-box-l">
+						<image :src="usersAvatarStr" mode="aspectFit" class="ad-icon-mine"></image>
+					</view>
+					<view class="ad-con-box-r">
+						<view class="ad-name">{{users.name}}</view>
+						<view class="ad-years">{{userYears}}</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<!-- 全部服务顾问横栏 -->
+		<view class="mid-box">
+			<view class="mid-v-line"></view>
+			<view class="mid-sec-tit">全部服务顾问</view>
+		</view>
+		<!-- 服务顾问list -->
+		<view class="ad-list" v-for="(item,index) in queryManagerList" :key="item.id" @click="goDetail(item)">
+			<view>
+				<image :src="item.avatar ? item.avatar : '../../static/timg/pic_def_ava@2x.png'" class="ad-list-img"></image>
+			</view>
+			<view class="ad-list-r">
+				<view class="ad-name">{{item.name}}</view>
+				<view class="ad-years">{{item.year ? ('从业年限:' + item.Years + '年') : '从业年限:未知'}}</view>
+
+			</view>
+
+			<view class="address-arrow">
+				<image src="../../static/img/little_rightArrow.png" mode="aspectFit"></image>
+			</view>
+
+		</view>
+
+
+		<!-- 上拉 加载更多 -->
+		<view class="noMore" v-if="noMoreShow && (queryManagerList.length!=0)">没有更多数据</view>
+		<!-- 无数据空白页 -->
+		<nodata v-if="queryManagerList.length==0"></nodata>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				queryManagerList: '',
+				noMoreShow: false,
+				users: ''
+			}
+		},
+		onLoad() {
+			this.getQueryManagerList()
+		},
+		computed: {
+			usersAvatarStr() {
+				return this.users.avatar ? this.users.avatar : '../../static/timg/pic_def_ava@2x.png'
+			},
+			userYears(){
+				if (this.users.years) {
+					return '从业年限:' + this.users.years + '年'
+				}
+				return '从业年限:未知'
+			}
+		},
+		methods: {
+			getQueryManagerList() {
+				uni.showLoading({
+					title: '加载中'
+				})
+				this.$http('openmy/queryManager', {}, 'GET').then(res => {
+					uni.hideLoading();
+					this.queryManagerList = res.data.userlist
+					this.users = res.data.users
+					
+					// console.log('服务顾问列表===', res);
+				})
+			},
+
+			goDetail(item) {
+				uni.navigateTo({
+					url: '../index/personalCard?adInfo=' + JSON.stringify(item)
+				})
+			}
+		},
+
+		// 下拉刷新
+		onPullDownRefresh() {
+
+			this.getQueryManagerList()
+			setTimeout(function() {
+				uni.stopPullDownRefresh();
+			}, 1000);
+		}
+	}
+</script>
+
+<style scoped>
+	.content {
+		min-height: 100vh;
+		background-color: #F4F5F7;
+		padding-bottom: 60rpx;
+	}
+
+	.ad-bg-box {
+		background-color: #FF0000;
+		padding: 20rpx 24rpx;
+	}
+
+	.ad-box {
+		background-color: #FFFFFF;
+		border-radius: 10rpx;
+	}
+
+	.ad-con-box {
+		display: flex;
+		padding-bottom: 10rpx;
+		margin-top: 30rpx;
+		margin-left: 30rpx;
+	}
+
+	.ad-sec-tit {
+		font-size: 24rpx;
+		color: #666;
+		padding-top: 30rpx;
+		margin-left: 30rpx;
+	}
+
+	.ad-icon-mine {
+		width: 100rpx;
+		height: 100rpx;
+		border-radius: 50rpx;
+	}
+
+	.ad-con-box-r {
+		margin-left: 30rpx;
+	}
+
+	.ad-name {
+		font-size: 30rpx;
+		font-weight: 400;
+		color: #333333;
+		margin-top: 6rpx;
+	}
+
+	.ad-years {
+		font-size: 24rpx;
+		color: #666;
+		margin-top: 10rpx;
+	}
+
+	/* 全部服务顾问横栏 */
+	.mid-v-line {
+		background-color: #FF0000;
+		width: 8rpx;
+		height: 30rpx;
+		border-radius: 4rpx;
+		margin-left: 30rpx;
+	}
+
+	.mid-box {
+		display: flex;
+		height: 94rpx;
+		align-items: center;
+		background-color: #FFFFFF;
+		margin-bottom: 20rpx;
+	}
+
+	.mid-sec-tit {
+		margin-left: 16rpx;
+		font-size: 30rpx;
+		font-weight: 500;
+		color: #333333;
+	}
+
+	/* 顾问list */
+	.ad-list {
+		margin: 0rpx 24rpx 20rpx;
+		padding: 20rpx;
+		background-color: #FFFFFF;
+		border-radius: 10rpx;
+
+		display: flex;
+	}
+
+	.ad-list-img {
+		width: 84rpx;
+		height: 84rpx;
+		border-radius: 42rpx;
+	}
+
+	.address-arrow {
+		width: 30rpx;
+	}
+
+	.address-arrow image {
+		width: 30rpx;
+		height: 100%;
+	}
+
+	.ad-list-r {
+		padding-left: 20rpx;
+		flex: 1;
+	}
+
+	.noMore {
+		text-align: center;
+		line-height: 50rpx;
+		color: #999999;
+		font-size: 28rpx;
+	}
+
+	/* .nodataImg {
+		width: 400rpx;
+		padding-top: 100rpx;
+	}
+
+	.noTxt {
+		font-size: 36rpx;
+		color: #999999;
+		padding-top: 50rpx;
+	}
+
+	.nodataBox {
+		text-align: center;
+	} */
+</style>

+ 1 - 1
pages/user/user.vue

@@ -99,7 +99,7 @@
 
 		<!-- 我的 相关 -->
 		<view class="rowBoxBg">
-			<view class="rowBox" @click="gonavigateTo('../index/shopList')">
+			<view class="rowBox" @click="gonavigateTo('../user/expertServices')">
 				<view class="leftView">
 					<image src="../../static/img/icon_me1.png" mode="" class="liftIcon"></image>
 					<view class="rowTitle">服务专家</view>

binární
static/img/bg_mingpian@2x.png