<template>
	<view class="title">
		<view class="padding">
			<view class="text-center">我的</view>
			<view class="flex justify-around" style="padding-top:60rpx;" >
				<view class="flex">
					<view class="cu-avatar xl round margin-left" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big99008.jpg);"></view>
					<view>
						<view>测试</view>
						<view>17374339800</view>
					</view>
				</view>
				<button class="bg-blue round cu-btn">编辑资料</button>
			</view>
		</view>
		
	</view>
	<view class="padding page">
		<view class="padding bg-white radius">
			<view class="flex justify-between padding-bottom solid-bottom">
				<view class="flex " @click="Helpcenter()">
					<image src="/static/my/Helpcenter.png" style="width:40rpx;height: 40rpx;"></image>
					<view class="margin-left">帮助中心</view>
				</view>
				<view class="lg text-gray cuIcon-right"></view>
			</view>
			<view class="flex justify-between padding-bottom padding-top solid-bottom">
				<view class="flex">
					<image src="/static/my/CustomerService.png" style="width:40rpx;height: 40rpx;"></image>
					<view  class="margin-left">智能客服</view>
				</view>
				<view class="lg text-gray cuIcon-right"></view>
			</view>
			<view class="flex justify-between  padding-bottom padding-top solid-bottom">
				<view class="flex" @click="Account()">
					<image src="/static/my/Account.png" style="width:40rpx;height: 40rpx;"></image>
					<view  class="margin-left">账号安全</view>
				</view>
				<view class="lg text-gray cuIcon-right"></view>
			</view>
			<view class="flex justify-between  padding-bottom padding-top solid-bottom">
				<view class="flex" @click="notification()">
					<image src="/static/my/Notification.png" style="width:40rpx;height: 40rpx;"></image>
					<view  class="margin-left">新消息通知</view>
				</view>
				<view class="lg text-gray cuIcon-right"></view>
			</view>
			<view class="flex justify-between  padding-bottom padding-top solid-bottom">
				<view class="flex">
					<image src="/static/my/Delete.png" style="width:40rpx;height: 40rpx;"></image>
					<view  class="margin-left">清除缓存</view>
				</view>
				<view class="lg text-gray cuIcon-right"></view>
			</view>
			<view class="flex justify-between  padding-bottom padding-top solid-bottom">
				<view class="flex" @click="Settings()">
					<image src="/static/my/Settings.png" style="width:40rpx;height: 40rpx;"></image>
					<view  class="margin-left">通用设置</view>
				</view>
				<view class="lg text-gray cuIcon-right"></view>
			</view>
			<view class="flex justify-between  padding-bottom padding-top solid-bottom">
				<view class="flex">
					<image src="/static/my/Helpcenter.png" style="width:40rpx;height: 40rpx;"></image>
					<view  class="margin-left">关于</view>
				</view>
				<view class="lg text-gray cuIcon-right"></view>
			</view>
		</view>
		<button class=" bg-blue round margin-top-xl " @click="handleLogout()">退出登录</button>
	</view>
	
</template>

<script setup>
	import { ref } from 'vue'
	//帮助中心
	const Helpcenter = () => {
		uni.navigateTo({
			url:'/pages/personalcenter/helpcenter'
		})
	}	
	//新消息通知
	const notification = () => {
		uni.navigateTo({
			url:'/pages/personalcenter/notification'
		})
	}
	//通用设置
	const Settings = () => {
		uni.navigateTo({
			url:'/pages/personalcenter/settings'
		})
	}
	//账号安全
	const Account = () => {
		uni.navigateTo({
			url:'/pages/personalcenter/account'
		})
	}
	//退出登录
	const handleLogout = () => {
		uni.showModal({
			title: '提示',
			content: '确定要退出登录吗？',
			success: function (res) {
				if (res.confirm) {
					console.log('用户点击确定');
					uni.clearStorageSync()
					uni.reLaunch({
						url:'/pages/login/login'
					})
				} else if (res.cancel) {
					console.log('用户点击取消');
				}
			}
		});
	}
	
</script>

<style lang="scss" scoped>
	.page {
			// min-height: 100vh;
			background: #EBF2FC;
		}
		.title {
			height: 516rpx;
			background: radial-gradient( 0% 0% at 78% 8%, #2667E9 0%, #FDFDFD 100%, #719BF0 100%);
		}
</style>