52 lines
1.6 KiB
Vue
52 lines
1.6 KiB
Vue
<template>
|
|
<ClientOnly>
|
|
<TopMenu @changetab="changeTab" @langChanged="changeLang" />
|
|
</ClientOnly>
|
|
<ClientOnly>
|
|
<div class="container blockdiv">
|
|
<div class="fsb-18 mb-2 has-text-black" v-if="tab">
|
|
<template v-if="subtab">
|
|
<span>{{tab[store.lang]}}</span>
|
|
<SvgIcon class="mx-2" v-bind="{name: 'right.svg', size: 17, type: 'has-text-black'}"></SvgIcon>
|
|
<span>{{subtab[store.lang]}}</span>
|
|
</template>
|
|
<span v-else>{{tab[store.lang]}}</span>
|
|
</div>
|
|
<KeepAlive>
|
|
<component :is="componentMap[vbind.component]" v-bind="vbind" :key="componentKey"/>
|
|
</KeepAlive>
|
|
</div>
|
|
</ClientOnly>
|
|
</template>
|
|
<script setup>
|
|
import { useStore } from '~/stores/index'
|
|
const store = useStore()
|
|
const { $createMeta, $id } = useNuxtApp()
|
|
const componentMap = {}
|
|
var vbind = {}
|
|
var tab, subtab, currentTab
|
|
var componentKey = ref()
|
|
const changeTab = function(_tab, _subtab) {
|
|
tab = _tab
|
|
subtab = _subtab
|
|
currentTab = subtab || tab
|
|
if(currentTab.detail) {
|
|
vbind = store.lang==='en'? currentTab.detail_en || currentTab.detail : currentTab.detail
|
|
}
|
|
componentMap[vbind.component] = vbind.base || vbind.component
|
|
componentKey.value = vbind.component
|
|
store.commit('tabinfo', {tab: tab, subtab: subtab, current: currentTab, vbind: vbind})
|
|
let meta = {
|
|
title: currentTab[store.lang],
|
|
image: undefined,
|
|
description: 'Utopia - Account',
|
|
type: 'article',
|
|
keywords: 'Utopia, account'
|
|
}
|
|
useHead($createMeta(meta))
|
|
}
|
|
function changeLang(val) {
|
|
changeTab(tab, subtab)
|
|
componentKey.value = $id()
|
|
}
|
|
</script> |