From adb72cb946f46c2009be40d83a0793fd60af4fab Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BB=98=E6=B0=91=E5=BA=B7?= <m18571841023@163.com>
Date: Sat, 15 Mar 2025 12:03:07 +0800
Subject: [PATCH 1/4] =?UTF-8?q?=E8=B7=B3=E8=BD=AC=E5=8F=8A=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E7=9B=B8=E5=85=B3Issues=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/config/home.ts                     |   1 +
 .../Jyh/Search/Components/BatchVerify.vue     |   2 +-
 src/views/Jyh/Search/Components/OssQuery.vue  |   2 +-
 src/views/Jyh/Version/Detail/VersionInfo.vue  | 122 ++++++++++++++----
 src/views/Jyh/Version/Detail/index.vue        |  21 ++-
 5 files changed, 116 insertions(+), 32 deletions(-)

diff --git a/src/router/config/home.ts b/src/router/config/home.ts
index 08ba130..8813259 100644
--- a/src/router/config/home.ts
+++ b/src/router/config/home.ts
@@ -3,6 +3,7 @@ import DefaultLayout from '@/layouts/DefaultLayout/index.vue';
 export default [
   {
     path: '/:namespace+',
+    redirect: '/home',
     component: () => import('@/views/Homepage/index.vue'),
     name: 'homepage',
     meta: {
diff --git a/src/views/Jyh/Search/Components/BatchVerify.vue b/src/views/Jyh/Search/Components/BatchVerify.vue
index 5c28493..fa6e41f 100644
--- a/src/views/Jyh/Search/Components/BatchVerify.vue
+++ b/src/views/Jyh/Search/Components/BatchVerify.vue
@@ -179,7 +179,7 @@ const handleBatchImport = async() => { // 多个项目导入
 const gotoDetail = (row) => {
   // 后续请换成params，暂时params传参没传过去
   router.push({
-    path: 'repoDetail/basicInfo/' + row.version
+    path: 'repoDetail/' + row.version
   });
 };
 // 分页
diff --git a/src/views/Jyh/Search/Components/OssQuery.vue b/src/views/Jyh/Search/Components/OssQuery.vue
index 6fb349f..c48225e 100644
--- a/src/views/Jyh/Search/Components/OssQuery.vue
+++ b/src/views/Jyh/Search/Components/OssQuery.vue
@@ -224,7 +224,7 @@ const router = useRouter();
 const gotoDetail = (row) => {
   // 后续请换成params，暂时params传参没传过去
   router.push({
-    path: 'repoDetail/basicInfo/' + row.version
+    path: 'repoDetail/' + row.version
   });
 };
 // 分页
diff --git a/src/views/Jyh/Version/Detail/VersionInfo.vue b/src/views/Jyh/Version/Detail/VersionInfo.vue
index 5eb7719..c68bc72 100644
--- a/src/views/Jyh/Version/Detail/VersionInfo.vue
+++ b/src/views/Jyh/Version/Detail/VersionInfo.vue
@@ -12,34 +12,28 @@
           <span class="card-val">3.5.13</span>
         </d-col>
         <d-col :span="8">
-          <span class="card-key width-90">版本编码</span>
-          <span class="card-val">0583594425</span>
+          <span class="card-key width-90">主语言类型</span>
+          <span class="card-val">JavaScript</span>
         </d-col>
       </d-row>
       <d-row>
-        <d-col :span="8">
-          <span class="card-key width-90">软件编码</span>
-          <span class="card-val">2023/08/05810TCX</span>
-        </d-col>
-        <d-col :span="8">
-          <span class="card-key width-90">主语言类型</span>
-          <span class="card-val">JavaScript</span>
-        </d-col>
         <d-col :span="8">
           <span class="card-key width-90">开发商</span>
           <span class="card-val">vue</span>
         </d-col>
+        <d-col :span="8">
+          <span class="card-key width-90">发布时间</span>
+          <span class="card-val">2023/08/05</span>
+        </d-col>
+        <d-col :span="8">
+          <span class="card-key width-90">版本描述</span>
+          <span class="card-val">0583594425</span>
+        </d-col>
       </d-row>
     </Card>
 
     <Card simple class="jyh-card mb-4">
       <div class="card-title">参考信息</div>
-      <d-row class="mb-3">
-        <d-col :span="24">
-          <span class="card-key width-110">官网地址</span>
-          <a class="card-url" href="https://designcloud.uiplus.huawei.com/developer/main/index.html">https://designcloud.uiplus.huawei.com/developer/main/index.html</a>
-        </d-col>
-      </d-row>
       <d-row class="mb-3">
         <d-col :span="8">
           <span class="card-key width-110">集成风险</span>
@@ -51,21 +45,39 @@
         </d-col>
         <d-col :span="8">
           <span class="card-key width-110">漏洞数量</span>
-          <span class="card-val">--</span>
+          <a @click="handleTabChange('ldxx')" class="card-url">9</a>
         </d-col>
       </d-row>
-      <d-row>
+      <d-row class="mb-3">
         <d-col :span="8">
-          <span class="card-key width-110">选型时间</span>
+          <span class="card-key width-110">社区EOL日期</span>
           <span class="card-val">2023/08/05</span>
         </d-col>
         <d-col :span="8">
           <span class="card-key width-110">所属领域/产业</span>
           <span class="card-val">CleanSource</span>
         </d-col>
-        <d-col :span="8">
-          <span class="card-key width-110">版本火车名称</span>
-          <span class="card-val">CleanSource V8.0</span>
+<!--        <d-col :span="8">-->
+<!--          <span class="card-key width-110">版本火车名称</span>-->
+<!--          <span class="card-val">CleanSource V8.0</span>-->
+<!--        </d-col>-->
+      </d-row>
+      <d-row class="mb-3">
+        <d-col :span="24">
+          <span class="card-key width-140">源码下载包地址</span>
+          <a class="card-url" href="https://designcloud.uiplus.huawei.com/developer/main/index.html">https://designcloud.uiplus.huawei.com/developer/main/index.html</a>
+        </d-col>
+      </d-row>
+      <d-row class="mb-3">
+        <d-col :span="24">
+          <span class="card-key width-140">源码社区托管地址</span>
+          <a class="card-url" href="https://designcloud.uiplus.huawei.com/developer/main/index.html">https://designcloud.uiplus.huawei.com/developer/main/index.html</a>
+        </d-col>
+      </d-row>
+      <d-row>
+        <d-col :span="24">
+          <span class="card-key width-140">社区EOL披露地址</span>
+          <a class="card-url" href="https://designcloud.uiplus.huawei.com/developer/main/index.html">https://designcloud.uiplus.huawei.com/developer/main/index.html</a>
         </d-col>
       </d-row>
     </Card>
@@ -75,13 +87,14 @@
       <div class="card-title">开源主License信息</div>
       <div class="mb-3">
         <d-table
-          class="jyh-table-2"
+          class="jyh-table jyh-table-2"
           :header-bg="true"
           :data="licenseTableData"
         >
           <d-column field="code" header="编号"></d-column>
           <d-column field="name" header="名称"></d-column>
           <d-column field="detail" header="描述"></d-column>
+          <d-column field="detail" header="应用场景"></d-column>
         </d-table>
       </div>
       <d-row>
@@ -95,7 +108,7 @@
       <div class="card-title">Copyright报告</div>
       <div class="mb-3">
         <d-table
-          class="jyh-table-2"
+          class="jyh-table jyh-table-2"
           :header-bg="true"
           :data="CopyrightTableData"
         >
@@ -110,8 +123,40 @@
         </d-col>
       </d-row>
     </Card>
+
+    <Card simple class="jyh-card mb-4">
+      <div class="card-title">实体</div>
+      <div>
+        <d-table
+          class="jyh-table jyh-table-2"
+          :header-bg="true"
+          :data="CopyrightTableData"
+        >
+          <d-column field="code" header="类型"></d-column>
+          <d-column field="code" header="实体包下载地址">
+            <template #default="scope">
+              <a>{{scope.row.code}}</a>
+            </template>
+          </d-column>
+          <d-column field="detail" header="文件名称"></d-column>
+          <d-column field="detail" header="录入时间"></d-column>
+          <d-column field="detail" header="完整性结果">
+            <template #default="scope">
+              <a>{{scope.row.detail}}</a>
+            </template>
+          </d-column>
+        </d-table>
+      </div>
+    </Card>
+
     <Card simple class="jyh-card mb-4">
       <div class="card-title">网络安全</div>
+      <d-row class="mb-3">
+        <d-col :span="24">
+          <span class="card-key width-160">软件评分</span>
+          <span class="card-val">--</span>
+        </d-col>
+      </d-row>
       <d-row class="mb-3">
         <d-col :span="24">
           <span class="card-key width-160">社区安全问题求助渠道</span>
@@ -122,7 +167,7 @@
         <span class="card-key width-160">官网漏洞披露地址</span>
         <d-table
           style="display: contents"
-          class="jyh-table-2"
+          class="jyh-table jyh-table-2"
           :header-bg="true"
           :data="CopyrightTableData"
         >
@@ -134,7 +179,7 @@
         <span class="card-key width-160">外部漏洞源的软件名称</span>
         <d-table
           style="display: contents"
-          class="jyh-table-2"
+          class="jyh-table jyh-table-2"
           :header-bg="true"
           :data="CopyrightTableData"
         >
@@ -151,7 +196,7 @@
       </d-row>
       <d-row>
         <d-col :span="24">
-          <span class="card-key width-160">是否安卓类APP组件</span>
+          <span class="card-key width-160">兼容性风险描述</span>
           <span class="card-val">否</span>
         </d-col>
       </d-row>
@@ -161,11 +206,32 @@
 
 <script setup lang="ts">
 
-import { ref } from 'vue';
+import { ref,defineEmits } from 'vue';
+import { useRouter } from 'vue-router';
+import { discussDetailType, userInfoType } from '@/api/discussion/types';
+
+const emits = defineEmits(['changeTabs']);
+
+// 触发事件的方法
+const handleTabChange = (tabName) => {
+  emits('changeTabs', tabName); // 触发 changeTabs 事件，并传递参数
+};
 
 const licenseTableData = ref([{code: '05822156', name:'MIT License',detail: 'integer'}]);
 const CopyrightTableData = ref([{code: '05822156',detail: 'integer'}]);
 
+
+const router = useRouter();
+
+// 跳转
+const gotoDetail = (row) => {
+  // 后续请换成params，暂时params传参没传过去
+  router.push({
+    path: 'repoDetail/' + row.version,
+    params: { tab: 'ldxx' } // 指定需要激活的 Tab
+  });
+};
+
 </script>
 
 <style scoped lang="scss">
diff --git a/src/views/Jyh/Version/Detail/index.vue b/src/views/Jyh/Version/Detail/index.vue
index 91df046..4b523c4 100644
--- a/src/views/Jyh/Version/Detail/index.vue
+++ b/src/views/Jyh/Version/Detail/index.vue
@@ -33,7 +33,7 @@
       </d-tabs>
     </div>
     <div class="version-detail-content">
-      <version-info v-if="selectTab === 'bbxx'"></version-info>
+      <version-info v-if="selectTab === 'bbxx'" @changeTabs="changeTabs"></version-info>
       <vulnerabilities-list v-else-if="selectTab === 'ldxx'"></vulnerabilities-list>
       <community-info v-else-if="selectTab === 'communityInfo'"></community-info>
       <AIRepair v-else-if="selectTab === 'ai'"></AIRepair>
@@ -42,7 +42,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive } from 'vue';
+import { ref, reactive, watch } from 'vue';
 import { useRouter, useRoute } from 'vue-router';
 import { getOrgInfo } from '@/views/Org/hooks/orgInfo';
 import VulnerabilitiesList from './VulnerabilitiesList.vue';
@@ -51,6 +51,7 @@ import VersionInfo from './VersionInfo.vue';
 import AIRepair from '../../AIRepair/index.vue';
 import LicenseInfo from '../../LicenseInfo/index.vue';
 const { namespace } = getOrgInfo();
+const route = useRoute(); // 获取路由对象
 const avatarUrl = '/src/assets/imgs/jyh/工程首字母图标.png';
 
 const selectTab = ref('bbxx');
@@ -59,6 +60,22 @@ const selectTab = ref('bbxx');
 const item = ref('');
 const deleteModal = ref();
 const deletevModels = ref(false);
+
+// 监听路由的 query.tab 变化
+watch(
+  () => route.query.tab,
+  (newTab) => {
+    if (newTab) {
+      selectTab.value = newTab; // 根据 query 参数激活 Tab
+    }
+  },
+  { immediate: true } // 立即执行一次
+);
+
+const changeTabs = (tab:string) => {
+  selectTab.value = tab;
+}
+
 const openDelete = (row: any) => {
   item.value = row;
   deleteModal.value.showFlag = true;

From 8bfa866c43e7b26ae644d0f921a34923134b5ef9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BB=98=E6=B0=91=E5=BA=B7?= <m18571841023@163.com>
Date: Sat, 15 Mar 2025 17:25:27 +0800
Subject: [PATCH 2/4] =?UTF-8?q?=E7=89=88=E6=9C=AC=E4=BF=A1=E6=81=AF?=
 =?UTF-8?q?=E5=AE=9E=E4=BD=93=E6=B7=BB=E5=8A=A0=E5=AE=8C=E6=95=B4=E6=80=A7?=
 =?UTF-8?q?=E7=BB=93=E6=9E=9C=E8=AF=A6=E6=83=85=E5=BC=B9=E6=A1=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/jyh.scss                      |  5 ++
 src/views/Jyh/Version/Detail/VersionInfo.vue | 59 +++++++++++++++++++-
 2 files changed, 62 insertions(+), 2 deletions(-)

diff --git a/src/assets/css/jyh.scss b/src/assets/css/jyh.scss
index 0cbae40..2d3f4c2 100644
--- a/src/assets/css/jyh.scss
+++ b/src/assets/css/jyh.scss
@@ -272,3 +272,8 @@
 .yellow-status:before {
   background-color: #FAC20A !important;
 }
+
+.devui-modal__header {
+  //padding: 14px 24px;
+  height: auto!important;
+}
diff --git a/src/views/Jyh/Version/Detail/VersionInfo.vue b/src/views/Jyh/Version/Detail/VersionInfo.vue
index c68bc72..31909d6 100644
--- a/src/views/Jyh/Version/Detail/VersionInfo.vue
+++ b/src/views/Jyh/Version/Detail/VersionInfo.vue
@@ -45,7 +45,7 @@
         </d-col>
         <d-col :span="8">
           <span class="card-key width-110">漏洞数量</span>
-          <a @click="handleTabChange('ldxx')" class="card-url">9</a>
+          <a style="cursor: pointer" @click="handleTabChange('ldxx')" class="card-url">9</a>
         </d-col>
       </d-row>
       <d-row class="mb-3">
@@ -142,7 +142,7 @@
           <d-column field="detail" header="录入时间"></d-column>
           <d-column field="detail" header="完整性结果">
             <template #default="scope">
-              <a>{{scope.row.detail}}</a>
+              <a @click="visible=true">{{scope.row.detail}}</a>
             </template>
           </d-column>
         </d-table>
@@ -201,6 +201,60 @@
         </d-col>
       </d-row>
     </Card>
+
+    <d-modal
+      title="完整性结果详情"
+      v-model="visible"
+      class="file-search-modal"
+      :style="{ width: '800px', height: '400px' }"
+      @close="handleClose"
+    >
+      <Card simple class="jyh-card mb-4" style="box-shadow: none">
+        <d-row class="mb-3">
+          <d-col :span="24">
+            <span class="card-key width-160">社区哈希类型</span>
+            <span class="card-val">sha512</span>
+          </d-col>
+        </d-row>
+        <d-row class="mb-3">
+          <d-col :span="24">
+            <span class="card-key width-160">社区哈希值</span>
+            <span class="card-val">23u4guj2i3hni32h2o34io234</span>
+          </d-col>
+        </d-row>
+        <d-row class="mb-3">
+          <d-col :span="24">
+            <span class="card-key width-160">社区签名校验结果</span>
+            <span class="card-val">通过</span>
+          </d-col>
+        </d-row>
+        <d-row class="mb-3">
+          <d-col :span="24">
+            <span class="card-key width-160">社区签名</span>
+            <span class="card-val">确认无社区签名</span>
+          </d-col>
+        </d-row>
+        <d-row class="mb-3">
+          <d-col :span="24">
+            <span class="card-key width-160">社区签名下载地址</span>
+            <span class="card-val">确认无社区签名</span>
+          </d-col>
+        </d-row>
+        <d-row class="mb-3">
+          <d-col :span="24">
+            <span class="card-key width-160">社区公钥</span>
+            <span class="card-val">确认无社区签名</span>
+          </d-col>
+        </d-row>
+        <d-row class="mb-3">
+          <d-col :span="24">
+            <span class="card-key width-160">社区公钥下载地址</span>
+            <span class="card-val">确认无社区签名</span>
+          </d-col>
+        </d-row>
+      </Card>
+    </d-modal>
+
   </div>
 </template>
 
@@ -219,6 +273,7 @@ const handleTabChange = (tabName) => {
 
 const licenseTableData = ref([{code: '05822156', name:'MIT License',detail: 'integer'}]);
 const CopyrightTableData = ref([{code: '05822156',detail: 'integer'}]);
+const visible = ref(false);
 
 
 const router = useRouter();

From f69bd8a023ad548be6b6f748831b93c53d5601a8 Mon Sep 17 00:00:00 2001
From: "@user8949" <user8949@noreply.gitcode.com>
Date: Sat, 15 Mar 2025 17:27:47 +0800
Subject: [PATCH 3/4] =?UTF-8?q?update:=20=E9=AB=98=E7=BA=A7=E7=AD=9B?=
 =?UTF-8?q?=E9=80=89=E9=A1=B9=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/AdvanceSearch/index.vue       | 35 ++++----------------
 src/views/Jyh/Home/index.vue                 | 12 +++++--
 src/views/Jyh/Search/Components/OssQuery.vue |  5 ++-
 3 files changed, 17 insertions(+), 35 deletions(-)

diff --git a/src/components/AdvanceSearch/index.vue b/src/components/AdvanceSearch/index.vue
index 99adc40..7e41f87 100644
--- a/src/components/AdvanceSearch/index.vue
+++ b/src/components/AdvanceSearch/index.vue
@@ -13,18 +13,13 @@
             <d-input placeholder="请输入软件/组件名称" v-model="formData.searchWord"/>
           </d-form-item>
         </d-col>
-        <d-col :span="8">
-          <d-form-item field="licenseRisk" label="license集成风险" help-tips="license集成风险说明">
-            <d-select :options="licenseRiskList" v-model="formData.licenseStrengths"></d-select>
-          </d-form-item>
-        </d-col>
-      </d-row>
-      <d-row :gutter="16">
         <d-col :span="8">
           <d-form-item field="version" label="软件版本">
             <d-input v-model="formData.softwareVersion"/>
           </d-form-item>
         </d-col>
+      </d-row>
+      <d-row :gutter="16">
         <d-col :span="8">
           <d-form-item field="dependency" label="依赖软件">
             <d-input v-model="formData.dependentSoftware"/>
@@ -35,19 +30,17 @@
             <d-select :options="languageList" v-model="formData.programmingLanguage"></d-select>
           </d-form-item>
         </d-col>
-      </d-row>
-      <d-row :gutter="16">
         <d-col :span="8">
           <d-form-item field="date" label="版本发布日期">
-            <d-range-date-picker-pro v-model="formData.dateRange"  style="width: 100%;"/>
+            <d-range-date-picker-pro v-model="formData.dateRange"  style="width: 100%;"
+            :placeholder="['开始日期', '结束日期']"/>
           </d-form-item>
         </d-col>
       </d-row>
-
       <slot name="operation">
         <gc-form-operation style="display: flex; justify-content: center; gap: 8px;">
-          <d-button variant="solid" @click="submitForm">搜索</d-button>
-          <d-button @click="cancel">取消</d-button>
+          <d-button style="width: 96px; height: 32px;" variant="solid" @click="submitForm">搜索</d-button>
+          <d-button style="width: 96px; height: 32px;" @click="cancel">取消</d-button>
         </gc-form-operation>
       </slot>
     </d-form>
@@ -66,7 +59,6 @@ const props = defineProps({
     default: () => ({
       licenseName: '',
       searchWord: '',
-      licenseStrengths: '',
       softwareVersion: '',
       dependentSoftware: '',
       programmingLanguage: '',
@@ -76,20 +68,6 @@ const props = defineProps({
 })
 const emit = defineEmits(['submit', 'cancel', 'update:modelValue']);
 const languageList = ref([]);
-const licenseRiskList = ref([
-  {
-    name: '高',
-    value: 'high'
-  },
-  {
-    name: '中',
-    value: 'medium'
-  },
-  {
-    name: '低',
-    value: 'low'
-  }
-])
 
 const formData = ref({...props.modelValue});
 
@@ -113,7 +91,6 @@ const cancel = () => {
   formData.value = {
     licenseName: '',
     searchWord: '',
-    licenseStrengths: '',
     softwareVersion: '',
     dependentSoftware: '',
     programmingLanguage: '',
diff --git a/src/views/Jyh/Home/index.vue b/src/views/Jyh/Home/index.vue
index 563cffd..5c9b8f0 100644
--- a/src/views/Jyh/Home/index.vue
+++ b/src/views/Jyh/Home/index.vue
@@ -69,7 +69,7 @@
             :dot-color="item.dotColor" :line-color="'var(--devui-form-control-line-hover)'">
               <template #default>
                 <div style="display: flex; justify-content: space-between;">
-                  <div class="cursor-pointer" @click="openWarningDetail(item.text)">{{ item.text }}</div>
+                  <div class="cursor-pointer" @click="openWarningDetail(item.text, index)">{{ item.text }}</div>
                   <div style="display: flex;  align-items: center; gap: 8px;">
                     <d-icon name="icon-time"></d-icon>
                     {{ item.time }}
@@ -175,8 +175,14 @@ const checkMore = () => {
   router.push({ name: 'PersonalCenter' });
 }
 
-const openWarningDetail = (event) => {
-  console.log(event)
+const openWarningDetail = (event, index) => {
+  infoList.value.forEach((item, i) => {
+    if (i <= index) {
+      item.dotColor = 'var(--devui-info)';
+    } else {
+      item.dotColor = '';
+    }
+  })
 }
 
 let resizeObserver: ResizeObserver | null = null;
diff --git a/src/views/Jyh/Search/Components/OssQuery.vue b/src/views/Jyh/Search/Components/OssQuery.vue
index 2103080..837591a 100644
--- a/src/views/Jyh/Search/Components/OssQuery.vue
+++ b/src/views/Jyh/Search/Components/OssQuery.vue
@@ -3,10 +3,10 @@
     <div class="search-form">
       <AdvanceSearch v-model="newFormData" class="px-20">
         <template #operation>
-          <gc-form-operation class="jyh-form-operation">
+          <div>
             <d-button class="mr-2" variant="solid">筛选</d-button>
             <d-button variant="solid" color="secondary">清空</d-button>
-          </gc-form-operation>
+          </div>
           <d-button class="output-btn" icon="icon-share" variant="text">导出</d-button>
         </template>
       </AdvanceSearch>
@@ -135,7 +135,6 @@ const isUseOptions = reactive(['是', '否']);
 const newFormData = ref({
   licenseName: '',
   searchWord: '',
-  licenseStrengths: '',
   softwareVersion: '',
   dependentSoftware: '',
   programmingLanguage: '',

From ef07ed14847efac726f9cb715e67b6c17ea747ec Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B1=AA=E5=B0=91=E4=BC=9F?= <wsw.sun@qq.com>
Date: Sat, 15 Mar 2025 17:33:05 +0800
Subject: [PATCH 4/4] =?UTF-8?q?feat:=20SBOM=E8=AF=A6=E6=83=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/Jyh/Version/Detail/SBOM.vue       |  11 +-
 src/views/Jyh/Version/Detail/SBOMDetail.vue | 180 ++++++++++++++++++++
 2 files changed, 190 insertions(+), 1 deletion(-)
 create mode 100644 src/views/Jyh/Version/Detail/SBOMDetail.vue

diff --git a/src/views/Jyh/Version/Detail/SBOM.vue b/src/views/Jyh/Version/Detail/SBOM.vue
index cde5c23..295dc7a 100644
--- a/src/views/Jyh/Version/Detail/SBOM.vue
+++ b/src/views/Jyh/Version/Detail/SBOM.vue
@@ -6,15 +6,24 @@
   <Card simple class="jyh-card mt-3">
     <div class="clear-padding">
       <d-table :indent="32" @check-change="treeCheckChange" :data="baseTreeTableData1" row-key="id">
-        <d-column field="firstName" header="组织名称" show-overflow-tooltip> </d-column>
+        <d-column field="firstName" header="组织名称" show-overflow-tooltip>
+          <template #default="scope">
+            <a class="devui-link" @click="showDetail = true">{{ scope.row.firstName }}</a>
+          </template>
+        </d-column>
         <d-column field="lastName" header="版本"></d-column>
       </d-table>
     </div>
   </Card>
+  <d-drawer v-model="showDetail" style="width: 800px; padding: 20px">
+    <SBOMDetail @close="showDetail = false" />
+  </d-drawer>
 </template>
 <script setup lang="ts">
 import { ref, reactive } from 'vue';
+import SBOMDetail from './SBOMDetail.vue';
 const checked = ref(false);
+const showDetail = ref(false);
 
 const baseTreeTableData1 = ref([
   {
diff --git a/src/views/Jyh/Version/Detail/SBOMDetail.vue b/src/views/Jyh/Version/Detail/SBOMDetail.vue
new file mode 100644
index 0000000..c988590
--- /dev/null
+++ b/src/views/Jyh/Version/Detail/SBOMDetail.vue
@@ -0,0 +1,180 @@
+<template>
+  <d-layout class="dlayout">
+    <d-header class="dheader">
+      <div class="title">
+        <h1>openssl</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="split"></span>
+        <span>许可证</span>
+        <d-tag color="#3ac295" size="sm" class="ml-2">获准的</d-tag>
+      </div>
+    </d-header>
+    <div class="card-box">
+      <div class="card-body">
+        <d-row :gutter="10">
+          <d-col :span="24" class="flex">
+            <label style="flex: 0.2">简介</label>
+            <p>request</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>
+          </d-col>
+        </d-row>
+      </div>
+    </div>
+    <div class="card-box">
+      <div class="card-header">组件详情</div>
+      <div class="card-body">
+        <d-row :gutter="10">
+          <d-col :span="12" class="flex">
+            <label>当前版本</label>
+            <p>2.0</p>
+          </d-col>
+          <d-col :span="12" class="flex">
+            <label>最新版本</label>
+            <p>3.0</p>
+          </d-col>
+        </d-row>
+        <d-row :gutter="10">
+          <d-col :span="12" class="flex">
+            <label>深度</label>
+            <p>1</p>
+          </d-col>
+          <d-col :span="12" class="flex">
+            <label>供应商</label>
+            <p>-</p>
+          </d-col>
+        </d-row>
+        <d-row :gutter="10">
+          <d-col :span="12" class="flex">
+            <label>包管理器平台</label>
+            <p>NOT_SPECIFIED</p>
+          </d-col>
+          <d-col :span="12" class="flex">
+            <label>范围</label>
+            <p>-</p>
+          </d-col>
+        </d-row>
+        <d-row :gutter="10">
+          <d-col :span="12" class="flex">
+            <label>程序语言</label>
+            <p>cpp</p>
+          </d-col>
+          <d-col :span="12" class="flex">
+            <label>活跃度</label>
+            <p>-</p>
+          </d-col>
+        </d-row>
+        <d-row :gutter="10">
+          <d-col :span="12" class="flex">
+            <label>下载量</label>
+            <p>-</p>
+          </d-col>
+          <d-col :span="12" class="flex">
+            <label>识别方法</label>
+            <p>BOM定义文件</p>
+          </d-col>
+        </d-row>
+        <d-row :gutter="10">
+          <d-col :span="12" class="flex">
+            <label>匹配度</label>
+            <p>100%</p>
+          </d-col>
+          <d-col :span="12" class="flex">
+            <label>生命周期终点/服务终止</label>
+            <p><d-tag type="danger" size="sm">已停止维护</d-tag></p>
+          </d-col>
+        </d-row>
+        <d-row :gutter="10">
+          <d-col :span="12" class="flex">
+            <label>组件依赖关系</label>
+            <p>openssl</p>
+          </d-col>
+        </d-row>
+      </div>
+    </div>
+  </d-layout>
+</template>
+
+<script setup>
+import { ref, defineEmits } from 'vue';
+
+const emit = defineEmits(['close']);
+</script>
+
+<style scoped lang="scss">
+@import 'devui-theme/styles-var/devui-var.scss';
+
+.dlayout {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: start;
+  .dheader {
+    width: 100%;
+  }
+
+  .title {
+    font-size: 20px;
+    font-weight: bold;
+    display: flex;
+    width: 100%;
+    justify-content: space-between;
+    align-items: center;
+    d-icon {
+      cursor: pointer;
+    }
+  }
+
+  .sub-title {
+    display: flex;
+    gap: 2px;
+    align-items: center;
+    font-size: 12px;
+    margin-top: 6px;
+    color: #808080;
+    .val {
+      color: var(--devui-text);
+    }
+    .split {
+      width: 1px;
+      height: 14px;
+      background-color: #ddd;
+    }
+  }
+
+  .card-box {
+    width: 100%;
+    border-radius: 8px;
+    border: 1px solid #eef0f5;
+    font-size: 14px;
+    margin-top: 15px;
+    .card-header {
+      padding: 10px 16px;
+      background-color: #f5f5f5;
+      border-bottom: 1px solid #eef0f5;
+      font-weight: bold;
+    }
+    .card-body {
+      margin: 10px 16px;
+      .flex {
+        margin: 10px 0;
+        label,
+        p {
+          flex: 1;
+        }
+        label {
+          color: #595959;
+        }
+      }
+    }
+  }
+}
+</style>