feat:将词典的words字段设置为不响应式，因为太卡了

src/pages/pc/Setting.vue

@@ -110,20 +110,15 @@ function importData(e) {
       }
       try {
         obj = JSON.parse(str)
+        let data = obj.val
+        let settingState = checkAndUpgradeSaveSetting(data.setting)
+        settingStore.setState(settingState)
+        let baseState = checkAndUpgradeSaveDict(data.dict)
+        store.setState(baseState)
+        ElMessage.success('导入成功！')
       } catch (err) {
-        ElMessage.error('导入失败！')
+        return ElMessage.error('导入失败！')
       }
-      if (obj.version === EXPORT_DATA_KEY.version) {
-
-      } else {
-        //TODO
-      }
-      let data = obj.val
-      let settingState = checkAndUpgradeSaveSetting(data.setting)
-      settingStore.setState(settingState)
-      let dictState = checkAndUpgradeSaveDict(data.dict)
-      store.init(dictState)
-      ElMessage.success('导入成功！')
     }
   }
   reader.readAsText(file);

src/pages/pc/word/DictDetail.vue

@@ -1,9 +1,9 @@
 <script setup lang="tsx">
-import {DictId, getDefaultDict, getDefaultWord} from "@/types";
 import type {Word} from "@/types";
+import {DictId, getDefaultDict} from "@/types";
 
 import BasePage from "@/pages/pc/components/BasePage.vue";
-import {computed, nextTick, onMounted, reactive} from "vue";
+import {computed, onMounted, reactive} from "vue";
 import {useRuntimeStore} from "@/stores/runtime.ts";
 import {assign, cloneDeep} from "lodash-es";
 import {nanoid} from "nanoid";
@@ -18,7 +18,6 @@ import {useRoute, useRouter} from "vue-router";
 import {useBaseStore} from "@/stores/base.ts";
 import EditBook from "@/pages/pc/article/components/EditBook.vue";
 import {_getDictDataByUrl, _nextTick, convertToWord} from "@/utils";
-import {emitter, EventKey} from "@/utils/eventBus.ts";
 
 const runtimeStore = useRuntimeStore()
 const base = useBaseStore()
@@ -59,7 +58,7 @@ const wordRules = reactive<FormRules>({
     {max: 30, message: '名称不能超过30个字符', trigger: 'blur'},
   ],
 })
-
+let studyLoading = $ref(false)
 
 function syncDictInMyStudyList(study = false) {
   _nextTick(() => {
@@ -190,13 +189,13 @@ function formClose() {
 }
 
 async function addMyStudyList() {
+  studyLoading = true
+  await base.changeDict(runtimeStore.editDict)
+  studyLoading = false
   if (route.query?.from) {
     router.back()
   }
   router.back()
-  requestIdleCallback(()=>{
-    base.changeDict(runtimeStore.editDict)
-  })
 }
 
 defineRender(() => {
@@ -209,7 +208,7 @@ defineRender(() => {
                   <div class="absolute page-title text-align-center w-full">{runtimeStore.editDict.name}</div>
                   <div class="flex gap-2">
                     <BaseButton type="info" onClick={() => isEdit = true}>编辑</BaseButton>
-                    <BaseButton onClick={addMyStudyList}>学习</BaseButton>
+                    <BaseButton loading={studyLoading} onClick={addMyStudyList}>学习</BaseButton>
                   </div>
                 </div>
                 <div class="text-lg  ">介绍：{runtimeStore.editDict.description}</div>

src/pages/pc/word/WordHomePage.vue

@@ -44,7 +44,6 @@ async function init() {
 }
 
 function startStudy() {
-  // getCurrentStudyWord()
   // return store.sdict.lastLearnIndex = store.sdict.length - 1
   // store.sdict.complete = true
   // store.sdict.lastLearnIndex = 20

src/stores/base.ts

@@ -5,6 +5,7 @@ import * as localforage from "localforage";
 import {nanoid} from "nanoid";
 import {SAVE_DICT_KEY} from "@/utils/const.ts";
 import {_getStudyProgress, checkAndUpgradeSaveDict, getDictFile} from "@/utils";
+import {markRaw} from "vue";
 
 export interface BaseState {
   simpleWords: string[],
@@ -31,7 +32,7 @@ export const DefaultBaseState = (): BaseState => ({
   load: false,
   word: {
     bookList: [
-      getDefaultDict({id: DictId.wordCollect, name: '收藏', words: []}),
+      getDefaultDict({id: DictId.wordCollect, name: '收藏'}),
       getDefaultDict({id: DictId.wordWrong, name: '错词'}),
       getDefaultDict({id: DictId.wordKnown, name: '已掌握'}),
       // getDefaultDict({
@@ -103,9 +104,18 @@ export const useBaseStore = defineStore('base', {
     },
   },
   actions: {
-    setState(obj: any) {
-      //这样不会丢失watch的值的引用
-      merge(this, obj)
+    setState(obj: BaseState) {
+      obj.word.bookList.map(book => {
+        book.words = markRaw(book.words)
+        book.articles = markRaw(book.articles)
+        book.statistics = markRaw(book.statistics)
+      })
+      obj.article.bookList.map(book => {
+        book.words = markRaw(book.words)
+        book.articles = markRaw(book.articles)
+        book.statistics = markRaw(book.statistics)
+      })
+      this.$patch(obj)
     },
     async init(outData?: any) {
       return new Promise(async resolve => {
@@ -142,7 +152,7 @@ export const useBaseStore = defineStore('base', {
       //把其他的词典的单词数据都删掉，全保存在内存里太卡了
       this.word.bookList.slice(3).map(v => {
         if (!v.custom) {
-          v.words = []
+          v.words = markRaw([])
         }
       })
       let rIndex = this.word.bookList.findIndex((v: Dict) => v.id === val.id)
@@ -151,10 +161,11 @@ export const useBaseStore = defineStore('base', {
       }
       if (rIndex > -1) {
         this.word.studyIndex = rIndex
-        this.word.bookList[this.word.studyIndex].words = val.words
+        this.word.bookList[this.word.studyIndex].words = markRaw(val.words)
         this.word.bookList[this.word.studyIndex].perDayStudyNumber = val.perDayStudyNumber
       } else {
-        this.word.bookList.push(cloneDeep(val))
+        console.log(1)
+        this.word.bookList.push(getDefaultDict(val))
         this.word.studyIndex = this.word.bookList.length - 1
       }
     },

src/types.ts

@@ -4,6 +4,7 @@ import jaFlag from "@/assets/img/flags/ja.png";
 import deFlag from "@/assets/img/flags/de.png";
 import codeFlag from "@/assets/img/flags/code.png";
 import myFlag from "@/assets/img/flags/my.png";
+import {markRaw} from "vue";
 
 export type Word = {
   id?: string,
@@ -262,12 +263,12 @@ export function getDefaultDict(val: Partial<Dict> = {}): Dict {
     language: 'en',
     lastLearnIndex: 0,
     perDayStudyNumber: 20,
-    words: [],
-    articles: [],
-    statistics: [],
     custom: false,
     complete: false,
-    ...val
+    ...val,
+    words: markRaw(val.words ?? []),
+    articles: markRaw(val.articles ?? []),
+    statistics: markRaw(val.statistics ?? [])
   }
 }
 

src/utils/index.ts

@@ -369,6 +369,7 @@ export function _getAccomplishDays(total: number, dayNumber: number) {
 
 //获取完成日期
 export function _getAccomplishDate(total: number, dayNumber: number) {
+  if (dayNumber <= 0) return '-'
   let d = _getAccomplishDays(total, dayNumber)
   return dayjs().add(d, 'day').format('YYYY-MM-DD')
 }