xiaoyu/topfans
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:选择作品的等级图标

Browse Source
This commit is contained in:
zerosaturation 2026-05-21 14:16:10 +08:00
parent ff22b29ede
commit c76d779f4e
1 changed files with 21 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
frontend/pages/components/AssetSelector.vue
View File

@ -51,7 +51,7 @@
:src="getGradeBackground(gradeItem.grade)" :src="getGradeBackground(gradeItem.grade)"
mode="aspectFill" mode="aspectFill"
></image> ></image>
<text class="grade-title">{{ formatGrade(gradeItem.grade) }}</text> <!-- <text class="grade-title">{{ formatGrade(gradeItem.grade) }}</text> -->
</view> </view>
<scroll-view class="asset-row" scroll-x :show-scrollbar="false" :enable-flex="true"> <scroll-view class="asset-row" scroll-x :show-scrollbar="false" :enable-flex="true">
<view class="asset-row-content"> <view class="asset-row-content">
@ -202,20 +202,22 @@ const currentItems = computed(() => {
}); });
// grade 中文转换 // grade 中文转换
const gradeMap = { 1: '一', 2: '二', 3: '三', 4: '四', 5: '五' }; // const gradeMap = { 1: '一', 2: '二', 3: '三', 4: '四', 5: '五' };
const formatGrade = (grade) => `V${grade}`; // const formatGrade = (grade) => `V${grade}`;
// 获取等级背景图 // 获取等级背景图
const getGradeBackground = (grade) => { const gradeMap = {
if (grade <= 2) { 1: '/static/starbookcontent/grade/Ndengji.png',
return '/static/starbookcontent/V1dengji.png'; 2: '/static/starbookcontent/grade/Rdengji.png',
} else if (grade <= 4) { 3: '/static/starbookcontent/grade/SRdengji.png',
return '/static/starbookcontent/V2dengji.png'; 4: '/static/starbookcontent/grade/SSRdengji.png',
} else { 5: '/static/starbookcontent/grade/URengji.png',
return '/static/starbookcontent/V3dengji.png';
}
}; };
function getGradeBackground(grade) {
return gradeMap[grade] || gradeMap[1];
}
// 切换类型 // 切换类型
const switchType = (type) => { const switchType = (type) => {
currentType.value = type; currentType.value = type;
@ -485,30 +487,20 @@ const handleTouchEnd = (e) => {
} }
.grade-section { .grade-section {
background: #f0839960;
border-radius: 16rpx; border-radius: 16rpx;
padding: 20rpx; padding:0 20rpx;
margin-bottom: 20rpx;
} }
.grade-header { .grade-header {
position: relative; position: relative;
margin-bottom: 16rpx; /* width: 160rpx; */
padding: 16rpx 24rpx; height: 80rpx;
display: inline-flex;
align-items: center;
justify-content: center;
width: 160rpx;
height: 32rpx;
} }
.grade-header-bg { .grade-header-bg {
position: absolute; width: 80rpx;
top: 0; height: 80rpx;
left: 0;
width: 160rpx;
height: 64rpx;
z-index: 0;
} }
.grade-title { .grade-title {
@ -523,6 +515,8 @@ const handleTouchEnd = (e) => {
width: 100%; width: 100%;
height: 288rpx; height: 288rpx;
white-space: nowrap; white-space: nowrap;
background: #f0839960;
padding: 0.5rem;
} }
.asset-row::-webkit-scrollbar { .asset-row::-webkit-scrollbar {