From 55a43762c85b40c038bcfcdb8f2105f4b22ac8bb Mon Sep 17 00:00:00 2001
From: cKey <35512826+colinin@users.noreply.github.com>
Date: Sat, 6 Jun 2020 21:14:29 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E7=BB=84=E7=BB=87=E6=9C=BA?=
 =?UTF-8?q?=E6=9E=84=E9=85=8D=E7=BD=AE=E9=A1=B9;=E5=8F=98=E6=9B=B4?=
 =?UTF-8?q?=E9=80=9A=E7=9F=A5=E6=B6=88=E6=81=AF=E6=A0=87=E8=AF=86=E4=B8=BA?=
 =?UTF-8?q?string=E7=B1=BB=E5=9E=8B,=E4=BB=A5=E8=A7=A3=E5=86=B3js=E4=BC=A0?=
 =?UTF-8?q?=E9=80=92long=E7=B1=BB=E5=9E=8B=E6=BA=A2=E5=87=BA=E7=9A=84?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LINGYUN/Abp/Account/AccountAppService.cs  |   1 +
 .../SignalR/Hubs/NotificationsHub.cs          |   4 +-
 .../Abp/Notifications/NotificationInfo.cs     |   8 +-
 .../Notifications/NotificationStore.cs        |   8 +-
 .../EfCoreUserNotificationRepository.cs       |   3 +-
 .../Controllers/NotificationController.cs     |   2 -
 .../Identity/Localization/zh-Hans.json        |   4 +-
 .../Notification/components/UserMessages.vue  |   0
 .../components/UserNofitications.vue          | 190 ++++++++++
 vueJs/src/components/Notification/index.vue   | 179 +--------
 vueJs/src/lang/zh.ts                          |   4 +
 vueJs/src/utils/request.ts                    |  46 +--
 .../components/GlobalSettingEditForm.vue      | 358 ++++++++++++++++--
 vueJs/src/views/login/index.vue               |   4 +-
 vueJs/src/views/register/index.vue            |   3 +-
 vueJs/src/views/reset-password/index.vue      |   3 +-
 16 files changed, 564 insertions(+), 253 deletions(-)
 create mode 100644 vueJs/src/components/Notification/components/UserMessages.vue
 create mode 100644 vueJs/src/components/Notification/components/UserNofitications.vue

diff --git a/aspnet-core/modules/account/LINGYUN.Abp.Account.Application/LINGYUN/Abp/Account/AccountAppService.cs b/aspnet-core/modules/account/LINGYUN.Abp.Account.Application/LINGYUN/Abp/Account/AccountAppService.cs
index e73ac96ac..0f493118a 100644
--- a/aspnet-core/modules/account/LINGYUN.Abp.Account.Application/LINGYUN/Abp/Account/AccountAppService.cs
+++ b/aspnet-core/modules/account/LINGYUN.Abp.Account.Application/LINGYUN/Abp/Account/AccountAppService.cs
@@ -9,6 +9,7 @@ using Volo.Abp.Identity;
 using Volo.Abp.Settings;
 using Volo.Abp.Sms;
 using Volo.Abp.Uow;
+using Microsoft.AspNetCore.Cryptography;
 
 namespace LINGYUN.Abp.Account
 {
diff --git a/aspnet-core/modules/common/LINGYUN.Abp.Notifications.SignalR/LINGYUN/Abp/Notifications/SignalR/Hubs/NotificationsHub.cs b/aspnet-core/modules/common/LINGYUN.Abp.Notifications.SignalR/LINGYUN/Abp/Notifications/SignalR/Hubs/NotificationsHub.cs
index 5cd3ab3f1..67f7c60e5 100644
--- a/aspnet-core/modules/common/LINGYUN.Abp.Notifications.SignalR/LINGYUN/Abp/Notifications/SignalR/Hubs/NotificationsHub.cs
+++ b/aspnet-core/modules/common/LINGYUN.Abp.Notifications.SignalR/LINGYUN/Abp/Notifications/SignalR/Hubs/NotificationsHub.cs
@@ -22,9 +22,9 @@ namespace LINGYUN.Abp.Notifications.SignalR.Hubs
         }
 
         [HubMethodName("ChangeState")]
-        public virtual async Task ChangeStateAsync(long id, NotificationReadState readState = NotificationReadState.Read)
+        public virtual async Task ChangeStateAsync(string id, NotificationReadState readState = NotificationReadState.Read)
         {
-            await NotificationStore.ChangeUserNotificationReadStateAsync(CurrentTenant.Id, CurrentUser.GetId(), id, readState);
+            await NotificationStore.ChangeUserNotificationReadStateAsync(CurrentTenant.Id, CurrentUser.GetId(), long.Parse(id), readState);
         }
 
 
diff --git a/aspnet-core/modules/common/LINGYUN.Abp.Notifications/LINGYUN/Abp/Notifications/NotificationInfo.cs b/aspnet-core/modules/common/LINGYUN.Abp.Notifications/LINGYUN/Abp/Notifications/NotificationInfo.cs
index 6b0b5bc98..6f4d96b21 100644
--- a/aspnet-core/modules/common/LINGYUN.Abp.Notifications/LINGYUN/Abp/Notifications/NotificationInfo.cs
+++ b/aspnet-core/modules/common/LINGYUN.Abp.Notifications/LINGYUN/Abp/Notifications/NotificationInfo.cs
@@ -7,8 +7,7 @@ namespace LINGYUN.Abp.Notifications
     {
         public Guid? TenantId { get; set; }
         public string Name { get; set; }
-        [JsonConverter(typeof(HexLongConverter))]
-        public long Id { get; set; }
+        public string Id { get; set; }
         public NotificationData Data { get; set; }
         public DateTime CreationTime { get; set; }
         public NotificationType NotificationType { get; set; }
@@ -21,5 +20,10 @@ namespace LINGYUN.Abp.Notifications
 
             CreationTime = DateTime.Now;
         }
+
+        public long GetId()
+        {
+            return long.Parse(Id);
+        }
     }
 }
diff --git a/aspnet-core/modules/message/LINGYUN.Abp.MessageService.Domain/LINGYUN/Abp/MessageService/Notifications/NotificationStore.cs b/aspnet-core/modules/message/LINGYUN.Abp.MessageService.Domain/LINGYUN/Abp/MessageService/Notifications/NotificationStore.cs
index d0130281e..c9de3a3c0 100644
--- a/aspnet-core/modules/message/LINGYUN.Abp.MessageService.Domain/LINGYUN/Abp/MessageService/Notifications/NotificationStore.cs
+++ b/aspnet-core/modules/message/LINGYUN.Abp.MessageService.Domain/LINGYUN/Abp/MessageService/Notifications/NotificationStore.cs
@@ -60,7 +60,7 @@ namespace LINGYUN.Abp.MessageService.Notifications
             {
                 using (CurrentTenant.Change(notification.TenantId))
                 {
-                    var notify = await NotificationRepository.GetByIdAsync(notification.Id);
+                    var notify = await NotificationRepository.GetByIdAsync(notification.GetId());
                     await NotificationRepository.DeleteAsync(notify.Id);
 
                     await unitOfWork.SaveChangesAsync();
@@ -171,7 +171,7 @@ namespace LINGYUN.Abp.MessageService.Notifications
 
                     await NotificationRepository.InsertAsync(notify);
 
-                    notification.Id = notify.NotificationId;
+                    notification.Id = notify.NotificationId.ToString();
 
                     await unitOfWork.SaveChangesAsync();
                 }
@@ -185,7 +185,7 @@ namespace LINGYUN.Abp.MessageService.Notifications
             {
                 using (CurrentTenant.Change(notification.TenantId))
                 {
-                    var userNotification = new UserNotification(notification.Id, userId);
+                    var userNotification = new UserNotification(notification.GetId(), userId);
                     await UserNotificationRepository.InsertAsync(userNotification);
 
                     await unitOfWork.SaveChangesAsync();
@@ -245,7 +245,7 @@ namespace LINGYUN.Abp.MessageService.Notifications
             var userNofitications = new List<UserNotification>();
             foreach(var userId in userIds)
             {
-                var userNofitication = new UserNotification(notification.Id, userId);
+                var userNofitication = new UserNotification(notification.GetId(), userId);
                 userNofitications.Add(userNofitication);
             }
             await UserNotificationRepository.InsertUserNotificationsAsync(userNofitications);
diff --git a/aspnet-core/modules/message/LINGYUN.Abp.MessageService.EntityFrameworkCore/LINGYUN/Abp/MessageService/Notifications/EfCoreUserNotificationRepository.cs b/aspnet-core/modules/message/LINGYUN.Abp.MessageService.EntityFrameworkCore/LINGYUN/Abp/MessageService/Notifications/EfCoreUserNotificationRepository.cs
index 96d4f55e7..41d5a37b7 100644
--- a/aspnet-core/modules/message/LINGYUN.Abp.MessageService.EntityFrameworkCore/LINGYUN/Abp/MessageService/Notifications/EfCoreUserNotificationRepository.cs
+++ b/aspnet-core/modules/message/LINGYUN.Abp.MessageService.EntityFrameworkCore/LINGYUN/Abp/MessageService/Notifications/EfCoreUserNotificationRepository.cs
@@ -49,7 +49,8 @@ namespace LINGYUN.Abp.MessageService.Notifications
                                      join n in DbContext.Set<Notification>()
                                          on un.NotificationId equals n.NotificationId
                                      where un.UserId.Equals(userId) && un.ReadStatus.Equals(readState)
-                                     select n)
+                                     orderby n.NotificationId descending
+                                           select n)
                                     .Take(maxResultCount)
                                     .ToListAsync();
             return userNofitications;
diff --git a/aspnet-core/services/messages/LINGYUN.Abp.MessageService.HttpApi.Host/Controllers/NotificationController.cs b/aspnet-core/services/messages/LINGYUN.Abp.MessageService.HttpApi.Host/Controllers/NotificationController.cs
index fc87e40a4..200f1be92 100644
--- a/aspnet-core/services/messages/LINGYUN.Abp.MessageService.HttpApi.Host/Controllers/NotificationController.cs
+++ b/aspnet-core/services/messages/LINGYUN.Abp.MessageService.HttpApi.Host/Controllers/NotificationController.cs
@@ -26,11 +26,9 @@ namespace LINGYUN.Abp.MessageService.Controllers
                 TenantId = null,
                 NotificationSeverity = notification.Severity,
                 NotificationType = NotificationType.Application,
-                Id = new Random().Next(int.MinValue, int.MaxValue),
                 Name = "TestApplicationNotofication",
                 CreationTime = Clock.Now
             };
-            notificationInfo.Data.Properties["id"] = notificationInfo.Id.ToString();
             notificationInfo.Data.Properties["title"] = notification.Title;
             notificationInfo.Data.Properties["message"] = notification.Message;
             notificationInfo.Data.Properties["datetime"] = Clock.Now;
diff --git a/aspnet-core/services/platform/LINGYUN.Platform.HttpApi.Host/LINGYUN/Platform/Identity/Localization/zh-Hans.json b/aspnet-core/services/platform/LINGYUN.Platform.HttpApi.Host/LINGYUN/Platform/Identity/Localization/zh-Hans.json
index 83575a629..10c8c6196 100644
--- a/aspnet-core/services/platform/LINGYUN.Platform.HttpApi.Host/LINGYUN/Platform/Identity/Localization/zh-Hans.json
+++ b/aspnet-core/services/platform/LINGYUN.Platform.HttpApi.Host/LINGYUN/Platform/Identity/Localization/zh-Hans.json
@@ -2,6 +2,8 @@
   "culture": "zh-Hans",
   "texts": {
     "DisplayName:Abp.Identity.SignIn.EnablePhoneNumberConfirmation": "启用电话号码确认",
-    "Description:Abp.Identity.SignIn.EnablePhoneNumberConfirmation": "用户是否可以确认电话号码."
+    "Description:Abp.Identity.SignIn.EnablePhoneNumberConfirmation": "用户是否可以确认电话号码.",
+    "Identity.OrganizationUnit.MaxUserMembershipCount": "最大组织机构数",
+    "Description:Abp.Identity.OrganizationUnit.MaxUserMembershipCount": "单个用户允许加入的最大组织机构数."
   }
 }
\ No newline at end of file
diff --git a/vueJs/src/components/Notification/components/UserMessages.vue b/vueJs/src/components/Notification/components/UserMessages.vue
new file mode 100644
index 000000000..e69de29bb
diff --git a/vueJs/src/components/Notification/components/UserNofitications.vue b/vueJs/src/components/Notification/components/UserNofitications.vue
new file mode 100644
index 000000000..c0b14ba73
--- /dev/null
+++ b/vueJs/src/components/Notification/components/UserNofitications.vue
@@ -0,0 +1,190 @@
+<template>
+  <div class="notification">
+    <List
+      size="small"
+    >
+      <ListItem
+        v-for="(notify) in notifications"
+        :key="notify.id"
+      >
+        <ListItemMeta
+          :title="notify.message"
+          :description="formatDateTime(notify.datetime)"
+          style="cursor:pointer"
+          @click.native="handleClickNotification(notify.id)"
+        >
+          <template slot="avatar">
+            <Avatar
+              icon="ios-person"
+            />
+          </template>
+        </ListItemMeta>
+      </ListItem>
+    </List>
+    {{ notifications.length === 0 ? $t('messages.noNotifications') : '' }}
+  </div>
+</template>
+
+<script lang="ts">
+import { HubConnection, HubConnectionBuilder, HubConnectionState } from '@microsoft/signalr'
+import { Component, Vue } from 'vue-property-decorator'
+import { UserModule } from '@/store/modules/user'
+import { dateFormat } from '@/utils/index'
+import { MessageType } from 'element-ui/types/message'
+
+enum Severity {
+  success = 0,
+  info = 10,
+  warn = 20,
+  error = 30,
+  fatal = 40
+}
+
+enum ReadState {
+  Read = 0,
+  UnRead = 1
+}
+
+class Notification {
+  id!: string
+  title!: string
+  message!: string
+  datetime!: Date
+  severity!: Severity
+}
+
+@Component({
+  name: 'UserNofitications'
+})
+export default class extends Vue {
+  private connection!: HubConnection
+  private notifications = new Array<Notification>()
+
+  mounted() {
+    this.handleStartConnection()
+  }
+
+  destroyed() {
+    this.handleStopConnection()
+  }
+
+  private renderIconType(item: any) {
+    if (item.severity !== Severity.success) {
+      return ' el-icon-circle-close'
+    }
+    return ' el-icon-circle-check'
+  }
+
+  private renderIconStyle(item: any) {
+    if (item.severity !== Severity.success) {
+      return 'backgroundColor: #f56a00'
+    }
+    return 'backgroundColor: #87d068'
+  }
+
+  private formatDateTime(datetime: string) {
+    const date = new Date(datetime)
+    return dateFormat(date, 'YYYY-mm-dd HH:MM:SS')
+  }
+
+  private handleStartConnection() {
+    console.log('start signalr connection...')
+    if (!this.connection) {
+      const builder = new HubConnectionBuilder()
+      const userToken = UserModule.token.replace('Bearer ', '')
+      this.connection = builder
+        .withUrl('/signalr-hubs/signalr-hubs/notifications', { accessTokenFactory: () => userToken })
+        .withAutomaticReconnect({ nextRetryDelayInMilliseconds: () => 60000 })
+        .build()
+      this.connection.on('getNotification', data => this.onNotificationReceived(data))
+      this.connection.onclose(error => {
+        console.log('signalr connection has closed, error:')
+        console.log(error)
+      })
+    }
+    if (this.connection.state !== HubConnectionState.Connected) {
+      this.connection.start().then(() => {
+        this.connection.invoke('GetNotification', ReadState.UnRead, 10).then(result => {
+          result.items.forEach((notify: any) => {
+            const notification = new Notification()
+            notification.id = notify.id
+            notification.title = notify.data.properties.title
+            notification.message = notify.data.properties.message
+            notification.datetime = notify.creationTime
+            notification.severity = notify.notificationSeverity
+            this.notifications.push(notification)
+            this.$emit('notificationReceived')
+          })
+        })
+      })
+    }
+  }
+
+  private handleStopConnection() {
+    console.log('stop signalr connection...')
+    if (this.connection && this.connection.state === HubConnectionState.Connected) {
+      this.connection.stop()
+    }
+  }
+
+  private onNotificationReceived(notify: any) {
+    console.log('received signalr message...')
+    console.log(notify)
+    const notification = new Notification()
+    notification.id = notify.id
+    notification.title = notify.data.properties.title
+    notification.message = notify.data.properties.message
+    notification.datetime = notify.creationTime
+    notification.severity = notify.notificationSeverity
+    console.log(notification)
+    this.pushUserNotification(notification)
+    this.$emit('notificationReceived')
+    this.$notify({
+      title: notification.title,
+      message: notification.message,
+      type: this.getNofiyType(notification.severity)
+    })
+  }
+
+  private handleClickNotification(notificationId: string) {
+    this.connection.invoke('ChangeState', notificationId, ReadState.Read).then(() => {
+      const removeNotifyIndex = this.notifications.findIndex(n => n.id === notificationId)
+      this.notifications.splice(removeNotifyIndex, 1)
+      this.$emit('notificationReadChanged')
+    })
+  }
+
+  private pushUserNotification(notification: any) {
+    console.log(this.notifications)
+    if (this.notifications.length === 20) {
+      this.notifications.shift()
+    }
+    this.notifications.push(notification)
+  }
+
+  private getNofiyType(severity: Severity) {
+    const mapNotifyType: {[key: number]: MessageType } = {
+      0: 'success',
+      10: 'info',
+      20: 'warning',
+      30: 'error',
+      40: 'error'
+    }
+    return mapNotifyType[severity]
+  }
+}
+</script>
+
+<style lang="scss">
+.item {
+  margin-top: 0px;
+  margin-right: 10px;
+}
+.item.el-dropdown-selfdefine > .el-badge__content.el-badge__content--undefined.is-fixed {
+  top: 10px;
+}
+.notification > .ivu-list.ivu-list-small.ivu-list-horizontal.ivu-list-split{
+  max-height: 200px;
+  overflow: auto;
+}
+</style>
diff --git a/vueJs/src/components/Notification/index.vue b/vueJs/src/components/Notification/index.vue
index 0f4e776ac..827ea7ea1 100644
--- a/vueJs/src/components/Notification/index.vue
+++ b/vueJs/src/components/Notification/index.vue
@@ -1,9 +1,9 @@
 <template>
   <el-dropdown trigger="click">
     <el-badge
-      :value="notifications.length"
+      :value="notificationCount"
       class="item"
-      :hidden="notifications.length<=0"
+      :hidden="notificationCount<=0"
     >
       <svg-icon
         name="message"
@@ -20,31 +20,14 @@
         >
           <el-tab-pane
             label="通知"
-            class="notification"
           >
-            <List
-              size="small"
-            >
-              <ListItem
-                v-for="(notify) in notifications"
-                :key="notify.id"
-              >
-                <ListItemMeta
-                  :title="notify.message"
-                  :description="formatDateTime(notify.datetime)"
-                  @click="handleClickNotification(notify.id)"
-                >
-                  <template slot="avatar">
-                    <Avatar
-                      icon="ios-person"
-                    />
-                  </template>
-                </ListItemMeta>
-              </ListItem>
-            </List>
+            <user-nofitications
+              @notificationReceived="notificationCount+=1"
+              @notificationReadChanged="notificationCount-=1"
+            />
           </el-tab-pane>
           <el-tab-pane label="消息">
-            消息系统
+            {{ $t('messages.noMessages') }}
           </el-tab-pane>
         </el-tabs>
       </div>
@@ -53,149 +36,17 @@
 </template>
 
 <script lang="ts">
-import { HubConnection, HubConnectionBuilder, HubConnectionState } from '@microsoft/signalr'
 import { Component, Vue } from 'vue-property-decorator'
-import { UserModule } from '@/store/modules/user'
-import { dateFormat } from '@/utils/index'
-import { MessageType } from 'element-ui/types/message'
-
-enum Severity {
-  success = 0,
-  info = 10,
-  warn = 20,
-  error = 30,
-  fatal = 40
-}
-
-enum ReadState {
-  Read = 0,
-  UnRead = 1
-}
-
-class Notification {
-  id!: string
-  title!: string
-  message!: string
-  datetime!: Date
-  severity!: Severity
-}
+import UserNofitications from './components/UserNofitications.vue'
 
 @Component({
-  name: 'Notification'
+  name: 'Notification',
+  components: {
+    UserNofitications
+  }
 })
 export default class extends Vue {
-  private connection!: HubConnection
-  private notifications = new Array<Notification>()
-
-  mounted() {
-    this.handleStartConnection()
-  }
-
-  destroyed() {
-    this.handleStopConnection()
-  }
-
-  private renderIconType(item: any) {
-    if (item.severity !== Severity.success) {
-      return ' el-icon-circle-close'
-    }
-    return ' el-icon-circle-check'
-  }
-
-  private renderIconStyle(item: any) {
-    if (item.severity !== Severity.success) {
-      return 'backgroundColor: #f56a00'
-    }
-    return 'backgroundColor: #87d068'
-  }
-
-  private formatDateTime(datetime: string) {
-    const date = new Date(datetime)
-    return dateFormat(date, 'YYYY-mm-dd HH:MM:SS')
-  }
-
-  private handleStartConnection() {
-    console.log('start signalr connection...')
-    if (!this.connection) {
-      const builder = new HubConnectionBuilder()
-      const userToken = UserModule.token.replace('Bearer ', '')
-      this.connection = builder
-        .withUrl('/signalr-hubs/signalr-hubs/notifications', { accessTokenFactory: () => userToken })
-        .withAutomaticReconnect({ nextRetryDelayInMilliseconds: () => 60000 })
-        .build()
-      this.connection.on('getNotification', data => this.onNotificationReceived(data))
-      this.connection.onclose(error => {
-        console.log('signalr connection has closed, error:')
-        console.log(error)
-      })
-    }
-    if (this.connection.state !== HubConnectionState.Connected) {
-      this.connection.start().then(() => {
-        this.connection.invoke('GetNotification', ReadState.UnRead, 10).then(result => {
-          console.log(result)
-          result.items.forEach((notify: any) => {
-            const notification = new Notification()
-            notification.id = notify.data.properties.id
-            notification.title = notify.data.properties.title
-            notification.message = notify.data.properties.message
-            notification.datetime = notify.creationTime
-            notification.severity = notify.notificationSeverity
-            this.notifications.push(notification)
-          })
-        })
-      })
-    }
-  }
-
-  private handleStopConnection() {
-    console.log('stop signalr connection...')
-    if (this.connection && this.connection.state === HubConnectionState.Connected) {
-      this.connection.stop()
-    }
-  }
-
-  private onNotificationReceived(data: any) {
-    console.log('received signalr message...')
-    console.log(data)
-    const notification = new Notification()
-    notification.id = data.properties.id
-    notification.title = data.properties.title
-    notification.message = data.properties.message
-    notification.datetime = data.creationTime
-    notification.severity = data.notificationSeverity
-    this.pushUserNotification(notification)
-    this.$notify({
-      title: notification.title,
-      message: notification.message,
-      type: this.getNofiyType(notification.severity)
-    })
-  }
-
-  private handleClickNotification(notificationId: string) {
-    console.log('handleClickNotification')
-    this.connection.invoke('ChangeState', notificationId, ReadState.Read).then(() => {
-      const removeNotifyIndex = this.notifications.findIndex(n => n.id === notificationId)
-      this.notifications.splice(removeNotifyIndex)
-    })
-  }
-
-  private pushUserNotification(notification: any) {
-    if (this.notifications.length === 20) {
-      this.notifications.shift()
-    }
-    this.notifications.push(notification)
-  }
-
-  private getNofiyType(severity: Severity) {
-    const mapNotifyType: {[key: number]: MessageType } = {
-      0: 'success',
-      10: 'info',
-      20: 'warning',
-      30: 'error',
-      40: 'error'
-    }
-    return mapNotifyType[severity]
-  }
+  private notificationCount = 0
 }
 </script>
 
@@ -207,8 +58,4 @@ export default class extends Vue {
 .item.el-dropdown-selfdefine > .el-badge__content.el-badge__content--undefined.is-fixed {
   top: 10px;
 }
-.notification > .ivu-list.ivu-list-small.ivu-list-horizontal.ivu-list-split{
-  max-height: 200px;
-  overflow: auto;
-}
 </style>
diff --git a/vueJs/src/lang/zh.ts b/vueJs/src/lang/zh.ts
index 692e49ad1..230393785 100644
--- a/vueJs/src/lang/zh.ts
+++ b/vueJs/src/lang/zh.ts
@@ -610,5 +610,9 @@ export default {
     correctEmailAddress: '正确的邮件地址',
     correctPhoneNumber: '正确的手机号码',
     operatingFast: '您的操作过快,请稍后再试!'
+  },
+  messages: {
+    noNotifications: '没有通知',
+    noMessages: '没有消息'
   }
 }
diff --git a/vueJs/src/utils/request.ts b/vueJs/src/utils/request.ts
index 3b53611d6..3e3a71927 100644
--- a/vueJs/src/utils/request.ts
+++ b/vueJs/src/utils/request.ts
@@ -97,40 +97,18 @@ service.interceptors.response.use(
   },
   (error) => {
     showError(error.response.data, error.response.status)
-    if (error.response.status === 401) {
-      if (UserModule.refreshToken) {
-        UserModule.RefreshSession().then(() => {
-          return service.request(error.config)
-        }).catch(() => {
-          MessageBox.confirm(
-            l('login.tokenExprition'),
-            l('login.confirmLogout'),
-            {
-              confirmButtonText: l('login.relogin'),
-              cancelButtonText: l('global.cancel'),
-              type: 'error'
-            }).then(() => {
-            UserModule.ResetToken()
-            location.reload() // To prevent bugs from vue-router
-            return Promise.reject(error)
-          })
-        })
-      } else {
-        MessageBox.confirm(
-          l('login.tokenExprition'),
-          l('login.confirmLogout'),
-          {
-            confirmButtonText: l('login.relogin'),
-            cancelButtonText: l('global.cancel'),
-            type: 'error'
-          }).then(() => {
-          UserModule.ResetToken()
-          location.reload() // To prevent bugs from vue-router
-          return Promise.reject(error)
-        })
-      }
-    }
-    return Promise.reject(error)
+    MessageBox.confirm(
+      l('login.tokenExprition'),
+      l('login.confirmLogout'),
+      {
+        confirmButtonText: l('login.relogin'),
+        cancelButtonText: l('global.cancel'),
+        type: 'error'
+      }).then(() => {
+      UserModule.ResetToken()
+      location.reload() // To prevent bugs from vue-router
+      return Promise.reject(error)
+    })
   }
 )
 
diff --git a/vueJs/src/views/admin/settings/components/GlobalSettingEditForm.vue b/vueJs/src/views/admin/settings/components/GlobalSettingEditForm.vue
index 96cbe86d1..4f81d06ae 100644
--- a/vueJs/src/views/admin/settings/components/GlobalSettingEditForm.vue
+++ b/vueJs/src/views/admin/settings/components/GlobalSettingEditForm.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-if="globalSettingLoaded">
+  <div>
     <el-form
       ref="formGlobalSetting"
       v-model="globalSetting"
@@ -9,9 +9,20 @@
       <el-tabs>
         <el-tab-pane :label="$t('settings.systemSetting')">
           <el-form-item
+            v-if="hasSettingExistsed('Abp.Localization.DefaultLanguage')"
+            v-popover:DefaultLanguage
             prop="globalSetting['Abp.Localization.DefaultLanguage'].value"
-            :label="globalSetting['Abp.Localization.DefaultLanguage'].displayName"
           >
+            <el-popover
+              ref="DefaultLanguage"
+              trigger="hover"
+              :title="globalSetting['Abp.Localization.DefaultLanguage'].displayName"
+              :content="globalSetting['Abp.Localization.DefaultLanguage'].description"
+            />
+            <span
+              slot="label"
+              v-popover:DefaultLanguage
+            >{{ globalSetting['Abp.Localization.DefaultLanguage'].displayName }}</span>
             <el-select
               v-model="globalSetting['Abp.Localization.DefaultLanguage'].value"
               style="width: 100%;"
@@ -25,18 +36,44 @@
                 :disabled="language===globalSetting['Abp.Localization.DefaultLanguage'].value"
               />
             </el-select>
-            <!-- <el-input
-              v-model="globalSetting['Abp.Localization.DefaultLanguage'].value"
-              :placeholder="globalSetting['Abp.Localization.DefaultLanguage'].description"
-              @input="(value) => handleSettingValueChanged('Abp.Localization.DefaultLanguage', value)"
-            /> -->
+          </el-form-item>
+          <el-form-item
+            v-if="hasSettingExistsed('Abp.Timing.TimeZone')"
+            prop="Abp.Timing.TimeZone'].value"
+          >
+            <el-popover
+              ref="TimeZone"
+              trigger="hover"
+              :title="globalSetting['Abp.Timing.TimeZone'].displayName"
+              :content="globalSetting['Abp.Timing.TimeZone'].description"
+            />
+            <span
+              slot="label"
+              v-popover:TimeZone
+            >{{ globalSetting['Abp.Timing.TimeZone'].displayName }}</span>
+            <el-input
+              v-model="globalSetting['Abp.Timing.TimeZone'].value"
+              :placeholder="globalSetting['Abp.Timing.TimeZone'].description"
+              @input="(value) => handleSettingValueChanged('Abp.Timing.TimeZone', value)"
+            />
           </el-form-item>
         </el-tab-pane>
         <el-tab-pane
-          v-if="allowIdentitySetting"
           :label="$t('settings.passwordSecurity')"
         >
-          <el-form-item :label="globalSetting['Abp.Identity.Password.RequiredLength'].displayName">
+          <el-form-item
+            v-if="hasSettingExistsed('Abp.Identity.Password.RequiredLength')"
+          >
+            <el-popover
+              ref="PasswordRequiredLength"
+              trigger="hover"
+              :title="globalSetting['Abp.Identity.Password.RequiredLength'].displayName"
+              :content="globalSetting['Abp.Identity.Password.RequiredLength'].description"
+            />
+            <span
+              slot="label"
+              v-popover:PasswordRequiredLength
+            >{{ globalSetting['Abp.Identity.Password.RequiredLength'].displayName }}</span>
             <el-input
               v-model="globalSetting['Abp.Identity.Password.RequiredLength'].value"
               :placeholder="globalSetting['Abp.Identity.Password.RequiredLength'].description"
@@ -44,7 +81,19 @@
               @input="(value) => handleSettingValueChanged('Abp.Identity.Password.RequiredLength', value)"
             />
           </el-form-item>
-          <el-form-item :label="globalSetting['Abp.Identity.Password.RequiredUniqueChars'].displayName">
+          <el-form-item
+            v-if="hasSettingExistsed('Abp.Identity.Password.RequiredUniqueChars')"
+          >
+            <el-popover
+              ref="PasswordRequiredUniqueChars"
+              trigger="hover"
+              :title="globalSetting['Abp.Identity.Password.RequiredUniqueChars'].displayName"
+              :content="globalSetting['Abp.Identity.Password.RequiredUniqueChars'].description"
+            />
+            <span
+              slot="label"
+              v-popover:PasswordRequiredUniqueChars
+            >{{ globalSetting['Abp.Identity.Password.RequiredUniqueChars'].displayName }}</span>
             <el-input
               v-model="globalSetting['Abp.Identity.Password.RequiredUniqueChars'].value"
               type="number"
@@ -53,7 +102,19 @@
           </el-form-item>
           <el-row>
             <el-col :span="8">
-              <el-form-item :label="globalSetting['Abp.Identity.Password.RequireNonAlphanumeric'].displayName">
+              <el-form-item
+                v-if="hasSettingExistsed('Abp.Identity.Password.RequireNonAlphanumeric')"
+              >
+                <el-popover
+                  ref="PasswordRequireNonAlphanumeric"
+                  trigger="hover"
+                  :title="globalSetting['Abp.Identity.Password.RequireNonAlphanumeric'].displayName"
+                  :content="globalSetting['Abp.Identity.Password.RequireNonAlphanumeric'].description"
+                />
+                <span
+                  slot="label"
+                  v-popover:PasswordRequireNonAlphanumeric
+                >{{ globalSetting['Abp.Identity.Password.RequireNonAlphanumeric'].displayName }}</span>
                 <el-switch
                   v-model="globalSetting['Abp.Identity.Password.RequireNonAlphanumeric'].value"
                   @input="(value) => handleSettingValueChanged('Abp.Identity.Password.RequireNonAlphanumeric', value)"
@@ -61,7 +122,19 @@
               </el-form-item>
             </el-col>
             <el-col :span="8">
-              <el-form-item :label="globalSetting['Abp.Identity.Password.RequireLowercase'].displayName">
+              <el-form-item
+                v-if="hasSettingExistsed('Abp.Identity.Password.RequireLowercase')"
+              >
+                <el-popover
+                  ref="PasswordRequireLowercase"
+                  trigger="hover"
+                  :title="globalSetting['Abp.Identity.Password.RequireLowercase'].displayName"
+                  :content="globalSetting['Abp.Identity.Password.RequireLowercase'].description"
+                />
+                <span
+                  slot="label"
+                  v-popover:PasswordRequireLowercase
+                >{{ globalSetting['Abp.Identity.Password.RequireLowercase'].displayName }}</span>
                 <el-switch
                   v-model="globalSetting['Abp.Identity.Password.RequireLowercase'].value"
                   @input="(value) => handleSettingValueChanged('Abp.Identity.Password.RequireLowercase', value)"
@@ -71,7 +144,19 @@
           </el-row>
           <el-row>
             <el-col :span="8">
-              <el-form-item :label="globalSetting['Abp.Identity.Password.RequireUppercase'].displayName">
+              <el-form-item
+                v-if="hasSettingExistsed('Abp.Identity.Password.RequireUppercase')"
+              >
+                <el-popover
+                  ref="PasswordRequireUppercase"
+                  trigger="hover"
+                  :title="globalSetting['Abp.Identity.Password.RequireUppercase'].displayName"
+                  :content="globalSetting['Abp.Identity.Password.RequireUppercase'].description"
+                />
+                <span
+                  slot="label"
+                  v-popover:PasswordRequireUppercase
+                >{{ globalSetting['Abp.Identity.Password.RequireUppercase'].displayName }}</span>
                 <el-switch
                   v-model="globalSetting['Abp.Identity.Password.RequireUppercase'].value"
                   @input="(value) => handleSettingValueChanged('Abp.Identity.Password.RequireUppercase', value)"
@@ -79,20 +164,56 @@
               </el-form-item>
             </el-col>
             <el-col :span="8">
-              <el-form-item :label="globalSetting['Abp.Identity.Password.RequireDigit'].displayName">
+              <el-form-item
+                v-if="hasSettingExistsed('Abp.Identity.Password.RequireDigit')"
+              >
+                <el-popover
+                  ref="PasswordRequireDigit"
+                  trigger="hover"
+                  :title="globalSetting['Abp.Identity.Password.RequireDigit'].displayName"
+                  :content="globalSetting['Abp.Identity.Password.RequireDigit'].description"
+                />
+                <span
+                  slot="label"
+                  v-popover:PasswordRequireDigit
+                >{{ globalSetting['Abp.Identity.Password.RequireDigit'].displayName }}</span>
                 <el-switch
                   v-model="globalSetting['Abp.Identity.Password.RequireDigit'].value"
                   @input="(value) => handleSettingValueChanged('Abp.Identity.Password.RequireDigit', value)"
                 />
               </el-form-item>
             </el-col>
-            <el-form-item :label="globalSetting['Abp.Identity.Lockout.AllowedForNewUsers'].displayName">
+            <el-form-item
+              v-if="hasSettingExistsed('Abp.Identity.Lockout.AllowedForNewUsers')"
+            >
+              <el-popover
+                ref="LockoutAllowedForNewUsers"
+                trigger="hover"
+                :title="globalSetting['Abp.Identity.Lockout.AllowedForNewUsers'].displayName"
+                :content="globalSetting['Abp.Identity.Lockout.AllowedForNewUsers'].description"
+              />
+              <span
+                slot="label"
+                v-popover:LockoutAllowedForNewUsers
+              >{{ globalSetting['Abp.Identity.Lockout.AllowedForNewUsers'].displayName }}</span>
               <el-switch
                 v-model="globalSetting['Abp.Identity.Lockout.AllowedForNewUsers'].value"
                 @input="(value) => handleSettingValueChanged('Abp.Identity.Lockout.AllowedForNewUsers', value)"
               />
             </el-form-item>
-            <el-form-item :label="globalSetting['Abp.Identity.Lockout.MaxFailedAccessAttempts'].displayName">
+            <el-form-item
+              v-if="hasSettingExistsed('Abp.Identity.Lockout.MaxFailedAccessAttempts')"
+            >
+              <el-popover
+                ref="LockoutMaxFailedAccessAttempts"
+                trigger="hover"
+                :title="globalSetting['Abp.Identity.Lockout.MaxFailedAccessAttempts'].displayName"
+                :content="globalSetting['Abp.Identity.Lockout.MaxFailedAccessAttempts'].description"
+              />
+              <span
+                slot="label"
+                v-popover:LockoutMaxFailedAccessAttempts
+              >{{ globalSetting['Abp.Identity.Lockout.MaxFailedAccessAttempts'].displayName }}</span>
               <el-input
                 v-model="globalSetting['Abp.Identity.Lockout.MaxFailedAccessAttempts'].value"
                 :placeholder="globalSetting['Abp.Identity.Lockout.MaxFailedAccessAttempts'].description"
@@ -100,7 +221,19 @@
                 @input="(value) => handleSettingValueChanged('Abp.Identity.Lockout.MaxFailedAccessAttempts', value)"
               />
             </el-form-item>
-            <el-form-item :label="globalSetting['Abp.Identity.Lockout.LockoutDuration'].displayName">
+            <el-form-item
+              v-if="hasSettingExistsed('Abp.Identity.Lockout.LockoutDuration')"
+            >
+              <el-popover
+                ref="LockoutLockoutDuration"
+                trigger="hover"
+                :title="globalSetting['Abp.Identity.Lockout.LockoutDuration'].displayName"
+                :content="globalSetting['Abp.Identity.Lockout.LockoutDuration'].description"
+              />
+              <span
+                slot="label"
+                v-popover:LockoutLockoutDuration
+              >{{ globalSetting['Abp.Identity.Lockout.LockoutDuration'].displayName }}</span>
               <el-input
                 v-model="globalSetting['Abp.Identity.Lockout.LockoutDuration'].value"
                 :placeholder="globalSetting['Abp.Identity.Lockout.LockoutDuration'].description"
@@ -111,12 +244,23 @@
           </el-row>
         </el-tab-pane>
         <el-tab-pane
-          v-if="allowAccountSetting"
           :label="$t('settings.userAccount')"
         >
           <el-row>
             <el-col :span="8">
-              <el-form-item :label="globalSetting['Abp.Identity.SignIn.RequireConfirmedEmail'].displayName">
+              <el-form-item
+                v-if="hasSettingExistsed('Abp.Identity.SignIn.RequireConfirmedEmail')"
+              >
+                <el-popover
+                  ref="SignInRequireConfirmedEmail"
+                  trigger="hover"
+                  :title="globalSetting['Abp.Identity.SignIn.RequireConfirmedEmail'].displayName"
+                  :content="globalSetting['Abp.Identity.SignIn.RequireConfirmedEmail'].description"
+                />
+                <span
+                  slot="label"
+                  v-popover:SignInRequireConfirmedEmail
+                >{{ globalSetting['Abp.Identity.SignIn.RequireConfirmedEmail'].displayName }}</span>
                 <el-switch
                   v-model="globalSetting['Abp.Identity.SignIn.RequireConfirmedEmail'].value"
                   @input="(value) => handleSettingValueChanged('Abp.Identity.SignIn.RequireConfirmedEmail', value)"
@@ -124,7 +268,19 @@
               </el-form-item>
             </el-col>
             <el-col :span="8">
-              <el-form-item :label="globalSetting['Abp.Identity.SignIn.EnablePhoneNumberConfirmation'].displayName">
+              <el-form-item
+                v-if="hasSettingExistsed('Abp.Identity.SignIn.EnablePhoneNumberConfirmation')"
+              >
+                <el-popover
+                  ref="SignInEnablePhoneNumberConfirmation"
+                  trigger="hover"
+                  :title="globalSetting['Abp.Identity.SignIn.EnablePhoneNumberConfirmation'].displayName"
+                  :content="globalSetting['Abp.Identity.SignIn.EnablePhoneNumberConfirmation'].description"
+                />
+                <span
+                  slot="label"
+                  v-popover:SignInEnablePhoneNumberConfirmation
+                >{{ globalSetting['Abp.Identity.SignIn.EnablePhoneNumberConfirmation'].displayName }}</span>
                 <el-switch
                   v-model="globalSetting['Abp.Identity.SignIn.EnablePhoneNumberConfirmation'].value"
                   @input="(value) => handleSettingValueChanged('Abp.Identity.SignIn.EnablePhoneNumberConfirmation', value)"
@@ -134,7 +290,19 @@
           </el-row>
           <el-row>
             <el-col :span="8">
-              <el-form-item :label="globalSetting['Abp.Identity.SignIn.RequireConfirmedPhoneNumber'].displayName">
+              <el-form-item
+                v-if="hasSettingExistsed('Abp.Identity.SignIn.RequireConfirmedPhoneNumber')"
+              >
+                <el-popover
+                  ref="SignInRequireConfirmedPhoneNumber"
+                  trigger="hover"
+                  :title="globalSetting['Abp.Identity.SignIn.RequireConfirmedPhoneNumber'].displayName"
+                  :content="globalSetting['Abp.Identity.SignIn.RequireConfirmedPhoneNumber'].description"
+                />
+                <span
+                  slot="label"
+                  v-popover:SignInRequireConfirmedPhoneNumber
+                >{{ globalSetting['Abp.Identity.SignIn.RequireConfirmedPhoneNumber'].displayName }}</span>
                 <el-switch
                   v-model="globalSetting['Abp.Identity.SignIn.RequireConfirmedPhoneNumber'].value"
                   @input="(value) => handleSettingValueChanged('Abp.Identity.SignIn.RequireConfirmedPhoneNumber', value)"
@@ -142,7 +310,19 @@
               </el-form-item>
             </el-col>
             <el-col :span="8">
-              <el-form-item :label="globalSetting['Abp.Identity.User.IsUserNameUpdateEnabled'].displayName">
+              <el-form-item
+                v-if="hasSettingExistsed('Abp.Identity.User.IsUserNameUpdateEnabled')"
+              >
+                <el-popover
+                  ref="UserIsUserNameUpdateEnabled"
+                  trigger="hover"
+                  :title="globalSetting['Abp.Identity.User.IsUserNameUpdateEnabled'].displayName"
+                  :content="globalSetting['Abp.Identity.User.IsUserNameUpdateEnabled'].description"
+                />
+                <span
+                  slot="label"
+                  v-popover:UserIsUserNameUpdateEnabled
+                >{{ globalSetting['Abp.Identity.User.IsUserNameUpdateEnabled'].displayName }}</span>
                 <el-switch
                   v-model="globalSetting['Abp.Identity.User.IsUserNameUpdateEnabled'].value"
                   @input="(value) => handleSettingValueChanged('Abp.Identity.User.IsUserNameUpdateEnabled', value)"
@@ -150,27 +330,113 @@
               </el-form-item>
             </el-col>
           </el-row>
-          <el-form-item :label="globalSetting['Abp.Identity.User.IsEmailUpdateEnabled'].displayName">
+          <el-form-item
+            v-if="hasSettingExistsed('Abp.Identity.User.IsEmailUpdateEnabled')"
+          >
+            <el-popover
+              ref="UserIsEmailUpdateEnabled"
+              trigger="hover"
+              :title="globalSetting['Abp.Identity.User.IsEmailUpdateEnabled'].displayName"
+              :content="globalSetting['Abp.Identity.User.IsEmailUpdateEnabled'].description"
+            />
+            <span
+              slot="label"
+              v-popover:UserIsEmailUpdateEnabled
+            >{{ globalSetting['Abp.Identity.User.IsEmailUpdateEnabled'].displayName }}</span>
             <el-switch
               v-model="globalSetting['Abp.Identity.User.IsEmailUpdateEnabled'].value"
               @input="(value) => handleSettingValueChanged('Abp.Identity.User.IsEmailUpdateEnabled', value)"
             />
           </el-form-item>
-          <el-form-item :label="globalSetting['Abp.Account.SmsRegisterTemplateCode'].displayName">
+          <el-form-item
+            v-if="hasSettingExistsed('Abp.Identity.OrganizationUnit.MaxUserMembershipCount')"
+          >
+            <el-popover
+              ref="OrganizationUnitMaxUserMembershipCount"
+              trigger="hover"
+              :title="globalSetting['Abp.Identity.OrganizationUnit.MaxUserMembershipCount'].displayName"
+              :content="globalSetting['Abp.Identity.OrganizationUnit.MaxUserMembershipCount'].description"
+            />
+            <span
+              slot="label"
+              v-popover:OrganizationUnitMaxUserMembershipCount
+            >{{ globalSetting['Abp.Identity.OrganizationUnit.MaxUserMembershipCount'].displayName }}</span>
+            <el-input
+              v-model="globalSetting['Abp.Identity.OrganizationUnit.MaxUserMembershipCount'].value"
+              :placeholder="globalSetting['Abp.Identity.OrganizationUnit.MaxUserMembershipCount'].description"
+              @input="(value) => handleSettingValueChanged('Abp.Identity.OrganizationUnit.MaxUserMembershipCount', value)"
+            />
+          </el-form-item>
+          <el-form-item
+            v-if="hasSettingExistsed('Abp.Account.SmsRegisterTemplateCode')"
+          >
+            <el-popover
+              ref="AccountSmsRegisterTemplateCode"
+              trigger="hover"
+              :title="globalSetting['Abp.Account.SmsRegisterTemplateCode'].displayName"
+              :content="globalSetting['Abp.Account.SmsRegisterTemplateCode'].description"
+            />
+            <span
+              slot="label"
+              v-popover:AccountSmsRegisterTemplateCode
+            >{{ globalSetting['Abp.Account.SmsRegisterTemplateCode'].displayName }}</span>
             <el-input
               v-model="globalSetting['Abp.Account.SmsRegisterTemplateCode'].value"
               :placeholder="globalSetting['Abp.Account.SmsRegisterTemplateCode'].description"
               @input="(value) => handleSettingValueChanged('Abp.Account.SmsRegisterTemplateCode', value)"
             />
           </el-form-item>
-          <el-form-item :label="globalSetting['Abp.Account.SmsSigninTemplateCode'].displayName">
+          <el-form-item
+            v-if="hasSettingExistsed('Abp.Account.SmsSigninTemplateCode')"
+          >
+            <el-popover
+              ref="AccountSmsSigninTemplateCode"
+              trigger="hover"
+              :title="globalSetting['Abp.Account.SmsSigninTemplateCode'].displayName"
+              :content="globalSetting['Abp.Account.SmsSigninTemplateCode'].description"
+            />
+            <span
+              slot="label"
+              v-popover:AccountSmsSigninTemplateCode
+            >{{ globalSetting['Abp.Account.SmsSigninTemplateCode'].displayName }}</span>
             <el-input
               v-model="globalSetting['Abp.Account.SmsSigninTemplateCode'].value"
               :placeholder="globalSetting['Abp.Account.SmsSigninTemplateCode'].description"
               @input="(value) => handleSettingValueChanged('Abp.Account.SmsSigninTemplateCode', value)"
             />
           </el-form-item>
-          <el-form-item :label="globalSetting['Abp.Account.PhoneVerifyCodeExpiration'].displayName">
+          <el-form-item
+            v-if="hasSettingExistsed('Abp.Account.SmsResetPasswordTemplateCode')"
+          >
+            <el-popover
+              ref="AccountSmsResetPasswordTemplateCode"
+              trigger="hover"
+              :title="globalSetting['Abp.Account.SmsResetPasswordTemplateCode'].displayName"
+              :content="globalSetting['Abp.Account.SmsResetPasswordTemplateCode'].description"
+            />
+            <span
+              slot="label"
+              v-popover:AccountSmsResetPasswordTemplateCode
+            >{{ globalSetting['Abp.Account.SmsResetPasswordTemplateCode'].displayName }}</span>
+            <el-input
+              v-model="globalSetting['Abp.Account.SmsResetPasswordTemplateCode'].value"
+              :placeholder="globalSetting['Abp.Account.SmsResetPasswordTemplateCode'].description"
+              @input="(value) => handleSettingValueChanged('Abp.Account.SmsResetPasswordTemplateCode', value)"
+            />
+          </el-form-item>
+          <el-form-item
+            v-if="hasSettingExistsed('Abp.Account.PhoneVerifyCodeExpiration')"
+          >
+            <el-popover
+              ref="AccountPhoneVerifyCodeExpiration"
+              trigger="hover"
+              :title="globalSetting['Abp.Account.PhoneVerifyCodeExpiration'].displayName"
+              :content="globalSetting['Abp.Account.PhoneVerifyCodeExpiration'].description"
+            />
+            <span
+              slot="label"
+              v-popover:AccountPhoneVerifyCodeExpiration
+            >{{ globalSetting['Abp.Account.PhoneVerifyCodeExpiration'].displayName }}</span>
             <el-input
               v-model="globalSetting['Abp.Account.PhoneVerifyCodeExpiration'].value"
               :placeholder="globalSetting['Abp.Account.PhoneVerifyCodeExpiration'].description"
@@ -179,7 +445,19 @@
           </el-form-item>
           <el-row>
             <el-col :span="8">
-              <el-form-item :label="globalSetting['Abp.Account.IsSelfRegistrationEnabled'].displayName">
+              <el-form-item
+                v-if="hasSettingExistsed('Abp.Account.IsSelfRegistrationEnabled')"
+              >
+                <el-popover
+                  ref="AccountIsSelfRegistrationEnabled"
+                  trigger="hover"
+                  :title="globalSetting['Abp.Account.IsSelfRegistrationEnabled'].displayName"
+                  :content="globalSetting['Abp.Account.IsSelfRegistrationEnabled'].description"
+                />
+                <span
+                  slot="label"
+                  v-popover:AccountIsSelfRegistrationEnabled
+                >{{ globalSetting['Abp.Account.IsSelfRegistrationEnabled'].displayName }}</span>
                 <el-switch
                   v-model="globalSetting['Abp.Account.IsSelfRegistrationEnabled'].value"
                   @input="(value) => handleSettingValueChanged('Abp.Account.IsSelfRegistrationEnabled', value)"
@@ -187,7 +465,19 @@
               </el-form-item>
             </el-col>
             <el-col :span="12">
-              <el-form-item :label="globalSetting['Abp.Account.EnableLocalLogin'].displayName">
+              <el-form-item
+                v-if="hasSettingExistsed('Abp.Account.EnableLocalLogin')"
+              >
+                <el-popover
+                  ref="AccountEnableLocalLogin"
+                  trigger="hover"
+                  :title="globalSetting['Abp.Account.EnableLocalLogin'].displayName"
+                  :content="globalSetting['Abp.Account.EnableLocalLogin'].description"
+                />
+                <span
+                  slot="label"
+                  v-popover:AccountEnableLocalLogin
+                >{{ globalSetting['Abp.Account.EnableLocalLogin'].displayName }}</span>
                 <el-switch
                   v-model="globalSetting['Abp.Account.EnableLocalLogin'].value"
                   @input="(value) => handleSettingValueChanged('Abp.Account.EnableLocalLogin', value)"
@@ -233,15 +523,8 @@ export default class extends Vue {
     return languages
   }
 
-  get allowIdentitySetting() {
-    if (this.globalSetting['Abp.Identity.Password.RequiredLength']) {
-      return true
-    }
-    return false
-  }
-
-  get allowAccountSetting() {
-    if (this.globalSetting['Abp.Account.EnableLocalLogin']) {
+  private hasSettingExistsed(key: string) {
+    if (this.globalSetting[key]) {
       return true
     }
     return false
@@ -276,6 +559,7 @@ export default class extends Vue {
         this.globalSetting[setting.name] = setting
       })
       this.globalSettingLoaded = true
+      this.$forceUpdate()
     })
   }
 
diff --git a/vueJs/src/views/login/index.vue b/vueJs/src/views/login/index.vue
index f70baa313..d38dbb28f 100644
--- a/vueJs/src/views/login/index.vue
+++ b/vueJs/src/views/login/index.vue
@@ -122,7 +122,6 @@
         </el-col>
         <el-col :span="12">
           <el-form-item
-            v-show="selfRegistration"
             label-width="100px"
             :label="$t('login.forgotPassword')"
           >
@@ -346,7 +345,8 @@ export default class extends Vue {
 .login-container {
     width: 100%;
     height: 100%;
-    overflow: hidden;
+    overflow-x: hidden;
+    overflow-y: auto;
     background-color: $loginBg;
 
     .svg-container {
diff --git a/vueJs/src/views/register/index.vue b/vueJs/src/views/register/index.vue
index 0c3e0155a..aff866bbd 100644
--- a/vueJs/src/views/register/index.vue
+++ b/vueJs/src/views/register/index.vue
@@ -285,7 +285,8 @@ export default class extends Vue {
 .login-container {
     width: 100%;
     height: 100%;
-    overflow: hidden;
+    overflow-x: hidden;
+    overflow-y: auto;
     background-color: $loginBg;
 
     .svg-container {
diff --git a/vueJs/src/views/reset-password/index.vue b/vueJs/src/views/reset-password/index.vue
index e3aebc090..65e422f23 100644
--- a/vueJs/src/views/reset-password/index.vue
+++ b/vueJs/src/views/reset-password/index.vue
@@ -265,7 +265,8 @@ export default class extends Vue {
 .login-container {
     width: 100%;
     height: 100%;
-    overflow: hidden;
+    overflow-x: hidden;
+    overflow-y: auto;
     background-color: $loginBg;
 
     .svg-container {