feat: 添加示例单词加载功能

src/views/SpellPractice.vue

@@ -33,6 +33,19 @@ const wordList = computed(() => {
     .filter((w) => w.length > 0);
 });
 
+// 示例单词列表
+const exampleWords = [
+  "apple", "banana", "orange", "grape", "strawberry",
+  "computer", "program", "keyboard", "screen", "mouse",
+  "book", "paper", "pencil", "school", "student",
+  "house", "window", "door", "table", "chair"
+];
+
+// 加载示例单词
+const loadExampleWords = () => {
+  wordInput.value = exampleWords.join("\n");
+};
+
 // 发音配置
 const selectedVoice = ref("4");
 const repeatCount = ref(2);
@@ -385,8 +398,17 @@ onUnmounted(() => {
         <div class="panel input-panel">
           <div class="panel-header">
             <h3>单词列表</h3>
+            <div class="header-actions">
+              <button
+                class="example-btn"
+                @click="loadExampleWords"
+                :disabled="dictationState === 'playing' || dictationState === 'paused'"
+              >
+                示例单词
+              </button>
               <span class="word-count">{{ wordList.length }} 个单词</span>
             </div>
+          </div>
           <div class="word-input-wrapper">
             <textarea
               v-model="wordInput"
@@ -834,6 +856,33 @@ onUnmounted(() => {
   font-size: 0.875rem;
 }
 
+.header-actions {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+}
+
+.example-btn {
+  background: rgba(255, 255, 255, 0.05);
+  color: var(--accent-5);
+  border: 1px solid var(--accent-5);
+  padding: 0.375rem 0.75rem;
+  border-radius: 8px;
+  font-size: 0.75rem;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.example-btn:hover:not(:disabled) {
+  background: rgba(245, 158, 11, 0.1);
+}
+
+.example-btn:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
 /* 输入区 */
 .word-input-wrapper {
   overflow: hidden;