| | |
| | | </template> |
| | | </van-tabbar-item> |
| | | |
| | | <van-tabbar-item name="STO" to="/ICO/ico"> |
| | | <!-- <van-tabbar-item name="STO" to="/ICO/ico"> |
| | | <span :class="[active === 'STO' ? 'active' : '']">STO</span> |
| | | <template #icon="props"> |
| | | <img :src="props.active ? icon.sto.active : icon.sto.inactive" /> |
| | | </template> |
| | | </van-tabbar-item> --> |
| | | |
| | | <van-tabbar-item name="btcusdt" to="/cryptos/trade/btcusdt"> |
| | | <span :class="[active === 'btcusdt' ? 'active' : '']">{{ $t('现货') }}</span> |
| | | <template #icon> |
| | | <img :src="active === 'btcusdt' ? icon.btcusdt.active : icon.btcusdt.inactive" /> |
| | | </template> |
| | | </van-tabbar-item> |
| | | <van-tabbar-item name="trade" to="/trade"> |
| | | <span :class="[active === 'trade' ? 'active' : '']">{{ $t('trade') }}</span> |
| | | <template #icon="props"> |
| | | <img :src="props.active ? icon.sto.active : icon.sto.inactive" /> |
| | | </template> |
| | | </van-tabbar-item> |
| | | |
| | | <van-tabbar-item name="btcusdt" to="/cryptos/trade/btcusdt"> |
| | | <span :class="[active === 'btcusdt' ? 'active' : '']">{{ $t('现货') }}</span> |
| | | <template #icon="props"> |
| | | <img :src="props.active ? icon.btcusdt.active : icon.btcusdt.inactive" /> |
| | | </template> |
| | | </van-tabbar-item> |
| | | |
| | | <!-- <van-tabbar-item name="trade" to="/trade"> |
| | | <span :class="[active === 'trade' ? 'active' : '']">{{ $t('trade') }}</span> |
| | | <template #icon="props"> |
| | | <img :src="props.active ? icon.trade.active : icon.trade.inactive" /> |
| | | </template> |
| | | </van-tabbar-item> --> |
| | | |
| | | |
| | | <!-- <van-tabbar-item name="funds" to="/cryptos/funds"> |
| | | <span>{{ $t('资金') }}</span> |
| | |
| | | </template> |
| | | </van-tabbar-item> --> |
| | | |
| | | <!-- <van-tabbar-item name="mine" to="/my"> |
| | | <van-tabbar-item name="mine" to="/my"> |
| | | <span :class="[active === 'mine' ? 'active' : '']">{{ $t('my') }}</span> |
| | | <template #icon="props"> |
| | | <img :src="props.active ? icon.mine.active : icon.mine.inactive" /> |
| | | </template> |
| | | </van-tabbar-item> --> |
| | | |
| | | <van-tabbar-item name="assets" to="/my/assets"> |
| | | <span :class="[active === 'assets' ? 'active' : '']">{{ $t('资产') }}</span> |
| | | <template #icon="props"> |
| | | <img :src="props.active ? icon.assets.active : icon.assets.inactive" /> |
| | | </template> |
| | | </van-tabbar-item> |
| | | |
| | | <!-- <van-tabbar-item name="assets" to="/my/assets"> |
| | | <span :class="[active === 'assets' ? 'active' : '']">{{ $t('资产') }}</span> |
| | | <template #icon="props"> |
| | | <img :src="props.active ? icon.assets.active : icon.assets.inactive" /> |
| | | </template> |
| | | </van-tabbar-item> --> |
| | | </van-tabbar> |
| | | </div> |
| | | </template> |
| | |
| | | } else if (route.path == "/documentation/index") { |
| | | active.value = 'documentation' |
| | | } else if (route.path == "/ICO/ico") { |
| | | active.value = 'sto' |
| | | active.value = 'STO' |
| | | } else if (route.path.indexOf('/cryptos/trade') !== -1) { |
| | | active.value = 'btcusdt' |
| | | } |
| | | let quotesStore = useQuotesStore() |
| | | |
| | |
| | | } else if (route.path == "/documentation/index") { |
| | | active.value = 'documentation' |
| | | } else if (route.path == "/ICO/ico") { |
| | | active.value = 'sto' |
| | | active.value = 'STO' |
| | | } else if (route.path.indexOf('/cryptos/trade') !== -1) { |
| | | active.value = 'btcusdt' |
| | | } |
| | | }) |
| | | // 底部列表 |
| | |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | @import '@/assets/theme/index.scss'; |
| | | |
| | | :deep(.van-tabbar-item__text) { |
| | | font-size: 12px; |
| | | color: #7f7f7f; |
| | | } |
| | | |
| | | :deep(.van-tabbar-item--active) { |
| | | background-color: $white; |
| | | @include themify() { |
| | | background-color: themed("footer_background"); |
| | | } |
| | | } |
| | | |
| | | .van-tabbar--fixed { |
| | | z-index: 10; |
| | | padding-bottom: constant(safe-area-inset-bottom); |
| | | padding-bottom: env(safe-area-inset-bottom); |
| | | background-color: $white; |
| | | @include themify() { |
| | | background-color: themed("footer_background"); |
| | | } |
| | | } |
| | | |
| | | .van-tabbar--fixed::after { |
| | | border-color: $white; |
| | | @include themify() { |
| | | border-color: themed("footer_background"); |
| | | } |
| | | } |
| | | |
| | | // .blue { |
| | |
| | | // } |
| | | |
| | | .active { |
| | | color: #292929 !important; |
| | | @include themify() { |
| | | color: themed("text_color3") !important; |
| | | } |
| | | } |
| | | |
| | | .footer { |