| | |
| | | <template> |
| | | <div class="list-quatation"> |
| | | <ex-tabs @tabs="onTabs"></ex-tabs> |
| | | <!-- <ex-tabs @tabs="onTabs"></ex-tabs> --> |
| | | <van-list> |
| | | <van-cell> |
| | | <!-- <van-cell> |
| | | <div class="flex items-center w-full text-grey font-26"> |
| | | <p class="left text-left"> |
| | | <span>{{ $t('交易对') }} |
| | | <!-- <img src="./icon-sort.png" alt="icon" class="w-13 h-22"/>--> |
| | | </span> |
| | | </p> |
| | | <p class="mid text-right"> |
| | | {{ $t('最新价') }} |
| | | <!-- <img src="./icon-sort.png" alt="icon" class="w-13 h-22 ml-5"/>--> |
| | | </p> |
| | | <p class="right text-right"> |
| | | {{ active == 3 ? $t('成交额') : $t('24h涨跌幅') }} |
| | | <!-- <img src="./icon-sort.png" alt="icon" class="w-13 h-22 ml-5"/>--> |
| | | </p> |
| | | </div> |
| | | </van-cell> |
| | | </van-cell> --> |
| | | |
| | | <div class="flex items-end justify-between"> |
| | | <div class="block text-22 font-medium">行情</div> |
| | | <div class="relative text-13"> |
| | | <!-- <div class="flex px-10 justify-between rounded-full bg-black text-white min-w-100 box-border"> |
| | | <div class="block">貨幣</div> |
| | | <div class="i-material-symbols:arrow-drop-down-rounded"></div> |
| | | </div> --> |
| | | <!-- <div class="px-9 py-10 bg-black text-white flex flex-col absolute min-w-100 box-border top-25 rounded-11 leading-28" style="display: none;"> |
| | | <div>貨幣</div> |
| | | <div>數字貨幣</div> |
| | | <div>期貨</div> |
| | | <div>收藏</div> |
| | | </div> --> |
| | | </div> |
| | | </div> |
| | | |
| | | |
| | | <transition-group :name="type" tag="div"> |
| | | <div v-if="active == 0" :key="active"> |
| | | <van-cell v-for="item in listData" :key="item.id"> |
| | | <van-cell v-for="item in listData" :key="item.id" style="background-color: #f0f0f0;margin-bottom: 10px;"> |
| | | <ul class="flex justify-between w-full items-center" @click="onItemClick(item)"> |
| | | <li class="flex items-center left"> |
| | | <img |
| | |
| | | } else { |
| | | setStorage('symbol', item.symbol) |
| | | this.$router.push({ |
| | | path: `/cryptos/perpetualContract/${item.symbol}`, |
| | | path: `/foreign/deliveryContract/${item.symbol}`, |
| | | query: { type: 'cryptos' } |
| | | }); |
| | | // this.$router.push({ |
| | | // path: `/cryptos/perpetualContract/${item.symbol}`, |
| | | // query: { type: 'cryptos' } |
| | | // }); |
| | | } |
| | | }, |
| | | handleImage(url) { |
| | |
| | | </script> |
| | | <style lang="scss" scoped> |
| | | @import "@/assets/init.scss"; |
| | | @import '@/assets/css/deepseek_css_20250625_30ff932.css'; |
| | | |
| | | #cryptos { |
| | | |
| | |
| | | } |
| | | |
| | | } |
| | | |
| | | .textColor { |
| | | color: #242629; |
| | | } |
| | | |
| | | .text-grey{ |
| | | // color: #8c8c8c; |
| | | } |
| | | </style> |