添加新增

src/components/menus/MyChat.vue

@@ -30,6 +30,11 @@
           <el-form-item>
             <el-button type="primary" @click="initCartList">查询</el-button>
           </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click.prevent="addChat">
+              新增
+            </el-button>
+          </el-form-item>
         </el-form>
         <el-table border :data="userlist" v-loading="loading">
           <el-table-column
@@ -56,10 +61,12 @@
           </el-table-column>
           <el-table-column prop="详情" label="详情" width="180">
             <template slot-scope="props">
-              <el-button type="info">
-                <a href="#" @click.prevent="gotoDetail(props.row.id)">详情</a>
+              <el-button
+                type="success"
+                @click.prevent="gotoDetail(props.row.id)"
+                >详情
               </el-button>
-              <el-button type="primary" @click="onDelete(props.row.id)"
+              <el-button type="danger" @click="onDelete(props.row.id)"
                 >删除</el-button
               >
             </template>
@@ -134,7 +141,7 @@ export default {
     async onDelete(id) {
       this.loading = true;
       const { data: res } = await axios.get(
-        "http://120.79.36.53:8888/chatbot/delete",
+        "http://localhost:8888/chatbot/delete",
         {
           params: {
             id: id,
@@ -150,11 +157,14 @@ export default {
     gotoDetail(id) {
       this.$router.push("/home/chatinfo/" + id);
     },
+    addChat() {
+      this.$router.push("/home/addChat/");
+    },
 
     async initCartList() {
       this.loading = true;
       const { data: res } = await axios.get(
-        "http://120.79.36.53:8888/chatbot/page",
+        "http://localhost:8888/chatbot/page",
         {
           params: {
             page: this.currentPage,

src/components/user/AddChatDetail.vue

+<template>
+  <div>
+    <el-button @click="goBack()">后退</el-button>
+    <h4 class="text-center">新增ChatGpt问答</h4>
+    <el-container class="container">
+      <el-form ref="form" :model="form" label-width="80px">
+        <el-form-item label="问题">
+          <el-input v-model="form.question"></el-input>
+        </el-form-item>
+
+        <el-form-item label="答案">
+          <el-input type="textarea" v-model="form.response"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit">立即创建</el-button>
+          <el-button @click="clearContent">取消</el-button>
+        </el-form-item>
+      </el-form>
+    </el-container>
+  </div>
+</template>
+<script>
+// 导入 axios 请求库
+import axios from "axios";
+export default {
+  name: "AddChatDetail",
+  data() {
+    return {
+      form: {
+        question: "",
+        response: "",
+      },
+    };
+  },
+  methods: {
+    clearContent() {
+      this.form.question = "";
+      this.form.response = "";
+    },
+    async onSubmit() {
+      // 调用 axios 的 get 方法，请求列表数据
+      const { data: res } = await axios.post("http://localhost:8888/chatbot", {
+        question: this.form.question,
+        response: this.form.response,
+      });
+      // 只要请求回来的数据，在页面渲染期间要用到，则必须转存到 data 中
+      if (res.code === 200) {
+        this.$message.success("问题和答案新增成功");
+      }
+    },
+    goBack() {
+      // 传递参数到前一个页面
+      const params = {
+        // 参数名: 参数值
+        back: "back",
+        // baz: "qux",
+      };
+
+      // 使用 $router.push() 导航到前一个页面
+      this.$router.push({
+        path: "/home/chat", // 前一个页面的路径
+        query: params, // 参数对象
+      });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 30vh; /* 如果希望 `el-container` 在整个视口居中，可以使用 height: 100vh; 来设置容器的高度 */
+}
+</style>

src/components/user/MyChatDetail.vue

@@ -68,7 +68,7 @@ export default {
     async initChatList() {
       // 调用 axios 的 get 方法，请求列表数据
       const { data: res } = await axios.get(
-        "http://120.79.36.53:8888/chatbot/" + this.id
+        "http://localhost:8888/chatbot/" + this.id
       );
       // 只要请求回来的数据，在页面渲染期间要用到，则必须转存到 data 中
       if (res.code === 200) {

src/router/index.js

@@ -14,37 +14,70 @@ import Chat from '@/components/menus/MyChat.vue'
 import Settings from '@/components/menus/MySettings.vue'
 import UserDetail from '@/components/user/MyUserDetail.vue'
 import MyChatDetail from '@/components/user/MyChatDetail.vue'
+import AddChatDetail from '@/components/user/AddChatDetail.vue'
 
 
 Vue.use(VueRouter)
 
 const router = new VueRouter({
   routes: [
-    { path: '/', redirect: '/login' },
+    {
+      path: '/',
+      redirect: '/login'
+    },
     // 登录的路由规则
-    { path: '/login', component: Login },
+    {
+      path: '/login',
+      component: Login
+    },
     // 后台主页的路由规则
     {
       path: '/home',
       component: Home,
       redirect: '/home/users',
       children: [
-        { path: 'users', component: Users },
-        { path: 'rights', component: Rights },
-        { path: 'goods', component: Goods },
-        { path: 'orders', component: Orders },
-        { path: 'chat',   component:  Chat}, 
-        { path: 'settings', component: Settings },
+        {
+          path: 'users',
+          component: Users
+        },
+        {
+          path: 'rights',
+          component: Rights
+        },
+        {
+          path: 'goods',
+          component: Goods
+        },
+        {
+          path: 'orders',
+          component: Orders
+        }, {
+          path: 'chat',
+          component: Chat
+        }, {
+          path: 'settings',
+          component: Settings
+        },
         // 用户详情页的路由规则
-        { path: 'userinfo/:id', component: UserDetail, props: true },
-        { path: 'chatinfo/:id', component: MyChatDetail, props: true }
+        {
+          path: 'userinfo/:id',
+          component: UserDetail,
+          props: true
+        }, {
+          path: 'chatinfo/:id',
+          component: MyChatDetail,
+          props: true
+        }, {
+          path: 'addChat',
+          component: AddChatDetail,
+        },
       ]
     }
   ]
 })
 
 // 全局前置守卫
-router.beforeEach(function(to, from, next) {
+router.beforeEach(function (to, from, next) {
   if (pathArr.indexOf(to.path) !== -1) {
     const token = localStorage.getItem('token')
     if (token) {