|
@@ -1,121 +1,106 @@
|
|
|
<template>
|
|
|
- <view class="page">
|
|
|
- <view class="btn-list">
|
|
|
- <view class="language" data-lang="zh-CN" @tap="langChange">
|
|
|
- <text>简体中文</text>
|
|
|
- <image
|
|
|
- v-if="languageSelect == 'zh-CN'"
|
|
|
- class="selected"
|
|
|
- src="../../static/mine/326.png"
|
|
|
- mode=""
|
|
|
- ></image>
|
|
|
- </view>
|
|
|
- <view class="language" data-lang="en-US" @tap="langChange">
|
|
|
- <text>English</text>
|
|
|
- <image
|
|
|
- v-if="languageSelect == 'en-US'"
|
|
|
- class="selected"
|
|
|
- src="../../static/mine/326.png"
|
|
|
- mode=""
|
|
|
- ></image>
|
|
|
- </view>
|
|
|
- <view class="language" data-lang="es-ES" @tap="langChange">
|
|
|
- <text>Español</text>
|
|
|
- <image
|
|
|
- v-if="languageSelect == 'es-ES'"
|
|
|
- class="selected"
|
|
|
- src="../../static/mine/326.png"
|
|
|
- mode=""
|
|
|
- ></image>
|
|
|
- </view>
|
|
|
- <view class="language" data-lang="it-IT" @tap="langChange">
|
|
|
- <text>Italiano</text>
|
|
|
- <image
|
|
|
- v-if="languageSelect == 'it-IT'"
|
|
|
- class="selected"
|
|
|
- src="../../static/mine/326.png"
|
|
|
- mode=""
|
|
|
- ></image>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
+ <view class="page">
|
|
|
+ <view class="btn-list">
|
|
|
+ <view class="language" data-lang="zh-CN" @tap="langChange">
|
|
|
+ <text>简体中文</text>
|
|
|
+ <image v-if="languageSelect == 'zh-CN'" class="selected" src="../../static/mine/326.png" mode="">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <view class="language" data-lang="en-US" @tap="langChange">
|
|
|
+ <text>English</text>
|
|
|
+ <image v-if="languageSelect == 'en-US'" class="selected" src="../../static/mine/326.png" mode="">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <view class="language" data-lang="es-ES" @tap="langChange">
|
|
|
+ <text>Español</text>
|
|
|
+ <image v-if="languageSelect == 'es-ES'" class="selected" src="../../static/mine/326.png" mode="">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <view class="language" data-lang="it-IT" @tap="langChange">
|
|
|
+ <text>Italiano</text>
|
|
|
+ <image v-if="languageSelect == 'it-IT'" class="selected" src="../../static/mine/326.png" mode="">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- languageSelect: "",
|
|
|
- language: "cn",
|
|
|
- };
|
|
|
- },
|
|
|
-
|
|
|
- computed: {
|
|
|
- i18n() {
|
|
|
- return this.$t("index");
|
|
|
- },
|
|
|
- },
|
|
|
- methods: {
|
|
|
- update() {
|
|
|
- uni.$u.http
|
|
|
- .post("/api/member/update", {
|
|
|
- lang: this.language,
|
|
|
- })
|
|
|
- .then((res) => {
|
|
|
- this.$u.toast("切换成功");
|
|
|
- })
|
|
|
- .catch(() => {});
|
|
|
- },
|
|
|
- langChange(e) {
|
|
|
- const { lang } = e.currentTarget.dataset;
|
|
|
- uni.setStorageSync("language", lang);
|
|
|
- this._i18n.locale = lang;
|
|
|
- this.languageSelect = lang;
|
|
|
- if (this.languageSelect == "zh-CN") {
|
|
|
- this.language = "cn";
|
|
|
- } else if (this.languageSelect == "en-US") {
|
|
|
- this.language = "en";
|
|
|
- } else if (this.languageSelect == "es-ES") {
|
|
|
- this.language = "es";
|
|
|
- } else if (this.languageSelect == "it-IT") {
|
|
|
- this.language = "ita";
|
|
|
- }
|
|
|
- this.update();
|
|
|
- uni.setNavigationBarTitle({
|
|
|
- title: this.i18n.switchLanguage,
|
|
|
- });
|
|
|
- },
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.languageSelect = this._i18n.locale;
|
|
|
- uni.setNavigationBarTitle({
|
|
|
- title: this.i18n.switchLanguage,
|
|
|
- });
|
|
|
- },
|
|
|
-};
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ languageSelect: "",
|
|
|
+ language: "cn",
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ i18n() {
|
|
|
+ return this.$t("index");
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ update() {
|
|
|
+ uni.$u.http
|
|
|
+ .post("/api/member/update", {
|
|
|
+ lang: this.language,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ this.$u.toast("切换成功");
|
|
|
+ })
|
|
|
+ .catch(() => {});
|
|
|
+ },
|
|
|
+ langChange(e) {
|
|
|
+ const {
|
|
|
+ lang
|
|
|
+ } = e.currentTarget.dataset;
|
|
|
+ uni.setStorageSync("language", lang);
|
|
|
+ this._i18n.locale = lang;
|
|
|
+ this.languageSelect = lang;
|
|
|
+ if (this.languageSelect == "zh-CN") {
|
|
|
+ this.language = "cn";
|
|
|
+ } else if (this.languageSelect == "en-US") {
|
|
|
+ this.language = "en";
|
|
|
+ } else if (this.languageSelect == "es-ES") {
|
|
|
+ this.language = "es";
|
|
|
+ } else if (this.languageSelect == "it-IT") {
|
|
|
+ this.language = "ita";
|
|
|
+ }
|
|
|
+ this.update();
|
|
|
+ uni.setNavigationBarTitle({
|
|
|
+ title: this.i18n.switchLanguage,
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.languageSelect = this._i18n.locale;
|
|
|
+ uni.setNavigationBarTitle({
|
|
|
+ title: this.i18n.switchLanguage,
|
|
|
+ });
|
|
|
+ },
|
|
|
+ };
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
-.page {
|
|
|
- padding: 20rpx 24rpx;
|
|
|
+ .page {
|
|
|
+ padding: 20rpx 24rpx;
|
|
|
|
|
|
- .btn-list {
|
|
|
- background-color: #fff;
|
|
|
- border-radius: 16rpx;
|
|
|
- padding: 0 20rpx;
|
|
|
+ .btn-list {
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ padding: 0 20rpx;
|
|
|
|
|
|
- .language {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- height: 110rpx;
|
|
|
- border-bottom: 2rpx solid rgba(151, 151, 151, 0.2);
|
|
|
+ .language {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ height: 110rpx;
|
|
|
+ border-bottom: 2rpx solid rgba(151, 151, 151, 0.2);
|
|
|
|
|
|
- .selected {
|
|
|
- width: 36rpx;
|
|
|
- height: 36rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|
|
|
+ .selected {
|
|
|
+ width: 36rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|