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

@@ -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 {