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 |  391 ++++++++++++++++++++++++++++++++++++-------------------
 1 files changed, 255 insertions(+), 136 deletions(-)

diff --git a/src/views/dmx/IntelligentAgent/index.vue b/src/views/dmx/IntelligentAgent/index.vue
index 4357e17..3013586 100644
--- a/src/views/dmx/IntelligentAgent/index.vue
+++ b/src/views/dmx/IntelligentAgent/index.vue
@@ -3,155 +3,245 @@
     <Breadcrumb :items="['澶фā鍨�', '鏅鸿兘浣撶鐞�']" />
     <a-row :gutter="20" align="stretch">
       <a-col :span="24">
-        <a-card class="general-card" :title="$t('鏅鸿兘浣撶鐞�')">
+        <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"
               @change="queryList"
             />
-            <agent-config typeAngint="add"></agent-config>
+            <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-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>-->
-                <div
-                  class="card-wrap"
-                  v-for="(item, index) of agentList"
-                  :key="item.id"
+              <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' }"
                 >
-                  <a-card :bordered="false" hoverable>
-                    <a-avatar :style="{ backgroundColor: '#3370ff' }">
-                      <img
-                        :style="{ width: '100%' }"
-                        alt="dessert"
-                        :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>
-                    <div class="arco-card-body-content">
-                      <div class="arco-card-body-content-top">
-                        <span style="font-size: 18px; font-weight: 900">
-                          {{ item.name }}
+<!--                  鏅鸿兘浣撳垪琛�-->
+                  <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>
+                      <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="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">
-                        {{ item.prompt_config.prologue }}
+                      <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">
-                        <!--                      {{ 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>
+                    </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>
-                        <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>
-              </div>
+                      </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, 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, 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 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 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 editAgentKuai = ref(null);
+  const imgSrc = ref(logo);
+  const agentList = ref([]);
+  const agentNewList = ref([]);
   const changeTabs = (val) => {
     activeKey.value = val;
   };
@@ -161,10 +251,25 @@
 
   const visible = ref(false);
   const formRef = ref(null);
-  const form = reactive({
-    // size: 'medium',
-    // name: '',
-  });
+  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);
@@ -172,6 +277,25 @@
       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,
@@ -200,23 +324,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">
@@ -335,7 +454,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