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/model/index.vue |  514 ++++++++++++++++++++++++++++++++++++--------------------
 1 files changed, 330 insertions(+), 184 deletions(-)

diff --git a/src/views/dmx/model/index.vue b/src/views/dmx/model/index.vue
index ac7afd8..1653edb 100644
--- a/src/views/dmx/model/index.vue
+++ b/src/views/dmx/model/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="container">
-    <Breadcrumb :items="['澶фā鍨�', '澶фā鍨嬬鐞�']" />
+    <Breadcrumb :items="['澶фā鍨�', '妯″瀷绠$悊']" />
 
     <a-row :gutter="20" align="stretch">
       <a-col :span="24">
@@ -12,14 +12,14 @@
           <a-row justify="space-between">
             <a-col :span="24" class="table_add_clore" v-if="loading">
               <a-tabs
-                :default-active-key="tabKey"
                 type="line"
+                :default-active-key="tabKey"
+                v-model:activeKey="tabKey"
                 :editable="true"
                 @tab-click="changeTabs"
                 @add="handleAdd"
                 @delete="handleDelete"
                 show-add-button
-                auto-switch
               >
                 <a-tab-pane
                   v-for="(item, index) in tabData"
@@ -27,108 +27,134 @@
                   :title="index"
                   :closable="Object.keys(tabData).length >= 4"
                 >
-                  <div
-                    style="display: flex; flex-wrap: wrap"
-                    class="card_content"
+                  <a-scrollbar
+                    style="height: calc(100vh - 320px); overflow: auto"
                   >
-                    <div class="card-wrap">
-                      <div class="card_wrap_box">
-                        <div class="card_wrap_box_img">
-                          <img
-                            :style="{
-                              width: '100%',
-                            }"
-                            alt="鏆傛棤鍥剧墖"
-                            :src="item.logo"
-                          />
-                        </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> -->
+                    <div class="card_content">
+                      <div class="content_top">
+                        <div class="card_wrap_box">
+                          <!-- <div class="wrap_box_add">
                             <a-button
                               type="primary"
-                              @click="handleEditModel(item, 1)"
+                              @click="handleAddModel"
+                              :disabled="addBtn"
                             >
-                              缂栬緫
+                              <template #icon>
+                                <icon-plus />
+                              </template>
+                              娣诲姞
                             </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"
-                          />
-                          <!--   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>
+                          </div> -->
+                          <div class="box_user_content">
+                            <div class="box_usr_img">
+                              <div class="card_wrap_box_img">
+                                <img
+                                  alt="鏆傛棤鍥剧墖"
+                                  :src="
+                                    item.logo ? httpUrl + item.logo : pdfImg
+                                  "
+                                />
+                              </div>
+                              <div class="arco-content-title">
+                                <div class="title_name"> {{ item.tags }}</div>
 
-                            <!-- <editModel></editModel> -->
-                          </a-space>
+                                <div class="create_time">
+                                  鍒涘缓鏃堕棿锛�
+                                  <span> {{ item.create_date }} </span>
+                                </div>
+                              </div>
+                            </div>
+                            <div class="box_user_btn">
+                              <a-space class="btn-group">
+                                <!-- <editModel></editModel> -->
+                                <a-button
+                                  type="primary"
+                                  @click="handleAddModel"
+                                  :disabled="addBtn"
+                                >
+                                  <template #icon>
+                                    <icon-plus />
+                                  </template>
+                                  娣诲姞
+                                </a-button>
+                                <a-button
+                                  type="outline"
+                                  @click="handleEditModel(item, 1)"
+                                >
+                                  缂栬緫
+                                </a-button>
+                                <a-button
+                                  @click="handleDeleteModel(item, 1)"
+                                  class="btn_delete"
+                                >
+                                  鍒犻櫎
+                                </a-button>
+                              </a-space>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div v-if="item.llm?.length > 0" class="no_data"></div>
+                      <div class="subset_list" v-if="item.llm?.length > 0">
+                        <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"
+                              />
+                            </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">
+                                <div class="create_time_list">
+                                  鍒涘缓鏃堕棿锛�
+                                  <span> {{ list.create_date }} </span>
+                                </div>
+                                <a-button @click="handleDeleteModel(list)">
+                                  鍒犻櫎
+                                </a-button>
+                                <!-- <a-button
+                                type="primary"
+                                @click="handleEditModel(list)"
+                              >
+                                缂栬緫
+                              </a-button> -->
+
+                                <!-- <editModel></editModel> -->
+                              </a-space>
+                            </div>
+                          </div>
                         </div>
                       </div>
                     </div>
-                  </div>
+                  </a-scrollbar>
                 </a-tab-pane>
               </a-tabs>
             </a-col>
             <div> </div>
-            <div class="box_right">
-              <!-- <div class="search_input">
-                <a-input-search
-                  :placeholder="$t('cardList.searchInput.placeholder')"
-                  style="width: 240px"
-                />
-              </div> -->
+            <!-- <div class="box_right" v-if="Object.keys(tabData).length > 0">
               <div>
-                <!-- <addModel></addModel> -->
                 <a-button
                   type="primary"
-                  :loading="loading2"
                   @click="handleAddModel"
+                  :disabled="addBtn"
                 >
                   <template #icon>
                     <icon-plus />
@@ -136,7 +162,7 @@
                   娣诲姞
                 </a-button>
               </div>
-            </div>
+            </div> -->
           </a-row>
         </a-card>
       </a-col>
@@ -155,6 +181,7 @@
     <addTableName
       v-model:tabShow="tabShow"
       :nameList="editList"
+      :title="title"
       @refresh-parent="refreshParentMethod"
       v-if="tabShow"
     ></addTableName>
@@ -171,10 +198,16 @@
     modelmyLlms,
     deleteLlm,
     deleteLlmFactory,
+    getFactoryDetail,
   } from '@/api/model';
   import { Modal, Message } from '@arco-design/web-vue';
+  import { userModelState } from '@/store';
 
+  import pdfImg from '@/assets/images/icon-chart.png';
+
+  const modelStore = userModelState();
   let count = 5;
+  const addBtn = ref(false);
   const activeKey = ref(1);
   const data = ref([
     {
@@ -197,18 +230,20 @@
     key: {
       tags: '娣诲姞key',
       id: 1,
+      live: 1,
     },
   });
 
   const isDeleteDialogVisible = ref(false); //鍒犻櫎鎻愰啋
-  const apiUrl = ref('http://127.0.0.1:5173');
-  // const httpUrl = import.meta.env.VITE_API_BASE_URL;
-  // console.log(apiUrl.value, 777);
+
   const modalList = ref({});
-  const tabKey = ref('key');
-  const changeTabs = (val) => {
+  const tabKey = ref('');
+  const changeTabs = async (val) => {
     tabKey.value = val;
+    await getFactory();
   };
+
+  const httpUrl = modelStore.hrefUrl;
   const show = ref(false);
   const tabShow = ref(false);
   const title = ref('娣诲姞妯″紡');
@@ -216,9 +251,10 @@
   const modelType = ref(1);
   const handleAdd = () => {
     tabShow.value = true;
+    title.value = '娣诲姞妯″瀷';
     editList.value.llm_factory = tabKey.value;
   };
-  const editList = ref({ llm_factory: '' });
+  const editList = ref<any>({ llm_factory: '' });
   //澧炲姞妯″瀷瀛愮被
   const handleAddModel = () => {
     modelType.value = 2;
@@ -229,10 +265,10 @@
   };
   //缂栬緫妯″瀷瀛愮被
   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;
@@ -245,90 +281,134 @@
   };
 
   //鍒犻櫎妯″瀷
-  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,
-        });
+  const handleDeleteModel = (val, type) => {
+    const factory = tabKey.value;
+    if (type == 1) {
+      handleDelete(val);
+    } else {
+      Modal.confirm({
+        title: '璀﹀憡',
+        content: '纭鍒犻櫎鍚�',
+        okText: '纭畾',
+        cancelText: '鍙栨秷',
+        onOk: async () => {
+          const res = await deleteLlm({
+            llm_factory: tabKey.value,
+            llm_name: val.name,
+          });
 
-        if ((res as any).code == 0) {
-          queryModel();
-          tabKey.value = factory;
-        } else {
-        }
-      },
-      onCancel: () => {},
-    });
+          if ((res as any).code == 0) {
+            await queryModel('');
+          } else {
+          }
+        },
+        onCancel: () => {},
+      });
+    }
   };
 
   //鐖剁骇妯″瀷
   const handleDelete = async (key: any) => {
-    console.log(key, 45455);
-    // tabData.value = tabData.value.filter((item) => item.key !== key);
-    if (key !== 'key') {
-      Reflect.deleteProperty(tabData.value, key);
-      await deleteLlmFactory(key);
-      queryModel();
+    if (tabData.value[key] && tabData.value[key].llm.length > 0) {
+      Message.error('璇峰厛鍒犻櫎瀛愭ā鍨�');
+      return;
+    }
+
+    const res = await deleteLlmFactory(tabKey.value);
+    if ((res as any).code == 200) {
+      // Reflect.deleteProperty(tabData.value, tabKey.value);
+
+      await queryModel(null);
+
+      Message.success('鍒犻櫎鎴愬姛');
     }
   };
 
   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) => {
-      if (res) {
-        return;
-      }
-      data.value = data.value.concat({
-        key: count,
-        title: `${form.name}`,
-        content: ``,
-      });
-      visible.value = false;
-      activeKey.value = count;
-    });
-    nextTick(() => {
-      visible.value = true;
-    });
-    return false;
+    // count += 1;
+    // formRef.value?.validate().then((res) => {
+    //   if (res) {
+    //     return;
+    //   }
+    //   data.value = data.value.concat({
+    //     key: count,
+    //     title: `${form.name}`,
+    //     content: ``,
+    //   });
+    //   visible.value = false;
+    //   activeKey.value = count;
+    // });
+    // nextTick(() => {
+    //   visible.value = true;
+    // });
+    // return false;
   };
-  // const handleCancel = () => {
-  //   formRef.value.resetFields();
-  //   visible.value = false;
-  // };
-  // const handleSubmit = ({ values, errors }) => {
-  //   this.$refs.formRef.validate().then((res, a, b) => {
-  //     debugger;
-  //     console.log('values', values);
-  //   });
-  // };
 
   //鑾峰彇妯″瀷鍒楄〃
   const loading = ref(false);
-  const queryModel = async () => {
+  const queryModel = async (name) => {
     const res = await modelmyLlms();
     modalList.value = res.data;
     loading.value = true;
-    tabData.value = Object.assign({}, tabData.value, res.data);
-  };
-  queryModel();
+    // tabData.value = Object.assign({}, tabData.value, res.data);
 
-  const refreshParentMethod = () => {
-    queryModel();
+    await filterObject(res.data, 1, name);
+
+    await getFactory();
+  };
+  queryModel(null);
+  //杩斿洖婊¤冻鏉′欢鐨勫璞�
+  const filterObject = (obj, threshold, name) => {
+    tabData.value = '';
+    tabKey.value = '';
+    const objs = Object.keys(obj)
+      .filter((key) => obj[key].added == 1)
+      .reduce((result, key) => {
+        result[key] = obj[key];
+        return result;
+      }, {});
+
+    tabData.value = objs;
+    if (name) {
+      tabKey.value = name;
+    } else {
+      tabKey.value = Object.keys(tabData.value)[0];
+    }
+    console.log(tabKey.value, 6766);
+  };
+
+  const refreshParentMethod = async (name) => {
+    // console.log(name, 678776);
+
+    await queryModel(name);
+    // tabKey.value = name;
     // 杩欓噷鎵ц闇�瑕佺殑鎿嶄綔
+  };
+
+  const getFactory = async () => {
+    const { data } = await getFactoryDetail({
+      factory_name: tabKey.value,
+    });
+
+    if (data.set_type == 2) {
+      addBtn.value = true;
+    } else {
+      addBtn.value = false;
+    }
+
+    // if (!name) {
+    //   tabKey.value = Object.keys(tabData.value)[0];
+    // } else {
+    //   tabKey.value = name;
+    // }
+    console.log(tabKey.value, 9787);
   };
 </script>
 
@@ -349,6 +429,7 @@
       font-size: 14px;
     }
   }
+
   :deep(.arco-list-col) {
     display: flex;
     flex-direction: row;
@@ -412,6 +493,9 @@
       // border-radius: 0;
       // background-color: #eee;
     }
+    :deep(.arco-tabs-tab-close-btn) {
+      display: none;
+    }
     :deep(.arco-tabs-tab-close-btn .arco-icon) {
       color: #666;
     }
@@ -433,13 +517,91 @@
       font-weight: 400;
     }
   }
+  .content_top {
+    border-radius: 18px;
+    border: 1px solid #eaecf0;
+    background: #e6e7eb;
+    box-shadow: 0 1px 2px #1018280d;
+    .card_wrap_box {
+      padding: 10px 20px;
+
+      .wrap_box_add {
+        // text-align: right;
+      }
+      .card_wrap_box_img {
+        width: 60px;
+        height: 60px;
+        border-radius: 50%;
+
+        img {
+          width: 100%;
+          height: 100%;
+          border-radius: 50%;
+        }
+      }
+      .box_user_content {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        .box_usr_img {
+          display: flex;
+          align-items: center;
+
+          .arco-content-title {
+            line-height: 34px;
+            margin-left: 20px;
+            .title_name {
+              font-size: 16px;
+              color: #333;
+            }
+          }
+        }
+        .box_user_btn {
+          text-align: right;
+          // .btn_delete {
+          //   margin-left: 10px;
+          // }
+        }
+      }
+    }
+  }
+  .content_bottom {
+    margin-top: 20px;
+    .card_content {
+      .card_wrap_box {
+        padding: 20px;
+        .card_wrap_box_img {
+          width: 80px;
+          height: 80px;
+        }
+      }
+    }
+  }
   .card_content {
     .card_wrap_box_img {
-      min-height: 200px;
+      // min-height: 200px;
       height: 200px;
+      width: 100%;
       img {
-        max-height: 190px;
+        width: 100%; /* 鎴栬�呭叾浠栧浐瀹氬搴� */
+        height: 100%; /* 鎴栬�呭叾浠栧浐瀹氶珮搴� */
+        object-fit: cover; /* 涓嶄細鍙樺舰锛屼絾鍙兘瑁佸壀鍥剧墖 */
       }
+    }
+    .subset_list {
+      display: flex;
+      flex-direction: row;
+      flex-wrap: wrap;
+
+      // border-top: 1px solid #f0f0f0;
+    }
+    .no_data {
+      border-top: 1px solid #f0f0f0;
+      height: 30px;
+      line-height: 30px;
+      margin-top: 10px;
+      font-size: 16px;
+      color: #333;
     }
     .card_wrap_box {
       // position: relative;
@@ -447,6 +609,14 @@
         position: absolute;
         right: 10px;
         top: 87%;
+        .create_time {
+          text-align: left;
+          width: 155px;
+        }
+        .create_time_list {
+          text-align: left;
+          width: 223px;
+        }
       }
     }
   }
@@ -454,19 +624,7 @@
   .card-wrap {
     width: 320px;
     height: 350px;
-    margin: 30px;
-    transition: all 0.3s;
-    border: 1px solid var(--color-neutral-3);
-    border-radius: 4px;
-    &:hover {
-      transform: translateY(-4px);
-      // box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.1);
-    }
-  }
-  .card-wrap {
-    width: 320px;
-    height: 350px;
-    margin: 30px;
+    margin: 20px 30px;
     transition: all 0.3s;
     border: 1px solid var(--color-neutral-3);
     border-radius: 4px;
@@ -475,19 +633,7 @@
       transform: translateY(-4px);
       // box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.1);
     }
-  }
-  .card-wrap {
-    width: 320px;
-    height: 350px;
-    margin: 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;

--
Gitblit v1.8.0