<template>
	<view class="content">
		
		<!-- 用户头像名称信息 -->
			<view class="cu-list menu-avatar bg-white pad-box">
				<view v-if="userName">
					<view class="user-section">
						<view class="url">
							<image :src="userUrl" class="cu-avatar xl round"></image>
						</view>
						<view class="text-black text-sm padding binding infor-box">
							<view><text> 用户名: </text><text>{{userName}}</text></view>
							<view><text> 绑定企业: </text><text>{{list[0].content.name}}</text></view>
						</view>
					</view>
				</view>
				<view v-else>
					<button open-type="getUserInfo" bindgetuserinfo="userInfoHandler" @getuserinfo="xx">点击此处授权登录</button>
				</view>
			</view>
		
		<!-- 企业基本信息下拉上拉框 -->
		<view class="drop-box">
				<!-- <uni-section :title="item.name" type="line"></uni-section> -->
				<uni-collapse ref="add" class="warp">
					<uni-collapse-item class="content-box" v-for="(sub, key) in list" :key="key" :open="sub.open" :show-animation="sub.showAnimation" :disabled="sub.disabled" :title="sub.subName">
						<view class="content">
							<view>企业名称：<text class="con-text">{{sub.content.name}}</text></view>
							<view>联系人：<text class="con-text">{{sub.content.contacts}}</text></view>
							<view>联系电话：<text class="con-text">{{sub.content.contactPhone}}</text></view>
							<view>孵化器类型：<text class="con-text" v-if="sub.content.incubatorType == 1">实体孵化器</text><text class="con-text" v-else-if="sub.content.incubatorType == 0">虚拟孵化器</text></view>
							<view>孵化器名称：<text class="con-text">{{sub.content.incubator}}</text></view>
							<view>注册地址：<text class="con-text" v-if="sub.content.province !== undefined">{{sub.content.cities[0]}}-{{sub.content.cities[1]}}-{{sub.content.cities[2]}}</text></view>
							<view>详细地址：<text class="con-text">{{sub.content.registrationPlace}}</text></view>
							<view>注册时间：<text class="con-text">{{sub.content.registrationDate}}</text></view>
							<view>税务号：<text class="con-text">{{sub.content.theTaxNo}}</text></view>
							<view class="no-bottom">企业类型：<view class="con-text1"><text v-for="(item,index) in sub.content.category" :key="index">{{item}}</text></view></view>
							<button type="default" @click="jumpEdit">编辑企业基本信息</button>
						</view>
					</uni-collapse-item>
				</uni-collapse>
		</view>
		
		<!-- 列表 -->
		<view class="cu-list menu">
			
			<!-- 完善企业信息 -->
			<view class="cu-item arrow">
				<navigator class="content" hover-class="none" url="/pages/Binding/Binding">
					<text class="text-gray">完善企业信息</text>
				</navigator>
			</view>
			
			<!-- 我的收藏 -->
			<view class="cu-item arrow">
				<navigator class="content" hover-class="none" url="/pages/MyPages/CollectionPage">
					<!-- <text :class="item.icon"></text> -->
					<text class="text-gray">我的收藏</text>
				</navigator>
			</view>
			
			<!-- 系统消息 -->
			<view class="cu-item arrow">
				<navigator class="content" hover-class="none" url="/pages/MyPages/MessagePage">
					<!-- <text :class="item.icon"></text> -->
					<text class="text-gray">系统消息</text>
				</navigator>
			</view>
		</view>
		
		<!-- 关于我们 -->
		<view class="about">
			<navigator url="/pages/About/About">关于我们</navigator>
		</view>
	</view>
</template>

<script>
	import { userInfo } from 'api/userInfo'
	import { detail } from 'api/detail'
	export default {
		onShareAppMessage(res) {
			if (res.from === 'button') {// 来自页面内分享按钮
				console.log(res.target)
			}
			return {
				title: '',
				path: '/pages/tabBar/My'
			}
		},
		data() {
			return {
				userName:'',
				// this.$store.state.user.user.wxInfo.nickname,
				userUrl:'',
				list: [{
							type: true,
							subName: '企业基本信息',
							showAnimation: true,
							content: {}
						}]
			}
		},
		async created(){
			const that = this
			if (that.$store.state.user.user) {
				that.userName = that.$store.state.user.user.wxInfo.nickname
				that.userUrl = that.$store.state.user.user.wxInfo.headImgUrl
			}
			const params = {
				param:{
				}
			}
			const data = await detail(params)
			if(data){
				that.list[0].content = data
				console.log(data)
			}else{
				console.log('xxxs')
			}
		},
		methods: {
			async xx(e){
				const that = this
					try{
						const params = {
							"city": e.detail.userInfo.city,
							"country": e.detail.userInfo.country,
							"headImgUrl": e.detail.userInfo.avatarUrl,
							"language": e.detail.userInfo.language,
							"nickname": e.detail.userInfo.nickName,
							"province": e.detail.userInfo.province,
							"sex": e.detail.userInfo.gender
						}
						const data = await userInfo(params)
						that.userName = data.nickname
						that.userUrl = data.headImgUrl
					} catch(err){
						console.log(err)
				}
			},
			jumpEdit(local){
				const that = this
				uni.navigateTo({
					url:`/pages/Edit/Edit`
				})

				// "http://store/wx808fa75921bd8f22.o6zAJs7mfXqhm1b8GtrCMulfGIss.ZFEwiETuAsHXbd7b5cfa01dc9c19e51bcac48e9441b0.bin"
			}
		},
		watch:{
			'$store.state.user.ischange'(val){
				const that = this
				async function main(){
					const params = {
						param:{
						}
					}
					const data = await detail(params)
					that.list[0].content = data
					console.log(data)
				}
				main()
			}
		}
	}
</script>

<style lang="scss" scoped>
.pad-box{
	padding: 20upx;
}
.infor-box{
	padding: 20upx 20upx 0 20upx;
	view{
		margin: 10px 0;
		display: flex;
		
		text{
			flex: 1;
		}
	}
}
.url {
  border-radius: 50%;
  width: 120rpx;
  height: 120rpx;
  overflow: hidden;
}
.user-section {
	display: flex;
	align-items: center;
}
.drop-box{
	height: 86upx;
	margin: 10px 0;
	background-color: $white;
	display: flex;
	position: relative;
	.warp{
		flex: 1;
		z-index: 100;
	}
	view{
		flex: 1;
		z-index: 100;
		background-color: $white;
	}
}
.content-box{

	.content{
		padding: 24upx;		
		view{
			background-color: rgba(255,255,255,0);
			margin-bottom: 14px;
		}
	}
}
.con-text{
	position: absolute;
	left: 240upx;
	padding-right: 20upx;
	
	text{
		margin-right: 20upx;
	}
}
.con-text1{
	position: relative;
	top: -20px;
	left: 216upx;
	width: 486upx;
	height: auto;
	max-height: 60px;
	margin-bottom: 0 !important;
	
	text{
		margin-right: 20upx;
	}
}
.triangle{
	display: inline-flex;
	align-items: center;
	position: absolute;
	bottom: 5px;
	left: 50%;
	transform: translate3d(-50%,0,0);
}
.cu-item{
	padding-left: 15px !important;
	font-size: 12px !important;
}
.about{
	position: absolute;
	border-bottom: 2px solid $red;
	margin-left: 50%;
	bottom: 4px;
	text-align: center;
	transform: translate3d(-50%,0,0);
}
.binding{
	text-align: left;
	width: 622upx;
}
.no-bottom{
	margin-bottom: 0 !important;
}
</style>
