deming/pageE/setting/Index.vue

<template>
	<view class="setting">
		<!-- <view class="list-item">
			<view>消息提醒</view>
			<view>
				<u-switch v-model="checked" active-color="#FF770F" inactive-color="#A9A7A7" size="35"></u-switch>
			</view>
		</view> -->
		<view v-for="(item, index) in settingList" :key="index" class="list-item" @click="toNextPage(item.link)">
			<view>{{ item.title }}</view>
			<image src="../static/mine/21.png"></image>
		</view>
        <view class="list-item" @click="clearCache">
            <view>清除缓存</view>
            <view class="left-text">{{ fileSizeString }}</view>
        </view>
		<view class="list-item" @click="sheetStatus=true">
			<view>退出登录</view>
			<image src="../static/mine/21.png"></image>
		</view>
		<u-action-sheet v-model="sheetStatus" :list="list" :tips="tips" :border-radius="20" @click="choiceOption">
		</u-action-sheet>
		<u-modal v-model="show" show-confirm-button show-cancel-button :content="content" @confirm="loginOut"></u-modal>
	</view>
</template>
<script>
	import {
		mapMutations
	} from 'vuex';
	import IMService from '@/static/imservice.js'
	export default {
		data() {
			return {
				checked: false,
				tips: {
					text: '您可选择以下操作',
					color: '#999999',
					fontSize: 24
				},
				sheetStatus: false,
				list: [
                    // {
					// 	text: '换个账号登录',
					// 	color: '#FF780F',
					// 	fontSize: 28
					// },
					{
						text: '退出登录',
						color: '#FF780F',
						fontSize: 28
					}
				],
				settingList: [{
						title: '个人信息',
						link: '../mine/MineInfo'
					},
					{
						title: '收货地址',
						link: '../more/Address'
					},
					{
						title: '证件中心',
						link: '../mine/ArticleDetails?type=1'
					},
					{
						title: '第三方绑定',
						link: './binding'
					},
					{
						title: '屏蔽用户',
						link: './ShieldUsers'
					},
					{
						title: '关于我们',
						link: '/pageE/setting/version'
					},
					{
						title: '帮助与反馈',
						link: './feedback'
					},
				],
				content: "是否退出登录！",
				show: false,
                fileSizeString: "", // 缓存大小
			}
		},
        onLoad() {
            this.getCache();
        },
		methods: {
			...mapMutations(['logout']),
			// 退出登录选择 0：切换账号 | 1：退出登录
			choiceOption(index) {
				console.log(index);
				if (index == 0) {
					this.show = true;
				}
			},
            // 获取缓存
            getCache() {
                let _this = this;
                // #ifdef APP-PLUS
                plus.cache.calculate(function(size) {
                    let sizeCache = size;
                    if (sizeCache == 0) {
                        _this.fileSizeString = "0B";
                    } else if (sizeCache < 1024) {
                        _this.fileSizeString = sizeCache + "B";
                    } else if (sizeCache < 1048576) {
                        _this.fileSizeString = (sizeCache / 1024).toFixed(2) + "KB";
                    } else if (sizeCache < 1073741824) {
                        _this.fileSizeString = (sizeCache / 1048576).toFixed(2) + "MB";
                    } else {
                        _this.fileSizeString = (sizeCache / 1073741824).toFixed(2) + "GB";
                    }
                });
                // #endif
            },
            // 清除缓存
            clearCache() {
                // #ifdef APP-PLUS
                uni.showModal({
                    title: "确定要清理缓存吗？",
                    cancelColor: "#999",
                    confirmColor: "#f00",
                    success: (res) => {
                        // console.log(res);
                        if (res.confirm) {
                            plus.cache.clear(function(e) {
                                console.log(e);
                            })
                            this.getCache();
                        }
                    }
                })
                // #endif
            },
			toNextPage(url, ...params) {
				uni.navigateTo({
					url: url
				});
			},
			async loginOut() {
				// 显示新人领取优惠券
				this.$store.commit('updateShowCoupons', true);
				let im = this.imService
				this.logout();
				uni.redirectTo({
					url: "../../pageA/login/login",
				})
			}
		},
	};
</script>
<style lang="scss" scoped>
	.setting {
		min-height: calc(100vh - var(--window-top));
		background-color: #ECECEC;

		.list-item {
			display: flex;
			align-items: center;
			justify-content: space-between;
			height: 98rpx;
			border-top: 2rpx solid #EBEBEB;
			background-color: #ffffff;
			padding: 0 30rpx;
			font-size: 30rpx;
			color: rgba(51, 51, 51, 1);

			>image {
				width: 14rpx;
				height: 24rpx;
			}
            
            .left-text {
                margin-left: auto;
                font-size: 28rpx;
            }
		}
	}
</style>