ec.uniapp-master/pages/user/my/setting.vue

<template>
	<view>
		<lf-nav :spreadOut="true" :showIcon="true" title="设置"></lf-nav>
		<view class="lf-p-l-32 lf-p-r-32 lf-bg-white">
			<view class="set-tag lf-border-bottom" @click="$url('/pages/user/my/editname')">
				<view class="lf-font-28 lf-color-black">
					昵称
				</view>
				<view class="lf-flex">
					<view class="lf-font-28 lf-color-555">182****5380</view><text class="lf-iconfont icon-xiangyou lf-font-24 lf-m-l-10 lf-color-777"></text>
				</view>
			</view>
		</view>
		<view class="lf-p-l-32 lf-p-r-32 lf-bg-white">
			<view class="set-tag lf-border-bottom" @click="$msg('敬请期待')">
				<view class="lf-font-28 lf-color-black">
					头像
				</view>
				<view class="lf-flex">
					<view class="lf-row-center">
						<image src="https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png" mode="aspectFill" class="set-img"></image>
					</view>
					<text class="lf-iconfont icon-xiangyou lf-font-24 lf-m-l-10 lf-color-777"></text>
				</view>
			</view>
		</view>
		<view class="lf-p-l-32 lf-p-r-32 lf-bg-white">
			<view class="set-tag lf-border-bottom" @click="$url('/pages/user/my/vipinfo')">
				<view class="lf-font-28 lf-color-black">
					会员资料
				</view>
				<view class="lf-flex">
					<text class="lf-iconfont icon-xiangyou lf-font-24 lf-m-l-10 lf-color-777"></text>
				</view>
			</view>
		</view>
		<view class="lf-p-l-32 lf-p-r-32 lf-bg-white">
			<view class="set-tag" @click="$url('/pages/address/list/list')">
				<view class="lf-font-28 lf-color-black">
					地址管理
				</view>
				<view class="lf-flex">
					<text class="lf-iconfont icon-xiangyou lf-font-24 lf-m-l-10 lf-color-777"></text>
				</view>
			</view>
		</view>
		<self-line/> 
		<view class="lf-p-l-32 lf-p-r-32 lf-bg-white">
			<view class="set-tag lf-border-bottom" @click="$url('/pages/user/my/verificationPhone')">
				<view class="lf-font-28 lf-color-black">
					修改手机号
				</view>
				<view class="lf-flex">
					<text class="lf-iconfont icon-xiangyou lf-font-24 lf-m-l-10 lf-color-777"></text>
				</view>
			</view>
		</view>
		<view class="lf-p-l-32 lf-p-r-32 lf-bg-white">
			<view class="set-tag" @click="$url('/pages/user/my/setPassword')">
				<view class="lf-font-28 lf-color-black">
					支付密码设置
				</view>
				<view class="lf-flex">
					<text class="lf-iconfont icon-xiangyou lf-font-24 lf-m-l-10 lf-color-777"></text>
				</view>
			</view>
		</view>
		<self-line/> 
		<view class="lf-p-l-32 lf-p-r-32 lf-bg-white">
			<view class="set-tag lf-border-bottom" @click="$url('/pages/user/agreement/agreement')">
				<view class="lf-font-28 lf-color-black">
					关于我们
				</view>
				<view class="lf-flex">
					<text class="lf-iconfont icon-xiangyou lf-font-24 lf-m-l-10 lf-color-777"></text>
				</view>
			</view>
		</view>
		<view class="lf-p-l-32 lf-p-r-32 lf-bg-white">
			<view class="set-tag" @click="$msg('敬请期待')">
				<view class="lf-font-28 lf-color-black">
					客服电话
				</view>
				<view class="lf-flex">
					<view class="lf-font-28 lf-color-555">0315-7483482</view><text class="lf-iconfont icon-xiangyou lf-font-24 lf-m-l-10 lf-color-777"></text>
				</view>
			</view>
		</view>
		
		<button class="set-btn" hover-class="lf-opacity" @click="signOut">退出账号</button>
	</view>
</template>

<script>
	export default {
		methods: {
			signOut(){
				// TODO 借用该按钮进入登录页，对接逻辑时删除
				// pages/user/register/register  微信
				// pages/user/loginType/loginType 手机号
				this.$url('/pages/user/register/register');
			}
		}
	}
</script>

<style>
	page{
		background-color: #F8F8F8;
	}
</style>
<style scoped lang="scss">
	.set-btn {
		width: 550rpx;
		height: 100rpx;
		background: #15716E;
		border-radius: 50rpx;
		margin: 40rpx auto;
		font-size: 32rpx;
		color: white;
		line-height: 100rpx;
	}
	.set-img {
		width: 41rpx;
		height: 41rpx;
		border-radius: 50%;
	}
	.set-tag {
		height: 100rpx;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		// border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
	}
</style>