Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Simoje丶
vue-vben-admin
提交
c8021ef3
V
vue-vben-admin
项目概览
Simoje丶
/
vue-vben-admin
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vue-vben-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
c8021ef3
编写于
11月 01, 2020
作者:
V
vben
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
chore: changed login cache from sessionStorage to LocalStorage
上级
4f98978e
变更
5
隐藏空白更改
内联
并排
Showing
5 changed file
with
87 addition
and
43 deletion
+87
-43
CHANGELOG.zh_CN.md
CHANGELOG.zh_CN.md
+4
-0
src/setup/ant-design-vue/index.ts
src/setup/ant-design-vue/index.ts
+3
-1
src/store/modules/user.ts
src/store/modules/user.ts
+7
-9
src/utils/helper/persistent.ts
src/utils/helper/persistent.ts
+10
-2
src/views/sys/login/Login.vue
src/views/sys/login/Login.vue
+63
-31
未找到文件。
CHANGELOG.zh_CN.md
浏览文件 @
c8021ef3
...
...
@@ -4,6 +4,10 @@
-
全局 loading 添加文本
### 🎫 Chores
-
登录缓存从 sessionStorage 改为 LocalStorage
### ⚡ Performance Improvements
-
Layout 界面布局样式调整
...
...
src/setup/ant-design-vue/index.ts
浏览文件 @
c8021ef3
...
...
@@ -2,7 +2,7 @@
import
type
{
App
}
from
'
vue
'
;
import
{
Form
,
Input
}
from
'
ant-design-vue
'
;
import
{
Form
,
Input
,
Row
,
Col
}
from
'
ant-design-vue
'
;
import
'
ant-design-vue/dist/antd.less
'
;
import
'
./spin
'
;
...
...
@@ -11,4 +11,6 @@ export function setupAntd(app: App<Element>) {
// 这两个组件在登录也就用。全局注册
app
.
use
(
Form
);
app
.
use
(
Input
);
app
.
use
(
Row
);
app
.
use
(
Col
);
}
src/store/modules/user.ts
浏览文件 @
c8021ef3
...
...
@@ -21,7 +21,7 @@ import { tabStore } from './tab';
import
{
loginApi
,
getUserInfoById
}
from
'
/@/api/sys/user
'
;
import
{
set
Session
,
getSession
,
clearSession
,
clearLocal
}
from
'
/@/utils/helper/persistent
'
;
import
{
set
Local
,
getLocal
,
clearSession
,
clearLocal
}
from
'
/@/utils/helper/persistent
'
;
// import { FULL_PAGE_NOT_FOUND_ROUTE } from '/@/router/constant';
export
type
UserInfo
=
Omit
<
GetUserInfoByUserIdModel
,
'
roles
'
>
;
...
...
@@ -40,17 +40,15 @@ class User extends VuexModule {
private
roleListState
:
RoleEnum
[]
=
[];
get
getUserInfoState
():
UserInfo
{
return
this
.
userInfoState
||
(
get
Session
(
USER_INFO_KEY
)
as
UserInfo
)
||
{};
return
this
.
userInfoState
||
(
get
Local
(
USER_INFO_KEY
)
as
UserInfo
)
||
{};
}
get
getTokenState
():
string
{
return
this
.
tokenState
||
(
get
Session
(
TOKEN_KEY
)
as
string
);
return
this
.
tokenState
||
(
get
Local
(
TOKEN_KEY
)
as
string
);
}
get
getRoleListState
():
RoleEnum
[]
{
return
this
.
roleListState
.
length
>
0
?
this
.
roleListState
:
(
getSession
(
ROLES_KEY
)
as
RoleEnum
[]);
return
this
.
roleListState
.
length
>
0
?
this
.
roleListState
:
(
getLocal
(
ROLES_KEY
)
as
RoleEnum
[]);
}
@
Mutation
...
...
@@ -64,7 +62,7 @@ class User extends VuexModule {
commitUserInfoState
(
info
:
UserInfo
):
void
{
this
.
userInfoState
=
info
;
if
(
info
)
{
set
Session
(
USER_INFO_KEY
,
info
);
set
Local
(
USER_INFO_KEY
,
info
,
true
);
}
}
...
...
@@ -72,7 +70,7 @@ class User extends VuexModule {
commitRoleListState
(
roleList
:
RoleEnum
[]):
void
{
this
.
roleListState
=
roleList
;
if
(
roleList
)
{
set
Session
(
ROLES_KEY
,
roleList
);
set
Local
(
ROLES_KEY
,
roleList
,
true
);
}
}
...
...
@@ -80,7 +78,7 @@ class User extends VuexModule {
commitTokenState
(
info
:
string
):
void
{
this
.
tokenState
=
info
;
if
(
info
)
{
set
Session
(
TOKEN_KEY
,
info
);
set
Local
(
TOKEN_KEY
,
info
,
true
);
}
}
...
...
src/utils/helper/persistent.ts
浏览文件 @
c8021ef3
...
...
@@ -27,9 +27,13 @@ function initCache() {
}
initCache
();
export
function
setLocal
(
key
:
string
,
value
:
any
)
{
export
function
setLocal
(
key
:
string
,
value
:
any
,
immediate
=
false
)
{
cacheStore
.
local
[
BASE_LOCAL_CACHE_KEY
]
=
cacheStore
.
local
[
BASE_LOCAL_CACHE_KEY
]
||
{};
cacheStore
.
local
[
BASE_LOCAL_CACHE_KEY
][
key
]
=
value
;
if
(
immediate
)
{
const
localCache
=
cacheStore
.
local
;
ls
.
set
(
BASE_LOCAL_CACHE_KEY
,
localCache
);
}
}
export
function
getLocal
<
T
>
(
key
:
string
):
T
|
null
{
...
...
@@ -49,9 +53,13 @@ export function clearLocal() {
cacheStore
.
local
=
{};
}
export
function
setSession
(
key
:
string
,
value
:
any
)
{
export
function
setSession
(
key
:
string
,
value
:
any
,
immediate
=
false
)
{
cacheStore
.
session
[
BASE_SESSION_CACHE_KEY
]
=
cacheStore
.
session
[
BASE_SESSION_CACHE_KEY
]
||
{};
cacheStore
.
session
[
BASE_SESSION_CACHE_KEY
][
key
]
=
value
;
if
(
immediate
)
{
const
cache
=
cacheStore
.
session
;
ls
.
set
(
BASE_SESSION_CACHE_KEY
,
cache
);
}
}
export
function
removeSession
(
key
:
string
)
{
...
...
src/views/sys/login/Login.vue
浏览文件 @
c8021ef3
...
...
@@ -11,19 +11,34 @@
<a-form
class=
"mx-auto mt-10"
:model=
"formData"
:rules=
"formRules"
ref=
"formRef"
>
<a-form-item
name=
"account"
>
<a-input
size=
"large"
v-model:value=
"formData.account"
placeholder=
"vben"
/>
<a-input
size=
"large"
v-model:value=
"formData.account"
placeholder=
"
Username:
vben"
/>
</a-form-item>
<a-form-item
name=
"password"
>
<a-input-password
size=
"large"
visibilityToggle
v-model:value=
"formData.password"
placeholder=
"123456"
placeholder=
"
Password:
123456"
/>
</a-form-item>
<a-form-item
name=
"verify"
v-if=
"openLoginVerify"
>
<!--
<a-form-item
name=
"verify"
v-if=
"openLoginVerify"
>
<BasicDragVerify
v-model:value=
"formData.verify"
ref=
"verifyRef"
/>
</a-form-item>
</a-form-item>
-->
<a-row>
<a-col
:span=
"12"
>
<a-form-item>
<!-- 未做逻辑,需要自行处理 -->
<a-checkbox
v-model:checked=
"autoLogin"
size=
"small"
>
自动登录
</a-checkbox>
</a-form-item>
</a-col>
<a-col
:span=
"12"
>
<a-form-item
:style=
"
{ 'text-align': 'right' }">
<!-- 未做逻辑,需要自行处理 -->
<a-button
type=
"link"
size=
"small"
>
忘记密码
</a-button>
</a-form-item>
</a-col>
</a-row>
<a-form-item>
<a-button
type=
"primary"
...
...
@@ -42,28 +57,44 @@
</div>
</
template
>
<
script
lang=
"ts"
>
import
{
defineComponent
,
reactive
,
ref
,
unref
,
toRaw
,
computed
}
from
'
vue
'
;
import
{
BasicDragVerify
,
DragVerifyActionType
}
from
'
/@/components/Verify/index
'
;
import
{
defineComponent
,
reactive
,
ref
,
unref
,
toRaw
,
// computed
}
from
'
vue
'
;
import
{
Checkbox
}
from
'
ant-design-vue
'
;
import
Button
from
'
/@/components/Button/index.vue
'
;
// import { BasicDragVerify, DragVerifyActionType } from '/@/components/Verify/index';
import
{
userStore
}
from
'
/@/store/modules/user
'
;
import
{
appStore
}
from
'
/@/store/modules/app
'
;
//
import { appStore } from '/@/store/modules/app';
import
{
useMessage
}
from
'
/@/hooks/web/useMessage
'
;
import
{
useSetting
}
from
'
/@/hooks/core/useSetting
'
;
import
Button
from
'
/@/components/Button/index.vue
'
;
export
default
defineComponent
({
components
:
{
BasicDragVerify
,
AButton
:
Button
},
components
:
{
// BasicDragVerify,
AButton
:
Button
,
ACheckbox
:
Checkbox
,
},
setup
()
{
const
formRef
=
ref
<
any
>
(
null
);
const
autoLoginRef
=
ref
(
false
);
// const verifyRef = ref
<
RefInstanceType
<
DragVerifyActionType
>>
(
null
);
const
{
globSetting
}
=
useSetting
();
const
{
notification
}
=
useMessage
();
const
formRef
=
ref
<
any
>
(
null
);
const
verifyRef
=
ref
<
RefInstanceType
<
DragVerifyActionType
>>
(
null
);
const
openLoginVerifyRef
=
computed
(()
=>
appStore
.
getProjectConfig
.
openLoginVerify
);
//
const openLoginVerifyRef = computed(() => appStore.getProjectConfig.openLoginVerify);
const
formData
=
reactive
({
account
:
'
vben
'
,
password
:
'
123456
'
,
verify
:
undefined
,
//
verify: undefined,
});
const
formState
=
reactive
({
loading
:
false
,
...
...
@@ -72,15 +103,15 @@
const
formRules
=
reactive
({
account
:
[{
required
:
true
,
message
:
'
请输入账号
'
,
trigger
:
'
blur
'
}],
password
:
[{
required
:
true
,
message
:
'
请输入密码
'
,
trigger
:
'
blur
'
}],
verify
:
unref
(
openLoginVerifyRef
)
?
[{
required
:
true
,
message
:
'
请通过验证码校验
'
}]
:
[],
//
verify: unref(openLoginVerifyRef) ? [{ required: true, message: '请通过验证码校验' }] : [],
});
function
resetVerify
()
{
const
verify
=
unref
(
verifyRef
);
if
(
!
verify
)
return
;
formData
.
verify
&&
verify
.
$
.
resume
();
formData
.
verify
=
undefined
;
}
//
function resetVerify() {
//
const verify = unref(verifyRef);
//
if (!verify) return;
//
formData.verify && verify.$.resume();
//
formData.verify = undefined;
//
}
async
function
handleLogin
()
{
const
form
=
unref
(
formRef
);
...
...
@@ -103,19 +134,20 @@
}
}
catch
(
error
)
{
}
finally
{
resetVerify
();
//
resetVerify();
formState
.
loading
=
false
;
}
}
return
{
formRef
,
verifyRef
,
//
verifyRef,
formData
,
formState
,
formRules
,
login
:
handleLogin
,
openLoginVerify
:
openLoginVerifyRef
,
autoLogin
:
autoLoginRef
,
// openLoginVerify: openLoginVerifyRef,
title
:
globSetting
&&
globSetting
.
title
,
};
},
...
...
@@ -141,13 +173,13 @@
}
&-form {
width:
100%
;
width:
520px
;
background: @white;
border: 10px solid rgba(255, 255, 255, 0.5);
border-width: 8px;
border-radius: 4px;
background-clip: padding-box;
.respond-to(xlarge, { margin: 0
56
px});
.respond-to(xlarge, { margin: 0
120px 0 50
px});
&-wrap {
position: absolute;
...
...
@@ -155,14 +187,14 @@
right: 0;
display: flex;
width: 100%;
height:
10
0%;
height:
9
0%;
justify-content: center;
align-items: center;
.respond-to(large, {
width:
52
0px;
right: calc(50% -
26
0px);
width:
60
0px;
right: calc(50% -
30
0px);
});
.respond-to(xlarge, { width:
52
0px; right:0});
.respond-to(xlarge, { width:
60
0px; right:0});
}
&__content {
...
...
@@ -178,13 +210,13 @@
img {
display: inline-block;
width:
64
px;
width:
48
px;
}
h1 {
margin-bottom: 0;
font-size: 24px;
color: @primary-color;
//
color: @primary-color;
text-align: center;
}
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录