Add chat page

api/ai.js

@@ -0,0 +1,7 @@
+export default function handler(request, response) {
+  let { text } = request.body;
+  text = text.replace(/\?/g, '！');
+  text = text.replace('吗', '');
+  text = text.replace('你','我')
+  response.status(200).json(text);
+}

locales/en.yml

@@ -1,5 +1,5 @@
-__lang: English
-__code: "EN"
+lang: English
+code: EN
 internal-error:
   button: Return to Home
   description: Bad things happen from time to time, and the server experiences errors.

src/layouts/components/navbar/modules/LanguageBtn.vue

@@ -1,6 +1,18 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
-const { messages, t, locale } = useI18n();
+const { t, locale } = useI18n();
+const locList = [
+  {
+    code: 'EN',
+    lang: 'English',
+    loc: 'en',
+  },
+  {
+    code: 'ZH',
+    lang: '中文',
+    loc: 'zh-CN',
+  },
+];
 const setLanguage = (lang) => {
   locale.value = lang;
 };
@@ -13,13 +25,15 @@ const setLanguage = (lang) => {
       class="dropdown-content bg-base-200 text-base-content rounded-box top-px mt-16 max-h-[calc(100vh-10rem)] w-56 overflow-y-auto border border-white/5 shadow-2xl outline outline-1 outline-black/5"
     >
       <ul class="menu menu-sm gap-1">
-        <li v-for="(_, index) in messages" :key="index">
-          <button class="btn glass flex justify-between w-full" @click="setLanguage(index)">
+        <li v-for="(item, index) in locList" :key="index">
+          <button class="btn glass flex justify-between w-full" @click="setLanguage(item.loc)">
             <span
               class="badge badge-sm badge-outline !pl-1.5 !pr-1 pt-px font-mono !text-[.6rem] font-bold tracking-widest opacity-50"
-              :class="{ 'badge-primary': index === locale }"
-            >{{ _.__code.source }}</span>
-            <span class="font-[sans-serif]">{{ _.__lang.source }}</span>
+              :class="{ 'badge-primary': item.loc === locale }"
+            >
+              {{ item.code }}
+            </span>
+            <span class="font-[sans-serif]">{{ item.lang }}</span>
           </button>
         </li>
       </ul>

src/layouts/components/navbar/modules/MineBtn.vue

@@ -21,7 +21,7 @@ const logout = () => {
     <ul tabindex="0" class="mt-3 z-[1] p-2 shadow menu menu-sm dropdown-content bg-base-100 rounded-box w-52">
       <li>
         <a class="justify-between">
-          个人主页
+          个人洞府
           <span class="badge">New</span>
         </a>
       </li>

src/modules/i18n.js

@@ -1,42 +1,12 @@
 import { createI18n } from 'vue-i18n';
-
+import messages from '@intlify/unplugin-vue-i18n/messages'
 const i18n = createI18n({
   legacy: false,
-  locale: '',
-  messages: {},
+  fallbackLocale: 'en',
+  locale: 'zh-CN',
+  messages
 });
 
-const localesMap = Object.fromEntries(
-  Object.entries(import.meta.glob('../../locales/*.yml')).map(([path, loadLocale]) => [
-    path.match(/([\w-]*)\.yml$/)?.[1],
-    loadLocale,
-  ]),
-);
-
-export const availableLocales = Object.keys(localesMap);
-const loadedLanguages = [];
-
-function setI18nLanguage(lang) {
-  i18n.global.locale.value = lang;
-  if (typeof document !== 'undefined') document.querySelector('html')?.setAttribute('lang', lang);
-  return lang;
-}
-
-export async function loadLanguageAsync(lang) {
-  // If the same language
-  if (i18n.global.locale.value === lang) return setI18nLanguage(lang);
-
-  // If the language was already loaded
-  if (loadedLanguages.includes(lang)) return setI18nLanguage(lang);
-
-  // If the language hasn't been loaded yet
-  const messages = await localesMap[lang]();
-  i18n.global.setLocaleMessage(lang, messages.default);
-  loadedLanguages.push(lang);
-  return setI18nLanguage(lang);
-}
-
 export const install = ({ app }) => {
   app.use(i18n);
-  availableLocales.map(lang => loadLanguageAsync(lang));
 };

src/pages/charts/ChartBar.vue

@@ -0,0 +1,3 @@
+<template>
+  <h1>柱状图</h1>
+</template>

src/pages/charts/ChartDataset.vue

@@ -0,0 +1,3 @@
+<template>
+  <h1>甘特图</h1>
+</template>

src/pages/charts/ChartLine.vue

@@ -0,0 +1,3 @@
+<template>
+  <h1>线图</h1>
+</template>

src/pages/charts/ChartPie.vue

@@ -0,0 +1,3 @@
+<template>
+  <h1>饼图</h1>
+</template>

src/pages/charts/ChartRadar.vue

@@ -0,0 +1,3 @@
+<template>
+  <h1>雷达图</h1>
+</template>

src/pages/charts/ChartScatter.vue

@@ -0,0 +1,3 @@
+<template>
+  <h1>离散图</h1>
+</template>

src/pages/indexPage.vue

@@ -1,7 +1,7 @@
 <script setup></script>
 <template>
   <div class="p-3 bg-base-200 w-full">
-    <h1 class="m-2 text-3xl font-bold">早上好，系统超级管理员</h1>
+    <h1 class="m-2 text-3xl font-bold">道友，今天也不要忘记修炼呀</h1>
     <div class="flex mt-2 pt-2">
       <div class="stats shadow flex-1">
         <div class="stat">
@@ -55,7 +55,7 @@
             </div>
           </div>
           <div class="stat-value">86%</div>
-          <div class="stat-title">工作进度</div>
+          <div class="stat-title">修炼进度</div>
           <div class="stat-desc text-secondary mt-1">加油胜利就在前方</div>
         </div>
       </div>

src/pages/other/ChatPage.vue

@@ -0,0 +1,71 @@
+<script setup>
+import { ref } from 'vue';
+const leftMsg = ref([]);
+const rightMsg = ref([]);
+const message = ref('');
+const sendMsg = (msg) => {
+  if (msg.length > 0) {
+    leftMsg.value.push(msg);
+    message.value = '';
+    // 使用原生请求
+    fetch('/api/ai', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        text: msg,
+      }),
+    })
+      .then((res) => res.json())
+      .then((res) => {
+        rightMsg.value.push(res);
+      }).catch(() => {
+        alert('请求失败');
+      });
+  }else{
+    alert('请输入内容');
+  }
+};
+</script>
+<template>
+  <div class="chat chat-end">
+    <div class="chat-image avatar">
+      <div class="w-10 rounded-full">
+        <img
+          alt="Tailwind CSS chat bubble component"
+          src="https://daisyui.com/images/stock/photo-1534528741775-53994a69daeb.jpg"
+        />
+      </div>
+    </div>
+    <div class="chat-header">
+      我
+      <time class="text-xs opacity-50">12:46</time>
+    </div>
+    <div class="chat-bubble">我强吗？</div>
+    <div class="chat-footer opacity-50">Seen at 12:46</div>
+  </div>
+  <div class="chat chat-start">
+    <div class="chat-image avatar">
+      <div class="w-10 rounded-full">
+        <img
+          alt="Tailwind CSS chat bubble component"
+          src="https://daisyui.com/images/stock/photo-1534528741775-53994a69daeb.jpg"
+        />
+      </div>
+    </div>
+    <div class="chat-header">
+      天道
+      <time class="text-xs opacity-50">12:45</time>
+    </div>
+    <div class="chat-bubble">你非常强！</div>
+    <div class="chat-footer opacity-50">Delivered</div>
+  </div>
+
+  <div class="fixed bottom-0 left-0 right-0 w-full">
+    <div class="flex justify-between">
+      <input type="text" class="w-full" v-model="message" />
+      <button class="btn btn-primary" @click="sendMsg(message)">Send</button>
+    </div>
+  </div>
+</template>

src/pages/other/ReportPage.vue

@@ -0,0 +1,3 @@
+<template>
+    <h1>上报</h1>
+</template>

src/router/index.js

@@ -1,6 +1,7 @@
 import { createRouter, createWebHistory } from 'vue-router';
 import error from './modules/error';
 import results from './modules/results';
+import other from './modules/other';
 import { name } from '../../package.json';
 // 默认布局
 const DefaultLayout = () => import('../layouts/DefaultLayout.vue');
@@ -37,6 +38,7 @@ const routes = [
     component: import('../pages/loginPage.vue'),
   },
   ...results,
+  ...other,
   ...error,
   {
     path: '/about',

src/router/modules/other.js

@@ -1 +1,28 @@
 // 聊天
+const DefaultLayout = () => import('@/layouts/DefaultLayout.vue');
+export default [
+  {
+    path: '/other',
+    component: DefaultLayout,
+    meta: {
+      title: '其他页',
+    },
+    children: [
+      {
+        path: '/chat',
+        name: 'ChatPage',
+        component: () => import('@/pages/other/ChatPage.vue'),
+        meta: {
+          title: '问道！',
+        },
+      },{
+        path:'/report',
+        name:'ReportPage',
+        component:()=>import('@/pages/other/ReportPage.vue'),
+        meta:{
+          title:'报告页'
+        }
+      }
+    ],
+  },
+];

vite.config.js

@@ -34,9 +34,11 @@ export default defineConfig({
       },
     }),
     VueI18n({
-      locale: 'zh-CN',
       runtimeOnly: true,
-      compositionOnly: true,
+      defaultSFCLang:'yml',
+      compositionOnly: false, 
+      fallbackLocale: 'en',
+      locale: 'zh-CN',
       fullInstall: true,
       include: [path.resolve(__dirname, 'locales/**')],
     }),