Explorar el Código

添加右下角聊天框及点击返回一级菜单的首页

yangg hace 8 meses
padre
commit
93c62f6e71

La diferencia del archivo ha sido suprimido porque es demasiado grande
+ 0 - 0
dist/index.html


La diferencia del archivo ha sido suprimido porque es demasiado grande
+ 0 - 0
dist/static/css/app.2ee45ccc.css


+ 0 - 0
dist/static/css/chunk-050dfb95.775a21e3.css → dist/static/css/chunk-05d6d838.775a21e3.css


+ 0 - 1
dist/static/css/chunk-7b7d12e7.1286ef46.css

@@ -1 +0,0 @@
-.header[data-v-38e99766]{margin-left:20px}.header h2[data-v-38e99766]{margin-bottom:0}.center[data-v-38e99766]{margin:10px}.center[data-v-38e99766] .el-form--inline .el-form-item{display:block}.center[data-v-38e99766] .el-input-number--medium{width:150px}.footer[data-v-38e99766]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;margin:0 50px 20px}

+ 1 - 0
dist/static/css/chunk-c24373c6.d5e4dc6f.css

@@ -0,0 +1 @@
+.header[data-v-1796f64c]{margin-left:20px}.header h2[data-v-1796f64c]{margin-bottom:0}.center[data-v-1796f64c]{margin:10px}.center[data-v-1796f64c] .el-form--inline .el-form-item{display:block}.center[data-v-1796f64c] .el-input-number--medium{width:150px}.footer[data-v-1796f64c]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;margin:0 50px 20px}

La diferencia del archivo ha sido suprimido porque es demasiado grande
+ 0 - 0
dist/static/js/app.3cf315cc.js


La diferencia del archivo ha sido suprimido porque es demasiado grande
+ 0 - 0
dist/static/js/app.7d30912a.js


La diferencia del archivo ha sido suprimido porque es demasiado grande
+ 1 - 1
dist/static/js/chunk-05d6d838.4d242ace.js


La diferencia del archivo ha sido suprimido porque es demasiado grande
+ 0 - 0
dist/static/js/chunk-7b7d12e7.1d4c7d52.js


La diferencia del archivo ha sido suprimido porque es demasiado grande
+ 0 - 0
dist/static/js/chunk-c24373c6.5b50cba8.js


La diferencia del archivo ha sido suprimido porque es demasiado grande
+ 0 - 0
dist/static/js/chunk-libs.e0ce3055.js


+ 1 - 1
src/components/Breadcrumb/index.vue

@@ -61,7 +61,7 @@ export default {
         this.$router.push(redirect)
         return
       }
-      this.$router.push(this.pathCompile(path))
+      this.$router.push(this.pathCompile(path)+'/index')
     }
   }
 }

+ 120 - 0
src/components/chartIcon/index.vue

@@ -0,0 +1,120 @@
+<template>
+  <div class="chat-icon" @click="toggleChat">
+    <i class="el-icon-chat-dot-round"></i>
+    <div v-if="showChat" class="chat-window">
+      <div class="chat-header">
+        <i class="el-icon-close close-icon" @click.stop="closeChat"></i>
+      </div>
+      <ChatBox />
+    </div>
+  </div>
+</template>
+
+<script>
+import ChatBox from "@/components/ai.vue";
+import LoginModal from "@/components/LoginModal";
+import MarkdownIt from "markdown-it";
+import { pcInnerAi, getMinioURl } from "@/api/api";
+import { modelList, get_default } from "@/api/knowledge";
+import axios from "axios";
+const md = new MarkdownIt();
+export default {
+  components: {
+   
+    ChatBox,
+  },
+  name: "ChatIcon",
+  data() {
+    return {
+      showChat: false,
+    };
+  },
+
+  methods: {
+    toggleChat() {
+      this.showChat = true;
+    },
+    closeChat() {
+      this.showChat = false;
+    },
+  },
+
+};
+</script>
+
+<style scoped>
+.chat-icon {
+  cursor: pointer;
+  background-color: #409eff;
+  color: #000;
+  width: 50px;
+  height: 50px;
+  border-radius: 50%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 24px;
+}
+.el-icon-chat-dot-round {
+  color: white;
+}
+.chat-window {
+  position: absolute;
+  bottom: 60px;
+  right: 0;
+  width: 500px;
+  height: 600px;
+  background-color: white;
+  border: 1px solid #dcdfe6;
+  border-radius: 4px;
+  padding: 20px;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  display: flex;
+  flex-direction: column;
+}
+.chat-header {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  padding-bottom: 10px;
+  /*  border-bottom: 1px solid #dcdfe6; */
+}
+
+.chat-messages {
+  flex-grow: 1;
+  overflow-y: auto;
+  padding: 10px 0;
+}
+
+.message {
+  margin-bottom: 10px;
+  padding: 8px 12px;
+  border-radius: 4px;
+  max-width: 80%;
+}
+
+.user {
+  align-self: flex-end;
+  /*  background-color: #409EFF; */
+  color: #000;
+}
+
+.agent {
+  align-self: flex-start;
+  background-color: #f4f4f5;
+  color: #333;
+}
+
+.chat-input {
+  margin-top: 10px;
+}
+::v-deep .messages{
+    height: calc(100vh - 515px);
+}
+::v-deep .input-container{
+    left: 50%;
+}
+::v-deep .sender-name{
+    font-size: 14px;
+}
+</style>

+ 12 - 4
src/components/webAi/js/ChatBox.js

@@ -1,8 +1,9 @@
 import LoginModal from "@/components/LoginModal";
 import MarkdownIt from "markdown-it";
 import { pcInnerAi,getMinioURl } from "@/api/api";
-import {modelList,listBuckets,selectTypeList,getBucketContents,configSave,configList,configDelete,application_types,set_default} from "@/api/knowledge"
+import {modelList,listBuckets,selectTypeList,getBucketContents,configSave,configList,configDelete,application_types,set_default,configurationInfo} from "@/api/knowledge"
 import axios from 'axios';
+import { type } from "jquery";
 const md = new MarkdownIt();
 
 export default {
@@ -241,6 +242,7 @@ export default {
       /*console.log(this.AIform); */
       this.$router.push({
         path: "/knowledge/appConfig/index",
+        type:'add'
       });
      /*  this.applicationDialogVisible = true; */
     },
@@ -264,9 +266,15 @@ export default {
     },
     /* 查看 */
     viewApplication(card) {
-      console.log(card);
+      /* configurationInfo({id:card.id}).then(res=>{
+        console.log(res);
+      }) */
       this.viewForm = { ...card };
-      this.viewDialogVisible = true;
+      this.$router.push({
+        path: "/knowledge/appConfig/index",
+        query: { id: card.id,card:card,type:'view' },
+      });
+     /*  this.viewDialogVisible = true; */
     },
 
     /* 删除 */
@@ -351,7 +359,7 @@ export default {
       }
       this.$router.push({
         path: "/knowledge/appConfig/index",
-        query: { id: card.id,card:card },
+        query: { id: card.id,card:card ,type:'edit'},
       });
      /*  this.editDialogVisible = true; */
       console.log(this.editForm);

+ 10 - 1
src/layout/index.vue

@@ -12,6 +12,7 @@
         <settings />
       </right-panel>
     </div>
+     <chat-icon />
   </div>
 </template>
 
@@ -19,6 +20,7 @@
 import RightPanel from '@/components/RightPanel'
 import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components'
 import ResizeMixin from './mixin/ResizeHandler'
+import ChatIcon from '@/components/chartIcon' // Add this line
 import { mapState } from 'vuex'
 
 export default {
@@ -29,7 +31,8 @@ export default {
     RightPanel,
     Settings,
     Sidebar,
-    TagsView
+    TagsView,
+    ChatIcon
   },
   mixins: [ResizeMixin],
   computed: {
@@ -99,4 +102,10 @@ export default {
   .mobile .fixed-header {
     width: 100%;
   }
+  .chat-icon {
+    position: fixed;
+    bottom: 20px;
+    right: 20px;
+    z-index: 1000;
+  }
 </style>

+ 1 - 1
src/router/index.js

@@ -328,7 +328,7 @@ export const asyncRoutes = [
     },
     children: [
       {
-        path: 'knowledgeMenu/index',
+        path: 'index',
         component: () => import('@/views/knowledgeMenu/knowledgeList.vue'),
         name: 'KBM\n',
         meta: { title: '知识库管理', noCache: true,roles: ['admin'] }

+ 617 - 71
src/views/appConfig/index.vue

@@ -2,11 +2,13 @@
   <div>
     <div class="header">
       <h2>
-        <span>{{ id == undefined ? "新增" : "编辑" }}</span
+        <span>{{
+          type == "add" ? "新增" : type == "edit" ? "编辑" : "查看"
+        }}</span
         >应用
       </h2>
     </div>
-    <div class="center" v-if="id == undefined">
+    <div class="center" v-if="type == 'add'">
       <el-form
         :inline="true"
         :model="AIform"
@@ -399,7 +401,7 @@
         </el-row>
       </el-form>
     </div>
-    <div class="center" v-else>
+    <div class="center" v-else-if="type == 'edit'">
       <el-form
         :model="editForm"
         :rules="rules"
@@ -813,12 +815,454 @@
         </el-row>
       </el-form>
     </div>
+    <div class="center" v-else>
+      <el-form
+        :model="viewForm"
+        :rules="rules"
+        ref="viewFormRef"
+        label-width="120px"
+        style="margin: 20px 50px"
+        label-position="top"
+      >
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="应用名称:" prop="chat_name">
+              <el-input
+                disabled
+                style="width: 55%"
+                v-model="viewForm.chat_name"
+                placeholder="请输入应用名称"
+              ></el-input>
+            </el-form-item>
+            <!-- <el-form-item label="模型库:" prop="modelLibrary">
+              <el-select
+                v-model="viewForm.modelLibrary"
+                placeholder="ollama"
+                style="width: 100%"
+              >
+                <el-option label="ollama" value="ollama"></el-option>
+              </el-select>
+            </el-form-item> -->
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="应用类型:" prop="application_type">
+              <el-select
+                disabled
+                v-model="viewForm.application_type"
+                placeholder="应用类型"
+                style="width: 55%"
+                clearable
+              >
+                <el-option
+                  v-for="(item, index) in appTypeList"
+                  :label="item.label"
+                  :value="item.value"
+                  :key="index"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="模型名称:" prop="model_name">
+              <el-select
+                disabled
+                v-model="viewForm.model_name"
+                placeholder="请输入选择"
+                style="width: 55%"
+                clearable
+              >
+                <el-option
+                  v-for="(item, index) in modelNameList"
+                  :label="item.name"
+                  :value="item.name"
+                  :key="index"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+            <!-- <el-form-item label="模型类型:" prop="model_type">
+              <el-select
+                v-model="viewForm.model_type"
+                placeholder="请输入选择"
+                style="width: 100%"
+              >
+                <el-option label="chat" value="chat"></el-option>
+              </el-select>
+            </el-form-item> -->
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="知识库:" prop="knowledge_base_names">
+              <el-select
+                disabled
+                v-model="viewForm.knowledge_base_names"
+                multiple
+                placeholder="请选择知识库"
+                style="width: 55%"
+                @change="handleEditKnowledgeBaseChange"
+                clearable
+                filterable
+              >
+                <el-option
+                  v-for="(item, index) in kneList"
+                  :label="item.name"
+                  :value="item.id"
+                  :key="index"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="文档目录:" prop="document_directories">
+              <el-select
+                v-model="viewForm.document_directories"
+                placeholder="请选择文档目录"
+                style="width: 55%"
+                disabled
+                @change="handleEditDirectoryChange"
+                clearable
+                filterable
+              >
+                <el-option
+                  v-for="(dir, index) in editDirectoryList"
+                  :label="dir.name"
+                  :value="dir.id"
+                  :key="index"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="文  档:" prop="documents">
+              <el-select
+                v-model="viewForm.documents"
+                multiple
+                placeholder="请选择文档"
+                style="width: 55%"
+                disabled
+                clearable
+                filterable
+              >
+                <el-option
+                  v-for="(doc, index) in editDocumentList"
+                  :label="doc.name"
+                  :value="doc.id"
+                  :key="index"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="描 述:">
+              <el-input
+                disabled
+                style="width: 55%"
+                v-model="viewForm.role_description"
+                placeholder="请输入描述"
+                type="textarea"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="温度:" prop="temperature">
+              <div style="display: flex; justify-content: space-around">
+                <el-slider
+                  disabled
+                  style="width: 60%"
+                  v-model="viewForm.temperature"
+                  :min="0"
+                  :max="1"
+                  :step="0.1"
+                ></el-slider>
+                <el-input-number
+                  disabled
+                  v-model="viewForm.temperature"
+                  :min="0"
+                  :max="1"
+                ></el-input-number>
+              </div>
+              <div class="hint">控制生成文本的随机性,0为最保守,1为最创新</div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="最大token数:" prop="max_tokens">
+              <div style="display: flex; justify-content: space-around">
+                <el-slider
+                  disabled
+                  style="width: 60%"
+                  v-model="viewForm.max_tokens"
+                  :min="1"
+                  :max="4096"
+                  :step="1"
+                ></el-slider>
+                <el-input-number
+                  disabled
+                  v-model="viewForm.max_tokens"
+                  :min="0"
+                  :max="4096"
+                  :step="1"
+                ></el-input-number>
+              </div>
+              <div class="hint">限制生成文本的最大长度</div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="核采样参数:" prop="top_p">
+              <div style="display: flex; justify-content: space-around">
+                <el-slider
+                  disabled
+                  style="width: 60%"
+                  v-model="viewForm.top_p"
+                  :min="0"
+                  :max="1"
+                  :step="0.1"
+                ></el-slider>
+                <el-input-number
+                  disabled
+                  v-model="viewForm.top_p"
+                  :min="0"
+                  :max="1"
+                  :step="0.1"
+                ></el-input-number>
+              </div>
+              <div class="hint">控制词汇多样性,1为考虑所有可能性</div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="重复内容惩罚:" prop="frequency_penalty">
+              <div style="display: flex; justify-content: space-around">
+                <el-slider
+                  disabled
+                  style="width: 60%"
+                  v-model="viewForm.frequency_penalty"
+                  :min="-2"
+                  :max="2"
+                  :step="0.1"
+                ></el-slider>
+                <el-input-number
+                  disabled
+                  v-model="viewForm.frequency_penalty"
+                  :min="-2"
+                  :max="2"
+                  :step="0.1"
+                ></el-input-number>
+              </div>
+              <div class="hint">防止重复,正值减少重复,负值增加重复</div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="新话题偏好:" prop="presence_penalty">
+              <div style="display: flex; justify-content: space-around">
+                <el-slider
+                  disabled
+                  style="width: 60%"
+                  v-model="viewForm.presence_penalty"
+                  :min="-2"
+                  :max="2"
+                  :step="0.1"
+                ></el-slider>
+                <el-input-number
+                  disabled
+                  v-model="viewForm.presence_penalty"
+                  :min="-2"
+                  :max="2"
+                  :step="0.1"
+                ></el-input-number>
+              </div>
+              <div class="hint">正值鼓励新话题,负值保持话题一致性</div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="响应格式:" prop="response_format">
+              <el-input
+                disabled
+                style="width: 55%"
+                v-model="viewForm.response_format"
+                placeholder="text"
+              ></el-input>
+              <div class="hint">指定AI响应的格式,如text, json等</div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="上下文窗口:" prop="context_window">
+              <div style="display: flex; justify-content: space-around">
+                <el-slider
+                  disabled
+                  style="width: 60%"
+                  v-model="viewForm.context_window"
+                  :min="1"
+                  :max="4096"
+                ></el-slider>
+                <el-input-number
+                  disabled
+                  v-model="viewForm.presence_penalty"
+                  :min="1"
+                  :max="4096"
+                  :step="1"
+                ></el-input-number>
+              </div>
+              <div class="hint">AI考虑的上下文token数量</div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="会话ID:" prop="session_id">
+              <el-input
+                disabled
+                style="width: 55%"
+                v-model="viewForm.session_id"
+                placeholder="可选"
+              ></el-input>
+              <div class="hint">特定会话的唯一标识符,如果有的话</div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="语言:" prop="language">
+              <el-select
+                disabled
+                v-model="viewForm.language"
+                style="width: 55%"
+              >
+                <el-option label="中文" value="zh"></el-option>
+                <el-option label="English" value="en"></el-option>
+                <el-option label="日本語" value="ja"></el-option>
+                <el-option label="한국어" value="ko"></el-option>
+                <el-option label="Français" value="fr"></el-option>
+                <el-option label="Deutsch" value="de"></el-option>
+              </el-select>
+              <div class="hint">选择AI响应的主要语言</div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="请求超时:" prop="timeout">
+              <el-input-number
+                disabled
+                v-model="viewForm.timeout"
+                :min="1"
+                :max="60"
+              ></el-input-number>
+              <div class="hint">设置请求的最大等待时间(秒)</div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="角色名称:" prop="role_name">
+              <el-input
+                disabled
+                style="width: 55%"
+                v-model="viewForm.role_name"
+                placeholder="例如: 客服专员"
+              ></el-input>
+              <div class="hint">为AI助手设定一个角色名称</div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="角色权限:" prop="role_permissions">
+              <el-input
+                disabled
+                style="width: 55%"
+                v-model="viewForm.role_permissions"
+                placeholder='["回答产品问题", "处理退换货请求", "升级复杂问题"]'
+              ></el-input>
+              <div class="hint">输入JSON数组,列出AI助手的具体权限</div>
+            </el-form-item>
+          </el-col>
+          <!-- <el-col :span="12">
+            <el-form-item label="角色描述:" prop="role_description">
+              <el-input
+               style="width: 55%"
+                v-model="viewForm.role_description"
+                type="textarea"
+                :rows="3"
+                placeholder="例如: 你是一位专业的客服专员,负责解答客户关于我们产品和服务的问题。"
+              ></el-input>
+              <div class="hint">详细描述AI助手的角色和职责</div>
+            </el-form-item>
+          </el-col> -->
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="自定义变量:" prop="custom_variables">
+              <el-input
+                disabled
+                style="width: 55%"
+                v-model="viewForm.custom_variables"
+                placeholder='{"custom_greeting": "很高兴为您服务!", "company_name": "ABC公司"}'
+              ></el-input>
+              <div class="hint">
+                输入JSON对象,定义可在提示模板中使用的自定义变量
+              </div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="自定义提示模板:" prop="custom_prompt">
+              <el-input
+                disabled
+                style="width: 60%"
+                v-model="viewForm.custom_prompt"
+                type="textarea"
+                :rows="6"
+                placeholder="使用以下上下文来回答问题。如果你不知道答案,就说你不知道,不要试图编造答案。
+                    上下文: {context}
+                    人类: {question}
+                    AI助手: 让我根据提供的上下文来回答你的问题。{custom_greeting}"
+              ></el-input>
+              <div class="hint">
+                自定义AI助手的回答模板,可使用变量如{context}, {question}等
+              </div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24">
+          <el-col :span="12">
+            <el-form-item label="是否启用API_key:" prop="generate_new_api_key">
+              <el-switch
+                disabled
+                v-model="viewForm.generate_new_api_key"
+                active-color="#13ce66"
+                inactive-color="#ff4949"
+              >
+              </el-switch>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="是否设为默认:" prop="is_default">
+              <el-switch
+                disabled
+                v-model="viewForm.is_default"
+                active-color="#13ce66"
+                inactive-color="#ff4949"
+              >
+              </el-switch>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </div>
     <div class="footer">
       <el-button @click="cancelApplication">取 消</el-button>
-      <el-button type="primary" v-if="id==undefined" @click="generateApplication"
+      <el-button
+        type="primary"
+        v-if="type == 'add'"
+        @click="generateApplication"
         >生成应用</el-button
       >
-      <el-button type="primary" v-else @click="submitEdit"
+      <el-button type="primary" v-else-if="type == 'edit'" @click="submitEdit"
         >确认修改</el-button
       >
     </div>
@@ -837,7 +1281,7 @@ import {
   configDelete,
   application_types,
   set_default,
-  configurationInfo
+  configurationInfo,
 } from "@/api/knowledge";
 export default {
   /*组件参数 接收来自父组件的数据*/
@@ -943,6 +1387,36 @@ export default {
       },
       editDirectoryList: [],
       editDocumentList: [],
+      type: "",
+      viewForm: {
+        // 复制 AIform 的结构,但初始值为空
+        chat_name: "",
+        modelLibrary: "ollama",
+        model_type: "chat",
+        model_name: "",
+        knowledge_base_names: [],
+        document_directories: [],
+        documents: [],
+        temperature: 0.7,
+        max_tokens: 150,
+        top_p: 1.0,
+        frequency_penalty: 0.0,
+        presence_penalty: 0.0,
+        response_format: "text",
+        context_window: 2048,
+        user_id: "user123",
+        session_id: "session456",
+        language: "en",
+        timeout: 30,
+        role_name: "Admin",
+        role_description: "",
+        role_permissions: "",
+        custom_variables: "",
+        custom_prompt: "",
+        application_type: "",
+        is_default: false,
+        generate_new_api_key: true,
+      },
     };
   },
 
@@ -986,9 +1460,12 @@ export default {
   mounted() {
     /* 初始化列表 */
     this.init();
+    this.type = this.$route.query.type;
     this.id = this.$route.query.id;
-    if(this.id!==undefined){
-        this.initView()
+    if (this.type == "edit") {
+      this.initEdit();
+    } else if (this.type == "view") {
+      this.initView();
     }
   },
 
@@ -996,44 +1473,51 @@ export default {
   methods: {
     /* 编辑 */
     /* 编辑确认修改 */
-    submitEdit(){
-        this.$refs.editFormRef.validate(async (valid) => {
+    submitEdit() {
+      this.$refs.editFormRef.validate(async (valid) => {
         if (valid) {
           try {
             const convertedForm = { ...this.editForm };
             console.log(this.editForm);
             // 转换知识库、文档目录和文档的ID为名称
-           /*  convertedForm.knowledge_base_names = this.safeGetNamesByIds(this.editForm.knowledge_base_names, this.kneList); */
-           /*  convertedForm.documents = this.safeGetNamesByIds(this.editForm.documents, this.editDocumentList); */
-            convertedForm.document_directories = this.safeGetNamesByIds(this.editForm.document_directories, this.editDirectoryList);
+            /*  convertedForm.knowledge_base_names = this.safeGetNamesByIds(this.editForm.knowledge_base_names, this.kneList); */
+            /*  convertedForm.documents = this.safeGetNamesByIds(this.editForm.documents, this.editDocumentList); */
+            convertedForm.document_directories = this.safeGetNamesByIds(
+              this.editForm.document_directories,
+              this.editDirectoryList
+            );
             if (convertedForm.document_directories.length === 0) {
-              convertedForm.document_directories = ['全部'];
+              convertedForm.document_directories = ["全部"];
             }
-    
-            console.log('Converted form for edit:', convertedForm);
-    
-            const response = await axios.post(`${process.env.VUE_APP_BASE_API}/chatbot/configuration/update/`, convertedForm, {
-              headers: {
-                'Content-Type': 'application/json'
+
+            console.log("Converted form for edit:", convertedForm);
+
+            const response = await axios.post(
+              `${process.env.VUE_APP_BASE_API}/chatbot/configuration/update/`,
+              convertedForm,
+              {
+                headers: {
+                  "Content-Type": "application/json",
+                },
               }
-            });
-    
+            );
+
             if (response.status === 200) {
-              this.$message.success('应用更新成功');
+              this.$message.success("应用更新成功");
               this.$router.push({
                 path: "/knowledge/chatPage/index",
               }); //跳转到聊天应用页面
               /* this.editDialogVisible = false; */
               /* this.fetchApplicationList(); */
             } else {
-              this.$message.error(response.data.message || '应用更新失败');
+              this.$message.error(response.data.message || "应用更新失败");
             }
           } catch (error) {
-            console.error('Error updating application:', error);
-            this.$message.error('应用更新失败,请稍后重试');
+            console.error("Error updating application:", error);
+            this.$message.error("应用更新失败,请稍后重试");
           }
         } else {
-          this.$message.error('请填写所有必填字段');
+          this.$message.error("请填写所有必填字段");
           return false;
         }
       });
@@ -1049,37 +1533,39 @@ export default {
     handleEditDirectoryChange(val) {
       // 重置文档选择
       this.editForm.documents = [];
-      
+
       // 加载选中目录对应的文档列表
       this.loadEditDocumentList(val);
     },
-   /* 知识库选择监听 */
+    /* 知识库选择监听 */
     async loadEditDirectoryList(val) {
       this.editDirectoryList = []; // 清空现有目录列表
       let totalDocuments = 0;
       let otherFolderCount = 0;
-      
+
       for (const kbName of val) {
         // 根据知识库名称找到对应的 ID
-        const kbId = this.kneList.find(kb => kb.name === kbName)?.id;
-        
+        const kbId = this.kneList.find((kb) => kb.name === kbName)?.id;
+
         /* if (!kbId) {
           console.error(`No matching knowledge base found for name: ${kbName}`);
           continue;
         } */
-    
+
         const typeForm = {
           page: 1,
           pageSize: 9999,
           kb_id: kbName,
         };
-        
+
         try {
           const res = await selectTypeList(typeForm);
           if (res.data) {
-            this.editDirectoryList = [...new Set([...this.editDirectoryList, ...res.data.dataList])];
-            
-            res.data.dataList.forEach(folder => {
+            this.editDirectoryList = [
+              ...new Set([...this.editDirectoryList, ...res.data.dataList]),
+            ];
+
+            res.data.dataList.forEach((folder) => {
               if (folder.id === "other") {
                 otherFolderCount += folder.document_count || 0;
               } else {
@@ -1088,10 +1574,13 @@ export default {
             });
           }
         } catch (error) {
-          console.error(`Error loading directory list for kb_id ${kbId}:`, error);
+          console.error(
+            `Error loading directory list for kb_id ${kbId}:`,
+            error
+          );
         }
       }
-      
+
       this.editDirectoryList.unshift({
         id: "001",
         name: "全部",
@@ -1102,12 +1591,12 @@ export default {
     loadEditDocumentList(val) {
       // 找到选中目录的名称
       const selectedDirectoryName = val;
-      const id= this.directoryList.find(el=>el.id==val)
+      const id = this.directoryList.find((el) => el.id == val);
       // 从 kneList 中找到对应的知识库
-      const selectedKnowledgeBase = this.kneList.find(kb => 
-        kb.id === this.editForm.knowledge_base_names[0]
+      const selectedKnowledgeBase = this.kneList.find(
+        (kb) => kb.id === this.editForm.knowledge_base_names[0]
       );
-    
+
       /* if (!selectedKnowledgeBase) {
         console.error('No matching knowledge base found');
         return;
@@ -1115,17 +1604,22 @@ export default {
       let queryForm = {
         page: 1,
         pageSize: 9999,
-        bucket_id:selectedKnowledgeBase.id,
-        doc_type_id: selectedDirectoryName === '001' ? '' : this.getDirectoryIdByName(selectedDirectoryName),
+        bucket_id: selectedKnowledgeBase.id,
+        doc_type_id:
+          selectedDirectoryName === "001"
+            ? ""
+            : this.getDirectoryIdByName(selectedDirectoryName),
       };
-    
-      getBucketContents(queryForm).then(res => {
+
+      getBucketContents(queryForm).then((res) => {
         this.editDocumentList = res.data.documents;
       });
     },
     // 添加一个辅助方法来根据目录名称获取目录ID
     getDirectoryIdByName(directoryName) {
-      const directory = this.editDirectoryList.find(dir => dir.name === directoryName);
+      const directory = this.editDirectoryList.find(
+        (dir) => dir.name === directoryName
+      );
       return directory ? directory.id : null;
     },
 
@@ -1166,14 +1660,21 @@ export default {
     },
     /* 取消 */
     cancelApplication() {
-      this.$confirm("确认取消?未保存的更改将会丢失。")
-        .then((_) => {
-          this.resetForm();
-          this.$router.push({
-            path: "/knowledge/chatPage/index",
-          });
-        })
-        .catch((_) => {});
+      if (this.type == "view") {
+        this.resetForm();
+        this.$router.push({
+          path: "/knowledge/chatPage/index",
+        });
+      } else {
+        this.$confirm("确认取消?未保存的更改将会丢失。")
+          .then((_) => {
+            this.resetForm();
+            this.$router.push({
+              path: "/knowledge/chatPage/index",
+            });
+          })
+          .catch((_) => {});
+      }
     },
     /* 新增聊天应用 */
     generateApplication() {
@@ -1363,41 +1864,86 @@ export default {
       });
     },
     /* 编辑查看 */
-    initView(){
-        // 根据 card 的数据填充 editForm
+    initEdit() {
+      // 根据 card 的数据填充 editForm
       this.editForm = JSON.parse(JSON.stringify(this.$route.query.card)); // 深拷贝以避免直接修改原对象
-      
+
       // 处理 knowledge_base_names
-      this.editForm.knowledge_base_names = this.editForm.knowledge_base_names.map(name => {
-        const kb = this.kneList.find(kb => kb.name === name);
-        return kb ? kb.id : name; // 如果找不到对应的知识库,保留原名称
-      });
+      this.editForm.knowledge_base_names =
+        this.editForm.knowledge_base_names.map((name) => {
+          const kb = this.kneList.find((kb) => kb.name === name);
+          return kb ? kb.id : name; // 如果找不到对应的知识库,保留原名称
+        });
 
       // 处理 role_permissions
       if (this.editForm.role_permissions) {
-        if (typeof this.editForm.role_permissions !== 'string') {
+        if (typeof this.editForm.role_permissions !== "string") {
           try {
-            this.editForm.role_permissions = JSON.stringify(this.editForm.role_permissions);
+            this.editForm.role_permissions = JSON.stringify(
+              this.editForm.role_permissions
+            );
           } catch (error) {
-            console.error('Error stringifying role_permissions:', error);
-            this.editForm.role_permissions = '';
+            console.error("Error stringifying role_permissions:", error);
+            this.editForm.role_permissions = "";
           }
         }
       } else {
-        this.editForm.role_permissions = '';
+        this.editForm.role_permissions = "";
       }
 
       // 处理 custom_variables
       if (this.editForm.custom_variables) {
-        this.editForm.custom_variables = JSON.stringify(this.editForm.custom_variables);     
+        this.editForm.custom_variables = JSON.stringify(
+          this.editForm.custom_variables
+        );
       } else {
         this.editForm.custom_variables = "";
       }
-      console.log(this.editForm);
 
       // 加载知识库对应的目录列表
       this.loadEditDirectoryList(this.editForm.knowledge_base_names);
-    }
+      /* this.loadEditDocumentList(this.editForm.document_directories[0]); */
+    },
+    /* 查看 */
+    initView() {
+      // 根据 card 的数据填充 viewForm
+      this.viewForm = JSON.parse(JSON.stringify(this.$route.query.card)); // 深拷贝以避免直接修改原对象
+
+      // 处理 knowledge_base_names
+      this.viewForm.knowledge_base_names =
+        this.viewForm.knowledge_base_names.map((name) => {
+          const kb = this.kneList.find((kb) => kb.name === name);
+          return kb ? kb.id : name; // 如果找不到对应的知识库,保留原名称
+        });
+
+      // 处理 role_permissions
+      if (this.viewForm.role_permissions) {
+        if (typeof this.viewForm.role_permissions !== "string") {
+          try {
+            this.viewForm.role_permissions = JSON.stringify(
+              this.viewForm.role_permissions
+            );
+          } catch (error) {
+            console.error("Error stringifying role_permissions:", error);
+            this.viewForm.role_permissions = "";
+          }
+        }
+      } else {
+        this.viewForm.role_permissions = "";
+      }
+
+      // 处理 custom_variables
+      if (this.viewForm.custom_variables) {
+        this.viewForm.custom_variables = JSON.stringify(
+          this.viewForm.custom_variables
+        );
+      } else {
+        this.viewForm.custom_variables = "";
+      }
+
+      // 加载知识库对应的目录列表
+      this.loadEditDirectoryList(this.viewForm.knowledge_base_names);
+    },
   },
 };
 </script>

Algunos archivos no se mostraron porque demasiados archivos cambiaron en este cambio