save

src/pages/pc/components/dialog/DictDiglog.vue

@@ -15,23 +15,15 @@ import Dialog from "@/pages/pc/components/dialog/Dialog.vue";
 import {useRouter} from "vue-router";
 
 const store = useBaseStore()
-const settingStore = useSettingStore()
 const runtimeStore = useRuntimeStore()
-let router = useRouter()
 
 let show = $ref(false)
 let chapterWordNumber = $ref(0)
-let toggleLoading = $ref(false)
-
 
 function close() {
   show = false
 }
 
-const dictIsArticle = $computed(() => {
-  return isArticle(runtimeStore.editDict.type)
-})
-
 function showAllWordModal() {
   emitter.emit(EventKey.openWordListModal, {
     title: runtimeStore.editDict.name,
@@ -52,13 +44,6 @@ function resetChapterList(v: number) {
   }
 }
 
-function option(type: string) {
-  show = false
-  setTimeout(() => {
-    router.push({path: '/pc/dict', query: {type: type}})
-  }, 500)
-}
-
 onMounted(() => {
   emitter.on(EventKey.openDictModal, (typ) => {
     show = true
@@ -76,7 +61,7 @@ onMounted(() => {
     <div id="DictDialog">
       <header>
         <div class="text-2xl">
-          {{ store.currentDict.name }}
+          {{ store.currentStudyWordDict.name }}
         </div>
         <Icon @click="close"
               class="hvr-grow pointer"
@@ -84,18 +69,12 @@ onMounted(() => {
               icon="ion:close-outline"/>
       </header>
       <div class="detail">
-        <div class="desc">{{ store.currentDict.description }}</div>
-        <div class="text flex align-center">
-          <div v-if="dictIsArticle">总文章：{{ store.currentDict.articles.length }}篇
-          </div>
-          <div v-else>总词汇：
-            <span class="count" @click="showAllWordModal">{{
-                store.currentDict.originWords.length
-              }}词</span>
-          </div>
-          <BaseIcon icon="mi:add"
-                    @click='option("addWordOrArticle")'
-                    :title="`添加${dictIsArticle?'文章':'单词'}`"
+        <div class="desc">{{ store.currentStudyWordDict.description }}</div>
+        <div class="text flex align-center gap-2">
+          <div>总词汇： {{ store.currentStudyWordDict.originWords.length }}词</div>
+          <BaseIcon icon="circum:view-list"
+                    @click='showAllWordModal'
+                    title="单词列表"
           />
         </div>
         <div class="text">开始日期：-</div>
@@ -189,10 +168,6 @@ $header-height: 4rem;
       margin-bottom: 1.2rem;
     }
 
-    .count {
-      cursor: pointer;
-      border-bottom: 2px solid var(--color-item-active);
-    }
 
     :deep(.edit-icon) {
       position: absolute;

src/pages/pc/components/dialog/WordListDialog.vue

@@ -53,7 +53,7 @@ onUnmounted(() => {
 .all-word {
   padding-bottom: var(--space);
   padding-top: 0;
-  width: 400rem;
+  width: 30rem;
   height: 75vh;
   display: flex;
 }

src/pages/pc/components/toolbar/index.vue

@@ -65,7 +65,7 @@ const {nav} = useNav()
         <Tooltip
             :title="`词典详情(${settingStore.shortcutKeyMap[ShortcutKey.OpenDictDetail]})`">
           <div class="info" @click="emitter.emit(EventKey.openDictModal,'detail')">
-            {{ store.currentDict.name }} {{ practiceStore.repeatNumber ? '  复习错词' : '' }}
+            {{ store.currentStudyWordDict.name }} {{ practiceStore.repeatNumber ? '  复习错词' : '' }}
           </div>
         </Tooltip>
         <BaseIcon title="切换词典"

src/pages/pc/practice/practice-word/index.vue

@@ -12,8 +12,6 @@ import {useSettingStore} from "@/stores/setting.ts";
 import {syncMyDictList} from "@/hooks/dict.ts";
 
 const store = useBaseStore()
-const runtimeStore = useRuntimeStore()
-const settingStore = useSettingStore()
 
 let wordData = $ref({
   words: [],
@@ -21,9 +19,9 @@ let wordData = $ref({
 })
 
 function getCurrentPractice() {
-  if (store.currentWordDict.words?.length) {
+  if (store.currentStudyWordDict.words?.length) {
     wordData.index = 0
-    wordData.words = cloneDeep(store.currentWordDict.words.slice(store.currentStudy.word.lastLearnIndex, store.currentStudy.word.lastLearnIndex + store.currentStudy.word.perDayStudyNumber))
+    wordData.words = cloneDeep(store.currentStudyWordDict.words.slice(store.currentStudy.word.lastLearnIndex, store.currentStudy.word.lastLearnIndex + store.currentStudy.word.perDayStudyNumber))
     emitter.emit(EventKey.resetWord)
   }
 }

src/pages/pc/word/StudyWord.vue

@@ -13,12 +13,15 @@ import {useRuntimeStore} from "@/stores/runtime.ts";
 import {MessageBox} from "@/utils/MessageBox.tsx";
 import PracticeArticle from "@/pages/pc/practice/practice-article/index.vue";
 import PracticeWord from "@/pages/pc/practice/practice-word/index.vue";
-import {ShortcutKey} from "@/types.ts";
+import {ShortcutKey, Word} from "@/types.ts";
 import DictModal from "@/pages/pc/components/dialog/DictDiglog.vue";
 import {useStartKeyboardEventListener} from "@/hooks/event.ts";
 import useTheme from "@/hooks/theme.ts";
 import Logo from "@/pages/pc/components/Logo.vue";
 import {Icon} from "@iconify/vue";
+import TypingWord from "@/pages/pc/practice/practice-word/TypingWord.vue";
+import {cloneDeep} from "lodash-es";
+import {syncMyDictList} from "@/hooks/dict.ts";
 
 const practiceStore = usePracticeStore()
 const store = useBaseStore()
@@ -60,7 +63,7 @@ function write() {
 function repeat() {
   // console.log('repeat')
   emitter.emit(EventKey.resetWord)
-  practiceRef.getCurrentPractice()
+  getCurrentPractice()
 }
 
 function prev() {
@@ -137,13 +140,49 @@ onUnmounted(() => {
   emitter.off(ShortcutKey.TogglePanel, togglePanel)
 })
 
+
+let wordData = $ref({
+  words: [],
+  index: -1
+})
+
+function getCurrentPractice() {
+  if (store.currentStudyWordDict.words?.length) {
+    wordData.index = 0
+    wordData.words = cloneDeep(store.currentStudyWordDict.words.slice(store.currentStudy.word.lastLearnIndex, store.currentStudy.word.lastLearnIndex + store.currentStudy.word.perDayStudyNumber))
+    emitter.emit(EventKey.resetWord)
+  }
+}
+
+//TODO wait
+function sort(list: Word[]) {
+  store.currentDict.chapterWords[store.currentDict.chapterIndex] = wordData.words = list
+  wordData.index = 0
+  syncMyDictList(store.currentDict)
+}
+
+onMounted(() => {
+  getCurrentPractice()
+  emitter.on(EventKey.changeDict, getCurrentPractice)
+})
+
+onUnmounted(() => {
+  emitter.off(EventKey.changeDict, getCurrentPractice)
+})
+
+
 useStartKeyboardEventListener()
 
 </script>
 <template>
   <div class="practice-wrapper">
     <Toolbar/>
-    <PracticeWord ref="practiceRef"/>
+    <div class="flex flex-1">
+      <TypingWord
+          @sort="sort"
+          v-model:words="wordData.words"
+          :index="wordData.index"/>
+    </div>
     <Footer/>
   </div>
   <DictModal/>

src/pages/pc/word/WordHome.vue

@@ -43,12 +43,12 @@ function clickEvent(e) {
         <div class="card ">
           <div class="flex justify-between items-center">
             <div class="bg-slate-200 p-3 rounded-md cursor-pointer flex items-center">
-              <span class="text-lg font-bold">{{ base.currentWordDict.name }}</span>
+              <span class="text-lg font-bold">{{ base.currentStudyWordDict.name }}</span>
               <Icon icon="gg:arrows-exchange" class="text-2xl ml-2"/>
               <Icon icon="uil:setting" class="text-2xl ml-2"/>
             </div>
             <div class="rounded-xl bg-slate-800 flex items-center py-3 px-5 text-white cursor-pointer"
-                 @click="router.push('/practice')">
+                 @click="router.push('study-word')">
               开始学习
             </div>
           </div>