From 6e0d8a01855798856913237d967ea4b71427dd62 Mon Sep 17 00:00:00 2001 From: zyronon Date: Thu, 21 Sep 2023 23:26:05 +0800 Subject: [PATCH] save --- components.d.ts | 3 +- src/App.vue | 1 - src/components/BaseButton.vue | 6 +- src/components/Modal/Confirm.vue | 14 --- src/components/Modal/Modal.vue | 40 ++++--- src/components/Practice/AddArticle.vue | 70 +++++++++---- src/components/Practice/Practice.vue | 20 +++- src/components/Practice/Statistics.vue | 1 + src/components/Practice/TypeArticle.vue | 2 +- src/components/Toolbar/Add.vue | 3 +- src/components/Toolbar/SettingModal.vue | 3 +- src/hooks/event.ts | 133 +++++++++++++----------- src/utils/MessageBox.tsx | 68 ++++++++++++ 13 files changed, 237 insertions(+), 127 deletions(-) delete mode 100644 src/components/Modal/Confirm.vue create mode 100644 src/utils/MessageBox.tsx diff --git a/components.d.ts b/components.d.ts index d8d439b6..09f25691 100644 --- a/components.d.ts +++ b/components.d.ts @@ -9,10 +9,12 @@ declare module 'vue' { export interface GlobalComponents { Add: typeof import('./src/components/Toolbar/Add.vue')['default'] AddArticle: typeof import('./src/components/Practice/AddArticle.vue')['default'] + Alert: typeof import('./src/components/Modal/Alert.vue')['default'] Backgorund: typeof import('./src/components/Backgorund.vue')['default'] BaseButton: typeof import('./src/components/BaseButton.vue')['default'] ChapterDetail: typeof import('./src/components/ChapterDetail.vue')['default'] ChapterList: typeof import('./src/components/ChapterList.vue')['default'] + Confirm: typeof import('./src/components/Modal/Confirm.vue')['default'] DictList: typeof import('./src/components/DictList.vue')['default'] DictModal: typeof import('./src/components/Toolbar/DictModal.vue')['default'] EditAbleText: typeof import('./src/components/EditAbleText.vue')['default'] @@ -32,7 +34,6 @@ declare module 'vue' { IconWrapper: typeof import('./src/components/IconWrapper.vue')['default'] MiniModal: typeof import('./src/components/MiniModal.vue')['default'] Modal: typeof import('./src/components/Modal/Modal.vue')['default'] - NewModal: typeof import('./src/components/Modal/NewModal.vue')['default'] PopConfirm: typeof import('./src/components/PopConfirm.vue')['default'] Practice: typeof import('./src/components/Practice/Practice.vue')['default'] RepeatSetting: typeof import('./src/components/Toolbar/RepeatSetting.vue')['default'] diff --git a/src/App.vue b/src/App.vue index bd9ac5b1..bf92bd35 100644 --- a/src/App.vue +++ b/src/App.vue @@ -39,7 +39,6 @@ onMounted(() => { useEventListener('keyup', (e: KeyboardEvent) => { if (e.key === 'Escape') { let lastItem = runtimeStore.modalList.pop() - console.log('la',lastItem) lastItem && lastItem.close() } }) diff --git a/src/components/BaseButton.vue b/src/components/BaseButton.vue index b696930c..0e144e90 100644 --- a/src/components/BaseButton.vue +++ b/src/components/BaseButton.vue @@ -111,7 +111,11 @@ function click() { } &.link { - border-bottom-color: black; + border-radius: 0; + border-bottom: 2px solid transparent; + &:hover{ + border-bottom: 2px solid black; + } } &.active { diff --git a/src/components/Modal/Confirm.vue b/src/components/Modal/Confirm.vue deleted file mode 100644 index 18427051..00000000 --- a/src/components/Modal/Confirm.vue +++ /dev/null @@ -1,14 +0,0 @@ - - - - - \ No newline at end of file diff --git a/src/components/Modal/Modal.vue b/src/components/Modal/Modal.vue index f6a52088..c89f6f40 100644 --- a/src/components/Modal/Modal.vue +++ b/src/components/Modal/Modal.vue @@ -10,20 +10,29 @@ interface IProps { modelValue?: boolean, showClose?: boolean, title?: string, - subTitle?: string, fullScreen?: boolean; padding?: boolean + footer?: boolean + header?: boolean + confirmButtonText?: string + cancelButtonText?: string } const props = withDefaults(defineProps(), { modelValue: undefined, showClose: true, fullScreen: false, + footer: false, + header: true, + confirmButtonText: '确认', + cancelButtonText: '取消', }) const emit = defineEmits([ 'update:modelValue', - 'close' + 'close', + 'ok', + 'cancel', ]) let visible = $ref(false) @@ -47,6 +56,7 @@ function close() { setTimeout(() => { emit('update:modelValue', false) emit('close') + emit('cancel') visible = false resolve(true) }, closeTime) @@ -54,6 +64,7 @@ function close() { } watch(() => props.modelValue, n => { + // console.log('n', n) if (n) { visible = true } else { @@ -62,6 +73,7 @@ watch(() => props.modelValue, n => { }) onMounted(() => { + // console.log('props.modelValue', props.modelValue) if (props.modelValue === undefined) { visible = true } @@ -84,7 +96,7 @@ useEsc(close, () => props.modelValue) fullScreen?'full':'window' ]" > -
+
{{ props.title }}
props.modelValue) width="20" color="#929596" icon="ion:close-outline"/> -
-
+
-
- 取消 - 确定 + 取消 + 确定
@@ -223,15 +233,9 @@ $header-height: 60rem; .title { color: var(--color-font-1); font-weight: bold; - font-size: 28rem; + font-size: 24rem; line-height: 33rem; } - - .sub-title { - color: var(--color-font-1); - font-weight: 500; - font-size: 14rem; - } } .modal-body { @@ -288,11 +292,5 @@ $header-height: 60rem; } } } - - .close { - position: absolute; - right: 20rem; - top: 20rem; - } } \ No newline at end of file diff --git a/src/components/Practice/AddArticle.vue b/src/components/Practice/AddArticle.vue index e7bf4c07..71942ff0 100644 --- a/src/components/Practice/AddArticle.vue +++ b/src/components/Practice/AddArticle.vue @@ -16,42 +16,59 @@ import {Icon} from "@iconify/vue"; import {cloneDeep} from "lodash-es"; import {useDisableEventListener, useEsc} from "@/hooks/event.ts"; import {Action} from "element-plus"; +import {MessageBox} from "@/utils/MessageBox.tsx"; import Modal from "@/components/Modal/Modal.vue"; interface IProps { article?: Article + modelValue: boolean } const props = withDefaults(defineProps(), { - article: () => cloneDeep(DefaultArticle) + article: () => cloneDeep(DefaultArticle), + modelValue: false }) -let article = reactive
(props.article) + +let article = $ref
(cloneDeep(props.article)) let networkTranslateEngine = $ref('baidu') let progress = $ref(0) const TranslateEngineOptions = [ {value: 'baidu', label: '百度'}, {value: 'youdao', label: '有道'}, ] -const emit = defineEmits(['close', 'save']) +const emit = defineEmits([ + 'update:modelValue', + 'close', + 'save' +]) -useDisableEventListener() +useDisableEventListener(() => props.modelValue) -onMounted(() => { - if (article.text.trim()) { - if (article.useTranslateType === TranslateType.custom) { - if (article.textCustomTranslate.trim()) { - if (!article.textCustomTranslateIsFormat) { - let r = getSplitTranslateText(article.textCustomTranslate) - if (r) article.textCustomTranslate = r - ElMessageBox.alert('检测到本地翻译未格式化，已自动格式', '提示', { - confirmButtonText: '好的', - }) +watch(() => props.modelValue, n => { + if (n) { + article = cloneDeep(props.article) + if (article.text.trim()) { + if (article.useTranslateType === TranslateType.custom) { + if (article.textCustomTranslate.trim()) { + if (!article.textCustomTranslateIsFormat) { + let r = getSplitTranslateText(article.textCustomTranslate) + if (r) article.textCustomTranslate = r + ElMessage({ + message: '检测到本地翻译未格式化，已自动格式', + type: 'success', + duration: 5000 + }) + } } } } + updateSentenceTranslate() } - updateSentenceTranslate() +}) + +onMounted(() => { + }) async function startNetworkTranslate() { @@ -100,6 +117,8 @@ function updateSentenceTranslate() { if (article.useTranslateType === TranslateType.network) { updateLocalSentenceTranslate(article, article.textNetworkTranslate) } + } else { + article.sections = [] } } @@ -155,6 +174,16 @@ function save() { if (article.useTranslateType === TranslateType.network) { if (!article.textNetworkTranslate.trim()) { + // MessageBox.confirm( + // '您选择了“网络翻译”，但译文内容却为空白，是否修改为“不需要翻译”并保存?', + // '提示', + // () => { + // // article.useTranslateType = TranslateType.none + // // saveTemp() + // }, + // () => void 0, + // ) + // return return ElMessageBox.confirm('您选择了“网络翻译”，但译文内容却为空白，是否修改为“不需要翻译”并保存?', '提示', { confirmButtonText: '确认', cancelButtonText: '取消', @@ -215,10 +244,11 @@ watch(() => article.useTranslateType, () => {