feat(wordpage): add word count

crimx · Aug 26, 2018 · 6667f53 · 6667f53
1 parent edf76e9
commit 6667f53
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 0 deletions.
diff --git a/src/_locales/wordpage/messages.json b/src/_locales/wordpage/messages.json
@@ -118,5 +118,25 @@
     "en": "Saladict Notebook",
     "zh_CN": "Saladict 生词本",
     "zh_TW": "Saladict 生字本"
+  },
+  "wordcount_selected": {
+    "en": "{{count}} item selected",
+    "zh_CN": "已选中 {{count}} 个单词",
+    "zh_TW": "已選中 {{count}} 個單字"
+  },
+  "wordcount_selected_plural": {
+    "en": "{{count}} items selected",
+    "zh_CN": "已选中 {{count}} 个单词",
+    "zh_TW": "已選中 {{count}} 個單字"
+  },
+  "wordcount_total": {
+    "en": "{{count}} item total",
+    "zh_CN": "共有 {{count}} 个单词",
+    "zh_TW": "共有 {{count}} 個單字"
+  },
+  "wordcount_total_plural": {
+    "en": "{{count}} items total",
+    "zh_CN": "共有 {{count}} 个单词",
+    "zh_TW": "共有 {{count}} 個單字"
   }
 }
diff --git a/src/components/WordPage/App.tsx b/src/components/WordPage/App.tsx
@@ -105,6 +105,7 @@ export class WordPageMain extends React.Component<WordPageMainInnerProps, WordPa
         current: 1,
         pageSize: ITEMS_PER_PAGE,
         defaultPageSize: ITEMS_PER_PAGE,
+        total: 0,
       },
       rowSelection: {
         selectedRowKeys: [],
@@ -371,6 +372,12 @@ export class WordPageMain extends React.Component<WordPageMainInnerProps, WordPa
         <Layout className='wordpage-Container'>
           <Header className='wordpage-Header'>
             <h1 style={{ color: '#fff' }}>{t(`title_${area}`)}</h1>
+            {(pagination.total as number) > 0 &&
+              <span className='wordpage-Wordcount'>{t(`wordcount_total`, { count: pagination.total })}</span>
+            }
+            {selectedRows.length > 0 &&
+              <span className='wordpage-Wordcount'>{t(`wordcount_selected`, { count: selectedRows.length })}</span>
+            }
             <div style={{ marginLeft: 'auto' }}>
               <Input
                 style={{ width: '15em' }}

diff --git a/src/components/WordPage/_style.scss b/src/components/WordPage/_style.scss
@@ -21,6 +21,13 @@ textarea {
   width: 100%;
 }
 
+.wordpage-Wordcount {
+  align-self: flex-end;
+  line-height: 3.3;
+  margin-left: 10px;
+  color: #fff;
+}
+
 .wordpage-Content {
   background: #fff;
 }