From a53981aea70d2247120954a96f9f462c6bad936b Mon Sep 17 00:00:00 2001
From: liudong <liudong>
Date: 星期一, 12 八月 2024 16:52:54 +0800
Subject: [PATCH] 修改智能体的bug问题
---
src/views/dmx/model/index.vue | 485 ++++++++++++++++++++++++++++++++++++++++++++---------
1 files changed, 396 insertions(+), 89 deletions(-)
diff --git a/src/views/dmx/model/index.vue b/src/views/dmx/model/index.vue
index 447cf0e..bf2602d 100644
--- a/src/views/dmx/model/index.vue
+++ b/src/views/dmx/model/index.vue
@@ -1,138 +1,306 @@
<template>
<div class="container">
- <Breadcrumb :items="['澶фā鍨�', '澶фā鍨嬬鐞�']" />
+ <Breadcrumb :items="['澶фā鍨�', '妯″瀷绠＄悊']" />
+
<a-row :gutter="20" align="stretch">
<a-col :span="24">
- <a-card class="general-card" :title="$t('澶фā鍨嬬鐞�')">
+ <a-card
+ class="general-card"
+ style="min-height: 130px"
+ :title="$t('澶фā鍨嬬鐞�')"
+ >
<a-row justify="space-between">
- <a-col :span="24">
+ <a-col :span="24" class="table_add_clore" v-if="loading">
<a-tabs
- :active-key="activeKey"
+ :default-active-key="tabKey"
type="line"
:editable="true"
- show-add-button
@tab-click="changeTabs"
@add="handleAdd"
@delete="handleDelete"
+ show-add-button
+ auto-switch
>
- <!-- <a-tab-pane key="1" :title="$t('cardList.tab.title.all')">-->
- <!-- <QualityInspection />-->
- <!-- <TheService />-->
- <!-- <RulesPreset />-->
- <!-- </a-tab-pane>-->
- <!-- <a-tab-pane key="2" :title="$t('cardList.tab.title.content')">-->
- <!-- <QualityInspection />-->
- <!-- </a-tab-pane>-->
- <!-- <a-tab-pane key="3" :title="$t('cardList.tab.title.service')">-->
- <!-- <TheService />-->
- <!-- </a-tab-pane>-->
- <!-- <a-tab-pane key="4" :title="$t('cardList.tab.title.preset')">-->
- <!-- <RulesPreset />-->
- <!-- </a-tab-pane>-->
-
<a-tab-pane
- v-for="(item, index) of data"
- :key="item.key"
- :title="item.title"
- :closable="index >= 4"
+ v-for="(item, index) in tabData"
+ :key="index"
+ :title="index"
+ :closable="Object.keys(tabData).length >= 4"
>
- <QualityInspection v-if="activeKey === 1" />
- <TheService v-if="activeKey === 1" />
- <RulesPreset v-if="activeKey === 1" />
+ <a-scrollbar
+ style="height: calc(100vh - 320px); overflow: auto"
+ >
+ <div
+ style="display: flex; flex-wrap: wrap"
+ class="card_content"
+ >
+ <div class="card-wrap">
+ <div class="card_wrap_box">
+ <div class="card_wrap_box_img">
+ <img
+ :style="{
+ width: '100%',
+ }"
+ alt="鏆傛棤鍥剧墖"
+ :src="item.logo ? httpUrl + item.logo : pdfImg"
+ />
+ </div>
+ <a-card :bordered="false" hoverable>
+ <div class="arco-card-body-content">
+ <div
+ class="arco-card-body-content-title"
+ style="word-wrap: break-word"
+ >
+ {{ item.tags }}
+ </div>
+ <!-- <div class="arco-card-body-content-dec">{{
+ list.type
+ }}</div> -->
+ </div>
+ </a-card>
+ <div class="arco-btn-group">
+ <a-space class="btn-group">
+ <!-- <editModel></editModel> -->
+ <a-button
+ type="primary"
+ @click="handleEditModel(item, 1)"
+ >
+ 缂栬緫
+ </a-button>
+ </a-space>
+ </div>
+ </div>
+ </div>
+ <div
+ class="card-wrap"
+ v-for="(list, index) of item.llm"
+ :key="index"
+ >
+ <div class="card_wrap_box">
+ <div class="card_wrap_box_img">
+ <img
+ :style="{
+ width: '100%',
+ }"
+ alt="鏆傛棤鍥剧墖"
+ :src="list.logo ? httpUrl + list.logo : pdfImg"
+ />
+ <!-- src="https://p1-arco.byteimg.com/tos-cn-i-uwbnlip3yd/a20012a2d4d5b9db43dfc6a01fe508c0.png~tplv-uwbnlip3yd-webp.webp" -->
+ </div>
+ <a-card :bordered="false" hoverable>
+ <div class="arco-card-body-content">
+ <div class="arco-card-body-content-title">
+ {{ list.name }}
+ </div>
+ <div class="arco-card-body-content-dec">{{
+ list.type
+ }}</div>
+ </div>
+ </a-card>
+ <div class="arco-btn-group">
+ <a-space class="btn-group">
+ <a-button @click="handleDeleteModel(list)">
+ 鍒犻櫎
+ </a-button>
+ <a-button
+ type="primary"
+ @click="handleEditModel(list)"
+ >
+ 缂栬緫
+ </a-button>
- <QualityInspection v-if="activeKey === 2" />
-
- <TheService v-if="activeKey === 3" />
- <RulesPreset v-if="activeKey === 4" />
- <CustomSettings v-if="activeKey > 4" />
+ <!-- <editModel></editModel> -->
+ </a-space>
+ </div>
+ </div>
+ </div>
+ </div>
+ </a-scrollbar>
</a-tab-pane>
</a-tabs>
</a-col>
<div> </div>
- <a-input-search
- :placeholder="$t('cardList.searchInput.placeholder')"
- style="width: 240px; position: absolute; top: 60px; right: 20px"
- />
+ <div class="box_right">
+ <!-- <div class="search_input">
+ <a-input-search
+ :placeholder="$t('cardList.searchInput.placeholder')"
+ style="width: 240px"
+ />
+ </div> -->
+ <div>
+ <!-- <addModel></addModel> -->
+ <a-button type="primary" @click="handleAddModel">
+ <template #icon>
+ <icon-plus />
+ </template>
+ 娣诲姞
+ </a-button>
+ </div>
+ </div>
</a-row>
</a-card>
</a-col>
</a-row>
-
- <a-modal v-model:visible="visible" @Ok="handleOk" @cancel="handleCancel">
- <template #title> 娣诲姞妗嗘灦 </template>
- <a-form
- ref="formRef"
- :size="form.size"
- :model="form"
- @submit="handleSubmit"
- >
- <a-form-item
- field="name"
- label="鏍囩鍚�"
- :rules="[
- { required: true, message: '涓嶈兘涓虹┖' },
- { minLength: 1, message: '鑷冲皯涓�涓瓧绗�' },
- ]"
- :validate-trigger="['change', 'input']"
- >
- <a-input v-model="form.name" placeholder="璇疯緭鍏ユ爣绛惧悕" />
- </a-form-item>
- </a-form>
- </a-modal>
+ <!-- 娣诲姞妯″瀷 -->
+ <addPageModel
+ v-model:show="show"
+ :task_id="task_id"
+ :type="modelType"
+ :title="title"
+ :editList="editList"
+ @refresh-parent="refreshParentMethod"
+ v-if="show"
+ ></addPageModel>
+ <!-- 娣诲姞tab妯″紡 -->
+ <addTableName
+ v-model:tabShow="tabShow"
+ :nameList="editList"
+ :title="title"
+ @refresh-parent="refreshParentMethod"
+ v-if="tabShow"
+ ></addTableName>
</div>
</template>
<script lang="ts" setup>
import { ref, reactive, nextTick } from 'vue';
+ import editModel from '@/views/dmx/model/components/editModel.vue';
+ import addPageModel from './components/addPageModel.vue';
+ import addTableName from './components/addTableName.vue';
+ import {
+ modelList,
+ modelmyLlms,
+ deleteLlm,
+ deleteLlmFactory,
+ } from '@/api/model';
+ import { Modal, Message } from '@arco-design/web-vue';
+ import { userModelState } from '@/store';
- import QualityInspection from './components/quality-inspection.vue';
- import TheService from './components/the-service.vue';
- import RulesPreset from './components/rules-preset.vue';
- import CustomSettings from './components/custom-settings.vue';
+ import pdfImg from '@/assets/images/icon-chart.png';
+ const modelStore = userModelState();
let count = 5;
const activeKey = ref(1);
const data = ref([
{
key: 1,
- title: '鍏ㄩ儴',
+ title: 'key',
content: 'Content of Tab Panel 1',
},
{
key: 2,
- title: '鍐呭璐ㄦ',
+ title: 'Ollama',
content: 'Content of Tab Panel 2',
},
{
key: 3,
- title: '寮�閫氭湇鍔�',
+ title: 'Xinference',
content: 'Content of Tab Panel 3',
},
- {
- key: 4,
- title: '瑙勫垯棰勭疆',
- content: 'Content of Tab Panel 4',
- },
]);
-const changeTabs = (val) => {
- activeKey.value = val;
-}
- const handleAdd = () => {
- visible.value = true;
+ const tabData = ref({
+ key: {
+ tags: '娣诲姞key',
+ id: 1,
+ },
+ });
+
+ const isDeleteDialogVisible = ref(false); //鍒犻櫎鎻愰啋
+
+ const modalList = ref({});
+ const tabKey = ref('key');
+ const changeTabs = (val) => {
+ tabKey.value = val;
};
- const handleDelete = (key: any) => {
- data.value = data.value.filter((item) => item.key !== key);
+
+ const httpUrl = modelStore.hrefUrl;
+ const show = ref(false);
+ const tabShow = ref(false);
+ const title = ref('娣诲姞妯″紡');
+ const task_id = ref(1);
+ const modelType = ref(1);
+ const handleAdd = () => {
+ tabShow.value = true;
+ title.value = '娣诲姞妯″瀷';
+ editList.value.llm_factory = tabKey.value;
+ };
+ const editList = ref<any>({ llm_factory: '' });
+ //澧炲姞妯″瀷瀛愮被
+ const handleAddModel = () => {
+ modelType.value = 2;
+ editList.value = [{ llm_factory: '' }];
+ editList.value.llm_factory = tabKey.value;
+ show.value = true;
+ title.value = '娣诲姞妯″紡';
+ };
+ //缂栬緫妯″瀷瀛愮被
+ const handleEditModel = (val, type) => {
+ console.log(val, 6766);
+ if (type == 1) {
+ tabShow.value = true;
+ editList.value = val;
+ title.value = '缂栬緫妯″瀷';
+ editList.value.llm_factory = tabKey.value;
+ } else {
+ modelType.value = 2;
+ task_id.value = val.id;
+ show.value = true;
+ title.value = '缂栬緫';
+ editList.value = val;
+ editList.value.llm_factory = tabKey.value;
+ }
+ };
+
+ //鍒犻櫎妯″瀷
+ const handleDeleteModel = (val) => {
+ Modal.confirm({
+ title: '璀﹀憡',
+ content: '纭鍒犻櫎鍚�',
+ okText: '纭畾',
+ cancelText: '鍙栨秷',
+ onOk: async () => {
+ const factory = tabKey.value;
+ const res = await deleteLlm({
+ llm_factory: tabKey.value,
+ llm_name: val.name,
+ });
+
+ if ((res as any).code == 0) {
+ queryModel();
+ tabKey.value = factory;
+ } else {
+ }
+ },
+ onCancel: () => {},
+ });
+ };
+
+ //鐖剁骇妯″瀷
+ const handleDelete = async (key: any) => {
+ console.log(tabData.value[key]);
+ if (tabData.value[key].llm.length > 0) {
+ Message.error('璇峰厛鍒犻櫎瀛愭ā鍨�');
+ return;
+ }
+ if (key !== 'key') {
+ const res = await deleteLlmFactory(key);
+ if ((res as any).code == 200) {
+ Reflect.deleteProperty(tabData.value, key);
+ queryModel();
+ }
+ }
};
const visible = ref(false);
- const formRef = ref(null);
+ const formRef = ref();
+
const form = reactive({
size: 'medium',
name: '',
});
const handleOk = () => {
count += 1;
- formRef.value.validate().then((res) => {
+ formRef.value?.validate().then((res) => {
if (res) {
return;
}
@@ -146,19 +314,23 @@
});
nextTick(() => {
visible.value = true;
-
- })
+ });
return false;
};
- const handleCancel = () => {
- formRef.value.resetFields();
- visible.value = false;
+
+ //鑾峰彇妯″瀷鍒楄〃
+ const loading = ref(false);
+ const queryModel = async () => {
+ const res = await modelmyLlms();
+ modalList.value = res.data;
+ loading.value = true;
+ tabData.value = Object.assign({}, tabData.value, res.data);
};
- const handleSubmit = ({ values, errors }) => {
- this.$refs.formRef.validate().then((res, a, b) => {
- debugger;
- console.log('values', values);
- });
+ queryModel();
+
+ const refreshParentMethod = () => {
+ queryModel();
+ // 杩欓噷鎵ц闇�瑕佺殑鎿嶄綔
};
</script>
@@ -179,6 +351,7 @@
font-size: 14px;
}
}
+
:deep(.arco-list-col) {
display: flex;
flex-direction: row;
@@ -211,4 +384,138 @@
}
}
}
+ :deep(.arco-tabs-nav-tab) {
+ flex: none;
+ width: 60%;
+ }
+ .table_add_clore {
+ :deep(.arco-tabs-nav-add-btn .arco-icon-hover::before) {
+ top: 50%;
+ left: 50%;
+ width: 20px;
+ height: 20px;
+ transform: translate(-50%, -50%);
+ border-radius: 0;
+ background-color: #165dff;
+ }
+
+ :deep(.arco-tabs-nav-add-btn .arco-icon-hover .arco-icon) {
+ color: #fff;
+ }
+ // :deep(.arco-tabs-nav) {
+ // max-width: 60%;
+ // }
+
+ :deep(.arco-icon-hover::before) {
+ top: 50%;
+ left: 50%;
+ width: 20px;
+ height: 20px;
+ transform: translate(-50%, -50%);
+ // border-radius: 0;
+ // background-color: #eee;
+ }
+ :deep(.arco-tabs-tab-close-btn .arco-icon) {
+ color: #666;
+ }
+ }
+ .box_right {
+ position: absolute;
+ top: 60px;
+ right: 20px;
+ display: flex;
+ .search_input {
+ margin-right: 10px;
+ }
+ }
+ .arco-card-body-content {
+ .arco-card-body-content-title {
+ font-size: 16px;
+ color: #333;
+ margin-bottom: 10px;
+ font-weight: 400;
+ }
+ }
+ .card_content {
+ .card_wrap_box_img {
+ // min-height: 200px;
+ height: 200px;
+ width: 100%;
+ img {
+ width: 100%; /* 鎴栬�呭叾浠栧浐瀹氬搴� */
+ height: 100%; /* 鎴栬�呭叾浠栧浐瀹氶珮搴� */
+ object-fit: cover; /* 涓嶄細鍙樺舰锛屼絾鍙兘瑁佸壀鍥剧墖 */
+ }
+ }
+ .card_wrap_box {
+ // position: relative;
+ .arco-btn-group {
+ position: absolute;
+ right: 10px;
+ top: 87%;
+ }
+ }
+ }
+
+ .card-wrap {
+ width: 320px;
+ height: 350px;
+ margin: 20px 30px;
+ transition: all 0.3s;
+ border: 1px solid var(--color-neutral-3);
+ border-radius: 4px;
+ position: relative;
+ &:hover {
+ transform: translateY(-4px);
+ // box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.1);
+ }
+ :deep(.arco-card) {
+ height: 100%;
+ border-radius: 4px;
+ .arco-card-body {
+ height: 100%;
+ .arco-space {
+ width: 100%;
+ height: 100%;
+ .arco-space-item {
+ height: 100%;
+ &:last-child {
+ flex: 1;
+ }
+ .arco-card-meta {
+ height: 100%;
+ display: flex;
+ flex-flow: column;
+ .arco-card-meta-content {
+ flex: 1;
+ .arco-card-meta-description {
+ margin-top: 8px;
+ color: rgb(var(--gray-6));
+ line-height: 20px;
+ font-size: 12px;
+ }
+ }
+ .arco-card-meta-footer {
+ margin-top: 0;
+ }
+ }
+ }
+ }
+ }
+ }
+ :deep(.arco-card-meta-title) {
+ display: flex;
+ align-items: center;
+
+ // To prevent the shaking
+ line-height: 28px;
+ }
+ :deep(.arco-skeleton-line) {
+ &:last-child {
+ display: flex;
+ justify-content: flex-end;
+ margin-top: 20px;
+ }
+ }
+ }
</style>
--
Gitblit v1.8.0