From 9cf32f84934cf13dba77e20fdddf8703e11b0c62 Mon Sep 17 00:00:00 2001
From: liudong <liudong>
Date: 星期二, 13 八月 2024 20:04:20 +0800
Subject: [PATCH] agent会话开发
---
src/views/dmx/IntelligentAgent/index.vue | 257 +++++++++++++++++++++++++++++++++-----------------
1 files changed, 169 insertions(+), 88 deletions(-)
diff --git a/src/views/dmx/IntelligentAgent/index.vue b/src/views/dmx/IntelligentAgent/index.vue
index 4643bb3..38b17b9 100644
--- a/src/views/dmx/IntelligentAgent/index.vue
+++ b/src/views/dmx/IntelligentAgent/index.vue
@@ -16,7 +16,17 @@
<a-row justify="space-between">
<a-col :span="24">
<a-spin :loading="loading" style="width: 100%">
- <a-scrollbar style="display: flex; flex-wrap: wrap;align-content: flex-start;overflow: auto;" :style="{height: documentHeight + 'px'}">
+ <a-scrollbar
+ style="
+ display: flex;
+ flex-wrap: wrap;
+ align-content: flex-start;
+ overflow: auto;
+ height: calc(100vh - 300px);
+ "
+ :style="{ height: documentHeight + 'px' }"
+ >
+<!-- 鏅鸿兘浣撳垪琛�-->
<div
class="card-wrap"
v-for="(item, index) of agentList"
@@ -41,36 +51,40 @@
</a-switch>
<div class="arco-card-body-content">
<div class="arco-card-body-content-top">
- <span style="font-size: 18px; font-weight: 900">
- {{ item.name }}
- </span>
+ <span style="font-size: 18px; font-weight: 900">
+ {{ item.name }}
+ </span>
</div>
<div class="arco-card-body-content-down">
{{ item.prompt_config.prologue }}
</div>
</div>
- <div style="position: absolute; bottom: 1.4rem; left: 1rem">
+ <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">
- <a-space>
- <span v-show="!item.off">
- <agent-config
- ref="editAgentKuai"
- typeAngint="edit"
- :formData="item"
- @queryList="queryList"
- ></agent-config>
+ <!-- {{ item.name }}-->
</span>
+ </div>
+ <div
+ style="position: absolute; bottom: 1rem; right: 1rem"
+ >
+ <a-space>
+ <span v-show="!item.off">
+ <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" >
+ <a-button type="text">
<template #icon>
<icon-delete />
</template>
@@ -80,41 +94,101 @@
</div>
</a-card>
</div>
- </a-scrollbar>
-<!-- <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;-->
-<!-- "-->
+<!-- agent鍒楄〃-->
+ <div
+ class="card-wrap"
+ v-for="(item, index) of agentNewList"
+ :key="item.id"
+ >
+ <a-card :bordered="false" hoverable>
+ <a-avatar :style="{ backgroundColor: '#5b99da' }">
+ <img
+ :style="{ width: '100%' }"
+ alt="dessert"
+ :src="item.avatar || imgSrc"
+ />
+ </a-avatar>
+<!-- <a-switch-->
+<!-- v-model="item.off"-->
+<!-- style="position: absolute; top: 10px; right: 10px"-->
+<!-- size="medium"-->
+<!-- @change="handleChange(item)"-->
<!-- >-->
-<!-- 閫氳繃鎻忚堪瑙掕壊鍜屼换鍔℃潵鍒涘缓浣犵殑鏅鸿兘浣�<br />-->
-<!-- 鏅鸿兘浣撳彲浠ヨ皟鐢ㄥ涓伐浣滄祦鍜屽伐鍏�-->
+<!-- <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">
+ {{ item.title }}
+ </span>
+ </div>
+<!-- <div class="arco-card-body-content-down">-->
+<!-- {{ item.prompt_config.prologue }}-->
+<!-- </div>-->
+ </div>
+ <div
+ style="position: absolute; bottom: 1.4rem; left: 1rem"
+ >
+ <icon-calendar-clock />
+ <span style="font-size: 12px;margin-left: 10px">
+ {{ moment(item.create_date).format('YYYY-MM-DD HH:mm:ss') }}
+ </span>
+ </div>
+<!-- <div-->
+<!-- style="position: absolute; bottom: 1rem; right: 1rem"-->
+<!-- >-->
+<!-- <a-space>-->
+<!-- <a-popconfirm-->
+<!-- :content="'纭畾鍒犻櫎鍚�'"-->
+<!-- type="warning"-->
+<!-- @ok="deleteItem(item)"-->
+<!-- >-->
+<!-- <a-button type="text">-->
+<!-- <template #icon>-->
+<!-- <icon-delete />-->
+<!-- </template>-->
+<!-- </a-button>-->
+<!-- </a-popconfirm>-->
+<!-- </a-space>-->
<!-- </div>-->
-<!-- </div>-->
-<!-- <add-agent ref="addAgents"></add-agent>-->
-<!-- <!– <div style="position: absolute; bottom: 1rem; right: 1rem;">–>-->
-<!-- <!– <a-space>–>-->
-<!-- <!– </a-space>–>-->
-<!-- <!– </div>–>-->
-<!-- </a-card>-->
-<!-- </div>-->
+ </a-card>
+ </div>
+ </a-scrollbar>
+ <!-- <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>–>-->
+ <!-- </a-card>-->
+ <!-- </div>-->
</a-spin>
</a-col>
</a-row>
@@ -125,38 +199,31 @@
</template>
<script lang="ts" setup>
-import { ref, reactive, nextTick, onBeforeMount, onMounted, onBeforeUnmount } from "vue";
+ import {
+ ref,
+ reactive,
+ nextTick,
+ onBeforeMount,
+ onMounted,
+ onBeforeUnmount,
+ } from 'vue';
import { Message } from '@arco-design/web-vue';
- import { deletedialog, querydialogList } from '@/api/Agent';
+ import { deletedialog, queryCanvasList, 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";
- import logo from "../../../assets/images/model.png";
- import { documentHeight } from "@/utils";
-// console.log(documentHeight,'楂樺害');
+ import AgentConfig from '@/views/dmx/IntelligentAgent/components/agentConfig.vue';
+ import logo from '../../../assets/images/model.png';
+ import { documentHeight, parseTime } from "@/utils";
+ import moment from "moment";
+ // console.log(documentHeight,'楂樺害');
let count = 5;
const activeKey = ref(1);
const addAgents = ref();
const editAgentKuai = ref();
const imgSrc = ref(logo);
- const agentList = ref([
- // {
- // key: 2,
- // title: '鍐呭璐ㄦ',
- // content: 'Content of Tab Panel 2',
- // },
- // {
- // key: 3,
- // title: '寮�閫氭湇鍔�',
- // content: 'Content of Tab Panel 3',
- // },
- // {
- // key: 4,
- // title: '瑙勫垯棰勭疆',
- // content: 'Content of Tab Panel 4',
- // },
- ]);
+ const agentList = ref([]);
+ const agentNewList = ref([]);
const changeTabs = (val) => {
activeKey.value = val;
};
@@ -189,6 +256,25 @@
}
};
+
+ const queryCanvas = async (params = {}) => {
+ setLoading(true);
+ try {
+ const { data } = await queryCanvasList(params);
+ console.log(data, 'agent');
+ agentNewList.value = data.map((item) => {
+ return {
+ ...item,
+ off: true,
+ };
+ });
+ } catch (err) {
+ // you can report use errorHandler or other
+ } finally {
+ setLoading(false);
+ }
+ };
+
const deleteItem = async (row) => {
console.log(row);
let data = await deletedialog({ dialog_ids: [row.id] });
@@ -205,23 +291,18 @@
const handleCancel = () => {
queryList();
};
- const handleSubmit = ({ values, errors }) => {
- this.$refs.formRef.validate().then((res, a, b) => {
- debugger;
- console.log('values', values);
- });
- };
onBeforeMount(() => {
queryList();
+ queryCanvas();
});
- onMounted(()=>{
- EventBus.on('queryList',()=>{
+ onMounted(() => {
+ EventBus.on('queryList', () => {
queryList();
- })
- })
- onBeforeUnmount(()=>{
- EventBus.off('queryList')
- })
+ });
+ });
+ onBeforeUnmount(() => {
+ EventBus.off('queryList');
+ });
</script>
<script lang="ts">
@@ -340,7 +421,7 @@
text-align: center;
}
.arco-card-body-content-down {
- text-align: center;
+ // text-align: center;
margin-top: 10px;
font-size: 12px;
color: #999999;
--
Gitblit v1.8.0