pref: 优化部份内容

README.md

@@ -1,2 +1,21 @@
 # ChatGPT Bot Web
 
+This is a ChatGPT web application demo with express and vue3
+
+![cover](./docs/cover.png)
+## Intro
+1. `node >= 18`
+1. `pnpm install` node deps
+2. set `OPENAI_API_KEY` in `.env`
+
+## Run
+```shell
+# 1. run service
+pnpm run service
+
+# 2. run web
+pnpm run dev
+```
+
+## License
+MIT © [ChenZhaoYu](./license)

license

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 ChenZhaoYu
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package.json

@@ -1,41 +1,49 @@
 {
- "name": "chatgpt-bot",
- "version": "1.0.0",
- "private": true,
- "scripts": {
- "dev": "vite",
- "service": "esno ./service/index.ts",
- "build": "run-p type-check build-only",
- "preview": "vite preview",
- "build-only": "vite build",
- "type-check": "vue-tsc --noEmit",
- "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
- },
- "dependencies": {
- "naive-ui": "^2.34.3",
- "vue": "^3.2.45"
- },
- "devDependencies": {
- "@antfu/eslint-config": "^0.35.2",
- "@iconify/vue": "^4.1.0",
- "@types/babel__core": "^7.20.0",
- "@types/express": "^4.17.17",
- "@types/node": "^18.11.12",
- "@vitejs/plugin-vue": "^4.0.0",
- "autoprefixer": "^10.4.13",
- "axios": "^1.3.2",
- "chatgpt": "^4.2.0",
- "dotenv": "^16.0.3",
- "eslint": "^8.22.0",
- "esno": "^0.16.3",
- "express": "^4.18.2",
- "npm-run-all": "^4.1.5",
- "postcss": "^8.4.21",
- "prettier": "^2.7.1",
- "tailwindcss": "^3.2.6",
- "typescript": "~4.7.4",
- "vite": "^4.0.0",
- "vite-plugin-svg-icons": "^2.0.1",
- "vue-tsc": "^1.0.12"
- }
+ "name": "chatgpt-bot",
+ "version": "1.0.0",
+ "description": "ChatGPT Web Bot",
+ "author": "ChenZhaoYu <[email protected]>",
+ "private": false,
+ "keywords": [
+ "chatgpt",
+ "chatbot",
+ "web",
+ "vue"
+ ],
+ "scripts": {
+ "dev": "vite",
+ "service": "esno ./service/index.ts",
+ "build": "run-p type-check build-only",
+ "preview": "vite preview",
+ "build-only": "vite build",
+ "type-check": "vue-tsc --noEmit",
+ "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
+ },
+ "dependencies": {
+ "naive-ui": "^2.34.3",
+ "vue": "^3.2.45"
+ },
+ "devDependencies": {
+ "@antfu/eslint-config": "^0.35.2",
+ "@iconify/vue": "^4.1.0",
+ "@types/babel__core": "^7.20.0",
+ "@types/express": "^4.17.17",
+ "@types/node": "^18.11.12",
+ "@vitejs/plugin-vue": "^4.0.0",
+ "autoprefixer": "^10.4.13",
+ "axios": "^1.3.2",
+ "chatgpt": "^4.2.0",
+ "dotenv": "^16.0.3",
+ "eslint": "^8.22.0",
+ "esno": "^0.16.3",
+ "express": "^4.18.2",
+ "npm-run-all": "^4.1.5",
+ "postcss": "^8.4.21",
+ "prettier": "^2.7.1",
+ "tailwindcss": "^3.2.6",
+ "typescript": "~4.7.4",
+ "vite": "^4.0.0",
+ "vite-plugin-svg-icons": "^2.0.1",
+ "vue-tsc": "^1.0.12"
+ }
 }

src/App.vue

@@ -7,8 +7,18 @@ import Chat from '@/views/Chat/index.vue'
 <template>
  <NConfigProvider class="h-full" preflight-style-disabled>
  <NaiveProvider>
- <div class="h-full p-4">
- <Chat />
+ <div class="flex flex-col h-full p-4">
+ <div class="flex-1">
+ <div class="container h-full m-auto">
+ <Chat />
+ </div>
+ </div>
+ <div class="px-4 mt-4 text-sm text-center text-neutral-500">
+ Made By ChenZhaoYu
+ <a href="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/Chanzhaoyu/chatgpt-bot" target="_blank" class="text-blue-500">
+ Github
+ </a>
+ </div>
  </div>
  </NaiveProvider>
  </NConfigProvider>

src/typings/env.d.ts

@@ -1,3 +1,5 @@
+/// <reference types="vite/client" />
+
 interface ImportMetaEnv {
  /** api url */
  readonly VITE_GLOB_API_URL: string;

src/views/Chat/index.vue

@@ -74,7 +74,9 @@ function addMessage(message: string, user = false, error = false) {
 <template>
  <div class="flex flex-col h-full overflow-hidden border rounded-md shadow-md">
  <header class="flex items-center justify-between p-4">
- <div>会话</div>
+ <h1 class="text-xl font-bold">
+ Chat
+ </h1>
  <div>
  <button
  class="w-[40px] h-[40px] rounded-full hover:bg-neutral-100 transition flex justify-center items-center"
@@ -103,7 +105,9 @@ function addMessage(message: string, user = false, error = false) {
  @keyup="handleEnter"
  />
  <NButton type="primary" :loading="loading" @click="handleSubmit">
- <SvgIcon icon="ri:send-plane-fill" />
+ <template #icon>
+ <SvgIcon icon="ri:send-plane-fill" />
+ </template>
  </NButton>
  </div>
  </footer>