From a4a8f8836240a0dc5187c95ab1a0f9ea6c9c1222 Mon Sep 17 00:00:00 2001 From: Zyronon Date: Tue, 16 Dec 2025 02:07:19 +0800 Subject: [PATCH] wip --- src/assets/css/style.scss | 19 +- src/components/BaseTable.vue | 63 +++-- src/pages/word/DictDetail.vue | 467 ++++++++++++++++++---------------- src/stores/base.ts | 388 ++++++++++++++-------------- src/types/types.ts | 4 +- 5 files changed, 498 insertions(+), 443 deletions(-) diff --git a/src/assets/css/style.scss b/src/assets/css/style.scss index 589d5ebc..67fc02a2 100644 --- a/src/assets/css/style.scss +++ b/src/assets/css/style.scss @@ -199,7 +199,8 @@ html.dark { font-family: var(--font-family); } -html, body { +html, +body { //font-size: 1px; padding: 0; margin: 0; @@ -244,7 +245,7 @@ html, body { display: flex; flex-direction: column; - & > .page-content { + &>.page-content { padding: 10rem; box-sizing: border-box; overflow: auto; @@ -275,10 +276,12 @@ a { width: .5rem; height: .6rem; } + ::-webkit-scrollbar-track { background: transparent; border-radius: .1rem; } + ::-webkit-scrollbar-thumb { background: var(--color-scrollbar); border-radius: .6rem; @@ -439,6 +442,7 @@ a { .center { @apply flex justify-center items-center; } + .center-col { @extend .center; @apply flex-col; @@ -499,9 +503,12 @@ a { } @keyframes underline { - 0%, 100% { + + 0%, + 100% { border-left: .1rem solid var(--color-article); } + 50% { border-left: .1rem solid transparent; } @@ -521,4 +528,10 @@ a { background: transparent; font-size: 16px; // 防止iOS缩放 color: transparent; // 文字透明 +} + +.btn-no-margin { + .base-button + .base-button { + margin-left: 0!important; + } } \ No newline at end of file diff --git a/src/components/BaseTable.vue b/src/components/BaseTable.vue index e62688e7..66fee579 100644 --- a/src/components/BaseTable.vue +++ b/src/components/BaseTable.vue @@ -48,6 +48,7 @@ const emit = defineEmits<{ }], importData: [e: Event] exportData: [] + sort: [type: Sort,pageNo: number,pageSize: number] }>() let listRef: any = $ref() @@ -85,11 +86,6 @@ let selectAll = $computed(() => { return !!selectIds.length }) -let list2 = $ref([]) -onMounted(async () => { - list2 = await props.request({ pageNo, pageSize }) - console.log('list2',list2) -}) function toggleSelect(item) { let rIndex = selectIds.findIndex(v => v === item.id) @@ -117,12 +113,16 @@ const closeImportDialog = () => showImportDialog = false function sort(type: Sort) { if (type === Sort.reverse) { - Toast.success('已翻转排序') - list.value = reverse(cloneDeep(list.value)) + emit('sort', type,pageNo,pageSize) } if (type === Sort.random) { - Toast.success('已随机排序') - list.value = shuffle(cloneDeep(list.value)) + emit('sort', type,pageNo,pageSize) + } + if (type === Sort.reverseAll) { + emit('sort', type,1,total2) + } + if (type === Sort.randomAll) { + emit('sort', type,1,total2) } showSortDialog = false } @@ -134,6 +134,7 @@ function handleBatchDel() { function handlePageNo(e) { pageNo = e + getData() scrollToTop() } @@ -142,9 +143,29 @@ const s = useSlots() defineExpose({ scrollToBottom, scrollToItem, - closeImportDialog + closeImportDialog, + getData }) + +let list2 = $ref([]) +let loading2 = $ref(false) +let total2 = $ref(0) + +async function getData() { + loading2 = true + let {list, total} = await props.request({ pageNo, pageSize }) + console.log('list2',list2) + list2 = list + total2 = total + loading2 = false +} + +onMounted(async () => { + getData() +}) + + defineRender( () => { const d = (item) => 列表顺序设置 -
- sort(Sort.reverse)}>翻转 - - sort(Sort.random)}>随机 +
+ sort(Sort.reverse)}>翻转当前页 + sort(Sort.reverseAll)}>翻转所有 +
+ sort(Sort.reverse)}>随机当前页 + sort(Sort.randomAll)}>随机所有
@@ -247,15 +270,15 @@ defineRender( } { - props.loading ? + loading2 ?
- : currentList.length ? ( + : list2.length ? ( <>
listRef = e}> - {currentList.map((item, index) => { + {list2.map((item, index) => { return (
pageSize = e} pageSizes={[20, 50, 100, 200]} layout="prev, pager, next" - total={props.total}/> + total={total2}/>
} @@ -316,6 +339,4 @@ defineRender( } ) - + diff --git a/src/pages/word/DictDetail.vue b/src/pages/word/DictDetail.vue index a6eca9c9..b17b0df2 100644 --- a/src/pages/word/DictDetail.vue +++ b/src/pages/word/DictDetail.vue @@ -1,10 +1,10 @@ diff --git a/src/stores/base.ts b/src/stores/base.ts index 81eb4e76..0af872d1 100644 --- a/src/stores/base.ts +++ b/src/stores/base.ts @@ -9,210 +9,206 @@ import { add2MyDict, dictListVersion, myDictList } from "@/apis"; import Toast from "@/components/base/toast/Toast.ts"; export interface BaseState { - simpleWords: string[], - load: boolean - word: { - studyIndex: number, - bookList: Dict[], - }, - article: { - bookList: Dict[], - studyIndex: number, - }, - dictListVersion: number + simpleWords: string[], + load: boolean + word: { + studyIndex: number, + bookList: Dict[], + }, + article: { + bookList: Dict[], + studyIndex: number, + }, + dictListVersion: number } export const getDefaultBaseState = (): BaseState => ({ - simpleWords: [ - 'a', 'an', - 'i', 'my', 'me', 'you', 'your', 'he', 'his', 'she', 'her', 'it', - 'what', 'who', 'where', 'how', 'when', 'which', - 'be', 'am', 'is', 'was', 'are', 'were', 'do', 'did', 'can', 'could', 'will', 'would', - 'the', 'that', 'this', 'and', 'not', 'no', 'yes', - 'to', 'of', 'for', 'at', 'in' + simpleWords: [ + 'a', 'an', + 'i', 'my', 'me', 'you', 'your', 'he', 'his', 'she', 'her', 'it', + 'what', 'who', 'where', 'how', 'when', 'which', + 'be', 'am', 'is', 'was', 'are', 'were', 'do', 'did', 'can', 'could', 'will', 'would', + 'the', 'that', 'this', 'and', 'not', 'no', 'yes', + 'to', 'of', 'for', 'at', 'in' + ], + load: false, + word: { + bookList: [ + getDefaultDict({ id: DictId.wordCollect, en_name: DictId.wordCollect, name: '收藏' }), + getDefaultDict({ id: DictId.wordWrong, en_name: DictId.wordCollect, name: '错词' }), + getDefaultDict({ + id: DictId.wordKnown, + en_name: DictId.wordCollect, + name: '已掌握', + description: '已掌握后的单词不会出现在练习中' + }), ], - load: false, - word: { - bookList: [ - getDefaultDict({id: DictId.wordCollect, en_name: DictId.wordCollect, name: '收藏'}), - getDefaultDict({id: DictId.wordWrong, en_name: DictId.wordCollect, name: '错词'}), - getDefaultDict({ - id: DictId.wordKnown, - en_name: DictId.wordCollect, - name: '已掌握', - description: '已掌握后的单词不会出现在练习中' - }), - ], - studyIndex: -1, - }, - article: { - bookList: [ - getDefaultDict({id: DictId.articleCollect, en_name: DictId.articleCollect, name: '收藏'}) - ], - studyIndex: -1, - }, - dictListVersion: 1 + studyIndex: -1, + }, + article: { + bookList: [ + getDefaultDict({ id: DictId.articleCollect, en_name: DictId.articleCollect, name: '收藏' }) + ], + studyIndex: -1, + }, + dictListVersion: 1 }) export const useBaseStore = defineStore('base', { - state: (): BaseState => { - return getDefaultBaseState() + state: (): BaseState => { + return getDefaultBaseState() + }, + getters: { + collectWord(): Dict { + return this.word.bookList[0] }, - getters: { - collectWord(): Dict { - return this.word.bookList[0] - }, - collectArticle(): Dict { - return this.article.bookList[0] - }, - wrong(): Dict { - return this.word.bookList[1] - }, - known(): Dict { - return this.word.bookList[2] - }, - knownWords(): string[] { - return this.known.words.map((v: Word) => v.word.toLowerCase()) - }, - allIgnoreWords() { - return this.known.words.map((v: Word) => v.word.toLowerCase()).concat(this.simpleWords.map((v: string) => v.toLowerCase())) - }, - sdict(): Dict { - if (this.word.studyIndex >= 0) { - return this.word.bookList[this.word.studyIndex] ?? getDefaultDict() - } - return getDefaultDict() - }, - currentStudyProgress(): number { - if (!this.sdict.length) return 0 - return _getStudyProgress(this.sdict.lastLearnIndex, this.sdict.length) - }, - getDictCompleteDate(): number { - if (!this.sdict.length) return 0 - if (!this.sdict.perDayStudyNumber) return 0 - return Math.ceil((this.sdict.length - this.sdict.lastLearnIndex) / this.sdict.perDayStudyNumber) - }, - sbook(): Dict { - return this.article.bookList[this.article.studyIndex] ?? {} - }, - currentBookProgress(): number { - if (!this.sbook.length) return 0 - if (this.sbook.complete) return 100 - return _getStudyProgress(this.sbook.lastLearnIndex, this.sbook.length) - }, + collectArticle(): Dict { + return this.article.bookList[0] }, - actions: { - setState(obj: BaseState) { - obj.word.bookList.map(book => { - book.words = shallowReactive(book.words) - book.articles = shallowReactive(book.articles) - book.statistics = shallowReactive(book.statistics) - }) - obj.article.bookList.map(book => { - book.words = shallowReactive(book.words) - book.articles = shallowReactive(book.articles) - book.statistics = shallowReactive(book.statistics) - }) - this.$patch(obj) - }, - async init() { - return new Promise(async resolve => { - try { - let configStr: string = await get(SAVE_DICT_KEY.key) - let data = checkAndUpgradeSaveDict(configStr) - if (AppEnv.IS_OFFICIAL) { - let r = await dictListVersion() - if (r.success) { - data.dictListVersion = r.data - } - } - if (AppEnv.CAN_REQUEST) { - let res = await myDictList() - if (res.success) { - //只保留未同步的 - data.word.bookList = data.word.bookList.filter(v => !v.sync) - data.article.bookList = data.article.bookList.filter(v => !v.sync) - //这里看看是否要 shallowReactive - Object.assign(data, res.data) - } - } - console.log('data', data) - this.setState(data) - set(SAVE_DICT_KEY.key, JSON.stringify({ - val: shakeCommonDict(this.$state), - version: SAVE_DICT_KEY.version - })) - } catch (e) { - console.error('读取本地dict数据失败', e) - } - resolve(true) - }) - }, - //改变词典 - async changeDict(val: Dict) { - if (AppEnv.CAN_REQUEST) { - let r = await add2MyDict({ - id: val.id, - perDayStudyNumber: val.perDayStudyNumber, - lastLearnIndex: val.lastLearnIndex, - complete: val.complete, - }) - if (!r.success) return Toast.error(r.msg) - else val.userDictId = r.data - } - //把其他的词典的单词数据都删掉，全保存在内存里太卡了 - this.word.bookList.slice(3).map(v => { - if (!v.custom) { - v.words = shallowReactive([]) - } - }) - let rIndex = this.word.bookList.findIndex((v: Dict) => v.id === val.id) - if (val.words.length < val.perDayStudyNumber) { - val.perDayStudyNumber = val.words.length - } - if (rIndex > -1) { - this.word.studyIndex = rIndex - this.word.bookList[this.word.studyIndex].words = shallowReactive(val.words) - this.word.bookList[this.word.studyIndex].perDayStudyNumber = val.perDayStudyNumber - this.word.bookList[this.word.studyIndex].lastLearnIndex = val.lastLearnIndex - this.word.bookList[this.word.studyIndex].userDictId = val.userDictId - } else { - this.word.bookList.push(getDefaultDict(val)) - this.word.studyIndex = this.word.bookList.length - 1 - } - }, - //改变书籍 - async changeBook(val: Dict) { - if (AppEnv.CAN_REQUEST) { - let r = await add2MyDict({ - id: val.id, - perDayStudyNumber: val.perDayStudyNumber, - lastLearnIndex: val.lastLearnIndex, - complete: val.complete, - }) - if (!r.success) { - return Toast.error(r.msg) - } - } - //把其他的书籍里面的文章数据都删掉，全保存在内存里太卡了 - this.article.bookList.slice(1).map(v => { - if (!v.custom) { - v.articles = shallowReactive([]) - } - }) - let rIndex = this.article.bookList.findIndex((v: Dict) => v.id === val.id) - if (rIndex > -1) { - this.article.studyIndex = rIndex - //不要整个等于，不然统计没了 - // this.article.bookList[this.article.studyIndex] = getDefaultDict(val) - this.article.bookList[this.article.studyIndex].articles = shallowReactive(val.articles) - this.article.bookList[this.article.studyIndex].cover = val.cover - this.article.bookList[this.article.studyIndex].name = val.name - this.article.bookList[this.article.studyIndex].description = val.description - } else { - this.article.bookList.push(getDefaultDict(val)) - this.article.studyIndex = this.article.bookList.length - 1 - } - }, + wrong(): Dict { + return this.word.bookList[1] }, + known(): Dict { + return this.word.bookList[2] + }, + knownWords(): string[] { + return this.known.words.map((v: Word) => v.word.toLowerCase()) + }, + allIgnoreWords() { + return this.known.words.map((v: Word) => v.word.toLowerCase()).concat(this.simpleWords.map((v: string) => v.toLowerCase())) + }, + sdict(): Dict { + if (this.word.studyIndex >= 0) { + return this.word.bookList[this.word.studyIndex] ?? getDefaultDict() + } + return getDefaultDict() + }, + currentStudyProgress(): number { + if (!this.sdict.length) return 0 + return _getStudyProgress(this.sdict.lastLearnIndex, this.sdict.length) + }, + getDictCompleteDate(): number { + if (!this.sdict.length) return 0 + if (!this.sdict.perDayStudyNumber) return 0 + return Math.ceil((this.sdict.length - this.sdict.lastLearnIndex) / this.sdict.perDayStudyNumber) + }, + sbook(): Dict { + return this.article.bookList[this.article.studyIndex] ?? {} + }, + currentBookProgress(): number { + if (!this.sbook.length) return 0 + if (this.sbook.complete) return 100 + return _getStudyProgress(this.sbook.lastLearnIndex, this.sbook.length) + }, + }, + actions: { + setState(obj: BaseState) { + obj.word.bookList.map(book => { + book.words = shallowReactive(book.words) + book.articles = shallowReactive(book.articles) + book.statistics = shallowReactive(book.statistics) + }) + obj.article.bookList.map(book => { + book.words = shallowReactive(book.words) + book.articles = shallowReactive(book.articles) + book.statistics = shallowReactive(book.statistics) + }) + this.$patch(obj) + }, + async init() { + return new Promise(async resolve => { + try { + let configStr: string = await get(SAVE_DICT_KEY.key) + let data = checkAndUpgradeSaveDict(configStr) + if (AppEnv.IS_OFFICIAL) { + let r = await dictListVersion() + if (r.success) { + data.dictListVersion = r.data + } + } + if (AppEnv.CAN_REQUEST) { + let res = await myDictList() + if (res.success) { + //只保留未同步的 + data.word.bookList = data.word.bookList.filter(v => !v.sync) + data.article.bookList = data.article.bookList.filter(v => !v.sync) + //这里看看是否要 shallowReactive + Object.assign(data, res.data) + } + } + console.log('data', data) + this.setState(data) + } catch (e) { + console.error('读取本地dict数据失败', e) + } + resolve(true) + }) + }, + //改变词典 + async changeDict(val: Dict) { + if (AppEnv.CAN_REQUEST) { + let r = await add2MyDict({ + id: val.id, + perDayStudyNumber: val.perDayStudyNumber, + lastLearnIndex: val.lastLearnIndex, + complete: val.complete, + }) + if (!r.success) return Toast.error(r.msg) + else val.userDictId = r.data + } + //把其他的词典的单词数据都删掉，全保存在内存里太卡了 + this.word.bookList.slice(3).map(v => { + if (!v.custom) { + v.words = shallowReactive([]) + } + }) + let rIndex = this.word.bookList.findIndex((v: Dict) => v.id === val.id) + if (val.words.length < val.perDayStudyNumber) { + val.perDayStudyNumber = val.words.length + } + if (rIndex > -1) { + this.word.studyIndex = rIndex + this.word.bookList[this.word.studyIndex].words = shallowReactive(val.words) + this.word.bookList[this.word.studyIndex].perDayStudyNumber = val.perDayStudyNumber + this.word.bookList[this.word.studyIndex].lastLearnIndex = val.lastLearnIndex + this.word.bookList[this.word.studyIndex].userDictId = val.userDictId + } else { + this.word.bookList.push(getDefaultDict(val)) + this.word.studyIndex = this.word.bookList.length - 1 + } + }, + //改变书籍 + async changeBook(val: Dict) { + if (AppEnv.CAN_REQUEST) { + let r = await add2MyDict({ + id: val.id, + perDayStudyNumber: val.perDayStudyNumber, + lastLearnIndex: val.lastLearnIndex, + complete: val.complete, + }) + if (!r.success) { + return Toast.error(r.msg) + } + } + //把其他的书籍里面的文章数据都删掉，全保存在内存里太卡了 + this.article.bookList.slice(1).map(v => { + if (!v.custom) { + v.articles = shallowReactive([]) + } + }) + let rIndex = this.article.bookList.findIndex((v: Dict) => v.id === val.id) + if (rIndex > -1) { + this.article.studyIndex = rIndex + //不要整个等于，不然统计没了 + // this.article.bookList[this.article.studyIndex] = getDefaultDict(val) + this.article.bookList[this.article.studyIndex].articles = shallowReactive(val.articles) + this.article.bookList[this.article.studyIndex].cover = val.cover + this.article.bookList[this.article.studyIndex].name = val.name + this.article.bookList[this.article.studyIndex].description = val.description + } else { + this.article.bookList.push(getDefaultDict(val)) + this.article.studyIndex = this.article.bookList.length - 1 + } + }, + }, }) diff --git a/src/types/types.ts b/src/types/types.ts index 6e16e163..7a80f247 100644 --- a/src/types/types.ts +++ b/src/types/types.ts @@ -97,7 +97,9 @@ export interface Statistics { export enum Sort { normal = 0, random = 1, - reverse = 2 + reverse = 2, + reverseAll = 3, + randomAll = 4, } export enum ShortcutKey {