<template>
|
<view class="pages-my">
|
<view class="group">
|
<view class="item line" @click="clickAppVersion">
|
<view>App版本：</view>
|
<view class="right">{{app_version}}</view>
|
<a>
|
<uni-icons class="icon" type="right" size="24" color="#888"></uni-icons>
|
</a>
|
</view>
|
<view class="item line" @click="clickLanguage">
|
<view>语言切换：</view>
|
<view class="right">{{languageStr}}</view>
|
<a >
|
<uni-icons class="icon" type="right" size="24" color="#888"></uni-icons>
|
</a>
|
</view>
|
|
<!-- <view class="item line">
|
<view>隐私政策：</view>
|
<view class="right"></view>
|
<a @click="clickPrivacyPolicy">
|
<uni-icons class="icon" type="right" size="24"></uni-icons>
|
</a>
|
</view>
|
<view class="item line">
|
<view>备份车辆与共享：</view>
|
<view class="right"></view>
|
<a @click="clickBackupVehicleShare">
|
<uni-icons class="icon" type="right" size="24"></uni-icons>
|
</a>
|
</view>
|
-->
|
<view class="item line" @click="clickClearCache">
|
<view>清楚缓存：</view>
|
<view class="right">{{cacheSizeStr}}</view>
|
<a >
|
<uni-icons class="icon" type="right" size="24" color="#888"></uni-icons>
|
</a>
|
</view>
|
<view class="item line" @click="clickHelp">
|
<view>帮助与反馈：</view>
|
<view class="right"></view>
|
<a>
|
<uni-icons class="icon" type="right" size="24" color="#888"></uni-icons>
|
</a>
|
</view>
|
<!-- <view class="item">
|
<view>用户协议：</view>
|
<view class="right"></view>
|
<a @click="clickUserAgreement">
|
<uni-icons class="icon" type="right" size="24" color="#888"></uni-icons>
|
</a>
|
</view> -->
|
</view>
|
|
<view class="button-group">
|
<!-- <button class="button" @click="clickModifyPassword">修改密码</button>
|
<button class="button" @click="clickChangeAccount">切换账号</button> -->
|
<a-button class="button" type="ghost" @click="clickExitAccount">退出登录</a-button>
|
</view>
|
<view>
|
<uni-popup ref="refPopupMenu" background-color="transparent" maskBackgroundColor="rgba(0, 0, 0, 0.2)">
|
<view class="popup-content" @click="closeMenu">
|
<picker-view class="popup-content-view" :indicator-style="indicatorStyle" :value="[langIndex]"
|
@change="bindLanguageChange">
|
<picker-view-column>
|
<view class="item" v-for="(item,index) in langList" :key="index">{{item.name}}</view>
|
</picker-view-column>
|
|
</picker-view>
|
</view>
|
</uni-popup>
|
</view>
|
</view>
|
</template>
|
<script>
|
import {
|
session,
|
showToast,
|
showModal
|
} from "@/comm/utils.js"
|
import {
|
Button
|
} from 'antd-mobile-vue-next'
|
export default {
|
name: "PagesMy",
|
components: {
|
'a-button': Button
|
},
|
data() {
|
return {
|
indicatorStyle: `height: 75rpx;`,
|
app_version: "1.0.0",
|
backup_vehicle_share: "",
|
langIndex: 0,
|
cache_size: 5000000,
|
langList: [{
|
value: "zh-Hans",
|
name: "中文简体"
|
}, {
|
value: "zh-Hant",
|
name: "中文繁体"
|
}, {
|
value: "en",
|
name: "English"
|
}],
|
}
|
},
|
onLoad() {
|
// this.loadData()
|
|
},
|
computed: {
|
cacheSizeStr() {
|
let size = 0
|
if (this.cache_size < 1024) {
|
size = Math.round(this.cache_size * 100)
|
return `${size/100} KB`
|
} else if (this.cache_size < 1024 * 1024) {
|
size = Math.round(this.cache_size * 100 / 1024)
|
return `${size/100} MB`
|
} else {
|
size = Math.round(this.cache_size * 100 / (1024 * 1024 * 1024))
|
return `${size/100} GB`
|
}
|
},
|
languageStr() {
|
if (this.langIndex > -1) {
|
return this.langList[this.langIndex].name || ""
|
}
|
|
|
}
|
|
},
|
onTabItemTap() {
|
this.loadData()
|
},
|
methods: {
|
setData(obj) {
|
let that = this;
|
let keys = [];
|
let val, data;
|
|
Object.keys(obj).forEach(function(key) {
|
keys = key.split(".");
|
val = obj[key];
|
data = that.$data;
|
keys.forEach(function(key2, index) {
|
if (index + 1 == keys.length) {
|
that.$set(data, key2, val);
|
} else {
|
if (!data[key2]) {
|
that.$set(data, key2, {});
|
}
|
}
|
data = data[key2];
|
});
|
});
|
},
|
loadData() {
|
const _this = this
|
|
const language = uni.getLocale()
|
this.langIndex = this.langList.findIndex((a) => a.value == language)
|
|
this.loadCache()
|
// #ifdef APP-PLUS
|
plus.runtime.getProperty(plus.runtime.appid, (info) => {
|
// console.log(info);
|
_this.setData({
|
app_version: info.version
|
})
|
});
|
//#endif
|
},
|
loadCache() {
|
const _this = this
|
uni.getStorageInfo({
|
success: (res) => {
|
_this.setData({
|
cache_size: res.currentSize
|
})
|
console.log('当前缓存大小：', res, 'KB');
|
},
|
fail: (err) => {
|
console.error('获取缓存信息失败：', err);
|
},
|
complete: () => {
|
console.log('缓存信息获取完成');
|
},
|
});
|
},
|
bindLanguageChange(e) {
|
console.log(e)
|
const val = e.detail.value
|
this.langIndex = val[0]
|
uni.setLocale(this.langList[this.langIndex].value)
|
},
|
closeMenu() {
|
this.$refs.refPopupMenu.close()
|
},
|
clickAppVersion() {
|
uni.navigateTo({
|
url: "/pages/my/version-update"
|
})
|
},
|
clickPrivacyPolicy() {
|
|
},
|
clickBackupVehicleShare() {
|
|
},
|
clickLanguage() {
|
|
this.$refs.refPopupMenu.open("right")
|
},
|
clickClearCache() {
|
try {
|
let list = session.getValue("vehicles") || []
|
const info = session.getValue("login_info")
|
uni.clearStorageSync();
|
session.setValue("vehicles", list)
|
session.setValue("login_info", info)
|
showToast("清除缓存成功！")
|
this.loadCache()
|
} catch (e) {
|
// error
|
}
|
},
|
clickHelp() {
|
uni.navigateTo({
|
url: "/pages/my/help-feedback"
|
})
|
},
|
clickUserAgreement() {
|
|
},
|
|
clickModifyPassword() {
|
|
},
|
clickChangeAccount() {
|
|
},
|
clickExitAccount() {
|
uni.reLaunch({
|
url: "/pages/login/index"
|
})
|
},
|
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.pages-my {
|
display: flex;
|
width: 750rpx;
|
height: 100vh;
|
flex-direction: column;
|
|
.group {
|
width: calc(100% - 40rpx);
|
border: 2rpx solid #ccc;
|
border-radius: 20rpx;
|
margin: 20rpx;
|
padding: 0 10rpx;
|
display: flex;
|
flex-direction: column;
|
background-color: #fff;
|
|
.item {
|
width: 100%;
|
padding: 20rpx 10rpx;
|
display: flex;
|
flex-direction: row;
|
align-items: center;
|
|
.right {
|
flex: 1;
|
text-align: right;
|
color: #888;
|
}
|
}
|
|
.line {
|
border-bottom: 2rpx solid #ccc;
|
}
|
}
|
|
|
.button-group {
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
flex-direction: column;
|
font-size: 30rpx !important;
|
|
.am-button {
|
border-radius: 30px;
|
}
|
|
.am-button-ghost {
|
border: 1px solid red !important;
|
color: red !important;
|
|
}
|
}
|
|
.button {
|
margin: auto;
|
margin-top: 20rpx;
|
border-radius: 4rpx;
|
width: 500rpx;
|
}
|
|
.popup-content {
|
display: flex;
|
justify-content: center;
|
flex-direction: column;
|
background-color: transparent;
|
}
|
|
.popup-content-view {
|
width: 150px;
|
height: 150px;
|
border-radius: 10rpx;
|
padding: 10rpx 20rpx;
|
background-color: #fff;
|
margin-top: 100px;
|
margin-right: 50px;
|
|
.item {
|
line-height: 75rpx;
|
text-align: center;
|
border: 0;
|
|
}
|
}
|
|
|
}
|
</style>
|
