测试 前端

package.json

@@ -13,6 +13,7 @@
     "format": "prettier --write src/"
   },
   "dependencies": {
+    "@vicons/ionicons5": "^0.12.0",
     "autoprefixer": "^10.4.18",
     "axios": "^1.6.8",
     "keycloak-js": "^24.0.1",

src/assets/main.css

@@ -4,4 +4,14 @@
 
 body {
     text-rendering: optimizeLegibility;
+}
+
+.fade-enter-active,
+.fade-leave-active {
+    transition: opacity 0.15s ease-in-out;
+}
+
+.fade-enter-from,
+.fade-leave-to {
+    opacity: 0;
 }

src/components/Container.vue

@@ -0,0 +1,144 @@
+<script setup lang="ts">
+import {NIcon, NLayout, NLayoutSider, NMenu} from "naive-ui"
+import {RouterView} from "vue-router"
+import type { MenuOption } from 'naive-ui'
+import { RouterLink } from 'vue-router'
+import {type Component, defineComponent, h} from 'vue'
+import {
+  BookOutline as BookIcon,
+  PersonOutline as PersonIcon,
+  WineOutline as WineIcon,
+  HomeOutline as HomeIcon
+} from '@vicons/ionicons5'
+function renderIcon (icon: Component) {
+  return () => h(NIcon, null, { default: () => h(icon) })
+}
+
+const menuOptions: MenuOption[] = [
+  {
+    label: () =>
+        h(
+            RouterLink,
+            {
+              to: {
+                name: 'home',
+                params: {
+                  lang: 'zh-CN'
+                }
+              }
+            },
+            { default: () => '回家' }
+        ),
+    key: 'go-back-home',
+    icon: renderIcon(HomeIcon)
+  },
+  {
+    key: 'divider-1',
+    type: 'divider',
+    props: {
+      style: {
+        marginLeft: '32px'
+      }
+    }
+  },
+  {
+    label: () =>
+        h(
+            'a',
+            {
+              href: 'https://baike.baidu.com/item/%E4%B8%94%E5%90%AC%E9%A3%8E%E5%90%9F',
+              target: '_blank',
+              rel: 'noopenner noreferrer'
+            },
+            '且听风吟'
+        ),
+    key: 'hear-the-wind-sing',
+    icon: renderIcon(BookIcon)
+  },
+  {
+    label: '1973年的弹珠玩具',
+    key: 'pinball-1973',
+    icon: renderIcon(BookIcon),
+    disabled: true,
+    children: [
+      {
+        label: '鼠',
+        key: 'rat'
+      }
+    ]
+  },
+  {
+    label: '寻羊冒险记',
+    key: 'a-wild-sheep-chase',
+    icon: renderIcon(BookIcon),
+    disabled: true
+  },
+  {
+    label: '舞，舞，舞',
+    key: 'dance-dance-dance',
+    icon: renderIcon(BookIcon),
+    children: [
+      {
+        type: 'group',
+        label: '人物',
+        key: 'people',
+        children: [
+          {
+            label: '叙事者',
+            key: 'narrator',
+            icon: renderIcon(PersonIcon)
+          },
+          {
+            label: '羊男',
+            key: 'sheep-man',
+            icon: renderIcon(PersonIcon)
+          }
+        ]
+      },
+      {
+        label: '饮品',
+        key: 'beverage',
+        icon: renderIcon(WineIcon),
+        children: [
+          {
+            label: '威士忌',
+            key: 'whisky'
+          }
+        ]
+      },
+      {
+        label: '食物',
+        key: 'food',
+        children: [
+          {
+            label: '三明治',
+            key: 'sandwich'
+          }
+        ]
+      },
+      {
+        label: '过去增多，未来减少',
+        key: 'the-past-increases-the-future-recedes'
+      }
+    ]
+  }
+]
+</script>
+
+<template>
+  <n-layout has-sider class="min-h-screen">
+    <n-layout-sider>
+      <n-menu :options="menuOptions" />
+    </n-layout-sider>
+    <n-layout embedded  :native-scrollbar="false"
+               content-style="padding: 24px;padding-top: 10px" class="min-h-screen">
+      <router-view/>
+
+    </n-layout>
+  </n-layout>
+
+</template>
+
+<style scoped>
+
+</style>

src/components/Front.vue

@@ -8,7 +8,9 @@ const value = ref("")
 import {spider} from "@/plugins/backend";
 
 spider.apiSpidersGet({
-  page: 1
+  params: {
+    page: 100,
+  }
 })
 
 

src/components/Layout.vue

@@ -1,23 +1,33 @@
 <script setup lang="ts">
 import {computed} from 'vue'
-import {darkTheme, useOsTheme, NConfigProvider, NMessageProvider} from 'naive-ui'
-import {RouterView} from "vue-router";
+import {
+  darkTheme,
+  NConfigProvider,
+  NDialogProvider,
+  NGlobalStyle,
+  NLoadingBarProvider,
+  NMessageProvider,
+  useOsTheme,
+    zhCN,dateZhCN
+} from 'naive-ui'
+import Container from "@/components/Container.vue";
 
 const osTheme = useOsTheme()
 const theme = computed(() => (osTheme.value === 'dark' ? darkTheme : null))
 </script>
 
 <template>
-  <n-config-provider :theme="theme">
-    <n-message-provider>
+  <n-config-provider :theme="theme"  :date-locale="dateZhCN" :locale="zhCN">
 
+    <n-loading-bar-provider>
+      <n-message-provider>
+        <n-global-style/>
+        <n-dialog-provider>
+          <Container></Container>
+        </n-dialog-provider>
 
-
-      <router-view />
-
-
-    </n-message-provider>
-
+      </n-message-provider>
+    </n-loading-bar-provider>
   </n-config-provider>
 </template>
 

src/components/RouterView.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+  <router-view></router-view>
+</template>
+
+<style scoped>
+
+</style>

src/openapi/.openapi-generator/FILES

@@ -1,6 +1,5 @@
 .gitignore
 .npmignore
-.openapi-generator-ignore
 api.ts
 base.ts
 common.ts

src/router/index.ts

@@ -9,6 +9,11 @@ const router = createRouter({
       name: 'home',
       component: HomeView
     },
+    {
+      path: '/manage',
+      name: 'manage.index',
+      component: () => import('../views/manage/Index.vue')
+    },
     {
       path: '/auth/login',
       name: 'auth.login',

src/views/Home.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import {ref} from "vue";
-import {NInput, NFlex} from 'naive-ui'
+import {NInput, NFlex, NA} from 'naive-ui'
 import Front from "@/components/Front.vue";
 
 const value = ref('')
@@ -8,4 +8,10 @@ const value = ref('')
 
 <template>
   <Front></Front>
+
+  <router-link :to="{ name: 'manage.index'}" #="{ navigate, href }" custom>
+    <n-a :href="href" @click="navigate">
+      中台
+    </n-a>
+  </router-link>
 </template>

src/views/manage/Index.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+  import {NH1, NText} from 'naive-ui'
+</script>
+
+<template>
+  <n-h1>
+    <n-text type="primary">
+      中台
+    </n-text>
+  </n-h1>
+</template>
+
+<style scoped>
+
+</style>

src/views/manage/Spiders.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+
+</template>
+
+<style scoped>
+
+</style>

yarn.lock

@@ -490,6 +490,11 @@
   resolved "https://registry.yarnpkg.com/@ungap/structured-clone/-/structured-clone-1.2.0.tgz#756641adb587851b5ccb3e095daf27ae581c8406"
   integrity sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==
 
+"@vicons/ionicons5@^0.12.0":
+  version "0.12.0"
+  resolved "https://registry.yarnpkg.com/@vicons/ionicons5/-/ionicons5-0.12.0.tgz#c39fda04420dfae3b58053faf8aaf3555253299d"
+  integrity sha512-Iy1EUVRpX0WWxeu1VIReR1zsZLMc4fqpt223czR+Rpnrwu7pt46nbnC2ycO7ItI/uqDLJxnbcMC7FujKs9IfFA==
+
 "@vitejs/plugin-vue@^5.0.4":
   version "5.0.4"
   resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-5.0.4.tgz#508d6a0f2440f86945835d903fcc0d95d1bb8a37"