From 351c27c4206536491e2e8e57dcff567f0a56d541 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A6=99=E7=A0=81=E7=94=9F=E8=8A=B1?= <18523774412@qq.com>
Date: Sat, 12 Mar 2022 23:24:46 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E6=96=B0=E5=A2=9E=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E5=91=98=E8=B5=84=E6=96=99store?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/admin/controller/Dashboard.php            |  3 +-
 app/admin/lang/en.php                         |  2 ++
 app/admin/lang/zh-cn.php                      |  2 ++
 app/admin/library/Auth.php                    |  2 +-
 .../layouts/backend/components/navMenus.vue   | 30 ++++++++++++++-----
 web/src/stores/adminInfo.ts                   | 19 ++++++++++++
 web/src/stores/constant/cacheKey.ts           |  1 -
 web/src/stores/interface/index.ts             |  9 ++++++
 web/src/utils/common.ts                       | 17 ++---------
 web/src/views/backend/dashboard.vue           |  7 ++---
 web/src/views/backend/login.vue               | 14 +++++----
 web/src/views/backend/routine/adminInfo.vue   |  7 ++++-
 12 files changed, 77 insertions(+), 36 deletions(-)
 create mode 100644 web/src/stores/adminInfo.ts

diff --git a/app/admin/controller/Dashboard.php b/app/admin/controller/Dashboard.php
index 3965360e..b099e75d 100644
--- a/app/admin/controller/Dashboard.php
+++ b/app/admin/controller/Dashboard.php
@@ -10,8 +10,7 @@ class Dashboard extends Backend
     public function dashboard()
     {
         $this->success('', [
-            'adminName' => $this->auth->nickname,
-            'remark'    => get_route_remark()
+            'remark' => get_route_remark()
         ]);
     }
 }
\ No newline at end of file
diff --git a/app/admin/lang/en.php b/app/admin/lang/en.php
index 72fa291c..9f4f43f8 100644
--- a/app/admin/lang/en.php
+++ b/app/admin/lang/en.php
@@ -1,5 +1,7 @@
 <?php
 return [
+    'Please login first'                                                                  => 'Please login first',
+    'You have no permission'                                                              => 'You have no permission',
     'Username'                                                                            => 'User Name',
     'Password'                                                                            => 'Password',
     'Nickname'                                                                            => 'Nickname',
diff --git a/app/admin/lang/zh-cn.php b/app/admin/lang/zh-cn.php
index 8accb706..cd99efa3 100644
--- a/app/admin/lang/zh-cn.php
+++ b/app/admin/lang/zh-cn.php
@@ -1,5 +1,7 @@
 <?php
 return [
+    'Please login first'                                                                  => '请先登录！',
+    'You have no permission'                                                              => '没有权限操作！',
     'Username'                                                                            => '用户名',
     'Password'                                                                            => '密码',
     'Nickname'                                                                            => '昵称',
diff --git a/app/admin/library/Auth.php b/app/admin/library/Auth.php
index 54bd20b0..f54943c4 100644
--- a/app/admin/library/Auth.php
+++ b/app/admin/library/Auth.php
@@ -37,7 +37,7 @@ class Auth extends \ba\Auth
     /**
      * @var string[] 允许输出的字段
      */
-    protected $allowFields = ['id', 'username', 'nickname', 'avatar'];
+    protected $allowFields = ['id', 'username', 'nickname', 'avatar', 'lastlogintime'];
 
     public function __construct()
     {
diff --git a/web/src/layouts/backend/components/navMenus.vue b/web/src/layouts/backend/components/navMenus.vue
index b4a34491..a42ad275 100644
--- a/web/src/layouts/backend/components/navMenus.vue
+++ b/web/src/layouts/backend/components/navMenus.vue
@@ -41,24 +41,24 @@
             <template #reference>
                 <div class="admin-info" :class="state.currentNavMenu == 'adminInfo' ? 'hover' : ''">
                     <el-avatar :size="25" fit="fill">
-                        <img src="~assets/avatar.png" alt="" />
+                        <img :src="adminInfo.avatar" alt="" />
                     </el-avatar>
-                    <div class="admin-name">Admin</div>
+                    <div class="admin-name">{{ adminInfo.nickname }}</div>
                 </div>
             </template>
             <div>
                 <div class="admin-info-base">
                     <el-avatar :size="70" fit="fill">
-                        <img src="~assets/avatar.png" alt="" />
+                        <img :src="adminInfo.avatar" alt="" />
                     </el-avatar>
                     <div class="admin-info-other">
-                        <div class="admin-info-name">Admin</div>
-                        <div class="admin-info-lasttime">2022-01-23 18:52</div>
+                        <div class="admin-info-name">{{ adminInfo.nickname }}</div>
+                        <div class="admin-info-lasttime">{{ adminInfo.lastlogintime }}</div>
                     </div>
                 </div>
                 <div class="admin-info-footer">
-                    <el-button type="primary" plain>个人资料</el-button>
-                    <el-button type="danger" plain>注销</el-button>
+                    <el-button @click="onAdminInfo" type="primary" plain>个人资料</el-button>
+                    <el-button @click="onLogout" type="danger" plain>注销</el-button>
                 </div>
             </div>
         </el-popover>
@@ -77,9 +77,16 @@ import { useConfig } from '/@/stores/config'
 import { ElMessage } from 'element-plus'
 import { useI18n } from 'vue-i18n'
 import Config from './config.vue'
+import { useAdminInfo } from '/@/stores/adminInfo'
+import { Local } from '/@/utils/storage'
+import { ADMIN_INFO } from '/@/stores/constant/cacheKey'
+import router from '/@/router'
+import { routePush } from '/@/utils/common'
+import { RouteRecordRaw } from 'vue-router'
 
 const { t } = useI18n()
 
+const adminInfo = useAdminInfo()
 const configStore = useConfig()
 
 const state = reactive({
@@ -105,6 +112,15 @@ const onFullScreen = () => {
         state.isFullScreen = screenfull.isFullscreen
     })
 }
+
+const onAdminInfo = () => {
+    routePush({ name: 'routine/adminInfo' } as RouteRecordRaw)
+}
+
+const onLogout = () => {
+    Local.remove(ADMIN_INFO)
+    router.go(0)
+}
 </script>
 
 <style scoped lang="scss">
diff --git a/web/src/stores/adminInfo.ts b/web/src/stores/adminInfo.ts
new file mode 100644
index 00000000..9a69e59d
--- /dev/null
+++ b/web/src/stores/adminInfo.ts
@@ -0,0 +1,19 @@
+import { defineStore } from 'pinia'
+import { ADMIN_INFO } from '/@/stores/constant/cacheKey'
+import { AdminInfo } from '/@/stores/interface'
+
+export const useAdminInfo = defineStore('adminInfo', {
+    state: (): AdminInfo => {
+        return {
+            id: 0,
+            username: '',
+            nickname: '',
+            avatar: '',
+            lastlogintime: '',
+            token: ''
+        }
+    },
+    persist: {
+        key: ADMIN_INFO,
+    },
+})
diff --git a/web/src/stores/constant/cacheKey.ts b/web/src/stores/constant/cacheKey.ts
index a31c79c3..40f38b86 100644
--- a/web/src/stores/constant/cacheKey.ts
+++ b/web/src/stores/constant/cacheKey.ts
@@ -1,6 +1,5 @@
 // 本地缓存Key
 export const ADMIN_INFO = 'adminInfo'
-export const ADMIN_TOKEN = 'baToken'
 export const STORE_CONFIG = 'storeConfig'
 export const STORE_TAB_VIEW_CONFIG = 'storeTabViewConfig'
 export const WORKING_TIME = 'workingTime'
diff --git a/web/src/stores/interface/index.ts b/web/src/stores/interface/index.ts
index 6894833c..26b06c9b 100644
--- a/web/src/stores/interface/index.ts
+++ b/web/src/stores/interface/index.ts
@@ -41,3 +41,12 @@ export interface NavTabs {
     tabFullScreen: Boolean
     tabsViewRoutes: Array<viewMenu>
 }
+
+export interface AdminInfo {
+    id: number
+    username: string
+    nickname: string
+    avatar: string
+    lastlogintime: string
+    token: string
+}
diff --git a/web/src/utils/common.ts b/web/src/utils/common.ts
index 087ed20b..a58645ab 100644
--- a/web/src/utils/common.ts
+++ b/web/src/utils/common.ts
@@ -4,11 +4,10 @@ import * as elIcons from '@element-plus/icons-vue'
 import router from '/@/router/index'
 import Icon from '/@/components/icon/index.vue'
 import { useNavTabs } from '/@/stores/navTabs'
-import { Local } from '/@/utils/storage'
-import { ADMIN_TOKEN } from '/@/stores/constant/cacheKey'
 import { adminBaseRoute } from '/@/router/static'
 import { ElForm, ElNotification } from 'element-plus'
 import type { viewMenu } from '/@/stores/interface'
+import { useAdminInfo } from '/@/stores/adminInfo'
 import { NavigationFailureType, isNavigationFailure, RouteRecordRaw } from 'vue-router'
 
 export const clickMenu = (menu: viewMenu) => {
@@ -143,19 +142,9 @@ export function randomNum(min: number, max: number) {
     }
 }
 
-/**
- * 生成随机位数的随机字符串
- */
-export function randomStr() {
-    return new Date().getTime().toString() + randomNum(1, 50000).toString()
-}
-
-export function setAdminToken(value: string) {
-    Local.set(ADMIN_TOKEN, value)
-}
-
 export function getAdminToken() {
-    return Local.get(ADMIN_TOKEN) || ''
+    const adminInfo = useAdminInfo()
+    return adminInfo.token
 }
 
 export const pageTitle = (name: string): string => {
diff --git a/web/src/views/backend/dashboard.vue b/web/src/views/backend/dashboard.vue
index 77399b73..4e85c789 100644
--- a/web/src/views/backend/dashboard.vue
+++ b/web/src/views/backend/dashboard.vue
@@ -6,7 +6,7 @@
                     <div class="welcome suspension">
                         <img class="welcome-img" :src="headerSvg" alt="" />
                         <div class="welcome-text">
-                            <div class="welcome-title">{{ state.adminName }}{{ t('dashboard.comma') + state.greetings }}</div>
+                            <div class="welcome-title">{{ adminInfo.nickname }}{{ t('dashboard.comma') + state.greetings }}</div>
                             <div class="welcome-note">{{ t(state.remark) }}</div>
                         </div>
                     </div>
@@ -354,6 +354,7 @@ import { useTemplateRefsList } from '@vueuse/core'
 import { dashboard } from '/@/api/backend/dashboard'
 import { useI18n } from 'vue-i18n'
 import { Local } from '/@/utils/storage'
+import { useAdminInfo } from '/@/stores/adminInfo'
 import { WORKING_TIME } from '/@/stores/constant/cacheKey'
 import 'element-plus/theme-chalk/display.css'
 var workTimer: NodeJS.Timer
@@ -361,18 +362,17 @@ var workTimer: NodeJS.Timer
 const d = new Date()
 const { t } = useI18n()
 const navTabs = useNavTabs()
+const adminInfo = useAdminInfo()
 const chartRefs = useTemplateRefsList<HTMLDivElement>()
 
 const state: {
     charts: any[]
-    adminName: string
     greetings: string
     remark: string
     workingTimeFormat: string
     pauseWork: boolean
 } = reactive({
     charts: [],
-    adminName: t('dashboard.Loading'),
     greetings: t('dashboard.Hello'),
     remark: 'dashboard.Loading',
     workingTimeFormat: '',
@@ -381,7 +381,6 @@ const state: {
 
 dashboard().then((res) => {
     state.remark = res.data.remark
-    state.adminName = res.data.adminName
 })
 
 const countUpFun = (id: string) => {
diff --git a/web/src/views/backend/login.vue b/web/src/views/backend/login.vue
index d271529b..fccd8c1c 100644
--- a/web/src/views/backend/login.vue
+++ b/web/src/views/backend/login.vue
@@ -23,7 +23,7 @@
                 <div class="form">
                     <img class="profile-avatar" src="~assets/avatar.png" alt="" />
                     <div class="content">
-                        <el-form ref="formRef" :rules="rules" size="large" :model="form">
+                        <el-form @keyup.enter="onSubmit(formRef)" ref="formRef" :rules="rules" size="large" :model="form">
                             <el-form-item prop="username">
                                 <el-input
                                     ref="username"
@@ -92,24 +92,27 @@ import type { ElForm } from 'element-plus'
 import { useI18n } from 'vue-i18n'
 import { editDefaultLang } from '/@/lang/index'
 import { useConfig } from '/@/stores/config'
+import { useAdminInfo } from '/@/stores/adminInfo'
 import { login } from '/@/api/backend'
 import { getUrl } from '/@/utils/axios'
 import { captchaUrl } from '/@/api/common'
-import { randomStr, setAdminToken } from '/@/utils/common'
+import { uuid } from '/@/utils/uuid'
 import { validatorPassword, validatorAccount } from '/@/utils/validate'
 import router from '/@/router'
 var timer: NodeJS.Timer
 
 const config = useConfig()
+const adminInfo = useAdminInfo()
 
 const state = reactive({
     showCaptcha: false,
-    captchaId: randomStr(),
+    captchaId: uuid(),
     captchaUrl: getUrl() + captchaUrl,
 })
 
 const onChangeCaptcha = () => {
-    state.captchaId = randomStr()
+    form.captcha = ''
+    state.captchaId = uuid()
 }
 
 const formRef = ref<InstanceType<typeof ElForm>>()
@@ -200,9 +203,8 @@ const onSubmit = (formEl: InstanceType<typeof ElForm> | undefined) => {
             form.captcha_id = state.captchaId
             login('post', form)
                 .then((res) => {
-                    onChangeCaptcha()
                     form.loading = false
-                    setAdminToken(res.data.userinfo.token)
+                    adminInfo.$state = res.data.userinfo
                     router.push({ name: res.data.routeName })
                 })
                 .catch((err) => {
diff --git a/web/src/views/backend/routine/adminInfo.vue b/web/src/views/backend/routine/adminInfo.vue
index a8b3d10a..2d05ef96 100644
--- a/web/src/views/backend/routine/adminInfo.vue
+++ b/web/src/views/backend/routine/adminInfo.vue
@@ -64,15 +64,18 @@
 import { ref, reactive } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { index, postData } from '/@/api/backend/routine/AdminInfo'
-import { ElForm, ElNotification } from 'element-plus'
+import { ElForm } from 'element-plus'
 import { onResetForm } from '/@/utils/common'
 import { uuid } from '/@/utils/uuid'
 import { validatorMobile, validatorPassword } from '/@/utils/validate'
 import { adminFileUpload } from '/@/api/common'
+import { useAdminInfo } from '/@/stores/adminInfo'
 
 const { t } = useI18n()
 const formRef = ref<InstanceType<typeof ElForm>>()
 
+const adminInfoStore = useAdminInfo()
+
 const state: {
     adminInfo: anyObj
     formKey: string
@@ -132,6 +135,7 @@ const onAvatarBeforeUpload = (file: any) => {
                 id: state.adminInfo.id,
                 avatar: res.data.file.url,
             }).then(() => {
+                adminInfoStore.avatar = res.data.file.fullurl
                 state.adminInfo.avatar = res.data.file.fullurl
             })
         }
@@ -149,6 +153,7 @@ const onSubmit = (formEl: InstanceType<typeof ElForm> | undefined) => {
             state.buttonLoading = true
             postData(data)
                 .then(() => {
+                    adminInfoStore.nickname = state.adminInfo.nickname
                     state.buttonLoading = false
                 })
                 .catch(() => {