From 951636869b30e4dd4ad522a1ccfeee8ca265de08 Mon Sep 17 00:00:00 2001 From: ChenZhaoYu <790348264@qq.com> Date: Mon, 13 Feb 2023 12:38:44 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E8=B0=83=E6=95=B4=E4=B8=BA=E8=B7=AF?= =?UTF-8?q?=E7=94=B1=E6=A8=A1=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 5 +- pnpm-lock.yaml | 15 +++ src/App.vue | 12 +- .../Chat/components/Message/Avatar.vue | 16 +++ .../business/Chat/components/Message/Text.vue | 5 + .../Chat/components/Message/index.vue | 31 +++++ .../business/Chat/components/index.ts | 3 + src/components/business/Chat/index.vue | 113 ++++++++++++++++++ .../business/Chat/layout/Layout.vue | 27 +++++ src/components/business/Chat/layout/index.ts | 3 + src/components/business/Chat/request.ts | 41 +++++++ src/components/business/index.ts | 3 + src/components/common/NaiveProvider.vue | 23 ++-- src/main.ts | 7 +- src/router/index.ts | 22 ++++ src/views/home/index.vue | 13 ++ 16 files changed, 316 insertions(+), 23 deletions(-) create mode 100644 src/components/business/Chat/components/Message/Avatar.vue create mode 100644 src/components/business/Chat/components/Message/Text.vue create mode 100644 src/components/business/Chat/components/Message/index.vue create mode 100644 src/components/business/Chat/components/index.ts create mode 100644 src/components/business/Chat/index.vue create mode 100644 src/components/business/Chat/layout/Layout.vue create mode 100644 src/components/business/Chat/layout/index.ts create mode 100644 src/components/business/Chat/request.ts create mode 100644 src/components/business/index.ts create mode 100644 src/router/index.ts create mode 100644 src/views/home/index.vue diff --git a/package.json b/package.json index bd785db..a086b0e 100644 --- a/package.json +++ b/package.json @@ -11,19 +11,20 @@ "vue" ], "scripts": { - "bootstrap": "pnpm install && pnpm run common:prepare", "dev": "vite", "build": "run-p type-check build-only", "preview": "vite preview", "build-only": "vite build", "type-check": "vue-tsc --noEmit", "lint:fix": "eslint . --fix", + "bootstrap": "pnpm install && pnpm run common:prepare", "common:cleanup": "rimraf node_modules && rimraf pnpm-lock.yaml", "common:prepare": "husky install" }, "dependencies": { "naive-ui": "^2.34.3", - "vue": "^3.2.47" + "vue": "^3.2.47", + "vue-router": "^4.1.6" }, "devDependencies": { "@antfu/eslint-config": "^0.35.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9c7dbf6..b6631b4 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -20,11 +20,13 @@ specifiers: typescript: ~4.9.5 vite: ^4.1.1 vue: ^3.2.47 + vue-router: ^4.1.6 vue-tsc: ^1.0.24 dependencies: naive-ui: 2.34.3_vue@3.2.47 vue: 3.2.47 + vue-router: 4.1.6_vue@3.2.47 devDependencies: '@antfu/eslint-config': 0.35.2_7kw3g6rralp5ps6mg3uyzz6azm @@ -955,6 +957,10 @@ packages: '@vue/compiler-dom': 3.2.47 '@vue/shared': 3.2.47 + /@vue/devtools-api/6.5.0: + resolution: {integrity: sha512-o9KfBeaBmCKl10usN4crU53fYtC1r7jJwdGKjPT24t348rHxgfpZ0xL3Xm/gLUYnc0oTp8LAmrxOeLyu6tbk2Q==} + dev: false + /@vue/reactivity-transform/3.2.47: resolution: {integrity: sha512-m8lGXw8rdnPVVIdIFhf0LeQ/ixyHkH5plYuS83yop5n7ggVJU+z5v0zecwEnX7fa7HNLBhh2qngJJkxpwEEmYA==} dependencies: @@ -4402,6 +4408,15 @@ packages: - supports-color dev: true + /vue-router/4.1.6_vue@3.2.47: + resolution: {integrity: sha512-DYWYwsG6xNPmLq/FmZn8Ip+qrhFEzA14EI12MsMgVxvHFDYvlr4NXpVF5hrRH1wVcDP8fGi5F4rxuJSl8/r+EQ==} + peerDependencies: + vue: ^3.2.0 + dependencies: + '@vue/devtools-api': 6.5.0 + vue: 3.2.47 + dev: false + /vue-template-compiler/2.7.14: resolution: {integrity: sha512-zyA5Y3ArvVG0NacJDkkzJuPQDF8RFeRlzV2vLeSnhSpieO6LK2OVbdLPi5MPPs09Ii+gMO8nY4S3iKQxBxDmWQ==} dependencies: diff --git a/src/App.vue b/src/App.vue index 440873e..729fdb9 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,12 +1,12 @@ diff --git a/src/components/business/Chat/components/Message/Avatar.vue b/src/components/business/Chat/components/Message/Avatar.vue new file mode 100644 index 0000000..1857c84 --- /dev/null +++ b/src/components/business/Chat/components/Message/Avatar.vue @@ -0,0 +1,16 @@ + + + diff --git a/src/components/business/Chat/components/Message/Text.vue b/src/components/business/Chat/components/Message/Text.vue new file mode 100644 index 0000000..d96c5f6 --- /dev/null +++ b/src/components/business/Chat/components/Message/Text.vue @@ -0,0 +1,5 @@ + diff --git a/src/components/business/Chat/components/Message/index.vue b/src/components/business/Chat/components/Message/index.vue new file mode 100644 index 0000000..a897d1c --- /dev/null +++ b/src/components/business/Chat/components/Message/index.vue @@ -0,0 +1,31 @@ + + + diff --git a/src/components/business/Chat/components/index.ts b/src/components/business/Chat/components/index.ts new file mode 100644 index 0000000..e5b21df --- /dev/null +++ b/src/components/business/Chat/components/index.ts @@ -0,0 +1,3 @@ +import Message from './Message/index.vue' + +export { Message } diff --git a/src/components/business/Chat/index.vue b/src/components/business/Chat/index.vue new file mode 100644 index 0000000..14f5e5a --- /dev/null +++ b/src/components/business/Chat/index.vue @@ -0,0 +1,113 @@ + + + diff --git a/src/components/business/Chat/layout/Layout.vue b/src/components/business/Chat/layout/Layout.vue new file mode 100644 index 0000000..16e9923 --- /dev/null +++ b/src/components/business/Chat/layout/Layout.vue @@ -0,0 +1,27 @@ + + + + + diff --git a/src/components/business/Chat/layout/index.ts b/src/components/business/Chat/layout/index.ts new file mode 100644 index 0000000..4763bbc --- /dev/null +++ b/src/components/business/Chat/layout/index.ts @@ -0,0 +1,3 @@ +import Layout from './Layout.vue' + +export { Layout } diff --git a/src/components/business/Chat/request.ts b/src/components/business/Chat/request.ts new file mode 100644 index 0000000..cc32f56 --- /dev/null +++ b/src/components/business/Chat/request.ts @@ -0,0 +1,41 @@ +import axios from 'axios' + +const BASE_URL = import.meta.env.VITE_GLOB_API_URL + +async function fetchChatAPI(message: string) { + if (!message || message.trim() === '') + return + + try { + const { status, data } = await axios.post(`${BASE_URL}/chat`, { message }) + + if (status === 200) { + if (data.text) + return Promise.resolve(data) + + if (data.statusText) + return Promise.reject(new Error(data.statusText)) + } + + return Promise.reject(new Error('Request failed')) + } + catch (error) { + return Promise.reject(error) + } +} + +async function clearChatContext() { + try { + const { status, data } = await axios.post(`${BASE_URL}/clear`) + + if (status === 200) + return Promise.resolve(data) + + return Promise.reject(new Error('Request failed')) + } + catch (error) { + return Promise.reject(error) + } +} + +export { fetchChatAPI, clearChatContext } diff --git a/src/components/business/index.ts b/src/components/business/index.ts new file mode 100644 index 0000000..4af6f59 --- /dev/null +++ b/src/components/business/index.ts @@ -0,0 +1,3 @@ +import Chat from './Chat/index.vue' + +export { Chat } diff --git a/src/components/common/NaiveProvider.vue b/src/components/common/NaiveProvider.vue index 53f365d..b30fc72 100644 --- a/src/components/common/NaiveProvider.vue +++ b/src/components/common/NaiveProvider.vue @@ -1,7 +1,6 @@ diff --git a/src/main.ts b/src/main.ts index bf065d9..19f69e9 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,6 +1,8 @@ +import './styles/global.css' + import { createApp } from 'vue' import App from './App.vue' -import './styles/global.css' +import { setupRouter } from '@/router' /** Tailwind's Preflight Style Override */ function naiveStyleOverride() { @@ -10,9 +12,10 @@ function naiveStyleOverride() { } /** Setup */ -function bootstrap() { +async function bootstrap() { const app = createApp(App) naiveStyleOverride() + await setupRouter(app) app.mount('#app') } diff --git a/src/router/index.ts b/src/router/index.ts new file mode 100644 index 0000000..fad7e6d --- /dev/null +++ b/src/router/index.ts @@ -0,0 +1,22 @@ +import type { App } from 'vue' +import type { RouteRecordRaw } from 'vue-router' +import { createRouter, createWebHashHistory } from 'vue-router' + +const routes: RouteRecordRaw[] = [ + { + path: '/', + name: 'Home', + component: () => import('@/views/Home/index.vue'), + }, +] + +export const router = createRouter({ + history: createWebHashHistory(), + routes, + scrollBehavior: () => ({ left: 0, top: 0 }), +}) + +export async function setupRouter(app: App) { + app.use(router) + await router.isReady() +} diff --git a/src/views/home/index.vue b/src/views/home/index.vue new file mode 100644 index 0000000..53a37f3 --- /dev/null +++ b/src/views/home/index.vue @@ -0,0 +1,13 @@ + + + + +