From c02bff2911f720d54388f4abb6456ec1777f8a96 Mon Sep 17 00:00:00 2001
From: zhangxiao <898441624@qq.com>
Date: 星期五, 30 八月 2024 10:40:02 +0800
Subject: [PATCH] fix: 修改bug

---
 src/views/dmx/IntelligentAgent/index.vue |  432 ++++++++++++++++++++++++++++++++++++++---------------
 1 files changed, 305 insertions(+), 127 deletions(-)

diff --git a/src/views/dmx/IntelligentAgent/index.vue b/src/views/dmx/IntelligentAgent/index.vue
index 4f23e22..3013586 100644
--- a/src/views/dmx/IntelligentAgent/index.vue
+++ b/src/views/dmx/IntelligentAgent/index.vue
@@ -3,161 +3,339 @@
     <Breadcrumb :items="['澶фā鍨�', '鏅鸿兘浣撶鐞�']" />
     <a-row :gutter="20" align="stretch">
       <a-col :span="24">
-        <a-card class="general-card" :title="$t('鏅鸿兘浣撶鐞�')">
-          <div style="display: flex;justify-content: right;">
+        <a-card class="general-card" :title="$t('')" style="padding-top: 50px">
+          <div style="display: flex; justify-content: right">
             <a-input-search
               :placeholder="$t('cardList.searchInput.placeholder')"
-              style="width: 240px;"
+              style="width: 240px"
+              @change="queryList"
             />
+            <a-button
+              type="primary"
+              @click="handleClick"
+              style="margin-left: 10px"
+            >
+              <template #icon>
+                <icon-plus />
+              </template>
+              鏂板缓鏅鸿兘浣�
+            </a-button>
           </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-spin :loading="loading" style="width: 100%">
+                <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"
+                    :key="item.id"
+                  >
+                    <a-card :bordered="false" hoverable>
+                      <a-avatar :style="{ backgroundColor: '#5b99da' }">
+                        <img
+                          :style="{ width: '100%' }"
+                          alt="dessert"
+                          :src="item.icon || imgSrc"
+                        />
                       </a-avatar>
-                    </div>
-                    <div class="arco-card-body-content">
-                      <div style="text-align: center;margin-top: 10px">
-                        鏂板缓鏅鸿兘浣�
+                      <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">
+                            {{ item.name }}
+                          </span>
+                        </div>
+                        <div class="arco-card-body-content-down">
+                          {{ item.prompt_config.prologue }}
+                        </div>
                       </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 data" :key="index">
-                  <a-card :bordered="false" hoverable >
-                    <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>
-                    <a-switch style="position: absolute;top: 10px;right: 10px" size="medium">
-                      <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 }}
+                      <div
+                        style="position: absolute; bottom: 1.4rem; left: 1rem"
+                      >
+                        <icon-user />
+                        <span style="font-size: 12px">
+                          <!--                      {{ item.name }}-->
                         </span>
                       </div>
-                      <div class="arco-card-body-content-down">
-                        閫氳繃鎻忚堪瑙掕壊鍜屼换鍔℃潵鍒涘缓浣犵殑鏅鸿兘浣�
-                        鏅鸿兘浣撳彲浠ヨ皟鐢ㄥ涓伐浣滄祦鍜屽伐鍏�
+                      <div
+                        style="position: absolute; bottom: 1rem; right: 1rem"
+                      >
+                        <a-space>
+                          <span v-show="!item.off">
+                              <a-button
+                                type="text"
+                                size="small"
+                                @click="editClick(item)"
+                              >
+                              <template #icon>
+                                <icon-tool />
+                              </template>
+                            </a-button>
+                          </span>
+                          <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>
-                    <div style="position: absolute; bottom: 1.4rem; left: 1rem;">
-                      <icon-user /> <span style="font-size: 12px">鐜嬫旦</span>
-                    </div>
-                    <div style="position: absolute; bottom: 1rem; right: 1rem;">
-                      <a-space>
-<!--                        <editAgent typeAngint="edit"></editAgent>-->
-                        <a-popconfirm :content="'纭畾鍒犻櫎鍚�'" type="warning" @ok="deleteItem(record)">
-                          <a-button  type="text" size="small">
-                            <template #icon>
-                              <icon-delete />
-                            </template>
-                          </a-button>
-                        </a-popconfirm>
-                      </a-space>
-                    </div>
-                  </a-card>
-                </div>
-              </div>
+                    </a-card>
+                  </div>
+<!--                  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)"-->
+<!--                      >-->
+<!--                        <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>-->
+                    </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>-->
+                <!--                    &lt;!&ndash;                    <div style="position: absolute; bottom: 1rem; right: 1rem;">&ndash;&gt;-->
+                <!--                    &lt;!&ndash;                      <a-space>&ndash;&gt;-->
+                <!--                    &lt;!&ndash;                      </a-space>&ndash;&gt;-->
+                <!--                    &lt;!&ndash;                    </div>&ndash;&gt;-->
+                <!--                  </a-card>-->
+                <!--                </div>-->
+              </a-spin>
             </a-col>
           </a-row>
         </a-card>
       </a-col>
     </a-row>
+    <agent-config
+      ref="editAgentKuai"
+      :typeAngint="addType"
+      :formData="itemObj"
+      @queryList="queryList"
+    ></agent-config>
   </div>
 </template>
 
 <script lang="ts" setup>
-  import { ref, reactive, nextTick } from 'vue';
-  import addAgent from "@/views/dmx/IntelligentAgent/components/addAgent.vue";
-  import editAgent from "@/views/dmx/IntelligentAgent/components/editAgent.vue";
-  import { kbdocumentrm } from "@/api/kbList";
-  import { Message } from "@arco-design/web-vue";
-
+  import {
+    ref,
+    reactive,
+    nextTick,
+    onBeforeMount,
+    onMounted,
+    onBeforeUnmount,
+  } from 'vue';
+  import { Message } from '@arco-design/web-vue';
+  import { deletedialog, queryCanvasList, querydialogdetail, 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, parseTime } from "@/utils";
+  import moment from "moment";
+  // console.log(documentHeight,'楂樺害');
   let count = 5;
   const activeKey = ref(1);
   const addAgents = ref();
-  const data = 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 changeTabs = (val) => {
-  activeKey.value = val;
-}
+  const editAgentKuai = ref(null);
+  const imgSrc = ref(logo);
+  const agentList = ref([]);
+  const agentNewList = ref([]);
+  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);
   const formRef = ref(null);
-  const form = reactive({
-    size: 'medium',
-    name: '',
-  });
-  const   deleteItem =  async (row)=>{
-    console.log(row);
-    let data = await kbdocumentrm({doc_id: row.id})
-    if(data.code == 0){
-      Message.success('鍒犻櫎鎴愬姛');
-      console.log(kbobj, 'kbobj');
-      fetchData({
-        kb_id: kbobj.id,
-        page: 1,
-        page_size: 20
-      })
+  let addType = ref('add');
+  let itemObj = reactive({});
+  const form = reactive({});
+
+
+  const handleClick = () => {
+    addType.value = 'add';
+    editAgentKuai.value.handleClick();
+  };
+
+  const editClick = async(data) => {
+    let res = await querydialogdetail({
+      dialog_id: data.id
+    })
+    Object.assign(itemObj, res.data);
+    addType.value = 'edit';
+    editAgentKuai.value.editClick();
+  };
+
+
+  const queryList = async (params = {}) => {
+    setLoading(true);
+    try {
+      const { data } = await querydialogList(params);
+      console.log(data, 'data');
+      agentList.value = data.map((item) => {
+        return {
+          ...item,
+          off: true,
+        };
+      });
+    } catch (err) {
+      // you can report use errorHandler or other
+    } finally {
+      setLoading(false);
     }
-  }
+  };
+
+
+  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] });
+    if (data.code == 0) {
+      Message.success('鍒犻櫎鎴愬姛');
+      queryList();
+    }
+  };
+  const handleChange = async (item) => {
+    if (item) {
+      Object.assign(form, item);
+    }
+  };
   const handleCancel = () => {
-    formRef.value.resetFields();
-    visible.value = false;
+    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', () => {
+      queryList();
     });
-  };
+  });
+  onBeforeUnmount(() => {
+    EventBus.off('queryList');
+  });
 </script>
 
 <script lang="ts">
@@ -210,9 +388,9 @@
     }
   }
   .card-wrap {
-    width: 20%;
+    width: 23%;
     height: 200px;
-    margin: 10px;
+    margin: 1%;
     transition: all 0.3s;
     border: 1px solid var(--color-neutral-3);
     border-radius: 4px;
@@ -270,13 +448,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