feat: 添加内容创建时间字段,优化内容列表和详情视图,更新价格获取逻辑
This commit is contained in:
@@ -61,73 +61,96 @@
|
||||
<!-- Info -->
|
||||
<div class="flex-1 min-w-0 flex flex-col justify-between">
|
||||
<div>
|
||||
<div class="flex items-center justify-between mb-2">
|
||||
<div class="flex items-center gap-2">
|
||||
<span v-if="item.is_pinned" class="bg-red-600 text-white text-xs px-1.5 py-0.5 rounded font-bold">置顶</span>
|
||||
<span class="text-xs px-1.5 py-0.5 border rounded text-slate-500" v-if="item.genre">[{{ getGenreLabel(item.genre) }}]</span>
|
||||
<span class="text-xs px-1.5 py-0.5 border rounded text-slate-500" v-if="item.key">[{{ item.key }}]</span>
|
||||
<h3
|
||||
class="font-bold text-slate-900 text-lg truncate hover:text-primary-600 cursor-pointer transition-colors"
|
||||
@click="$router.push(`/creator/contents/${item.id}`)">
|
||||
{{ item.title }}</h3>
|
||||
</div>
|
||||
<!-- Status Badge -->
|
||||
<div class="flex items-center gap-2">
|
||||
<span v-if="item.status === 'blocked'"
|
||||
class="text-red-500 text-xs flex items-center gap-1 cursor-help" title="已被封禁">
|
||||
<i class="pi pi-info-circle"></i> 封禁
|
||||
</span>
|
||||
<span class="px-2.5 py-1 rounded text-xs font-bold"
|
||||
:class="statusStyle(item.status).bg + ' ' + statusStyle(item.status).text">
|
||||
{{ statusStyle(item.status).label }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-6 text-sm text-slate-500">
|
||||
<span v-if="item.price > 0" class="text-red-600 font-bold">¥ {{ item.price.toFixed(2) }}</span>
|
||||
<span v-else class="text-green-600 font-bold">免费</span>
|
||||
|
||||
<span class="flex items-center gap-1" title="图片" v-if="item.image_count > 0">
|
||||
<i class="pi pi-image"></i> {{ item.image_count }}
|
||||
</span>
|
||||
<span class="flex items-center gap-1" title="视频" v-if="item.video_count > 0">
|
||||
<i class="pi pi-video"></i> {{ item.video_count }}
|
||||
</span>
|
||||
<span class="flex items-center gap-1" title="音频" v-if="item.audio_count > 0">
|
||||
<i class="pi pi-microphone"></i> {{ item.audio_count }}
|
||||
</span>
|
||||
|
||||
<span title="浏览量"><i class="pi pi-eye mr-1"></i> {{ item.views }}</span>
|
||||
<span title="点赞数"><i class="pi pi-thumbs-up mr-1"></i> {{ item.likes }}</span>
|
||||
<!-- Date field missing in DTO, using hardcoded or omitting -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Actions -->
|
||||
<div class="flex items-center gap-4 pt-3 border-t border-slate-50 mt-2">
|
||||
<button class="text-sm text-slate-500 hover:text-primary-600 font-medium cursor-pointer" @click="$router.push(`/creator/contents/${item.id}`)"><i
|
||||
class="pi pi-file-edit mr-1"></i> 编辑</button>
|
||||
<button v-if="item.status === 'published'"
|
||||
class="text-sm text-slate-500 hover:text-orange-600 font-medium cursor-pointer"
|
||||
@click="handleStatusChange(item.id, 'unpublished')"><i
|
||||
class="pi pi-arrow-down mr-1"></i> 下架</button>
|
||||
<button v-if="item.status === 'unpublished'"
|
||||
class="text-sm text-slate-500 hover:text-green-600 font-medium cursor-pointer"
|
||||
@click="handleStatusChange(item.id, 'published')"><i
|
||||
class="pi pi-arrow-up mr-1"></i> 上架</button>
|
||||
<template v-if="item.status === 'published'">
|
||||
<button v-if="!item.is_pinned"
|
||||
class="text-sm text-slate-500 hover:text-blue-600 font-medium cursor-pointer"
|
||||
@click="handlePin(item.id, true)"><i
|
||||
class="pi pi-bookmark mr-1"></i> 置顶</button>
|
||||
<button v-else
|
||||
class="text-sm text-blue-600 font-medium cursor-pointer"
|
||||
@click="handlePin(item.id, false)"><i
|
||||
class="pi pi-bookmark-fill mr-1"></i> 取消置顶</button>
|
||||
</template> <button class="text-sm text-slate-500 hover:text-red-600 font-medium ml-auto cursor-pointer" @click="handleDelete(item.id)"><i
|
||||
class="pi pi-trash mr-1"></i> 删除</button>
|
||||
</div>
|
||||
<div class="flex items-center justify-between mb-2">
|
||||
<div class="flex items-center gap-2 flex-1 min-w-0">
|
||||
<span v-if="item.is_pinned"
|
||||
class="bg-red-600 text-white text-[10px] px-1.5 py-0.5 rounded font-bold whitespace-nowrap">置顶</span>
|
||||
<span v-if="item.genre"
|
||||
class="bg-slate-100 text-slate-600 text-[11px] px-2 py-0.5 rounded-full font-bold whitespace-nowrap">{{
|
||||
getGenreLabel(item.genre) }}</span>
|
||||
<span v-if="item.key"
|
||||
class="bg-blue-50 text-blue-600 text-[11px] px-2 py-0.5 rounded-full font-bold whitespace-nowrap">{{
|
||||
item.key }}</span>
|
||||
<h3 class="font-bold text-slate-900 text-lg truncate hover:text-primary-600 cursor-pointer transition-colors"
|
||||
@click="$router.push(`/creator/contents/${item.id}`)">
|
||||
{{ item.title }}</h3>
|
||||
</div>
|
||||
<!-- Status Badge -->
|
||||
<div class="flex items-center gap-2 ml-4">
|
||||
<span v-if="item.status === 'blocked'" class="text-red-500 text-xs flex items-center gap-1 cursor-help"
|
||||
title="已被封禁">
|
||||
<i class="pi pi-info-circle"></i> 封禁
|
||||
</span>
|
||||
<span class="px-2.5 py-1 rounded text-xs font-bold whitespace-nowrap"
|
||||
:class="statusStyle(item.status).bg + ' ' + statusStyle(item.status).text">
|
||||
{{ statusStyle(item.status).label }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-4 text-xs text-slate-500 mt-3">
|
||||
<span class="flex items-center gap-1" title="发布时间">
|
||||
<i class="pi pi-calendar text-[10px]"></i> {{ item.created_at }}
|
||||
</span>
|
||||
|
||||
<div class="flex items-center gap-3 border-l border-slate-200 pl-3">
|
||||
<span v-if="item.price > 0" class="text-red-600 font-bold">¥{{ item.price.toFixed(2) }}</span>
|
||||
<span v-else class="text-green-600 font-bold">免费</span>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-3 border-l border-slate-200 pl-3">
|
||||
<span class="flex items-center gap-1" title="图片" v-if="item.image_count > 0">
|
||||
<i class="pi pi-image text-[10px]"></i> {{ item.image_count }}
|
||||
</span>
|
||||
<span class="flex items-center gap-1" title="视频" v-if="item.video_count > 0">
|
||||
<i class="pi pi-video text-[10px]"></i> {{ item.video_count }}
|
||||
</span>
|
||||
<span class="flex items-center gap-1" title="音频" v-if="item.audio_count > 0">
|
||||
<i class="pi pi-microphone text-[10px]"></i> {{ item.audio_count }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-3 border-l border-slate-200 pl-3">
|
||||
<span title="浏览量"><i class="pi pi-eye mr-1 text-[10px]"></i> {{ item.views }}</span>
|
||||
<span title="点赞数"><i class="pi pi-thumbs-up mr-1 text-[10px]"></i> {{ item.likes }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Actions -->
|
||||
<div class="flex items-center gap-4 pt-3 border-t border-slate-50 mt-3">
|
||||
<button class="text-sm text-slate-500 hover:text-primary-600 font-medium cursor-pointer flex items-center gap-1"
|
||||
@click="$router.push(`/creator/contents/${item.id}`)">
|
||||
<i class="pi pi-file-edit"></i> 编辑
|
||||
</button>
|
||||
<button v-if="item.status === 'published'"
|
||||
class="text-sm text-slate-500 hover:text-orange-600 font-medium cursor-pointer flex items-center gap-1"
|
||||
@click="handleStatusChange(item.id, 'unpublished')">
|
||||
<i class="pi pi-arrow-down"></i> 下架
|
||||
</button>
|
||||
<button v-if="item.status === 'unpublished'"
|
||||
class="text-sm text-slate-500 hover:text-green-600 font-medium cursor-pointer flex items-center gap-1"
|
||||
@click="handleStatusChange(item.id, 'published')">
|
||||
<i class="pi pi-arrow-up"></i> 上架
|
||||
</button>
|
||||
<template v-if="item.status === 'published'">
|
||||
<button v-if="!item.is_pinned"
|
||||
class="text-sm text-slate-500 hover:text-blue-600 font-medium cursor-pointer flex items-center gap-1"
|
||||
@click="handlePin(item.id, true)">
|
||||
<i class="pi pi-bookmark"></i> 置顶
|
||||
</button>
|
||||
<button v-else
|
||||
class="text-sm text-blue-600 font-medium cursor-pointer flex items-center gap-1"
|
||||
@click="handlePin(item.id, false)">
|
||||
<i class="pi pi-bookmark-fill"></i> 取消置顶
|
||||
</button>
|
||||
</template>
|
||||
<button
|
||||
class="text-sm text-slate-400 hover:text-red-600 font-medium ml-auto cursor-pointer flex items-center gap-1 transition-colors"
|
||||
@click="handleDelete(item.id)">
|
||||
<i class="pi pi-trash"></i> 删除
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user