debug

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}"