From c7525a8fd2778769f50a285096d481b88179c63e Mon Sep 17 00:00:00 2001 From: zyronon Date: Sun, 15 Oct 2023 00:11:36 +0800 Subject: [PATCH] save --- Note.md | 4 +- components.d.ts | 12 +- src/components/Add/AddDict.vue | 345 +++++++++++++++--- src/components/ChapterList.vue | 1 - src/components/Close.vue | 4 +- src/components/{DictItem.vue => DictList.vue} | 38 +- src/components/Input.vue | 3 +- src/components/Modal/Modal.vue | 2 +- src/components/Practice/Panel.vue | 2 +- src/components/Practice/TypeArticle.vue | 2 +- src/components/Toolbar/Add.vue | 4 +- src/components/Toolbar/DictModal.vue | 21 +- src/stores/base.ts | 34 +- src/types.ts | 17 +- 14 files changed, 364 insertions(+), 125 deletions(-) rename src/components/{DictItem.vue => DictList.vue} (56%) diff --git a/Note.md b/Note.md index 855e33cb..bd132e4b 100644 --- a/Note.md +++ b/Note.md @@ -39,4 +39,6 @@ BaseIcon 在选中模式下，应该显示白色 A cold welcome 有bug -[EditAbleText.vue](src%2Fcomponents%2FEditAbleText.vue) 不能自动聚焦 \ No newline at end of file +[EditAbleText.vue](src%2Fcomponents%2FEditAbleText.vue) 不能自动聚焦 + +在文章模式下，背单词时不能调出面板 \ No newline at end of file diff --git a/components.d.ts b/components.d.ts index 14263077..cd70f40c 100644 --- a/components.d.ts +++ b/components.d.ts @@ -8,12 +8,10 @@ export {} declare module 'vue' { export interface GlobalComponents { Add: typeof import('./src/components/Toolbar/Add.vue')['default'] - AddArticle2: typeof import('./src/components/Add/AddArticle2.vue')['default'] AddDict: typeof import('./src/components/Add/AddDict.vue')['default'] Backgorund: typeof import('./src/components/Backgorund.vue')['default'] BaseButton: typeof import('./src/components/BaseButton.vue')['default'] BaseIcon: typeof import('./src/components/BaseIcon.vue')['default'] - BatchAddArticle: typeof import('./src/components/Add/BatchAddArticle.vue')['default'] ChapterDetail: typeof import('./src/components/ChapterDetail.vue')['default'] ChapterList: typeof import('./src/components/ChapterList.vue')['default'] Close: typeof import('./src/components/Close.vue')['default'] @@ -21,12 +19,17 @@ declare module 'vue' { DictItem: typeof import('./src/components/DictItem.vue')['default'] DictList: typeof import('./src/components/DictList.vue')['default'] DictModal: typeof import('./src/components/Toolbar/DictModal.vue')['default'] - Edit: typeof import('./src/components/Article/Edit.vue')['default'] EditAbleText: typeof import('./src/components/EditAbleText.vue')['default'] EditArticle: typeof import('./src/components/Article/EditArticle.vue')['default'] - EditArticleModal: typeof import('./src/components/Article/EditArticleModal.vue')['default'] EditBatchArticleModal: typeof import('./src/components/Article/EditBatchArticleModal.vue')['default'] EditSingleArticleModal: typeof import('./src/components/Article/EditSingleArticleModal.vue')['default'] + ElButton: typeof import('element-plus/es')['ElButton'] + ElCheckbox: typeof import('element-plus/es')['ElCheckbox'] + ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup'] + ElCol: typeof import('element-plus/es')['ElCol'] + ElDatePicker: typeof import('element-plus/es')['ElDatePicker'] + ElForm: typeof import('element-plus/es')['ElForm'] + ElFormItem: typeof import('element-plus/es')['ElFormItem'] ElInput: typeof import('element-plus/es')['ElInput'] ElInputNumber: typeof import('element-plus/es')['ElInputNumber'] ElOption: typeof import('element-plus/es')['ElOption'] @@ -37,6 +40,7 @@ declare module 'vue' { ElSelect: typeof import('element-plus/es')['ElSelect'] ElSlider: typeof import('element-plus/es')['ElSlider'] ElSwitch: typeof import('element-plus/es')['ElSwitch'] + ElTimePicker: typeof import('element-plus/es')['ElTimePicker'] FeedbackModal: typeof import('./src/components/Toolbar/FeedbackModal.vue')['default'] Fireworks: typeof import('./src/components/Fireworks.vue')['default'] Footer: typeof import('./src/components/Practice/Footer.vue')['default'] diff --git a/src/components/Add/AddDict.vue b/src/components/Add/AddDict.vue index 094f472e..0df711df 100644 --- a/src/components/Add/AddDict.vue +++ b/src/components/Add/AddDict.vue @@ -2,76 +2,239 @@ import Modal from "@/components/Modal/Modal.vue" import {Icon} from '@iconify/vue'; import {useSettingStore} from "@/stores/setting.ts"; -import DictItem from "@/components/DictItem.vue"; -import {DictType, Sort} from "@/types.ts"; -import {$ref} from "vue/macros"; +import DictList from "@/components/DictList.vue"; +import {Dict, DictType, languageCategoryOptions, Sort} from "@/types.ts"; +import {$computed, $ref} from "vue/macros"; import {useDisableEventListener} from "@/hooks/event.ts"; +import {onMounted, reactive, watch} from "vue"; +import {dictionaryResources} from "@/assets/dictionary.ts"; +import {cloneDeep} from "lodash-es"; +import {useRuntimeStore} from "@/stores/runtime.ts"; +import {FormInstance, FormRules} from "element-plus"; +import {emitter, EventKey} from "@/utils/eventBus.ts"; +import ChapterList from "@/components/ChapterList.vue"; +import {useBaseStore} from "@/stores/base.ts"; +const baseStore = useBaseStore() const settingStore = useSettingStore() +const runtimeStore = useRuntimeStore() const emit = defineEmits([ 'close', ]) -let step = $ref(0) +let step = $ref(1) +let isEdit = $ref(true) useDisableEventListener() -let list = $ref([ - { - name: '新概念英语2', - sort: Sort.normal, - type: DictType.publicDict, - originWords: [], - articles: [], - words: [], - chapterWordNumber: 15, - chapterWords: [], - chapterIndex: 0, - chapterWordIndex: 0, - statistics: [], - url: '/dicts/NCE_2.json', - }, - { - name: '新概念英语2', - sort: Sort.normal, - type: DictType.publicDict, - originWords: [], - articles: [], - words: [], - chapterWordNumber: 15, - chapterWords: [], - chapterIndex: 0, - chapterWordIndex: 0, - statistics: [], - url: '/dicts/NCE_2.json', - }, - { - name: '新概念英语2', - sort: Sort.normal, - type: DictType.publicDict, - originWords: [], - articles: [], - words: [], - chapterWordNumber: 15, - chapterWords: [], - chapterIndex: 0, - chapterWordIndex: 0, - statistics: [], - url: '/dicts/NCE_2.json', - } -]) + +let list = $computed(() => { + return baseStore.myDicts.filter(v => v.type === DictType.customArticle).concat([{name: '',} as any]) +}) +let form = reactive({ + id: '', + name: '123', + description: '', + category: '', + tags: [], + languageCategory: '', + language: '', +}) + +let languageCategoryList = [] +let categoryList = {} +let tagList = {} +const ruleFormRef = $ref() +const rules = reactive({ + name: [ + {required: true, message: '请输入名称', trigger: 'blur'}, + {max: 20, message: '名称不能超过20个字符', trigger: 'blur'}, + ], + category: [{required: true, message: '请选择', trigger: 'change'}], + tags: [{required: true, message: '请选择', trigger: 'change'}], + languageCategory: [{required: true, message: '请选择', trigger: 'change'}], +}) + +watch(() => form.languageCategory, () => form.category = '') +watch(() => form.category, () => form.tags = []) + +onMounted(() => { + dictionaryResources.map(v => { + // if (!languageCategoryList.find(w => w === v.languageCategory)) { + // languageCategoryList.push(v.languageCategory) + // } + if (categoryList[v.languageCategory]) { + if (!categoryList[v.languageCategory].find(w => w === v.category)) { + categoryList[v.languageCategory].push(v.category) + } + } else { + categoryList[v.languageCategory] = [v.category] + } + if (tagList[v.category]) { + tagList[v.category] = Array.from(new Set(tagList[v.category].concat(v.tags))) + } else { + tagList[v.category] = v.tags + } + }) + + console.log('languageCategoryList', languageCategoryList) + console.log('categoryList', categoryList) + console.log('tagList', tagList) +}) + +function selectDict(dict: Dict) { + runtimeStore.editDict = cloneDeep(dict) + isEdit = false + step = 1 +} + +async function onSubmit() { + await ruleFormRef.validate((valid, fields) => { + if (valid) { + let data = { + sort: Sort.normal, + type: DictType.customArticle, + originWords: [], + words: [], + chapterWordNumber: 30, + chapterWords: [], + chapterIndex: 0, + chapterWordIndex: 0, + statistics: [], + articles: [], + url: '', + ...form, + } + if (form.id) { + let rIndex = baseStore.myDicts.findIndex(v => v.id === form.id) + runtimeStore.editDict = data + baseStore.myDicts[rIndex] = cloneDeep(data) + isEdit = false + } else { + if (baseStore.myDicts.find(v => v.name === form.name)) { + return ElMessage.warning('已有相同名称词典！') + } else { + runtimeStore.editDict = data + baseStore.myDicts.push(cloneDeep(data)) + isEdit = false + console.log('submit!', data) + } + } + } else { + ElMessage.warning('请填写完整') + } + }) +} + +function close() { + emit('close') +} + diff --git a/src/components/Toolbar/DictModal.vue b/src/components/Toolbar/DictModal.vue index 250dcea7..7371a1f2 100644 --- a/src/components/Toolbar/DictModal.vue +++ b/src/components/Toolbar/DictModal.vue @@ -2,7 +2,7 @@ import {dictionaryResources} from '@/assets/dictionary.ts' import {useBaseStore} from "@/stores/base.ts" import {watch} from "vue" -import {Dict, DictionaryResource, DictType, Sort, Word} from "@/types.ts" +import {Dict, DictionaryResource, DictType, languageCategoryOptions, Sort, Word} from "@/types.ts" import {chunk, cloneDeep} from "lodash-es"; import {$computed, $ref} from "vue/macros"; import Modal from "@/components/Modal/Modal.vue"; @@ -38,14 +38,6 @@ const emit = defineEmits<{ close: [] }>() -const options = [ - {id: 'article', name: '文章', flag: bookFlag}, - {id: 'en', name: '英语', flag: enFlag}, - {id: 'ja', name: '日语', flag: jpFlag}, - {id: 'de', name: '德语', flag: deFlag}, - {id: 'code', name: 'Code', flag: codeFlag}, -] - const base = useBaseStore() let currentLanguage = $ref('en') let step = $ref(1) @@ -155,10 +147,6 @@ function clickEvent(e) { console.log('e', e) } -function showWord(list: Word[]) { - console.log('list', list) -} - const dictIsArticle = $computed(() => { return isArticle(runtimeStore.editDict.type) }) @@ -179,7 +167,7 @@ const dictIsArticle = $computed(() => {
+ v-for="item in languageCategoryOptions"> {{ item.name }}
@@ -320,7 +308,6 @@ const dictIsArticle = $computed(() => { @@ -360,7 +347,7 @@ $time: 0.3s; $header-height: 60rem; .slide { - width: 1100rem; + width: 1000rem; height: 75vh; .slide-list { @@ -500,7 +487,7 @@ $header-height: 60rem; .setting { overflow: auto; - flex: 5; + flex: 4; background: white; border-radius: 10rem; background: var(--color-second-bg); diff --git a/src/stores/base.ts b/src/stores/base.ts index b41f41c1..a73ac14c 100644 --- a/src/stores/base.ts +++ b/src/stores/base.ts @@ -8,7 +8,6 @@ export interface State { newWordDict: Dict, skipWordDict: Dict, wrongWordDict: Dict, - dict: Dict, myDicts: Dict[], current: { dictType: DictType, @@ -24,6 +23,7 @@ export const useBaseStore = defineStore('base', { state: (): State => { return { newWordDict: { + id:'newWordDict', name: '生词本', sort: Sort.normal, type: DictType.newWordDict, @@ -38,6 +38,7 @@ export const useBaseStore = defineStore('base', { url: '', }, skipWordDict: { + id:'skipWordDict', name: '简单词', sort: Sort.normal, type: DictType.skipWordDict, @@ -52,6 +53,7 @@ export const useBaseStore = defineStore('base', { url: '', }, wrongWordDict: { + id:'wrongWordDict', name: '错词本', sort: Sort.normal, type: DictType.wrongWordDict, @@ -65,36 +67,9 @@ export const useBaseStore = defineStore('base', { statistics: [], url: '', }, - // dict: { - // name: '新概念英语-2', - // sort: Sort.normal, - // type: DictType.innerDict, - // originWords: [], - // articles: [], - // words: [], - // chapterWordNumber: 15, - // chapterWords: [], - // chapterIndex: 0, - // chapterWordIndex: 0, - // statistics: [], - // url: '/dicts/NCE_2.json', - // }, - dict: { - name: '新概念英语2-课文', - sort: Sort.normal, - type: DictType.publicArticle, - originWords: [], - articles: [], - words: [], - chapterWordNumber: 15, - chapterWords: [], - chapterIndex: 0, - chapterWordIndex: 0, - statistics: [], - url: '/articles/NCE_2.json', - }, myDicts: [ { + id:'新概念英语2-课文', name: '新概念英语2-课文', sort: Sort.normal, type: DictType.publicArticle, @@ -109,6 +84,7 @@ export const useBaseStore = defineStore('base', { url: '/articles/NCE_2.json', }, { + id:'新概念英语2', name: '新概念英语2', sort: Sort.normal, type: DictType.publicDict, diff --git a/src/types.ts b/src/types.ts index 9b3e3b81..3a055f0c 100644 --- a/src/types.ts +++ b/src/types.ts @@ -1,3 +1,9 @@ +import bookFlag from "@/assets/img/flags/book.png"; +import enFlag from "@/assets/img/flags/en.png"; +import jpFlag from "@/assets/img/flags/ja.png"; +import deFlag from "@/assets/img/flags/de.png"; +import codeFlag from "@/assets/img/flags/code.png"; + export type Word = { "name": string, "usphone": string, @@ -34,6 +40,7 @@ export type DictionaryResource = { } export interface Dict { + id: string, name: string, sort: Sort, type: DictType, @@ -155,4 +162,12 @@ export const ShortKeyMap = { export enum TranslateEngine { Baidu = 0, -} \ No newline at end of file +} + +export const languageCategoryOptions = [ + {id: 'article', name: '文章', flag: bookFlag}, + {id: 'en', name: '英语', flag: enFlag}, + {id: 'ja', name: '日语', flag: jpFlag}, + {id: 'de', name: '德语', flag: deFlag}, + {id: 'code', name: 'Code', flag: codeFlag}, +]