save

package.json

@@ -71,5 +71,6 @@
     "commitizen": {
       "path": "./node_modules/cz-conventional-changelog"
     }
-  }
+  },
+  "packageManager": "pnpm@9.1.4+sha512.9df9cf27c91715646c7d675d1c9c8e41f6fce88246f1318c1aa6a1ed1aeb3c4f032fcdf4ba63cc69c4fe6d634279176b5358727d8f2cc1e65b65f43ce2f8bfb0"
 }

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

@@ -1,61 +1,43 @@
 <script setup lang="ts">
 import {useBaseStore} from "@/stores/base.ts"
-import {onMounted} from "vue"
-import BaseButton from "@/components/BaseButton.vue";
-import {Icon} from '@iconify/vue';
 import "vue-activity-calendar/style.css";
 import WordListDialog from "@/pages/pc/components/dialog/WordListDialog.vue";
-import {useRuntimeStore} from "@/stores/runtime.ts";
-import {emitter, EventKey} from "@/utils/eventBus.ts";
+import {emitter, EventKey, useEvent} from "@/utils/eventBus.ts";
 import BaseIcon from "@/components/BaseIcon.vue";
 import Dialog from "@/pages/pc/components/dialog/Dialog.vue";
 
 const store = useBaseStore()
-const runtimeStore = useRuntimeStore()
 
 let show = $ref(false)
-let chapterWordNumber = $ref(0)
-
-function close() {
-  show = false
-}
 
 function showAllWordModal() {
   emitter.emit(EventKey.openWordListModal, {
-    title: store.currentStudyWordDict.name,
-    translateLanguage: store.currentStudyWordDict.translateLanguage,
-    list: store.currentStudyWordDict.words
+    title: store.sdict.name,
+    translateLanguage: store.sdict.translateLanguage,
+    list: store.sdict.words
   })
 }
 
-onMounted(() => {
-  emitter.on(EventKey.openDictModal, (typ) => {
-    show = true
-  })
+useEvent(EventKey.openDictModal, () => {
+  show = true
 })
 
+const startDate = $computed(() => {
+
+})
 
 </script>
 
 <template>
   <Dialog
-      :header="false"
       v-model="show"
-      :show-close="false">
+      :title="store.sdict.name "
+  >
     <div id="DictDialog">
-      <header>
-        <div class="text-2xl">
-          {{ store.currentStudyWordDict.name }}
-        </div>
-        <Icon @click="close"
-              class="hvr-grow pointer"
-              width="20" color="#929596"
-              icon="ion:close-outline"/>
-      </header>
       <div class="detail">
-        <div class="desc">{{ store.currentStudyWordDict.description }}</div>
+        <div class="desc">{{ store.sdict.description }}</div>
         <div class="text flex align-center gap-2">
-          <div>总词汇： {{ store.currentStudyWordDict.originWords.length }}词</div>
+          <div>总词汇： {{ store.sdict.words.length }}词</div>
           <BaseIcon icon="circum:view-list"
                     @click='showAllWordModal'
                     title="单词列表"
@@ -64,29 +46,15 @@ onMounted(() => {
         <div class="text">开始日期：-</div>
         <div class="text">花费时间：-</div>
         <div class="text">累积错误：-</div>
-        <div class="text">进度：
-          <el-progress :percentage="0"
-                       :stroke-width="8"
-                       :show-text="false"/>
+        <div class="mt-2">
+          <div class="text-sm flex justify-between">
+            已学习{{ store.currentStudyProgress }}%
+            <span>{{ store.sdict.lastLearnIndex }} / {{
+                store.sdict.words.length
+              }}</span>
+          </div>
+          <el-progress class="mt-1" :percentage="store.currentStudyProgress" :show-text="false"></el-progress>
         </div>
-        <div class="row">
-          <div class="label">每日目标</div>
-          <el-slider
-              class="my-slider"
-              :min="10"
-              :step="10"
-              :max="store.currentStudyWordDict.words.length < 10 ? 10 : 500"
-              size="small"
-              v-model="chapterWordNumber"
-          />
-        </div>
-        <div class="notice">
-          <span class="text">最小:10</span>
-          <span class="text">最大:{{ store.currentStudyWordDict.words.length < 10 ? 10 : 500 }}</span>
-        </div>
-      </div>
-      <div class="footer">
-        <BaseButton @click="close">关闭</BaseButton>
       </div>
     </div>
   </Dialog>
@@ -94,82 +62,18 @@ onMounted(() => {
 </template>
 
 <style scoped lang="scss">
-@import "@/assets/css/style";
-
-$header-height: 4rem;
 
 #DictDialog {
-  //position: fixed;
-  //left: 50%;
-  //top: 50%;
-  //transform: translate(-50%, -50%);
-  background: var(--color-second-bg);
-  z-index: 99999;
-  width: 30rem;
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: column;
-
-  header {
-    cursor: pointer;
-    width: 100%;
-    display: flex;
-    box-sizing: border-box;
-    height: $header-height;
-    align-items: center;
-    justify-content: space-between;
-    color: var(--color-font-3);
-    padding: 0 var(--space);
-
-    .left {
-      display: flex;
-      gap: .6rem;
-      align-items: center;
-    }
-  }
+  width: 26rem;
 
   .detail {
-    padding-left: var(--space);
-    flex: 1;
-    display: flex;
-    overflow: hidden;
-    flex-direction: column;
-    background: var(--color-second-bg);
     color: var(--color-font-1);
     gap: .2rem;
     position: relative;
     font-size: .9rem;
-    padding-right: var(--space);
-
-    .name {
-      font-size: 1.6rem;
-      width: 95%;
-    }
-
-    .desc {
-      font-size: 1rem;
-      margin-bottom: 1.2rem;
-    }
-
-
-    :deep(.edit-icon) {
-      position: absolute;
-      top: 0;
-      right: 0;
-    }
-  }
-
-  .footer {
-    box-sizing: content-box;
-    display: flex;
-    align-items: flex-end;
-    justify-content: flex-end;
-    gap: var(--space);
-    padding-right: var(--space);
-    margin: var(--space) 0;
+    padding: var(--space);
+    padding-top: 0;
   }
 }
-
-
 </style>
 

src/pages/pc/word/StudyWord.vue

@@ -96,7 +96,8 @@ useEvent(ShortcutKey.TogglePanel, togglePanel)
 
 let data = $ref({
   new: [],
-  review: []
+  review: [],
+  write: []
 })
 
 function getCurrentPractice() {

src/pages/pc/word/WordHome.vue

@@ -6,7 +6,7 @@ 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 {_getAccomplishDate, _getAccomplishDays, useNav} from "@/utils";
+import {_getAccomplishDate, _getAccomplishDays, _getStudyProgress, useNav} from "@/utils";
 import BasePage from "@/pages/pc/components/BasePage.vue";
 import {getDefaultDict} from "@/types.ts";
 import {onMounted, watch} from "vue";
@@ -90,12 +90,12 @@ function changePerDayStudyNumber() {
         </div>
         <div class="mt-2">
           <div class="text-sm flex justify-between">
-            已学习{{ store.currentStudyWordProgress }}%
-            <span>{{ store.currentStudyWordDict.lastLearnIndex }} / {{
-                store.currentStudyWordDict.words.length
+            已学习{{ store.currentStudyProgress }}%
+            <span>{{ store.sdict.lastLearnIndex }} / {{
+                store.sdict.words.length
               }}</span>
           </div>
-          <el-progress class="mt-1" :percentage="store.currentStudyWordProgress" :show-text="false"></el-progress>
+          <el-progress class="mt-1" :percentage="store.currentStudyProgress" :show-text="false"></el-progress>
         </div>
       </div>
 

src/stores/base.ts

@@ -5,7 +5,7 @@ import {emitter, EventKey} from "@/utils/eventBus.ts"
 import * as localforage from "localforage";
 import {nanoid} from "nanoid";
 import {SAVE_DICT_KEY} from "@/utils/const.ts";
-import {_checkDictWords, checkAndUpgradeSaveDict, getDictFile} from "@/utils";
+import {_checkDictWords, _getStudyProgress, checkAndUpgradeSaveDict, getDictFile} from "@/utils";
 
 export interface BaseState {
   myDictList: Dict[],
@@ -291,12 +291,12 @@ export const useBaseStore = defineStore('base', {
     sword() {
       return this.currentStudy.word
     },
-    currentStudyWordProgress(): number {
-      if (!this.currentStudyWordDict.words?.length) return 0
-      return Number(((this.currentStudyWordDict.lastLearnIndex / this.currentStudyWordDict.words?.length) * 100).toFixed())
+    currentStudyProgress(): number {
+      if (!this.sdict.words?.length) return 0
+      return _getStudyProgress(this.sdict.lastLearnIndex, this.sdict.words?.length)
     },
     otherWordDictList(): Dict[] {
-      return this.wordDictList.filter(v => this.currentStudyWordDict.id !== v.id)
+      return this.wordDictList.filter(v => this.sdict.id !== v.id)
     },
     currentArticleDict(): Dict {
       return this.articleDictList[this.currentStudy.article.dictIndex] ?? {}

src/utils/eventBus.ts

@@ -22,7 +22,7 @@ export const EventKey = {
   jumpSpecifiedChapter: 'jumpSpecifiedChapter',
 }
 
-export function useEvent(key: string, func: () => void) {
+export function useEvent(key: string, func: any) {
   onMounted(() => {
     emitter.on(key, func)
   })

src/utils/index.ts

@@ -227,11 +227,18 @@ export async function _checkDictWords(dict: Dict) {
   }
 }
 
+//获取完成天数
 export function _getAccomplishDays(total: number, dayNumber: number) {
   return Math.ceil(total / dayNumber)
 }
 
+//获取完成日期
 export function _getAccomplishDate(total: number, dayNumber: number) {
   let d = _getAccomplishDays(total, dayNumber)
   return dayjs().add(d, 'day').format('YYYY-MM-DD')
+}
+
+//获取学习进度
+export function _getStudyProgress(index: number, total: number) {
+  return Number(((index / total) * 100).toFixed())
 }