|
|
@@ -5,8 +5,23 @@
|
|
|
<view class="logo-img">
|
|
|
<image src="/static/img/index/index-logo.png" mode="aspectFit"></image>
|
|
|
</view>
|
|
|
- <view class="logo-lang">
|
|
|
- <image src="/static/img/index/en.svg" mode="aspectFit"></image>
|
|
|
+ <view class="logo-lang" @click="setShowLang">
|
|
|
+ <image v-if="applicationLocale==='en'" src="/static/img/index/en.svg" mode="aspectFit"></image>
|
|
|
+ <image v-else src="/static/img/index/cn.svg" mode="aspectFit"></image>
|
|
|
+ <view class="lang-list" @click.stop v-show="showLang">
|
|
|
+ <view class="lang-item" @click.stop="onLocaleChange('en')" :class="{'lang-item-option':applicationLocale==='en'}">
|
|
|
+ <image class="image-ok" src="/static/img/index/en.svg" mode="aspectFit"></image>
|
|
|
+ <image class="image-no" src="/static/img/index/en-no.svg" mode="aspectFit"></image>
|
|
|
+ <view class="item-vertical"></view>
|
|
|
+ <view class="item-str">English</view>
|
|
|
+ </view>
|
|
|
+ <view class="lang-item" @click.stop="onLocaleChange('zh-Hans')" :class="{'lang-item-option':applicationLocale==='zh-Hans'}">
|
|
|
+ <image class="image-ok" src="/static/img/index/cn.svg" mode="aspectFit"></image>
|
|
|
+ <image class="image-no" src="/static/img/index/cn-no.svg" mode="aspectFit"></image>
|
|
|
+ <view class="item-vertical"></view>
|
|
|
+ <view class="item-str">简体中文</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="top-name">
|
|
|
@@ -66,7 +81,7 @@
|
|
|
<view><image class="title-img" mode="aspectFit" src="/static/img/index/a.png"></image></view>
|
|
|
<view class="title-str">{{$t('index.index.transaction')}}</view>
|
|
|
</view>
|
|
|
- <view class="title-all">{{$t('index.index.affirm')}}>></view>
|
|
|
+ <view class="title-all">{{$t('index.index.all')}}>></view>
|
|
|
</view>
|
|
|
<view class="list-tab">
|
|
|
<view class="tab-items">
|
|
|
@@ -94,8 +109,9 @@
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ applicationLocale:'',
|
|
|
systemLocale:'',
|
|
|
- applicationLocale: '',
|
|
|
+ showLang:false,
|
|
|
optionNum:1,
|
|
|
listTab:1
|
|
|
}
|
|
|
@@ -105,14 +121,20 @@
|
|
|
|
|
|
},
|
|
|
onLoad(query) {
|
|
|
-
|
|
|
+ this.applicationLocale = uni.getLocale();
|
|
|
},
|
|
|
mounted() {
|
|
|
|
|
|
},
|
|
|
methods: {
|
|
|
- onLocaleChange(){
|
|
|
-
|
|
|
+ setShowLang(){
|
|
|
+ this.showLang=true
|
|
|
+ },
|
|
|
+ onLocaleChange(code){
|
|
|
+ uni.setLocale(code);
|
|
|
+ this.$i18n.locale = code;
|
|
|
+ this.applicationLocale = code;
|
|
|
+ this.showLang=false
|
|
|
},
|
|
|
setOptionType(optionNum){
|
|
|
if(this.optionNum!==optionNum){
|
|
|
@@ -158,11 +180,74 @@
|
|
|
background: rgba(241,134,134,.04);
|
|
|
border-radius: 12px;
|
|
|
border: 1px solid hsla(0,0%,100%,.2);
|
|
|
+ position: relative;
|
|
|
image{
|
|
|
margin: 0 5px;
|
|
|
height: 35px;
|
|
|
width: 32px;
|
|
|
}
|
|
|
+ .lang-list{
|
|
|
+ padding: 0 10px;
|
|
|
+ position: absolute;
|
|
|
+ top: 45px;
|
|
|
+ right: 0;
|
|
|
+ height: 100px;
|
|
|
+ word-break: keep-all;
|
|
|
+ background: #f6f9ff;
|
|
|
+ border-radius: 13px;
|
|
|
+ border: 1px solid rgba(39,127,250,.64);
|
|
|
+ z-index: 99;
|
|
|
+ .lang-item{
|
|
|
+ height: 42px;
|
|
|
+ padding: 0 10px;
|
|
|
+ margin: 5px 0;
|
|
|
+ border-radius: 9px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: left;
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 18px;
|
|
|
+ image{
|
|
|
+ margin-top: 6px;
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ }
|
|
|
+ .image-ok{
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .image-no{
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ .item-vertical{
|
|
|
+ height: 20px;
|
|
|
+ width: 1px;
|
|
|
+ margin: 11px 5px 0 5px;
|
|
|
+ background: #277ffa;
|
|
|
+ }
|
|
|
+ .item-str{
|
|
|
+ color: #277ffa;
|
|
|
+ cursor: pointer;
|
|
|
+ font-size: 18px;
|
|
|
+ line-height: 42px;
|
|
|
+ text-align: left;
|
|
|
+ margin-left: 5px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .lang-item-option{
|
|
|
+ background: #277ffa;
|
|
|
+ .image-ok{
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ .image-no{
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .item-vertical{
|
|
|
+ background: #fff;
|
|
|
+ }
|
|
|
+ .item-str{
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
.top-name{
|
sys
