添加统计

2023-08-30 01:08:53 +08:00
parent 0bf3b90b31
commit 0f8b867f01
5 changed files with 104 additions and 45 deletions
--- a/src/components/Modal/Statistics.vue
+++ b/src/components/Modal/Statistics.vue
@@ -18,13 +18,7 @@ let currentStat = reactive<Statistics>(cloneDeep(DefaultStatistics))
 onMounted(() => {
  emitter.on(EventKey.openStatModal, () => {
    statModalIsOpen = true
-    currentStat = cloneDeep(store.current.statistics)
-    currentStat.endDate = Date.now()
-    currentStat.spend = Date.now() - currentStat.startDate
-    currentStat.wrongWordNumber = store.current.originWrongWords.length
-    currentStat.correctRate = 100 - Math.trunc((currentStat.wrongWordNumber / currentStat.wordNumber) * 100)
-    console.log(cloneDeep(currentStat))
-    store.currentDict.statistics.push(currentStat)
+    currentStat = store.saveStatistics()
  })
 })

@@ -35,11 +29,13 @@ function write() {

 //TODO 需要判断是否已忽略
 function repeat() {
+  console.log(store.chapter)
  store.setCurrentWord(store.chapter, true)
  statModalIsOpen = false
  emitter.emit(EventKey.resetWord)
 }

+//TODO 能否下一章
 function next() {
  store.currentDict.chapterIndex++
  repeat()
@@ -111,7 +107,7 @@ function next() {
  <Fireworks v-if="statModalIsOpen"/>
 </template>
 <style scoped lang="scss">
-@import "@/assets/css/style";
+@import "@/assets/css/style.scss";

 .statistics {
  width: 800rem;
@@ -139,7 +135,7 @@ function next() {
    .result {
      box-sizing: border-box;
      overflow: hidden;
-      height: 310rem;
+      height: 320rem;
      display: flex;
      flex-direction: column;
      border-radius: $card-radius;
--- a/src/components/Ring.vue
+++ b/src/components/Ring.vue
@@ -1,9 +1,19 @@
 <template>
  <div class="ring">
    <svg height="100%" width="100%">
-      <circle class="circle-full" cx="45rem" cy="45rem" r="40rem" fill="none" stroke-width="8rem"
+      <circle class="circle-full"
+              cx="50rem"
+              cy="50rem"
+              r="45rem"
+              fill="none"
+              stroke-width="8rem"
              stroke-linecap="round"></circle>
-      <circle v-if="props.percentage" ref="circleEl" class="circle-detail" cx="45rem" cy="45rem" r="40rem" fill="none"
+      <circle v-if="props.percentage" ref="circleEl"
+              class="circle-detail"
+              cx="50rem"
+              cy="50rem"
+              r="45rem"
+              fill="none"
              stroke-width="8rem"
              stroke-linecap="round"
              stroke-dasharray="0,10000"></circle>
@@ -36,7 +46,7 @@ onMounted(() => {
 <style scoped lang="scss">
@import "@/assets/css/colors";

-$w: 90rem;
+$w: 100rem;
 $w2: calc($w / 2);

 .ring {
@@ -48,7 +58,7 @@ $w2: calc($w / 2);
  justify-content: center;
  flex-direction: column;
  position: relative;
-  margin-bottom: 20rem;
+  margin-bottom: 10rem;

  svg {
    position: absolute;
--- a/src/components/Side.vue
+++ b/src/components/Side.vue
@@ -1,14 +1,13 @@
 <script setup lang="ts">
 import {useBaseStore} from "@/stores/base.ts"
 import WordList from "@/components/WordList.vue"
-import {ArrowLeft, ArrowRight, MenuFold} from '@icon-park/vue-next'

 import {$ref} from "vue/macros"
-import {computed, nextTick, onMounted, provide} from "vue"
+import {computed, onMounted, provide} from "vue"
 import {Swiper, SwiperSlide} from 'swiper/vue';
 import 'swiper/css';
 import {Swiper as SwiperClass} from "swiper/types"
-import {Dict, DictType} from "@/types.ts"
+import {DictType} from "@/types.ts"
 import PopConfirm from "@/components/PopConfirm.vue"
 import BaseButton from "@/components/BaseButton.vue";
 import {emitter, EventKey} from "@/utils/eventBus.ts"
@@ -41,6 +40,35 @@ onMounted(() => {
  })
 })

+function getActiveIndex(type: DictType) {
+  if (store.current.dictType !== type) return -1
+  else {
+    return store[type].chapterWordIndex
+  }
+}
+
+const newWordDictActiveIndex = computed(() => {
+  if (store.current.dictType !== DictType.newWordDict) return -1
+  else return store.current.index
+})
+
+const dictActiveIndex = computed(() => {
+  if (store.current.dictType !== DictType.inner) return -1
+  else return store.current.index
+})
+
+
+const wrongWordDictActiveIndex = computed(() => {
+  if (store.current.dictType !== DictType.wrongWordDict) return -1
+  else return store.current.index
+})
+
+
+const skipWordDictActiveIndex = computed(() => {
+  if (store.current.dictType !== DictType.skipWordDict) return -1
+  else return store.current.index
+})
+
 </script>
 <template>
  <Transition name="fade">
@@ -62,10 +90,10 @@ onMounted(() => {
              </header>
              <WordList
                  class="word-list"
-                  @change="(e:number) => store.changeDict(store.dict,-1,e)"
+                  @change="(e:number) => store.changeDict(store.dict,store.dict.chapterIndex,e)"
                  :isActive="store.sideIsOpen && tabIndex === 0"
                  :list="store.dict.chapters[store.dict.chapterIndex]??[]"
-                  :activeIndex="store.dict.chapterWordIndex"/>
+                  :activeIndex="dictActiveIndex"/>
              <footer v-if="![DictType.custom,DictType.inner].includes(store.current.dictType)">
                <PopConfirm
                    :title="`确认切换？`"
@@ -85,11 +113,11 @@ onMounted(() => {
              </header>
              <WordList
                  class="word-list"
-                  @change="(e:number) => store.changeDict(store.newWordDict,-1,e)"
+                  @change="(e:number) => store.changeDict(store.newWordDict,store.newWordDict.chapterIndex,e)"
                  :isActive="store.sideIsOpen && tabIndex === 1"
-                  :list="store.newWordDict.originWords"
-                  :activeIndex="store.newWordDict.chapterWordIndex"/>
-              <footer v-if="store.current.dictType !== DictType.newWordDict && store.newWordDict.originWords.length">
+                  :list="store.newWordDict.words"
+                  :activeIndex="newWordDictActiveIndex"/>
+              <footer v-if="store.current.dictType !== DictType.newWordDict && store.newWordDict.words.length">
                <PopConfirm
                    :title="`确认切换？`"
                    @confirm="store.changeDict(store.newWordDict)"
@@ -109,11 +137,12 @@ onMounted(() => {
              </header>
              <WordList
                  class="word-list"
-                  @change="(e:number) => store.changeDict(store.wrongWordDict,-1,e)"
+                  @change="(e:number) => store.changeDict(store.wrongWordDict,store.wrongWordDict.chapterIndex,e)"
                  :isActive="store.sideIsOpen && tabIndex === 2"
-                  :list="store.wrongWordDict.originWords"
-                  :activeIndex="store.wrongWordDict.chapterWordIndex"/>
-              <footer v-if="store.current.dictType !== DictType.wrongWordDict && store.wrongWordDict.originWords.length">
+                  :list="store.wrongWordDict.words"
+                  :activeIndex="wrongWordDictActiveIndex"/>
+              <footer
+                  v-if="store.current.dictType !== DictType.wrongWordDict && store.wrongWordDict.words.length">
                <PopConfirm
                    :title="`确认切换？`"
                    @confirm="store.changeDict(store.wrongWordDict)"
@@ -132,11 +161,11 @@ onMounted(() => {
              </header>
              <WordList
                  class="word-list"
-                  @change="(e:number) => store.changeDict(store.skipWordDict,-1,e)"
+                  @change="(e:number) => store.changeDict(store.skipWordDict,store.skipWordDict.chapterIndex,e)"
                  :isActive="store.sideIsOpen && tabIndex === 3"
-                  :list="store.skipWordDict.originWords"
-                  :activeIndex="store.skipWordDict.chapterWordIndex"/>
-              <footer v-if="store.current.dictType !== DictType.skipWordDict && store.skipWordDict.originWords.length">
+                  :list="store.skipWordDict.words"
+                  :activeIndex="skipWordDictActiveIndex"/>
+              <footer v-if="store.current.dictType !== DictType.skipWordDict && store.skipWordDict.words.length">
                <PopConfirm
                    :title="`确认切换？`"
                    @confirm="store.changeDict(store.skipWordDict)"
--- a/src/components/Type.vue
+++ b/src/components/Type.vue
@@ -118,6 +118,8 @@ async function onKeyDown(e: KeyboardEvent) {
    } else {
      if (!store.wrongWordDict.originWords.find((v: Word) => v.name === store.word.name)) {
        store.wrongWordDict.originWords.push(store.word)
+        store.wrongWordDict.words.push(store.word)
+        store.wrongWordDict.chapters = [store.wrongWordDict.words]
      }
      if (!store.current.wrongWords.find((v: Word) => v.name === store.word.name)) {
        store.current.wrongWords.push(store.word)
@@ -148,12 +150,16 @@ async function onKeyDown(e: KeyboardEvent) {
      case keyMap.Collect:
        if (!store.newWordDict.originWords.find((v: Word) => v.name === store.word.name)) {
          store.newWordDict.originWords.push(store.word)
+          store.newWordDict.words.push(store.word)
+          store.newWordDict.chapters = [store.newWordDict.words]
        }
        activeIndex = 1
        break
      case keyMap.Remove:
        if (!store.skipWordNames.includes(store.word.name)) {
          store.skipWordDict.originWords.push(store.word)
+          store.skipWordDict.words.push(store.word)
+          store.skipWordDict.chapters = [store.skipWordDict.words]
        }
        activeIndex = 0
        next()
@@ -243,7 +249,7 @@ onUnmounted(() => {
          <div class="name">时间</div>
        </div>
        <div class="row">
-          <div class="num">{{ store.current.statistics.wordNumber }}</div>
+          <div class="num">{{ store.current.words.length }}</div>
          <div class="line"></div>
          <div class="name">单词总数</div>
        </div>
--- a/src/stores/base.ts
+++ b/src/stores/base.ts
@@ -138,7 +138,7 @@ export const useBaseStore = defineStore('base', {
      }
      // console.log('this/', this)
    },
-    setCurrentWord(words: Word[], restart: boolean = false) {
+    setCurrentWord(words: Word[], restart: boolean = false, index: number = 0) {
      this.current.words = cloneDeep(words)
      if (restart) {
        this.current.repeatNumber = 0
@@ -159,7 +159,7 @@ export const useBaseStore = defineStore('base', {
        this.current.statistics.correctRate = -1
        this.current.statistics.wrongWordNumber = -1
      }
-      this.current.index = 0
+      this.current.index = index
      this.current.wrongWords = []
    },
    async init() {
@@ -173,28 +173,46 @@ export const useBaseStore = defineStore('base', {
        r.json().then(v => {
          this.dict.originWords = cloneDeep(v)
          this.dict.words = cloneDeep(v)
-          this.dict.chapters = chunk(this.dict.originWords, this.dict.chapterWordNumber)
+          this.dict.chapters = chunk(this.dict.words, this.dict.chapterWordNumber)
          this.setCurrentWord(this.chapter, true)
        })
      }
    },
-    async changeDict(dict: Dict, chapterIndex: number = -1, chapterWordIndex: number = -1) {
-      console.log('changeDict', dict)
-      emitter.emit(EventKey.resetWord)
+    saveStatistics() {
+      let currentStat = cloneDeep(this.current.statistics)
+      currentStat.endDate = Date.now()
+      currentStat.spend = Date.now() - currentStat.startDate
+      currentStat.wrongWordNumber = this.current.originWrongWords.length
+      currentStat.correctRate = 100 - Math.trunc((currentStat.wrongWordNumber / currentStat.wordNumber) * 100)
+      // console.log(cloneDeep(currentStat))
+      if (currentStat.spend > 1000 * 10) {
+        this.currentDict.statistics.push(currentStat)
+      }
+      return currentStat
+    },
+    async changeDict(dict: Dict, chapterIndex: number = dict.chapterIndex, chapterWordIndex: number = dict.chapterWordNumber) {
+      this.saveStatistics()
+      console.log('changeDict', cloneDeep(dict), chapterIndex, chapterWordIndex)
+      this.current.dictType = dict.type
      if ([DictType.newWordDict,
        DictType.skipWordDict,
        DictType.wrongWordDict].includes(dict.type)) {
-        this.current.dictType = dict.type
-        this[dict.type].chapters = [this[dict.type].wordList]
-        this[dict.type].chapterIndex = 0
-        this[dict.type].chapterWordIndex = chapterWordIndex === -1 ? 0 : chapterWordIndex
+        this[dict.type].chapterIndex = chapterIndex
+        this[dict.type].chapterWordIndex = chapterWordIndex
      } else {
        this.dict = cloneDeep(dict)
-        this.current.dictType = dict.type
-        if (chapterWordIndex !== -1) this.dict.chapterWordIndex = chapterWordIndex
-        if (chapterIndex !== -1) this.dict.chapterIndex = chapterIndex
+        if (dict.originWords.length) {
+          let r = await fetch(`/public/${this.dict.url}`)
+          let v = await r.json()
+          this.dict.originWords = cloneDeep(v)
+          this.dict.words = cloneDeep(v)
+          this.dict.chapters = chunk(this.dict.words, this.dict.chapterWordNumber)
+        }
+        this.dict.chapterIndex = chapterIndex
+        this.dict.chapterWordIndex = chapterWordIndex
      }
-      console.log('this.dict', this.dict)
+      this.setCurrentWord(this.chapter, true, chapterWordIndex)
+      emitter.emit(EventKey.resetWord)
    }
  },
 })