From ff0ae974a1c561eaf2915988dac63cd066af189f Mon Sep 17 00:00:00 2001 From: yinbangzhong <zhongbangyin@126.com> Date: 星期四, 12 九月 2024 09:23:44 +0800 Subject: [PATCH] bug fix --- src/views/dmx/IntelligentAgent/components/editAgent.vue | 475 ++++++++++++++++++++++++++++++++++++++-------------------- 1 files changed, 309 insertions(+), 166 deletions(-) diff --git a/src/views/dmx/IntelligentAgent/components/editAgent.vue b/src/views/dmx/IntelligentAgent/components/editAgent.vue index d7def9c..e82a113 100644 --- a/src/views/dmx/IntelligentAgent/components/editAgent.vue +++ b/src/views/dmx/IntelligentAgent/components/editAgent.vue @@ -1,188 +1,331 @@ - <template> - <a-button type="text" size="small" @click="handleClick"> + <a-button + v-if="typeAngint == 'edit'" + type="text" + size="small" + @click="editClick" + > <template #icon> <icon-tool /> </template> </a-button> - - <a-modal v-model:visible="visible" title="娣诲姞妯″紡" - @before-open="handleOpened" - @cancel="handleCancel" - :footer="false" - title-align="start" - width="600px" + <!-- <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" + 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: var(--color-neutral-3);">鏅鸿兘浣撻厤缃�</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-textarea v-model="system" placeholder="" disabled style="height: 400px;" /> + </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> - </a-form-item> - </a-form> + <div style="width: 50%;border: 1px solid var(--color-neutral-3);background: var(--color-neutral-3)"> + <a-form ref="formRef" :rules="rules" :model="form" @submit="handleSubmit" layout="vertical" > + <a-collapse :default-active-key="['1']"> + <a-collapse-item header="鍩虹淇℃伅" key="0" v-if="typeAngint == 'edit'"> + <a-input v-model="form.name" placeholder="璇疯緭鍏ユ櫤鑳戒綋鍚嶇О" style="width:200px;margin-top: 10px" /> + </a-collapse-item> + <a-collapse-item header="AI妯″瀷閰嶇疆" key="1"> + <a-form-item field="llm_id" label="妯″瀷"> + <a-space direction="vertical" size="large"> + <a-select :size="'large'" field="llm_id" v-model="form.llm_id" :style="{width:'25rem'}" placeholder="璇烽�夋嫨 ..."> + <a-optgroup + :label="index" + v-for="(item, index) in modelList" + :key="index" + > + <a-option + v-for="obj in item" + :key="obj.fid" + :disabled="!obj.available" + :value="obj.llm_id" + > + {{ obj.llm_name }} + </a-option> + </a-optgroup> + </a-select> + </a-space> + </a-form-item> + </a-collapse-item> + <a-collapse-item header="寮�鍦哄紩瀵�" :key="'2'" disabled> + </a-collapse-item> + <a-collapse-item header="鐭ヨ瘑搴�" key="3"> + <a-form-item field="kb_ids" label="鐭ヨ瘑搴�"> + <a-select + v-model="form.kb_ids" + :style="{ width: '25rem' }" + placeholder="璇烽�夋嫨 ..." + multiple + > + <a-option + v-for="item in tabs" + :key="item.id" + :value="item.id" + >{{ item.name }}</a-option + > + </a-select> + </a-form-item> + </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: 0px; + z-index: 99999; + " + > + <!-- <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"> + <sessionAction></sessionAction> + </div> + </div> </a-modal> </template> <script lang="ts" setup> -import { onMounted ,onBeforeMount, reactive, ref } from "vue"; - -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 rules = { - name: [ - { - required: true, - message:'鍚嶇О涓嶅厑璁镐负绌�', + import { onMounted, onBeforeMount, reactive, ref, nextTick } from 'vue'; + import { IconSend } from '@arco-design/web-vue/es/icon'; + import { queryKbList, queryModelList } from '@/api/kbList'; + import useLoading from '@/hooks/loading'; + import { dialogSet } from '@/api/Agent'; + import { Message } from '@arco-design/web-vue'; + import EventBus from "@/utils/EventBus"; + import sessionAction from "@/views/dmx/IntelligentAgent/components/sessionAction.vue"; + const { setLoading } = useLoading(true); + const props = defineProps(['typeAngint', 'formData']); + const visible = ref(false); + const loading = ref(false); + const form = reactive({ + name: '', + 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' + + '{knowlege}', + parameters: [ + { + key: 'knowledge', + optional: false, + }, + ], }, - ], -} - - -const handleSubmit = ({values, errors}) => { - console.log('values:', values, '\nerrors:', errors) -} - -const handleClick = () => { - visible.value = true; -}; -const handleBeforeOk = (done) => { - formRef.value.validate().then(res => { - console.log('form:', form) - if (!form.name) { - done(false) - }else { - console.log('璇锋眰鏁版嵁'); - - } - }) -}; -const handleCancel = () => { - visible.value = false; -} - -const handleOpened =(el) => { - Object.assign(form,{ - name: '',// 鐢ㄦ埛鍚� - nameJoin: '',// 鏄电О - post: '',// 宀椾綅 - txt: '',// 澶囨敞 + kb_ids: [], + 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, }); - formRef.value.resetFields(); -} - -const file = ref(); - -const onChange = (_, currentFile) => { - file.value = { - ...currentFile, - // url: URL.createObjectURL(currentFile.file), + const system = ref(''); + const embdId = ref(''); + const modelList = ref({}); + const renderData = ref([]); + const formRef = ref(null); + let tabs = ref([]); + const height = ref('calc(100vh - 150px)'); + const emit = defineEmits(['cancelModal']); + const rules = { + name: [ + { + required: true, + message: '鍚嶇О涓嶅厑璁镐负绌�', + }, + ], + llm_id: [ + { + required: true, + message: '妯″瀷涓嶈兘涓虹┖', + }, + ], + kb_ids: [ + { + required: true, + message: '鐭ヨ瘑搴撲笉鑳戒负绌�', + }, + ], }; -}; -const onProgress = (currentFile) => { - file.value = currentFile; -}; -onBeforeMount(()=>{ + const handleSubmit = async ({ values, errors }) => { + // console.log('values:', values, '\nerrors:', errors) + if(!errors){ + let title = '鍒涘缓鎴愬姛'; + let formNew = { ...form }; + if (props.typeAngint == 'edit') { + formNew.dialog_id = form.id; + delete formNew.id; + delete formNew.off; + title = '淇敼鎴愬姛'; + } + const data = await dialogSet(formNew); + if (data.code == 0) { + Message.success(title); + handleCancel(); + EventBus.emit('queryList'); + } + } + }; -}) -onMounted(()=>{ + const editClick = (data) => { + visible.value = true; + console.log(props.formData); + Object.assign(form, props.formData); + console.log(form); + system.value = form.prompt_config.system; + }; + const handleClick = (data) => { + visible.value = true; + nextTick(() => { + Object.assign(form, data); + console.log(form,'浼犲��'); + system.value = form.prompt_config.system; + if(tabs.value && tabs.value.length>0){ + form.kb_ids = [tabs.value[0].id]; + } + }); + }; + defineExpose({ + handleClick, + }); + const handleBeforeOk = (done) => { + formRef.value.validate().then((res) => { + console.log('form:', form); + if (!form.name) { + done(false); + } else { + console.log('璇锋眰鏁版嵁'); + } + }); + }; + const handleCancel = () => { + visible.value = false; + emit('cancelModal'); + }; -}) + const handleOpened = (el) => { + // formRef.value.resetFields(); + }; + const queryModel = async (params) => { + try { + const data = await queryModelList(params); + // console.log(data.data, '澶фā鍨嬪垪琛�'); + modelList.value = data.data; + } catch (err) { + // you can report use errorHandler or other + } finally { + } + }; + const file = ref(); + + const onChange = (_, currentFile) => { + file.value = { + ...currentFile, + // url: URL.createObjectURL(currentFile.file), + }; + }; + const onProgress = (currentFile) => { + file.value = currentFile; + }; + + const knowledgeData = async (params = { page: 1, page_size: 20 }) => { + setLoading(true); + try { + const { data } = await queryKbList(params); + console.log(data, 'data'); + nextTick(() => { + tabs.value = data; + console.log(tabs.value, 'tabs'); + }); + } catch (err) { + // you can report use errorHandler or other + } finally { + setLoading(false); + } + }; + + onBeforeMount(() => { + queryModel({}); + knowledgeData(); + }); + onMounted(() => {}); </script> -<script lang="ts"> -export default { - name: 'add', - methods: { - +<style scoped lang="less"> + .main-container { + width: 100%; + display: flex; + .main-container-lf { + width: 60%; + } + .main-container-rt { + position: relative; + width: 40%; + } } -}; -</script> \ No newline at end of file + .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; + } + } + :deep(.arco-textarea-wrapper.arco-textarea-disabled){ + background: var(--color-bg-2); + color: var(--color-text-1); + } +</style> -- Gitblit v1.8.0