style:审核详情表格用 text展示。优化 UI样式

This commit is contained in:
Wei_佳 2025-11-26 10:55:44 +08:00
parent 0694ec28fb
commit 2b917878ee
2 changed files with 79 additions and 7 deletions

View File

@ -74,7 +74,8 @@ const detailSections = computed(() => {
fields: [
{ label: '近12个月机构营收/万元', type: 'text', value: formatNumberValue(detail.annual_revenue) },
{ label: '近12个月机构研发投入/万元', type: 'text', value: formatNumberValue(detail.rd_investment) },
{ label: '近三年机构收益/万元', type: 'list', value: formatThreeYearIncome(detail.three_year_income) },
{ label: '近三年机构收益/万元', type: 'text', value: formatThreeYearIncome(detail.three_year_income) },
// { label: '/', type: 'list', value: formatThreeYearIncome(detail.three_year_income) },
{ label: '资产受资助情况', type: 'text', value: detail.funding_status || '-' },
],
},
@ -85,13 +86,15 @@ const detailSections = computed(() => {
{ label: '非遗传承人等级', type: 'text', value: detail.inheritor_level || '-' },
{
label: '非遗传承人年龄水平及数量',
type: 'list',
type: 'text',
// type: 'list',
value: formatAgeDistribution(detail.inheritor_age_count || detail.inheritor_ages),
},
{ label: '非遗传承人等级证书', type: 'images', value: detail.inheritor_certificates || [] },
{ label: '非遗等级', type: 'text', value: detail.heritage_level || detail.heritage_asset_level || '-' },
{ label: '非遗资产所用专利的申请号', type: 'text', value: detail.patent_application_no || '-' },
{ label: '非遗资产历史证明证据及数量', type: 'list', value: formatHistoricalEvidence(detail.historical_evidence) },
{ label: '非遗资产历史证明证据及数量', type: 'text', value: formatHistoricalEvidence(detail.historical_evidence) },
// { label: '', type: 'list', value: formatHistoricalEvidence(detail.historical_evidence) },
{
label: '非遗资产所用专利/纹样图片',
type: 'images',
@ -111,7 +114,8 @@ const detailSections = computed(() => {
type: 'text',
value: formatNumberValue(detail.offline_activities ?? detail.offline_teaching_count),
},
{ label: '线上相关宣传账号信息', type: 'list', value: formatPlatformAccounts(detail.platform_accounts) },
{ label: '线上相关宣传账号信息', type: 'text', value: formatPlatformAccounts(detail.platform_accounts) },
// { label: '线', type: 'list', value: formatPlatformAccounts(detail.platform_accounts) },
],
},
{

View File

@ -521,9 +521,16 @@
<div style="font-size: 20px; color: #303133; line-height: 20px;">
最终评估结果
</div>
<div style="display: flex; justify-content: center; margin-top: 10px;">
<div style="border-radius: 4px; width: 125px; height: 28px; font-size: 14px; color: #303133; font-weight: normal; background: #A3011332; line-height: 28px;">评估可信度=95%</div>
<div style="border-radius: 4px; width: 125px; height: 28px; font-size: 14px; color: #303133; font-weight: normal; background: #A3011332; margin-left: 10px; line-height: 28px;">动态质押率=50%</div>
<div style="display: flex; justify-content: center; align-items: center; margin-top: 10px;">
<div class="credibility-badge">
<span class="credibility-label">评估可信度</span>
<div class="credibility-stars" aria-hidden="true">
<span class="stars-base"></span>
<span class="stars-fill" :style="{ width: '95%' }"></span>
</div>
<span class="credibility-percent">95%</span>
</div>
<div class="secondary-badge">动态质押率=50%</div>
</div>
</div>
<div style="display: flex; margin: auto; margin-top: 24px; width: 1010px;">
@ -1538,6 +1545,67 @@ onMounted(async () => {
font-weight: bold;
text-align: center;
}
.credibility-badge{
display: inline-flex;
align-items: center;
gap: 10px;
padding: 8px 14px;
min-width: 240px;
height: 36px;
background: linear-gradient(180deg, #F1E4E4 0%, #EAD7D7 100%);
border-radius: 12px;
box-shadow: 0 6px 16px rgba(163, 1, 19, 0.08);
color: #4F4F4F;
font-size: 14px;
font-weight: 500;
}
.credibility-label{
color: #595959;
}
.credibility-stars{
display: flex;
position: relative;
width: 100px;
height: 18px;
align-items: center;
}
.stars-base,
.stars-fill{
font-size: 18px;
line-height: 1;
letter-spacing: 3px;
}
.stars-base{
color: #D0D0D0;
}
.stars-fill{
position: absolute;
left: 0;
top: 0;
color: #A30D15;
overflow: hidden;
white-space: nowrap;
}
.credibility-percent{
color: #595959;
font-weight: 600;
letter-spacing: 0.2px;
}
.secondary-badge{
display: inline-flex;
align-items: center;
justify-content: center;
margin-left: 14px;
padding: 8px 14px;
min-width: 170px;
height: 36px;
background: linear-gradient(180deg, #E7EBF3 0%, #DCE2EE 100%);
border-radius: 12px;
box-shadow: 0 6px 16px rgba(22, 93, 255, 0.06);
color: #5A5A5A;
font-size: 14px;
font-weight: 500;
}
.score-box{
padding: 30px;
width: 320px;