version 5

src/App.vue

@@ -116,15 +116,28 @@
             <div class="nav-dot" v-if="currentArea === ''"></div>
           </div>
 
-          <div class="nav-item" :class="{ 'active': currentArea === 'knowledge' }" @click="navigateTo('knowledge')">
+          <!-- 文科导航 -->
+          <div class="nav-item" :class="{ 'active': currentArea === 'arts' }" @click="navigateTo('arts')">
             <div class="nav-icon-wrapper">
               <div class="nav-icon knowledge-icon">
-                <span class="icon-emoji">📚</span>
+                <span class="icon-emoji">🎨</span>
                 <div class="icon-glow"></div>
               </div>
             </div>
-            <span class="nav-label">知识</span>
+            <span class="nav-label">文科</span>
-            <div class="nav-dot" v-if="currentArea === 'knowledge'"></div>
+            <div class="nav-dot" v-if="currentArea === 'arts'"></div>
+          </div>
+          
+          <!-- 理科导航 -->
+          <div class="nav-item" :class="{ 'active': currentArea === 'science' }" @click="navigateTo('science')">
+            <div class="nav-icon-wrapper">
+              <div class="nav-icon knowledge-icon">
+                <span class="icon-emoji">🔬</span>
+                <div class="icon-glow"></div>
+              </div>
+            </div>
+            <span class="nav-label">理科</span>
+            <div class="nav-dot" v-if="currentArea === 'science'"></div>
           </div>
 
           <div class="nav-item" :class="{ 'active': currentArea === 'habit' }" @click="navigateTo('habit')">
@@ -259,7 +272,9 @@
       <div class="area-content">
         <WelcomeArea v-if="currentArea === ''" @navigate="navigateTo" />
         <AdventureMap v-else-if="currentArea === 'adventure'" @navigate="navigateTo" />
-        <KnowledgeArea v-else-if="currentArea === 'knowledge'" />
+        <KnowledgeArea v-else-if="currentArea === 'arts'" :current-category="'arts'" />
+        <KnowledgeArea v-else-if="currentArea === 'science'" :current-category="'science'" />
+
         <CraftArea v-else-if="currentArea === 'craft'" />
         <LogicArea v-else-if="currentArea === 'logic'" />
         <HabitArea v-else-if="currentArea === 'habit'" />
@@ -309,6 +324,8 @@ const navigateTo = (area: string) => {
   currentArea.value = area;
 };
 
+
+
 // 选择头像
 const selectAvatar = (avatar: string) => {
   selectedAvatar.value = avatar;
@@ -668,7 +685,7 @@ onUnmounted(() => {
   align-items: center !important;
   margin-top: 15px !important;
   padding: 10px 0 !important;
-  flex-wrap: nowrap !important;
+  flex-wrap: wrap !important;
   flex-direction: row !important;
 }
 
@@ -677,7 +694,7 @@ header.app-header .nav-container nav.main-nav {
   flex-direction: row !important;
   justify-content: center !important;
   align-items: center !important;
-  gap: 20px !important;
+  gap: 15px !important;
   flex-wrap: wrap !important;
   width: 100% !important;
   max-width: 1200px !important;
@@ -1940,26 +1957,27 @@ header.app-header .nav-container nav.main-nav .nav-control-item {
   }
   
   .main-nav {
-    gap: 10px;
+    gap: 8px;
     padding: 5px 0;
+    flex-wrap: wrap;
   }
   
   .nav-item {
-    min-width: 60px;
+    min-width: 55px;
-    padding: 6px 8px;
+    padding: 6px 6px;
   }
   
   .nav-icon {
-    width: 45px;
+    width: 40px;
-    height: 45px;
+    height: 40px;
   }
   
   .icon-emoji {
-    font-size: 24px;
+    font-size: 20px;
   }
   
   .nav-label {
-    font-size: 11px;
+    font-size: 10px;
   }
   
   /* 响应式登录界面 */

src/components/ExternalLearningArea.vue

@@ -139,16 +139,7 @@ const categories = [
 // 学习资源数据
 const resources = ref([
   // 英语学习
-  {
+
-    id: 'en1',
-    category: 'english',
-    title: '六一儿童网-英文儿歌',
-    description: '海量英文儿歌动画，边听边学，适合3-12岁孩子启蒙',
-    url: 'http://www.61ertong.com/zt/etywgq/',
-    icon: '🎵',
-    ageRange: '3-12岁',
-    tag: '儿歌'
-  },
   {
     id: 'en2',
     category: 'english',
@@ -225,16 +216,7 @@ const resources = ref([
     ageRange: '3-8岁',
     tag: '网站'
   },
-  {
+
-    id: 'math2',
-    category: 'math',
-    title: '免费数独游戏在线',
-    description: '经典数独游戏，提供多种难度，可免费在线玩',
-    url: 'https://sj.qq.com/topic/200076907',
-    icon: '🧩',
-    ageRange: '6-12岁',
-    tag: '游戏'
-  },
   {
     id: 'math3',
     category: 'math',
@@ -247,16 +229,7 @@ const resources = ref([
   },
 
   // 艺术创作
-  {
+
-    id: 'art1',
-    category: 'art',
-    title: '六一儿童网',
-    description: '适合1-6岁宝宝的儿童网站，有儿歌、故事、绘画等内容',
-    url: 'http://www.61ertong.com/',
-    icon: '🎨',
-    ageRange: '3-8岁',
-    tag: '官网'
-  },
   {
     id: 'art2',
     category: 'art',
@@ -279,16 +252,7 @@ const resources = ref([
     ageRange: '6-15岁',
     tag: '青少年'
   },
-  {
+
-    id: 'his2',
-    category: 'history',
-    title: '国家图书馆少儿数字图书馆',
-    description: '海量电子书，双语绘本、科普书、动漫图书，还有有声读物',
-    url: 'https://kids.nlc.cn/',
-    icon: '📖',
-    ageRange: '6-12岁',
-    tag: '官网'
-  },
   {
     id: 'his3',
     category: 'history',

src/components/HabitArea.vue

@@ -209,7 +209,7 @@ const checkHabit = (habit: keyof typeof habitData.value) => {
   }
   
   starEnergyStore.checkHabit(habit);
-  alert(`打卡成功！获得 1 颗星星能量！💫`);
+  alert(`打卡成功！获得 10 颗星星能量！💫`);
 };
 
 // 应用坏习惯扣分

src/components/KnowledgeArea.vue

@@ -23,15 +23,8 @@
     </div>
 
     <div class="subjects">
-      <!-- 数学魔法课 -->
+      <!-- 文科科目 -->
-      <div class="subject-card math" @click="selectSubject('math')">
+      <div v-if="props.currentCategory === 'arts'">
-        <div class="subject-icon">🔢</div>
-        <div class="subject-emoji">🐿️</div>
-        <h3 class="subject-title">数学魔法课</h3>
-        <p class="subject-desc">和数字松鼠一起冒险</p>
-        <div class="subject-reward">⭐ +1 能量</div>
-      </div>
-
         <!-- 语文魔法课 -->
         <div class="subject-card chinese" @click="selectSubject('chinese')">
           <div class="subject-icon">📖</div>
@@ -50,15 +43,6 @@
           <div class="subject-reward">⭐ +1 能量</div>
         </div>
 
-      <!-- 科学魔法课 -->
-      <div class="subject-card science" @click="selectSubject('science')">
-        <div class="subject-icon">🔬</div>
-        <div class="subject-emoji">🌱</div>
-        <h3 class="subject-title">科学魔法课</h3>
-        <p class="subject-desc">在植物实验室做实验</p>
-        <div class="subject-reward">⭐ +1 能量</div>
-      </div>
-
         <!-- 日语魔法课 -->
         <div class="subject-card japanese" @click="selectSubject('japanese')">
           <div class="subject-icon">🗾</div>
@@ -67,6 +51,27 @@
           <p class="subject-desc">学习简单的日语和50音图</p>
           <div class="subject-reward">⭐ +1 能量</div>
         </div>
+      </div>
+
+      <!-- 理科科目 -->
+      <div v-if="props.currentCategory === 'science'">
+        <!-- 数学魔法课 -->
+        <div class="subject-card math" @click="selectSubject('math')">
+          <div class="subject-icon">🔢</div>
+          <div class="subject-emoji">🐿️</div>
+          <h3 class="subject-title">数学魔法课</h3>
+          <p class="subject-desc">和数字松鼠一起冒险</p>
+          <div class="subject-reward">⭐ +1 能量</div>
+        </div>
+
+        <!-- 科学魔法课 -->
+        <div class="subject-card science" @click="selectSubject('science')">
+          <div class="subject-icon">🔬</div>
+          <div class="subject-emoji">🌱</div>
+          <h3 class="subject-title">科学魔法课</h3>
+          <p class="subject-desc">在植物实验室做实验</p>
+          <div class="subject-reward">⭐ +1 能量</div>
+        </div>
 
         <!-- 地理魔法课 -->
         <div class="subject-card geography" @click="selectSubject('geography')">
@@ -77,6 +82,7 @@
           <div class="subject-reward">⭐ +1 能量</div>
         </div>
       </div>
+    </div>
 
     <!-- 课程内容 -->
     <div class="subject-content" v-if="currentSubject">
@@ -144,7 +150,7 @@
           <div class="game-question">
             <div class="question-with-audio">
               <h4>{{ currentGame.question }}</h4>
-              <button class="audio-btn" v-if="currentGame.audio" @click="playAudio(currentGame.audio)">
+              <button class="audio-btn" @click="playAudio(currentGame.question)">
                 🔊
               </button>
             </div>
@@ -253,7 +259,7 @@
           <div class="game-question">
             <div class="question-with-audio">
               <h4>{{ currentGame.question }}</h4>
-              <button class="audio-btn" @click="playAudio(currentGame.question)">
+              <button class="audio-btn" @click="playAudio(currentGame.audio || currentGame.question)">
                 🔊
               </button>
             </div>
@@ -309,7 +315,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, computed } from 'vue';
+import { ref, onMounted, computed, watch } from 'vue';
 import { useStarEnergyStore } from '../stores/starEnergy';
 
 // 获取当前用户
@@ -317,6 +323,11 @@ const getCurrentUser = () => {
   return localStorage.getItem('currentUser') || 'default';
 };
 
+// 接收从父组件传递的当前分类
+const props = defineProps<{
+  currentCategory: 'arts' | 'science';
+}>();
+
 const starEnergyStore = useStarEnergyStore();
 const currentSubject = ref<string | null>(null);
 const currentGame = ref<any>(null);
@@ -427,14 +438,61 @@ const loadProgress = () => {
     try {
       const data = JSON.parse(savedProgress);
       if (data.progress) {
-        progress.value = data.progress;
+        // 合并加载的进度数据和默认进度数据，确保所有属性都存在
+        progress.value = {
+          math: {
+            counting: data.progress.math?.counting || 0,
+            shapes: data.progress.math?.shapes || 0,
+            calculation: data.progress.math?.calculation || 0
+          },
+          chinese: {
+            radicals: data.progress.chinese?.radicals || 0,
+            pinyin: data.progress.chinese?.pinyin || 0,
+            words: data.progress.chinese?.words || 0
+          },
+          english: {
+            maze: data.progress.english?.maze || 0,
+            animal: data.progress.english?.animal || 0,
+            dialogue: data.progress.english?.dialogue || 0
+          },
+          science: {
+            plants: data.progress.science?.plants || 0,
+            buoyancy: data.progress.science?.buoyancy || 0,
+            colors: data.progress.science?.colors || 0,
+            chemistry: data.progress.science?.chemistry || 0,
+            physics: data.progress.science?.physics || 0,
+            experiments: data.progress.science?.experiments || 0
+          },
+          japanese: {
+            hiragana: data.progress.japanese?.hiragana || 0,
+            animals: data.progress.japanese?.animals || 0,
+            fruits: data.progress.japanese?.fruits || 0,
+            body: data.progress.japanese?.body || 0,
+            directions: data.progress.japanese?.directions || 0,
+            items: data.progress.japanese?.items || 0,
+            greetings: data.progress.japanese?.greetings || 0
+          },
+          geography: {
+            map: data.progress.geography?.map || 0,
+            basics: data.progress.geography?.basics || 0,
+            northSouth: data.progress.geography?.northSouth || 0
+          }
+        };
       }
       if (data.dailyProgress) {
-        dailyProgress.value = data.dailyProgress;
+        dailyProgress.value = {
+          date: data.dailyProgress.date || new Date().toDateString(),
+          completed: {
+            math: data.dailyProgress.completed?.math || 0,
+            chinese: data.dailyProgress.completed?.chinese || 0,
+            english: data.dailyProgress.completed?.english || 0,
+            science: data.dailyProgress.completed?.science || 0,
+            japanese: data.dailyProgress.completed?.japanese || 0,
+            geography: data.dailyProgress.completed?.geography || 0
           }
-      if (data.tasks) {
+        };
-        tasks.value = data.tasks;
       }
+      // 不加载tasks数据，确保默认任务数据不会被覆盖
     } catch (error) {
       console.error('加载进度数据失败:', error);
     }
@@ -446,8 +504,8 @@ const saveProgress = () => {
   const user = getCurrentUser();
   const data = {
     progress: progress.value,
-    dailyProgress: dailyProgress.value,
+    dailyProgress: dailyProgress.value
-    tasks: tasks.value
+    // 不保存tasks数据，确保默认任务数据不会被覆盖
   };
   localStorage.setItem(`knowledgeProgress_${user}`, JSON.stringify(data));
 };
@@ -909,77 +967,102 @@ const gameData = {
     ].sort(() => Math.random() - 0.5), // 随机打乱顺序
     // 拼音练习 - 声母、韵母
     pinyin: [
-      // 原有题目
+      // 单韵母练习
-      { question: '请选择正确的声母："b"的读音是？', options: ['玻', '波', '博', '伯'], answer: '玻', audio: '波波的波' },
+      { question: '单韵母 "a" 的读音是？', options: ['啊', '阿', '奥', '安'], answer: '啊', audio: 'a，啊' },
-      { question: '请选择正确的韵母："a"的读音是？', options: ['啊', '阿', '奥', '安'], answer: '啊', audio: '阿阿姨的啊' },
+      { question: '单韵母 "o" 的读音是？', options: ['哦', '喔', '欧', '偶'], answer: '哦', audio: 'o，哦' },
-      { question: '请选择正确的声母："p"的读音是？', options: ['坡', '破', '泊', '魄'], answer: '坡', audio: '坡皮的坡' },
+      { question: '单韵母 "e" 的读音是？', options: ['额', '鹅', '鄂', '俄'], answer: '额', audio: 'e，额' },
-      { question: '请选择正确的韵母："o"的读音是？', options: ['哦', '喔', '欧', '偶'], answer: '哦', audio: '哦哦的哦' },
+      { question: '单韵母 "i" 的读音是？', options: ['衣', '医', '伊', '依'], answer: '衣', audio: 'i，衣' },
-      { question: '请选择正确的声母："m"的读音是？', options: ['摸', '摩', '魔', '莫'], answer: '摸', audio: '摸摸的摸' },
+      { question: '单韵母 "u" 的读音是？', options: ['乌', '无', '五', '屋'], answer: '乌', audio: 'u，乌' },
-      { question: '请选择正确的韵母："e"的读音是？', options: ['额', '鹅', '鄂', '俄'], answer: '额', audio: '额头的额' },
+      { question: '单韵母 "ü" 的读音是？', options: ['迂', '鱼', '雨', '玉'], answer: '迂', audio: 'ü，迂' },
-      { question: '请选择正确的声母："f"的读音是？', options: ['佛', '否', '弗', '福'], answer: '佛', audio: '佛陀的佛' },
+      
-      { question: '请选择正确的韵母："i"的读音是？', options: ['衣', '医', '伊', '依'], answer: '衣', audio: '衣服的衣' },
+      // 声母练习
-      { question: '请选择正确的声母："d"的读音是？', options: ['得', '德', '地', '弟'], answer: '得', audio: '得得的得' },
+      { question: '声母 "b" 的读音是？', options: ['玻', '波', '博', '伯'], answer: '玻', audio: 'b，玻' },
-      { question: '请选择正确的韵母："u"的读音是？', options: ['乌', '无', '五', '屋'], answer: '乌', audio: '乌鸦的乌' },
+      { question: '声母 "p" 的读音是？', options: ['坡', '破', '泊', '魄'], answer: '坡', audio: 'p，坡' },
-      { question: '请选择正确的声母："t"的读音是？', options: ['特', '忒', '替', '梯'], answer: '特', audio: '特别的特' },
+      { question: '声母 "m" 的读音是？', options: ['摸', '摩', '魔', '莫'], answer: '摸', audio: 'm，摸' },
-      { question: '请选择正确的韵母："ü"的读音是？', options: ['迂', '鱼', '雨', '玉'], answer: '迂', audio: '迂回的迂' },
+      { question: '声母 "f" 的读音是？', options: ['佛', '否', '弗', '福'], answer: '佛', audio: 'f，佛' },
-      { question: '请选择正确的声母："n"的读音是？', options: ['讷', '那', '拿', '内'], answer: '讷', audio: '讷讷的讷' },
+      { question: '声母 "d" 的读音是？', options: ['得', '德', '地', '弟'], answer: '得', audio: 'd，得' },
-      { question: '请选择正确的声母："l"的读音是？', options: ['勒', '乐', '拉', '来'], answer: '勒', audio: '勒紧的勒' },
+      { question: '声母 "t" 的读音是？', options: ['特', '忒', '替', '梯'], answer: '特', audio: 't，特' },
-      { question: '请选择正确的声母："g"的读音是？', options: ['哥', '个', '格', '各'], answer: '哥', audio: '哥哥的哥' },
+      { question: '声母 "n" 的读音是？', options: ['讷', '那', '拿', '内'], answer: '讷', audio: 'n，讷' },
-      { question: '请选择正确的声母："k"的读音是？', options: ['科', '可', '课', '客'], answer: '科', audio: '科学的科' },
+      { question: '声母 "l" 的读音是？', options: ['勒', '乐', '拉', '来'], answer: '勒', audio: 'l，勒' },
-      { question: '请选择正确的声母："h"的读音是？', options: ['喝', '合', '河', '和'], answer: '喝', audio: '喝水的喝' },
+      { question: '声母 "g" 的读音是？', options: ['哥', '个', '格', '各'], answer: '哥', audio: 'g，哥' },
-      { question: '请选择正确的声母："j"的读音是？', options: ['基', '机', '鸡', '积'], answer: '基', audio: '基础的基' },
+      { question: '声母 "k" 的读音是？', options: ['科', '可', '课', '客'], answer: '科', audio: 'k，科' },
-      { question: '请选择正确的声母："q"的读音是？', options: ['欺', '七', '期', '起'], answer: '欺', audio: '欺负的欺' },
+      { question: '声母 "h" 的读音是？', options: ['喝', '合', '河', '和'], answer: '喝', audio: 'h，喝' },
-      { question: '请选择正确的声母："x"的读音是？', options: ['西', '希', '习', '喜'], answer: '西', audio: '东西的西' },
+      { question: '声母 "j" 的读音是？', options: ['基', '机', '鸡', '积'], answer: '基', audio: 'j，基' },
-      // 新添加题目 - 第二单元·汉语拼音
+      { question: '声母 "q" 的读音是？', options: ['欺', '七', '期', '起'], answer: '欺', audio: 'q，欺' },
-      { question: '请选择正确的单韵母："a"的读音是？', options: ['啊', '阿', '奥', '安'], answer: '啊', audio: '阿阿姨的啊' },
+      { question: '声母 "x" 的读音是？', options: ['西', '希', '习', '喜'], answer: '西', audio: 'x，西' },
-      { question: '请选择正确的单韵母："o"的读音是？', options: ['哦', '喔', '欧', '偶'], answer: '哦', audio: '哦哦的哦' },
+      { question: '声母 "z" 的读音是？', options: ['资', '子', '字', '自'], answer: '资', audio: 'z，资' },
-      { question: '请选择正确的单韵母："e"的读音是？', options: ['额', '鹅', '鄂', '俄'], answer: '额', audio: '额头的额' },
+      { question: '声母 "c" 的读音是？', options: ['刺', '次', '词', '此'], answer: '刺', audio: 'c，刺' },
-      { question: '请选择正确的单韵母："i"的读音是？', options: ['衣', '医', '伊', '依'], answer: '衣', audio: '衣服的衣' },
+      { question: '声母 "s" 的读音是？', options: ['思', '丝', '死', '四'], answer: '思', audio: 's，思' },
-      { question: '请选择正确的单韵母："u"的读音是？', options: ['乌', '无', '五', '屋'], answer: '乌', audio: '乌鸦的乌' },
+      { question: '声母 "zh" 的读音是？', options: ['知', '之', '至', '治'], answer: '知', audio: 'zh，知' },
-      { question: '请选择正确的单韵母："ü"的读音是？', options: ['迂', '鱼', '雨', '玉'], answer: '迂', audio: '迂回的迂' },
+      { question: '声母 "ch" 的读音是？', options: ['吃', '尺', '池', '赤'], answer: '吃', audio: 'ch，吃' },
-      { question: '请选择正确的声母："b"的读音是？', options: ['玻', '波', '博', '伯'], answer: '玻', audio: '波波的波' },
+      { question: '声母 "sh" 的读音是？', options: ['师', '诗', '时', '市'], answer: '师', audio: 'sh，师' },
-      { question: '请选择正确的声母："p"的读音是？', options: ['坡', '破', '泊', '魄'], answer: '坡', audio: '坡皮的坡' },
+      { question: '声母 "r" 的读音是？', options: ['日', '入', '如', '肉'], answer: '日', audio: 'r，日' },
-      { question: '请选择正确的声母："m"的读音是？', options: ['摸', '摩', '魔', '莫'], answer: '摸', audio: '摸摸的摸' },
+      { question: '声母 "y" 的读音是？', options: ['衣', '医', '依', '一'], answer: '衣', audio: 'y，衣' },
-      { question: '请选择正确的声母："f"的读音是？', options: ['佛', '否', '弗', '福'], answer: '佛', audio: '佛陀的佛' },
+      { question: '声母 "w" 的读音是？', options: ['乌', '无', '五', '吴'], answer: '乌', audio: 'w，乌' },
-      { question: '请选择正确的声母："d"的读音是？', options: ['得', '德', '地', '弟'], answer: '得', audio: '得得的得' },
+      
-      { question: '请选择正确的声母："t"的读音是？', options: ['特', '忒', '替', '梯'], answer: '特', audio: '特别的特' },
+      // 复韵母练习
-      { question: '请选择正确的声母："n"的读音是？', options: ['讷', '那', '拿', '内'], answer: '讷', audio: '讷讷的讷' },
+      { question: '复韵母 "ai" 的读音是？', options: ['爱', '矮', '埃', '碍'], answer: '爱', audio: 'ai，爱' },
-      { question: '请选择正确的声母："l"的读音是？', options: ['勒', '乐', '拉', '来'], answer: '勒', audio: '勒紧的勒' },
+      { question: '复韵母 "ei" 的读音是？', options: ['诶', '黑', '备', '贝'], answer: '诶', audio: 'ei，诶' },
-      // 新添加题目 - 第三单元·汉语拼音
+      { question: '复韵母 "ui" 的读音是？', options: ['威', '微', '伟', '围'], answer: '威', audio: 'ui，威' },
-      { question: '请选择正确的声母："g"的读音是？', options: ['哥', '个', '格', '各'], answer: '哥', audio: '哥哥的哥' },
+      { question: '复韵母 "ao" 的读音是？', options: ['凹', '熬', '袄', '傲'], answer: '凹', audio: 'ao，凹' },
-      { question: '请选择正确的声母："k"的读音是？', options: ['科', '可', '课', '客'], answer: '科', audio: '科学的科' },
+      { question: '复韵母 "ou" 的读音是？', options: ['欧', '偶', '呕', '藕'], answer: '欧', audio: 'ou，欧' },
-      { question: '请选择正确的声母："h"的读音是？', options: ['喝', '合', '河', '和'], answer: '喝', audio: '喝水的喝' },
+      { question: '复韵母 "iu" 的读音是？', options: ['优', '游', '友', '有'], answer: '优', audio: 'iu，优' },
-      { question: '请选择正确的声母："j"的读音是？', options: ['基', '机', '鸡', '积'], answer: '基', audio: '基础的基' },
+      { question: '复韵母 "ie" 的读音是？', options: ['耶', '叶', '夜', '业'], answer: '耶', audio: 'ie，耶' },
-      { question: '请选择正确的声母："q"的读音是？', options: ['欺', '七', '期', '起'], answer: '欺', audio: '欺负的欺' },
+      { question: '复韵母 "üe" 的读音是？', options: ['约', '月', '越', '悦'], answer: '约', audio: 'üe，约' },
-      { question: '请选择正确的声母："x"的读音是？', options: ['西', '希', '习', '喜'], answer: '西', audio: '东西的西' },
+      { question: '复韵母 "er" 的读音是？', options: ['儿', '而', '耳', '尔'], answer: '儿', audio: 'er，儿' },
-      { question: '请选择正确的声母："z"的读音是？', options: ['资', '子', '字', '自'], answer: '资', audio: '资金的资' },
+      
-      { question: '请选择正确的声母："c"的读音是？', options: ['刺', '次', '词', '此'], answer: '刺', audio: '刺猬的刺' },
+      // 鼻韵母练习
-      { question: '请选择正确的声母："s"的读音是？', options: ['思', '丝', '死', '四'], answer: '思', audio: '思考的思' },
+      { question: '鼻韵母 "an" 的读音是？', options: ['安', '按', '暗', '岸'], answer: '安', audio: 'an，安' },
-      { question: '请选择正确的声母："zh"的读音是？', options: ['知', '之', '至', '治'], answer: '知', audio: '知道的知' },
+      { question: '鼻韵母 "en" 的读音是？', options: ['恩', '摁', '嗯', '蒽'], answer: '恩', audio: 'en，恩' },
-      { question: '请选择正确的声母："ch"的读音是？', options: ['吃', '尺', '池', '赤'], answer: '吃', audio: '吃饭的吃' },
+      { question: '鼻韵母 "in" 的读音是？', options: ['因', '引', '印', '阴'], answer: '因', audio: 'in，因' },
-      { question: '请选择正确的声母："sh"的读音是？', options: ['师', '诗', '时', '市'], answer: '师', audio: '老师的师' },
+      { question: '鼻韵母 "un" 的读音是？', options: ['温', '文', '稳', '问'], answer: '温', audio: 'un，温' },
-      { question: '请选择正确的声母："r"的读音是？', options: ['日', '入', '如', '肉'], answer: '日', audio: '日子的日' },
+      { question: '鼻韵母 "ün" 的读音是？', options: ['晕', '云', '允', '运'], answer: '晕', audio: 'ün，晕' },
-      { question: '请选择正确的声母："y"的读音是？', options: ['衣', '医', '依', '一'], answer: '衣', audio: '衣服的衣' },
+      { question: '鼻韵母 "ang" 的读音是？', options: ['昂', '肮', '盎', '仰'], answer: '昂', audio: 'ang，昂' },
-      { question: '请选择正确的声母："w"的读音是？', options: ['乌', '无', '五', '吴'], answer: '乌', audio: '乌鸦的乌' },
+      { question: '鼻韵母 "eng" 的读音是？', options: ['鞥', '恒', '哼', '横'], answer: '鞥', audio: 'eng，鞥' },
-      // 新添加题目 - 第四单元·汉语拼音
+      { question: '鼻韵母 "ing" 的读音是？', options: ['英', '影', '硬', '应'], answer: '英', audio: 'ing，英' },
-      { question: '请选择正确的复韵母："ai"的读音是？', options: ['爱', '矮', '埃', '碍'], answer: '爱', audio: '爱情的爱' },
+      { question: '鼻韵母 "ong" 的读音是？', options: ['嗡', '翁', '瓮', '蓊'], answer: '嗡', audio: 'ong，嗡' },
-      { question: '请选择正确的复韵母："ei"的读音是？', options: ['诶', '黑', '备', '贝'], answer: '诶', audio: '诶呀的诶' },
+      
-      { question: '请选择正确的复韵母："ui"的读音是？', options: ['威', '微', '伟', '围'], answer: '威', audio: '威力的威' },
+      // 拼音组合成词练习
-      { question: '请选择正确的复韵母："ao"的读音是？', options: ['凹', '熬', '袄', '傲'], answer: '凹', audio: '凹凸的凹' },
+      { question: '"b" + "a" 组合成的音节是？', options: ['ba', 'pa', 'ma', 'fa'], answer: 'ba', audio: 'b-a，ba，八' },
-      { question: '请选择正确的复韵母："ou"的读音是？', options: ['欧', '偶', '呕', '藕'], answer: '欧', audio: '欧洲的欧' },
+      { question: '"p" + "o" 组合成的音节是？', options: ['po', 'bo', 'mo', 'fo'], answer: 'po', audio: 'p-o，po，坡' },
-      { question: '请选择正确的复韵母："iu"的读音是？', options: ['优', '游', '友', '有'], answer: '优', audio: '优秀的优' },
+      { question: '"m" + "i" 组合成的音节是？', options: ['mi', 'bi', 'pi', 'fi'], answer: 'mi', audio: 'm-i，mi，米' },
-      { question: '请选择正确的复韵母："ie"的读音是？', options: ['耶', '叶', '夜', '业'], answer: '耶', audio: '耶稣的耶' },
+      { question: '"f" + "u" 组合成的音节是？', options: ['fu', 'bu', 'pu', 'mu'], answer: 'fu', audio: 'f-u，fu，夫' },
-      { question: '请选择正确的复韵母："üe"的读音是？', options: ['约', '月', '越', '悦'], answer: '约', audio: '约会的约' },
+      { question: '"d" + "e" 组合成的音节是？', options: ['de', 'te', 'ne', 'le'], answer: 'de', audio: 'd-e，de，的' },
-      { question: '请选择正确的复韵母："er"的读音是？', options: ['儿', '而', '耳', '尔'], answer: '儿', audio: '儿子的儿' },
+      { question: '"t" + "u" 组合成的音节是？', options: ['tu', 'du', 'nu', 'lu'], answer: 'tu', audio: 't-u，tu，土' },
-      { question: '请选择正确的鼻韵母："an"的读音是？', options: ['安', '按', '暗', '岸'], answer: '安', audio: '安全的安' },
+      { question: '"n" + "a" 组合成的音节是？', options: ['na', 'da', 'ta', 'la'], answer: 'na', audio: 'n-a，na，那' },
-      { question: '请选择正确的鼻韵母："en"的读音是？', options: ['恩', '摁', '嗯', '蒽'], answer: '恩', audio: '恩情的恩' },
+      { question: '"l" + "i" 组合成的音节是？', options: ['li', 'di', 'ti', 'ni'], answer: 'li', audio: 'l-i，li，里' },
-      { question: '请选择正确的鼻韵母："in"的读音是？', options: ['因', '引', '印', '阴'], answer: '因', audio: '因为的因' },
+      { question: '"g" + "e" 组合成的音节是？', options: ['ge', 'ke', 'he', 'jie'], answer: 'ge', audio: 'g-e，ge，哥' },
-      { question: '请选择正确的鼻韵母："un"的读音是？', options: ['温', '文', '稳', '问'], answer: '温', audio: '温暖的温' },
+      { question: '"k" + "a" 组合成的音节是？', options: ['ka', 'ga', 'ha', 'ja'], answer: 'ka', audio: 'k-a，ka，卡' },
-      { question: '请选择正确的鼻韵母："ün"的读音是？', options: ['晕', '云', '允', '运'], answer: '晕', audio: '晕车的晕' },
+      { question: '"h" + "u" 组合成的音节是？', options: ['hu', 'gu', 'ku', 'ju'], answer: 'hu', audio: 'h-u，hu，乎' },
-      { question: '请选择正确的鼻韵母："ang"的读音是？', options: ['昂', '肮', '盎', '仰'], answer: '昂', audio: '昂首挺胸的昂' },
+      { question: '"j" + "i" 组合成的音节是？', options: ['ji', 'qi', 'xi', 'zhi'], answer: 'ji', audio: 'j-i，ji，机' },
-      { question: '请选择正确的鼻韵母："eng"的读音是？', options: ['鞥', '恒', '哼', '横'], answer: '鞥', audio: '鞥的发音' },
+      { question: '"q" + "u" 组合成的音节是？', options: ['qu', 'ju', 'xu', 'chu'], answer: 'qu', audio: 'q-u，qu，区' },
-      { question: '请选择正确的鼻韵母："ing"的读音是？', options: ['英', '影', '硬', '应'], answer: '英', audio: '英雄的英' },
+      { question: '"x" + "i" 组合成的音节是？', options: ['xi', 'ji', 'qi', 'shi'], answer: 'xi', audio: 'x-i，xi，西' },
-      { question: '请选择正确的鼻韵母："ong"的读音是？', options: ['嗡', '翁', '瓮', '蓊'], answer: '嗡', audio: '嗡嗡的嗡' }
+      { question: '"zh" + "i" 组合成的音节是？', options: ['zhi', 'chi', 'shi', 'ri'], answer: 'zhi', audio: 'zh-i，zhi，知' },
+      { question: '"ch" + "u" 组合成的音节是？', options: ['chu', 'zhu', 'shu', 'ru'], answer: 'chu', audio: 'ch-u，chu，出' },
+      { question: '"sh" + "i" 组合成的音节是？', options: ['shi', 'zhi', 'chi', 'ri'], answer: 'shi', audio: 'sh-i，shi，诗' },
+      { question: '"r" + "i" 组合成的音节是？', options: ['ri', 'zhi', 'chi', 'shi'], answer: 'ri', audio: 'r-i，ri，日' },
+      { question: '"y" + "a" 组合成的音节是？', options: ['ya', 'wa', 'yi', 'wu'], answer: 'ya', audio: 'y-a，ya，呀' },
+      { question: '"w" + "o" 组合成的音节是？', options: ['wo', 'yo', 'yi', 'yu'], answer: 'wo', audio: 'w-o，wo，我' },
+      
+      // 拼音词语练习
+      { question: '"b-a" 组成的词语是？', options: ['爸爸', '妈妈', '哥哥', '姐姐'], answer: '爸爸', audio: 'b-a，ba，爸爸' },
+      { question: '"m-a" 组成的词语是？', options: ['妈妈', '爸爸', '哥哥', '姐姐'], answer: '妈妈', audio: 'm-a，ma，妈妈' },
+      { question: '"g-e" 组成的词语是？', options: ['哥哥', '姐姐', '弟弟', '妹妹'], answer: '哥哥', audio: 'g-e，ge，哥哥' },
+      { question: '"j-i-e" 组成的词语是？', options: ['姐姐', '哥哥', '弟弟', '妹妹'], answer: '姐姐', audio: 'j-i-e，jie，姐姐' },
+      { question: '"d-i" 组成的词语是？', options: ['弟弟', '妹妹', '哥哥', '姐姐'], answer: '弟弟', audio: 'd-i，di，弟弟' },
+      { question: '"m-e-i" 组成的词语是？', options: ['妹妹', '弟弟', '哥哥', '姐姐'], answer: '妹妹', audio: 'm-e-i，mei，妹妹' },
+      { question: '"t-u" 组成的词语是？', options: ['兔子', '小猫', '小狗', '小鸟'], answer: '兔子', audio: 't-u，tu，兔子' },
+      { question: '"m-a-o" 组成的词语是？', options: ['小猫', '兔子', '小狗', '小鸟'], answer: '小猫', audio: 'm-a-o，mao，小猫' },
+      { question: '"g-o-u" 组成的词语是？', options: ['小狗', '小猫', '兔子', '小鸟'], answer: '小狗', audio: 'g-o-u，gou，小狗' },
+      { question: '"n-i-a-o" 组成的词语是？', options: ['小鸟', '小猫', '小狗', '兔子'], answer: '小鸟', audio: 'n-i-a-o，niao，小鸟' },
+      { question: '"s-h-u" 组成的词语是？', options: ['书本', '铅笔', '橡皮', '尺子'], answer: '书本', audio: 's-h-u，shu，书本' },
+      { question: '"q-i-a-n" 组成的词语是？', options: ['铅笔', '书本', '橡皮', '尺子'], answer: '铅笔', audio: 'q-i-a-n，qian，铅笔' },
+      { question: '"x-i-a-n-g" 组成的词语是？', options: ['橡皮', '铅笔', '书本', '尺子'], answer: '橡皮', audio: 'x-i-a-n-g，xiang，橡皮' },
+      { question: '"c-h-i" 组成的词语是？', options: ['尺子', '橡皮', '铅笔', '书本'], answer: '尺子', audio: 'c-h-i，chi，尺子' },
+      { question: '"s-h-u-i" 组成的词语是？', options: ['水果', '蔬菜', '米饭', '面条'], answer: '水果', audio: 's-h-u-i，shui，水果' },
+      { question: '"s-h-u-c-a-i" 组成的词语是？', options: ['蔬菜', '水果', '米饭', '面条'], answer: '蔬菜', audio: 's-h-u-c-a-i，shucai，蔬菜' },
+      { question: '"m-i-f-a-n" 组成的词语是？', options: ['米饭', '面条', '水果', '蔬菜'], answer: '米饭', audio: 'm-i-f-a-n，mifan，米饭' },
+      { question: '"m-i-a-n-t-i-a-o" 组成的词语是？', options: ['面条', '米饭', '水果', '蔬菜'], answer: '面条', audio: 'm-i-a-n-t-i-a-o，miantiao，面条' }
     ].sort(() => Math.random() - 0.5), // 随机打乱顺序
     // 词语认读 - 一年级常用词语
     words: [
@@ -2297,12 +2380,85 @@ const gameData = {
 // 播放音频 - 库洛米声音风格
 const playAudio = (text: string) => {
   try {
+    // 拼音字母映射表，确保拼音按照正确的方式发音
+    const pinyinMap: { [key: string]: string } = {
+      'a': '啊',
+      'o': '哦',
+      'e': '额',
+      'i': '衣',
+      'u': '乌',
+      'ü': '迂',
+      'b': '玻',
+      'p': '坡',
+      'm': '摸',
+      'f': '佛',
+      'd': '得',
+      't': '特',
+      'n': '讷',
+      'l': '勒',
+      'g': '哥',
+      'k': '科',
+      'h': '喝',
+      'j': '基',
+      'q': '欺',
+      'x': '西',
+      'z': '资',
+      'c': '刺',
+      's': '思',
+      'zh': '知',
+      'ch': '吃',
+      'sh': '师',
+      'r': '日',
+      'y': '衣',
+      'w': '乌',
+      'ai': '爱',
+      'ei': '诶',
+      'ui': '威',
+      'ao': '凹',
+      'ou': '欧',
+      'iu': '优',
+      'ie': '耶',
+      'üe': '约',
+      'er': '儿',
+      'an': '安',
+      'en': '恩',
+      'in': '因',
+      'un': '温',
+      'ün': '晕',
+      'ang': '昂',
+      'eng': '鞥',
+      'ing': '英',
+      'ong': '嗡'
+    };
+
+    // 处理复合字符串，如"a，啊"
+    let pronunciationText = text;
+    // 检查是否包含拼音和中文的组合
+    const pinyinMatch = text.match(/^([a-zA-ZüÜ]+)，(.+)$/);
+    if (pinyinMatch) {
+      const pinyinPart = pinyinMatch[1].toLowerCase();
+      const chinesePart = pinyinMatch[2];
+      if (pinyinMap[pinyinPart]) {
+        // 如果拼音部分在映射表中，直接使用中文部分
+        pronunciationText = chinesePart;
+      }
+    } else if (pinyinMap[text]) {
+      // 如果整个文本是拼音字母，使用映射表
+      pronunciationText = pinyinMap[text];
+    } else {
+      // 处理题干中的拼音部分，如"复韵母 ai 的读音是？"或"单韵母 'i' 的读音是？"
+      pronunciationText = text.replace(/['"]([a-zA-ZüÜ]+)['"]/g, (match, pinyin) => {
+        const lowercasePinyin = pinyin.toLowerCase();
+        return pinyinMap[lowercasePinyin] || match;
+      });
+    }
+
     // 使用Web Speech API进行文本转语音
-    const speech = new SpeechSynthesisUtterance(text);
+    const speech = new SpeechSynthesisUtterance(pronunciationText);
     // 设置语言
     if (/[\u3040-\u309F]/.test(text)) { // 平假名
       speech.lang = 'ja-JP';
-    } else if (text.length === 1 || /[\u4e00-\u9fa5]/.test(text)) {
+    } else if (/[\u4e00-\u9fa5]/.test(pronunciationText) || pinyinMap[text]) {
       speech.lang = 'zh-CN';
     } else {
       speech.lang = 'en-US';
@@ -2460,12 +2616,17 @@ const startGame = (subject: string, taskIndex: number) => {
       let shuffledAnswer = questionData.answer;
       
       // 如果有选项，随机打乱顺序
-      if (questionData.options) {
+      if (questionData.options && Array.isArray(questionData.options)) {
         // 创建选项的副本并打乱
-        shuffledOptions = [...questionData.options];
+        shuffledOptions = [];
+        for (let i = 0; i < questionData.options.length; i++) {
+          shuffledOptions.push(questionData.options[i]);
+        }
         for (let i = shuffledOptions.length - 1; i > 0; i--) {
           const j = Math.floor(Math.random() * (i + 1));
-          [shuffledOptions[i], shuffledOptions[j]] = [shuffledOptions[j], shuffledOptions[i]];
+          const temp = shuffledOptions[i];
+          shuffledOptions[i] = shuffledOptions[j];
+          shuffledOptions[j] = temp;
         }
       }
       
@@ -2502,6 +2663,16 @@ const startGame = (subject: string, taskIndex: number) => {
     showFeedback.value = false;
     currentAnswer.value = '';
     experimentResult.value = '';
+    // 自动播放音频
+    setTimeout(() => {
+      if (currentGame.value.subject === 'japanese' && currentGame.value.audio) {
+        // 日语游戏播放日语发音
+        playAudio(currentGame.value.audio);
+      } else {
+        // 其他游戏播放题干
+        playAudio(currentGame.value.question);
+      }
+    }, 500);
     console.log('函数执行完毕，currentGame.value:', currentGame.value);
   } catch (error) {
     console.error('开始游戏时发生错误:', error);
@@ -2526,6 +2697,8 @@ const checkAnswer = (option: string) => {
     : `再试一次，加油！你选择的是 ${option}。`;
   showFeedback.value = true;
   if (isCorrect.value) {
+    // 回答正确时立即添加星星能量
+    starEnergyStore.addEnergy(starsPerQuestion, 'knowledge');
     playAudio(`太棒了，正确答案是 ${currentGame.value.answer}`);
   }
 };
@@ -2549,6 +2722,8 @@ const checkChineseAnswer = (option?: string) => {
       : `再试一次，加油！你选择的是 ${option}。`;
     showFeedback.value = true;
     if (isCorrect.value) {
+      // 回答正确时立即添加星星能量
+      starEnergyStore.addEnergy(starsPerQuestion, 'knowledge');
       playAudio(`太棒了，正确答案是 ${currentGame.value.answer}`);
     }
   } else {
@@ -2568,6 +2743,8 @@ const checkChineseAnswer = (option?: string) => {
       : `再试一次，加油！你选择的是 ${currentAnswer.value}。`;
     showFeedback.value = true;
     if (isCorrect.value) {
+      // 回答正确时立即添加星星能量
+      starEnergyStore.addEnergy(starsPerQuestion, 'knowledge');
       playAudio(`太棒了，正确答案是 ${currentGame.value.answer}`);
     }
   }
@@ -2590,6 +2767,8 @@ const checkEnglishAnswer = (option: string) => {
     : `Try again! You selected ${option}.`;
   showFeedback.value = true;
   if (isCorrect.value) {
+    // 回答正确时立即添加星星能量
+    starEnergyStore.addEnergy(starsPerQuestion, 'knowledge');
     playAudio(`Great! Correct! The correct answer is ${currentGame.value.answer}`);
   }
 };
@@ -2608,6 +2787,8 @@ const checkScienceAnswer = () => {
   }
   feedbackMessage.value = `实验成功！你真棒！正确答案是 ${currentGame.value.answer}。获得 ${starsPerQuestion} 颗星星能量！`;
   showFeedback.value = true;
+  // 科学实验完成时立即添加星星能量
+  starEnergyStore.addEnergy(starsPerQuestion, 'knowledge');
   playAudio(`太棒了，正确答案是 ${currentGame.value.answer}`);
 };
 
@@ -2628,6 +2809,8 @@ const checkJapaneseAnswer = (option: string) => {
     : `もう一度やってみて！你选择的是 ${option}。`;
   showFeedback.value = true;
   if (isCorrect.value) {
+    // 回答正确时立即添加星星能量
+    starEnergyStore.addEnergy(starsPerQuestion, 'knowledge');
     playAudio(`すごい！正确答案是 ${currentGame.value.answer}`);
   }
 };
@@ -2649,6 +2832,8 @@ const checkGeographyAnswer = (option: string) => {
     : `再试一次，加油！你选择的是 ${option}。`;
   showFeedback.value = true;
   if (isCorrect.value) {
+    // 回答正确时立即添加星星能量
+    starEnergyStore.addEnergy(starsPerQuestion, 'knowledge');
     playAudio(`太棒了，正确答案是 ${currentGame.value.answer}`);
   }
 };
@@ -2665,25 +2850,9 @@ const useItem = (item: any) => {
 
 // 下一题
 const nextQuestion = () => {
-  // 每完成一题获得星星能量
+  // 获取当前游戏信息
   const subject = currentGame.value.subject;
   const taskIndex = currentGame.value.taskIndex;
-  const task = tasks.value[subject]?.[taskIndex] || { reward: 5 };
-
-  // 计算每题的星星奖励（降低获得量）
-  let starsPerQuestion = 1;
-  if (subject === 'math' || subject === 'chinese' || subject === 'english' || subject === 'japanese' || subject === 'geography') {
-    // 降低数学、语文、英语、日语、地理的奖励获得量
-    // 总奖励为5，分成20题，每题0.25颗，向上取整为1颗
-    starsPerQuestion = Math.ceil((task.reward || 5) / 20); // 20题任务
-  } else if (subject === 'science') {
-    // 降低科学的奖励获得量
-    // 总奖励为8-12，分成10题，每题0.8-1.2颗，向上取整为1颗
-    starsPerQuestion = Math.ceil((task.reward || 5) / 15); // 15题任务的计算方式，降低获得量
-  }
-
-  // 添加星星能量
-  starEnergyStore.addEnergy(starsPerQuestion, 'knowledge');
   
   // 更新进度
   const taskType = currentGame.value.taskType;
@@ -2795,8 +2964,19 @@ const nextQuestion = () => {
       showFeedback.value = false;
       currentAnswer.value = '';
       experimentResult.value = '';
+      // 自动播放音频
+      setTimeout(() => {
+        if (currentGame.value.subject === 'japanese' && currentGame.value.audio) {
+          // 日语游戏播放日语发音
+          playAudio(currentGame.value.audio);
+        } else {
+          // 其他游戏播放题干
+          playAudio(currentGame.value.question);
+        }
+      }, 500);
   } else {
     // 完成所有题目
+    const task = tasks.value[subject]?.[taskIndex];
     if (task) {
       task.completed = true;
     }
@@ -2954,13 +3134,17 @@ const nextQuestion = () => {
 
 .subjects {
   display: grid;
-  grid-template-columns: repeat(2, 1fr);
+  grid-template-columns: repeat(3, 1fr);
   gap: 20px;
   margin-bottom: 30px;
   position: relative;
   z-index: 5;
 }
 
+.subjects > div {
+  display: contents;
+}
+
 .subject-card {
   background: white;
   border-radius: 25px;
@@ -3840,6 +4024,10 @@ const nextQuestion = () => {
 
 /* 响应式设计 */
 @media (max-width: 768px) {
+  .subjects {
+    grid-template-columns: repeat(2, 1fr);
+  }
+  
   .answer-options {
     grid-template-columns: 1fr;
   }
@@ -3858,4 +4046,10 @@ const nextQuestion = () => {
     max-width: 200px;
   }
 }
+
+@media (max-width: 480px) {
+  .subjects {
+    grid-template-columns: 1fr;
+  }
+}
 </style>

src/stores/starEnergy.ts

@@ -248,11 +248,11 @@ export const useStarEnergyStore = defineStore('starEnergy', {
       }
 
       // 奖励星星能量
-      this.addEnergy(1, 'habit');
+      this.addEnergy(10, 'habit');
 
       // 连续3天打卡额外奖励
       if (habitData.streak % 3 === 0) {
-        this.addEnergy(1, 'habit');
+        this.addEnergy(10, 'habit');
       }
 
       // 保存数据