index.vue 78 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299
  1. <template>
  2. <div>
  3. <div class="header">
  4. <h2>
  5. <span>{{
  6. type == "add" ? "新增" : type == "edit" ? "编辑" : "查看"
  7. }}</span
  8. >应用
  9. </h2>
  10. </div>
  11. <div class="center" v-if="type == 'add'">
  12. <el-form
  13. :inline="true"
  14. :model="AIform"
  15. :rules="rules"
  16. ref="AIformRef"
  17. class="demo-form-inline"
  18. style="margin-top: 15px; margin-left: 50px"
  19. label-position="top"
  20. label-width="90px"
  21. >
  22. <el-row :gutter="24">
  23. <el-col :span="12">
  24. <el-form-item label="应用名称:" prop="chat_name">
  25. <el-input
  26. style="width: 55%"
  27. v-model="AIform.chat_name"
  28. placeholder="请输入应用名称"
  29. ></el-input>
  30. </el-form-item>
  31. </el-col>
  32. <el-col :span="12">
  33. <el-form-item label="应用类型:" prop="application_type">
  34. <el-select
  35. v-model="AIform.application_type"
  36. placeholder="应用类型"
  37. style="width: 55%"
  38. clearable
  39. >
  40. <el-option
  41. v-for="(item, index) in appTypeList"
  42. :label="item.label"
  43. :value="item.value"
  44. :key="index"
  45. ></el-option>
  46. </el-select>
  47. </el-form-item>
  48. </el-col>
  49. </el-row>
  50. <el-row :gutter="24">
  51. <el-col :span="12">
  52. <el-form-item label="模型名称:" prop="model_name">
  53. <el-select
  54. v-model="AIform.model_name"
  55. placeholder="请输入选择"
  56. style="width: 55%"
  57. clearable
  58. >
  59. <el-option
  60. v-for="(item, index) in modelNameList"
  61. :label="item.name"
  62. :value="item.name"
  63. :key="index"
  64. ></el-option>
  65. </el-select>
  66. </el-form-item>
  67. </el-col>
  68. <el-col :span="12">
  69. <el-form-item label="知识库:" prop="knowledge_base_names">
  70. <el-select
  71. v-model="AIform.knowledge_base_names"
  72. multiple
  73. placeholder="请选择知识库"
  74. style="width: 55%"
  75. @change="handleKnowledgeBaseChange"
  76. clearable
  77. filterable
  78. >
  79. <el-option
  80. v-for="(item, index) in kneList"
  81. :label="item.name"
  82. :value="item.id"
  83. :key="index"
  84. ></el-option>
  85. </el-select> </el-form-item
  86. ></el-col>
  87. </el-row>
  88. <el-row :gutter="24">
  89. <el-col :span="12">
  90. <el-form-item label="文档目录:" prop="document_directories">
  91. <el-select
  92. v-model="AIform.document_directories"
  93. placeholder="请选择文档目录"
  94. style="width: 55%"
  95. :disabled="!AIform.knowledge_base_names.length"
  96. @change="handleDirectoryChange"
  97. clearable
  98. filterable
  99. >
  100. <el-option
  101. v-for="(dir, index) in directoryList"
  102. :label="dir.name"
  103. :value="dir.id"
  104. :key="index"
  105. ></el-option>
  106. </el-select> </el-form-item
  107. ></el-col>
  108. <el-col :span="12">
  109. <el-form-item label="文 档:" prop="documents">
  110. <el-select
  111. v-model="AIform.documents"
  112. multiple
  113. placeholder="请选择文档"
  114. style="width: 55%"
  115. :disabled="isDocumentSelectDisabled"
  116. clearable
  117. filterable
  118. @change="handleDocumentChange"
  119. >
  120. <el-option label="全部" value="all"></el-option>
  121. <el-option
  122. v-for="(doc, index) in documentList"
  123. :label="doc.name"
  124. :value="doc.id"
  125. :key="index"
  126. ></el-option>
  127. </el-select>
  128. </el-form-item>
  129. </el-col>
  130. </el-row>
  131. <el-row :gutter="24">
  132. <el-col :span="12">
  133. <el-form-item label="应用图标:">
  134. <!-- aiagent_icon -->
  135. <el-upload
  136. class="avatar-uploader"
  137. :action="uploadUrl"
  138. method="post"
  139. :data="params"
  140. :show-file-list="false"
  141. :on-success="onUploadAddSuccess"
  142. >
  143. <img
  144. v-if="
  145. AIform.aiagent_icon != null && AIform.aiagent_icon != ''
  146. "
  147. :src="AIform.aiagent_icon"
  148. class="avatar"
  149. />
  150. <i v-else class="el-icon-plus avatar-uploader-icon"></i>
  151. <!-- <svg-icon
  152. icon-class="header"
  153. style="height: 70px; width: 70px"
  154. v-else
  155. /> -->
  156. </el-upload>
  157. </el-form-item></el-col
  158. >
  159. <el-col :span="12">
  160. <el-form-item label="描 述:">
  161. <el-input
  162. style="width: 55%"
  163. v-model="AIform.role_description"
  164. placeholder="请输入描述"
  165. type="textarea"
  166. ></el-input>
  167. </el-form-item>
  168. </el-col>
  169. </el-row>
  170. <el-row :gutter="24">
  171. <el-col :span="12">
  172. <el-form-item label="温度:" prop="temperature">
  173. <div style="display: flex; justify-content: space-around">
  174. <el-slider
  175. style="width: 60%"
  176. v-model="AIform.temperature"
  177. :min="0"
  178. :max="1"
  179. :step="0.1"
  180. ></el-slider>
  181. <el-input-number
  182. v-model="AIform.temperature"
  183. :min="0"
  184. :max="1"
  185. ></el-input-number>
  186. </div>
  187. <div class="hint">控制生成文本的随机性,0为最保守,1为最创新</div>
  188. </el-form-item>
  189. </el-col>
  190. <el-col :span="12">
  191. <el-form-item label="最大token数:" prop="max_tokens">
  192. <div style="display: flex; justify-content: space-around">
  193. <el-slider
  194. style="width: 60%"
  195. v-model="AIform.max_tokens"
  196. :min="1"
  197. :max="4096"
  198. :step="1"
  199. ></el-slider>
  200. <el-input-number
  201. v-model="AIform.max_tokens"
  202. :min="0"
  203. :max="4096"
  204. :step="1"
  205. ></el-input-number>
  206. </div>
  207. <div class="hint">限制生成文本的最大长度</div>
  208. </el-form-item>
  209. </el-col>
  210. </el-row>
  211. <el-row :gutter="24">
  212. <el-col :span="12">
  213. <el-form-item label="核采样参数:" prop="top_p">
  214. <div style="display: flex; justify-content: space-around">
  215. <el-slider
  216. style="width: 60%"
  217. v-model="AIform.top_p"
  218. :min="0"
  219. :max="1"
  220. :step="0.1"
  221. ></el-slider>
  222. <el-input-number
  223. v-model="AIform.top_p"
  224. :min="0"
  225. :max="1"
  226. :step="0.1"
  227. ></el-input-number>
  228. </div>
  229. <div class="hint">控制词汇多样性,1为考虑所有可能性</div>
  230. </el-form-item>
  231. </el-col>
  232. <el-col :span="12">
  233. <el-form-item label="重复内容惩罚:" prop="frequency_penalty">
  234. <div style="display: flex; justify-content: space-around">
  235. <el-slider
  236. style="width: 60%"
  237. v-model="AIform.frequency_penalty"
  238. :min="-2"
  239. :max="2"
  240. :step="0.1"
  241. ></el-slider>
  242. <el-input-number
  243. v-model="AIform.frequency_penalty"
  244. :min="-2"
  245. :max="2"
  246. :step="0.1"
  247. ></el-input-number>
  248. </div>
  249. <div class="hint">防止重复,正值减少重复,负值增加重复</div>
  250. </el-form-item>
  251. </el-col>
  252. </el-row>
  253. <el-row :gutter="24">
  254. <el-col :span="12">
  255. <el-form-item label="新话题偏好:" prop="presence_penalty">
  256. <div style="display: flex; justify-content: space-around">
  257. <el-slider
  258. style="width: 60%"
  259. v-model="AIform.presence_penalty"
  260. :min="-2"
  261. :max="2"
  262. :step="0.1"
  263. ></el-slider>
  264. <el-input-number
  265. v-model="AIform.presence_penalty"
  266. :min="-2"
  267. :max="2"
  268. :step="0.1"
  269. ></el-input-number>
  270. </div>
  271. <div class="hint">正值鼓励新话题,负值保持话题一致性</div>
  272. </el-form-item>
  273. </el-col>
  274. <el-col :span="12">
  275. <el-form-item label="响应格式:" prop="response_format">
  276. <el-input
  277. style="width: 55%"
  278. v-model="AIform.response_format"
  279. placeholder="text"
  280. ></el-input>
  281. <div class="hint">指定AI响应的格式,如text, json等</div>
  282. </el-form-item>
  283. </el-col>
  284. </el-row>
  285. <el-row :gutter="24">
  286. <el-col :span="12">
  287. <el-form-item label="上下文窗口:" prop="context_window">
  288. <div style="display: flex; justify-content: space-around">
  289. <el-slider
  290. style="width: 60%"
  291. v-model="AIform.context_window"
  292. :min="1"
  293. :max="4096"
  294. ></el-slider>
  295. <el-input-number
  296. v-model="AIform.presence_penalty"
  297. :min="1"
  298. :max="4096"
  299. :step="1"
  300. ></el-input-number>
  301. </div>
  302. <div class="hint">AI考虑的上下文token数量</div>
  303. </el-form-item>
  304. </el-col>
  305. <!-- <el-col :span="12">
  306. <el-form-item label="会话ID:" prop="session_id">
  307. <el-input
  308. style="width: 55%"
  309. v-model="AIform.session_id"
  310. placeholder="可选"
  311. ></el-input>
  312. <div class="hint">特定会话的唯一标识符,如果有的话</div>
  313. </el-form-item>
  314. </el-col> -->
  315. </el-row>
  316. <el-row :gutter="24">
  317. <el-col :span="12">
  318. <el-form-item label="语言:" prop="language">
  319. <el-select v-model="AIform.language" style="width: 55%">
  320. <el-option label="中文" value="zh"></el-option>
  321. <el-option label="English" value="en"></el-option>
  322. <el-option label="日本語" value="ja"></el-option>
  323. <el-option label="한국어" value="ko"></el-option>
  324. <el-option label="Français" value="fr"></el-option>
  325. <el-option label="Deutsch" value="de"></el-option>
  326. </el-select>
  327. <div class="hint">选择AI响应的主要语言</div>
  328. </el-form-item>
  329. </el-col>
  330. <el-col :span="12">
  331. <el-form-item label="请求超时:" prop="timeout">
  332. <el-input-number
  333. v-model="AIform.timeout"
  334. :min="1"
  335. :max="60"
  336. ></el-input-number>
  337. <div class="hint">设置请求的最大等待时间(秒)</div>
  338. </el-form-item>
  339. </el-col>
  340. </el-row>
  341. <el-row :gutter="24">
  342. <el-col :span="12">
  343. <el-form-item label="角色名称:" prop="role_name">
  344. <el-input
  345. style="width: 55%"
  346. v-model="AIform.role_name"
  347. placeholder="例如: 客服专员"
  348. ></el-input>
  349. <div class="hint">为AI助手设定一个角色名称</div>
  350. </el-form-item>
  351. </el-col>
  352. <!-- <el-col :span="12">
  353. <el-form-item label="角色描述:" prop="role_description">
  354. <el-input
  355. style="width: 55%"
  356. v-model="AIform.role_description"
  357. type="textarea"
  358. :rows="3"
  359. placeholder="例如: 你是一位专业的客服专员,负责解答客户关于我们产品和服务的问题。"
  360. ></el-input>
  361. <div class="hint">详细描述AI助手的角色和职责</div>
  362. </el-form-item>
  363. </el-col> -->
  364. <el-col :span="12">
  365. <el-form-item label="角色权限:" prop="role_permissions">
  366. <el-input
  367. style="width: 55%"
  368. v-model="AIform.role_permissions"
  369. placeholder='["回答产品问题", "处理退换货请求", "升级复杂问题"]'
  370. ></el-input>
  371. <div class="hint">输入JSON数组,列出AI助手的具体权限</div>
  372. </el-form-item>
  373. </el-col>
  374. </el-row>
  375. <el-row :gutter="24">
  376. <el-col :span="12">
  377. <el-form-item label="自定义变量:" prop="custom_variables">
  378. <el-input
  379. style="width: 55%"
  380. v-model="AIform.custom_variables"
  381. placeholder='{"custom_greeting": "很高兴为您服务!", "company_name": "ABC公司"}'
  382. ></el-input>
  383. <div class="hint">
  384. 输入JSON对象,定义可在提示模板中使用的自定义变量
  385. </div>
  386. </el-form-item>
  387. </el-col>
  388. </el-row>
  389. <el-row :gutter="24">
  390. <el-col :span="24">
  391. <el-form-item label="自定义提示模板:" prop="custom_prompt">
  392. <el-input
  393. style="width: 100%"
  394. v-model="AIform.custom_prompt"
  395. type="textarea"
  396. :rows="12"
  397. placeholder="使用以下上下文来回答问题。如果你不知道答案,就说你不知道,不要试图编造答案。
  398. 上下文: {context}
  399. 人类: {question}
  400. AI助手: 让我根据提供的上下文来回答你的问题。{custom_greeting}"
  401. ></el-input>
  402. <div class="hint">
  403. 自定义AI助手的回答模板,可使用变量如{context}, {question}等
  404. </div>
  405. </el-form-item>
  406. </el-col>
  407. </el-row>
  408. <el-row :gutter="24">
  409. <el-col :span="12">
  410. <el-form-item label="是否启用API_key:" prop="generate_new_api_key">
  411. <el-switch
  412. v-model="AIform.generate_new_api_key"
  413. active-color="#13ce66"
  414. inactive-color="#ff4949"
  415. >
  416. </el-switch>
  417. </el-form-item>
  418. </el-col>
  419. <el-col :span="12">
  420. <el-form-item label="是否设为默认:" prop="is_default">
  421. <el-switch
  422. v-model="AIform.is_default"
  423. active-color="#13ce66"
  424. inactive-color="#ff4949"
  425. >
  426. </el-switch>
  427. </el-form-item>
  428. </el-col>
  429. </el-row>
  430. </el-form>
  431. </div>
  432. <div class="center" v-else-if="type == 'edit'">
  433. <el-form
  434. :model="editForm"
  435. :rules="rules"
  436. ref="editFormRef"
  437. label-width="120px"
  438. style="margin: 20px 50px"
  439. label-position="top"
  440. >
  441. <el-row :gutter="24">
  442. <el-col :span="12">
  443. <el-form-item label="应用名称:" prop="chat_name">
  444. <el-input
  445. style="width: 55%"
  446. v-model="editForm.chat_name"
  447. placeholder="请输入应用名称"
  448. ></el-input>
  449. </el-form-item>
  450. <!-- <el-form-item label="模型库:" prop="modelLibrary">
  451. <el-select
  452. v-model="editForm.modelLibrary"
  453. placeholder="ollama"
  454. style="width: 100%"
  455. >
  456. <el-option label="ollama" value="ollama"></el-option>
  457. </el-select>
  458. </el-form-item> -->
  459. </el-col>
  460. <el-col :span="12">
  461. <el-form-item label="应用类型:" prop="application_type">
  462. <el-select
  463. v-model="editForm.application_type"
  464. placeholder="应用类型"
  465. style="width: 55%"
  466. clearable
  467. >
  468. <el-option
  469. v-for="(item, index) in appTypeList"
  470. :label="item.label"
  471. :value="item.value"
  472. :key="index"
  473. ></el-option>
  474. </el-select>
  475. </el-form-item>
  476. </el-col>
  477. </el-row>
  478. <el-row :gutter="24">
  479. <el-col :span="12">
  480. <el-form-item label="模型名称:" prop="model_name">
  481. <el-select
  482. v-model="editForm.model_name"
  483. placeholder="请输入选择"
  484. style="width: 55%"
  485. clearable
  486. >
  487. <el-option
  488. v-for="(item, index) in modelNameList"
  489. :label="item.name"
  490. :value="item.name"
  491. :key="index"
  492. ></el-option>
  493. </el-select>
  494. </el-form-item>
  495. <!-- <el-form-item label="模型类型:" prop="model_type">
  496. <el-select
  497. v-model="editForm.model_type"
  498. placeholder="请输入选择"
  499. style="width: 100%"
  500. >
  501. <el-option label="chat" value="chat"></el-option>
  502. </el-select>
  503. </el-form-item> -->
  504. </el-col>
  505. <el-col :span="12">
  506. <el-form-item label="知识库:" prop="knowledge_base_names">
  507. <el-select
  508. v-model="editForm.knowledge_base_names"
  509. multiple
  510. placeholder="请选择知识库"
  511. style="width: 55%"
  512. @change="handleEditKnowledgeBaseChange"
  513. clearable
  514. filterable
  515. >
  516. <el-option
  517. v-for="(item, index) in kneList"
  518. :label="item.name"
  519. :value="item.id"
  520. :key="index"
  521. ></el-option>
  522. </el-select>
  523. </el-form-item>
  524. </el-col>
  525. </el-row>
  526. <el-row :gutter="24">
  527. <el-col :span="12">
  528. <el-form-item label="文档目录:" prop="document_directories">
  529. <el-select
  530. v-model="editForm.document_directories"
  531. placeholder="请选择文档目录"
  532. style="width: 55%"
  533. :disabled="
  534. !(
  535. editForm.knowledge_base_names &&
  536. editForm.knowledge_base_names.length
  537. )
  538. "
  539. @change="handleEditDirectoryChange"
  540. clearable
  541. filterable
  542. >
  543. <el-option
  544. v-for="(dir, index) in editDirectoryList"
  545. :label="dir.name"
  546. :value="dir.id"
  547. :key="index"
  548. ></el-option>
  549. </el-select>
  550. </el-form-item>
  551. </el-col>
  552. <el-col :span="12">
  553. <el-form-item label="文 档:" prop="documents">
  554. <el-select
  555. v-model="editForm.documents"
  556. multiple
  557. placeholder="请选择文档"
  558. style="width: 55%"
  559. :disabled="editForm.document_directories == ''"
  560. clearable
  561. filterable
  562. @change="handleEditDocumentChange"
  563. >
  564. <el-option label="全部" value="all"></el-option>
  565. <el-option
  566. v-for="(doc, index) in editDocumentList"
  567. :label="doc.name"
  568. :value="doc.id"
  569. :key="index"
  570. ></el-option>
  571. </el-select>
  572. </el-form-item>
  573. </el-col>
  574. </el-row>
  575. <el-row :gutter="24">
  576. <el-col :span="12">
  577. <el-form-item label="应用图标:">
  578. <!-- aiagent_icon -->
  579. <el-upload
  580. class="avatar-uploader"
  581. :action="uploadUrl"
  582. method="post"
  583. :data="params"
  584. :show-file-list="false"
  585. :on-success="onUploadEditSuccess"
  586. >
  587. <img
  588. v-if="
  589. editForm.aiagent_icon != null && editForm.aiagent_icon != ''
  590. "
  591. :src="editForm.aiagent_icon"
  592. class="avatar"
  593. />
  594. <i v-else class="el-icon-plus avatar-uploader-icon"></i>
  595. <!-- <svg-icon
  596. icon-class="header"
  597. style="height: 70px; width: 70px"
  598. v-else
  599. /> -->
  600. </el-upload>
  601. </el-form-item></el-col
  602. >
  603. <el-col :span="12">
  604. <el-form-item label="描 述:">
  605. <el-input
  606. style="width: 55%"
  607. v-model="editForm.role_description"
  608. placeholder="请输入描述"
  609. type="textarea"
  610. ></el-input>
  611. </el-form-item>
  612. </el-col>
  613. </el-row>
  614. <el-row :gutter="24">
  615. <el-col :span="12">
  616. <el-form-item label="温度:" prop="temperature">
  617. <div style="display: flex; justify-content: space-around">
  618. <el-slider
  619. style="width: 60%"
  620. v-model="editForm.temperature"
  621. :min="0"
  622. :max="1"
  623. :step="0.1"
  624. ></el-slider>
  625. <el-input-number
  626. v-model="editForm.temperature"
  627. :min="0"
  628. :max="1"
  629. ></el-input-number>
  630. </div>
  631. <div class="hint">控制生成文本的随机性,0为最保守,1为最创新</div>
  632. </el-form-item>
  633. </el-col>
  634. <el-col :span="12">
  635. <el-form-item label="最大token数:" prop="max_tokens">
  636. <div style="display: flex; justify-content: space-around">
  637. <el-slider
  638. style="width: 60%"
  639. v-model="editForm.max_tokens"
  640. :min="1"
  641. :max="4096"
  642. :step="1"
  643. ></el-slider>
  644. <el-input-number
  645. v-model="editForm.max_tokens"
  646. :min="0"
  647. :max="4096"
  648. :step="1"
  649. ></el-input-number>
  650. </div>
  651. <div class="hint">限制生成文本的最大长度</div>
  652. </el-form-item>
  653. </el-col>
  654. </el-row>
  655. <el-row :gutter="24">
  656. <el-col :span="12">
  657. <el-form-item label="核采样参数:" prop="top_p">
  658. <div style="display: flex; justify-content: space-around">
  659. <el-slider
  660. style="width: 60%"
  661. v-model="editForm.top_p"
  662. :min="0"
  663. :max="1"
  664. :step="0.1"
  665. ></el-slider>
  666. <el-input-number
  667. v-model="editForm.top_p"
  668. :min="0"
  669. :max="1"
  670. :step="0.1"
  671. ></el-input-number>
  672. </div>
  673. <div class="hint">控制词汇多样性,1为考虑所有可能性</div>
  674. </el-form-item>
  675. </el-col>
  676. <el-col :span="12">
  677. <el-form-item label="重复内容惩罚:" prop="frequency_penalty">
  678. <div style="display: flex; justify-content: space-around">
  679. <el-slider
  680. style="width: 60%"
  681. v-model="editForm.frequency_penalty"
  682. :min="-2"
  683. :max="2"
  684. :step="0.1"
  685. ></el-slider>
  686. <el-input-number
  687. v-model="editForm.frequency_penalty"
  688. :min="-2"
  689. :max="2"
  690. :step="0.1"
  691. ></el-input-number>
  692. </div>
  693. <div class="hint">防止重复,正值减少重复,负值增加重复</div>
  694. </el-form-item>
  695. </el-col>
  696. </el-row>
  697. <el-row :gutter="24">
  698. <el-col :span="12">
  699. <el-form-item label="新话题偏好:" prop="presence_penalty">
  700. <div style="display: flex; justify-content: space-around">
  701. <el-slider
  702. style="width: 60%"
  703. v-model="editForm.presence_penalty"
  704. :min="-2"
  705. :max="2"
  706. :step="0.1"
  707. ></el-slider>
  708. <el-input-number
  709. v-model="editForm.presence_penalty"
  710. :min="-2"
  711. :max="2"
  712. :step="0.1"
  713. ></el-input-number>
  714. </div>
  715. <div class="hint">正值鼓励新话题,负值保持话题一致性</div>
  716. </el-form-item>
  717. </el-col>
  718. <el-col :span="12">
  719. <el-form-item label="响应格式:" prop="response_format">
  720. <el-input
  721. style="width: 55%"
  722. v-model="editForm.response_format"
  723. placeholder="text"
  724. ></el-input>
  725. <div class="hint">指定AI响应的格式,如text, json等</div>
  726. </el-form-item>
  727. </el-col>
  728. </el-row>
  729. <el-row :gutter="24">
  730. <el-col :span="12">
  731. <el-form-item label="上下文窗口:" prop="context_window">
  732. <div style="display: flex; justify-content: space-around">
  733. <el-slider
  734. style="width: 60%"
  735. v-model="editForm.context_window"
  736. :min="1"
  737. :max="4096"
  738. ></el-slider>
  739. <el-input-number
  740. v-model="editForm.presence_penalty"
  741. :min="1"
  742. :max="4096"
  743. :step="1"
  744. ></el-input-number>
  745. </div>
  746. <div class="hint">AI考虑的上下文token数量</div>
  747. </el-form-item>
  748. </el-col>
  749. <!-- <el-col :span="12">
  750. <el-form-item label="会话ID:" prop="session_id">
  751. <el-input
  752. style="width: 55%"
  753. v-model="editForm.session_id"
  754. placeholder="可选"
  755. ></el-input>
  756. <div class="hint">特定会话的唯一标识符,如果有的话</div>
  757. </el-form-item>
  758. </el-col> -->
  759. </el-row>
  760. <el-row :gutter="24">
  761. <el-col :span="12">
  762. <el-form-item label="语言:" prop="language">
  763. <el-select v-model="editForm.language" style="width: 55%">
  764. <el-option label="中文" value="zh"></el-option>
  765. <el-option label="English" value="en"></el-option>
  766. <el-option label="日本語" value="ja"></el-option>
  767. <el-option label="한국어" value="ko"></el-option>
  768. <el-option label="Français" value="fr"></el-option>
  769. <el-option label="Deutsch" value="de"></el-option>
  770. </el-select>
  771. <div class="hint">选择AI响应的主要语言</div>
  772. </el-form-item>
  773. </el-col>
  774. <el-col :span="12">
  775. <el-form-item label="请求超时:" prop="timeout">
  776. <el-input-number
  777. v-model="editForm.timeout"
  778. :min="1"
  779. :max="60"
  780. ></el-input-number>
  781. <div class="hint">设置请求的最大等待时间(秒)</div>
  782. </el-form-item>
  783. </el-col>
  784. </el-row>
  785. <el-row :gutter="24">
  786. <el-col :span="12">
  787. <el-form-item label="角色名称:" prop="role_name">
  788. <el-input
  789. style="width: 55%"
  790. v-model="editForm.role_name"
  791. placeholder="例如: 客服专员"
  792. ></el-input>
  793. <div class="hint">为AI助手设定一个角色名称</div>
  794. </el-form-item>
  795. </el-col>
  796. <el-col :span="12">
  797. <el-form-item label="角色权限:" prop="role_permissions">
  798. <el-input
  799. style="width: 55%"
  800. v-model="editForm.role_permissions"
  801. placeholder='["回答产品问题", "处理退换货请求", "升级复杂问题"]'
  802. ></el-input>
  803. <div class="hint">输入JSON数组,列出AI助手的具体权限</div>
  804. </el-form-item>
  805. </el-col>
  806. <!-- <el-col :span="12">
  807. <el-form-item label="角色描述:" prop="role_description">
  808. <el-input
  809. style="width: 55%"
  810. v-model="editForm.role_description"
  811. type="textarea"
  812. :rows="3"
  813. placeholder="例如: 你是一位专业的客服专员,负责解答客户关于我们产品和服务的问题。"
  814. ></el-input>
  815. <div class="hint">详细描述AI助手的角色和职责</div>
  816. </el-form-item>
  817. </el-col> -->
  818. </el-row>
  819. <el-row :gutter="24">
  820. <el-col :span="12">
  821. <el-form-item label="自定义变量:" prop="custom_variables">
  822. <el-input
  823. style="width: 55%"
  824. v-model="editForm.custom_variables"
  825. placeholder='{"custom_greeting": "很高兴为您服务!", "company_name": "ABC公司"}'
  826. ></el-input>
  827. <div class="hint">
  828. 输入JSON对象,定义可在提示模板中使用的自定义变量
  829. </div>
  830. </el-form-item>
  831. </el-col>
  832. </el-row>
  833. <el-row :gutter="24">
  834. <el-col :span="24">
  835. <el-form-item label="自定义提示模板:" prop="custom_prompt">
  836. <el-input
  837. style="width: 100%"
  838. v-model="editForm.custom_prompt"
  839. type="textarea"
  840. :rows="12"
  841. placeholder="使用以下上下文来回答问题。如果你不知道答案,就说你不知道,不要试图编造答案。
  842. 上下文: {context}
  843. 人类: {question}
  844. AI助手: 让我根据提供的上下文来回答你的问题。{custom_greeting}"
  845. ></el-input>
  846. <div class="hint">
  847. 自定义AI助手的回答模板,可使用变量如{context}, {question}等
  848. </div>
  849. </el-form-item>
  850. </el-col>
  851. </el-row>
  852. <el-row :gutter="24">
  853. <el-col :span="12">
  854. <el-form-item label="是否启用API_key:" prop="generate_new_api_key">
  855. <el-switch
  856. v-model="editForm.generate_new_api_key"
  857. active-color="#13ce66"
  858. inactive-color="#ff4949"
  859. >
  860. </el-switch>
  861. </el-form-item>
  862. </el-col>
  863. <el-col :span="12">
  864. <el-form-item label="是否设为默认:" prop="is_default">
  865. <el-switch
  866. v-model="editForm.is_default"
  867. active-color="#13ce66"
  868. inactive-color="#ff4949"
  869. >
  870. </el-switch>
  871. </el-form-item>
  872. </el-col>
  873. </el-row>
  874. </el-form>
  875. </div>
  876. <div class="center" v-else>
  877. <el-form
  878. :model="viewForm"
  879. :rules="rules"
  880. ref="viewFormRef"
  881. label-width="120px"
  882. style="margin: 20px 50px"
  883. label-position="top"
  884. >
  885. <el-row :gutter="24">
  886. <el-col :span="12">
  887. <el-form-item label="应用名称:" prop="chat_name">
  888. <el-input
  889. disabled
  890. style="width: 55%"
  891. v-model="viewForm.chat_name"
  892. placeholder="请输入应用名称"
  893. ></el-input>
  894. </el-form-item>
  895. <!-- <el-form-item label="模型库:" prop="modelLibrary">
  896. <el-select
  897. v-model="viewForm.modelLibrary"
  898. placeholder="ollama"
  899. style="width: 100%"
  900. >
  901. <el-option label="ollama" value="ollama"></el-option>
  902. </el-select>
  903. </el-form-item> -->
  904. </el-col>
  905. <el-col :span="12">
  906. <el-form-item label="应用类型:" prop="application_type">
  907. <el-select
  908. disabled
  909. v-model="viewForm.application_type"
  910. placeholder="应用类型"
  911. style="width: 55%"
  912. clearable
  913. >
  914. <el-option
  915. v-for="(item, index) in appTypeList"
  916. :label="item.label"
  917. :value="item.value"
  918. :key="index"
  919. ></el-option>
  920. </el-select>
  921. </el-form-item>
  922. </el-col>
  923. </el-row>
  924. <el-row :gutter="24">
  925. <el-col :span="12">
  926. <el-form-item label="模型名称:" prop="model_name">
  927. <el-select
  928. disabled
  929. v-model="viewForm.model_name"
  930. placeholder="请输入选择"
  931. style="width: 55%"
  932. clearable
  933. >
  934. <el-option
  935. v-for="(item, index) in modelNameList"
  936. :label="item.name"
  937. :value="item.name"
  938. :key="index"
  939. ></el-option>
  940. </el-select>
  941. </el-form-item>
  942. <!-- <el-form-item label="模型类型:" prop="model_type">
  943. <el-select
  944. v-model="viewForm.model_type"
  945. placeholder="请输入选择"
  946. style="width: 100%"
  947. >
  948. <el-option label="chat" value="chat"></el-option>
  949. </el-select>
  950. </el-form-item> -->
  951. </el-col>
  952. <el-col :span="12">
  953. <el-form-item label="知识库:" prop="knowledge_base_names">
  954. <el-select
  955. disabled
  956. v-model="viewForm.knowledge_base_names"
  957. multiple
  958. placeholder="请选择知识库"
  959. style="width: 55%"
  960. @change="handleEditKnowledgeBaseChange"
  961. clearable
  962. filterable
  963. >
  964. <el-option
  965. v-for="(item, index) in kneList"
  966. :label="item.name"
  967. :value="item.id"
  968. :key="index"
  969. ></el-option>
  970. </el-select>
  971. </el-form-item>
  972. </el-col>
  973. </el-row>
  974. <el-row :gutter="24">
  975. <el-col :span="12">
  976. <el-form-item label="文档目录:" prop="document_directories">
  977. <el-select
  978. v-model="viewForm.document_directories"
  979. placeholder="请选择文档目录"
  980. style="width: 55%"
  981. disabled
  982. @change="handleEditDirectoryChange"
  983. clearable
  984. filterable
  985. >
  986. <el-option
  987. v-for="(dir, index) in editDirectoryList"
  988. :label="dir.name"
  989. :value="dir.id"
  990. :key="index"
  991. ></el-option>
  992. </el-select>
  993. </el-form-item>
  994. </el-col>
  995. <el-col :span="12">
  996. <el-form-item label="文 档:" prop="documents">
  997. <el-select
  998. v-model="viewForm.documents"
  999. multiple
  1000. placeholder="请选择文档"
  1001. style="width: 55%"
  1002. disabled
  1003. clearable
  1004. filterable
  1005. >
  1006. <el-option
  1007. v-for="(doc, index) in editDocumentList"
  1008. :label="doc.name"
  1009. :value="doc.id"
  1010. :key="index"
  1011. ></el-option>
  1012. </el-select>
  1013. </el-form-item>
  1014. </el-col>
  1015. </el-row>
  1016. <el-row :gutter="24">
  1017. <el-col :span="12">
  1018. <el-form-item label="应用图标:">
  1019. <!-- aiagent_icon -->
  1020. <el-upload
  1021. disabled
  1022. class="avatar-uploader"
  1023. :action="uploadUrl"
  1024. method="post"
  1025. :data="params"
  1026. :show-file-list="false"
  1027. :on-success="onUploadEditSuccess"
  1028. >
  1029. <img
  1030. v-if="
  1031. viewForm.aiagent_icon != null && viewForm.aiagent_icon != ''
  1032. "
  1033. :src="viewForm.aiagent_icon"
  1034. class="avatar"
  1035. />
  1036. <i v-else class="el-icon-plus avatar-uploader-icon"></i>
  1037. <!-- <svg-icon
  1038. icon-class="header"
  1039. style="height: 70px; width: 70px"
  1040. v-else
  1041. /> -->
  1042. </el-upload>
  1043. </el-form-item></el-col
  1044. >
  1045. <el-col :span="12">
  1046. <el-form-item label="描 述:">
  1047. <el-input
  1048. disabled
  1049. style="width: 55%"
  1050. v-model="viewForm.role_description"
  1051. placeholder="请输入描述"
  1052. type="textarea"
  1053. ></el-input>
  1054. </el-form-item>
  1055. </el-col>
  1056. </el-row>
  1057. <el-row :gutter="24">
  1058. <el-col :span="12">
  1059. <el-form-item label="温度:" prop="temperature">
  1060. <div style="display: flex; justify-content: space-around">
  1061. <el-slider
  1062. disabled
  1063. style="width: 60%"
  1064. v-model="viewForm.temperature"
  1065. :min="0"
  1066. :max="1"
  1067. :step="0.1"
  1068. ></el-slider>
  1069. <el-input-number
  1070. disabled
  1071. v-model="viewForm.temperature"
  1072. :min="0"
  1073. :max="1"
  1074. ></el-input-number>
  1075. </div>
  1076. <div class="hint">控制生成文本的随机性,0为最保守,1为最创新</div>
  1077. </el-form-item>
  1078. </el-col>
  1079. <el-col :span="12">
  1080. <el-form-item label="最大token数:" prop="max_tokens">
  1081. <div style="display: flex; justify-content: space-around">
  1082. <el-slider
  1083. disabled
  1084. style="width: 60%"
  1085. v-model="viewForm.max_tokens"
  1086. :min="1"
  1087. :max="4096"
  1088. :step="1"
  1089. ></el-slider>
  1090. <el-input-number
  1091. disabled
  1092. v-model="viewForm.max_tokens"
  1093. :min="0"
  1094. :max="4096"
  1095. :step="1"
  1096. ></el-input-number>
  1097. </div>
  1098. <div class="hint">限制生成文本的最大长度</div>
  1099. </el-form-item>
  1100. </el-col>
  1101. </el-row>
  1102. <el-row :gutter="24">
  1103. <el-col :span="12">
  1104. <el-form-item label="核采样参数:" prop="top_p">
  1105. <div style="display: flex; justify-content: space-around">
  1106. <el-slider
  1107. disabled
  1108. style="width: 60%"
  1109. v-model="viewForm.top_p"
  1110. :min="0"
  1111. :max="1"
  1112. :step="0.1"
  1113. ></el-slider>
  1114. <el-input-number
  1115. disabled
  1116. v-model="viewForm.top_p"
  1117. :min="0"
  1118. :max="1"
  1119. :step="0.1"
  1120. ></el-input-number>
  1121. </div>
  1122. <div class="hint">控制词汇多样性,1为考虑所有可能性</div>
  1123. </el-form-item>
  1124. </el-col>
  1125. <el-col :span="12">
  1126. <el-form-item label="重复内容惩罚:" prop="frequency_penalty">
  1127. <div style="display: flex; justify-content: space-around">
  1128. <el-slider
  1129. disabled
  1130. style="width: 60%"
  1131. v-model="viewForm.frequency_penalty"
  1132. :min="-2"
  1133. :max="2"
  1134. :step="0.1"
  1135. ></el-slider>
  1136. <el-input-number
  1137. disabled
  1138. v-model="viewForm.frequency_penalty"
  1139. :min="-2"
  1140. :max="2"
  1141. :step="0.1"
  1142. ></el-input-number>
  1143. </div>
  1144. <div class="hint">防止重复,正值减少重复,负值增加重复</div>
  1145. </el-form-item>
  1146. </el-col>
  1147. </el-row>
  1148. <el-row :gutter="24">
  1149. <el-col :span="12">
  1150. <el-form-item label="新话题偏好:" prop="presence_penalty">
  1151. <div style="display: flex; justify-content: space-around">
  1152. <el-slider
  1153. disabled
  1154. style="width: 60%"
  1155. v-model="viewForm.presence_penalty"
  1156. :min="-2"
  1157. :max="2"
  1158. :step="0.1"
  1159. ></el-slider>
  1160. <el-input-number
  1161. disabled
  1162. v-model="viewForm.presence_penalty"
  1163. :min="-2"
  1164. :max="2"
  1165. :step="0.1"
  1166. ></el-input-number>
  1167. </div>
  1168. <div class="hint">正值鼓励新话题,负值保持话题一致性</div>
  1169. </el-form-item>
  1170. </el-col>
  1171. <el-col :span="12">
  1172. <el-form-item label="响应格式:" prop="response_format">
  1173. <el-input
  1174. disabled
  1175. style="width: 55%"
  1176. v-model="viewForm.response_format"
  1177. placeholder="text"
  1178. ></el-input>
  1179. <div class="hint">指定AI响应的格式,如text, json等</div>
  1180. </el-form-item>
  1181. </el-col>
  1182. </el-row>
  1183. <el-row :gutter="24">
  1184. <el-col :span="12">
  1185. <el-form-item label="上下文窗口:" prop="context_window">
  1186. <div style="display: flex; justify-content: space-around">
  1187. <el-slider
  1188. disabled
  1189. style="width: 60%"
  1190. v-model="viewForm.context_window"
  1191. :min="1"
  1192. :max="4096"
  1193. ></el-slider>
  1194. <el-input-number
  1195. disabled
  1196. v-model="viewForm.presence_penalty"
  1197. :min="1"
  1198. :max="4096"
  1199. :step="1"
  1200. ></el-input-number>
  1201. </div>
  1202. <div class="hint">AI考虑的上下文token数量</div>
  1203. </el-form-item>
  1204. </el-col>
  1205. <!-- <el-col :span="12">
  1206. <el-form-item label="会话ID:" prop="session_id">
  1207. <el-input
  1208. disabled
  1209. style="width: 55%"
  1210. v-model="viewForm.session_id"
  1211. placeholder="可选"
  1212. ></el-input>
  1213. <div class="hint">特定会话的唯一标识符,如果有的话</div>
  1214. </el-form-item>
  1215. </el-col> -->
  1216. </el-row>
  1217. <el-row :gutter="24">
  1218. <el-col :span="12">
  1219. <el-form-item label="语言:" prop="language">
  1220. <el-select
  1221. disabled
  1222. v-model="viewForm.language"
  1223. style="width: 55%"
  1224. >
  1225. <el-option label="中文" value="zh"></el-option>
  1226. <el-option label="English" value="en"></el-option>
  1227. <el-option label="日本語" value="ja"></el-option>
  1228. <el-option label="한국어" value="ko"></el-option>
  1229. <el-option label="Français" value="fr"></el-option>
  1230. <el-option label="Deutsch" value="de"></el-option>
  1231. </el-select>
  1232. <div class="hint">选择AI响应的主要语言</div>
  1233. </el-form-item>
  1234. </el-col>
  1235. <el-col :span="12">
  1236. <el-form-item label="请求超时:" prop="timeout">
  1237. <el-input-number
  1238. disabled
  1239. v-model="viewForm.timeout"
  1240. :min="1"
  1241. :max="60"
  1242. ></el-input-number>
  1243. <div class="hint">设置请求的最大等待时间(秒)</div>
  1244. </el-form-item>
  1245. </el-col>
  1246. </el-row>
  1247. <el-row :gutter="24">
  1248. <el-col :span="12">
  1249. <el-form-item label="角色名称:" prop="role_name">
  1250. <el-input
  1251. disabled
  1252. style="width: 55%"
  1253. v-model="viewForm.role_name"
  1254. placeholder="例如: 客服专员"
  1255. ></el-input>
  1256. <div class="hint">为AI助手设定一个角色名称</div>
  1257. </el-form-item>
  1258. </el-col>
  1259. <el-col :span="12">
  1260. <el-form-item label="角色权限:" prop="role_permissions">
  1261. <el-input
  1262. disabled
  1263. style="width: 55%"
  1264. v-model="viewForm.role_permissions"
  1265. placeholder='["回答产品问题", "处理退换货请求", "升级复杂问题"]'
  1266. ></el-input>
  1267. <div class="hint">输入JSON数组,列出AI助手的具体权限</div>
  1268. </el-form-item>
  1269. </el-col>
  1270. <!-- <el-col :span="12">
  1271. <el-form-item label="角色描述:" prop="role_description">
  1272. <el-input
  1273. style="width: 55%"
  1274. v-model="viewForm.role_description"
  1275. type="textarea"
  1276. :rows="3"
  1277. placeholder="例如: 你是一位专业的客服专员,负责解答客户关于我们产品和服务的问题。"
  1278. ></el-input>
  1279. <div class="hint">详细描述AI助手的角色和职责</div>
  1280. </el-form-item>
  1281. </el-col> -->
  1282. </el-row>
  1283. <el-row :gutter="24">
  1284. <el-col :span="12">
  1285. <el-form-item label="自定义变量:" prop="custom_variables">
  1286. <el-input
  1287. disabled
  1288. style="width: 55%"
  1289. v-model="viewForm.custom_variables"
  1290. placeholder='{"custom_greeting": "很高兴为您服务!", "company_name": "ABC公司"}'
  1291. ></el-input>
  1292. <div class="hint">
  1293. 输入JSON对象,定义可在提示模板中使用的自定义变量
  1294. </div>
  1295. </el-form-item>
  1296. </el-col>
  1297. </el-row>
  1298. <el-row :gutter="24">
  1299. <el-col :span="24">
  1300. <el-form-item label="自定义提示模板:" prop="custom_prompt">
  1301. <el-input
  1302. disabled
  1303. style="width: 100%"
  1304. v-model="viewForm.custom_prompt"
  1305. type="textarea"
  1306. :rows="12"
  1307. placeholder="使用以下上下文来回答问题。如果你不知道答案,就说你不知道,不要试图编造答案。
  1308. 上下文: {context}
  1309. 人类: {question}
  1310. AI助手: 让我根据提供的上下文来回答你的问题。{custom_greeting}"
  1311. ></el-input>
  1312. <div class="hint">
  1313. 自定义AI助手的回答模板,可使用变量如{context}, {question}等
  1314. </div>
  1315. </el-form-item>
  1316. </el-col>
  1317. </el-row>
  1318. <el-row :gutter="24">
  1319. <el-col :span="12">
  1320. <el-form-item label="是否启用API_key:" prop="generate_new_api_key">
  1321. <el-switch
  1322. disabled
  1323. v-model="viewForm.generate_new_api_key"
  1324. active-color="#13ce66"
  1325. inactive-color="#ff4949"
  1326. >
  1327. </el-switch>
  1328. </el-form-item>
  1329. </el-col>
  1330. <el-col :span="12">
  1331. <el-form-item label="是否设为默认:" prop="is_default">
  1332. <el-switch
  1333. disabled
  1334. v-model="viewForm.is_default"
  1335. active-color="#13ce66"
  1336. inactive-color="#ff4949"
  1337. >
  1338. </el-switch>
  1339. </el-form-item>
  1340. </el-col>
  1341. </el-row>
  1342. </el-form>
  1343. </div>
  1344. <div class="footer">
  1345. <el-button @click="cancelApplication">取 消</el-button>
  1346. <el-button
  1347. type="primary"
  1348. v-if="type == 'add'"
  1349. @click="generateApplication"
  1350. >生成应用</el-button
  1351. >
  1352. <el-button type="primary" v-else-if="type == 'edit'" @click="submitEdit"
  1353. >确认修改</el-button
  1354. >
  1355. </div>
  1356. </div>
  1357. </template>
  1358. <script>
  1359. import axios from "axios";
  1360. import {
  1361. modelList,
  1362. listBuckets,
  1363. selectTypeList,
  1364. getBucketContents,
  1365. configSave,
  1366. configList,
  1367. configDelete,
  1368. application_types,
  1369. set_default,
  1370. configurationInfo,
  1371. } from "@/api/knowledge";
  1372. export default {
  1373. /*组件参数 接收来自父组件的数据*/
  1374. props: {},
  1375. /*局部注册的组件*/
  1376. components: {},
  1377. /*组件状态值*/
  1378. data() {
  1379. return {
  1380. AIform: {
  1381. chat_name: "",
  1382. modelLibrary: "ollama",
  1383. model_type: "chat",
  1384. model_name: "",
  1385. knowledge_base_names: [],
  1386. document_directories: [],
  1387. documents: [],
  1388. temperature: 0.7,
  1389. max_tokens: 150,
  1390. top_p: 1.0,
  1391. frequency_penalty: 0.0,
  1392. presence_penalty: 0.0,
  1393. response_format: "text",
  1394. context_window: 2048,
  1395. user_id: "user123",
  1396. session_id: "session456",
  1397. language: "en",
  1398. timeout: 30,
  1399. role_name: "Admin",
  1400. role_description: "",
  1401. role_permissions: '["回答产品问题", "处理退换货请求", "升级复杂问题"]',
  1402. custom_variables:
  1403. '{"custom_greeting": "很高兴为您服务!", "company_name": "ABC公司"}',
  1404. custom_prompt:
  1405. "使用以下上下文来回答问题。如果你不知道答案,就说你不知道,不要试图编造答案。上下文: {context} 人类: {question}AI助手: 让我根据提供的上下文来回答你的问题。{custom_greeting}",
  1406. application_type: "",
  1407. is_default: false,
  1408. generate_new_api_key: true,
  1409. aiagent_icon: "",
  1410. },
  1411. /* 模型库 */
  1412. modelList: [],
  1413. /* 模型类型 */
  1414. modelTypeList: [],
  1415. /* 模型名称 */
  1416. modelNameList: [],
  1417. /* 知识库 */
  1418. kneList: [],
  1419. /* 文档目录 */
  1420. directoryList: [],
  1421. /* 文档 */
  1422. documentList: [],
  1423. bucket_id: "",
  1424. rules: {
  1425. chat_name: [
  1426. { required: true, message: "请填写应名称", trigger: "blur" },
  1427. ],
  1428. model_name: [
  1429. { required: true, message: "请选择模型名称", trigger: "change" },
  1430. ],
  1431. knowledge_base_names: [
  1432. {
  1433. required: true,
  1434. message: "请选择至少一个知识库",
  1435. trigger: "change",
  1436. },
  1437. ],
  1438. /* document_directories: [
  1439. { required: true, message: '请选择文档目录', trigger: 'change' }
  1440. ], */
  1441. documents: [
  1442. { required: true, message: "请选择至少一个文档", trigger: "change" },
  1443. ],
  1444. role_permissions: [
  1445. { required: true, message: "请输入角色权限", trigger: "blur" },
  1446. {
  1447. validator: (rule, value, callback) => {
  1448. try {
  1449. JSON.parse(value);
  1450. callback();
  1451. } catch (error) {
  1452. callback(new Error("请输入有效的 JSON 数组"));
  1453. }
  1454. },
  1455. trigger: "blur"
  1456. }
  1457. ],
  1458. custom_variables: [
  1459. { required: true, message: "请输入自定义变量", trigger: "blur" },
  1460. {
  1461. validator: (rule, value, callback) => {
  1462. try {
  1463. JSON.parse(value);
  1464. callback();
  1465. } catch (error) {
  1466. callback(new Error("请输入有效的 JSON 对象"));
  1467. }
  1468. },
  1469. trigger: "blur"
  1470. }
  1471. ],
  1472. },
  1473. /* 配置类型列表 */
  1474. appTypeList: [],
  1475. id: "",
  1476. editForm: {
  1477. // 复制 AIform 的结构,但初始值为空
  1478. chat_name: "",
  1479. modelLibrary: "ollama",
  1480. model_type: "chat",
  1481. model_name: "",
  1482. knowledge_base_names: [],
  1483. document_directories: [],
  1484. documents: [],
  1485. temperature: 0.7,
  1486. max_tokens: 150,
  1487. top_p: 1.0,
  1488. frequency_penalty: 0.0,
  1489. presence_penalty: 0.0,
  1490. response_format: "text",
  1491. context_window: 2048,
  1492. user_id: "user123",
  1493. session_id: "session456",
  1494. language: "en",
  1495. timeout: 30,
  1496. role_name: "Admin",
  1497. role_description: "",
  1498. role_permissions: '["回答产品问题", "处理退换货请求", "升级复杂问题"]',
  1499. custom_variables:
  1500. '{"custom_greeting": "很高兴为您服务!", "company_name": "ABC公司"}',
  1501. custom_prompt:
  1502. "使用以下上下文来回答问题。如果你不知道答案,就说你不知道,不要试图编造答案。上下文: {context} 人类: {question}AI助手: 让我根据提供的上下文来回答你的问题。{custom_greeting}",
  1503. application_type: "",
  1504. is_default: false,
  1505. generate_new_api_key: true,
  1506. },
  1507. editDirectoryList: [],
  1508. editDocumentList: [],
  1509. type: "",
  1510. viewForm: {
  1511. // 复制 AIform 的结构,但初始值为空
  1512. chat_name: "",
  1513. modelLibrary: "ollama",
  1514. model_type: "chat",
  1515. model_name: "",
  1516. knowledge_base_names: [],
  1517. document_directories: [],
  1518. documents: [],
  1519. temperature: 0.7,
  1520. max_tokens: 150,
  1521. top_p: 1.0,
  1522. frequency_penalty: 0.0,
  1523. presence_penalty: 0.0,
  1524. response_format: "text",
  1525. context_window: 2048,
  1526. user_id: "user123",
  1527. session_id: "session456",
  1528. language: "en",
  1529. timeout: 30,
  1530. role_name: "Admin",
  1531. role_description: "",
  1532. role_permissions: "",
  1533. custom_variables: "",
  1534. custom_prompt:
  1535. "使用以下上下文来回答问题。如果你不知道答案,就说你不知道,不要试图编造答案。上下文: {context} 人类: {question}AI助手: 让我根据提供的上下文来回答你的问题。{custom_greeting}",
  1536. application_type: "",
  1537. is_default: false,
  1538. generate_new_api_key: true,
  1539. aiagent_icon: "",
  1540. },
  1541. params: {
  1542. token: "",
  1543. },
  1544. uploadUrl: "",
  1545. };
  1546. },
  1547. /*计算属性*/
  1548. computed: {
  1549. getKnowledgeBaseNames() {
  1550. const names = this.AIform.knowledge_base_names.map(
  1551. (id) => this.kneList.find((item) => item.id === id)?.name || id
  1552. );
  1553. if (names.length <= 2) {
  1554. return names.join(", ");
  1555. } else {
  1556. return `${names[0]}, ${names[1]} 等${names.length}个`;
  1557. }
  1558. },
  1559. getDocumentNames() {
  1560. const names = this.AIform.documents.map(
  1561. (id) => this.documentList.find((item) => item.id === id)?.name || id
  1562. );
  1563. if (names.length <= 2) {
  1564. return names.join(", ");
  1565. } else {
  1566. return `${names[0]}, ${names[1]} 等${names.length}个`;
  1567. }
  1568. },
  1569. isDocumentSelectDisabled() {
  1570. return (
  1571. !this.AIform.knowledge_base_names.length ||
  1572. this.AIform.document_directories == ""
  1573. );
  1574. },
  1575. },
  1576. /*侦听器*/
  1577. watch: {},
  1578. /*
  1579. * el 被新创建的 vm.$ el 替换,并挂载到实例上去之后调用该钩子。
  1580. * 如果 root 实例挂载了一个文档内元素,当 mounted 被调用时 vm.$ el 也在文档内。
  1581. */
  1582. created() {
  1583. let _this = this;
  1584. _this.uploadUrl = process.env.VUE_APP_BASE_API + "/upload/file";
  1585. _this.params.token = _this.$store.getters.token;
  1586. },
  1587. mounted() {
  1588. /* 初始化列表 */
  1589. this.init();
  1590. this.type = this.$route.query.type;
  1591. this.id = this.$route.query.id;
  1592. /* if (this.type == "edit") {
  1593. this.initEdit();
  1594. } else */ if (this.type == "view") {
  1595. this.initView();
  1596. }
  1597. },
  1598. /*组件方法*/
  1599. methods: {
  1600. /* 编辑 */
  1601. /* 上传图标 */
  1602. onUploadEditSuccess(e) {
  1603. this.editForm.aiagent_icon = e.data.fileUrl;
  1604. },
  1605. handleEditDocumentChange(selectedValues) {
  1606. if (selectedValues.includes("all")) {
  1607. // 如果选择了"全部",则清空其他选项
  1608. this.editForm.documents = ["all"];
  1609. } else {
  1610. // 如果没有选择"全部",则限制最多选择10个文档
  1611. if (selectedValues.length > 10) {
  1612. this.editForm.documents = selectedValues.slice(0, 10);
  1613. this.$message.warning("最多只能选择10个文档");
  1614. }
  1615. }
  1616. },
  1617. /* 编辑确认修改 */
  1618. submitEdit() {
  1619. this.$refs.editFormRef.validate(async (valid) => {
  1620. if (valid) {
  1621. try {
  1622. const convertedForm = { ...this.editForm };
  1623. // 处理 role_permissions
  1624. const parsedPermissions = this.validateAndParseJSON(
  1625. 'role_permissions',
  1626. '角色权限格式无效'
  1627. );
  1628. if (!parsedPermissions) return;
  1629. convertedForm.role_permissions = parsedPermissions;
  1630. // 处理 custom_variables
  1631. const parsedVariables = this.validateAndParseJSON(
  1632. 'custom_variables',
  1633. '自定义变量格式无效'
  1634. );
  1635. if (!parsedVariables) return;
  1636. convertedForm.custom_variables = parsedVariables;
  1637. // 转换知识库、文档目录和文档的ID为名称
  1638. /* convertedForm.knowledge_base_names = this.safeGetNamesByIds(this.editForm.knowledge_base_names, this.kneList); */
  1639. /* convertedForm.documents = this.safeGetNamesByIds(this.editForm.documents, this.editDocumentList); */
  1640. // 处理文档选择
  1641. if (
  1642. convertedForm.documents.includes("all") ||
  1643. convertedForm.documents.length === 0
  1644. ) {
  1645. convertedForm.documents = []; // 全选或未选择时传空数组给后台
  1646. } else {
  1647. convertedForm.documents = this.safeGetNamesByIds(
  1648. convertedForm.documents,
  1649. this.editDocumentList
  1650. );
  1651. }
  1652. convertedForm.document_directories = this.safeGetNamesByIds(
  1653. this.editForm.document_directories,
  1654. this.editDirectoryList
  1655. );
  1656. if (convertedForm.document_directories.length === 0) {
  1657. convertedForm.document_directories = ["全部"];
  1658. }
  1659. console.log("Converted form for edit:", convertedForm);
  1660. const response = await axios.post(
  1661. `${process.env.VUE_APP_BASE_API}/chatbot/configuration/update/`,
  1662. convertedForm,
  1663. {
  1664. headers: {
  1665. "Content-Type": "application/json",
  1666. },
  1667. }
  1668. );
  1669. if (response.status === 200) {
  1670. this.$message.success("应用更新成功");
  1671. this.$router.push({
  1672. path: "/knowledge/chatPage/index",
  1673. }); //跳转到聊天应用页面
  1674. /* this.editDialogVisible = false; */
  1675. /* this.fetchApplicationList(); */
  1676. } else {
  1677. this.$message.error(response.data.message || "应用更新失败");
  1678. }
  1679. } catch (error) {
  1680. console.error("Error updating application:", error);
  1681. this.$message.error("应用更新失败,请稍后重试");
  1682. }
  1683. } else {
  1684. this.$message.error("请填写所有必填字段");
  1685. return false;
  1686. }
  1687. });
  1688. },
  1689. handleEditKnowledgeBaseChange(val) {
  1690. // 重置目录和文档选择
  1691. this.editForm.document_directories = [];
  1692. this.editForm.documents = [];
  1693. this.editDocumentList = [];
  1694. // 加载新选择的知识库对应的目录列表
  1695. this.loadEditDirectoryList(val);
  1696. },
  1697. handleEditDirectoryChange(val) {
  1698. // 重置文档选择
  1699. this.editForm.documents = [];
  1700. // 加载选中目录对应的文档列表
  1701. this.loadEditDocumentList(val);
  1702. },
  1703. /* 知识库选择监听 */
  1704. async loadEditDirectoryList(val) {
  1705. this.editDirectoryList = []; // 清空现有目录列表
  1706. let totalDocuments = 0;
  1707. let otherFolderCount = 0;
  1708. const promises = val.map(async (kbName) => {
  1709. const typeForm = {
  1710. page: 1,
  1711. pageSize: 9999,
  1712. kb_id: kbName,
  1713. };
  1714. try {
  1715. const res = await selectTypeList(typeForm);
  1716. if (res.data) {
  1717. this.editDirectoryList = [
  1718. ...new Set([...this.editDirectoryList, ...res.data.dataList]),
  1719. ];
  1720. res.data.dataList.forEach((folder) => {
  1721. if (folder.id === "other") {
  1722. otherFolderCount += folder.document_count || 0;
  1723. } else {
  1724. totalDocuments += folder.document_count || 0;
  1725. }
  1726. });
  1727. }
  1728. } catch (error) {
  1729. console.error(
  1730. `Error loading directory list for kb_id ${kbName}:`,
  1731. error
  1732. );
  1733. }
  1734. });
  1735. await Promise.all(promises);
  1736. this.editDirectoryList.unshift({
  1737. id: "001",
  1738. name: "全部",
  1739. document_count: totalDocuments + otherFolderCount,
  1740. });
  1741. return this.editDirectoryList;
  1742. },
  1743. /* 监听目录选择 */
  1744. loadEditDocumentList(val) {
  1745. // 找到选中目录的名称
  1746. const selectedDirectoryName = val;
  1747. const id = this.directoryList.find((el) => el.id == val);
  1748. // 从 kneList 中找到对应的知识库
  1749. const selectedKnowledgeBase = this.kneList.find(
  1750. (kb) => kb.id === this.editForm.knowledge_base_names[0]
  1751. );
  1752. /* if (!selectedKnowledgeBase) {
  1753. console.error('No matching knowledge base found');
  1754. return;
  1755. } */
  1756. let queryForm = {
  1757. page: 1,
  1758. pageSize: 9999,
  1759. bucket_id: selectedKnowledgeBase.id,
  1760. doc_type_id:
  1761. selectedDirectoryName === "001"
  1762. ? ""
  1763. : this.getDirectoryIdByName(selectedDirectoryName),
  1764. };
  1765. return getBucketContents(queryForm).then((res) => {
  1766. this.editDocumentList = res.data.documents;
  1767. return this.editDocumentList;
  1768. });
  1769. },
  1770. // 添加一个辅助方法来根据目录名称获取目录ID
  1771. getDirectoryIdByName(directoryName) {
  1772. const directory = this.editDirectoryList.find(
  1773. (dir) => dir.name === directoryName
  1774. );
  1775. return directory ? directory.id : null;
  1776. },
  1777. /* 新增 */
  1778. /* 上传图片 */
  1779. onUploadAddSuccess(e) {
  1780. this.AIform.aiagent_icon = e.data.fileUrl;
  1781. },
  1782. /* 重置表单 */
  1783. resetForm() {
  1784. if (this.$refs.AIformRef) {
  1785. this.$refs.AIformRef.resetFields();
  1786. }
  1787. this.AIform = {
  1788. chat_name: "",
  1789. modelLibrary: "ollama",
  1790. model_type: "chat",
  1791. model_name: "",
  1792. knowledge_base_names: [],
  1793. document_directories: [],
  1794. documents: [],
  1795. temperature: 0.7,
  1796. max_tokens: 150,
  1797. top_p: 1.0,
  1798. frequency_penalty: 0.0,
  1799. presence_penalty: 0.0,
  1800. response_format: "",
  1801. context_window: 2048,
  1802. user_id: "",
  1803. session_id: "",
  1804. language: "en",
  1805. timeout: 30,
  1806. role_name: "Admin",
  1807. role_description: "",
  1808. role_permissions: '["回答产品问题", "处理退换货请求", "升级复杂问题"]',
  1809. custom_variables:
  1810. '{"custom_greeting": "很高兴为您服务!", "company_name": "ABC公司"}',
  1811. custom_prompt:
  1812. "使用以下上下文来回答问题。如果你不知道答案,就说你不知道,不要试图编造答案。上下文: {context} 人类: {question}AI助手: 让我根据提供的上下文来回答你的问题。{custom_greeting}",
  1813. application_type: "",
  1814. is_default: false,
  1815. generate_new_api_key: true,
  1816. aiagent_icon: "",
  1817. };
  1818. },
  1819. /* 取消 */
  1820. cancelApplication() {
  1821. if (this.type == "view") {
  1822. this.resetForm();
  1823. this.$router.push({
  1824. path: "/knowledge/chatPage/index",
  1825. });
  1826. } else {
  1827. this.$confirm("确认取消?未保存的更改将会丢失。")
  1828. .then((_) => {
  1829. this.resetForm();
  1830. this.$router.push({
  1831. path: "/knowledge/chatPage/index",
  1832. });
  1833. })
  1834. .catch((_) => {});
  1835. }
  1836. },
  1837. handleDocumentChange(selectedValues) {
  1838. if (selectedValues.includes("all")) {
  1839. // 如果选择了"全部",则清空其他选项
  1840. this.AIform.documents = ["all"];
  1841. } else {
  1842. // 如果没有选择"全部",则限制最多选择10个文档
  1843. if (selectedValues.length > 10) {
  1844. this.AIform.documents = selectedValues.slice(0, 10);
  1845. this.$message.warning("最多只能选择10个文档");
  1846. }
  1847. }
  1848. },
  1849. validateAndParseJSON(field, errorMessage) {
  1850. try {
  1851. return JSON.parse(this.AIform[field]);
  1852. } catch (error) {
  1853. this.$message.error(`${errorMessage}: ${error.message}`);
  1854. return null;
  1855. }
  1856. },
  1857. /* 新增聊天应用 */
  1858. generateApplication() {
  1859. this.$refs.AIformRef.validate(async (valid) => {
  1860. if (valid) {
  1861. try {
  1862. // 创建一个新对象来存储转换后的数据
  1863. const convertedForm = { ...this.AIform };
  1864. // 处理 role_permissions
  1865. const parsedPermissions = this.validateAndParseJSON(
  1866. "role_permissions",
  1867. "角色权限格式无效"
  1868. );
  1869. if (!parsedPermissions) return;
  1870. convertedForm.role_permissions = parsedPermissions;
  1871. // 处理 custom_variables
  1872. const parsedVariables = this.validateAndParseJSON(
  1873. "custom_variables",
  1874. "自定义变量格式无效"
  1875. );
  1876. if (!parsedVariables) return;
  1877. convertedForm.custom_variables = parsedVariables;
  1878. // 将知识库 ID 转换为名称
  1879. /* convertedForm.knowledge_base_names = this.safeGetNamesByIds(
  1880. this.AIform.knowledge_base_names,
  1881. this.kneList
  1882. ); */
  1883. /* // 将文档 ID 转换为名称
  1884. convertedForm.documents = this.safeGetNamesByIds(
  1885. this.AIform.documents,
  1886. this.documentList
  1887. ); */
  1888. // 处理文档选择
  1889. if (
  1890. convertedForm.documents.includes("all") ||
  1891. convertedForm.documents.length === 0
  1892. ) {
  1893. convertedForm.documents = []; // 全选或未选择时传空数组给后台
  1894. } else {
  1895. convertedForm.documents = this.safeGetNamesByIds(
  1896. convertedForm.documents,
  1897. this.documentList
  1898. );
  1899. }
  1900. // 将文档目录 ID 转换为名称,如果为空则传递 '全部'
  1901. convertedForm.document_directories = this.safeGetNamesByIds(
  1902. this.AIform.document_directories,
  1903. this.directoryList
  1904. );
  1905. if (convertedForm.document_directories.length === 0) {
  1906. convertedForm.document_directories = ["全部"];
  1907. }
  1908. console.log("Converted form:", convertedForm);
  1909. // 使用 axios 发送 POST 请求
  1910. const response = await axios.post(
  1911. `${process.env.VUE_APP_BASE_API}/chatbot/configCreart/`,
  1912. convertedForm,
  1913. {
  1914. headers: {
  1915. "Content-Type": "application/json",
  1916. },
  1917. }
  1918. );
  1919. if (response.status === 200) {
  1920. this.$message.success("应用生成成功");
  1921. this.resetForm();
  1922. /* this.fetchApplicationList(); */
  1923. this.$router.push({
  1924. path: "/knowledge/chatPage/index",
  1925. }); //跳转到聊天应用页面
  1926. // 可选:重定向到新应用或更新 UI
  1927. } else {
  1928. this.$message.error(response.data.message || "应用生成失败");
  1929. }
  1930. } catch (error) {
  1931. console.error("Error generating application:", error);
  1932. this.$message.error("应用生成失败,请稍后重试");
  1933. }
  1934. } else {
  1935. this.$message.error("请填写所有必填字段");
  1936. return false;
  1937. }
  1938. });
  1939. },
  1940. /* 数据处理方法 */
  1941. // 安全的辅助方法:通过 ID 数组获取名称数组
  1942. safeGetNamesByIds(ids, list) {
  1943. if (!Array.isArray(ids)) {
  1944. console.warn("Expected an array of ids, but received:", ids);
  1945. return [];
  1946. }
  1947. return ids
  1948. .map((id) => {
  1949. if (id === "001") {
  1950. return "全部";
  1951. }
  1952. const item = list.find((item) => item.id === id);
  1953. return item ? item.name : "";
  1954. })
  1955. .filter((name) => name !== "");
  1956. },
  1957. /* 知识库选择监听联动 */
  1958. handleKnowledgeBaseChange(val) {
  1959. // 重置目录和文档选择
  1960. this.AIform.document_directories = [];
  1961. this.AIform.documents = [];
  1962. this.documentList = [];
  1963. this.bucket_id = val[0];
  1964. // 根据选中的知识库加载目录列表
  1965. // 这里需要调用后端 API 来获取目录列表
  1966. this.loadDirectoryList(val);
  1967. },
  1968. handleDirectoryChange(val) {
  1969. // 重置文档选择
  1970. this.AIform.documents = [];
  1971. // 根据选中的目录加载文档列表
  1972. // 这里需要调用后端 API 来获取文档列表
  1973. this.loadDocumentList(val);
  1974. },
  1975. async loadDirectoryList(val) {
  1976. this.directoryList = []; // 清空现有目录列表
  1977. let totalDocuments = 0;
  1978. let otherFolderCount = 0;
  1979. for (const kbId of val) {
  1980. const typeForm = {
  1981. page: 1,
  1982. pageSize: 9999,
  1983. kb_id: kbId,
  1984. };
  1985. try {
  1986. const res = await selectTypeList(typeForm);
  1987. // 假设 res.data 包含目录列表
  1988. if (res.data) {
  1989. // 将新的目录添加到列表中,避免重复
  1990. this.directoryList = [
  1991. ...new Set([...this.directoryList, ...res.data.dataList]),
  1992. ];
  1993. console.log(res.data.dataList);
  1994. // 计算总文档数和其他文件夹数量
  1995. res.data.dataList.forEach((folder) => {
  1996. if (folder.id === "other") {
  1997. otherFolderCount += folder.document_count || 0;
  1998. } else {
  1999. totalDocuments += folder.document_count || 0;
  2000. }
  2001. });
  2002. }
  2003. } catch (error) {
  2004. console.error(
  2005. `Error loading directory list for kb_id ${kbId}:`,
  2006. error
  2007. );
  2008. // 可以在这里添加错误处理,比如显示一个错误提示
  2009. }
  2010. }
  2011. // 在列表开头插入"全部"选项
  2012. this.directoryList.unshift({
  2013. id: "001",
  2014. name: "全部",
  2015. /* document_count: totalDocuments + otherFolderCount, */
  2016. });
  2017. },
  2018. /* 目录选择监听 */
  2019. handleDirectoryChange(val) {
  2020. // 重置文档选择
  2021. this.AIform.documents = [];
  2022. // 根据选中的目录加载文档列表
  2023. // 这里需要调用后端 API 来获取文档列表
  2024. this.loadDocumentList(val);
  2025. },
  2026. loadDocumentList(val) {
  2027. const id = this.directoryList.find((el) => el.id == val);
  2028. let queryForm = {
  2029. page: 1,
  2030. pageSize: 9999,
  2031. bucket_id: val == "001" ? this.bucket_id : id.kb_id, //this.bucket_id,
  2032. doc_type_id: val == "001" ? "" : val,
  2033. };
  2034. getBucketContents(queryForm).then((res) => {
  2035. this.documentList = res.data.documents;
  2036. });
  2037. },
  2038. /* 获取列表 */
  2039. init() {
  2040. /* 模型库 */
  2041. modelList({ model_type: "model" }).then((res) => {
  2042. this.modelNameList = res.data;
  2043. });
  2044. /* 知识库 */
  2045. listBuckets({ user_id: this.$store.state.user.id }).then((res) => {
  2046. this.kneList = res.data;
  2047. if (this.$route.query.type == "edit") {
  2048. this.initEdit();
  2049. }
  2050. });
  2051. /* 应用列表 */
  2052. configList().then((res) => {
  2053. this.knowledgeBases = res.data;
  2054. console.log(res);
  2055. });
  2056. /* 获取应用类型 */
  2057. application_types().then((res) => {
  2058. if (res.status !== 200) return;
  2059. this.appTypeList = res.data.application_types;
  2060. });
  2061. },
  2062. /* 编辑查看 */
  2063. async initEdit() {
  2064. // 深拷贝以避免直接修改原对象
  2065. this.editForm = JSON.parse(JSON.stringify(this.$route.query.card));
  2066. // 处理 role_permissions 和 custom_variables
  2067. this.handleJsonFields();
  2068. // 并行加载知识库目录列表
  2069. const directoryListPromise = this.loadEditDirectoryList(
  2070. this.editForm.knowledge_base_names
  2071. );
  2072. // 等待目录列表加载完成
  2073. await directoryListPromise;
  2074. // 处理目录和文档选择
  2075. this.handleDirectoryAndDocumentSelection();
  2076. },
  2077. async handleDirectoryAndDocumentSelection() {
  2078. if (
  2079. !this.editForm.document_directories ||
  2080. this.editForm.document_directories.length === 0
  2081. ) {
  2082. return;
  2083. }
  2084. const dirName = this.editForm.document_directories[0];
  2085. const dir = this.editDirectoryList.find((dir) => dir.name === dirName);
  2086. if (!dir) {
  2087. return;
  2088. }
  2089. this.editForm.document_directories = dir.id;
  2090. // 延迟加载文档列表
  2091. await this.$nextTick();
  2092. await this.loadEditDocumentList(dir.id);
  2093. // 处理文档选择
  2094. this.handleDocumentSelection();
  2095. },
  2096. handleDocumentSelection() {
  2097. if (!this.editForm.documents || this.editForm.documents.length === 0) {
  2098. this.editForm.documents = ["all"];
  2099. } else if (this.editForm.documents.includes("全部")) {
  2100. this.editForm.documents = ["all"];
  2101. } else {
  2102. this.editForm.documents = this.editDocumentList
  2103. .filter((doc) => this.editForm.documents.includes(doc.name))
  2104. .map((doc) => doc.id);
  2105. }
  2106. },
  2107. handleJsonFields() {
  2108. // 处理 role_permissions
  2109. if (this.editForm.role_permissions) {
  2110. if (typeof this.editForm.role_permissions !== "string") {
  2111. try {
  2112. this.editForm.role_permissions = JSON.stringify(
  2113. this.editForm.role_permissions
  2114. );
  2115. } catch (error) {
  2116. console.error("Error stringifying role_permissions:", error);
  2117. this.editForm.role_permissions = "";
  2118. }
  2119. }
  2120. } else {
  2121. this.editForm.role_permissions = "";
  2122. }
  2123. // 处理 custom_variables
  2124. if (this.editForm.custom_variables) {
  2125. this.editForm.custom_variables = JSON.stringify(
  2126. this.editForm.custom_variables
  2127. );
  2128. } else {
  2129. this.editForm.custom_variables = "";
  2130. }
  2131. },
  2132. /* 查看 */
  2133. initView() {
  2134. // 根据 card 的数据填充 viewForm
  2135. this.viewForm = JSON.parse(JSON.stringify(this.$route.query.card)); // 深拷贝以避免直接修改原对象
  2136. // 处理 knowledge_base_names
  2137. this.viewForm.knowledge_base_names =
  2138. this.viewForm.knowledge_base_names.map((name) => {
  2139. const kb = this.kneList.find((kb) => kb.name === name);
  2140. return kb ? kb.id : name; // 如果找不到对应的知识库,保留原名称
  2141. });
  2142. // 处理 role_permissions
  2143. if (this.viewForm.role_permissions) {
  2144. if (typeof this.viewForm.role_permissions !== "string") {
  2145. try {
  2146. this.viewForm.role_permissions = JSON.stringify(
  2147. this.viewForm.role_permissions
  2148. );
  2149. } catch (error) {
  2150. console.error("Error stringifying role_permissions:", error);
  2151. this.viewForm.role_permissions = "";
  2152. }
  2153. }
  2154. } else {
  2155. this.viewForm.role_permissions = "";
  2156. }
  2157. // 处理 custom_variables
  2158. if (this.viewForm.custom_variables) {
  2159. this.viewForm.custom_variables = JSON.stringify(
  2160. this.viewForm.custom_variables
  2161. );
  2162. } else {
  2163. this.viewForm.custom_variables = "";
  2164. }
  2165. // 处理文档选择
  2166. if (
  2167. !this.viewForm.documents ||
  2168. this.viewForm.documents.length === 0 ||
  2169. this.viewForm.documents.includes("全部")
  2170. ) {
  2171. this.viewForm.documents = ["全部"];
  2172. } else {
  2173. // 将文档名称转换为ID(如果需要的话)
  2174. this.viewForm.documents = this.viewForm.documents.map((docName) => {
  2175. const doc = this.editDocumentList.find((d) => d.name === docName);
  2176. return doc ? doc.id : docName;
  2177. });
  2178. }
  2179. /* // 处理文档选择
  2180. if (this.editForm.documents.length === 0 || this.editForm.documents.includes('全部')) {
  2181. this.editForm.documents = ['all'];
  2182. } else {
  2183. // 将文档名称转换为ID
  2184. this.editForm.documents = this.editForm.documents.map(docName => {
  2185. const doc = this.editDocumentList.find(d => d.name === docName);
  2186. return doc ? doc.id : docName;
  2187. });
  2188. } */
  2189. // 加载知识库对应的目录列表
  2190. this.loadEditDirectoryList(this.viewForm.knowledge_base_names);
  2191. },
  2192. },
  2193. };
  2194. </script>
  2195. <style lang='scss' scoped>
  2196. .header {
  2197. margin-left: 20px;
  2198. h2 {
  2199. margin-bottom: 0px;
  2200. }
  2201. }
  2202. .center {
  2203. margin: 10px;
  2204. ::v-deep .el-form--inline .el-form-item {
  2205. display: block;
  2206. }
  2207. ::v-deep .el-input-number--medium {
  2208. width: 150px;
  2209. }
  2210. }
  2211. .footer {
  2212. display: flex;
  2213. justify-content: flex-end;
  2214. margin: 0 100px 20px;
  2215. }
  2216. ::v-deep .avatar-uploader .el-upload {
  2217. border: 1px dashed #d9d9d9;
  2218. border-radius: 6px;
  2219. cursor: pointer;
  2220. position: relative;
  2221. overflow: hidden;
  2222. }
  2223. .avatar-uploader .el-upload:hover {
  2224. border-color: #409eff;
  2225. }
  2226. .avatar-uploader-icon {
  2227. font-size: 28px;
  2228. color: #8c939d;
  2229. width: 100px;
  2230. height: 100px;
  2231. line-height: 100px;
  2232. text-align: center;
  2233. }
  2234. .avatar {
  2235. width: 100px;
  2236. height: 100px;
  2237. display: block;
  2238. }
  2239. .hint {
  2240. font-size: 12px;
  2241. color: #c0c4cc;
  2242. }
  2243. </style>