SBOM显示修复

2025-03-21 02:21:14 +08:00
parent 75ca45ac35
commit adf790ea15
2 changed files with 38 additions and 82 deletions
--- a/src/views/Jyh/Version/Detail/SBOM.vue
+++ b/src/views/Jyh/Version/Detail/SBOM.vue
@@ -6,9 +6,9 @@
  <Card simple class="jyh-card mt-3">
    <div class="clear-padding">
      <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>
+        <d-column field="libraryName" header="组织名称" show-overflow-tooltip>
          <template #default="scope">
-            <a class="devui-link" @click="showDetail = true">{{ scope.row.licenseName }}</a>
+            <a class="devui-link" @click="setSelectRow(scope.row)">{{ scope.row.libraryName }}</a>
          </template>
        </d-column>
        <d-column field="latestVersion" header="版本"></d-column>
@@ -30,65 +30,15 @@ const propsData = defineProps(['versionId']);
 const checked = ref(false);
 const route = useRoute(); // 获取路由对象
 const showDetail = ref(false);
-
-const baseTreeTableData1 = ref([
-  {
-    id: '1',
-    licenseName: 'openssl',
-    latestVersion: 'N.A.',
-    components: [
-      {
-        id: '2',
-        licenseName: 'ssl',
-        latestVersion: 'N.A.',
-        components: [
-          {
-            id: '3',
-            licenseName: 'ssl',
-            latestVersion: 'N.A.'
-          },
-          {
-            id: '4',
-            licenseName: 'crypto',
-            latestVersion: 'N.A.'
-          }
-        ]
-      }
-    ]
-  },
-  {
-    id: '5',
-    licenseName: 'Text-Template-1.56',
-    latestVersion: 'N.A.',
-    children: [
-      {
-        id: '6',
-        licenseName: 'ssl',
-        latestVersion: 'N.A.',
-        children: [
-          {
-            id: '7',
-            licenseName: 'ssl',
-            latestVersion: 'N.A.'
-          },
-          {
-            id: '8',
-            licenseName: 'crypto',
-            latestVersion: 'N.A.'
-          }
-        ]
-      }
-    ]
-  },
-  {
-    id: '9',
-    licenseName: 'Text-Template-1.56',
-    latestVersion: 'N.A.'
-  }
-]);
+const selectRow = ref({});

 const tableData = ref([]);

+const setSelectRow = (row) => {
+  selectRow.value = row;
+  showDetail.value = true;
+}
+
 const renameComponentsToChildren = (obj) => {
  // 如果传入的不是对象，直接返回
  if (typeof obj !== 'object' || obj === null) {
@@ -96,9 +46,11 @@ const renameComponentsToChildren = (obj) => {
  }

  // 如果对象有 `components` 属性，将其改为 `children`
-  if (obj.hasOwnProperty('components')) {
-    obj.children = obj.components; // 将 components 改为 children
-    delete obj.components; // 删除原来的 components 属性
+  if (obj.hasOwnProperty('component')) {
+    obj.id = obj.component.id; // 将 components 改为 children
+    obj.libraryName = obj.component.libraryName; // 将 components 改为 children
+    obj.latestVersion = obj.component.latestVersion; // 将 components 改为 children
+    // delete obj.components; // 删除原来的 components 属性
  }

  // 递归处理对象的子元素
@@ -123,8 +75,10 @@ const fetchDependencyTree = async () => {
    current: 1,
    size: 10
  });
-  if(data.data.code===200 &&data?.data?.data &&data?.data?.data.total>0) {
-    tableData.value = [renameComponentsToChildren(data?.data?.data)] || [];
+  debugger
+  if(data.data.code===200 &&data?.data?.data?.components) {
+    tableData.value = renameComponentsToChildren(data?.data?.data?.components);
+    debugger
    // pager.value.total = data?.data?.data?.total || [];
  } else {
    // tableData.value = baseTreeTableData1.value
--- a/src/views/Jyh/Version/Detail/SBOMDetail.vue
+++ b/src/views/Jyh/Version/Detail/SBOMDetail.vue
@@ -2,15 +2,15 @@
  <d-layout class="dlayout">
    <d-header class="dheader">
      <div class="title">
-        <h1>openssl</h1>
+        <h1>{{props.selectRow.libraryName || '--'}}</h1>
        <d-icon style="cursor: pointer" name="icon-close" @click="emit('close')"></d-icon>
      </div>
      <div class="sub-title">
        <span>安全漏洞：</span>
-        <span class="val">3</span>
+        <span class="val">{{props.selectRow.lowVulCount || '--'}}</span>
        <span class="split"></span>
        <span>许可证</span>
-        <d-tag color="#3ac295" size="sm" class="ml-2">获准的</d-tag>
+        <d-tag color="#3ac295" size="sm" class="ml-2">{{props.selectRow.licenseName || '--'}}</d-tag>
      </div>
    </d-header>
    <div class="card-box">
@@ -18,13 +18,13 @@
        <d-row :gutter="10">
          <d-col :span="24" class="flex">
            <label style="flex: 0.2">简介</label>
-            <p>request</p>
+            <p>{{'--'}}</p>
          </d-col>
        </d-row>
        <d-row :gutter="10">
          <d-col :span="24" class="flex">
            <label style="flex: 0.2">关联漏洞编号</label>
-            <p>CNVD-201105-215</p>
+            <p>{{props.selectRow.cveId || '--'}}</p>
          </d-col>
        </d-row>
      </div>
@@ -35,57 +35,57 @@
        <d-row :gutter="10">
          <d-col :span="12" class="flex">
            <label>当前版本</label>
-            <p>2.0</p>
+            <p>{{props.selectRow.currentVersion || '--'}}</p>
          </d-col>
          <d-col :span="12" class="flex">
            <label>最新版本</label>
-            <p>3.0</p>
+            <p>{{props.selectRow.latestVersion || '--'}}</p>
          </d-col>
        </d-row>
        <d-row :gutter="10">
          <d-col :span="12" class="flex">
            <label>深度</label>
-            <p>1</p>
+            <p>{{props.selectRow.depth || '--'}}</p>
          </d-col>
          <d-col :span="12" class="flex">
            <label>供应商</label>
-            <p>-</p>
+            <p>{{props.selectRow.vendor || '--'}}</p>
          </d-col>
        </d-row>
        <d-row :gutter="10">
          <d-col :span="12" class="flex">
            <label>包管理器平台</label>
-            <p>NOT_SPECIFIED</p>
+            <p>{{props.selectRow.platform || '--'}}</p>
          </d-col>
          <d-col :span="12" class="flex">
            <label>范围</label>
-            <p>-</p>
+            <p>{{props.selectRow.scope || '--'}}</p>
          </d-col>
        </d-row>
        <d-row :gutter="10">
          <d-col :span="12" class="flex">
            <label>程序语言</label>
-            <p>cpp</p>
+            <p>{{props.selectRow.language || '--'}}</p>
          </d-col>
          <d-col :span="12" class="flex">
            <label>活跃度</label>
-            <p>-</p>
+            <p>{{props.selectRow.activityScore || '--'}}</p>
          </d-col>
        </d-row>
        <d-row :gutter="10">
          <d-col :span="12" class="flex">
            <label>下载量</label>
-            <p>-</p>
+            <p>{{props.selectRow.downloadCount || '--'}}</p>
          </d-col>
          <d-col :span="12" class="flex">
            <label>识别方法</label>
-            <p>BOM定义文件</p>
+            <p>{{props.selectRow.recogMethod || '--'}}</p>
          </d-col>
        </d-row>
        <d-row :gutter="10">
          <d-col :span="12" class="flex">
            <label>匹配度</label>
-            <p>100%</p>
+            <p>{{props.selectRow.matchingDegree || '--'}}</p>
          </d-col>
          <d-col :span="12" class="flex">
            <label>生命周期终点/服务终止</label>
@@ -95,7 +95,7 @@
        <d-row :gutter="10">
          <d-col :span="12" class="flex">
            <label>组件依赖关系</label>
-            <p>openssl</p>
+            <p>{{props.selectRow.treeLevel || '--'}}</p>
          </d-col>
        </d-row>
      </div>
@@ -104,8 +104,10 @@
 </template>

 <script setup>
-import { ref, defineEmits } from 'vue';
-
+import { ref, defineEmits, defineProps } from 'vue';
+const props = defineProps(['selectRow']);
+console.log(props.selectRow)
+debugger
 const emit = defineEmits(['close']);
 </script>