weCom/pages/index/index.vue

<template>
	<view class="content" style="background: #F4F5F7;">
		<view class="qwTsBox" v-if="qwtsShow">
			<view class="qwTsTxt">{{msg}}</view>
		</view>
		<view class="indexTop" v-if="userDetail">
			<view class="top">
				<view>
					<image class="logo" :src="userDetail.avatar"></image>
				</view>
				<view class="topRight">
					<view class="wxName">{{userDetail.name}}</view>
					<view class="titleBox">
						<view class="title" v-for="(item,index) in customerInfo.lables">{{item.name}}</view>
					</view>
				</view>	
			</view>
			<view class="tabBox">
				<view class="tabline" :class="{tabActive:tabIndex==1}" @click="tabFn(1)">客户信息</view>
				<view class="tabline" :class="{tabActive:tabIndex==2}" @click="tabFn(2)">车辆信息</view>
				<view class="tabline" :class="{tabActive:tabIndex==3}" @click="tabFn(3)">套餐余额</view>
				<view class="tabline" :class="{tabActive:tabIndex==4}" @click="tabFn(4)">优惠券</view>
				<view class="tabline" :class="{tabActive:tabIndex==5}" @click="tabFn(5)">消费历史</view>
			</view>
		</view>
		<view class="indexCont">
			<custom ref="customView" :token="token" @getUser="getUser" v-show="tabIndex==1"></custom>
			<car ref="carView"  :token="token" v-show="tabIndex==2"></car>
			<packageV ref="packageView" v-show="tabIndex==3"></packageV> 
			<coupon ref="couponView" v-show="tabIndex==4"></coupon>
			<consumption ref="consumptionView" v-show="tabIndex==5"></consumption>
		</view>
		
		
		
	  <!--  <view>{{code}}</view>
		<view @click="copy(code)">复制code</view> -->
		<!--<view style="color: red;">{{userId}}</view>
		<view @click="copy(userId)">复制userId</view>
		
		<view @click="copy(token)">{{token}}</view>
		<view>{{agentId}}</view> -->
		<!-- <view @click="oAuth">重新授权</view> -->
	<!--   <view style="color: red;">{{userId}}</view>
		<view @click="copy(userId)">复制userId</view>
		<view>{{token}}</view>
		<view @click="copy(token)">复制token</view> -->
	<!-- 	<view>agentId:{{agentId}}</view> -->
	 <!--   <view>code1:{{code1}}</view>
		<view>code2:{{code2}}</view> 
		<view>code3:{{code3}}</view> -->
	</view>
</template>

<script>
	import custom from './custom.vue' 
	import car from './car.vue' 
	import packageV from './package.vue' 
	import coupon from './coupon.vue' 
	import consumption from './consumption.vue' 
	export default {
		components: {
			custom,car,packageV,coupon,consumption
		},
		
		data() {
			return {
				title: 'Hello',
				tabIndex:1,
				token:'',
				code:'',
				userId:'',
				userDetail:'',
				customerInfo:'',
				corpID:'',
				agentId:'',
				unionID:'',
				qwtsShow:false,
				code1:'',
				code2:'',
				code3:'',
				msg:'',
			}
		},
		onLoad() {
			var that=this
            this.code=uni.getStorageSync('code')
			this.token=uni.getStorageSync('token')
			this.corpID=uni.getStorageSync('corpID')
			 this.agentId=uni.getStorageSync('agentId')
			/* this.corpID='wpMGjbBgAA_zIu6wbKy48zFSbGiGeP8g'
			this.agentId='1000051'
			this.userId='wmMGjbBgAA0JAbGD5Vu8BzEuYgZhvhOA'
			//this.token='D226815BF1F1A11DE73489E7B8B3F7CEB2FA7AB1E002EF21F835C7D505158C7DAF945459643F62A3A6FD87751E6880BB'
			 
			this.token='26AF53EA2DC528681ABD7B3AC46072E96F0A964431A2453CF0F1DA1C28732A1EAF945459643F62A3A6FD87751E6880BB'
			 */
		     //this.userId='wmMGjbBgAALroygkoaVBN4-W2O1daIkg'
			 //this.token='065BAA93971FEB1A37A08D682FCDB41CC69E76FC36BB038790FB99C5CD71C28EAF945459643F62A3A6FD87751E6880BB'
		    //this.userId='wmMGjbBgAAeKTdCmEN0CLKPNwJ4ACTxw'
			//this.token='0A809B6077F4044EDECFC49762B59668E9508B2CA4C6C4791C8894B2B1A7338AAF945459643F62A3A6FD87751E6880BB'
			/*  uni.setStorage({
				key: 'token',
				data: that.token,
				 success: function () {	
					  that.extCustomerInfo()
					  that.extUserDetail()
				 }
			}); 
			uni.setStorage({
				key: 'userId',
				data: that.userId,
				 success: function () {	
					
				 }
			}); */
			/* this.code='aSBU0ums_4Z3ofjrfgSlYppwI9Cku5qtIg45ECkJTYY'
			
			 
			 */ 
			/* if(!this.token){
				this.authUserInfo()
			}else{
				 this.extCustomerInfo()
				 
				//this.$refs.customView.getdata() 
				this.extUserDetail()
				 //this.init()
			}
			 */
			 this.authUserInfo()
			//this.extUserDetail()
		},
		methods: {
			tabFn(num){
			   this.tabIndex=num
			   if(num==1){
				   this.$refs.customView.getdata()
			   }
			   if(num==2){
			   		this.$refs.carView.getdata()
			   }
			   if(num == 3){
				   this.$refs.packageView.getdata()
			   }
			   if(num==4){
			   	  this.$refs.couponView.getdata()
			   }
			   if(num==5){
			   	  this.$refs.consumptionView.getdata()
			   }
			   
			},
			extCustomerInfo(){
				var that=this;
				/* uni.showModal({
					title: '提示',
					content: 'extCustomerInfo',
					success: function (res) {
						if (res.confirm) {
							console.log('用户点击确定');
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				}); */
				this.$http('enterprise/wechat/extCustomerInfo', {
				   //corpID:'wpMGjbBgAA_zIu6wbKy48zFSbGiGeP8g',
				   corpID:that.corpID,
				  // extUserId:'wmMGjbBgAA0JAbGD5Vu8BzEuYgZhvhOA',
				   extUserId:this.userId,
				   token:this.token
				}, 'GET').then(res => {
					console.log(res.code)
					this.code2=res.code
					uni.hideLoading();
					if(res.code!=1){
						
						 //uni.clearStorageSync()
						 if(res.code == 401){
							 this.qwtsShow=true
							 this.msg=res.msg
						 }else{
							 uni.showToast({
							 	title: res.msg,
							 	icon: 'none',
							 	duration: 3000
							 }); 
						 }
						
					}else{
						this.customerInfo=res.data.customerInfo
						uni.setStorage({
							key: 'integral',
							data: that.customerInfo.integral,
							 success: function () {	 }
						});
						uni.setStorage({
							key: 'levelName',
							data: that.customerInfo.levelName,
							 success: function () {	 }
						});
						var map=res.data.map
						var arr=[]
						if(map.length){
							map.forEach(item=>{
								arr.push(item.PlateNumber)
							})
						}
						uni.setStorage({
							key: 'PlateNumberArr',
							data: arr,
							 success: function () {	 }
						});
					}
				
					
					
				})
			},
			extUserDetail(){
				var that=this;
				console.log("extUserDetail")
				this.$http('enterpriseWechat/auth/extUserDetail', {
				   corpID:that.corpID,
				  // extUserId:'wmMGjbBgAA0JAbGD5Vu8BzEuYgZhvhOA'
				  extUserId:this.userId
				}, 'GET').then(res => {
					console.log("extUserDetailRES"+res.code)
					uni.hideLoading();
					this.code1=res.code
					if(res.code == 401){
						 this.qwtsShow=true
						  this.msg=res.msg
					}
					this.userDetail=res.data
					this.$refs.customView.getdata()
				})
			},
			getUser(){
				var that=this;
				this.extCustomerInfo()
				this.$http('enterpriseWechat/auth/extUserDetail', {
				   corpID:that.corpID,
				  // extUserId:'wmMGjbBgAA0JAbGD5Vu8BzEuYgZhvhOA'
				  extUserId:this.userId
				}, 'GET').then(res => {
					uni.hideLoading();
					this.userDetail=res.data
					if(res.code!=1){
						 uni.showToast({
						 	title: res.msg,
						 	icon: 'none',
						 	duration: 3000
						 });
					}
					
				})
			},
			authUserInfo(){
				var that=this;
				uni.showLoading({
				 	title: '加载中'
				}); 
				this.$http('enterpriseWechat/auth/authUserInfo', {
				   corpID:that.corpID,
				   code: this.code
				}, 'GET').then(res => {
					this.code3=res.code
					if(res.code!=1){
						uni.hideLoading();
						 if(res.code == 401){
						 	this.qwtsShow=true
							 this.msg=res.msg
						 }else if(res.code == 0){
						 	this.qwtsShow=true
							 this.msg=res.msg
						 }else{
							 uni.showToast({
								title: res.msg,
								//title: res.code,
								icon: 'none',
								duration: 3000
							 }); 
						 }
					}else{
						this.token=res.data.token
						uni.setStorage({
							key: 'token',
							data: that.token,
							 success: function () {	
								 that.init()
							 }
						});
					}
					
					
					//that.extUserDetail()
					//that.extCustomerInfo()
				})
			},
			init(){
				
				var that=this
				
				this.$http('enterpriseWechat/auth/getAgentConfig', {
				   corpID:that.corpID,
				   url:'http://qw.66km.com.cn/'
				}, 'GET').then(res => {
					
					that.$wx.agentConfig({
					    corpid:that.corpID,// 必填，企业微信的corpid，必须与当前登录的企业一致
					    agentid:that.agentId, // 必填，企业微信的应用id （e.g. 1000247）
					    timestamp: res.data.timestamp, // 必填，生成签名的时间戳
					    nonceStr: res.data.nonceStr, // 必填，生成签名的随机串
					    signature: res.data.signature,// 必填，签名，见附录-JS-SDK使用权限签名算法
					    jsApiList: ['getCurExternalContact','getContext','sendChatMessage'], //必填，传入需要使用的接口名称
					    success: function(res) {
						   console.log(res)
						 
						// 回调
						   that.getContext()
					    },
					    fail: function(err) {
							   console.log(err)
							   uni.showToast({
								title: 'agentConfig失败',
								icon: 'none',
								duration: 3000
							   });
					        if(res.errMsg.indexOf('function not exist') > -1){
					            alert('版本过低请升级')
					        }
					    }
					});
				})
			},
			getContext(){
			   var that=this;
			   this.$wx.invoke('getContext', {
				   }, function(res){
				   if(res.err_msg == "getContext:ok"){
					  // entry  = res.entry ; //返回进入H5页面的入口类型，目前有normal、contact_profile、single_chat_tools、group_chat_tools、chat_attachment
					//shareTicket = res.shareTicket; //可用于调用getShareInfo接口
					that.getCurExternalContact()
				   }else {
					   //错误处理
					   uni.showToast({
						title: '入口不对',
						icon: 'none',
						duration: 3000
					   });
				   }
			   });
			},
			getCurExternalContact(){
				var that=this;
				/* uni.showModal({
					title: '提示',
					content: 'getCurExternalContact',
					success: function (res) {
						
					}
				}); */
			   this.$wx.invoke('getCurExternalContact', {
					   }, function(res){
					   if(res.err_msg == "getCurExternalContact:ok"){
						   that.userId  = res.userId ; //返回当前外部联系人userId
						   uni.setStorage({
						   	key: 'userId',
						   	data: that.userId,
						   	 success: function () {	
						   		
						   	 }
						   });
						   that.extUserDetail()
						   that.extCustomerInfo()
					   }else {
						   //错误处理
						   uni.showToast({
								title: 'userId获取失败',
								icon: 'none',
								duration: 3000
						   });
					   }
				   });
			},
		 
		   agentConfigFn(){
			   
		   },
		   
          
		   oAuth(){
			  uni.navigateTo({
			  	url:'auto?appid='+this.agentId+'&agentid='+this.agentId
			  }) 
		   },
		   copy(e){
			    uni.setClipboardData({
			       data: e,
			       success: function () {
			      
			         uni.showToast({
			           title: '复制成功',
			           icon: 'success',
			           duration: 2000
			         });
			       },
			       fail: function () {
			         console.log('复制失败');
			        
			       }
			     });
		   }
		},
		 onBackPress (options) {
		    if (options.from === "backbutton") {
		      return true
		    } else {
		      return false
		    }
		  },
		onReachBottom() {
			
		},
		onPullDownRefresh() {
		
			var num = this.tabIndex
			if(num==1){
					this.$refs.customView.getdata()
			}
			if(num==2){
					this.$refs.carView.getdata()
			}
			if(num == 3){
				this.$refs.packageView.getdata()
			}
			if(num==4){
				  this.$refs.couponView.getdata()
			}
			if(num==5){
				  this.$refs.consumptionView.getdata()
			}
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		}
	}
</script>

<style scoped>
	.top{
		background: #fff;
	}
	.top{
		display: flex;
		padding: 30rpx 24rpx;
	}
	.logo{
		width: 98rpx;height: 98rpx;
	}
	.topRight{
		padding-left: 20rpx;
	}
	.wxName{
		font-weight: 500;
		font-size: 32rpx;
		color: #333333;
		line-height: 45rpx;
	}
	.titleBox{
		display: flex;
		padding-top: 10rpx;
		display: flex;    flex-wrap: wrap;
		width: 500rpx;
	}
	.title{
		/* height: 36rpx; */
		border-radius: 4rpx;
		border: 1px solid #FF8113;
		/* line-height: 36rpx; */
		font-size: 24rpx;
		color: #FF8113;
		padding: 4rpx 8rpx;
		margin-right: 10rpx;
		margin-bottom: 10rpx;
	}
	.tabBox{
		display: flex;justify-content: space-between;
		background: #fff;
		margin-top: 16rpx;
		padding: 30rpx 24rpx;
		font-size: 30rpx;
		color: #333333;
		line-height: 42rpx;
	}
	.tabActive{
		color: #FF8113;font-weight: 500;
		border-bottom: 2px solid #FF8113;
	}
	.tabline{
		padding-bottom: 8rpx;
	}
	.qwTsBox{
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.5);
		position: fixed;
		top: 0;
		left: 0;
		z-index: 111;
	}
	.qwTsTxt{
		color: #333;
		text-align: center;
		margin-top: 40vh;
		background: #fff;
		width: 60vw;
		border-radius: 10rpx;
		margin-left: calc(20vw - 30rpx);
		font-size: 30rpx;
		padding: 30rpx;
	}
</style>