From fe608889d8812cade9150a58d019b75d7eb7dd3f Mon Sep 17 00:00:00 2001
From: Dreamacro <305009791@qq.com>
Date: Sat, 6 Jun 2020 23:59:56 +0800
Subject: [PATCH] Fix: display count on rule provider

---
 src/components/Tag/style.scss            | 1 +
 src/containers/Rules/Provider/index.tsx  | 3 ++-
 src/containers/Rules/Provider/style.scss | 3 ++-
 src/i18n/en_US.ts                        | 3 ++-
 src/i18n/zh_CN.ts                        | 3 ++-
 5 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/Tag/style.scss b/src/components/Tag/style.scss
index b2f32d7..fdfe59a 100644
--- a/src/components/Tag/style.scss
+++ b/src/components/Tag/style.scss
@@ -3,6 +3,7 @@
 .tag {
     display: flex;
     align-items: center;
+    justify-content: center;
     height: 24px;
     font-size: 12px;
     padding: 0 12px;
diff --git a/src/containers/Rules/Provider/index.tsx b/src/containers/Rules/Provider/index.tsx
index b4447cf..ed210f0 100644
--- a/src/containers/Rules/Provider/index.tsx
+++ b/src/containers/Rules/Provider/index.tsx
@@ -16,7 +16,7 @@ export function Provider (props: ProvidersProps) {
     const { useTranslation, lang } = useI18n()
 
     const { provider } = props
-    const { t } = useTranslation('Proxies')
+    const { t } = useTranslation('Rules')
 
     const { visible, hide, show } = useVisible()
 
@@ -34,6 +34,7 @@ export function Provider (props: ProvidersProps) {
                     <span className="rule-provider-name">{ provider.name }</span>
                     <Tag>{ provider.vehicleType }</Tag>
                     <Tag className="rule-provider-behavior">{ provider.behavior }</Tag>
+                    <span className="rule-provider-update">{ `${t('ruleCount')}: ${provider.ruleCount}` }</span>
                 </div>
                 <div className="rule-provider-header-part">
                     {
diff --git a/src/containers/Rules/Provider/style.scss b/src/containers/Rules/Provider/style.scss
index 87cbded..f76604b 100644
--- a/src/containers/Rules/Provider/style.scss
+++ b/src/containers/Rules/Provider/style.scss
@@ -29,7 +29,8 @@
 }
 
 .rule-provider-behavior {
-    margin-left: 12px;
+    width: 80px;
+    margin: 0 20px 0 12px;
     background-color: $color-primary-dark;
     color: #fff;
 }
diff --git a/src/i18n/en_US.ts b/src/i18n/en_US.ts
index 8470a7e..41936f9 100644
--- a/src/i18n/en_US.ts
+++ b/src/i18n/en_US.ts
@@ -43,7 +43,8 @@ export default {
     Rules: {
         title: 'Rules',
         providerTitle: 'Providers',
-        providerUpdateTime: 'Last updated at'
+        providerUpdateTime: 'Last updated at',
+        ruleCount: 'Rule count'
     },
     Connections: {
         title: 'Connections',
diff --git a/src/i18n/zh_CN.ts b/src/i18n/zh_CN.ts
index 6ca740f..17d44ae 100644
--- a/src/i18n/zh_CN.ts
+++ b/src/i18n/zh_CN.ts
@@ -43,7 +43,8 @@ export default {
     Rules: {
         title: '规则',
         providerTitle: '规则集',
-        providerUpdateTime: '最后更新于'
+        providerUpdateTime: '最后更新于',
+        ruleCount: '规则条数'
     },
     Connections: {
         title: '连接',