yzf/pages/user/set/set.vue

<template>
	<view class="container">
		<view class="list">
			<view class="flex item" @click="navTo('/pages/user/set/userinfo')">
				<view class="left flex-start">
					<uni-icons type="person" :size="iconSize" :color="listColor"></uni-icons>
					<text class="title">
						个人信息
					</text>
				</view>
				<view class="right">
					<uni-icons type="right" :color='iconColor'></uni-icons>
				</view>
			</view>
			<!-- <view class="flex item" @click="navTo('/pages/user/set/team')">
				<view class="left flex-start">
					<uni-icons type="staff" :size="iconSize" :color="listColor"></uni-icons>
					<text class="title">
						我的推广
					</text>
				</view>
				<view class="right">
					<uni-icons type="right" :color='iconColor'></uni-icons>
				</view>
			</view> -->
			<view class="flex item" @click="navTo('/pages/user/set/shareQrCode')">
				<view class="left flex-start">
					<uni-icons type="personadd" :size="iconSize" :color="listColor"></uni-icons>
					<text class="title">
						我的推广码
					</text>
				</view>
				<view class="right">
					<uni-icons type="right" :color='iconColor'></uni-icons>
				</view>
			</view>
			<view class="flex item" @click="navTo('/pages/user/set/transaction')">
				<view class="left flex-start">
					<uni-icons type="locked" :size="iconSize" :color="listColor"></uni-icons>
					<text class="title">
						支付密码修改
					</text>
				</view>
				<view class="right">
					<uni-icons type="right" :color='iconColor'></uni-icons>
				</view>
			</view>
			<view class="flex item" @click="navTo('/pages/user/set/password')">
				<view class="left flex-start">
					<uni-icons type="locked" :size="iconSize" :color="listColor"></uni-icons>
					<text class="title">
						登录密码修改
					</text>
				</view>
				<view class="right">
					<uni-icons type="right" :color='iconColor'></uni-icons>
				</view>
			</view>
			<view class="flex item" @click="navTo('/pages/user/set/bindBank')">
				<view class="left flex-start">
					<uni-icons type="staff" :size="iconSize" :color="listColor"></uni-icons>
					<text class="title">
						我的银行卡
					</text>
				</view>
				<view class="right">
					<uni-icons type="right" :color='iconColor'></uni-icons>
				</view>
			</view>
			<!-- <view class="flex item">
				<view class="left flex-start">
					<uni-icons type="wallet" :size="iconSize" :color="listColor"></uni-icons>
					<text class="title">
						收款信息
					</text>
				</view>
				<view class="right">
					<uni-icons type="right" :color='iconColor'></uni-icons>
				</view>
			</view> -->
		</view>
		<view class="list-cell log-out-btn" @click="toLogout">
			<text class="cell-tit">{{$t('accountSettings.a9')}}</text>
		</view>
	</view>
</template>

<script>
	import { logout } from '@/api/set.js';
	import {  
	    mapMutations  
	} from 'vuex';
	export default {
		data() {
			return {
				iconSize:'20',
				listColor:'#1356FF',
				iconColor:'#999'
			};
		},
		methods:{
			...mapMutations('user',['logout']),
			navTo(url){
				uni.navigateTo({
					url:url,
					fail(red) {
						console.log(red);
					}
				})
			},
			//退出登录
			toLogout(){
				let obj = this;
				uni.showModal({
				    content: this.$t('login.b7'),
				    success: (e)=>{
				    	if(e.confirm){
							logout({}).then((e) => {
								uni.navigateBack();
							}).catch((e) => {
								console.log(e);
							})
				    		obj.logout();
				    	}
				    }
				});
			},
		}
	}
</script>

<style lang='scss'>
	page{
		background-color: #051137;
	}
	.container{
		padding: 30rpx;
	}
	.item{
		background-color: #1F2A4A;
		border-radius: 10rpx;
		padding: 20rpx 20rpx;
		color: #FFF;
		margin-bottom: 30rpx;
		.title{
			padding-left: 10rpx;
			font-size: $font-base;
		}
	}
	.list-cell{
		background: linear-gradient(90deg, #0C5AFA, #1356FF);
		text-align: center;
		color: #FFF;
		padding: 20rpx;
		line-height: 1;
		border-radius: 10rpx;
		font-size: 30rpx;
	}
</style>