fix(web): 重做剧集管理顶部布局

src/views/contentManagement/EpisodeManagementView.vue

@@ -236,16 +236,31 @@ onMounted(async () => {
     ></div
   >
   <section class="panel episode-panel">
-    <div class="episode-context"
-      ><div class="episode-context-copy"
-        ><span>选择短剧</span><b>{{ selectedDrama?.title || '暂无短剧' }}</b></div
-      ><el-select v-model="selectedDramaId" class="drama-select" @change="onDramaChange"
-        ><el-option
-          v-for="item in dramas"
-          :key="item.id"
-          :label="`${item.title}（${item.episodes} 集）`"
-          :value="item.id" /></el-select
-    ></div>
+    <div class="episode-context">
+      <div class="episode-context-info">
+        <span class="episode-context-label">当前短剧</span>
+        <b class="episode-context-title">{{ selectedDrama?.title || '暂无短剧' }}</b>
+        <small class="episode-context-count"
+          >共 {{ selectedDrama?.episodes ?? episodes.length }} 集</small
+        >
+      </div>
+      <div class="episode-switcher">
+        <span class="episode-context-label">切换短剧</span>
+        <el-select
+          v-model="selectedDramaId"
+          class="drama-select"
+          placeholder="请选择短剧"
+          @change="onDramaChange"
+        >
+          <el-option
+            v-for="item in dramas"
+            :key="item.id"
+            :label="`${item.title}（${item.episodes} 集）`"
+            :value="item.id"
+          />
+        </el-select>
+      </div>
+    </div>
     <div class="episode-toolbar"
       ><div
         ><h2>剧集列表（{{ episodes.length }}）</h2><p>按列表顺序播放</p></div