ethan.chen/score-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: implement MediaFormModal for adding new media entries, update Media interface to make 'id' optional, and refactor MediaItem to use utility for star ratings

Browse Source
This commit is contained in:
ethan.chen
2025-05-26 18:25:23 +08:00
parent 345f4e995f
commit 6d07c482db
5 changed files with 239 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/lib/MediaItem.svelte
View File

@@ -12,36 +12,7 @@
};
// 星星评分组件
function StarRating({ rating }: { rating: number }) {
const maxStars = 5;
const stars = [];
for (let i = 1; i <= maxStars; i++) {
const fill = i <= Math.floor(rating) ? '#FFD700' : 'white';
const isHalfStar = i - 0.5 <= rating && rating < i;
if (isHalfStar) {
stars.push(`
<div class="relative w-4 h-4">
<svg class="absolute w-4 h-4" viewBox="0 0 24 24" fill="white" stroke="currentColor">
<path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>
</svg>
<svg class="absolute w-4 h-4" viewBox="0 0 24 24" fill="#FFD700" stroke="currentColor" style="clip-path: inset(0 50% 0 0)">
<path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>
</svg>
</div>
`);
} else {
stars.push(`
<svg class="w-4 h-4" viewBox="0 0 24 24" fill="${fill}" stroke="currentColor">
<path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>
</svg>
`);
}
}
return stars.join('');
}
import { StarRating } from './utils';
</script>
<div class="border rounded-lg p-4 hover:bg-gray-50" transition:fade>
@@ -62,7 +33,7 @@
<div class="px-2 py-1 bg-gray-100 rounded text-sm text-gray-700 flex items-center gap-1">
<span>评分：</span>
<div class="flex items-center">
{@html StarRating({ rating: media.rating / 2 })}
{@html StarRating(media.rating / 2)}
</div>
<span class="ml-1">({media.rating}/10)</span>
</div>