debug

src/assets/css/style.scss

@@ -29,6 +29,8 @@ html[data-theme='dark'] {
   //--color-tooltip-bg: rgb(60, 63, 65);
   --color-tooltip-bg: #252525;
   --color-font-1: white;
+
+  --color-item-bg: gray;
 }
 
 $anim-time: 0.3s;

src/components/ListItem.vue

@@ -38,8 +38,8 @@ defineEmits<{
 .list-item {
   width: 100%;
   box-sizing: border-box;
-  background: white;
-  color: black;
+  background: var(--color-item-bg);
+  color: var(--color-font-1);
   font-size: 18rem;
   border-radius: 8rem;
   display: flex;

src/components/Practice/Options.vue

@@ -4,6 +4,10 @@ import Tooltip from "@/components/Tooltip.vue";
 import IconWrapper from "@/components/IconWrapper.vue";
 import {Icon} from "@iconify/vue";
 
+defineProps<{
+  showEdit?: boolean
+}>()
+
 const emit = defineEmits<{
   remove: [],
   collect: [],
@@ -14,7 +18,7 @@ const emit = defineEmits<{
 
 <template>
   <div class="options">
-    <Tooltip title="编辑(快捷键：Ctrl + E)">
+    <Tooltip  v-if="showEdit" title="编辑(快捷键：Ctrl + E)">
       <IconWrapper>
         <Icon icon="tabler:edit" class="menu"
               @click="emit('edit')"/>

src/components/Practice/PracticeArticle/TypingArticle.vue

@@ -378,6 +378,7 @@ function toggleCollect() {
       <div class="titleTranslate" v-if="settingStore.translate">{{ props.article.titleTranslate }}</div>
       <div class="options-wrapper">
         <Options
+            :show-edit="true"
             @edit="emit('edit',props.article)"
             @collect="toggleCollect"
             @skip="emit('next')"

src/components/Practice/PracticeWord/PracticeWord.vue

@@ -2,11 +2,14 @@
 
 import TypingWord from "@/components/Practice/PracticeWord/TypingWord.vue";
 import {$ref} from "vue/macros";
-import {cloneDeep} from "lodash-es";
+import {chunk, cloneDeep} from "lodash-es";
 import {useBaseStore} from "@/stores/base.ts";
 import {onMounted, watch} from "vue";
+import {useRuntimeStore} from "@/stores/runtime.ts";
+import {Word} from "@/types.ts";
 
 const store = useBaseStore()
+const runtimeStore = useRuntimeStore()
 
 let wordData = $ref({
   words: [],
@@ -25,6 +28,12 @@ watch([
 
 function getCurrentPractice() {
   // console.log('store.currentDict',store.currentDict)
+  if (store.currentDict.translateLanguage === 'common') {
+    store.chapter.map((w: Word) => {
+      let res = runtimeStore.translateWordList.find(a => a.name === w.name)
+      if (res) w = Object.assign(w, res)
+    })
+  }
   wordData.words = cloneDeep(store.chapter)
   wordData.index = 0
   console.log('wordData', wordData)

src/components/Practice/PracticeWord/Typing.vue

@@ -46,7 +46,7 @@ watch(() => props.word, () => {
   wordRepeatCount = 0
   inputLock = false
   if (settingStore.wordSound) {
-    volumeIconRef?.play()
+    volumeIconRef?.play(400,true)
   }
 })
 

src/components/Practice/PracticeWord/TypingWord.vue

@@ -308,9 +308,10 @@ useOnKeyboardEventListener(onKeyDown, onKeyUp)
     }
   }
 
-  .options-wrapper{
+  .options-wrapper {
     position: absolute;
     //bottom: 0;
+    margin-left: -30rem;
     margin-top: 120rem;
   }
 }

src/components/VolumeIcon.vue

@@ -15,7 +15,11 @@ let step = $ref(2)
 let count = $ref(0)
 const emit = defineEmits(['click'])
 
-function play(time = props.time) {
+function play(time = props.time, reset = false) {
+  if (reset) {
+    step = 2
+    count = 0
+  }
   if (count === 0) {
     props?.cb?.()
   }

src/components/WordList.vue

@@ -55,6 +55,7 @@ const playWordAudio = usePlayWordAudio()
   <div class="list" ref="listRef">
     <ListItem
         v-for="(word,i) in list" :key="i"
+        @click="emit('change',i)"
         :active="activeIndex === i"
         class="item"
         :class="{active:activeIndex === i}"

src/stores/base.ts

@@ -194,10 +194,10 @@ export const useBaseStore = defineStore('base', {
         }
       ],
       current: {
-        // dictType: DictType.word,
-        // index: 1,
-        dictType: DictType.article,
-        index: 0,
+        dictType: DictType.word,
+        index: 1,
+        // dictType: DictType.article,
+        // index: 0,
         practiceType: DictType.word,
       },
       simpleWords: [
@@ -301,7 +301,7 @@ export const useBaseStore = defineStore('base', {
         ].includes(this.current.dictType)) {
           if (!this.currentDict.originWords.length) {
             let r = await fetch(`./dicts/${this.currentDict.language}/${this.currentDict.type}/${this.currentDict.translateLanguage}/${this.currentDict.url}`)
-            // let r = await fetch(`.${this.currentDict.url}`)0
+            // let r = await fetch(`.${this.currentDict.url}`)
             r.json().then(v => {
               if (this.currentDict.translateLanguage === 'common') {
                 const runtimeStore = useRuntimeStore()
@@ -310,14 +310,14 @@ export const useBaseStore = defineStore('base', {
                     console.time()
                     runtimeStore.translateWordList = list
 
-                    v.map((w: Word) => {
+                    this.currentDict.originWords = cloneDeep(v)
+                    this.currentDict.words = cloneDeep(v)
+                    this.currentDict.chapterWords = chunk(this.currentDict.words, this.currentDict.chapterWordNumber)
+                    this.currentDict.chapterWords[this.currentDict.chapterIndex].map((w: Word) => {
                       let res = list.find(a => a.name === w.name)
                       if (res) w = Object.assign(w, res)
                     })
 
-                    this.currentDict.originWords = cloneDeep(v)
-                    this.currentDict.words = cloneDeep(v)
-                    this.currentDict.chapterWords = chunk(this.currentDict.words, this.currentDict.chapterWordNumber)
                     this.load = true
 
                     console.timeEnd()