From 3a022dc2caa78267a681824ea1c303f140cd6797 Mon Sep 17 00:00:00 2001 From: liudong <liudong> Date: 星期五, 02 八月 2024 19:57:45 +0800 Subject: [PATCH] 智能体管理的页面开发和功能开发 --- src/views/dmx/IntelligentAgent/index.vue | 2 src/views/dmx/IntelligentAgent/components/editAgent.vue | 218 ++++++++++++++++++------------------ src/views/dmx/knowledgeLib/index.vue | 23 ++- src/views/dmx/IntelligentAgent/components/addAgent.vue | 80 +++++++++---- 4 files changed, 181 insertions(+), 142 deletions(-) diff --git a/src/views/dmx/IntelligentAgent/components/addAgent.vue b/src/views/dmx/IntelligentAgent/components/addAgent.vue index 178d923..a5c2c6d 100644 --- a/src/views/dmx/IntelligentAgent/components/addAgent.vue +++ b/src/views/dmx/IntelligentAgent/components/addAgent.vue @@ -16,11 +16,14 @@ <a-form-item field="name" label="鏅鸿兘浣撳悕绉�"> <a-input v-model="form.name" placeholder="璇疯緭鍏ュ悕绉�"/> </a-form-item> - + <a-form-item label="浣犲笇鏈涙櫤鑳戒綋鐨勮鑹叉槸浠�涔堬紝鍏蜂綋瀹屾垚浠�涔堜换鍔★紵"> + <a-textarea v-model="form.prompt_config.system" placeholder="" style="height: 180px"/> + </a-form-item> <a-form-item> <div style="width: 100%;text-align: right"> <a-button @click="visible = false">鍙栨秷</a-button> <a-button style="margin-left: 10px" type="primary" html-type="submit">纭畾</a-button> + <editAgent ref="editAgentKuai" typeAngint="add" :formData="form"></editAgent> </div> </a-form-item> </a-form> @@ -29,28 +32,47 @@ <script lang="ts" setup> import { onMounted ,onBeforeMount, reactive, ref } from "vue"; +import editAgent from "@/views/dmx/IntelligentAgent/components/editAgent.vue"; const visible = ref(false); const loading = ref(false); +const editAgentKuai = ref(); const form = reactive({ - size: "medium", name: "", - age: undefined, - section: "0", - province: "haidian", - options: [], - date: "", - time: "", - radio: "radio one", - slider: 5, - score: 5, - switch: false, - multiSelect: ["section one"], - treeSelect: "", - raptor: false, - prompt: '璇锋�荤粨浠ヤ笅娈佃惤銆� 灏忓績鏁板瓧锛屼笉瑕佺紪閫犮�� 娈佃惤濡備笅锛歕n' + - ' {cluster_content}\n' + - '浠ヤ笂灏辨槸浣犻渶瑕佹�荤粨鐨勫唴瀹广��', + icon: "", + language: "English", + prompt_config: { + empty_response: "", + prologue: "浣犲ソ锛� 鎴戞槸浣犵殑鍔╃悊锛屾湁浠�涔堝彲浠ュ府鍒颁綘鐨勫悧锛�", + quote: true, + self_rag: true, + system: "绀轰緥锛歕n" + + "浣犳槸 XX锛屽叿鏈� XX 缁忛獙锛屾搮闀� XX锛屸�n" + + "浣犵殑浠诲姟鏄� XX 锛岄渶瑕佹寜鐓т互涓嬫楠ゆ墽琛岋細\n" + + "1. XX\n" + + "2. XX\n" + + "3. 鈥n", + parameters: [ + { + "key": "knowledge", + "optional": false + } + ] + }, + kb_ids: [ + "985eda244efc11ef9a7a0242ac120006" + ], + llm_id: "qwen-plus", + llm_setting: { + temperature: 0.1, + top_p: 0.3, + presence_penalty: 0.4, + frequency_penalty: 0.7, + max_tokens: 512 + }, + similarity_threshold: 0.2, + vector_similarity_weight: 0.30000000000000004, + top_n: 8 }); const formRef = ref(null); @@ -67,6 +89,9 @@ const handleSubmit = ({values, errors}) => { console.log('values:', values, '\nerrors:', errors) + if(!errors){ + editAgentKuai.value.handleClick(form) + } } const handleClick = () => { @@ -81,13 +106,20 @@ } const handleOpened =(el) => { - Object.assign(form,{ - name: '',// 鐢ㄦ埛鍚� - nameJoin: '',// 鏄电О - post: '',// 宀椾綅 - txt: '',// 澶囨敞 - }); + // Object.assign(form,{ + // name: '',// 鐢ㄦ埛鍚� + // nameJoin: '',// 鏄电О + // post: '',// 宀椾綅 + // txt: '',// 澶囨敞 + // }); formRef.value.resetFields(); + form.name = '' + form.prompt_config.system = "绀轰緥锛歕n" + + "浣犳槸 XX锛屽叿鏈� XX 缁忛獙锛屾搮闀� XX锛屸�n" + + "浣犵殑浠诲姟鏄� XX 锛岄渶瑕佹寜鐓т互涓嬫楠ゆ墽琛岋細\n" + + "1. XX\n" + + "2. XX\n" + + "3. 鈥n" } const file = ref(); diff --git a/src/views/dmx/IntelligentAgent/components/editAgent.vue b/src/views/dmx/IntelligentAgent/components/editAgent.vue index d7def9c..813ca79 100644 --- a/src/views/dmx/IntelligentAgent/components/editAgent.vue +++ b/src/views/dmx/IntelligentAgent/components/editAgent.vue @@ -1,119 +1,99 @@ <template> - <a-button type="text" size="small" @click="handleClick"> + <a-button v-if="typeAngint=='edit'" type="text" size="small" @click="handleClick"> <template #icon> <icon-tool /> </template> </a-button> - - <a-modal v-model:visible="visible" title="娣诲姞妯″紡" +<!-- <a-button v-if="typeAngint=='add'" style="margin-left: 10px" type="primary" @click="handleClick">纭畾</a-button>--> + <a-modal v-model:visible="visible" title="" @before-open="handleOpened" @cancel="handleCancel" :footer="false" title-align="start" - width="600px" + fullscreen > - <a-form ref="formRef" :rules="rules" :model="form" @submit="handleSubmit" :style="{width:'90%',margin:'0 auto'}" layout="vertical" > - <a-form-item field="name" label="妯″瀷绫诲瀷"> - <a-select v-model="form.section" placeholder="璇烽�夋嫨"> - <a-option value="section one">Section One</a-option> - <a-option value="section two">Section Two</a-option> - <a-option value="section three">Section Three</a-option> - </a-select> - </a-form-item> - <a-form-item field="name" label="妯″瀷鍚嶇О"> - <a-input v-model="form.name" placeholder="璇疯緭鍏ュ悕绉�"/> - </a-form-item> - <a-form-item field="section" label="妯″瀷鍥剧墖"> - <a-space direction="vertical" :style="{ width: '100%' }"> - <a-upload - action="/" - :fileList="file ? [file] : []" - :show-file-list="false" - @change="onChange" - @progress="onProgress" - > - <template #upload-button> - <div - :class="`arco-upload-list-item${ - file && file.status === 'error' ? ' arco-upload-list-item-error' : '' - }`" - > - <div - class="arco-upload-list-picture custom-upload-avatar" - v-if="file && file.url" - > - <img :src="file.url" /> - <div class="arco-upload-list-picture-mask"> - <IconEdit /> - </div> - <a-progress - v-if="file.status === 'uploading' && file.percent < 100" - :percent="file.percent" - type="circle" - size="mini" - :style="{ - position: 'absolute', - left: '50%', - top: '50%', - transform: 'translateX(-50%) translateY(-50%)', - }" - /> - </div> - <div class="arco-upload-picture-card" v-else> - <div class="arco-upload-picture-card-text"> - <IconPlus /> - <div style="margin-top: 10px; font-weight: 600">涓婁紶</div> - </div> - </div> - </div> - </template> - </a-upload> - </a-space> - </a-form-item> - <a-form-item field="name" label="鍩虹Url"> - <a-input v-model="form.name" placeholder="璇疯緭鍏ュ悕绉�"/> - </a-form-item> - <a-form-item field="raptor" label="鏄惁鏀寔 Vision"> - <a-switch v-model="form.raptor" /> - </a-form-item> + <div class="main-container"> + <div class="main-container-lf"> + <div style="padding: 10px;font-size: 16px;background:#eeeeee;">鏅鸿兘浣撻厤缃�</div> + <div style="display: flex;width: 100%;" :style="{height:height}"> + <div style="width: 50%;height: 100%"> + <div style="padding: 10px;font-size: 12px;color: #2a2a2b;">鏅鸿兘浣撶敾鍍�</div> + <div> - <a-form-item> - <div style="width: 100%;text-align: right"> - <a-button @click="visible = false">鍙栨秷</a-button> - <a-button style="margin-left: 10px" type="primary" html-type="submit">纭畾</a-button> + </div> + </div> - </a-form-item> - </a-form> + <div style="background:#eeeeee;width: 50%;"> + <a-form ref="formRef" :rules="rules" :model="form" @submit="handleSubmit" layout="vertical" > + + <a-collapse :default-active-key="['1']"> + <a-collapse-item header="AI妯″瀷閰嶇疆" key="1"> + + </a-collapse-item> + <a-collapse-item header="寮�鍦哄紩瀵�" :key="'2'"> + + </a-collapse-item> + <a-collapse-item header="鐭ヨ瘑搴�" key="3"> + + </a-collapse-item> + <a-collapse-item header="宸ュ叿" key="4" disabled> + </a-collapse-item> + <a-collapse-item header="宸ヤ綔娴�" key="5" disabled> + </a-collapse-item> + </a-collapse> + + <a-form-item> + <div style="position: absolute;right: 10px;top: 10px"> +<!-- <a-button @click="visible = false">鍙栨秷</a-button>--> + <a-button style="margin-left: 10px" type="primary" html-type="submit">淇濆瓨</a-button> + </div> + </a-form-item> + </a-form> + </div> + </div> + </div> + <div class="main-container-rt"> + <div :style="{height:heightrg}"> + <div style="padding: 10px"> + <a-avatar :style="{ backgroundColor: '#3370ff' }"> + <img + :style="{ width: '100%'}" + alt="dessert" + src="https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a20012a2d4d5b9db43dfc6a01fe508c0.png~tplv-uwbnlip3yd-webp.webp" + /> + </a-avatar> + 璋冭瘯棰勮 + </div> + <a-divider style="margin: 0;margin-left: 10px"/> + + <div class="bottom"> + <div class="input"> + <a-input placeholder="杈撳叆鎮ㄦ兂浜嗚В鐨勫唴瀹癸紝鎸塃nter鍙戦��"> + <template #suffix> + <icon-send style="cursor: pointer" /> + </template> + </a-input></div> + <div class="text">鍐呭鐢盇I鐢熸垚锛屼粎渚涘弬鑰�</div> + </div> + </div> + </div> + </div> </a-modal> </template> <script lang="ts" setup> -import { onMounted ,onBeforeMount, reactive, ref } from "vue"; - +import { onMounted, onBeforeMount, reactive, ref, nextTick } from "vue"; +import { IconSend } from "@arco-design/web-vue/es/icon"; +const props = defineProps(['typeAngint','formData']) const visible = ref(false); const loading = ref(false); const form = reactive({ - size: "medium", - name: "", - age: undefined, - section: "0", - province: "haidian", - options: [], - date: "", - time: "", - radio: "radio one", - slider: 5, - score: 5, - switch: false, - multiSelect: ["section one"], - treeSelect: "", - raptor: false, - prompt: '璇锋�荤粨浠ヤ笅娈佃惤銆� 灏忓績鏁板瓧锛屼笉瑕佺紪閫犮�� 娈佃惤濡備笅锛歕n' + - ' {cluster_content}\n' + - '浠ヤ笂灏辨槸浣犻渶瑕佹�荤粨鐨勫唴瀹广��', + }); const formRef = ref(null); +const height = ref('calc(100vh - 150px)') +const heightrg = ref('calc(100vh - 100px)') const rules = { name: [ @@ -129,9 +109,16 @@ console.log('values:', values, '\nerrors:', errors) } -const handleClick = () => { +const handleClick = (data) => { visible.value = true; + nextTick(()=>{ + Object.assign(form,data); + console.log(form); + }) }; +defineExpose({ + handleClick +}) const handleBeforeOk = (done) => { formRef.value.validate().then(res => { console.log('form:', form) @@ -148,12 +135,6 @@ } const handleOpened =(el) => { - Object.assign(form,{ - name: '',// 鐢ㄦ埛鍚� - nameJoin: '',// 鏄电О - post: '',// 宀椾綅 - txt: '',// 澶囨敞 - }); formRef.value.resetFields(); } @@ -178,11 +159,32 @@ }) </script> -<script lang="ts"> -export default { - name: 'add', - methods: { - +<style scoped lang="less"> +.main-container { + width: 100%; + display: flex; + .main-container-lf { + width: 60%; } -}; -</script> \ No newline at end of file + .main-container-rt { + position: relative; + width: 40%; + } +} +.bottom{ + width: 100%; + position: absolute; + bottom: 40px; + left:0; + .input{ + margin-left: 20%; + width: 60%; + } + .text{ + margin-left: 40%; + font-size: 12px; + color: lightgrey; + line-height: 40px; + } +} +</style> \ No newline at end of file diff --git a/src/views/dmx/IntelligentAgent/index.vue b/src/views/dmx/IntelligentAgent/index.vue index 63a184b..4f23e22 100644 --- a/src/views/dmx/IntelligentAgent/index.vue +++ b/src/views/dmx/IntelligentAgent/index.vue @@ -71,7 +71,7 @@ </div> <div style="position: absolute; bottom: 1rem; right: 1rem;"> <a-space> - <editAgent></editAgent> +<!-- <editAgent typeAngint="edit"></editAgent>--> <a-popconfirm :content="'纭畾鍒犻櫎鍚�'" type="warning" @ok="deleteItem(record)"> <a-button type="text" size="small"> <template #icon> diff --git a/src/views/dmx/knowledgeLib/index.vue b/src/views/dmx/knowledgeLib/index.vue index 4cc8eca..31d1c7d 100644 --- a/src/views/dmx/knowledgeLib/index.vue +++ b/src/views/dmx/knowledgeLib/index.vue @@ -11,7 +11,7 @@ <addKnow @knowledgeData="knowledgeData"></addKnow> </div> <div class="lf-container-down"> - <div class="tabs"> + <a-scrollbar style="height:56rem;overflow: auto;"> <div class="tab" v-for="(tab, index) in tabs" @@ -29,8 +29,8 @@ </template> </a-popover> </div> + </a-scrollbar> </div> - </div> </div> <div class="rt-container"> <a-tabs default-active-key="1"> @@ -794,16 +794,21 @@ .lf-container-down{ display: flex; flex-direction: column; + box-sizing: border-box; width: 90%; - height: 56rem; + //height: 56rem; border: 1px solid #eeeeee; - overflow: auto; - padding: 10px; + //padding: 10px; margin-bottom: 10px; - .tabs .tab { + //.tabs{ + // width: 100%; + // height: 100%; + // overflow: auto; + //} + .tab { cursor: pointer; box-sizing: border-box; - margin: 10px 0; + margin: 10px 10px; padding:0 10px; color: rgba(0, 0, 0, 0.88); font-size: 14px; @@ -815,12 +820,12 @@ border: 1px solid #f0f0f0; border-radius: 8px; } - .tabs .tab:hover { + .tab:hover { border: 1px solid #ffffff; background: #e8e8ea; box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09); } - .tabs .tab.active { + .tab.active { border: 1px solid #e8e8ea; background: #e8e8ea; cursor: pointer; -- Gitblit v1.8.0