From 7b8ac484c22a2e5b726579b8e13fff5048de0dd5 Mon Sep 17 00:00:00 2001 From: liudong <liudong> Date: 星期三, 07 八月 2024 15:00:17 +0800 Subject: [PATCH] 配置bug页面修改 --- src/views/dmx/IntelligentAgent/index.vue | 182 ++++++++++++++++++++++++++------------------- 1 files changed, 105 insertions(+), 77 deletions(-) diff --git a/src/views/dmx/IntelligentAgent/index.vue b/src/views/dmx/IntelligentAgent/index.vue index 8a5276a..4357e17 100644 --- a/src/views/dmx/IntelligentAgent/index.vue +++ b/src/views/dmx/IntelligentAgent/index.vue @@ -4,80 +4,106 @@ <a-row :gutter="20" align="stretch"> <a-col :span="24"> <a-card class="general-card" :title="$t('鏅鸿兘浣撶鐞�')"> - <div style="display: flex;justify-content: right;"> + <div style="display: flex; justify-content: right"> <a-input-search :placeholder="$t('cardList.searchInput.placeholder')" - style="width: 240px;" + style="width: 240px" @change="queryList" /> + <agent-config typeAngint="add"></agent-config> </div> <a-divider style="margin: 10px 0" /> <a-row justify="space-between"> <a-col :span="24"> - <div style="display: flex; flex-wrap: wrap;"> - <div class="card-wrap" style="cursor: pointer;" @click="handleAdd"> - <a-card :bordered="false" hoverable > - <div style="margin-top: 30px;text-align: center"> - <a-avatar style="background: #3370ff;"> - <icon-plus /> - </a-avatar> - </div> - <div class="arco-card-body-content"> - <div style="text-align: center;margin-top: 10px"> - 鏂板缓鏅鸿兘浣� - </div> - <div style="text-align:center;margin-top: 10px;font-size: 12px;color: #999999"> - 閫氳繃鎻忚堪瑙掕壊鍜屼换鍔℃潵鍒涘缓浣犵殑鏅鸿兘浣�<br> - 鏅鸿兘浣撳彲浠ヨ皟鐢ㄥ涓伐浣滄祦鍜屽伐鍏� - </div> - </div> - <add-agent ref="addAgents"></add-agent> -<!-- <div style="position: absolute; bottom: 1rem; right: 1rem;">--> -<!-- <a-space>--> -<!-- </a-space>--> + <div style="display: flex; flex-wrap: wrap"> +<!-- <div--> +<!-- class="card-wrap"--> +<!-- style="cursor: pointer"--> +<!-- @click="handleAdd"--> +<!-- >--> +<!-- <a-card :bordered="false" hoverable>--> +<!-- <div style="margin-top: 30px; text-align: center">--> +<!-- <a-avatar style="background: #3370ff">--> +<!-- <icon-plus />--> +<!-- </a-avatar>--> <!-- </div>--> - </a-card> - </div> - <div class="card-wrap" v-for="(item, index) of agentList" :key="item.id"> - <a-card :bordered="false" hoverable > +<!-- <div class="arco-card-body-content">--> +<!-- <div style="text-align: center; margin-top: 10px">--> +<!-- 鏂板缓鏅鸿兘浣�--> +<!-- </div>--> +<!-- <div--> +<!-- style="--> +<!-- text-align: center;--> +<!-- margin-top: 10px;--> +<!-- font-size: 12px;--> +<!-- color: #999999;--> +<!-- "--> +<!-- >--> +<!-- 閫氳繃鎻忚堪瑙掕壊鍜屼换鍔℃潵鍒涘缓浣犵殑鏅鸿兘浣�<br />--> +<!-- 鏅鸿兘浣撳彲浠ヨ皟鐢ㄥ涓伐浣滄祦鍜屽伐鍏�--> +<!-- </div>--> +<!-- </div>--> +<!-- <add-agent ref="addAgents"></add-agent>--> +<!-- <!– <div style="position: absolute; bottom: 1rem; right: 1rem;">–>--> +<!-- <!– <a-space>–>--> +<!-- <!– </a-space>–>--> +<!-- <!– </div>–>--> +<!-- </a-card>--> +<!-- </div>--> + <div + class="card-wrap" + v-for="(item, index) of agentList" + :key="item.id" + > + <a-card :bordered="false" hoverable> <a-avatar :style="{ backgroundColor: '#3370ff' }"> <img - :style="{ width: '100%'}" + :style="{ width: '100%' }" alt="dessert" - src="https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a20012a2d4d5b9db43dfc6a01fe508c0.png~tplv-uwbnlip3yd-webp.webp" + :src="item.icon || 'https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a20012a2d4d5b9db43dfc6a01fe508c0.png~tplv-uwbnlip3yd-webp.webp'" /> </a-avatar> - <a-switch v-model="item.off" style="position: absolute;top: 10px;right: 10px" size="medium" @change="handleChange(item)"> - <template #checked> - 涓婄嚎 - </template> - <template #unchecked> - 涓嬬嚎 - </template> + <a-switch + v-model="item.off" + style="position: absolute; top: 10px; right: 10px" + size="medium" + @change="handleChange(item)" + > + <template #checked> 涓婄嚎 </template> + <template #unchecked> 涓嬬嚎 </template> </a-switch> <div class="arco-card-body-content"> <div class="arco-card-body-content-top"> - <span style="font-size: 18px;font-weight: 900"> + <span style="font-size: 18px; font-weight: 900"> {{ item.name }} </span> </div> <div class="arco-card-body-content-down"> - {{item.prompt_config.prologue}} + {{ item.prompt_config.prologue }} </div> - </div> - <div style="position: absolute; bottom: 1.4rem; left: 1rem;"> - <icon-user /> <span style="font-size: 12px"> -<!-- {{ item.name }}--> - </span> + <div style="position: absolute; bottom: 1.4rem; left: 1rem"> + <icon-user /> + <span style="font-size: 12px"> + <!-- {{ item.name }}--> + </span> </div> - <div style="position: absolute; bottom: 1rem; right: 1rem;"> + <div style="position: absolute; bottom: 1rem; right: 1rem"> <a-space> <span v-show="!item.off"> - <editAgent ref="editAgentKuai" typeAngint="edit" :formData="form" @cancelModal="handleCancel"></editAgent> + <agent-config + ref="editAgentKuai" + typeAngint="edit" + :formData="item" + @queryList="queryList" + ></agent-config> </span> - <a-popconfirm :content="'纭畾鍒犻櫎鍚�'" type="warning" @ok="deleteItem(item)"> - <a-button type="text" size="small"> + <a-popconfirm + :content="'纭畾鍒犻櫎鍚�'" + type="warning" + @ok="deleteItem(item)" + > + <a-button type="text" > <template #icon> <icon-delete /> </template> @@ -97,14 +123,13 @@ </template> <script lang="ts" setup> -import { ref, reactive, nextTick, onBeforeMount } from "vue"; - import addAgent from "@/views/dmx/IntelligentAgent/components/addAgent.vue"; - import editAgent from "@/views/dmx/IntelligentAgent/components/editAgent.vue"; - import { kbdocumentrm, queryKbList } from "@/api/kbList"; - import { Message } from "@arco-design/web-vue"; -import { deletedialog, querydialogList } from "@/api/Agent"; - import useLoading from "@/hooks/loading"; +import { ref, reactive, nextTick, onBeforeMount, onMounted, onBeforeUnmount } from "vue"; + import { Message } from '@arco-design/web-vue'; + import { deletedialog, querydialogList } from '@/api/Agent'; + import useLoading from '@/hooks/loading'; const { loading, setLoading } = useLoading(true); + import EventBus from '@/utils/EventBus'; + import AgentConfig from "@/views/dmx/IntelligentAgent/components/agentConfig.vue"; let count = 5; const activeKey = ref(1); @@ -127,14 +152,11 @@ // content: 'Content of Tab Panel 4', // }, ]); -const changeTabs = (val) => { - activeKey.value = val; -} + const changeTabs = (val) => { + activeKey.value = val; + }; const handleAdd = () => { addAgents.value.handleClick(); - }; - const handleDelete = (key: any) => { - data.value = data.value.filter((item) => item.key !== key); }; const visible = ref(false); @@ -144,9 +166,7 @@ // name: '', }); - const queryList = async ( - params = { } - ) => { + const queryList = async (params = {}) => { setLoading(true); try { const { data } = await querydialogList(params); @@ -155,7 +175,7 @@ return { ...item, off: true, - } + }; }); } catch (err) { // you can report use errorHandler or other @@ -164,21 +184,21 @@ } }; - const deleteItem = async (row)=>{ + const deleteItem = async (row) => { console.log(row); - let data = await deletedialog({dialog_ids: [row.id]}) - if(data.code == 0){ + let data = await deletedialog({ dialog_ids: [row.id] }); + if (data.code == 0) { Message.success('鍒犻櫎鎴愬姛'); - queryList() + queryList(); } - } + }; const handleChange = async (item) => { - if (item){ - Object.assign(form,item) + if (item) { + Object.assign(form, item); } }; const handleCancel = () => { - queryList() + queryList(); }; const handleSubmit = ({ values, errors }) => { this.$refs.formRef.validate().then((res, a, b) => { @@ -186,8 +206,16 @@ console.log('values', values); }); }; - onBeforeMount(()=>{ + onBeforeMount(() => { queryList(); + }); + onMounted(()=>{ + EventBus.on('queryList',()=>{ + queryList(); + }) + }) + onBeforeUnmount(()=>{ + EventBus.off('queryList') }) </script> @@ -301,13 +329,13 @@ } } } - .arco-card-body-content{ - .arco-card-body-content-top{ + .arco-card-body-content { + .arco-card-body-content-top { margin-top: 10px; text-align: center; } - .arco-card-body-content-down{ - text-align:center; + .arco-card-body-content-down { + text-align: center; margin-top: 10px; font-size: 12px; color: #999999; -- Gitblit v1.8.0