59 lines
1.0 KiB
Vue
59 lines
1.0 KiB
Vue
<template>
|
|
<view class="lang-float" :style="{ bottom: bottom }" @click="openPicker">
|
|
<text class="lang-float-txt">A/文</text>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'LanguageFloat',
|
|
props: {
|
|
bottom: {
|
|
type: String,
|
|
default: '300rpx'
|
|
}
|
|
},
|
|
methods: {
|
|
openPicker() {
|
|
const list = [
|
|
this.$t('lang.zh'),
|
|
this.$t('lang.en'),
|
|
this.$t('lang.ko'),
|
|
this.$t('lang.ja')
|
|
]
|
|
uni.showActionSheet({
|
|
itemList: list,
|
|
success: (res) => {
|
|
const locales = ['zh-Hans', 'en', 'ko', 'ja']
|
|
const loc = locales[res.tapIndex]
|
|
if (!loc) return
|
|
this.$i18n.locale = loc
|
|
uni.setStorageSync('app_locale', loc)
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.lang-float {
|
|
position: fixed;
|
|
right: 24rpx;
|
|
z-index: 998;
|
|
width: 88rpx;
|
|
height: 88rpx;
|
|
border-radius: 44rpx;
|
|
background: rgba(74, 124, 89, 0.92);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.12);
|
|
}
|
|
.lang-float-txt {
|
|
color: #fff;
|
|
font-size: 24rpx;
|
|
font-weight: 600;
|
|
}
|
|
</style>
|