| | |
|---|
| | | <template> |
|---|
| | | <div class="quotes-list pt-5 pb-60 pl-5 pr-5" id="cryptos"> |
|---|
| | | <div class="quotes-list pt-5 pb-40 pl-5 pr-5" id="cryptos"> |
|---|
| | | |
|---|
| | | <Head></Head> |
|---|
| | | <list-quatation :listData="qList" /> |
|---|
| | | |
|---|
| | | <div class="tabs flex justify-start items-center textColor1"> |
|---|
| | | <div v-for="i in tabList" :key="i" :class="i.key == tab ? 'textColor' : ''" @click="tab = i.key"> |
|---|
| | | {{ i.name }} |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <list-quatation :listData="qList" :tabActive="tab" /> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | |
|---|
| | | import { useStore } from "vuex"; |
|---|
| | | import { _getHomeList } from '@/service/cryptos.api' |
|---|
| | | import { TIME_OUT } from "@/config"; |
|---|
| | | import { useI18n } from "vue-i18n"; |
|---|
| | | import ListQuatation from "@/components/Transform/list-quotation/index.vue"; |
|---|
| | | import Head from './components/head.vue' |
|---|
| | | |
|---|
| | | const store = useStore(); |
|---|
| | | console.log("aaaaaaaaaaa"); |
|---|
| | | const { t } = useI18n() |
|---|
| | | |
|---|
| | | //#region 行情数据---------------------------------------- |
|---|
| | | let qList = ref([]) |
|---|
| | |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | //#endregion---------------------------------------------- |
|---|
| | | |
|---|
| | | // tab切换 |
|---|
| | | const tab = ref(1) |
|---|
| | | const tabList = [ |
|---|
| | | { name: t('永续合约'), key: 1 }, |
|---|
| | | { name: t('现货'), key: 2 }, |
|---|
| | | ] |
|---|
| | | </script> |
|---|
| | | <style lang="scss" scoped> |
|---|
| | | .quotes-list { |
|---|
| | | background: $mainbgWhiteColor; |
|---|
| | | // background: $mainbgWhiteColor; |
|---|
| | | min-height: 100vh; |
|---|
| | | |
|---|
| | | :deep(.active) { |
|---|
| | | background-color: $bg_yellow; |
|---|
| | | border-radius: 3rem; |
|---|
| | | // border-radius: 3rem; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .tabs { |
|---|
| | | font-size: 1.8rem; |
|---|
| | | margin-bottom: -2rem; |
|---|
| | | margin-top: 2rem; |
|---|
| | | |
|---|
| | | &>div { |
|---|
| | | margin-right: 2rem; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
