cfy777/Situation-Awareness-Platform-Frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/master'

Browse Source
This commit is contained in:
付民康
2025-03-19 13:39:39 +08:00
parent 1c628d1538 de7093edb2
commit d63642d4d7
10 changed files with 282 additions and 247 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/api/jyh/index.ts
View File

@@ -103,9 +103,9 @@ export function getRepairInfo() {
url: '/api/v1/repo/repair/info',
method: 'POST',
data: {
current: 1,
size: 10,
softwareId: 47
"current": 1,
"size": 10,
"softwareId": 47
}
});
}
@@ -113,12 +113,12 @@ export function getRepairInfo() {
// 获取许可证列表
export function getLicenseList() {
return request({
url: '/api/v1/repo/license/list',
method: 'GET',
params: {
current: 1,
size: 10,
softwareId: 47
url: '/api/v1/repo/license/info',
method: 'POST',
data: {
"current": 1,
"size": 10,
"softwareId": 47
}
});
}
@@ -161,6 +161,18 @@ export const dependencyTree = (softwareId: any): Promise<any> => {
})
);
};
// 获取开发者社区信息
export const communityInfo = (softwareId: any): Promise<any> => {
return reqCatchV2(() =>
request({
url: `/api/v1/repo/community/info`,
method: 'POST',
data: {
softwareId
}
})
);
};
// 编辑用户信息（包含订阅默认预警方式）
export const userEdit = (data: any): Promise<any> => {

141
src/components/ChartLine/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<d-row class="mt-3">
<d-row class="mt-3" v-if="inited">
<d-col :span="12">
<d-chart :option="optionConChart" style="width: 100%; height: 400px"></d-chart>
<p class="text-center mt-translate-y">国家/地球分布</p>
@@ -11,80 +11,83 @@
</d-row>
</template>
<script setup>
import { ref, reactive } from 'vue';
<script setup lang="ts">
import { ref, reactive, computed } from 'vue';
import { DChart } from 'vue-devui/echarts';
const optionConChart = reactive({
tooltip: {
show: true,
trigger: 'item'
},
xAxis: {
type: 'category',
data: ['美国', '中国', '德国', '瑞士', '法国', '英国', '印度', '日本', '荷兰', '俄罗斯']
},
yAxis: {
// 给y轴添加单位后缀
axisLabel: {
formatter: '{value}%'
const inited = ref(false);
const props = withDefaults(
defineProps<{
companyGraph: Array<any>;
countryGraph: Array<any>;
}>(),
{
companyGraph: () => [],
countryGraph: () => []
}
);
const options = (x: any, y: any, color = '#2070F3') => {
return {
tooltip: {
show: true,
trigger: 'item'
},
name: '单位',
type: 'value'
},
series: [
{
data: [12, 14.8, 23.6, 18.6, 17.3, 13.1, 16, 11.8, 13.9, 16.4],
type: 'bar',
barWidth: '40%',
// 给label添加单位后缀
label: {
show: true,
position: 'top',
formatter: '{c}%'
xAxis: {
type: 'category',
data: x
},
yAxis: {
// 给y轴添加单位后缀
axisLabel: {
formatter: '{value}%'
},
itemStyle: {
color: '#2070F3',
borderRadius: [5, 5, 0, 0]
name: '单位',
type: 'value'
},
series: [
{
data: y,
type: 'bar',
barWidth: '40%',
// 给label添加单位后缀
label: {
show: true,
position: 'top',
formatter: '{c}%'
},
itemStyle: {
color,
borderRadius: [5, 5, 0, 0]
}
}
}
]
]
};
};
const optionConChart = computed(() => {
return options(
props.countryGraph.map((d) => d.name),
props.countryGraph.map((d) => d.value),
'#2070F3'
);
});
const optionOrgChart = computed(() => {
return options(
props.companyGraph.map((d) => d.name),
props.companyGraph.map((d) => d.value),
'#2CB8C9'
);
});
const optionOrgChart = reactive({
tooltip: {
show: true,
trigger: 'item'
},
xAxis: {
type: 'category',
data: ['公司1', '公司2', '公司3', '公司4', '公司5', '公司6', '公司7', '公司8', '公司9', '公司10']
},
yAxis: {
// 给y轴添加单位后缀
axisLabel: {
formatter: '{value}%'
},
name: '单位',
type: 'value'
},
series: [
{
data: [12, 14.8, 23.6, 18.6, 17.3, 13.1, 16, 11.8, 13.9, 16.4],
type: 'bar',
barWidth: '40%',
// 给label添加单位后缀
label: {
show: true,
position: 'top',
formatter: '{c}%'
},
itemStyle: {
color: '#2CB8C9',
borderRadius: [5, 5, 0, 0]
}
}
]
});
const onInited = () => {
setTimeout(() => {
inited.value = true;
}, 100);
};
// 向外暴露onInited方法
defineExpose({ onInited });
</script>
<style scoped lang="scss">

10
src/components/LicenseInfo/SidePanel.vue
View File

@@ -2,14 +2,14 @@
<d-layout class="dlayout">
<d-header class="dheader">
<div class="title">
<h1>Apache License 2.0</h1>
<h1>{{ data.licenseName }}</h1>
<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>
<d-tag color="#3ac295" size="sm">获准的</d-tag>
<d-tag color="#3ac295" size="sm">{{ data.category }}</d-tag>
</div>
</d-header>
<d-content class="dcontent">
@@ -78,7 +78,11 @@
<script setup>
import { ref, defineEmits } from 'vue';
const props = defineProps({
data: {
type: Object
}
})
const emit = defineEmits(['close']);
</script>

2
src/components/SettingTable/index.vue
View File

@@ -368,7 +368,7 @@ const columns = ref([
{ key: 'communityHash', label: '社区hash值', visible: false, filterable: false, sortable: false },
{ key: 'softwareScore', label: '软件评分', visible: false, filterable: false, sortable: true },
{ key: 'sourceCodeDownload', label: '源码包下载地址', visible: true, filterable: false, sortable: false },
{ key: 'copyright', label: 'CopyRight', visible: false, filterable: false, sortable: false },
{ key: 'copyright', label: 'Copyright', visible: false, filterable: false, sortable: false },
{ key: 'externalVulnerabilitySource', label: '外部漏洞源的软件名称', visible: false, filterable: true, sortable: false },
{ key: 'versionDescription', label: '版本描述', visible: false, filterable: false, sortable: false },
{ key: 'compatibilityRisk', label: '兼容性风险描述', visible: false, filterable: false, sortable: false },

77
src/views/Jyh/AIRepair/index.vue
View File

@@ -24,7 +24,7 @@
<div class="ai-panel-header-title">
<div>
<d-tag color="red-w98" class="mr-1" size="sm">严重</d-tag>
<span>Morgan</span>
<span>{{ rowItem.title }}</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">
@@ -44,9 +44,9 @@
</div>
<div>
<span class="weak-text">升级版本</span>
<span>xxx</span>
<span>1.7.0</span>
<img src="@/assets/imgs/jyh/ic_digital_power_next_step_@2x.png" class="icon-sm">
<span>xxx</span>
<span>1.9.1</span>
</div>
</div>
</div>
@@ -106,25 +106,27 @@ const tableConfig = ref([
const list = ref([
{
expand: true,
title: 'Morgan',
data: {
listData: [
{
{
securityProblemCode: '1',
type: '安全问题',
CWEcode: 'CWE-123',
score: 100
score: 70
},
{
securityProblemCode: '2',
type: '安全问题',
CWEcode: 'CWE-123',
score: 100
CWEcode: 'MIT-LICENSE',
score: 89
}
]
}
},
{
expand: true,
title: 'webpack',
data: {
listData: [
{
@@ -136,65 +138,8 @@ const list = ref([
{
securityProblemCode: '2',
type: '安全问题',
CWEcode: 'CWE-123',
score: 100
}
]
}
},
{
expand: true,
data: {
listData: [
{
securityProblemCode: '1',
type: '安全问题',
CWEcode: 'CWE-123',
score: 100
},
{
securityProblemCode: '2',
type: '安全问题',
CWEcode: 'CWE-123',
score: 100
}
]
}
},
{
expand: true,
data: {
listData: [
{
securityProblemCode: '1',
type: '安全问题',
CWEcode: 'CWE-123',
score: 100
},
{
securityProblemCode: '2',
type: '安全问题',
CWEcode: 'CWE-123',
score: 100
}
]
}
},
{
expand: true,
data: {
listData: [
{
securityProblemCode: '1',
type: '安全问题',
CWEcode: 'CWE-123',
score: 100
},
{
securityProblemCode: '2',
type: '安全问题',
CWEcode: 'CWE-123',
score: 100
CWEcode: 'MIT-LICENSE',
score: 90
}
]
}

159
src/views/Jyh/Home/index.vue
View File

@@ -6,8 +6,14 @@
<h1>可信开源代码库</h1>
</div>
<div class="home-search" ref="homeSearch" :class="{ 'glow-border': inputGlow }">
<d-input ref="searchInput" placeholder="请输入搜索关键字" @focus="inputFocus" @blur="inputBlur" :autocomplete="'off'"
v-model="searchStr">
<d-input
ref="searchInput"
placeholder="请输入搜索关键字"
@focus="inputFocus"
@blur="inputBlur"
:autocomplete="'off'"
v-model="searchStr"
>
<template #prepend>
<d-dropdown @toggle="onCateToggle($event)">
<div class="flex items-center gap-1 cursor-pointer">
@@ -25,7 +31,7 @@
<template #menu>
<ul class="list-menu">
<li class="menu-item" v-for="option in industryOptions" @click="onCategoryChange(option)">
{{ option }}
{{ option }}
</li>
</ul>
</template>
@@ -36,15 +42,20 @@
</template>
<template #append>
<div class="advanced-search" @click="openAdvancedSearch">
<span>高级筛选</span>
<d-badge :count="6" :bg-color="'#f0f0f0'"></d-badge>
<d-icon :rotate="rotate" name="icon-chevron-down-2"></d-icon>
</div>
<span>高级筛选</span>
<d-badge :count="6" :bg-color="'#f0f0f0'"></d-badge>
<d-icon :rotate="rotate" name="icon-chevron-down-2"></d-icon>
</div>
</template>
</d-input>
<d-dropdown-menu v-model="isOpen" :origin="searchInput?.$el" close-scope="'blank'"
:offset="offset" :clickOutside="closeOutside">
<div class="advanced-search-menu" :style="{ width: dropdownWidth + 'px'}">
<d-dropdown-menu
v-model="isOpen"
:origin="searchInput?.$el"
close-scope="'blank'"
:offset="offset"
:clickOutside="closeOutside"
>
<div class="advanced-search-menu" :style="{ width: dropdownWidth + 'px' }">
<AdvanceSearch @submit="submit($event)" @cancel="isOpen = false" class="p-20" :layout="'vertical'">
<template #title>
<span class="title">高级筛选</span>
@@ -54,28 +65,35 @@
</d-dropdown-menu>
<d-button color="primary" variant="solid" @click="search">搜索</d-button>
</div>
<d-button @click="check" ref="origin" icon="share" class="batch-btn">批量校验</d-button>
<d-button v-if="isLogin" @click="check" ref="origin" icon="share" class="batch-btn">批量校验</d-button>
<div class="home-information">
<div class="info-title">
<div class="sub-title">
<img src="@/assets/imgs/home/informIcon@2x.png">
<img src="@/assets/imgs/home/informIcon@2x.png" />
<span>预警公告</span>
</div>
<a class="devui-link" @click="checkMore">更多 ></a>
<a v-if="isLogin" class="devui-link" @click="checkMore">更多 ></a>
</div>
<div class="info-content">
<d-timeline :direction="'vertical'" :time-position="'right'" :position="'right'">
<d-timeline-item v-for="(item, index) in infoList" :key="index"
:dot-color="item.dotColor" :line-color="'var(--devui-form-control-line-hover)'">
<d-timeline-item
v-for="(item, index) in infoList"
:key="index"
:dot-color="item.dotColor"
:line-color="'var(--devui-form-control-line-hover)'"
>
<template #default>
<div class="flex items-center justify-between w-full">
<div class="cursor-pointer notice-content flex gap-2 items-center" @click="openWarningDetail(item, index)">
<div
class="cursor-pointer notice-content flex gap-2 items-center"
@click="openWarningDetail(item, index)"
>
<span>{{ item.subject }}</span>
<d-tag :color="tagMap[item.importance]" size="sm">{{ item.importance }}</d-tag>
<d-tag v-if="item.importance" :color="tagMap[item.importance].color" size="sm">{{ tagMap[item.importance].text }}</d-tag>
</div>
<div class="time-container">
<d-icon name="icon-time"></d-icon>
{{ item.pulishTime }}
{{ item.publishTime }}
</div>
</div>
</template>
@@ -89,7 +107,7 @@
</div>
</div>
<d-modal class="warning-modal" v-model="warningModalVisable" title="" style="width: 600px;">
<d-modal class="warning-modal" v-model="warningModalVisable" title="" style="width: 600px">
<EarlyWarningDetail :warningData="currentWarning" :type="'user'"></EarlyWarningDetail>
</d-modal>
</template>
@@ -98,22 +116,25 @@
import { ref, onMounted, onBeforeUnmount } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import AdvanceSearch from '@/components/AdvanceSearch/index.vue';
import { getHomeNoticeList } from '@/api/jyh'
import { getHomeNoticeList } from '@/api/jyh';
import EarlyWarningDetail from '@/views/Jyh/PersonalCenter/Detail/EarlyWarningDetail.vue';
import { useDiscussGetUserInfo } from '@/api/discussion/hook';
// 获取当前用户信息 & 是否登录
const { isLogin = false, userInfo = {}} = useDiscussGetUserInfo();
const route = useRoute();
const router = useRouter();
const inputGlow = ref(false);
const searchStr = ref('');
const position = ref(['right-start', 'right-end']);
const industryOptions = ref(['通信', '军工', '金融', '能源'])
const industryOptions = ref(['通信', '军工', '金融', '能源']);
const searchType = ref('软件');
const searchOptions = ref(['软件']);
const offset = ref({ mainAxis: 7 , crossAxis: -10 });
const offset = ref({ mainAxis: 7, crossAxis: -10 });
const isOpen = ref(false);
const rotate = ref(0);
const cateRotate = ref(0);
const infoList = ref([])
const infoList = ref([]);
const warningModalVisable = ref(false);
const currentWarning = ref();
@@ -121,9 +142,22 @@ const homeSearch = ref(null);
const dropdownWidth = ref(0);
const selectedCate = ref('软件');
const tagMap = {
'高': '#f66f6a',
'中': '#fac20a',
'低': '#5e7ce0'
'Critical': {
text: '致命',
color: '#c7000b'
},
'High': {
text: '高',
color: '#f66f6a'
},
'Medium': {
text: '中',
color: '#fac20a'
},
'Low': {
text: '低',
color: '#5e7ce0'
}
}
const searchInput = ref(null);
@@ -136,17 +170,17 @@ const openAdvancedSearch = () => {
const check = () => {
router.push({
name: 'Search',
query: { tab: 'BatchVerify' }, // 通过查询参数指定 Tab
query: { tab: 'BatchVerify' } // 通过查询参数指定 Tab
});
}
};
const closeOutside = () => {
return false
}
return false;
};
const submit = (formData) => {
isOpen.value = false;
router.push({ name: 'Search', query: { searchWord: searchStr, ...formData, searchType: selectedCate.value}});
router.push({ name: 'Search', query: { searchWord: searchStr, ...formData, searchType: selectedCate.value } });
};
const inputFocus = () => {
@@ -155,7 +189,7 @@ const inputFocus = () => {
const inputBlur = () => {
inputGlow.value = false;
}
};
const updateDropdownWidth = () => {
if (homeSearch.value) {
@@ -164,20 +198,20 @@ const updateDropdownWidth = () => {
};
const search = () => {
router.push({ name: 'Search', query: { searchWord: searchStr.value, searchType: selectedCate.value}});
router.push({ name: 'Search', query: { searchWord: searchStr.value, searchType: selectedCate.value } });
};
const onCategoryChange = (cate) => {
selectedCate.value = cate;
}
};
const onCateToggle = (event) => {
cateRotate.value = event ? 180 : 0;
}
};
const checkMore = () => {
router.push({ name: 'PersonalCenter' });
}
};
const openWarningDetail = (event, index) => {
infoList.value.forEach((item, i) => {
@@ -186,11 +220,11 @@ const openWarningDetail = (event, index) => {
} else {
item.dotColor = '';
}
})
});
warningModalVisable.value = true;
currentWarning.value = event;
}
};
let resizeObserver: ResizeObserver | null = null;
@@ -209,15 +243,14 @@ onBeforeUnmount(() => {
}
});
const getNoticeList = async() => {
const res:any = await getHomeNoticeList();
const getNoticeList = async () => {
const res: any = await getHomeNoticeList();
if (!res.error) {
infoList.value = res.data.data;
}
}
};
getNoticeList();
</script>
<style scoped lang="scss">
@@ -232,10 +265,8 @@ getNoticeList();
position: relative;
overflow: hidden;
.home-content {
font-size: 14px;
height: 50%;
width: 50%;
display: flex;
flex-direction: column;
@@ -245,6 +276,7 @@ getNoticeList();
.home-title {
display: flex;
flex-shrink: 0;
justify-content: center;
align-items: center;
gap: 20px;
@@ -262,6 +294,7 @@ getNoticeList();
.home-search {
width: 100%;
height: 40px;
flex-shrink: 0;
background-color: white;
border-radius: 10px;
display: flex;
@@ -312,6 +345,7 @@ getNoticeList();
.batch-btn {
color: $devui-aide-text;
width: 150px;
flex-shrink: 0;
background-color: #f0f0f0;
border-color: $devui-aide-text;
}
@@ -319,6 +353,8 @@ getNoticeList();
.home-information {
width: 100%;
background-color: #f0f0f0;
overflow: auto;
margin-bottom: 20px;
border-radius: 10px;
padding: 12px;
@@ -363,27 +399,27 @@ getNoticeList();
.glow-border {
border: 1px solid var(--devui-form-control-line, #d7d8da);
border-color: var(--devui-form-control-line-active, #5e7ce0) !important;
box-shadow: 0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, .08));
box-shadow: 0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, 0.08));
transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.menu-item {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
padding: 4px;
cursor: pointer;
&:hover {
background-color: var(--devui-list-item-hover-bg, #f2f5fc);
color: var(--devui-list-item-hover-text, #526ecc);
}
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
padding: 4px;
cursor: pointer;
&:hover {
background-color: var(--devui-list-item-hover-bg, #f2f5fc);
color: var(--devui-list-item-hover-text, #526ecc);
}
}
.list-menu {
padding: 8px;
margin: 0;
width: 100px;
padding: 8px;
margin: 0;
width: 100px;
}
.title {
@@ -408,8 +444,11 @@ getNoticeList();
display: flex;
align-items: center;
gap: 8px;
width: 120px;
width: 150px;
flex-shrink: 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
:deep(.devui-timeline-item-data-right) {
@@ -423,4 +462,4 @@ getNoticeList();
padding: 0px !important;
}
}
</style>
</style>

71
src/views/Jyh/LicenseInfo/index.vue
View File

@@ -4,12 +4,15 @@
<d-layout>
<d-content class="dcontent">
<d-table :data="list" style="width: 100%;">
<template #empty>
<NoData></NoData>
</template>
<d-column type="index" width="40"></d-column>
<d-column v-for="(column, index) in tableConfig" :field="column.field"
:header="column.header" :sortable="column.sortable" :sort-method="column.sortMethod"></d-column>
<d-column header="详情" width="100px">
<template #default="scope">
<a class="devui-link" @click="openPanel">查看</a>
<a class="devui-link" @click="openPanel(scope.row)">查看</a>
</template>
</d-column>
</d-table>
@@ -30,7 +33,7 @@
</div>
</div>
<d-drawer v-model="showDetail" style="width: 800px; padding: 20px" >
<SidePanel @close="close"/>
<SidePanel :data="currentData" @close="close"/>
</d-drawer>
</template>
@@ -38,6 +41,8 @@
import { ref } from 'vue';
import SidePanel from '@/components/LicenseInfo/SidePanel.vue';
import { getLicenseList } from '@/api/jyh';
import NoData from '@/components/NoData/NoData.vue';
const currentData = ref(null);
const pager = ref({
pageIndex: 1,
pageSize: 30,
@@ -52,7 +57,8 @@ const close = () => {
showDetail.value = false;
}
const openPanel = () => {
const openPanel = (row) => {
currentData.value = row
showDetail.value = true;
}
@@ -64,7 +70,7 @@ const tableConfig = ref([
sortMethod: null
},
{
field: 'licenseType',
field: 'category',
header: '许可证种类',
sortable: false,
sortMethod: null
@@ -84,34 +90,41 @@ const tableConfig = ref([
])
const list = ref([
{
licenseName: 'Apache License 2.0',
licenseType: '获准的',
affectedComponent: 'org.apache.commons:commons-collections4',
version: '4.4',
},
{
licenseName: 'Apache License 2.0',
licenseType: '获准的',
affectedComponent: 'org.apache.commons:commons-collections4',
version: '4.4',
},
{
licenseName: 'Apache License 2.0',
licenseType: '获准的',
affectedComponent: 'org.apache.commons:commons-collections4',
version: '4.4',
},
{
licenseName: 'Apache License 2.0',
licenseType: '获准的',
affectedComponent: 'org.apache.commons:commons-collections4',
version: '4.4',
}
// {
// licenseName: 'Apache License 2.0',
// licenseType: '获准的',
// affectedComponent: 'org.apache.commons:commons-collections4',
// version: '4.4',
// },
// {
// licenseName: 'Apache License 2.0',
// licenseType: '获准的',
// affectedComponent: 'org.apache.commons:commons-collections4',
// version: '4.4',
// },
// {
// licenseName: 'Apache License 2.0',
// licenseType: '获准的',
// affectedComponent: 'org.apache.commons:commons-collections4',
// version: '4.4',
// },
// {
// licenseName: 'Apache License 2.0',
// licenseType: '获准的',
// affectedComponent: 'org.apache.commons:commons-collections4',
// version: '4.4',
// }
])
const getList = async() => {
const res = await getLicenseList()
const res: any = await getLicenseList();
if (!res.error) {
console.log(res);
list.value = res.data.data.records;
pager.value.total = res.data.data.records.length;
} else {
list.value = [];
}
}
getList();
</script>

2
src/views/Jyh/Search/Components/OssQuery.vue
View File

@@ -181,7 +181,7 @@ const columns = ref([
{ key: 'contributorCountries', label: '贡献者国家/地区分布', visible: false, filterable: false, sortable: false },
{ key: 'contributorOrganizations', label: '贡献者组织/公司分布', visible: false, filterable: false, sortable: false },
{ key: 'communityHash', label: '社区hash值', visible: false, filterable: false, sortable: false },
{ key: 'copyright', label: 'CopyRight', visible: false, filterable: false, sortable: false },
{ key: 'copyright', label: 'Copyright', visible: false, filterable: false, sortable: false },
{ key: 'externalVulnerabilitySource', label: '外部漏洞源的软件名称', visible: false, filterable: true, sortable: false },
{ key: 'versionDescription', label: '版本描述', visible: false, filterable: false, sortable: false },
{ key: 'compatibilityRisk', label: '兼容性风险描述', visible: false, filterable: false, sortable: false },

27
src/views/Jyh/Version/Detail/CommunityInfo.vue
View File

@@ -5,25 +5,22 @@
<d-row class="mb-3">
<d-col :span="8">
<span class="card-key width-90">社区名称</span>
<span class="card-val">开发者社区</span>
<span class="card-val">{{ infos.communityName }}</span>
</d-col>
<d-col :span="8">
<span class="card-key width-90">官网地址</span>
<span class="card-val">https://www.huaweicloud.com</span>
<span class="card-val">{{ infos.communityWebsite }}</span>
</d-col>
<d-col :span="8">
<span class="card-key width-90">联系方式</span>
<span class="card-val">950808-1</span>
<span class="card-val">{{ infos.communityContact }}</span>
</d-col>
</d-row>
<d-row class="mb-3">
<d-col :span="24">
<div class="flex">
<span class="card-key width-90 flex-shrink-0">社区描述</span>
<span class="card-val flex-grow-1"
>华为开发者社区致力于打造华为开发者专属的官方技术交流平台，帮助开发者探索开发实践、交流心得经验、获悉业界动态、解决开发问题。汇聚华为云社区“华为云”领域博
客、问答、视频等精彩内容，形成开发者和技术爱好者交流与分享主阵地。</span
>
<span class="card-val flex-grow-1">{{ infos.communityDescription }}</span>
</div>
</d-col>
</d-row>
@@ -32,14 +29,28 @@
<div class="card-title">贡献者分布</div>
<p class="card-desc">有关Pull Request创建者的公司信息和地区分布(使用公共GitHub信息进行分析)</p>
<div class="mt-3">
<chart-line />
<chart-line ref="chartLine" :companyGraph="infos.companyGraph" :countryGraph="infos.countryGraph" />
</div>
</Card>
</div>
</template>
<script setup>
import { ref, reactive, onMounted } from 'vue';
import SBOMDetail from './SBOMDetail.vue';
import { communityInfo } from '@/api/jyh';
import { useRoute } from 'vue-router';
import ChartLine from '@/components/ChartLine/index.vue';
const route = useRoute(); // 获取路由对象
const chartLine = ref();
const infos = ref({});
onMounted(async () => {
const { data } = await communityInfo(Number(route.params.versionId));
infos.value = data?.data?.data || {};
chartLine.value.onInited();
});
</script>
<style scoped lang="scss">

10
src/views/Jyh/Version/Detail/SBOM.vue
View File

@@ -20,9 +20,13 @@
</d-drawer>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue';
import { ref, reactive, onMounted } from 'vue';
import SBOMDetail from './SBOMDetail.vue';
import { dependencyTree } from '@/api/jyh';
import { useRoute } from 'vue-router';
const checked = ref(false);
const route = useRoute(); // 获取路由对象
const showDetail = ref(false);
const baseTreeTableData1 = ref([
@@ -84,6 +88,10 @@ const baseTreeTableData1 = ref([
const treeCheckChange = (val, row, selection) => {
console.log('treeCheckChange', selection);
};
onMounted(async () => {
await dependencyTree(Number(route.params.versionId));
});
</script>
<style scoped lang="scss">