src/views/settings/settings.vue

   1 <style scoped>
   2 .row {
   3     margin: 25px 0;
   4     display: flex;
   5     align-items: center;
   6     width: calc( 100% - 32px);
   7     height: 21px;
   8     background: #FFFFFF;
   9     border-radius: 8px;
  10     padding: 16px;
  11     cursor: pointer;
  12 }
  13 .row .label{
  14     flex-grow: 1;
  15     font-weight: 600;
  16     font-size: 15px;
  17     letter-spacing: 0.2px;
  18 }
  19 .row .value {
  20     font-weight: 300;
  21     font-size: 13px;
  22
  23     text-align: right;
  24     letter-spacing: 0.2px;
  25
  26     color: rgba(0, 0, 0, 0.36);
  27     display: flex;
  28 }
  29 .setting {
  30     margin: 5px 0 0 0;
  31     width: 110px;
  32     height: 32px;
  33     position: relative;
  34 }
  35 .form-item-content .select {
  36     height: 32px;
  37 }
  38 </style>
  39
  40 <template>
  41     <div class="warp-menu bg-grey">
  42         <div class="row" @click="$router.push({ name: 'settings-language' })">
  43             <div class="label  color-black">
  44                 <p>{{ $t("setting.lang") }}</p>
  45             </div>
  46             <div class="value">
  47                 {{ currentLanguage }} <i class="iconfont icon_arrow_1"></i>
  48             </div>
  49         </div>
  50         <div class="row" @click="$router.push({ name: 'settings-currency'})">
  51             <div class="label color-black">
  52                 <p>{{ $t("setting.currency") }}</p>
  53             </div>
  54             <div class="value">
  55                 {{ currentCurrency }} <i class="iconfont icon_arrow_1"></i>
  56             </div>
  57         </div>
  58         <div class="row" @click="$router.push({ name: 'settings-delete'})">
  59             <div class="label color-grey-36">
  60                 <p>{{ $t("setting.deleteWallet") }}</p>
  61             </div>
  62             <div class="value">
  63                 <i class="iconfont icon_arrow_1"></i>
  64             </div>
  65         </div>
  66     </div>
  67 </template>
  68
  69 <script>
  70 import { mapGetters, mapState } from 'vuex'
  71
  72 export default {
  73     name: "",
  74     data() {
  75         return {
  76         };
  77     },
  78     computed: {
  79       currentLanguage(){
  80         if(this.language === 'cn' || this.language === 'zh'){
  81           return '中文'
  82         }else{
  83           return 'English'
  84         }
  85       },
  86       currentCurrency(){
  87         const currencyList = {
  88           'inCny':"CNY",
  89           'inUsd':"USD",
  90           'inBtc':"BTC",
  91         }
  92
  93         return currencyList[this.currency]
  94       },
  95       ...mapState([
  96         'bytom'
  97       ]),
  98       ...mapGetters([
  99         'language',
 100         'currency'
 101       ])
 102     },
 103     methods: {
 104     },
 105     mounted: function () {
 106
 107     }
 108 };
 109 </script>