<template>
	<view>
		<!-- 用户信息区域 -->
		<view class="userInfoWrap">
			<image src="../../static/image/del/ic_90@2x.png" mode="aspectFill"></image>
			黑河边境经济
		</view>
		<!-- 操作区域 -->
		<view class="handleWrap">
			<view class="handleItem">
				<view class="itemLeft">
					<image src="../../static/image/my/ic_20@2x.png" mode=""></image>
					消息
				</view>
				<view class="infoNum">
					7
				</view>
			</view>
			<view class="handleItem">
				<view class="itemLeft">
					<image src="../../static/image/my/ic_21@2x.png" mode=""></image>
					个人中心
				</view>
				<image src="../../static/image/ic_7@2x.png" mode=""></image>
			</view>
			<view class="handleItem">
				<view class="itemLeft">
					<image src="../../static/image/my/ic_22@2x.png" mode=""></image>
					我的产品
				</view>
				<image src="../../static/image/ic_7@2x.png" mode=""></image>
			</view>
			<view class="handleItem">
				<view class="itemLeft">
					<image src="../../static/image/my/ic_23@2x.png" mode=""></image>
					我的需求
				</view>
				<image src="../../static/image/ic_7@2x.png" mode=""></image>
			</view>
			<view class="handleItem">
				<view class="itemLeft">
					<image src="../../static/image/my/ic_24@2x.png" mode=""></image>
					厂房管理
				</view>
				<image src="../../static/image/ic_7@2x.png" mode=""></image>
			</view>
			<view class="handleItem">
				<view class="itemLeft">
					<image src="../../static/image/my/ic_25@2x.png" mode=""></image>
					操作指南
				</view>
				<image src="../../static/image/ic_7@2x.png" mode=""></image>
			</view>
			<view class="handleItem" style="border-bottom: none;">
				<view class="itemLeft">
					<image src="../../static/image/my/ic_26@2x.png" mode=""></image>
					客服电话
				</view>
				<view class="itemRight">
					<image src="../../static/image/my/ic_27@2x.png" mode=""></image>
					40046-144584
				</view>
			</view>
		</view>
		<!-- 底部按钮区域 -->
		<view class="loginBtnWrap">
			<view class="loginBtn">
				退出登录
			</view>
		</view>
		<u-tabbar
			v-model="tabBarCurrent"
			:show="show"
			:bg-color="bgColor"
			:border-top="borderTop"
			:list="tabBarList"
			:mid-button="midButton"
			:inactive-color="inactiveColor"
			:activeColor="activeColor"
		></u-tabbar>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				//底部导航栏区域 开始
				tabBarCurrent: 0,
				show: true,
				bgColor: '#ffffff',
				borderTop: true,
				tabBarList: [{
						pagePath: "pages/index/index",
						iconPath: "/static/image/ic_8@2x.png",
						selectedIconPath: "/static/image/ic_8_select@2x.png",
						text: '首页',
						customIcon: false,
					},
					{
						pagePath: "pages/demand/publish",
						iconPath: "/static/image/ic_9@2x.png",
						selectedIconPath: "/static/image/ic_9_select@2x.png",
						text: '需求',
						customIcon: false,
					},
					{
						pagePath: "pages/my/my",
						iconPath: "/static/image/ic_10@2x.png",
						selectedIconPath: "/static/image/ic_10_select@2x.png",
						text: '我的',
						customIcon: false,
					},
				],
				midButton: false,
				inactiveColor: '#909399',
				activeColor: '#5098FF',
				//底部导航栏区域 结束
			}
		}
	}
</script>

<style lang="scss" scoped>
	/* 用户信息区域 */
	.userInfoWrap{
		height: 180rpx;
		background: $uni-bg-main-color;
		padding: 0 32rpx;
		display: flex;
		align-items: center;
		image{width: 116rpx;height: 116rpx;border-radius: 50%;margin-right: 20rpx;}
		font-size: $uni-font-size-40;
		color: $uni-text-color-bai;
	}
	/* 操作区域 */
	.handleWrap{
		padding: 0 32rpx;
		.handleItem{
			height: 104rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-bottom: 2rpx solid #ebedf0;
			.itemLeft{
				display: flex;
				align-items: center;
				font-size: $uni-font-size-28;
				image{width: $uni-img-size-32;height: $uni-img-size-32;margin-right: 24rpx;}
			}
			.itemRight{
				display: flex;
				align-items: center;
				font-size: $uni-font-size-28;
				color: #969799;
				image{width: $uni-img-size-32;height: $uni-img-size-32;margin-right: 10rpx;}
			}
			.infoNum{
				width: 32rpx;
				height: 32rpx;
				background: #ff2f2f;
				border-radius: 50%;
				text-align: center;
				line-height: 32rpx;
				font-size: $uni-font-size-26;
				color: $uni-text-color-bai;
			}
			image{width: $uni-img-size-32;height: $uni-img-size-32;}
		}
	}
	/* 底部按钮区域 */
	.loginBtnWrap{
		padding-top: 100rpx;
		display: flex;
		justify-content: center;
		.loginBtn{
			width: 686rpx;
			height: 88rpx;
			background: #f7f8fa;
			border-radius: 96rpx;
			text-align: center;
			color: $uni-bg-main-color;
			line-height: 88rpx;
			font-size: $uni-font-size-32;
		}
	}
</style>