This commit is contained in:
汪少伟
2025-03-21 12:11:57 +08:00
parent ef8c5e1c15
commit 8705ead31d
5 changed files with 140 additions and 182 deletions

View File

@@ -6,8 +6,8 @@
<d-icon style="cursor: pointer;" name="icon-close" @click="emit('close')"></d-icon>
</div>
<div class="sub-title">
<span>分数</span>
<span>3</span>
<!-- <span>分数</span>
<span>3</span> -->
<span>类型</span>
<d-tag color="#3ac295" size="sm">{{ data.category }}</d-tag>
</div>
@@ -205,4 +205,4 @@ const emit = defineEmits(['close']);
border: 1px solid #ccc;
border-radius: 4px;
}
</style>
</style>

View File

@@ -2,52 +2,63 @@
<div class="info-outside w-full">
<div class="info">
<div class="flex items-center justify-start w-full gap-1">
<img src="@/assets/imgs/jyh/aiIcon.png">
<img src="@/assets/imgs/jyh/aiIcon.png" />
<span class="text-base font-medium">AI修复建议:</span>
</div>
<div>
<ul>
<br />
Ubuntu: 安装 linux-image-5.4.0-126 或更高版本 <br />
RHEL/CentOS: 通过 yum update kernel 升级<br />
Debian: 使用 apt-get upgrade linux-image-$(uname -r)<br />
<!-- <ul>
<li v-for="info in infoList">{{ info }}</li>
</ul>
</ul> -->
</div>
</div>
</div>
<div class="ai-container">
<template v-if="tableData.length>0">
<div class="ai-container-card" style="width: 100%;" v-for="(rowItem, index) in tableData" :key="index">
<template v-if="tableData.length > 0">
<div class="ai-container-card" style="width: 100%" v-for="(rowItem, index) in tableData" :key="index">
<Panel :expand="!rowItem.expand">
<template #header>
<div class="ai-panel-header">
<div style="padding: 25px 8px 0px 20px;">
<img style="width: 36px; height: 33px;" src="@/assets/imgs/jyh/warning.png">
<div style="padding: 25px 8px 0px 20px">
<img style="width: 36px; height: 33px" src="@/assets/imgs/jyh/warning.png" />
</div>
<div style="width: 100%; padding: 20px 20px 0px 0;">
<div style="width: 100%; padding: 20px 20px 0px 0">
<div class="ai-panel-header-title">
<div>
<d-tag color="red-w98" class="mr-1" size="sm">{{'严重'}}</d-tag>
<span>{{rowItem.libraryName||'--'}}</span>
<d-tag color="red-w98" class="mr-1" size="sm">{{ '严重' }}</d-tag>
<span>{{ rowItem.libraryName || '--' }}</span>
</div>
<div style="cursor: pointer; display: flex; gap: 8px; align-items: center;" @click="rowItem.expand == rowItem.expand">
<img style="width: 14px; height: 14px;" src="@/assets/imgs/jyh/collapseIcon.png">
<div
style="cursor: pointer; display: flex; gap: 8px; align-items: center"
@click="rowItem.expand == rowItem.expand"
>
<img style="width: 14px; height: 14px" src="@/assets/imgs/jyh/collapseIcon.png" />
<span>全部收起</span>
</div>
</div>
<div class="ai-panel-header-sub-title">
<div>
<span class="weak-text">安全问题</span>
<span>{{rowItem.vulnerabilities.length ||'--'}}</span>
<span>{{ rowItem.vulnerabilities.length || '--' }}</span>
</div>
<div>
<span class="weak-text">修复兼容性</span>
<span>{{rowItem.vulnerabilities.length ||'--'}}</span>
<img src="@/assets/imgs/jyh/help.png" class="icon-sm">
<d-tag class="ml-1" type="warning" size="sm">{{rowItem.vulnerabilities.length>0?rowItem.vulnerabilities[0].severity:'--'}}</d-tag>
<span>{{ rowItem.vulnerabilities.length || '--' }}</span>
<img src="@/assets/imgs/jyh/help.png" class="icon-sm" />
<d-tag class="ml-1" type="warning" size="sm">{{
rowItem.vulnerabilities.length > 0 ? rowItem.vulnerabilities[0].severity : '--'
}}</d-tag>
</div>
<div>
<span class="weak-text">升级版本</span>
<span>{{rowItem.currentVersion ||'--'}}</span>
<img src="@/assets/imgs/jyh/ic_digital_power_next_step_@2x.png" class="icon-sm">
<span>{{rowItem.currentVersion ||'--'}}</span>
<span>{{ rowItem.currentVersion || '--' }}</span>
<img src="@/assets/imgs/jyh/ic_digital_power_next_step_@2x.png" class="icon-sm" />
<span>{{ rowItem.currentVersion || '--' }}</span>
</div>
</div>
</div>
@@ -55,9 +66,11 @@
</template>
<template #body>
<div style="padding: 8px 20px 20px 20px; width: 100%;">
<Table class="jyh-table" :tableConfig="tableConfig" :dataSource="rowItem.vulnerabilities"/>
<div class="w-full flex items-center justify-end"><span>{{ rowItem.vulnerabilities.length }}</span></div>
<div style="padding: 8px 20px 20px 20px; width: 100%">
<Table class="jyh-table" :tableConfig="tableConfig" :dataSource="rowItem.vulnerabilities" />
<div class="w-full flex items-center justify-end">
<span>{{ rowItem.vulnerabilities.length }}</span>
</div>
</div>
</template>
</Panel>
@@ -68,7 +81,7 @@
</template>
<script setup>
import { ref,onMounted,defineProps } from 'vue';
import { ref, onMounted, defineProps } from 'vue';
import Panel from '@/components/AIRepair/Panel.vue';
import Table from '@/components/AIRepair/Table.vue';
import NoData from '@/components/NoData/NoData.vue';
@@ -77,7 +90,7 @@ const propsData = defineProps(['versionId']);
const infoList = ref([
'当前代码主要风险为易受常见的注入攻击包括命令注入、SQL注入、表达式注入针对每种攻击应提供相应的防范措施如数据校验、使用安全函数和限制程序权限。',
'相对上一次检查【提升点】在于代码基础编码问题少了47.8%问题总数降低29.3%'
])
]);
const tableConfig = ref([
{
@@ -103,9 +116,8 @@ const tableConfig = ref([
header: '分值',
sortable: true,
sortMethod: null
},
])
}
]);
const list = ref([
{
@@ -113,7 +125,7 @@ const list = ref([
title: 'Morgan',
data: {
listData: [
{
{
securityProblemCode: '1',
type: '安全问题',
CWEcode: 'CWE-123',
@@ -133,7 +145,7 @@ const list = ref([
title: 'webpack',
data: {
listData: [
{
{
securityProblemCode: '1',
type: '安全问题',
CWEcode: 'CWE-123',
@@ -148,26 +160,24 @@ const list = ref([
]
}
}
])
]);
const getInfo = async() => {
const getInfo = async () => {
const { data } = await getRepairInfo({
"current": 1,
"size": 10,
current: 1,
size: 10,
// "softwareId": 47,
softwareId: propsData.versionId,
softwareId: propsData.versionId
});
debugger
if(data.code===200) {
if (data.code === 200) {
tableData.value = data?.data?.components || [];
// pager.value.total = data?.data?.data?.total || [];
}
}
};
const tableData = ref([]);
onMounted( () => {
getInfo()
onMounted(() => {
getInfo();
});
</script>
<style scoped lang="scss">
@@ -183,7 +193,7 @@ onMounted( () => {
border-top: 2px solid $devui-danger;
background-color: $devui-base-bg;
border-radius: var(--devui-border-radius-card, 8px);
box-shadow: var(--devui-shadow-length-base, 0 2px 6px 0) var(--devui-light-shadow, rgba(37, 43, 58, .12));
box-shadow: var(--devui-shadow-length-base, 0 2px 6px 0) var(--devui-light-shadow, rgba(37, 43, 58, 0.12));
}
}
@@ -233,7 +243,15 @@ onMounted( () => {
margin: 20px 0;
padding: 1px;
border-radius: 8px;
background-image: linear-gradient(134.79deg, #A4F7DF 0%, #A0CEFB 21%, #5F9AFE 43%, #D9B9FC 62%, #01EFBB 73%, #FBAE46 100%);
background-image: linear-gradient(
134.79deg,
#a4f7df 0%,
#a0cefb 21%,
#5f9afe 43%,
#d9b9fc 62%,
#01efbb 73%,
#fbae46 100%
);
}
.info {

View File

@@ -5,7 +5,14 @@
</div>
<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-table
class="jyh-table"
v-if="tableData.length > 0"
:indent="32"
@check-change="treeCheckChange"
:data="tableData"
row-key="id"
>
<d-column field="libraryName" header="组件名称" show-overflow-tooltip>
<template #default="scope">
<a class="devui-link" @click="setSelectRow(scope.row)">{{ scope.row.libraryName }}</a>
@@ -37,7 +44,7 @@ const tableData = ref([]);
const setSelectRow = (row) => {
selectRow.value = row;
showDetail.value = true;
}
};
const renameComponentsToChildren = (obj) => {
// 如果传入的不是对象,直接返回
@@ -61,7 +68,7 @@ const renameComponentsToChildren = (obj) => {
}
return obj;
}
};
const treeCheckChange = (val, row, selection) => {
console.log('treeCheckChange', selection);
@@ -75,19 +82,16 @@ const fetchDependencyTree = async () => {
current: 1,
size: 10
});
debugger
if(data.data.code===200 &&data?.data?.data?.components) {
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
}
}
};
onMounted( () => {
fetchDependencyTree()
onMounted(() => {
fetchDependencyTree();
});
</script>

View File

@@ -6,9 +6,9 @@
<d-icon style="cursor: pointer" name="icon-close" @click="emit('close')"></d-icon>
</div>
<div class="sub-title">
<span>安全漏洞</span>
<span class="val">{{props.selectRow.component.confidence || 'low'}}</span>
<span class="split"></span>
<!-- <span>安全漏洞</span>
<span class="val">{{props.selectRow.component.confidence || 'low'}}</span> -->
<!-- <span class="split"></span> -->
<span>许可证</span>
<d-tag color="#3ac295" size="sm" class="ml-2">{{props.selectRow.component.licenseName || '--'}}</d-tag>
</div>
@@ -21,12 +21,12 @@
<p>{{props.selectRow.component.libraryName || '--'}}</p>
</d-col>
</d-row>
<d-row :gutter="10">
<!-- <d-row :gutter="10">
<d-col :span="24" class="flex">
<label style="flex: 0.2">关联漏洞编号</label>
<p>{{props.selectRow.component.cveId || `cve-2025-${randomNum()}`}}</p>
</d-col>
</d-row>
</d-row> -->
</div>
</div>
<div class="card-box">

View File

@@ -40,7 +40,7 @@
<span class="card-val">{{ ReleaseInfo.referenceInfo.integrationRisk || '--' }}</span>
</d-col>
<d-col :span="8">
<span class="card-key width-110">代码量(KL)</span>
<span class="card-key width-110">代码量(L)</span>
<span class="card-val">{{ ReleaseInfo.referenceInfo.codeQuantity || '--' }}</span>
</d-col>
<d-col :span="8">
@@ -59,53 +59,54 @@
<span class="card-key width-110">所属领域/产业</span>
<span class="card-val">{{ getIndustryName(ReleaseInfo.referenceInfo.industry) || '--' }}</span>
</d-col>
<!-- <d-col :span="8">-->
<!-- <span class="card-key width-110">版本火车名称</span>-->
<!-- <span class="card-val">CleanSource V8.0</span>-->
<!-- </d-col>-->
<!-- <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="ReleaseInfo.referenceInfo.sourceCodeDownloadUrl || '--'">{{ ReleaseInfo.referenceInfo.sourceCodeDownloadUrl || '--' }}</a>
<a class="card-url" :href="ReleaseInfo.referenceInfo.sourceCodeDownloadUrl || '--'">{{
ReleaseInfo.referenceInfo.sourceCodeDownloadUrl || '--'
}}</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="ReleaseInfo.referenceInfo.sourceCodeCommunityUrl || '--'">{{ ReleaseInfo.referenceInfo.sourceCodeCommunityUrl || '--' }}</a>
<a class="card-url" :href="ReleaseInfo.referenceInfo.sourceCodeCommunityUrl || '--'">{{
ReleaseInfo.referenceInfo.sourceCodeCommunityUrl || '--'
}}</a>
</d-col>
</d-row>
<d-row>
<d-col :span="24">
<span class="card-key width-140">社区EOL披露地址</span>
<a class="card-url" :href="ReleaseInfo.referenceInfo.communityEolDisclosureUrl || '--'">{{ ReleaseInfo.referenceInfo.communityEolDisclosureUrl || '--' }}</a>
<a class="card-url" :href="ReleaseInfo.referenceInfo.communityEolDisclosureUrl || '--'">{{
ReleaseInfo.referenceInfo.communityEolDisclosureUrl || '--'
}}</a>
</d-col>
</d-row>
</Card>
<Card simple class="jyh-card mb-4">
<div class="card-title">开源主License信息</div>
<div class="mb-3">
<d-table
class="jyh-table jyh-table-2"
:header-bg="true"
:data="ReleaseInfo.openSourceLicenseList"
>
<d-table class="jyh-table jyh-table-2" :header-bg="true" :data="ReleaseInfo.openSourceLicenseList">
<d-column type="index" header="序号" width="80"></d-column>
<!-- <d-column field="id" header="编号"></d-column>-->
<!-- <d-column field="id" header="编号"></d-column>-->
<d-column field="name" header="名称"></d-column>
<d-column field="description" header="描述"></d-column>
<!-- <d-column field="applicationScenario" header="应用场景"></d-column>-->
<!-- <d-column field="applicationScenario" header="应用场景"></d-column>-->
</d-table>
</div>
<!-- <d-row>-->
<!-- <d-col :span="24">-->
<!-- <span class="card-key width-140">主License分析报告</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">主License分析报告</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>
<Card simple class="jyh-card mb-4">
<div class="card-title">Copyright报告</div>
@@ -113,22 +114,27 @@
<d-table
class="jyh-table jyh-table-2"
:header-bg="true"
:data="ReleaseInfo.copyRightReportList"
:data="[
{
reportName: 'Copyright (c) Isaac Z. Schlueter and Contributors',
entryTime: '2025-03-20'
}
]"
>
<d-column field="reportName" header="Copyright报告">
<template #default="scope">
<a :href="scope.row.reportUrl">{{scope.row.reportName}}</a>
{{ scope.row.reportName }}
</template>
</d-column>
<d-column field="entryTime" header="录入时间"></d-column>
</d-table>
</div>
<!-- <d-row>-->
<!-- <d-col :span="24">-->
<!-- <span class="card-key width-140">主License分析报告</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">主License分析报告</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>
<Card simple class="jyh-card mb-4">
@@ -137,91 +143,27 @@
<d-table
class="jyh-table jyh-table-2"
:header-bg="true"
:data="ReleaseInfo.entityList"
:data="[
{
type: '二进制包',
entityPackageDownloadUrl: 'https://raw.gitcode.com/file/inherits/inherits.tar',
fileName: 'inherits.tar',
entryTime: '2025-03-20'
}
]"
>
<d-column field="type" header="类型"></d-column>
<d-column field="entityPackageDownloadUrl" header="实体包下载地址">
<template #default="scope">
<a :href="scope.row.entityPackageDownloadUrl">{{scope.row.entityPackageDownloadUrl}}</a>
{{ scope.row.entityPackageDownloadUrl }}
</template>
</d-column>
<d-column field="fileName" header="文件名称"></d-column>
<d-column field="entryTime" header="录入时间"></d-column>
<d-column field="integrityResult" header="完整性结果">
<template #default="scope">
<a @click="visible=true">{{scope.row.integrityResult}}</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">{{ ReleaseInfo.networkSecurity.softwareRating || '&#45;&#45;' }}</span>-->
<!-- </d-col>-->
<!-- </d-row>-->
<d-row class="mb-3">
<d-col :span="24">
<span class="card-key width-160">社区安全问题求助</span>
<a class="card-url" :href="ReleaseInfo.networkSecurity.communitySecurityHelpChannel || '--'">{{ ReleaseInfo.networkSecurity.communitySecurityHelpChannel || '--' }}</a>
</d-col>
</d-row>
<div class="mb-3 flex">
<span class="card-key width-160">官网漏洞披露地址</span>
<d-table
style="display: contents"
class="jyh-table jyh-table-2"
:header-bg="true"
:data="ReleaseInfo.networkSecurity.officialVulnerabilityDisclosureList"
>
<d-column field="id" header="编号"></d-column>
<d-column field="vendor" header="厂商"></d-column>
<d-column field="softwareName" header="软件名"></d-column>
<d-column field="source" header="来源"></d-column>
<d-column field="url" header="url">
<template #default="scope">
<a :href="scope.row.url">{{scope.row.url}}</a>
</template>
</d-column>
</d-table>
</div>
<div class="mb-3 flex">
<span class="card-key width-160">外部漏洞源的软件名称</span>
<d-table
style="display: contents"
class="jyh-table jyh-table-2"
:header-bg="true"
:data="ReleaseInfo.networkSecurity.externalVulnerabilityList"
>
<d-column field="id" header="编号"></d-column>
<d-column field="vendor" header="厂商"></d-column>
<d-column field="softwareName" header="软件名"></d-column>
<d-column field="source" header="来源"></d-column>
<d-column field="url" header="url">
<template #default="scope">
<a :href="scope.row.url">{{scope.row.url}}</a>
</template>
</d-column>
</d-table>
</div>
<d-row class="mb-3">
<d-col :span="24">
<span class="card-key width-160">是否涉及用户登录</span>
<span class="card-val">{{ ReleaseInfo.networkSecurity.isInvolvedUserLogin || '--' }}</span>
</d-col>
</d-row>
<d-row>
<d-col :span="24">
<span class="card-key width-160">兼容性风险描述</span>
<span class="card-val">{{ ReleaseInfo.networkSecurity.compatibilityRiskDescription || '--' }}</span>
</d-col>
</d-row>
</Card>
<d-modal
title="完整性结果详情"
v-model="visible"
@@ -229,7 +171,7 @@
:style="{ width: '800px', height: '400px' }"
@close="handleClose"
>
<Card simple class="jyh-card mb-4" style="box-shadow: none;padding: 0">
<Card simple class="jyh-card mb-4" style="box-shadow: none; padding: 0">
<d-row class="mb-3">
<d-col :span="24">
<span class="card-key width-160">社区哈希类型</span>
@@ -277,19 +219,17 @@
</d-row>
</Card>
<template #footer>
<d-modal-footer style="text-align: center;">
<d-button variant="solid" color="primary" @click="handleClose">确认</d-button>
<d-modal-footer style="text-align: center">
<d-button variant="solid" color="primary" @click="handleClose">确认</d-button>
<d-button @click="handleClose">取消</d-button>
</d-modal-footer>
</template>
</d-modal>
</div>
</template>
<script setup lang="ts">
import { ref, defineEmits, onMounted,reactive } from 'vue';
import { ref, defineEmits, onMounted, reactive } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { discussDetailType, userInfoType } from '@/api/discussion/types';
import { Message } from 'vue-devui/message';
@@ -304,8 +244,8 @@ 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 licenseTableData = ref([{ code: '05822156', name: 'MIT License', detail: 'integer' }]);
const CopyrightTableData = ref([{ code: '05822156', detail: 'integer' }]);
const visible = ref(false);
const ReleaseInfo = ref({
basicInfo: {},
@@ -313,16 +253,15 @@ const ReleaseInfo = ref({
entityList: [],
networkSecurity: {},
openSourceLicenseList: [],
referenceInfo: {},
referenceInfo: {}
});
const globalInfo = useGlobalInfoStore();
const industryList = ref(globalInfo.industryList);
const getIndustryName = (value) => {
const industry = industryList.value.find(item => item.value === value);
const industry = industryList.value.find((item) => item.value === value);
return industry ? industry.name : '未知行业'; // 如果找不到,返回默认值
};
const router = useRouter();
// 跳转
@@ -336,19 +275,18 @@ const gotoDetail = (row) => {
// 跳转
const handleClose = (row) => {
visible.value = false
visible.value = false;
};
const { copy } = useClipboard();
const handleCopy = event => {
const handleCopy = (event) => {
event.stopPropagation();
copy('');
Message.success('复制成功');
};
const getReleaseInfo = async(versionId) => {
const getReleaseInfo = async (versionId) => {
const { data, error } = await releaseInfo({ softwareId: versionId });
if (!error && data) {
ReleaseInfo.value = data.data;
@@ -361,7 +299,6 @@ onMounted(() => {
getReleaseInfo(versionId); // 调用接口获取数据
}
});
</script>
<style scoped lang="scss">
@@ -387,14 +324,13 @@ onMounted(() => {
line-height: 22px;
letter-spacing: 0px;
text-align: left;
}
.card-success {
display: inline-block;
border-radius: 4px;
background: #81C054;
color: #FFFFFF;
background: #81c054;
color: #ffffff;
font-family: HarmonyOS Sans SC;
font-weight: medium;
font-size: 12px;