<template>
	<view>
		<z-navbar bgcolor="white" color="#333333">
			<view slot="title" class="center_title flex-n fac">
				<view class="center_title_icon icon1 iconfont"></view>
				<view class="center_title_storename ml-23">{{info.storeName}}</view>
			</view>
		</z-navbar>
		<view class="shadow-2 center_top plr-50 pb-43">
			<view class="flex-n fac fjb">
				<view class="center_top_left">
					<view class="center_top_name">{{info.userName}}</view>
					<view class="center_top_text">{{info.roleName}}</view>
					<view class="center_top_text">{{info.phone||''}}</view>
				</view>
				<image class="center_top_right" :src="info.headImageSrc||'../../../static/touxiang_2.png'"  @click="showInfo"></image>
			</view>
		</view>
		<user-info :visible.sync="showUserInfo" @changeImage="changeImage"></user-info>
		<view class="mt-50">
			<z-cell icon="iconbaobiao" v-if="!hideStateTab" :iconStyle="{'font-size': '36rpx','color':'#2d8cf0'}" label="报表统计" arrow @click.native="gotoReport"></z-cell>
			<z-cell icon="iconjuxing45" :iconStyle="{'font-size': '36rpx','color':'#2d8cf0'}" label="扫一扫" arrow @click.native="gotoScan"></z-cell>
			
			<z-cell icon="icon6" :iconStyle="{'font-size': '36rpx','color':'#2d8cf0'}" label="切换门店" arrow @click.native="tabStore"></z-cell>
			<store-list :visible.sync="showStoreList" @submit="checkedState(info)"></store-list>
			
			
			<z-cell icon="icon3" :iconStyle="{'font-size': '36rpx','color':'#2d8cf0'}" label="联系客服" arrow @click.native="showMakePhone=true"></z-cell>
			
			<z-cell icon="icon11" :iconStyle="{'font-size': '36rpx','color':'#2d8cf0'}" label="设置" arrow  @click.native="gotoSetting"></z-cell>
			<z-cell icon="iconjuxing44" :iconStyle="{'font-size': '36rpx','color':'#2d8cf0'}" label="关于刺兔APP" arrow  @click.native="gotoAbout"></z-cell>
		</view>
		<z-tabbar></z-tabbar>
		<u-toast ref="uToast"></u-toast>
		<z-select-popup :visible.sync="showMakePhone">
			<view @click="gotoMakePhone('17109909009')">17109909009</view>
			<view class="line"></view>
			<view @click="gotoMakePhone('17190909009')">17190909009</view>
		</z-select-popup>
	</view>
</template>

<script>
	const app = getApp({allowDefault: true});
	import storeList from '../../component/storeList/storeList.vue';
	import userInfo from './userInfo.vue';
	export default {
		components:{
			storeList,
			userInfo
		},
		name: 'index',
		data() {
			return {
				info:{},
				showStoreList:false,
				showUserInfo:false,
				showMakePhone:false,
				
				hideStateTab:false
			};
		},
		mounted() {
			uni.hideTabBar();
			// this.getMenu();
		},
		onShow(){
			if(uni.getStorageSync('storeInfo')){
				console.log(34)
				this.info=uni.getStorageSync('storeInfo')
				let that=this;
				if(!this.info.storeName){
					uni.getStorage({
						key:'storeInfo',
						success: (res) => {
							for(var i in res.data.store){
								if(res.data.store[i].storeId==uni.getStorageSync('storeId')){
									that.$set(that.info,'storeName',res.data.store[i].storeName);
									break;
								}
							}
							
						}
					})
				}
			}else{
				this.getData(app.globalData.userId);
			}
		
			this.getMenu();
		},
		methods:{
			getMenu(){
				uni.getStorage({
					key:'menu',
					success:(res)=>{
						console.log(res)
						if(res.data.indexOf('106')==-1){
							this.hideStateTab=true;
						}
					}
				})
			},
			changeImage(data){
				console.log(data)
				this.$set(this.info,'headImageSrc',data)
			},
			checkedState(info){
				var num=-1;
				for(var i in info.store){
					if(info.store[i].storeId==uni.getStorageSync('storeId')){
						this.info.storeName=info.store[i].storeName;
						num=i;
						break;
					}
				}
				//没有匹配门店
				if(num==-1){
					this.info.storeName=info.store[0].storeName;
					uni.setStorage({
						key:'storeId',
						data:info.store[0].storeId
					})
					uni.getStorage({
						key:'userInfo',
						success: (res) => {
							var userInfo=res.data;
							userInfo.storeId=info.store[0].storeId;
							uni.setStorage({
								key : 'userInfo',
								data:userInfo
							})
							
						}
					})
				}
			},
			getData(id){
				console.log(id)
				this.$axios.get('app/user/userInfo/'+id).then(res=>{
					console.log(res)
					this.info=res.data;
					uni.setStorage({
						key:'storeInfo',
						data:res.data
					})
					this.checkedState(res.data);
					
				}).catch(err=>{
					this.$refs.uToast.error(err.msg)
				})
			},
			gotoReport(){
				uni.navigateTo({
					url:'../report/report'
				})
			},
			tabStore(){
				this.showStoreList=true;
			},
			showInfo(){
				this.showUserInfo=true;
			},
			//拨打电话
			gotoMakePhone(phone){
				var that=this;
				uni.makePhoneCall({
				    phoneNumber: phone,
					complete:function() {
						that.showMakePhone=false;
					}
				});
			},
			//扫码
			gotoScan(){
				uni.scanCode({
					success(res){
						console.log(res.result)
					},
					fail(err){
						
					}
				})
			},
			//设置
			gotoSetting(){
				uni.navigateTo({
					url: '../setting/index',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			//关于
			gotoAbout(){
				uni.navigateTo({
					url: '../about/index',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
		}
	}
</script>

<style lang="scss">
	.center_title {
		width: 650rpx !important;
		text-align: left;

		.center_title_icon {
			width: 24rpx;
			height: 32rpx;
			font-size: 32rpx;
			color: #333333;
		}

		.center_title_storename {
			font-size: 36rpx;
			color: #333333;
		}
	}

	.center_top {
		.center_top_left {
			.center_top_name {
				font-size: 60rpx;
				font-weight: bold;
				color: #333333;
			}

			.center_top_text {
				font-size: 28rpx;
				color: #999999;
				line-height: 40rpx;
				font-weight: 500;
			}
		}

		.center_top_right {
			width: 200rpx;
			height: 200rpx;
			border-radius: 50%;
			border: 8rpx solid #eeeeee;
		}
	}
</style>
