From 8e17db012e45ab459cec3a0d3a1d5c7c47056dfe Mon Sep 17 00:00:00 2001
From: zyronon <zyronon@163.com>
Date: Sat, 14 Oct 2023 01:24:05 +0800
Subject: [PATCH] save

---
 .gitignore                                    |  1 +
 .../Article/EditBatchArticleModal.vue         | 37 ++++++++++++-------
 src/components/List.vue                       | 17 ++++++++-
 src/hooks/translate.ts                        | 32 ++++++++--------
 4 files changed, 55 insertions(+), 32 deletions(-)

diff --git a/.gitignore b/.gitignore
index a547bf36..c92aeda5 100644
--- a/.gitignore
+++ b/.gitignore
@@ -22,3 +22,4 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+report.html
\ No newline at end of file
diff --git a/src/components/Article/EditBatchArticleModal.vue b/src/components/Article/EditBatchArticleModal.vue
index 34d098c3..16d2a13c 100644
--- a/src/components/Article/EditBatchArticleModal.vue
+++ b/src/components/Article/EditBatchArticleModal.vue
@@ -16,7 +16,6 @@ import {useDisableEventListener} from "@/hooks/event.ts";
 import {MessageBox} from "@/utils/MessageBox.tsx";
 import {useRuntimeStore} from "@/stores/runtime.ts";
 
-
 const base = useBaseStore()
 const runtimeStore = useRuntimeStore()
 
@@ -24,6 +23,7 @@ let article = $ref<Article>(cloneDeep(DefaultArticle))
 let show = $ref(false)
 let showImportBtn = $ref(true)
 let editArticleRef: any = $ref()
+let listEl: any = $ref()
 
 onMounted(() => {
   emitter.on(EventKey.openArticleListModal, (val: Article) => {
@@ -212,6 +212,9 @@ function saveArticle(val: Article): boolean {
     }
     val.id = uuidv4()
     runtimeStore.editDict.articles.push(val)
+    setTimeout(()=>{
+      listEl.scrollBottom()
+    })
   }
   article = cloneDeep(val)
   //TODO 保存完成后滚动到对应位置
@@ -225,17 +228,6 @@ function saveAndNext(val: Article) {
   }
 }
 
-const list = $computed(() => {
-  if (!article.id) {
-    return runtimeStore.editDict.articles.concat([article])
-  }
-  return runtimeStore.editDict.articles
-})
-
-function getTitle(item: Article, index: number,) {
-  if (!item.id) return 'New article'
-  return `${index + 1}. ${item.title}`
-}
 </script>
 
 <template>
@@ -251,16 +243,20 @@ function getTitle(item: Article, index: number,) {
           <BaseIcon title="选择其他词典/文章" icon="carbon:change-catalog"/>
         </header>
         <List
-            v-model:list="list"
+            ref="listEl"
+            v-model:list="runtimeStore.editDict.articles"
             :select-item="article"
             @del-select-item="article = cloneDeep(DefaultArticle)"
             @select-item="selectArticle"
         >
           <template v-slot="{item,index}">
-            <div class="name"> {{ getTitle(item, index) }}</div>
+            <div class="name"> {{ `${index + 1}. ${item.title}` }}</div>
             <div class="translate-name"> {{ `   ${item.titleTranslate}` }}</div>
           </template>
         </List>
+        <div class="add" v-if="!article.title">
+          正在添加新文章...
+        </div>
         <div class="footer">
           <div class="import" v-if="showImportBtn">
             <BaseButton>导入</BaseButton>
@@ -332,6 +328,19 @@ function getTitle(item: Article, index: number,) {
       font-size: 16rem;
     }
 
+    .add {
+      width: 260rem;
+      box-sizing: border-box;
+      border-radius: 8rem;
+      margin-bottom: 10rem;
+      padding: 10rem;
+      display: flex;
+      justify-content: space-between;
+      transition: all .3s;
+      color: white;
+      background: var(--color-item-active);
+    }
+
     .footer {
       height: $height;
       display: flex;
diff --git a/src/components/List.vue b/src/components/List.vue
index 6c54a3c8..bdcd5b85 100644
--- a/src/components/List.vue
+++ b/src/components/List.vue
@@ -82,10 +82,24 @@ function delItem(item: T) {
   }
 }
 
+let el: HTMLDivElement = $ref()
+
+function scrollBottom() {
+  el.scrollTo({
+    top: el.scrollHeight,
+    left: 0,
+    behavior: "smooth",
+  });
+}
+
+defineExpose({scrollBottom})
+
 </script>
 
 <template>
-  <div class="list-wrapper">
+  <div class="list-wrapper"
+       ref="el"
+  >
     <div class="search">
       <Input v-model="searchKey"/>
     </div>
@@ -145,6 +159,7 @@ function delItem(item: T) {
 }
 
 .list-wrapper {
+  transition: all .3s;
   flex: 1;
   overflow: overlay;
   padding-right: 5rem;
diff --git a/src/hooks/translate.ts b/src/hooks/translate.ts
index 8c4bd65a..24cf8e4c 100644
--- a/src/hooks/translate.ts
+++ b/src/hooks/translate.ts
@@ -6,31 +6,29 @@ import {Translator} from "@opentranslate/translator/src/translator.ts";
 
 export function renewSectionTranslates(article: Article, translate: string) {
   let failCount = 0
-  if (translate.trim()) {
     let articleTranslate = translate.split('\n')
     // console.log('articleTranslate', articleTranslate)
     // console.log('articleTranslate', articleTranslate)
     let count = 0
     for (let i = 0; i < article.sections.length; i++) {
-      let v = article.sections[i]
-      for (let j = 0; j < v.length; j++) {
-        let sentence = v[j]
-        try {
-          let trans = articleTranslate[count]
-          if (trans) {
-            sentence.translate = trans
-          } else {
-            failCount++
-          }
-        } catch (e) {
-          failCount++
-          // console.log('没有对应的翻译', sentence.text)
+        let v = article.sections[i]
+        for (let j = 0; j < v.length; j++) {
+            let sentence = v[j]
+            try {
+                let trans = articleTranslate[count]
+                if (trans) {
+                    sentence.translate = trans
+                } else {
+                    failCount++
+                }
+            } catch (e) {
+                failCount++
+                // console.log('没有对应的翻译', sentence.text)
+            }
+            count++
         }
         count++
-      }
-      count++
     }
-  }
   return failCount
 }