From 08b7dfc450498927da691c482a0b45467cd93e69 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BB=98=E6=B0=91=E5=BA=B7?= <m18571841023@163.com>
Date: Wed, 19 Mar 2025 21:47:34 +0800
Subject: [PATCH] =?UTF-8?q?SBOM=E6=8E=A5=E5=8F=A3=E5=AF=B9=E6=8E=A5?=
 =?UTF-8?q?=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/jyh/index.ts                  |   8 +-
 src/views/Jyh/Version/Detail/SBOM.vue | 101 ++++++++++++++++++--------
 2 files changed, 73 insertions(+), 36 deletions(-)

diff --git a/src/api/jyh/index.ts b/src/api/jyh/index.ts
index 91d5d4a..17a2f74 100644
--- a/src/api/jyh/index.ts
+++ b/src/api/jyh/index.ts
@@ -144,16 +144,12 @@ export const getVulnList = (data): Promise<any> => {
 };
 
 // 获取SBOM依赖树
-export const dependencyTree = (softwareId: any): Promise<any> => {
+export const dependencyTree = (data: any): Promise<any> => {
   return reqCatchV2(() =>
     request({
       url: `/api/v1/repo/dependency/tree`,
       method: 'POST',
-      data: {
-        softwareId,
-        current: 1,
-        size: 99999
-      }
+      data
     })
   );
 };
diff --git a/src/views/Jyh/Version/Detail/SBOM.vue b/src/views/Jyh/Version/Detail/SBOM.vue
index 98aff54..5105c4a 100644
--- a/src/views/Jyh/Version/Detail/SBOM.vue
+++ b/src/views/Jyh/Version/Detail/SBOM.vue
@@ -5,28 +5,28 @@
   </div>
   <Card simple class="jyh-card mt-3">
     <div class="clear-padding">
-      <d-table class="jyh-table" v-if="baseTreeTableData1.length>0"  :indent="32" @check-change="treeCheckChange" :data="baseTreeTableData1" row-key="id">
-        <d-column field="firstName" header="组织名称" show-overflow-tooltip>
+      <d-table class="jyh-table" v-if="tableData.length>0"  :indent="32" @check-change="treeCheckChange" :data="tableData" row-key="id">
+        <d-column field="licenseName" header="组织名称" show-overflow-tooltip>
           <template #default="scope">
-            <a class="devui-link" @click="showDetail = true">{{ scope.row.firstName }}</a>
+            <a class="devui-link" @click="showDetail = true">{{ scope.row.licenseName }}</a>
           </template>
         </d-column>
-        <d-column field="lastName" header="版本"></d-column>
+        <d-column field="latestVersion" header="版本"></d-column>
       </d-table>
       <NoData v-else :small="false"></NoData>
     </div>
   </Card>
   <d-drawer v-model="showDetail" style="width: 800px; padding: 20px">
-    <SBOMDetail @close="showDetail = false" />
+    <SBOMDetail :selectRow="selectRow" @close="showDetail = false" />
   </d-drawer>
 </template>
 <script setup lang="ts">
-import { ref, reactive, onMounted } from 'vue';
+import { ref, reactive, onMounted, defineProps } from 'vue';
 import SBOMDetail from './SBOMDetail.vue';
 import NoData from '@/components/NoData/NoData.vue';
-import { dependencyTree } from '@/api/jyh';
+import { dependencyTree, getVulnList } from '@/api/jyh';
 import { useRoute } from 'vue-router';
-
+const propsData = defineProps(['versionId']);
 const checked = ref(false);
 const route = useRoute(); // 获取路由对象
 const showDetail = ref(false);
@@ -34,23 +34,23 @@ const showDetail = ref(false);
 const baseTreeTableData1 = ref([
   {
     id: '1',
-    firstName: 'openssl',
-    lastName: 'N.A.',
-    children: [
+    licenseName: 'openssl',
+    latestVersion: 'N.A.',
+    components: [
       {
         id: '2',
-        firstName: 'ssl',
-        lastName: 'N.A.',
-        children: [
+        licenseName: 'ssl',
+        latestVersion: 'N.A.',
+        components: [
           {
             id: '3',
-            firstName: 'ssl',
-            lastName: 'N.A.'
+            licenseName: 'ssl',
+            latestVersion: 'N.A.'
           },
           {
             id: '4',
-            firstName: 'crypto',
-            lastName: 'N.A.'
+            licenseName: 'crypto',
+            latestVersion: 'N.A.'
           }
         ]
       }
@@ -58,23 +58,23 @@ const baseTreeTableData1 = ref([
   },
   {
     id: '5',
-    firstName: 'Text-Template-1.56',
-    lastName: 'N.A.',
+    licenseName: 'Text-Template-1.56',
+    latestVersion: 'N.A.',
     children: [
       {
         id: '6',
-        firstName: 'ssl',
-        lastName: 'N.A.',
+        licenseName: 'ssl',
+        latestVersion: 'N.A.',
         children: [
           {
             id: '7',
-            firstName: 'ssl',
-            lastName: 'N.A.'
+            licenseName: 'ssl',
+            latestVersion: 'N.A.'
           },
           {
             id: '8',
-            firstName: 'crypto',
-            lastName: 'N.A.'
+            licenseName: 'crypto',
+            latestVersion: 'N.A.'
           }
         ]
       }
@@ -82,17 +82,58 @@ const baseTreeTableData1 = ref([
   },
   {
     id: '9',
-    firstName: 'Text-Template-1.56',
-    lastName: 'N.A.'
+    licenseName: 'Text-Template-1.56',
+    latestVersion: 'N.A.'
   }
 ]);
 
+const tableData = ref([]);
+
+const renameComponentsToChildren = (obj) => {
+  // 如果传入的不是对象，直接返回
+  if (typeof obj !== 'object' || obj === null) {
+    return obj;
+  }
+
+  // 如果对象有 `components` 属性，将其改为 `children`
+  if (obj.hasOwnProperty('components')) {
+    obj.children = obj.components; // 将 components 改为 children
+    delete obj.components; // 删除原来的 components 属性
+  }
+
+  // 递归处理对象的子元素
+  for (let key in obj) {
+    if (obj.hasOwnProperty(key)) {
+      obj[key] = renameComponentsToChildren(obj[key]); // 递归处理子对象
+    }
+  }
+
+  return obj;
+}
+
 const treeCheckChange = (val, row, selection) => {
   console.log('treeCheckChange', selection);
 };
 
-onMounted(async () => {
-  await dependencyTree(Number(route.params.versionId));
+const fetchDependencyTree = async () => {
+  const { data } = await dependencyTree({
+    // softwareId: 47,
+    softwareId: propsData.versionId,
+    componentId: '',
+    current: 1,
+    size: 10
+  });
+  if(data.data.code===200 &&data?.data?.data &&data?.data?.data.total>0) {
+    tableData.value = [renameComponentsToChildren(data?.data?.data)] || [];
+    // pager.value.total = data?.data?.data?.total || [];
+  } else {
+    // tableData.value = baseTreeTableData1.value
+  }
+}
+
+
+onMounted( () => {
+  fetchDependencyTree()
 });
 </script>