519 lines
21 KiB
Vue
519 lines
21 KiB
Vue
<template>
|
||
<div class="version-info">
|
||
<Card simple class="jyh-card mb-4">
|
||
<div class="card-title">基本信息
|
||
<i @click="toggleCard('basic')" :class="isExpanded.basic ? 'icon icon-chevron-up-2 float-right': 'icon icon-chevron-down-2 float-right'"></i>
|
||
</div>
|
||
<div v-if="isExpanded.basic">
|
||
<d-row class="mb-3">
|
||
<d-col :span="8">
|
||
<span class="card-key width-90">软件名称</span>
|
||
<span class="card-val">{{ ReleaseInfo.basicInfo.softwareName || '--' }}</span>
|
||
</d-col>
|
||
<d-col :span="8">
|
||
<span class="card-key width-90">软件版本</span>
|
||
<span class="card-val">{{ ReleaseInfo.basicInfo.softwareVersion || '--' }}</span>
|
||
</d-col>
|
||
<d-col :span="8">
|
||
<span class="card-key width-90">主语言类型</span>
|
||
<span class="card-val">{{ ReleaseInfo.basicInfo.mainLanguageType || '--' }}</span>
|
||
</d-col>
|
||
</d-row>
|
||
<d-row>
|
||
<d-col :span="8">
|
||
<span class="card-key width-90">开发商</span>
|
||
<span class="card-val">{{ ReleaseInfo.basicInfo.developer || '--' }}</span>
|
||
</d-col>
|
||
<d-col :span="8">
|
||
<span class="card-key width-90">发布时间</span>
|
||
<span class="card-val">
|
||
{{ ReleaseInfo.basicInfo.releaseDate?dayjs(ReleaseInfo.basicInfo.releaseDate).format('YYYY-MM-DD') :'--' }}</span>
|
||
</d-col>
|
||
<!-- <d-col :span="8">-->
|
||
<!-- <span class="card-key width-90">版本描述</span>-->
|
||
<!-- <span class="card-val">{{ ReleaseInfo.basicInfo.versionDescription || '--' }}</span>-->
|
||
<!-- </d-col>-->
|
||
</d-row>
|
||
</div>
|
||
</Card>
|
||
|
||
<Card simple class="jyh-card mb-4">
|
||
<div class="card-title">参考信息
|
||
<i @click="toggleCard('reference')" :class="isExpanded.reference ? 'icon icon-chevron-up-2 float-right': 'icon icon-chevron-down-2 float-right'"></i>
|
||
</div>
|
||
<div v-if="isExpanded.reference">
|
||
<d-row class="mb-3">
|
||
<d-col :span="8">
|
||
<span class="card-key width-110">集成风险</span>
|
||
<d-tag color="#F6933B">{{ ReleaseInfo.referenceInfo.integrationRisk || jcfxList[ReleaseInfo.basicInfo.integrationRiskLevel] || '--' }}</d-tag>
|
||
<!-- <span class="card-val">{{ ReleaseInfo.referenceInfo.integrationRisk || ReleaseInfo.basicInfo.integrationRisk || '--' }}</span>-->
|
||
</d-col>
|
||
<d-col :span="8">
|
||
<span class="card-key width-110">代码量(L)</span>
|
||
<span class="card-val">{{ ReleaseInfo.referenceInfo.codeQuantity || '--' }}</span>
|
||
</d-col>
|
||
<d-col :span="8">
|
||
<span class="card-key width-110">漏洞数量</span>
|
||
<a style="cursor: pointer" @click="handleTabChange('ldxx')" class="card-url">
|
||
{{ ReleaseInfo.referenceInfo.vulnerabilityCount || '--' }}
|
||
</a>
|
||
</d-col>
|
||
</d-row>
|
||
<d-row class="mb-3">
|
||
<d-col :span="8">
|
||
<d-tooltip position="left" content="此内容由AI辅助生成">
|
||
<img
|
||
style="width: 14px; height: 14px;display: inline-block"
|
||
src="@/assets/imgs/jyh/aiLogo.png"
|
||
/>
|
||
</d-tooltip>
|
||
<span class="card-key width-110">社区EOL日期</span>
|
||
<span class="card-val">
|
||
{{ ReleaseInfo.criticalSoftwareAIGenerateInfo.communityEolDate?dayjs(ReleaseInfo.criticalSoftwareAIGenerateInfo.communityEolDate).format('YYYY-MM-DD') :'--' }}</span>
|
||
</d-col>
|
||
<d-col :span="8">
|
||
<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-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 || ReleaseInfo.basicInfo.sourceDownloadUrl || '--' }}</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 || ReleaseInfo.basicInfo.communityWebsite || '--' }}</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 || ReleaseInfo.basicInfo.eolNoticeUrl || '--' }}</a>-->
|
||
<!-- </d-col>-->
|
||
<!-- </d-row>-->
|
||
</div>
|
||
</Card>
|
||
|
||
<Card simple class="jyh-card mb-4">
|
||
<div class="card-title">
|
||
<d-tooltip position="left" content="此内容由AI辅助生成">
|
||
<img
|
||
style="width: 14px; height: 14px;display: inline-block"
|
||
src="@/assets/imgs/jyh/aiLogo.png"
|
||
/>
|
||
</d-tooltip>
|
||
开源主License信息
|
||
<i @click="toggleCard('license')" :class="isExpanded.license ? 'icon icon-chevron-up-2 float-right': 'icon icon-chevron-down-2 float-right'"></i>
|
||
|
||
</div>
|
||
<div v-if="isExpanded.license" class="mb-3">
|
||
<d-table class="jyh-table jyh-table-2" :header-bg="true"
|
||
:data="[
|
||
{ name: ReleaseInfo.basicInfo.mainLicenseName || ReleaseInfo.criticalSoftwareAIGenerateInfo.mainLicenseName,
|
||
description: ReleaseInfo.basicInfo.mainLicenseDescription || ReleaseInfo.criticalSoftwareAIGenerateInfo.mainLicenseDescription}
|
||
]">
|
||
<d-column type="index" header="序号" width="80"></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-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>-->
|
||
</Card>
|
||
<Card simple class="jyh-card mb-4">
|
||
<div class="card-title">
|
||
<d-tooltip position="left" content="此内容由AI辅助生成">
|
||
<img
|
||
style="width: 14px; height: 14px;display: inline-block"
|
||
src="@/assets/imgs/jyh/aiLogo.png"
|
||
/>
|
||
</d-tooltip>
|
||
Copyright报告
|
||
<i @click="toggleCard('copyright')" :class="isExpanded.copyright ? 'icon icon-chevron-up-2 float-right': 'icon icon-chevron-down-2 float-right'"></i>
|
||
|
||
</div>
|
||
<div v-if="isExpanded.copyright" class="mb-3">
|
||
<d-table
|
||
class="jyh-table jyh-table-2"
|
||
:header-bg="true"
|
||
:data="[
|
||
{
|
||
reportName: ReleaseInfo.basicInfo.copyrightReportName || ReleaseInfo.criticalSoftwareAIGenerateInfo.copyrightReportName,
|
||
reportUrl: ReleaseInfo.basicInfo.copyrightReportUrl || ReleaseInfo.criticalSoftwareAIGenerateInfo.copyrightReportUrl,
|
||
entryTime: ReleaseInfo.basicInfo.copyrightEntryTime || ReleaseInfo.criticalSoftwareAIGenerateInfo.copyrightEntryTime
|
||
}
|
||
]"
|
||
>
|
||
<d-column field="reportName" header="Copyright报告">
|
||
<template #default="scope">
|
||
<a :href="scope.row.reportUrl">{{ scope.row.reportName }}</a>
|
||
</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>-->
|
||
</Card>
|
||
|
||
<Card simple class="jyh-card mb-4">
|
||
<div class="card-title">实体
|
||
<i @click="toggleCard('entity')" :class="isExpanded.entity ? 'icon icon-chevron-up-2 float-right': 'icon icon-chevron-down-2 float-right'"></i>
|
||
</div>
|
||
<div v-if="isExpanded.entity">
|
||
<d-table
|
||
class="jyh-table jyh-table-2"
|
||
:header-bg="true"
|
||
:data="ReleaseInfo.entityInfoList"
|
||
>
|
||
<d-column field="entityType" header="类型"></d-column>
|
||
<d-column field="entityDownloadUrl" header="实体包下载地址">
|
||
<template #default="scope">
|
||
<a :href="scope.row.entityDownloadUrl" target="_blank">{{ scope.row.entityDownloadUrl }}</a>
|
||
</template>
|
||
</d-column>
|
||
<d-column field="entityFilename" header="文件名称"></d-column>
|
||
<d-column field="entryTime" header="录入时间"></d-column>
|
||
<d-column field="integrityCheckResult" header="完整性结果">
|
||
<template #default="scope">
|
||
<a @click="visible = true">{{ scope.row.integrityCheckResult }}</a>
|
||
</template>
|
||
</d-column>
|
||
</d-table>
|
||
</div>
|
||
</Card>
|
||
|
||
<Card simple class="jyh-card mb-4">
|
||
<div class="card-title">
|
||
<d-tooltip position="left" content="此内容由AI辅助生成">
|
||
<img
|
||
style="width: 14px; height: 14px;display: inline-block"
|
||
src="@/assets/imgs/jyh/aiLogo.png"
|
||
/>
|
||
</d-tooltip>
|
||
网络安全
|
||
<i @click="toggleCard('intSafe')" :class="isExpanded.intSafe ? 'icon icon-chevron-up-2 float-right': 'icon icon-chevron-down-2 float-right'"></i>
|
||
<!-- <span style="color: #3b82f6;font-size: 12px;font-weight: normal">(该数据由AI生成)</span>-->
|
||
</div>
|
||
<div v-if="isExpanded.intSafe">
|
||
<!-- <d-row class="mb-3">-->
|
||
<!-- <d-col :span="24">-->
|
||
<!-- <span class="card-key width-160">软件评分</span>-->
|
||
<!-- <span class="card-val">{{ ReleaseInfo.networkSecurity.softwareRating || '--' }}</span>-->
|
||
<!-- </d-col>-->
|
||
<!-- </d-row>-->
|
||
<d-row class="mb-3">
|
||
<d-col :span="24">
|
||
<d-tooltip position="left" content="此内容由AI辅助生成">
|
||
<img
|
||
style="width: 14px; height: 14px;display: inline-block"
|
||
src="@/assets/imgs/jyh/aiLogo.png"
|
||
/>
|
||
</d-tooltip>
|
||
<span class="card-key width-160">社区安全问题求助</span>
|
||
<a class="card-url" :href="ReleaseInfo.basicInfo.securityHelpChannel || ReleaseInfo.criticalSoftwareAIGenerateInfo.securityHelpChannel || ''" target="_blank">{{
|
||
ReleaseInfo.basicInfo.securityHelpChannel || ReleaseInfo.criticalSoftwareAIGenerateInfo.securityHelpChannel || '--'
|
||
}}</a>
|
||
</d-col>
|
||
</d-row>
|
||
<div class="mb-3 flex">
|
||
<d-tooltip position="left" content="此内容由AI辅助生成">
|
||
<img
|
||
style="width: 14px; height: 14px;display: inline-block"
|
||
src="@/assets/imgs/jyh/aiLogo.png"
|
||
/>
|
||
</d-tooltip>
|
||
<span class="card-key width-160">官网漏洞披露地址</span>
|
||
<d-table style="display: contents" class="jyh-table jyh-table-2" :header-bg="true" :data="vulnDisclosureUrl">
|
||
<!-- <d-column field="id" header="编号"></d-column> -->
|
||
<d-column field="厂商" header="厂商"></d-column>
|
||
<d-column field="软件名称" header="软件名称"></d-column>
|
||
<!-- <d-column field="source" header="来源"></d-column> -->
|
||
<d-column field="软件地址" header="来源url"> </d-column>
|
||
</d-table>
|
||
</div>
|
||
<div class="mb-3 flex">
|
||
<d-tooltip position="left" content="此内容由AI辅助生成">
|
||
<img
|
||
style="width: 14px; height: 14px;display: inline-block"
|
||
src="@/assets/imgs/jyh/aiLogo.png"
|
||
/>
|
||
</d-tooltip>
|
||
<span class="card-key width-160">外部漏洞源的软件名称</span>
|
||
<d-table
|
||
style="display: contents"
|
||
class="jyh-table jyh-table-2"
|
||
:header-bg="true"
|
||
:data="externalVulnSourceInfo"
|
||
>
|
||
<!-- <d-column field="id" header="编号"></d-column> -->
|
||
<d-column field="厂商" header="厂商"></d-column>
|
||
<d-column field="软件名称" header="软件名称"></d-column>
|
||
<!-- <d-column field="source" header="来源"></d-column> -->
|
||
<d-column field="软件地址" header="来源url"> </d-column>
|
||
</d-table>
|
||
</div>
|
||
<d-row class="mb-3">
|
||
<d-col :span="24">
|
||
<d-tooltip position="left" content="此内容由AI辅助生成">
|
||
<img
|
||
style="width: 14px; height: 14px;display: inline-block"
|
||
src="@/assets/imgs/jyh/aiLogo.png"
|
||
/>
|
||
</d-tooltip>
|
||
<span class="card-key width-160">是否涉及用户登录</span>
|
||
<span class="card-val">{{ securityInfoList.involvesUserLogin ? '是' : '否' }}</span>
|
||
</d-col>
|
||
</d-row>
|
||
<d-row>
|
||
<d-col :span="24">
|
||
<d-tooltip position="left" content="此内容由AI辅助生成">
|
||
<img
|
||
style="width: 14px; height: 14px;display: inline-block"
|
||
src="@/assets/imgs/jyh/aiLogo.png"
|
||
/>
|
||
</d-tooltip>
|
||
<span class="card-key width-160">是否安卓类APP组件</span>
|
||
<span class="card-val">{{ securityInfoList.isAndroidComponent ? '是' : '否' }}</span>
|
||
</d-col>
|
||
</d-row>
|
||
</div>
|
||
</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; padding: 0">
|
||
<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">sha5123b831bee9d575a2729065f830a65f830a65f83a65f852...</span>
|
||
<d-tooltip content="复制" :mouse-enter-delay="800">
|
||
<Icon name="icon-copy" class="ml-10 w-4 flex-shrink-0" color="#9FA7B3" @click="handleCopy" />
|
||
</d-tooltip>
|
||
</d-col>
|
||
</d-row>
|
||
<d-row class="mb-3">
|
||
<d-col :span="24">
|
||
<span class="card-key width-160">社区签名校验结果</span>
|
||
<span class="card-val card-success">通过</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>
|
||
<template #footer>
|
||
<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,computed,defineProps,toRef } from 'vue';
|
||
import { useRoute, useRouter } from 'vue-router';
|
||
import { discussDetailType, userInfoType } from '@/api/discussion/types';
|
||
import { Message } from 'vue-devui/message';
|
||
import { useClipboard } from '@vueuse/core/index';
|
||
import { releaseInfo } from '@/api/jyh';
|
||
import { useGlobalInfoStore } from '@/stores/Global';
|
||
import dayjs from 'dayjs';
|
||
const route = useRoute();
|
||
const emits = defineEmits(['changeTabs']);
|
||
const props = defineProps(['ReleaseInfo']);
|
||
// 触发事件的方法
|
||
const handleTabChange = (tabName) => {
|
||
emits('changeTabs', tabName); // 触发 changeTabs 事件，并传递参数
|
||
};
|
||
const jcfxList = ['','低','中','高'];
|
||
const visible = ref(false);
|
||
// 将 props.ReleaseInfo 转换为响应式引用
|
||
const ReleaseInfo = toRef(props, 'ReleaseInfo');
|
||
const globalInfo = useGlobalInfoStore();
|
||
const industryList = ref(globalInfo.industryList);
|
||
const getIndustryName = (value) => {
|
||
const industry = industryList.value.find((item) => item.value === value);
|
||
return industry ? industry.name : '未知行业'; // 如果找不到，返回默认值
|
||
};
|
||
|
||
// 定义每个 Card 的展开状态
|
||
const isExpanded = ref({
|
||
basic: false,
|
||
reference: false,
|
||
license: false,
|
||
copyright: false,
|
||
entity: false,
|
||
intSafe: false
|
||
});
|
||
|
||
// 切换 Card 展开状态
|
||
const toggleCard = (cardType) => {
|
||
isExpanded.value[cardType] = !isExpanded.value[cardType];
|
||
};
|
||
|
||
const securityInfoList = computed(() => {
|
||
if(ReleaseInfo.value.securityInfoList&&ReleaseInfo.value.securityInfoList.length>0) {
|
||
return ReleaseInfo.value.securityInfoList[0]
|
||
} else if(ReleaseInfo.value.softwareSecurityAIGenerateInfo&&ReleaseInfo.value.softwareSecurityAIGenerateInfo.length>0) {
|
||
return ReleaseInfo.value.softwareSecurityAIGenerateInfo[0]
|
||
} else {
|
||
return {}
|
||
}
|
||
});
|
||
|
||
const vulnDisclosureUrl = computed(() => {
|
||
if(ReleaseInfo.value.softwareSecurityAIGenerateInfo) {
|
||
const _vulnDisclosureUrl: any = JSON.parse(ReleaseInfo?.value.softwareSecurityAIGenerateInfo[0]?.vulnDisclosureUrl || '[]');
|
||
return _vulnDisclosureUrl || [];
|
||
} else {
|
||
return []
|
||
}
|
||
});
|
||
const externalVulnSourceInfo = computed(() => {
|
||
if(props.ReleaseInfo) {
|
||
const _vulnDisclosureUrl: any = JSON.parse(props.ReleaseInfo?.softwareSecurityAIGenerateInfo[0]?.externalVulnSourceInfo || '[]');
|
||
return _vulnDisclosureUrl || [];
|
||
} else {
|
||
return []
|
||
}
|
||
});
|
||
|
||
const router = useRouter();
|
||
|
||
// 跳转
|
||
const gotoDetail = (row) => {
|
||
// 后续请换成params，暂时params传参没传过去
|
||
router.push({
|
||
path: 'repoDetail/' + row.version,
|
||
params: { tab: 'ldxx' } // 指定需要激活的 Tab
|
||
});
|
||
};
|
||
|
||
// 跳转
|
||
const handleClose = (row) => {
|
||
visible.value = false;
|
||
};
|
||
|
||
const { copy } = useClipboard();
|
||
const handleCopy = (event) => {
|
||
event.stopPropagation();
|
||
|
||
copy('');
|
||
Message.success('复制成功');
|
||
};
|
||
|
||
const getReleaseInfo = async (versionId) => {
|
||
const { data, error } = await releaseInfo({ softwareId: versionId });
|
||
if (!error && data) {
|
||
ReleaseInfo.value = data.data;
|
||
}
|
||
};
|
||
|
||
onMounted(() => {
|
||
// const versionId = route.params.versionId; // 获取路由参数 versionId
|
||
// if (versionId) {
|
||
// getReleaseInfo(versionId); // 调用接口获取数据
|
||
// }
|
||
});
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
@import 'devui-theme/styles-var/devui-var.scss';
|
||
|
||
.jyh-card {
|
||
background: #F3F3F3 !important;
|
||
.card-title {
|
||
margin-bottom: 0 !important;
|
||
}
|
||
}
|
||
|
||
.card-key {
|
||
color: #777777;
|
||
font-family: HarmonyOS Sans SC;
|
||
font-weight: regular;
|
||
font-size: 14px;
|
||
line-height: 22px;
|
||
letter-spacing: 0px;
|
||
text-align: left;
|
||
width: 112px;
|
||
margin-right: 20px;
|
||
}
|
||
|
||
.card-val {
|
||
color: #191919;
|
||
font-family: HarmonyOS Sans SC;
|
||
font-weight: regular;
|
||
font-size: 14px;
|
||
line-height: 22px;
|
||
letter-spacing: 0px;
|
||
text-align: left;
|
||
}
|
||
|
||
.card-success {
|
||
display: inline-block;
|
||
border-radius: 4px;
|
||
background: #81c054;
|
||
color: #ffffff;
|
||
font-family: HarmonyOS Sans SC;
|
||
font-weight: medium;
|
||
font-size: 12px;
|
||
line-height: 20px;
|
||
height: 20px;
|
||
letter-spacing: 0px;
|
||
text-align: left;
|
||
padding: 0 8px;
|
||
}
|
||
</style>
|