feat(guess): 添加猜歌游戏页面及功能实现

- 新增猜歌游戏HTML页面结构
- 实现Vue.js猜歌游戏逻辑
- 添加游戏相关图片资源
- 完善CSS样式和动画效果
- 添加音乐数据JSON文件
- 更新歌曲请求站点的JS逻辑

static/js/guess.js

@@ -0,0 +1,46 @@
+const { createApp, ref, onMounted, nextTick, onUnmounted, computed } = Vue;
+const search = createApp({
+    setup() {
+        const musicData = ref([
+            ["A组 世界在转动.MP3", "A组《来吧，占领我的无私》"],
+            ["B组 《远方》.MP3", "B组 大闹天宫.MP3", "B组 下一站旅行.MP3"],
+            ["C组 旧唱片.MP3", "C组 梅雨季.MP3", "C组 尊重成长共赢.MP3", "C组《弥留》.MP3"],
+        ]);
+
+        let step = ref(0); // null 是未开始 0 是第一题
+
+        onMounted(() => {
+            console.log("init");
+            init();
+        });
+
+        const init = () => {
+            // 将 musicData 里的 二维值打乱
+            musicData.value.forEach((item) => {
+                item.sort(() => Math.random() - 0.5);
+            });
+
+            console.log(musicData.value);
+        };
+
+        const begin = () => {
+            step.value = 0;
+        };
+
+        // 添加一个方法来切换到下一题
+        const nextStep = () => {
+            if (step.value < musicData.value.length - 1) {
+                step.value++;
+            } else {
+                // 所有问题都回答完毕，可以重置或显示结果
+                // step.value = null;
+            }
+        };
+
+        const play = (item) => {
+            console.log("item", item);
+        };
+
+        return { play, step, begin, musicData, nextStep };
+    },
+}).mount("#guess");