card-anthology.blade.php 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. {{-- resources/views/components/ui/card-anthology.blade.php
  2. 文集卡片组件。横向布局:封面左 + 内容右。
  3. 用于 anthology/index 列表。
  4. Props:
  5. $item — 文集数据数组,包含以下字段:
  6. id, title, subtitle, description, cover_image, cover_gradient,
  7. author{name, avatar, color, initials},
  8. chapters[], children_number, updated_at
  9. $href — 卡片链接
  10. --}}
  11. @props([
  12. 'item',
  13. 'href',
  14. ])
  15. <a href="{{ $href }}" class="anthology-card">
  16. {{-- 封面 --}}
  17. <x-ui.book-cover
  18. :image="$item['cover_image'] ?? null"
  19. :gradient="$item['cover_gradient'] ?? ''"
  20. :title="$item['title']"
  21. :subtitle="$item['subtitle'] ?? ''"
  22. size="md"
  23. :style3d="false"
  24. />
  25. {{-- 内容 --}}
  26. <div class="anthology-card__body">
  27. <div class="anthology-card__title">{{ $item['title'] }}</div>
  28. @if(!empty($item['description']))
  29. <div class="anthology-card__desc">{{ $item['description'] }}</div>
  30. @endif
  31. <div class="anthology-card__author">
  32. <x-ui.author-avatar
  33. :avatar="$item['author']['avatar'] ?? null"
  34. :color="$item['author']['color'] ?? '#888'"
  35. :initials="$item['author']['initials'] ?? '?'"
  36. :name="$item['author']['name']"
  37. size="sm"
  38. />
  39. </div>
  40. @if(!empty($item['chapters']))
  41. <div class="anthology-card__tags">
  42. @foreach(array_slice($item['chapters'], 0, 4) as $ch)
  43. <span class="anthology-tag">{{ mb_strimwidth($ch, 0, 14, '…') }}</span>
  44. @endforeach
  45. @if($item['children_number'] > 4)
  46. <span class="anthology-tag anthology-tag--more">+{{ $item['children_number'] - 4 }} 章</span>
  47. @endif
  48. </div>
  49. @endif
  50. <div class="anthology-card__meta">
  51. <span class="anthology-meta-item">
  52. <i class="ti ti-calendar"></i>
  53. {{ $item['updated_at'] }}
  54. </span>
  55. <span class="anthology-meta-item">
  56. <i class="ti ti-file-text"></i>
  57. {{ $item['children_number'] }} 章节
  58. </span>
  59. </div>
  60. </div>
  61. </a>