digitalMen/pages/user/user.vue

<template>
	<view>
		<view class="user">

			<!-- 头部 -->
			<view class="user-wrap" style="">
				<view class="setting iconfont icon31shezhi"></view>
				<view class="info" @click="getlogin" v-if="!hasLogin">
					<image class="avatar" mode="aspectFill" src="/static/images/head.jpg"></image>
					<view class="nickname">点击立即登录/注册</view>
				</view>
				<view class="info" @click="modify" v-else>
					<image class="avatar" mode="aspectFill"
						:src="userInfo.head?userInfo.head:'/static/images/head.jpg'"></image>
					<view class="nickname1" style="align-items: center;">{{userInfo.nick?userInfo.nick:'默认用户'}}</view>
				</view>
			</view>

			<!-- 订单状态 -->
			<view class="order-status" v-if="false">
				<view class="status-wrap">
					<!-- 单元格 -->
					<view class="cell" style="background: #000000d4;height: 112rpx;">
						<view class="cell-left">
							<u-icon name="integral" color="#ffd465" size="24"></u-icon>
							<block v-if="appInfo.number_member">
								<block v-if="appInfo.number_member == 1">
									<view class="cell-text" style="color: #ffd465;font-size: 30rpx;font-weight: bold;">
										{{appInfo.number_alias?appInfo.number_alias+'：':'点数：'}}{{ userData.coin ? userData.coin : 0 }}
									</view>
								</block>
							</block>
							<block v-else>
								<view class="cell-text" style="color: #ffd465;font-size: 30rpx;font-weight: bold;">
									{{appInfo.number_alias?appInfo.number_alias+'：':'点数：'}}{{ userData.coin ? userData.coin : 0 }}
								</view>
							</block>
							<block v-if="appInfo.number_member">
								<view v-if="appInfo.time_member&&appInfo.number_member == 1&&appInfo.time_member == 1"
									class="cell-text" style="color: #ffd465;font-size: 30rpx;font-weight: bold;">|
								</view>
							</block>
							<block v-else>
								<view v-if="appInfo.time_member&&appInfo.time_member == 1" class="cell-text"
									style="color: #ffd465;font-size: 30rpx;font-weight: bold;">|</view>
							</block>
							<block v-if="appInfo.time_member && appInfo.time_member == 1">
								<view style="flex-direction: column;display: flex;">
									<view class="cell-text" style="color: #ffd465;font-size: 30rpx;font-weight: bold;">
										会员套餐：{{ userData.is_validity == 1 ? (userData.vip_time == 9999?'永久':userData.countdown+'天') : '0天' }}

									</view>
								</view>
							</block>
						</view>


						<!-- #ifdef MP-WEIXIN -->
						<navigator v-if="device != 'ios'" class="b-btn"
							:url="isLogin ? '/pages/user/member/member' : '/pages/user/signin'" @click="getroute">立即充值
						</navigator>
						<navigator v-else-if="device == 'ios'&&show_ios_pay" class="b-btn"
							:url="isLogin ? '/pages/user/member/member' : '/pages/user/signin'" @click="getroute">立即充值
						</navigator>
						<!-- #endif -->
						<!-- #ifdef H5 -->
						<navigator class="b-btn" :url="isLogin ? '/pages/user/member/member' : '/pages/user/signin'"
							@click="getroute">立即充值</navigator>
						<!-- #endif -->
					</view>


				</view>
			</view>

			<!-- 滑动导航 -->
			<!-- <view style="border-radius: 20rpx; overflow: hidden; margin: 0 20rpx;">
			<com-nav :list="list" :col="4"></com-nav>
		</view> -->
			<!-- <view class="com-item">
				<view class="com-wrap"> -->
			<!-- #ifdef MP-WEIXIN -->
			<!-- 	<view v-if="appInfo.wxad_user && appInfo.wxad_user >= 1">
						<wike-flow-main :flowtype="appInfo.wxad_user" :banner_id="appInfo.banner_id"
							:video_banner_id="appInfo.video_banner_id" :native_id="appInfo.native_id"></wike-flow-main>
					</view> -->
			<!-- #endif -->
			<!-- 		</view>
			</view>
			<view v-if="userData.vip_info&&userData.is_validity>0" class="com-item">
				<view class="com-wrap">
					<view class="cell" @click="packagedetails = true">
						<view class="cell-left">
							<u-icon name="bookmark-fill" color="#24f083" size="22"></u-icon>
							<view class="cell-text">我的会员套餐详情</view>
						</view>
						<u-icon name="arrow-right" color="#9e9e9e" size="18"></u-icon>
					</view>
				</view>
			</view> -->
			<!-- 用户功能 -->
			<view class="com-item" v-if="hasLogin">
				<view class="com-wrap">
					<!-- 	<view class="cell" @click="showcarmi = true">
						<view class="cell-left">
							<u-icon name="coupon-fill" color="#e83a30" size="22"></u-icon>
							<view class="cell-text">卡密兑换</view>
						</view>
						<u-icon name="arrow-right" color="#9e9e9e" size="18"></u-icon>
					</view> -->
					<navigator class="cell" v-for="(item, index) in userList" :key="index" :url="item.url"
						@click="getroute">
						<view class="cell-left">
							<u-icon :name="item.icon" color="#26b3a0" size="22"></u-icon>
							<view class="cell-text">{{ item.title }}</view>
						</view>
						<u-icon name="arrow-right" color="#9e9e9e" size="18"></u-icon>
					</navigator>
					<!-- <navigator class="cell" :url="isLogin ? '/pages/user/member/record' : '/pages/user/signin'"
						@click="getroute">
						<view class="cell-left">
							<u-icon name="bookmark-fill" color="#892fe8" size="22"></u-icon>
							<view class="cell-text">{{appInfo.number_alias?appInfo.number_alias:'点数'}}/会员套餐记录</view>
						</view>
						<u-icon name="arrow-right" color="#9e9e9e" size="18"></u-icon>
					</navigator> -->
				</view>
			</view>

			<!-- 用户服务 -->
			<view class="com-item">
				<!-- <view class="com-wrap" v-if="!hasLogin">
					<view class="cell" @click="getlogin">
						<view class="cell-left">
							<u-icon name="" color="#26b3a0" size="22"></u-icon>
							<view class="cell-text">立即登录</view>
						</view>
						<u-icon name="arrow-right" color="#9e9e9e" size="18"></u-icon>
					</view>
				</view> -->
				<view class="com-wrap" style="margin-top: 20rpx;">
					<view class="cell" @click="kefuCenter">
						<view class="cell-left">
							<u-icon name="server-fill" color="#26b3a0" size="22"></u-icon>
							<view class="cell-text">客服中心</view>
						</view>
						<u-icon name="arrow-right" color="#9e9e9e" size="18"></u-icon>
					</view>
				</view>

				<view class="com-wrap" v-if="hasLogin">
					<!-- 	<view class="cell" @click="loginout">
						<view class="cell-left">
							<view class="cell-text">退出登录</view>
						</view>
						<u-icon name="arrow-right" color="#9e9e9e" size="18"></u-icon>
					</view> -->

					<!-- 	<view v-if="qrcode" class="cell" @click="getqrcode">
						<view class="cell-left">
							<u-icon name="scan" color="#007aff" size="22"></u-icon>
							<view class="cell-text">关注公众号</view>
						</view>
						<u-icon name="arrow-right" color="#9e9e9e" size="18"></u-icon>
					</view> -->
					<!-- <view class="cell">
                     	<view class="cell-left">
                     		<u-icon name="minus-circle-fill" color="#26B3A0" size="22"></u-icon>
                     		<view class="cell-text">使用教程</view>
                     	</view>
                     	<u-icon name="arrow-right" color="#9e9e9e" size="18"></u-icon>
                     	<button openType="contact" style="width: 85%;  background-color: red; position: absolute; opacity: 0;height: 10%;"></button>
                     </view> -->
					<navigator class="cell" v-for="(item, index) in serverList" :key="index" :url="item.path">
						<view class="cell-left">
							<!-- <image class="cell-icon" :src="item.icon" mode="aspectFill"></image> -->
							<u-icon :name="item.icon" :color="item.color" size="22"></u-icon>
							<view class="cell-text">{{ item.title }}</view>
						</view>
						<view v-if="item.text" class="iconmore1">{{item.text}}</view>
						<u-icon v-else name="arrow-right" color="#9e9e9e" size="18"></u-icon>
					</navigator>
				</view>
			</view>
			<view class="com-item"><wike-ad></wike-ad></view>
		</view>

		<block v-if="appInfo.page_template == 3">
			<view class="top-backgroup">
				<image src='https://tnuiimage.tnkjapp.com/my/my-bg4.png' mode='widthFix' class='backgroud-image'>
				</image>
			</view>
			<view class="about__wrap" :style="{paddingTop: vuex_custom_bar_height + 'px'}">
				<!-- 图标logo/头像 -->
				<view class="tn-flex tn-flex-row-between tn-flex-col-center tn-margin-bottom"
					style="margin-top: -450rpx;">
					<view class="justify-content-item">
						<view class="tn-flex tn-flex-col-center tn-flex-row-left">
							<view class="logo-pic tn-shadow">
								<view class="logo-image">
									<image class="avatar" mode="aspectFill"
										:src="userInfo.avatar ? userInfo.avatar : '/static/images/head.jpg'"></image>
								</view>
							</view>
							<view class="tn-padding-right">
								<view class="tn-padding-right tn-padding-left-sm">
									<text
										class="tn-color-cat tn-text-xl tn-text-bold">{{ userInfo.nickname ? userInfo.nickname : '默认用户'}}</text>
									<!-- <text class=" tn-round tn-text-xs tn-bg-red tn-color-white tn-margin-left-sm" style="padding: 10rpx 20rpx;" @click="tn('/minePages/realname')">
			              未实名
			            </text> -->
								</view>
								<view class="tn-padding-right tn-padding-top-xs tn-padding-left-sm tn-text-ellipsis">
									<text class="tn-color-gray tn-padding-left-sm tn-text-sm">id编号
										{{userInfo.id_number}}</text>
								</view>
							</view>

						</view>
					</view>
				</view>
				<view class="tn-margin-top-xl">
					<view class="button-vip tn-flex tn-flex-row-between tn-flex-col-center tn-shadow-blur"
						style="background: linear-gradient(-120deg, #3E445A, #31374A, #2B3042, #262B3C);">

						<view class="tn-margin-left">
							<view class='title u-flex' style="color: #F1C68E;">
								<!-- <text class="tn-text-bold tn-text-xl">{{appInfo.number_alias?appInfo.number_alias+'：':'点数：'}}{{ userData.coin ? userData.coin : 0 }}</text> -->
								<block v-if="appInfo.number_member">
									<block v-if="appInfo.number_member == 1">
										<view class="tn-text-bold tn-text-xl">
											{{appInfo.number_alias?appInfo.number_alias+'：':'点数：'}}{{ userData.coin ? userData.coin : 0 }}
										</view>
									</block>
								</block>
								<block v-else>
									<view class="tn-text-bold tn-text-xl">
										{{appInfo.number_alias?appInfo.number_alias+'：':'点数：'}}{{ userData.coin ? userData.coin : 0 }}
									</view>
								</block>
								<block v-if="appInfo.number_member">
									<view
										v-if="appInfo.time_member&&appInfo.number_member == 1&&appInfo.time_member == 1"
										class="tn-text-bold tn-text-xl">|</view>
								</block>
								<block v-else>
									<view v-if="appInfo.time_member&&appInfo.time_member == 1"
										class="tn-text-bold tn-text-xl">|</view>
								</block>
								<block v-if="appInfo.time_member && appInfo.time_member == 1">

									<view class="tn-text-bold tn-text-xl">
										会员套餐：{{ userData.is_validity == 1 ? (userData.vip_time == 9999?'永久':userData.countdown+'天') : '0天' }}
									</view>
								</block>
								<!-- <text class="tn-icon-vip-text tn-text-center" style="position: absolute;margin: -22rpx 0 0 0;font-size: 92rpx;"></text> -->
							</view>
							<view class='tn-color-white tn-text-sm tn-padding-top-sm'>邀请好友赚取更多积分</view>
						</view>
						<view class="tn-margin-right">
							<tn-button shape="round" backgroundColor="#F1C68E" fontColor="#634738" padding="10rpx 0"
								width="160rpx" shadow
								@click="jump(isLogin ? '/pages/user/member/member' : '/pages/user/signin')">
								<!-- <text class="tn-icon-vip tn-padding-right-sm tn-text-lg"></text> -->
								<text class="tn-text-bold">充值</text>
							</tn-button>
						</view>

					</view>
				</view>
				<!-- 方式12 start-->
				<view class="about-shadow tn-margin-top-lg tn-padding-top-sm tn-padding-bottom-sm tn-bg-white">
					<view class="tn-flex tn-flex-row-center tn-radius tn-padding-top">
						<view class="tn-padding-sm tn-margin-xs tn-radius" @click="showcarmi = true">
							<view class="tn-flex tn-flex-direction-column tn-flex-row-center tn-flex-col-center">
								<view
									class="icon12__item--icon tn-flex tn-flex-row-center tn-flex-col-center tn-bg-grey--light">
									<view class="tn-icon-cube tn-color-cat"></view>
								</view>
								<view class="tn-text-center">
									<text class="tn-text-ellipsis">卡密兑换</text>
								</view>
							</view>
						</view>
						<view class="tn-padding-sm tn-margin-xs tn-radius" @click="jump('/pages/user/commission/index')"
							v-if="is_commission==1">
							<view class="tn-flex tn-flex-direction-column tn-flex-row-center tn-flex-col-center">
								<view
									class="icon12__item--icon tn-flex tn-flex-row-center tn-flex-col-center tn-bg-grey--light">
									<view class="tn-icon-signpost tn-color-cat"></view>
								</view>
								<view class="tn-text-center">
									<text class="tn-text-ellipsis">我的团队</text>
								</view>
							</view>
						</view>
						<view class="tn-padding-sm tn-margin-xs tn-radius" @click="jump('/pages/user/draw/draw')"
							v-if="appInfo.is_aipainting&&appInfo.is_aipainting == 1">
							<view class="tn-flex tn-flex-direction-column tn-flex-row-center tn-flex-col-center">
								<view
									class="icon12__item--icon tn-flex tn-flex-row-center tn-flex-col-center tn-bg-grey--light">
									<view class="tn-icon-refund tn-color-cat"></view>
								</view>
								<view class="tn-text-center">
									<text class="tn-text-ellipsis">绘画记录</text>
								</view>
							</view>
						</view>
						<view class="tn-padding-sm tn-margin-xs tn-radius"
							@click="jump('/pages/user/takenotes/takenotes')">
							<view class="tn-flex tn-flex-direction-column tn-flex-row-center tn-flex-col-center">
								<view
									class="icon12__item--icon tn-flex tn-flex-row-center tn-flex-col-center tn-bg-grey--light">
									<view class="tn-icon-constellation tn-color-cat"></view>
								</view>
								<view class="tn-text-center">
									<text class="tn-text-ellipsis">问答记录</text>
								</view>
							</view>
						</view>
					</view>
					<view class="tn-flex tn-flex-row-center tn-radius tn-padding-top">
						<view class="tn-padding-sm tn-margin-xs tn-radius" @click="jump('/pages/user/userinfo')">
							<view class="tn-flex tn-flex-direction-column tn-flex-row-center tn-flex-col-center">
								<view
									class="icon12__item--icon tn-flex tn-flex-row-center tn-flex-col-center tn-bg-grey--light">
									<view class="tn-icon-order tn-color-cat"></view>
								</view>
								<view class="tn-text-center">
									<text class="tn-text-ellipsis">修改用户信息</text>
								</view>
							</view>
						</view>
						<view class="tn-padding-sm tn-margin-xs tn-radius" @click="jump('/pages/user/member/record')">
							<view class="tn-flex tn-flex-direction-column tn-flex-row-center tn-flex-col-center">
								<view
									class="icon12__item--icon tn-flex tn-flex-row-center tn-flex-col-center tn-bg-grey--light">
									<view class="tn-icon-calendar tn-color-cat"></view>
								</view>
								<view class="tn-text-center">
									<text
										class="tn-text-ellipsis">{{appInfo.number_alias?appInfo.number_alias:'点数'}}/会员套餐记录</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="tn-margin-top-lg tn-padding-top-sm tn-padding-bottom-sm" style="padding:30rpx">
				<tn-list-cell :hover="true" :unlined="true" :radius="true" :fontSize="30" @click="getqrcode">
					<view class="tn-flex tn-flex-col-center">
						<view class="icon1__item--icon tn-flex tn-flex-row-center tn-flex-col-center"
							style="color: #7C8191;">
							<view class="tn-icon-qr-code"></view>
						</view>
						<view class="tn-margin-left-sm tn-flex-1">关注公众号</view>
						<view class="tn-color-gray tn-icon-right"></view>
					</view>
				</tn-list-cell>
				<tn-list-cell :hover="true" :unlined="true" :radius="true" :fontSize="30"
					@click="jump('/pages/user/orderrecord/orderrecord')">
					<view class="tn-flex tn-flex-col-center">
						<view class="icon1__item--icon tn-flex tn-flex-row-center tn-flex-col-center"
							style="color: #7C8191;">
							<view class="tn-icon-shopbag-fill"></view>
						</view>
						<view class="tn-margin-left-sm tn-flex-1">订单记录</view>
						<view class="tn-color-gray tn-icon-right"></view>
					</view>
				</tn-list-cell>
				<tn-list-cell :hover="true" :unlined="true" :radius="true" :fontSize="30"
					@click="jump('/pages/user/public/kefu')">
					<view class="tn-flex tn-flex-col-center">
						<!-- <view class="icon1__item--icon tn-flex tn-flex-row-center tn-flex-col-center"
							style="color: #7C8191;">
							<view class="tn-icon-science-fill "></view>
						</view> -->

						<view class="tn-margin-left-sm tn-flex-1">客服中心</view>
						<view class="tn-color-gray tn-icon-right"></view>
					</view>
				</tn-list-cell>
				<tn-list-cell :hover="true" :unlined="true" :radius="true" :fontSize="30"
					@click="jump('/pages/user/public/agreement?type=aboutus')">
					<view class="tn-flex tn-flex-col-center">
						<view class="icon1__item--icon tn-flex tn-flex-row-center tn-flex-col-center"
							style="color: #7C8191;">
							<view class="tn-icon-light-fill"></view>
						</view>
						<view class="tn-margin-left-sm tn-flex-1">关于我们</view>
						<view class="tn-color-gray tn-icon-right"></view>
					</view>
				</tn-list-cell>
				<tn-list-cell :hover="true" :unlined="true" :radius="true" :fontSize="30">
					<view class="tn-flex tn-flex-col-center">
						<view class="icon1__item--icon tn-flex tn-flex-row-center tn-flex-col-center"
							style="color: #7C8191;">
							<view class="tn-icon-expand"></view>
						</view>
						<view class="tn-margin-left-sm tn-flex-1">版本</view>
						<view>4.6.2</view>
					</view>
				</tn-list-cell>
			</view>

		</block>

		<u-popup :show="showcarmi" mode="center" :round="10" @close="showcarmi = false">
			<view class="carmimodal">
				<view class="carmiclose" @click="showcarmi = false"><u-icon name="close-circle-fill" color="#fff"
						size="22"></u-icon></view>

				<view class="carmititle">输入卡密兑换</view>
				<view class="carmiinput"><u--input placeholder="请输入卡密" border="surround" clearable
						v-model="carmi"></u--input></view>
				<view @click="exchange" class="carmiexchange">立即兑换</view>
				<view v-if="appInfo.kf_qrcode_path" class="kf_qrcode tn-flex justify-center">
					<u--image :showLoading="true" :src="appInfo.kf_qrcode_path" width="100px" height="100px"
						@click="clickuimage(appInfo.kf_qrcode_path)"></u--image>
				</view>
				<view v-if="appInfo.kf_qrcode_path" class="u-text-center">
					<!-- #ifdef MP-WEIXIN -->
					长按上方二维码，添加客服购买卡密
					<!-- #endif -->
					<!-- #ifdef H5 -->
					保存上方二维码，添加客服购买卡密
					<!-- #endif -->
				</view>
			</view>
		</u-popup>
		<u-popup :show="packagedetails" @close="packagedetails = false" :round="15" closeable>
			<view class="select u-flex justify-center"><text>我的会员套餐详情</text></view>
			<u-notice-bar speed="60"
				:text="'当会员套餐内限量次数为0后再次使用会扣除当前已经拥有的'+(appInfo.number_alias ? appInfo.number_alias : '点数')"></u-notice-bar>
			<view class="expand u-flex flex-wrap">
				<view
					v-if="userData.vip_info&&userData.vip_info.gpt35_times == -1 || userData.vip_info&&userData.vip_info.gpt35_times > 0"
					class="surplus u-flex align-center">
					<view class="item">{{appInfo.gpt35_alias ? appInfo.gpt35_alias : 'ChatGPT 3.5'}} -
						{{userData.vip_info.gpt35_type == 'time'?'每日':'总'}}限量：{{userData.vip_info.gpt35_times == -1?'无限量':userData.vip_info.gpt35_times+'次'}}({{userData.vip_info.gpt35_type == 'time'?'今日已用量：':'总用量：'}}{{userData.vip_info.gpt35_used}}次)
					</view>

				</view>
				<view
					v-if="userData.vip_info&&userData.vip_info.gpt4_times == -1 || userData.vip_info&&userData.vip_info.gpt4_times > 0"
					class="surplus u-flex align-center" style="background: #f9ae3d;">
					<view class="item">{{appInfo.gpt4_alias ? appInfo.gpt4_alias : 'ChatGPT 4.0'}} -
						{{userData.vip_info.gpt4_type == 'time'?'每日':'总'}}限量：{{userData.vip_info.gpt4_times == -1?'无限量':userData.vip_info.gpt4_times+'次'}}({{userData.vip_info.gpt4_type == 'time'?'今日已用量：':'总用量：'}}{{userData.vip_info.gpt4_used}}次)
					</view>
				</view>
				<view
					v-if="userData.vip_info&&userData.vip_info.sd_times == -1 || userData.vip_info&&userData.vip_info.sd_times > 0"
					class="surplus u-flex align-center" style="background: #3c9cff;">
					<view class="item">StableDiffusion绘图 -
						{{userData.vip_info.sd_type == 'time'?'每日':'总'}}限量：{{userData.vip_info.sd_times == -1?'无限量':userData.vip_info.sd_times+'次'}}({{userData.vip_info.sd_type == 'time'?'今日已用量：':'总用量：'}}{{userData.vip_info.sd_used}}次)
					</view>
				</view>
				<view
					v-if="userData.vip_info&&userData.vip_info.mj_times == -1 || userData.vip_info&&userData.vip_info.mj_times > 0"
					class="surplus u-flex align-center" style="background: #26b3a0;">
					<view class="item">MidJourney绘图 -
						{{userData.vip_info.mj_type == 'time'?'每日':'总'}}限量：{{userData.vip_info.mj_times == -1?'无限量':userData.vip_info.mj_times+'次'}}({{userData.vip_info.mj_type == 'time'?'今日已用量：':'总用量：'}}{{userData.vip_info.mj_used}}次)
					</view>
				</view>
			</view>
		</u-popup>
		<block v-if="is_aipainting">
			<wike-tabbar2 v-if="appInfo.page_template == 3" :is_aipainting="is_aipainting" :onTabbar="true"
				:isShowAnimate="true" :appInfos="appInfo.page_template"></wike-tabbar2>
			<wike-tabbar v-else :onTabbar="true" :is_aipainting="is_aipainting" :isShowAnimate="true"
				:appInfos="appInfo.page_template"></wike-tabbar>
		</block>
		<wike-modal-qrcode :qrcode="qrcode" :showconcern="showconcern" @concernclose="concernclose"></wike-modal-qrcode>

		<wike-tabbar :onTabbar="true" :isShowAnimate="true"></wike-tabbar>
	</view>
</template>

<script>
	import {
		mapMutations,
		mapActions,
		mapState,
		mapGetters
	} from 'vuex';
	import {
		API_ROOT
	} from '@/common/request/request';

	import {
		userInfo
	} from '@/api/my/index.js'
	let interstitialAd = null,
		timer,
		time2;
	export default {
		components: {},
		data() {
			return {
				userInfo: {},

				hasLogin: false,

				// API_ROOT: API_ROOT,
				perfectResume: false, //简历是否完善
				tobheight: 45,
				platform: this.$platform.get(),
				showrealname: false,
				showworkermy: false,
				avatar: '',
				isLoading: true,
				// userInfo: {
				// 	headPicUrl: '/static/images/user/avatar.jpg',
				// 	nickName: '史蒂芬.林'
				// },
				orderStatusList: [{
						name: '待付款',
						icon: 'iconfont icon31daifukuan',
						status: 10
					},
					{
						name: '待发货',
						icon: 'iconfont icon31daifahuo',
						status: 30
					},
					{
						name: '待收货',
						icon: 'iconfont icon31daishouhuo',
						status: 40
					},
					{
						name: '待评价',
						icon: 'iconfont icon31daipingjia',
						status: 50
					},
					{
						name: '已完成',
						icon: 'iconfont icon31yiguanzhudianpu',
						status: 55
					}
				],
				currentIndex: 0,
				list: [{
						icon: '/static/images/user/class-01.png',
						text: '我的电子券'
					},
					{
						icon: '/static/images/user/class-02.png',
						text: '退换/售后'
					},
					{
						icon: '/static/images/user/class-03.png',
						text: '我的积分'
					},
					{
						icon: '/static/images/user/class-04.png',
						text: '送礼提醒'
					}
				],
				userList: [
					// {
					// 	title: '订单记录',
					// 	icon: 'shopping-cart-fill',
					// 	path: 'coupon-fill',
					// 	url: '/pages/user/orderrecord/orderrecord',
					// 	color: '#26b3a0'
					// },
					// {
					// 	title: '问答记录',
					// 	icon: 'question-circle-fill',
					// 	path: 'collect-list',
					// 	url: '/pages/user/takenotes/takenotes',
					// 	color: '#31c9e8'
					// },
					{
						title: '修改用户信息',
						icon: 'setting-fill',
						path: 'collect-list',
						url: '/pages/user/userinfo',
						color: '#5ac725'
					},
				],
				// serverList: [{
				// 		title: '客服中心',
				// 		icon: 'server-fill',
				// 		path: '/pages/user/public/kefu',
				// 		color: '#e83a30'
				// 	},
				// 	{
				// 		title: '关于我们',
				// 		icon: 'account-fill',
				// 		path: '/pages/user/public/agreement?type=aboutus',
				// 		color: '#ffa726'
				// 	},
				// 	{
				// 		title: '版本',
				// 		icon: 'pushpin-fill',
				// 		text: '4.6.2',
				// 		color: '#24f083'
				// 	}
				// ],
				commission_setting: {},
				showcarmi: false,
				carmi: '',
				qrcode: '',
				is_aipainting: '',
				showconcern: false,
				gzhqrcode: '',
				packagedetails: false,
				plan: {},
				show_ios_pay: false,
				device: this.$platform.device(),
				// commission_alias:'分销中心'
			};
		},
		computed: {
			...mapGetters(['appInfo', 'homeTemplate', 'isLogin', 'userInfo', 'userData'])
		},

		async onShow() {
			if (uni.getStorageSync('token')) {
				this.hasLogin = true

				let res = await userInfo()

				if (res.code == 0) {
					this.userInfo = res.msg
				}
				console.log('我的-用户信息返回值：', res);
			}

			// if (this.isLogin) {
			// 	this.getUserData();
			// 	if (this.$ws.socketStatus()) {
			// 		this.$ws.completeClose();
			// 	}
			// }
			// this.systemwechat()
			// this.$store.dispatch('tabbarInit')
		},

		onLoad() {
			this.isLoading = false;
			// if (!this.isLogin) {
			// 	uni.navigateTo({
			// 		url: '/pages/user/signin'
			// 	});
			// 	uni.setStorageSync('route', '/pages/user/user');
			// }
			// this.getCommissionSetting();
			// this.getPlan();
			// this.systemwechat()
			// console.log(API_ROOT);
		},
		onReady() {
			let that = this;
			// #ifdef MP-WEIXIN
			clearTimeout(timer);
			// 在适合的场景显示插屏广告
			timer = setTimeout(function() {
				// 在页面onLoad回调事件中创建插屏广告实例
				if (wx.createInterstitialAd && that.appInfo.interstitial_status == 1) {
					interstitialAd = wx.createInterstitialAd({
						adUnitId: that.appInfo.interstitial_id
					});
					interstitialAd.onLoad(() => {});
					interstitialAd.onError(err => {});
					interstitialAd.onClose(() => {
						if (that.appInfo.interstitial_infinite_status && that.appInfo
							.interstitial_infinite_status == 1) {
							that.showInterstitial();
						} else {
							interstitialAd.show().catch(err => {
								console.error(err);
							});
						}
					});
					interstitialAd.show().catch(err => {
						console.error(err);
					});
				}
			}, 4000);
			// #endif
		},
		onUnload() {
			clearInterval(time2);
		},
		methods: {
			kefuCenter() {
				uni.navigateTo({
					url: '/pages/user/public/kefu'
				})
			},
			loginout() {
				let that = this;
				uni.showModal({
					confirmColor: '#26B3A0',
					title: '提示',
					content: '确认退出登录?',
					success: function(res) {
						if (res.confirm) {
							uni.removeStorageSync('token')
							setTimeout(() => {
								uni.reLaunch({
									url: '/pages/user/signin'
								})
							}, 1500)
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},

			...mapActions(['getUserInfo', 'showAuthModal', 'getUserData']),
			getPlan() {
				let that = this;
				this.$http('conf.getGroupConf', {
					group: 'system.plan'
				}).then(res => {
					if (res.code == 0) {
						this.plan = res.data;
						if (res.data.is_ios_pay == 1 && that.checkTimeLimit()) {
							// ios可以付钱
							that.show_ios_pay = true
						}
						// uni.setNavigationBarTitle({
						// 	title: this.appInfo.site_name
						// });
					}
				});
			},
			getlogin() {
				// console.log(2222);
				uni.navigateTo({
					url: '/pages/user/signin'
				});
				uni.setStorageSync('route', '/pages/user/user');
			},
			systemwechat() {
				this.$http('conf.getGroupConf', {
					group: 'system.wechat'
				}).then(res => {
					if (res.code == 0) {
						this.qrcode = res.data.qrcode_path
						const focuson = uni.getStorageSync('focuson');
						// console.log(focuson);
						if (!focuson) {
							if (this.qrcode) {
								if (this.isLogin && this.appInfo.is_show_logged_qrcode == 1) {
									this.showconcern = true
								}
							}
						}
					}
				})
			},
			concernclose() {
				this.showconcern = false
			},
			copyText(text) {
				uni.setClipboardData({
					data: text,
					success: function() {
						// console.log('success');
						uni.showToast({
							title: '用户编号复制成功'
						});
					}
				});
			},
			modify() {
				uni.navigateTo({
					url: '/pages/user/userinfo'
				})
			},
			clickuimage(e) {

				uni.previewImage({
					urls: [e]
				})
			},
			// systemwechat(){
			// 	this.$http('conf.getGroupConf', { group: 'system.wechat' }).then(res => {
			// 		if (res.code == 0) {
			// 			if(res.data.qrcode){
			// 				this.qrcode = res.data.qrcode_path
			// 			}
			// 		}
			// 		})
			// },
			getCommissionSetting() {
				return
				this.$http('conf.getGroupConf', {
					group: 'system.commission'
				}).then(res => {
					if (res.code == 0) {
						uni.setNavigationBarTitle({
							title: this.appInfo.site_name
						});
						// this.is_aipainting = this.appInfo.is_aipainting
						if (res.data.is_commission == 1) {
							let obj = {
								title: res.data.commission_alias ? res.data.commission_alias : '分销中心',
								icon: 'grid-fill',
								path: 'address-list',
								url: '/pages/user/commission/index',
								color: '#ffca28'
							};
							this.userList.splice(0, 0, obj);
						}
						if (this.appInfo.is_aipainting && this.appInfo.is_aipainting == 1) {
							let draw = {
								title: '绘画记录',
								icon: 'edit-pen-fill',
								path: 'address-list',
								url: '/pages/user/draw/draw',
								color: '#3c9cff'
							};
							this.userList.splice(1, 0, draw);
							this.is_aipainting = '1'
						} else {
							this.is_aipainting = '2'
						}

					}
				});
			},
			getroute() {
				if (!this.isLogin) {
					uni.setStorageSync('route', '/pages/user/user');
				}
			},
			exchange() {
				if (!this.isLogin) {
					uni.navigateTo({
						url: '/pages/user/signin'
					});
					uni.setStorageSync('route', '/pages/user/user');
					return;
				}
				uni.showLoading({
					title: '卡密兑换中...'
				});
				this.$http('member.kami', {
					code: this.carmi
				}).then(res => {
					if (res.code == 0) {
						uni.showToast({
							title: '兑换成功'
						});
						this.getUserData();
						this.showcarmi = false;
					}
				});
			},
			getuserinfo() {
				uni.navigateTo({
					url: '/pages/user/userinfo'
				});
			},
			getPersonalRealNameInfo() {
				this.$http('vertify.getPersonalRealNameInfo').then(res => {
					if (res.code == 0) {
						this.showrealname = false;
					} else {
						this.showrealname = true;
					}
				});
			},
			jump(e) {
				console.log(e);
				uni.navigateTo({
					url: e
				})
			},
			workermy() {
				this.$http('worker.my').then(res => {
					if (res.code == 0) {
						if (res.data.name) {
							this.showworkermy = true;
						} else {
							this.showworkermy = false;
						}
					} else {
						this.showworkermy = false;
					}
				});
			},
			getfeedback() {
				uni.showModal({
					content: '请联系客服,提供您的宝贵意见',
					title: '提示',
					confirmText: '联系客服',
					confirmColor: '#00ca88',
					success(res) {
						if (res.confirm) {
							uni.navigateTo({
								url: '/pages/user/public/kefu'
							});
						}
					}
				});
			},
			getqrcode() {
				// console.log(this.qrcode);
				uni.previewImage({
					urls: [this.qrcode]
				})
			},
			showInterstitial() {
				time2 = setInterval(
					function() {
						interstitialAd.show().catch(err => {
							console.error(err);
						});
					},
					this.appInfo.gap ? this.appInfo.gap * 1000 : 12000
				);
			}
		}
	};
</script>
<style lang="scss">
	page {
		background: #f2f2f2;
	}

	.btn-hover {
		background: #f2f2f2 !important;
	}

	.user {
		// height: 1800rpx;
		padding-bottom: 200rpx;

		.user-wrap {
			display: flex;
			justify-content: center;
			align-items: center;
			height: 56vw;
			padding: 30rpx;
			z-index: 9;
			// border-radius: 0 0 20% 20%;
			background: url('@/static/images/user_bg.jpg') no-repeat;
			background-size: cover;

			.setting {
				color: #fff;
				position: absolute;
				top: 60rpx;
				left: 60rpx;
				font-size: 50rpx;
			}

			.info {
				position: absolute;
				text-align: center;

				.avatar {
					width: 150rpx;
					height: 150rpx;
					border-radius: 50%;
					border: 4px solid #fff;
				}

				.nickname {
					color: #fff;
					font-size: 30rpx;
					margin-top: 20rpx;
					font-weight: bold;
					display: flex;
				}

				.nickname1 {
					color: #fff;
					font-size: 30rpx;
					margin-top: 20rpx;
					font-weight: bold;
					// display: flex;
				}
			}
		}

		.order-status {
			padding: 0 30rpx;
			margin-top: -8vw;

			.status-wrap {
				border-radius: 25rpx;
				overflow: hidden;

				.status-list {
					display: flex;
					justify-content: space-evenly;
					align-items: center;
					background: #fff;
					padding-top: 30rpx;
					padding-bottom: 30rpx;

					.status-item {
						flex: 1;
						display: flex;
						flex-direction: column;
						justify-content: center;
						align-items: center;

						.item-icon {
							line-height: 1;
							font-size: 65rpx;
							color: #bbb;
						}

						.item-text {
							font-size: 28rpx;
							color: #666;
							margin-top: 5rpx;
						}
					}
				}
			}
		}

		.com-item {
			padding-left: 30rpx;
			padding-right: 30rpx;
			margin-top: 20rpx;

			.com-wrap {
				border-radius: 25rpx;
				overflow: hidden;
			}
		}

		.cell {
			height: 110rpx;
			padding-left: 30rpx;
			padding-right: 30rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			background: #fff;
			border-bottom: 1px solid #f8f8f8;

			&:active {
				background: #f2f2f2;
			}

			&:last-child {
				border-bottom: none !important;
			}

			.cell-left {
				display: flex;
				align-items: center;

				.cell-icon {
					width: 50rpx;
					height: 50rpx;
				}

				.cell-text {
					color: #666;
					font-size: 32rpx;
					margin-left: 20rpx;
					// font-size: 30rpx;
				}
			}

			.iconfont {
				font-size: 40rpx;
				color: #999;
			}
		}
	}

	.b-btn {
		// position: absolute;
		// right: 20upx;
		// top: 24upx;
		width: 132upx;
		height: 50upx;
		text-align: center;
		line-height: 50upx;
		font-size: 24upx;
		color: #36343c;
		border-radius: 30px;
		background: #ffd465;
		z-index: 1;
	}

	.carmimodal {
		width: 600rpx;
		border-radius: 20rpx;
		position: relative;

		.carmiclose {
			position: absolute;
			right: 15rpx;
			top: 15rpx;
		}

		.carmititle {
			background: linear-gradient(to right, #00ca88, #00BCD4);
			color: #fff;
			height: 120rpx;
			line-height: 120rpx;
			font-size: 32rpx;
			font-weight: bold;
			text-align: center;
			border-radius: 20rpx 20rpx 0 0;
			margin-bottom: 60rpx;
		}

		.carmiinput {
			margin: 30rpx;
		}

		.carmiexchange {
			margin: 80rpx 30rpx 90rpx 30rpx;
			background: linear-gradient(to right, #00ca88, #00BCD4);
			color: #fff;
			border-radius: 80rpx;
			height: 80rpx;
			line-height: 80rpx;
			text-align: center;
		}

		.kf_qrcode {
			// margin-left: 200rpx;
			margin-bottom: 30rpx;
		}
	}

	/* 顶部背景图 start */
	.top-backgroup {
		height: 450rpx;
		z-index: -1;

		.backgroud-image {
			width: 100%;
			height: 450rpx;
			// z-index: -1;
		}
	}

	/* 顶部背景图 end */
	.mine {
		max-height: 100vh;
	}

	/* 底部安全边距 start*/
	.tn-tabbar-height {
		min-height: 120rpx;
		height: calc(140rpx + env(safe-area-inset-bottom) / 2);
		height: calc(140rpx + constant(safe-area-inset-bottom));
	}

	.tn-color-cat {
		color: #1D2541;
	}

	.tn-bg-cat {
		background-color: #1D2541;
	}


	/* 自定义导航栏内容 start */
	.custom-nav {
		height: 100%;

		&__back {
			margin: auto 5rpx;
			font-size: 40rpx;
			margin-right: 10rpx;
			flex-basis: 5%;
			width: 100rpx;
			position: absolute;
		}
	}

	/* 自定义导航栏内容 end */


	/* 顶部背景图 end */


	/* 用户头像 start */
	.logo-image {
		width: 110rpx;
		height: 110rpx;
		position: relative;
		overflow: hidden;
		border-radius: 50%;
	}

	.logo-pic {
		background-size: cover;
		background-repeat: no-repeat;
		// background-attachment:fixed;
		background-position: top;
		border: 8rpx solid rgba(255, 255, 255, 0.05);
		box-shadow: 0rpx 0rpx 80rpx 0rpx rgba(0, 0, 0, 0.15);
		border-radius: 50%;
		overflow: hidden;
		// background-color: #FFFFFF;
	}

	/* 页面 start*/
	.about-shadow {
		border-radius: 15rpx;
		box-shadow: 0rpx 0rpx 50rpx 0rpx rgba(0, 0, 0, 0.07);
	}

	.about {

		&__wrap {
			position: relative;
			z-index: 1;
			margin: 20rpx 30rpx;
		}
	}

	/* 页面 end*/

	/* 图标容器15 start */
	.icon15 {
		&__item {
			width: 30%;
			background-color: #FFFFFF;
			border-radius: 10rpx;
			padding: 30rpx;
			margin: 20rpx 10rpx;
			transform: scale(1);
			transition: transform 0.3s linear;
			transform-origin: center center;

			&--icon {
				width: 100rpx;
				height: 100rpx;
				font-size: 60rpx;
				border-radius: 50%;
				margin-bottom: 18rpx;
				position: relative;
				z-index: 1;

				&::after {
					content: " ";
					position: absolute;
					z-index: -1;
					width: 100%;
					height: 100%;
					left: 0;
					bottom: 0;
					border-radius: inherit;
					opacity: 1;
					transform: scale(1, 1);
					background-size: 100% 100%;


				}
			}
		}
	}

	/* 图标容器12 start */
	.tn-three {
		position: absolute;
		top: 50%;
		right: 50%;
		bottom: 50%;
		left: 50%;
		transform: translate(-38rpx, -16rpx) rotateX(30deg) rotateY(20deg) rotateZ(-30deg);
		text-shadow: -1rpx 2rpx 0 #f0f0f0, -2rpx 4rpx 0 #f0f0f0, -10rpx 20rpx 30rpx rgba(0, 0, 0, 0.2);
	}

	.icon20 {
		&__item {
			width: 30%;
			background-color: #FFFFFF;
			border-radius: 10rpx;
			padding: 30rpx;
			margin: 20rpx 10rpx;
			transform: scale(1);
			transition: transform 0.3s linear;
			transform-origin: center center;

			&--icon {
				width: 100rpx;
				height: 100rpx;
				font-size: 60rpx;
				border-radius: 50%;
				margin-bottom: 18rpx;
				position: relative;
				z-index: 1;

				&::after {
					content: " ";
					position: absolute;
					z-index: -1;
					width: 100%;
					height: 100%;
					left: 0;
					bottom: 0;
					border-radius: inherit;
					opacity: 1;
					transform: scale(1, 1);
					background-size: 100% 100%;
					background-image: url(https://tnuiimage.tnkjapp.com/cool_bg_image/icon_bg.png);
				}
			}
		}
	}



	.button-vip {
		width: 100%;
		height: 150rpx;
		border-radius: 15rpx;
		position: relative;
		z-index: 1;

		&::after {
			content: " ";
			position: absolute;
			z-index: -1;
			width: 100%;
			height: 100%;
			left: 0;
			bottom: 0;
			border-radius: inherit;
			opacity: 1;
			transform: scale(1, 1);
			background-size: 100% 100%;
			background-image: url(https://tnuiimage.tnkjapp.com/cool_bg_image/icon_bg.png);
		}
	}


	/* 图标容器12 start */
	.icon12 {
		&__item {
			width: 30%;
			background-color: #FFFFFF;
			border-radius: 10rpx;
			padding: 30rpx;
			margin: 20rpx 10rpx;
			transform: scale(1);
			transition: transform 0.3s linear;
			transform-origin: center center;

			&--icon {
				width: 15rpx;
				height: 15rpx;
				font-size: 50rpx;
				border-radius: 50%;
				margin-bottom: 38rpx;
				position: relative;
				z-index: 1;

				&::after {
					content: " ";
					position: absolute;
					z-index: -1;
					width: 100%;
					height: 100%;
					left: 0;
					bottom: 0;
					border-radius: inherit;
					opacity: 1;
					transform: scale(1, 1);
					background-size: 100% 100%;

				}
			}
		}
	}

	/* 图标容器1 start */
	.icon1 {
		&__item {
			// width: 30%;
			background-color: #FFFFFF;
			border-radius: 10rpx;
			padding: 30rpx;
			margin: 20rpx 10rpx;
			transform: scale(1);
			transition: transform 0.3s linear;
			transform-origin: center center;

			&--icon {
				width: 40rpx;
				height: 40rpx;
				font-size: 40rpx;
				border-radius: 50%;
				position: relative;
				z-index: 1;

				&::after {
					content: " ";
					position: absolute;
					z-index: -1;
					width: 100%;
					height: 100%;
					left: 0;
					bottom: 0;
					border-radius: inherit;
					opacity: 1;
					transform: scale(1, 1);
					background-size: 100% 100%;
					background-image: url(https://tnuiimage.tnkjapp.com/cool_bg_image/icon_bg.png);
				}
			}
		}
	}

	.avatar {
		width: 110rpx;
		height: 110rpx;
		border-radius: 50%;
		border: 3px solid #fff;
	}

	.iconmore1 {
		font-size: 24rpx;
	}

	.select {
		font-weight: bold;
		font-size: 32rpx;
		margin: 30rpx;
	}

	.expand {
		// margin: 30rpx;
		// position: relative;
		padding: 30rpx;

		// background: linear-gradient(to right, #00ca88, #00BCD4);
		.surplus {
			color: #fff;
			font-size: 26rpx;
			background: #e11462bf;
			border-radius: 50rpx;
			padding: 8rpx 12rpx;
			margin-right: 20rpx;
			margin-bottom: 15rpx;

			.item {
				margin-left: 10rpx;
			}
		}
	}
</style>