From 7ed444eb5eb6174e00cadee636098ce3038193e9 Mon Sep 17 00:00:00 2001
From: zyronon <zyronon@163.com>
Date: Mon, 4 Dec 2023 01:20:49 +0800
Subject: [PATCH] save

---
 src/components/article/EditArticle.vue        | 14 ++++++++----
 .../practice-article/TypingArticle.vue        | 22 ++++++-------------
 src/stores/base.ts                            |  2 +-
 3 files changed, 18 insertions(+), 20 deletions(-)

diff --git a/src/components/article/EditArticle.vue b/src/components/article/EditArticle.vue
index fe8584ca..cd7e9436 100644
--- a/src/components/article/EditArticle.vue
+++ b/src/components/article/EditArticle.vue
@@ -37,6 +37,7 @@ const emit = defineEmits<{
 let networkTranslateEngine = $ref('baidu')
 let progress = $ref(0)
 let failCount = $ref(0)
+let textareaRef = $ref<HTMLTextAreaElement>()
 const TranslateEngineOptions = [
   {value: 'baidu', label: '百度'},
   {value: 'youdao', label: '有道'},
@@ -46,6 +47,8 @@ let editArticle = $ref<Article>(cloneDeep(DefaultArticle))
 
 watch(() => props.article, val => {
   editArticle = cloneDeep(val)
+  progress = 0
+  failCount = 0
   if (editArticle.text.trim()) {
     if (editArticle.useTranslateType === TranslateType.custom) {
       if (editArticle.textCustomTranslate.trim()) {
@@ -76,18 +79,19 @@ function renewSections() {
     if (editArticle.useTranslateType === TranslateType.network) {
       failCount = renewSectionTranslates(editArticle, editArticle.textNetworkTranslate)
     }
-    console.log('failCount',failCount)
   } else {
     editArticle.sections = []
   }
 }
 
 function appendTranslate(str: string) {
+  let selectionStart = textareaRef.selectionStart;
+  let selectionEnd = textareaRef.selectionEnd;
   if (editArticle.useTranslateType === TranslateType.custom) {
-    editArticle.textCustomTranslate += str
+    editArticle.textCustomTranslate = editArticle.textCustomTranslate.slice(0, selectionStart) + str + editArticle.textCustomTranslate.slice(selectionEnd)
   }
   if (editArticle.useTranslateType === TranslateType.network) {
-    editArticle.textNetworkTranslate += str
+    editArticle.textNetworkTranslate = editArticle.textNetworkTranslate.slice(0, selectionStart) + str + editArticle.textNetworkTranslate.slice(selectionEnd)
   }
 }
 
@@ -108,7 +112,7 @@ function onPaste(event: ClipboardEvent) {
       () => {
         appendTranslate(paste)
         renewSections()
-      },null,
+      }, null,
       {
         confirmButtonText: '需要',
         cancelButtonText: '关闭',
@@ -314,6 +318,7 @@ defineExpose({save, getEditArticle: () => cloneDeep(editArticle)})
             type="textarea"
             class="base-textarea"
             placeholder="请填写翻译正文"
+            ref="textareaRef"
         >
             </textarea>
         <textarea
@@ -326,6 +331,7 @@ defineExpose({save, getEditArticle: () => cloneDeep(editArticle)})
             type="textarea"
             class="base-textarea"
             placeholder="等待网络翻译中..."
+            ref="textareaRef"
         >
             </textarea>
         <Empty
diff --git a/src/pages/practice/practice-article/TypingArticle.vue b/src/pages/practice/practice-article/TypingArticle.vue
index e3645575..5790c5b9 100644
--- a/src/pages/practice/practice-article/TypingArticle.vue
+++ b/src/pages/practice/practice-article/TypingArticle.vue
@@ -43,6 +43,7 @@ const emit = defineEmits<{
 }>()
 
 let isPlay = $ref(false)
+let typeArticleRef = $ref<HTMLInputElement>(null)
 let articleWrapperRef = $ref<HTMLInputElement>(null)
 let sectionIndex = $ref(0)
 let sentenceIndex = $ref(0)
@@ -58,9 +59,6 @@ let hoverIndex = $ref({
 const currentIndex = computed(() => {
   return `${sectionIndex}${sentenceIndex}${wordIndex}`
 })
-const collectIndex = $computed(() => {
-  return store.collect.articles.findIndex((v: Article) => v.title.toLowerCase() === props.article.title.toLowerCase())
-})
 
 const playBeep = usePlayBeep()
 const playCorrect = usePlayCorrect()
@@ -76,6 +74,7 @@ watch(() => props.article, () => {
   sentenceIndex = props.sentenceIndex
   wordIndex = props.wordIndex
   stringIndex = props.stringIndex
+  typeArticleRef?.scrollTo({top: 0, behavior: "smooth"})
   calcTranslateLocation()
 }, {immediate: true})
 
@@ -362,16 +361,6 @@ function otherWord(word: ArticleWord, i: number, i2: number, i3: number) {
   return str
 }
 
-function toggleCollect() {
-  if (collectIndex === -1) {
-    store.collect.articles.push(props.article)
-    ElMessage.success('收藏成功')
-  } else {
-    store.collect.articles.splice(collectIndex, 1)
-    ElMessage.success('取消成功')
-  }
-}
-
 const {
   isArticleCollect,
   toggleArticleCollect
@@ -380,7 +369,7 @@ const {
 </script>
 
 <template>
-  <div class="typing-article">
+  <div class="typing-article" ref="typeArticleRef">
     <header>
       <div class="title word">{{ props.article.title }}</div>
       <div class="titleTranslate" v-if="settingStore.translate">{{ props.article.titleTranslate }}</div>
@@ -488,6 +477,9 @@ const {
 
 $article-width: 1000px;
 .typing-article {
+  height: 100%;
+  width: 100%;
+  overflow: auto;
 
   header {
     word-wrap: break-word;
@@ -539,7 +531,7 @@ $article-width: 1000px;
       .sentence {
         transition: all .3s;
 
-        &:first-child{
+        &:first-child {
           padding-left: 50rem;
         }
 
diff --git a/src/stores/base.ts b/src/stores/base.ts
index f4f5f5dc..209d0069 100644
--- a/src/stores/base.ts
+++ b/src/stores/base.ts
@@ -116,7 +116,7 @@ export const useBaseStore = defineStore('base', {
         },
       ],
       current: {
-        index: 4,
+        index: 3,
         // dictType: DictType.article,
         // index: 0,
         practiceType: DictType.word,