save

2024-06-05 23:50:16 +08:00
parent 9b5c007514
commit 682b692070
20 changed files with 313 additions and 476 deletions
--- a/src/pages/mobile/SetDictPlan.vue
+++ b/src/pages/mobile/SetDictPlan.vue
@@ -4,7 +4,7 @@ import DictPlan from "@/pages/mobile/components/DictPlan.vue";
 import NavBar from "@/pages/mobile/components/NavBar.vue";
 import {onMounted} from "vue";
 import {useRoute} from "vue-router";
-import {DefaultDict, Dict} from "@/types.ts";
+import {Dict, getDefaultDict} from "@/types.ts";
 import {cloneDeep} from "lodash-es";
 import {nanoid} from "nanoid";
 import {dictionaryResources} from "@/assets/dictionary.ts";
@@ -27,7 +27,7 @@ onMounted(() => {
    runtimeStore.editDict = cloneDeep(find)
  } else {
    runtimeStore.editDict = cloneDeep({
-      ...cloneDeep(DefaultDict),
+      ...getDefaultDict(),
      ...item,
    })
    runtimeStore.editDict.id = nanoid(6)
--- a/src/pages/mobile/components/MobilePanel.vue
+++ b/src/pages/mobile/components/MobilePanel.vue
@@ -3,7 +3,7 @@ import {useBaseStore} from "@/stores/base.ts"

 import {computed, onMounted, onUnmounted, provide, watch} from "vue"
 import {useSettingStore} from "@/stores/setting.ts";
-import {emitter, EventKey} from "@/utils/eventBus.ts";
+import {emitter, EventKey, useEvent} from "@/utils/eventBus.ts";
 import SlideHorizontal from "@/components/slide/SlideHorizontal.vue";
 import SlideItem from "@/components/slide/SlideItem.vue";
 import CollectList from "@/pages/mobile/components/CollectList.vue";
@@ -21,14 +21,8 @@ watch(() => settingStore.showPanel, n => {
  }
 })

-onMounted(() => {
-  emitter.on(EventKey.changeDict, () => {
-    tabIndex = 0
-  })
-})
-
-onUnmounted(() => {
-  emitter.off(EventKey.changeDict)
+useEvent(EventKey.changeDict, () => {
+  tabIndex = 0
 })


--- a/src/pages/mobile/practice/index-test.vue
+++ b/src/pages/mobile/practice/index-test.vue
@@ -39,26 +39,15 @@ const word: Word = $computed(() => {
 })

 function getCurrentPractice() {
-  if (store.chapter.length) {
-    data.words = store.chapter
-    data.index = 0

-    data.words = cloneDeep(store.chapter)
-    emitter.emit(EventKey.resetWord)
-  }
 }

 function sort(list: Word[]) {
-  store.currentDict.chapterWords[store.currentDict.chapterIndex] = data.words = list
  data.index = 0
  syncMyDictList(store.currentDict)
 }

 function nextChapter() {
-  if (store.currentDict.chapterIndex >= store.currentDict.chapterWords.length - 1) {
-    store.currentDict.chapterIndex = 0
-  } else store.currentDict.chapterIndex++
-
  getCurrentPractice()
 }

@@ -222,7 +211,6 @@ function unknow() {
                <div class="list-header">
                  <div class="left">
                    <div class="title">
-                      {{ store.chapterName }}
                    </div>
                    <BaseIcon title="切换词典"
                              @click="emitter.emit(EventKey.openDictModal,'list')"
@@ -249,7 +237,7 @@ function unknow() {
                    </div>
                    <BaseIcon icon="bi:arrow-right"
                              @click="next"
-                              v-if="store.currentDict.chapterIndex < store.currentDict.chapterWords.length - 1"/>
+                    />
                  </div>
                  <div class="right">
                    {{ data.words.length }}个单词
--- a/src/pages/mobile/practice/practice-word/TypingWord.vue
+++ b/src/pages/mobile/practice/practice-word/TypingWord.vue
@@ -318,7 +318,6 @@ onMounted(() => {
              <div class="list-header">
                <div class="left">
                  <div class="title">
-                    {{ store.chapterName }}
                  </div>
                  <BaseIcon title="切换词典"
                            @click="emitter.emit(EventKey.openDictModal,'list')"
--- a/src/pages/mobile/practice/practice-word/index.vue
+++ b/src/pages/mobile/practice/practice-word/index.vue
@@ -7,7 +7,7 @@ import {useBaseStore} from "@/stores/base.ts";
 import {onMounted, onUnmounted} from "vue";
 import {useRuntimeStore} from "@/stores/runtime.ts";
 import {ShortcutKey, Word} from "@/types.ts";
-import {emitter, EventKey} from "@/utils/eventBus.ts";
+import {emitter, EventKey, useEvent, useEvents} from "@/utils/eventBus.ts";
 import {useSettingStore} from "@/stores/setting.ts";
 import {syncMyDictList} from "@/hooks/dict.ts";

@@ -29,31 +29,24 @@ function getCurrentPractice() {
 }

 function sort(list: Word[]) {
-  store.currentDict.chapterWords[store.currentDict.chapterIndex] = wordData.words = list
  wordData.index = 0
  syncMyDictList(store.currentDict)
 }

 function next() {
-  if (store.currentDict.chapterIndex >= store.currentDict.chapterWords.length - 1) {
-    store.currentDict.chapterIndex = 0
-  } else store.currentDict.chapterIndex++
-
  getCurrentPractice()
 }

 onMounted(() => {
  getCurrentPractice()
-  emitter.on(EventKey.changeDict, getCurrentPractice)
-  emitter.on(EventKey.next, next)
-  emitter.on(ShortcutKey.NextChapter, next)
+
 })

-onUnmounted(() => {
-  emitter.off(EventKey.changeDict, getCurrentPractice)
-  emitter.off(EventKey.next, next)
-  emitter.off(ShortcutKey.NextChapter, next)
-})
+useEvents([
+  [EventKey.changeDict, getCurrentPractice],
+  [EventKey.next, next],
+  [ShortcutKey.NextChapter, next],
+])

 defineExpose({getCurrentPractice})

--- a/src/pages/pc/components/Panel.vue
+++ b/src/pages/pc/components/Panel.vue
@@ -13,7 +13,7 @@ import {Icon} from "@iconify/vue";
 import Tooltip from "@/pages/pc/components/Tooltip.vue";
 import IconWrapper from "@/pages/pc/components/IconWrapper.vue";
 import BaseIcon from "@/components/BaseIcon.vue";
-import {emitter, EventKey} from "@/utils/eventBus.ts";
+import {emitter, EventKey, useEvent} from "@/utils/eventBus.ts";
 import {useRouter} from "vue-router";
 import {useRuntimeStore} from "@/stores/runtime.ts";
 import {cloneDeep} from "lodash-es";
@@ -46,14 +46,8 @@ function changeIndex(dict: Dict) {
  store.changeDict(dict, practiceType)
 }

-onMounted(() => {
-  emitter.on(EventKey.changeDict, () => {
-    tabIndex = 0
-  })
-})
-
-onUnmounted(() => {
-  emitter.off(EventKey.changeDict)
+useEvent(EventKey.changeDict, () => {
+  tabIndex = 0
 })

 const {
--- a/src/pages/pc/dict/components/ArticleDictDetail.vue
+++ b/src/pages/pc/dict/components/ArticleDictDetail.vue
@@ -5,7 +5,7 @@ import BaseButton from "@/components/BaseButton.vue";
 import Empty from "@/components/Empty.vue";
 import {useRuntimeStore} from "@/stores/runtime.ts";
 import {cloneDeep} from "lodash-es";
-import {Article, DefaultArticle, DefaultDict, Dict, DictResource, DictType, Sort, TranslateType} from "@/types.ts";
+import {Article, DefaultArticle, Dict, DictResource, DictType, getDefaultDict, Sort, TranslateType} from "@/types.ts";
 import {emitter, EventKey} from "@/utils/eventBus.ts";
 import EditBatchArticleModal from "@/pages/pc/components/article/EditBatchArticleModal.vue";
 import {Icon} from "@iconify/vue";
@@ -58,7 +58,7 @@ async function getDictDetail(val: {
    runtimeStore.editDict = cloneDeep(find)
  } else {
    runtimeStore.editDict = cloneDeep({
-      ...cloneDeep(DefaultDict),
+      ...getDefaultDict(),
      ...item,
    })
    runtimeStore.editDict.id = nanoid(6)
--- a/src/pages/pc/dict/components/EditDict.vue
+++ b/src/pages/pc/dict/components/EditDict.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">

-import {DefaultDict, Dict, DictType} from "@/types.ts";
+import {Dict, DictType, getDefaultDict} from "@/types.ts";
 import {cloneDeep} from "lodash-es";

 import {FormInstance, FormRules} from "element-plus";
@@ -54,7 +54,7 @@ async function onSubmit() {
  await dictFormRef.validate((valid, fields) => {
    if (valid) {
      let data: Dict = cloneDeep({
-        ...DefaultDict,
+        ...getDefaultDict(),
        ...dictForm,
      })
      //任意修改，都将其变为自定义词典
@@ -100,7 +100,7 @@ onMounted(() => {
  })

  if (props.isAdd) {
-    dictForm = cloneDeep(DefaultDict)
+    dictForm = getDefaultDict()
  } else {
    dictForm = cloneDeep(runtimeStore.editDict)
  }
--- a/src/pages/pc/dict/components/WordDictDetail.vue
+++ b/src/pages/pc/dict/components/WordDictDetail.vue
@@ -3,7 +3,7 @@
 import BaseIcon from "@/components/BaseIcon.vue";
 import BaseButton from "@/components/BaseButton.vue";
 import {assign, chunk, cloneDeep, reverse, shuffle} from "lodash-es";
-import {DefaultDict, Dict, DictResource, DictType, Sort, Word} from "@/types.ts";
+import {Dict, DictResource, DictType, getDefaultDict, Sort, Word} from "@/types.ts";
 import {nanoid} from "nanoid";
 import {FormInstance, FormRules} from "element-plus";
 import {reactive} from "vue";
@@ -78,7 +78,7 @@ async function getDictDetail(val: {
    runtimeStore.editDict = cloneDeep(find)
  } else {
    runtimeStore.editDict = cloneDeep({
-      ...cloneDeep(DefaultDict),
+      ...getDefaultDict(),
      ...item,
    })
    runtimeStore.editDict.id = nanoid(6)
--- a/src/pages/pc/practice/practice-article/index.vue
+++ b/src/pages/pc/practice/practice-article/index.vue
@@ -19,7 +19,7 @@ import {MessageBox} from "@/utils/MessageBox.tsx";
 import {useBaseStore} from "@/stores/base.ts";
 import EditSingleArticleModal from "@/pages/pc/components/article/EditSingleArticleModal.vue";
 import {usePracticeStore} from "@/stores/practice.ts";
-import {emitter, EventKey} from "@/utils/eventBus.ts";
+import {emitter, EventKey, useEvents} from "@/utils/eventBus.ts";
 import IconWrapper from "@/pages/pc/components/IconWrapper.vue";
 import {Icon} from "@iconify/vue";
 import Tooltip from "@/pages/pc/components/Tooltip.vue";
@@ -284,27 +284,19 @@ function shortcutKeyEdit() {

 onMounted(() => {
  init()
-  emitter.on(EventKey.changeDict, init)
-  emitter.on(EventKey.next, next)
-
-  emitter.on(ShortcutKey.NextChapter, next)
-  emitter.on(ShortcutKey.PlayWordPronunciation, play)
-  emitter.on(ShortcutKey.ShowWord, show)
-  emitter.on(ShortcutKey.Next, skip)
-  emitter.on(ShortcutKey.ToggleCollect, collect)
-  emitter.on(ShortcutKey.EditArticle, shortcutKeyEdit)
 })

-onUnmounted(() => {
-  emitter.off(EventKey.changeDict, init)
-  emitter.off(EventKey.next, next)
-  emitter.off(ShortcutKey.NextChapter, next)
-  emitter.off(ShortcutKey.PlayWordPronunciation, play)
-  emitter.off(ShortcutKey.ShowWord, show)
-  emitter.off(ShortcutKey.Next, skip)
-  emitter.off(ShortcutKey.ToggleCollect, collect)
-  emitter.off(ShortcutKey.EditArticle, shortcutKeyEdit)
-})
+useEvents([
+  [EventKey.changeDict, init],
+  [EventKey.next, next],
+
+  [ShortcutKey.NextChapter, next],
+  [ShortcutKey.PlayWordPronunciation, play],
+  [ShortcutKey.ShowWord, show],
+  [ShortcutKey.Next, skip],
+  [ShortcutKey.ToggleCollect, collect],
+  [ShortcutKey.EditArticle, shortcutKeyEdit],
+])

 defineExpose({getCurrentPractice})

--- a/src/pages/pc/word/EditWordDict.vue
+++ b/src/pages/pc/word/EditWordDict.vue
@@ -6,10 +6,9 @@ import {useRoute} from "vue-router";
 import {useRuntimeStore} from "@/stores/runtime.ts";
 import {useBaseStore} from "@/stores/base.ts";
 import {assign, cloneDeep, reverse, shuffle} from "lodash-es";
-import {DefaultDict, Sort, Word} from "@/types.ts";
+import {Sort, Word} from "@/types.ts";
 import {nanoid} from "nanoid";
 import BaseIcon from "@/components/BaseIcon.vue";
-import {Icon} from "@iconify/vue";
 import {useNav} from "@/utils";
 import {FormInstance, FormRules} from "element-plus";
 import MiniDialog from "@/pages/pc/components/dialog/MiniDialog.vue";
@@ -174,13 +173,11 @@ function sort(type: Sort) {

 <template>
  <BasePage>
-    <header class="flex gap-4">
-      <div class="back" @click.stop="back">
-        <Icon icon="octicon:arrow-left-24" width="20"/>
-      </div>
+    <header class="flex gap-4 items-center">
+      <BaseIcon  @click="back" icon="octicon:arrow-left-24" width="20"/>
      <div class="left">
        <div class="top">
-          <div class="title">
+          <div class="text-xl">
            {{ runtimeStore.editDict.name }}
          </div>
        </div>
--- a/src/pages/pc/word/WordHome.vue
+++ b/src/pages/pc/word/WordHome.vue
@@ -6,12 +6,13 @@ import "vue-activity-calendar/style.css";
 import {useRouter} from "vue-router";
 import BaseIcon from "@/components/BaseIcon.vue";
 import Dialog from "@/pages/pc/components/dialog/Dialog.vue";
-import {useNav} from "@/utils";
+import {_getAccomplishDate, _getAccomplishDays, useNav} from "@/utils";
 import BasePage from "@/pages/pc/components/BasePage.vue";
 import {getDefaultDict} from "@/types.ts";
 import {onMounted, watch} from "vue";
 import {getCurrentStudyWord} from "@/hooks/dict.ts";
 import {usePracticeStore} from "@/stores/practice.ts";
+import {EventKey, useEvent} from "@/utils/eventBus.ts";

 const store = useBaseStore()
 const statStore = usePracticeStore()
@@ -34,11 +35,6 @@ let currentStudy = $ref({
  review: [],
  write: []
 })
-watch(() => store.load, n => {
-  if (n) {
-    currentStudy = getCurrentStudyWord()
-  }
-})

 onMounted(() => {
  if (!currentStudy.new.length) {
@@ -46,12 +42,21 @@ onMounted(() => {
  }
 })

+useEvent(EventKey.changeDict, () => {
+  currentStudy = getCurrentStudyWord()
+})
+
 function study() {
  nav('study-word', {}, currentStudy)
 }

 let show = $ref(false)
 let tempPerDayStudyNumber = $ref(0)
+
+function changePerDayStudyNumber() {
+  store.sdict.perDayStudyNumber = tempPerDayStudyNumber
+  currentStudy = getCurrentStudyWord()
+}
 </script>

 <template>
@@ -68,35 +73,27 @@ let tempPerDayStudyNumber = $ref(0)
                @click="router.push('/dict')"/>
          </div>
          <div class="flex-1 flex flex-col justify-end items-end">
-            <div class="flex gap-3">
-              <div class="">
-                <div class="title">
-                  每日目标
-                </div>
-                <div class="flex">
-                  <div style="color:#ac6ed1;" class="cursor-pointer" v-if="false">
-                    更改目标
-                  </div>
-                  <div class="text-xs">学习 {{ store.sdict.perDayStudyNumber }} 个单词</div>
-                </div>
-              </div>
+            <div class="flex gap-3 items-center">
+              每日目标
              <div
+                  style="color:#ac6ed1;"
                  @click="show = true;tempPerDayStudyNumber = store.sdict.perDayStudyNumber"
-                  class="bg-slate-200 w-10 h-10 flex center text-2xl rounded cursor-pointer">
+                  class="bg-slate-200 px-2 h-10 flex center text-2xl rounded cursor-pointer">
                {{ store.sdict.perDayStudyNumber }}
              </div>
+              个单词
            </div>
-            <div class="mt-2">
-              <div>预计完成日期：2024-04-01</div>
+            <div class="mt-2 text-sm">
+              预计完成日期：{{ _getAccomplishDate(store.sdict.words.length, store.sdict.perDayStudyNumber) }}
            </div>
          </div>
        </div>
        <div class="mt-2">
          <div class="text-sm flex justify-between">
            已学习{{ store.currentStudyWordProgress }}%
-            <span>{{ store.currentStudyWordDict.lastLearnIndex }} /{{
+            <span>{{ store.currentStudyWordDict.lastLearnIndex }} / {{
                store.currentStudyWordDict.words.length
-              }}词</span>
+              }}</span>
          </div>
          <el-progress class="mt-1" :percentage="store.currentStudyWordProgress" :show-text="false"></el-progress>
        </div>
@@ -205,7 +202,7 @@ let tempPerDayStudyNumber = $ref(0)
    <Dialog v-model="show"
            title="每日目标"
            :footer="true"
-            @ok="store.sdict.perDayStudyNumber = tempPerDayStudyNumber"
+            @ok="changePerDayStudyNumber"
    >
      <div class="target-modal">
        <div class="center text-2xl gap-2">
@@ -228,7 +225,7 @@ let tempPerDayStudyNumber = $ref(0)
          <div>预计</div>
          <span class="text-2xl"
                style="color:rgb(176,116,211)">{{
-              Math.ceil(store.sdict.words.length / tempPerDayStudyNumber)
+              _getAccomplishDays(store.sdict.words.length, tempPerDayStudyNumber)
            }}</span>天完成学习
        </div>
        <div>