Initial commit

app/pages/index.vue

@@ -0,0 +1,74 @@
+<template>
+  <ClientOnly>
+    <TopMenu @changetab="changeTab" />
+  </ClientOnly>
+  <ClientOnly>
+    <div class="container blockdiv pb-2">
+      <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>
+        <a class="ml-3" @click="refresh()">
+          <SvgIcon
+            v-bind="{ name: 'refresh.svg', type: 'primary', size: 20 }"
+          ></SvgIcon>
+        </a>
+      </div>
+      <KeepAlive>
+        <component
+          :is="componentMap[vbind.component]"
+          v-bind="vbind"
+          :key="componentKey"
+          v-if="componentKey"
+        />
+      </KeepAlive>
+    </div>
+  </ClientOnly>
+</template>
+<script setup>
+const { $createMeta, $store, $copy, $id } = useNuxtApp();
+const componentMap = {};
+const componentKey = ref();
+var vbind = {};
+var tab, subtab, currentTab;
+const toPascalCase = (str) => {
+  if (!str || typeof str !== 'string') return str;
+  return str
+    .split('/')
+    .map((part) => part.charAt(0).toUpperCase() + part.slice(1))
+    .join('');
+};
+function changeTab(_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 || toPascalCase(vbind.component);
+  componentKey.value = vbind.component;
+  $store.commit('tabinfo', { tab, subtab, current: currentTab, vbind });
+  let meta = {
+    title: currentTab[$store.lang],
+    image: undefined,
+    description: 'Utopia',
+    type: 'article',
+    keywords: 'utopia',
+  };
+  useHead($createMeta(meta));
+}
+function refresh() {
+  const copy = $copy(componentKey.value) + $id();
+  componentKey.value = undefined;
+  setTimeout(() => (componentKey.value = copy));
+}
+</script>