<template>
	<view class="conatiner" :style="{paddingTop: top + 'px'}">
		<view class="header" @click="toLogin">
			<view class="avatar-container">
				<image class="avatar"
					:src="userInfo.userPic || 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/person/Group_309.png'"
					mode="" />
			</view>
			<view class="avatar_right">
				<view class="avatar_title">
					<view class="login-btn">{{userInfo.user_name ? userInfo.user_name : '登录/注册'}}</view>
					<view class="avatar_setting">
						<image src="http://127.0.0.1:5500/assets/page_user_Vector13.png" mode="" @click.stop="headerRefreshClick"/>
						<image src="http://127.0.0.1:5500/assets/page_user_Vector14.png" mode="" @click.stop="headerSettingsClick"/>
					</view>
				</view>
				<view class="avater_mobile">{{ phoneNum }}</view>
			</view>
		</view>
		<view class="section section1">
			<view class="section_label">
				<view>10010</view>
				<view>积分</view>
			</view>
			<view class="section_label">
				<view>0.00</view>
				<view>繁华币</view>
			</view>
			<view class="section_label">
				<view>0.00元</view>
				<view>物业费公积金</view>
			</view>
			<view class="section_label">
				<view>0元</view>
				<view>红包卡券</view>
			</view>
		</view>

		<!-- <view class="section">
			<view class="item" @click="handlePointsClick">
				<view class="item-content">
					<text class="item-title">积分</text>
					<text class="item-subtitle">我的剩余积分</text>
				</view>
				<image class="item-icon" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/person/5bf7d7dca1ff7_1.png">
				</image>
			</view>
			<view class="item" @click="handleSignClick">
				<view class="item-content">
					<text class="item-title">每日签到</text>
					<text class="item-subtitle">签到获取积分</text>
				</view>
				<image class="item-icon1" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/person/Group_311.png" />
			</view>
		</view> -->
		<view class="center">
			<view class="gold_container">
				<view class="gold_title">
					<span class="gold">金币</span> <span class="monenyt">0</span> | <span class="price">价值0.00元</span> <u-icon size="30" name="arrow-right" />
				</view>
				<image class="gold_pic" src="http://127.0.0.1:5500/assets/page_user_Group_1556.png" />
			</view>
			<view class="main main1">
				<view class="main_title">物业服务</view>
				<view class="item1">
					<view class="item_device" @click="handleCommunityClick">
						<image class="icon-community icon-img"
							src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/person/Group_16.png"></image>
						<text class="community-title title-item">我的社区</text>
					</view>
					<view class="item_device" @click="handleApplyOwnerClick">
						<image class="icon-owner icon-img" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/person/Frame.png" />
						<text class="owner-title title-item">申请业主</text>
					</view>
					<view class="item_device" @click="handleFacilityClick">
						<image class="icon-device icon-img" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/person/Frame_1.png"/>
						<text class="device-title title-item">我的设备</text>
					</view>
					<view class="item_device" @click="handleMeApplyClick">
						<image class="icon-device icon-img" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/Group_905.png"/>
						<text class="device-title title-item">我的申请</text>
					</view>
				</view>
			</view>
		</view>

		<view class="main margin20">
			<view class="main_title">电商服务</view>
			<view class="item1 padding_bottom0">
				<u-grid col="4" :border="false" >
				<u-grid-item  @click="headerOrderClick(item)" v-for="(item, index) in networkList" :key="index">
					<image class="nav_icon" :src="item.image" mode=""></image>
					<text class="grid-text">{{item.name}}</text>
				</u-grid-item>
			</u-grid>
			</view>
		</view>

		<view class="main margin20">
			<view class="main_title">到家服务</view>
			<view class="item1 padding_bottom0">
				<u-grid col="4" :border="false" >
				<u-grid-item  @click="headerOrderClick(item)" v-for="(item, index) in visitList" :key="index">
					<image class="nav_icon" :src="item.image" mode=""></image>
					<text class="grid-text">{{item.name}}</text>
				</u-grid-item>
			</u-grid>
			</view>
		</view>
		<view class="main margin20">
			<view class="main_title">门店服务</view>
			<view class="item1 padding_bottom0">
				<u-grid col="4" :border="false" >
				<u-grid-item  @click="headerOrderClick(item)" v-for="(item, index) in shopList" :key="index">
					<image class="nav_icon" :src="item.image" mode=""></image>
					<text class="grid-text">{{item.name}}</text>
				</u-grid-item>
			</u-grid>
			</view>
		</view>
		<view class="customer" @click="headerCustomerClick">
			<image src="http://127.0.0.1:5500/assets/page_user_Vector16.png" mode=""/>
			<view>客服</view>
		</view>
		<view style="padding-top: 174rpx;"></view>
		<nav-footer />
	</view>
</template>

<script>
	import { apiArr } from '../../api/login';
  import { menuButtonInfo, NavgateTo, picUrl, request } from '../../utils/index';
	export default {
		data() {
			return {
				top: 0,
				networkList: [{
						image: "http://127.0.0.1:5500/assets/page_user_Group_1568.png",
						name: "我的订单",
						url: "",
					},
					{
						image: "http://127.0.0.1:5500/assets/page_user_Group_1567.png",
						name: "我的拼团",
						url: "",
					},
					{
						image: "http://127.0.0.1:5500/assets/page_user_Group_1565.png",
						name: "我的收藏",
						url: "",
					},
					{
						image: "http://127.0.0.1:5500/assets/page_user_Group_1566.png",
						name: "售后服务",
						url: "",
					},
					{
						image: "http://127.0.0.1:5500/assets/page_user_Group_1563.png",
						name: "收货地址",
						url: "",
					},
					{
						image: "http://127.0.0.1:5500/assets/page_user_Group_1564.png",
						name: "购物车",
						url: "",
					},
				],
				visitList: [{
					image: "http://127.0.0.1:5500/assets/page_user_Group_1572.png",
					name: "服务工单",
					url: "",
					},
					{
						image: "http://127.0.0.1:5500/assets/page_user_Group_1573.png",
						name: "服务地址",
						url: "",
					},
					{
						image: "http://127.0.0.1:5500/assets/page_user_Group_1574.png",
						name: "服务卡",
						url: "",
					}
				],
				shopList: [{
						image: "http://127.0.0.1:5500/assets/page_user_Group_1580.png",
						name: "附近门店",
						url: "",
					},
					{
						image: "http://127.0.0.1:5500/assets/page_user_Group_1581.png",
						name: "服务券",
						url: "",
					},
					{
					image: "http://127.0.0.1:5500/assets/page_user_Group_1582.png",
					name: "支付记录",
					url: "",
					}
				],
				
				
				userInfo: {},
				isShop: false,
				phoneNum: uni.getStorageSync('phone'),
			}
		},

		methods: {	
			// 头像点击
			toLogin() {
				NavgateTo('/packages/user/replenishInfo/index');
			},

			// 刷新
			headerRefreshClick() {
				console.log('刷新')
			},

			// 设置
			headerSettingsClick() {
				console.log('设置')
				NavgateTo('/packages/user/index/index');
			},

			// 客服
			headerCustomerClick() {
				console.log('客服')
			},
			
			// 积分跳转
			handlePointsClick() {
				NavgateTo('/packages/user/points/index');
			},
			
			// 每日签到跳转
			handleSignClick() {
				NavgateTo('/packages/user/pointsSign/index');
			},
			
			// 我的社区跳转
			handleCommunityClick(){
				NavgateTo('/packages/community/index/index')
			},
			
			// 申请业主跳转
			handleApplyOwnerClick(){
				NavgateTo(`/packages/community/index/index?types=2`)
			},
			
			// 我的设备跳转
			handleFacilityClick() {
				this.NotOpen();
			},
			
			// 我的申请跳转
			handleMeApplyClick() {
				NavgateTo(`/packages/community/ownerList/index`)
			},
			
			// 我的订单跳转
			headerOrderClick(event) {
				if(!event.url) {
					this.NotOpen();
					return
				} else {
					if (!uni.getStorageSync('city')) {
						wx.showModal({
						  title: '提示',
						  content: '请先选择您的城市',
						  confirmText:"去选择",
						  complete: (res) => {
						    if (res.cancel) {}
						    if (res.confirm) {
									NavgateTo( '/pages/index/shopcity')
						    }
						  }
						})
						return
					}
					console.log('选择城市');
					NavgateTo( `${event.url}`)
				}
			},
			
			// 功能服务跳转
			headerGridItemClick(event) {
				if (!event.url) {
					this.NotOpen();
					return
				}
				// 如果点击为平台客服则允许跳转
				if (event.url === '/packages/user/customerService/index') {
					NavgateTo( event.url, { isLogin: false})
					return;
				}
				if (event.url) {
					NavgateTo( event.url)
				}
			},
			
			// 暂未开通服务弹窗
			NotOpen() {
				uni.showModal({
					title: '提示',
					content: '此功能暂未开通！',
					showCancel: false,
					complete: (res) => {
						if (res.cancel) {
		
						}
					}
				})
				return
			},
			
			
			async getUserInfo() {
				const isCtoken = uni.getStorageSync('ctoken');
				if (!isCtoken) return;
				const res = await request(apiArr.loginInfo, 'POST', {});
				const newUserInfo = {
					...res,
					userPic: res.img ? `${picUrl}${res.img}` : 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/person/Group_309.png'
				};
				this.userInfo = newUserInfo;
			},
			
		},
		onLoad() {
			const meun = menuButtonInfo();
			this.top = meun.height + meun.top;
		},
		
		onShow() {
			this.getUserInfo();
		},
	}
</script>

<style>
	@import url("./index.css");
</style>