|
|
@@ -2,6 +2,7 @@
|
|
|
import { ref, computed, watch } from 'vue'
|
|
|
import { storeToRefs } from 'pinia'
|
|
|
import { useAuthStore } from '@/stores/auth'
|
|
|
+import { useRwaModalStore } from '@/stores/rwaModal'
|
|
|
import { useBrokerEntry } from '@/composables/useBrokerEntry'
|
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
|
import { useWindowScroll } from '@vueuse/core'
|
|
|
@@ -14,6 +15,7 @@ const { t } = useI18n()
|
|
|
const route = useRoute()
|
|
|
const router = useRouter()
|
|
|
const authStore = useAuthStore()
|
|
|
+const rwaModalStore = useRwaModalStore()
|
|
|
const { isLoggedIn, email, memberProfile } = storeToRefs(authStore)
|
|
|
const { logout } = authStore
|
|
|
const { y: scrollY } = useWindowScroll()
|
|
|
@@ -65,12 +67,13 @@ interface NavChild {
|
|
|
key?: string
|
|
|
label?: string
|
|
|
to: string
|
|
|
- icon?: 'ido' | 'gift'
|
|
|
+ icon?: 'ido' | 'gift' | ''
|
|
|
}
|
|
|
|
|
|
interface NavItem {
|
|
|
key: string
|
|
|
to?: string
|
|
|
+ action?: string
|
|
|
children?: NavChild[]
|
|
|
}
|
|
|
|
|
|
@@ -80,17 +83,17 @@ const navItems = computed<NavItem[]>(() => {
|
|
|
{ key: 'nav.claimAirdrop', to: '/finance/airdrop', icon: 'gift' },
|
|
|
]
|
|
|
const futuresChildren: NavChild[] = [
|
|
|
- { key: 'futuresPage.pairSearchTag.oneType', to: '/futures/BTC-USDT?filter=1' },
|
|
|
- { key: 'futuresPage.pairSearchTag.twoType', to: '/futures/BTC-USDT?filter=2' },
|
|
|
- { key: 'futuresPage.pairSearchTag.threeType', to: '/futures/BTC-USDT?filter=3' },
|
|
|
- { key: 'futuresPage.pairSearchTag.fourType', to: '/futures/BTC-USDT?filter=4' },
|
|
|
+ { key: 'futuresPage.pairSearchTag.oneType', to: '/futures/BTC-USDT?filter=1', icon: '' },
|
|
|
+ { key: 'futuresPage.pairSearchTag.threeType', to: '/futures/BTC-USDT?filter=3', icon: '' },
|
|
|
+ { key: 'futuresPage.pairSearchTag.fiveType', to: '/futures/BTC-USDT?filter=2', icon: '' },
|
|
|
+ { key: 'futuresPage.pairSearchTag.sixType', to: '/futures/BTC-USDT?filter=4', icon: '' },
|
|
|
]
|
|
|
return [
|
|
|
{ key: 'nav.home', to: '/' },
|
|
|
{ key: 'nav.market', to: '/market' },
|
|
|
{ key: 'nav.spot', to: '/spot/BTC-USDT' },
|
|
|
{ key: 'nav.futures', to: '/futures/BTC-USDT', children: futuresChildren },
|
|
|
- { key: 'nav.rwa', to: '/rwa' },
|
|
|
+ { key: 'nav.rwa', action: 'openRwaModal' },
|
|
|
{ key: 'nav.copyTrade', to: '/copy-trade' },
|
|
|
{ key: 'nav.finance', children: financeChildren },
|
|
|
{ key: 'nav.announcements', to: '/announcements' },
|
|
|
@@ -134,6 +137,12 @@ function navigate(to: string) {
|
|
|
router.push(to)
|
|
|
}
|
|
|
|
|
|
+function handleRwaClick() {
|
|
|
+ menuOpen.value = false
|
|
|
+ mobileExpandedItem.value = null
|
|
|
+ rwaModalStore.open()
|
|
|
+}
|
|
|
+
|
|
|
function toggleMobileExpand(key: string) {
|
|
|
mobileExpandedItem.value = mobileExpandedItem.value === key ? null : key
|
|
|
}
|
|
|
@@ -182,6 +191,14 @@ async function handleLogout() {
|
|
|
>
|
|
|
{{ t(item.key) }}
|
|
|
</RouterLink>
|
|
|
+ <!-- RWA 特殊处理 -->
|
|
|
+ <span
|
|
|
+ v-else-if="item.action === 'openRwaModal'"
|
|
|
+ class="nav-item"
|
|
|
+ @click="handleRwaClick"
|
|
|
+ >
|
|
|
+ {{ t(item.key) }}
|
|
|
+ </span>
|
|
|
<!-- 既有to又有子菜单(合约) -->
|
|
|
<div v-else class="nav-item-wrap--both">
|
|
|
<RouterLink
|
|
|
@@ -199,7 +216,7 @@ async function handleLogout() {
|
|
|
<div v-if="item.children" class="dropdown-panel">
|
|
|
<template v-for="(child, idx) in item.children" :key="child.to + (child.key ?? child.label ?? '')">
|
|
|
<div
|
|
|
- v-if="child.icon === 'gift' && idx > 0"
|
|
|
+ v-if="idx > 0"
|
|
|
class="dropdown-divider"
|
|
|
/>
|
|
|
<RouterLink
|
|
|
@@ -295,9 +312,17 @@ async function handleLogout() {
|
|
|
<div class="mobile-menu-body">
|
|
|
<nav class="mobile-nav">
|
|
|
<template v-for="item in navItems" :key="item.key">
|
|
|
+ <!-- RWA 特殊处理 -->
|
|
|
+ <button
|
|
|
+ v-if="item.action === 'openRwaModal'"
|
|
|
+ class="mobile-nav-item"
|
|
|
+ @click="handleRwaClick"
|
|
|
+ >
|
|
|
+ {{ t(item.key) }}
|
|
|
+ </button>
|
|
|
<!-- 无子菜单 -->
|
|
|
<button
|
|
|
- v-if="item.to"
|
|
|
+ v-else-if="item.to"
|
|
|
class="mobile-nav-item"
|
|
|
:class="{ 'is-active': isActive(item) }"
|
|
|
@click="navigate(item.to)"
|