feat: 迁移自定义功能至 1.5.9.9 版本

包含音乐源限制、CI 防 OOM 优化、数据库连接池优化、管理端权限及 UI 细节定制等功能
2026-09-12 19:26:42 +08:00
parent 34f0679117
commit 1106aeea6c
161 changed files with 18963 additions and 27900 deletions
@@ -0,0 +1,144 @@
+<template>
+  <Teleport to="body">
+    <div
+      v-if="visible"
+      class="fixed inset-0 z-[70] bg-black/70 backdrop-blur-sm px-4 py-6 flex items-end sm:items-center justify-center"
+    >
+      <div
+        class="w-full max-w-xl rounded-2xl border border-zinc-800 bg-zinc-950 shadow-2xl overflow-hidden"
+      >
+        <div class="px-5 py-4 border-b border-zinc-800 flex items-center justify-between gap-3">
+          <div>
+            <p class="text-[10px] uppercase tracking-[0.2em] text-zinc-500 font-black">后台引导</p>
+            <h3 class="text-lg font-black text-zinc-100 mt-1">{{ currentStep.title }}</h3>
+          </div>
+          <button
+            class="h-9 w-9 rounded-lg border border-zinc-700 text-zinc-400 hover:text-zinc-200 hover:bg-zinc-900 transition-colors"
+            @click="handleClose"
+          >
+            <X :size="16" class="mx-auto" />
+          </button>
+        </div>
+
+        <div class="px-5 py-5 space-y-4">
+          <p class="text-sm leading-relaxed text-zinc-300">{{ currentStep.description }}</p>
+          <div class="rounded-xl border border-blue-500/20 bg-blue-500/5 p-3">
+            <p class="text-xs text-zinc-400">
+              建议操作：
+              <span class="text-zinc-200 font-semibold">{{ currentStep.actionHint }}</span>
+            </p>
+          </div>
+        </div>
+
+        <div
+          class="px-5 py-4 border-t border-zinc-800 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3"
+        >
+          <p class="text-xs text-zinc-500 font-semibold">{{ stepIndex + 1 }} / {{ steps.length }}</p>
+          <div class="flex items-center gap-2">
+            <button
+              v-if="stepIndex > 0"
+              class="px-3.5 py-2 rounded-lg border border-zinc-700 text-zinc-300 hover:bg-zinc-900 text-sm"
+              @click="prevStep"
+            >
+              上一步
+            </button>
+            <button
+              class="px-3.5 py-2 rounded-lg border border-zinc-700 text-zinc-200 hover:bg-zinc-900 text-sm"
+              @click="goCurrentStep"
+            >
+              前往此功能
+            </button>
+            <button
+              class="px-4 py-2 rounded-lg bg-blue-600 hover:bg-blue-500 text-white text-sm font-bold"
+              @click="nextStep"
+            >
+              {{ stepIndex === steps.length - 1 ? '完成引导' : '下一步' }}
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </Teleport>
+</template>
+
+<script setup>
+import { computed, ref, watch } from 'vue'
+import { X } from '@lucide/vue'
+
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    default: false
+  }
+})
+
+const emit = defineEmits(['navigate', 'close', 'complete'])
+
+const steps = [
+  {
+    tab: 'overview',
+    title: '先看数据概览',
+    description: '这里会显示待处理歌曲、播放数据和系统运行状态，建议每次值班先看这一页。',
+    actionHint: '进入“数据概览”快速确认今日状态。'
+  },
+  {
+    tab: 'songs',
+    title: '处理歌曲审核',
+    description: '在歌曲管理中可试听、拒绝或保留歌曲，确保内容合规后再进入排期流程。',
+    actionHint: '优先处理新提交和被举报的歌曲。'
+  },
+  {
+    tab: 'schedule',
+    title: '安排节目排期',
+    description: '将审核通过的歌曲拖拽到目标日期与时段，调整顺序后发布，用户即可看到最新排期。',
+    actionHint: '排期完成后记得点击发布，避免用户看到旧数据。'
+  },
+  {
+    tab: 'site-config',
+    title: '维护站点配置',
+    description: '可统一修改站点标题、版本号和投稿规则，保存后会对前台页面立即生效。',
+    actionHint: '发布新版本时，建议同步更新“站点版本号”。'
+  },
+  {
+    tab: 'workflow-tutorial',
+    title: '查看完整流程教程',
+    description: '如果需要标准值班流程和FAQ，可在“流程与教程”页面查看详细图文说明。',
+    actionHint: '把该页面作为新人培训材料。'
+  }
+]
+
+const stepIndex = ref(0)
+const currentStep = computed(() => steps[stepIndex.value])
+
+watch(
+  () => props.visible,
+  (visible) => {
+    if (visible) {
+      stepIndex.value = 0
+    }
+  }
+)
+
+const goCurrentStep = () => {
+  emit('navigate', currentStep.value.tab)
+}
+
+const prevStep = () => {
+  if (stepIndex.value > 0) {
+    stepIndex.value -= 1
+  }
+}
+
+const nextStep = () => {
+  goCurrentStep()
+  if (stepIndex.value < steps.length - 1) {
+    stepIndex.value += 1
+    return
+  }
+  emit('complete')
+}
+
+const handleClose = () => {
+  emit('close')
+}
+</script>