feat(admin): 短剧列表展示并编辑互动数据

src/views/contentManagement/DramaManagementView.vue

@@ -30,6 +30,7 @@ const categories = ref([])
 const keyword = ref('')
 const statusFilter = ref(undefined)
 const categoryId = ref(undefined)
+const dramaTypeFilter = ref(undefined)
 const hotFilter = ref(undefined)
 const pageIndex = ref(1)
 const pageSize = ref(10)
@@ -41,13 +42,18 @@ const coverPercent = ref(0)
 const coverError = ref('')
 const coverFileName = ref('')
 const editingId = ref(null)
+const editingCommentCount = ref(0)
 const formRef = ref()
 const form = reactive({
   title: '',
   categoryId: undefined,
+  dramaType: 'LIVE',
   description: '',
   freeEpisodes: 3,
   unlockCoin: 0,
+  favoriteCount: 0,
+  likeCount: 0,
+  heat: 0,
   isHot: false,
   cover: ''
 })
@@ -57,7 +63,8 @@ const COVER_TYPES = ['image/jpeg', 'image/png', 'image/webp']
 
 const formRules = {
   title: [{ required: true, message: '请输入短剧名称', trigger: 'blur' }],
-  categoryId: [{ required: true, message: '请选择短剧类型', trigger: 'change' }]
+  categoryId: [{ required: true, message: '请选择短剧类型', trigger: 'change' }],
+  dramaType: [{ required: true, message: '请选择内容类型', trigger: 'change' }]
 }
 
 const coverDisplayName = computed(
@@ -78,6 +85,11 @@ const statusOptions = [
   { code: 'offline', text: '已下线' }
 ]
 
+const dramaTypeOptions = [
+  { value: 'ANIME', label: '漫剧' },
+  { value: 'LIVE', label: '真人剧' }
+]
+
 const actionMeta = {
   submit: { label: '提交审核', done: '已提交审核' },
   approve: { label: '审核通过', done: '已通过审核' },
@@ -95,6 +107,7 @@ async function load() {
       keyword: keyword.value.trim() || undefined,
       status: statusFilter.value || undefined,
       categoryId: categoryId.value,
+      dramaTypes: dramaTypeFilter.value ? [dramaTypeFilter.value] : undefined,
       isHot: hotFilter.value
     })
     list.value = res.data?.list || []
@@ -118,6 +131,7 @@ function resetFilters() {
   keyword.value = ''
   statusFilter.value = undefined
   categoryId.value = undefined
+  dramaTypeFilter.value = undefined
   hotFilter.value = undefined
   search()
 }
@@ -143,14 +157,19 @@ function openCreate() {
   Object.assign(form, {
     title: '',
     categoryId: undefined,
+    dramaType: 'LIVE',
     description: '',
     freeEpisodes: 3,
     unlockCoin: 0,
+    favoriteCount: 0,
+    likeCount: 0,
+    heat: 0,
     isHot: false,
     cover: ''
   })
   coverFileName.value = ''
   coverError.value = ''
+  editingCommentCount.value = 0
   dialogVisible.value = true
   resetValidation()
 }
@@ -160,18 +179,27 @@ function openEdit(row) {
   Object.assign(form, {
     title: row.title,
     categoryId: row.categoryId || undefined,
+    dramaType: row.dramaType || 'LIVE',
     description: row.description || '',
     freeEpisodes: row.freeEpisodes ?? 3,
     unlockCoin: row.unlockCoin ?? 0,
+    favoriteCount: row.favoriteCount ?? 0,
+    likeCount: row.likeCount ?? 0,
+    heat: row.views ?? 0,
     isHot: !!row.isHot,
     cover: row.cover || ''
   })
   coverFileName.value = row.cover ? coverBasename(row.cover) : ''
   coverError.value = ''
+  editingCommentCount.value = row.commentCount ?? 0
   dialogVisible.value = true
   resetValidation()
 }
 
+function dramaTypeLabel(value) {
+  return dramaTypeOptions.find((item) => item.value === value)?.label || '真人剧'
+}
+
 async function saveDrama() {
   if (saving.value || uploadingCover.value) return
   try {
@@ -344,6 +372,12 @@ onMounted(async () => {
             :key="item.id"
             :label="item.name"
             :value="item.id" /></el-select
+        ><el-select v-model="dramaTypeFilter" clearable placeholder="全部内容类型" @change="search"
+          ><el-option
+            v-for="item in dramaTypeOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value" /></el-select
         ><el-select v-model="hotFilter" clearable placeholder="全部热度" @change="search"
           ><el-option label="仅热门" :value="true" /><el-option
             label="非热门"
@@ -383,12 +417,34 @@ onMounted(async () => {
         ></el-table-column
       >
       <el-table-column prop="genre" label="类型" width="110" />
+      <el-table-column label="内容类型" width="110"
+        ><template #default="{ row }"
+          ><el-tag :type="row.dramaType === 'ANIME' ? 'warning' : 'info'" effect="light">{{
+            dramaTypeLabel(row.dramaType)
+          }}</el-tag></template
+        ></el-table-column
+      >
       <el-table-column label="集数" width="90"
         ><template #default="{ row }">{{ row.episodes }} 集</template></el-table-column
       >
-      <el-table-column label="播放量" width="110"
+      <el-table-column label="热度" width="110"
         ><template #default="{ row }">{{ formatCount(row.views) }}</template></el-table-column
       >
+      <el-table-column label="收藏" width="90"
+        ><template #default="{ row }">{{
+          formatCount(row.favoriteCount ?? 0)
+        }}</template></el-table-column
+      >
+      <el-table-column label="点赞" width="90"
+        ><template #default="{ row }">{{
+          formatCount(row.likeCount ?? 0)
+        }}</template></el-table-column
+      >
+      <el-table-column label="评论" width="90"
+        ><template #default="{ row }">{{
+          formatCount(row.commentCount ?? 0)
+        }}</template></el-table-column
+      >
       <el-table-column label="状态" width="110"
         ><template #default="{ row }"
           ><el-tag :class="['status-badge', statusClass(row.status)]" effect="light">{{
@@ -487,6 +543,16 @@ onMounted(async () => {
               />
             </el-select>
           </el-form-item>
+          <el-form-item label="内容类型" prop="dramaType">
+            <el-select v-model="form.dramaType" placeholder="请选择内容类型">
+              <el-option
+                v-for="item in dramaTypeOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
         </div>
         <el-form-item label="简介">
           <el-input
@@ -527,6 +593,43 @@ onMounted(async () => {
         </el-form-item>
       </section>
 
+      <section class="editor-section">
+        <h3 class="editor-section-title">互动数据</h3>
+        <div class="editor-grid editor-grid--two">
+          <el-form-item label="收藏数">
+            <el-input-number
+              v-model="form.favoriteCount"
+              class="editor-number"
+              controls-position="right"
+              :min="0"
+              :precision="0"
+            />
+          </el-form-item>
+          <el-form-item label="点赞数">
+            <el-input-number
+              v-model="form.likeCount"
+              class="editor-number"
+              controls-position="right"
+              :min="0"
+              :precision="0"
+            />
+          </el-form-item>
+          <el-form-item label="热度">
+            <el-input-number
+              v-model="form.heat"
+              class="editor-number"
+              controls-position="right"
+              :min="0"
+              :precision="0"
+            />
+          </el-form-item>
+          <el-form-item label="评论数">
+            <div class="readonly-stat">{{ formatCount(editingCommentCount) }}</div>
+            <p class="readonly-stat-hint">实时统计，不可编辑</p>
+          </el-form-item>
+        </div>
+      </section>
+
       <section class="editor-section">
         <h3 class="editor-section-title">封面</h3>
         <div class="cover-editor">