sdz/ks-app-employment-service
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(login): 重构登录页面并优化认证流程

Browse Source 
- 重新设计登录界面UI，增加装饰元素和动画效果
- 更新登录表单布局，添加图标和标签
- 修改存储的token名称为inspur-admin-Token和fourLevelLinkage-token
- 在帮助筛选页面添加Bearer前缀到授权头
- 从帮助筛选页面传递goal_person_id参数到跟进页面
- 禁用智能推荐按钮并注释相关代码
- 移除首页招聘会服务项的权限检查条件
- 在跟进页面保存成功后刷新列表数据
- 从路由参数获取goal_person_id并设置到人员信息中
This commit is contained in:
hanguangpu01
2026-04-24 14:35:05 +08:00
parent d817ce2524
commit 4e57363b4a
4 changed files with 264 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files

372
packageB/login2.vue
View File

@@ -1,18 +1,64 @@
<template>
<AppLayout title="" :use-scroll-view="false">
<view class="wrap">
<view class="login_index">
<input class="input" placeholder="请输入账号" placeholder-class="inputplace" v-model="form.username" />
<view class="login_yzm">
<input class="input" type="password" placeholder="请输入密码" placeholder-class="inputplace"
v-model="form.password" />
<view class="login-container">
<!-- 顶部装饰 -->
<view class="header-decoration">
<view class="decoration-circle circle-1"></view>
<view class="decoration-circle circle-2"></view>
</view>
<!-- Logo区域 -->
<view class="logo-section">
<view class="logo-wrapper">
<text class="logo-icon">✦</text>
</view>
<view class="login_yzm">
<input class="input" placeholder="请输入验证码" placeholder-class="inputplace" v-model="form.code" />
<image class="yzm" :src="codeUrl" @click="getCodeImg"></image>
<text class="logo-title">欢迎回来</text>
<text class="logo-subtitle">请登录您的账号</text>
</view>
<!-- 登录表单 -->
<view class="form-section">
<view class="form-item">
<view class="form-label">账号</view>
<view class="input-wrapper">
<text class="input-icon">👤</text>
<input class="form-input" placeholder="请输入账号" placeholder-class="inputplace" v-model="form.username" />
</view>
</view>
<button class="com-btn" @click="register">登 录</button>
<view class="form-item">
<view class="form-label">密码</view>
<view class="input-wrapper">
<text class="input-icon">🔒</text>
<input class="form-input" type="password" placeholder="请输入密码" placeholder-class="inputplace" v-model="form.password" />
</view>
</view>
<view class="form-item">
<view class="form-label">验证码</view>
<view class="input-wrapper verify-wrapper">
<text class="input-icon">✧</text>
<input class="form-input verify-input" placeholder="请输入验证码" placeholder-class="inputplace" v-model="form.code" />
<image class="verify-code" :src="codeUrl" @click="getCodeImg"></image>
</view>
</view>
</view>
<!-- 登录按钮 -->
<view class="button-section">
<button class="login-btn" @click="register">
<text class="btn-text">登 录</text>
<text class="btn-arrow">→</text>
</button>
</view>
<!-- 底部装饰 -->
<view class="footer-decoration">
<view class="decoration-dots">
<view class="dot"></view>
<view class="dot dot-active"></view>
<view class="dot"></view>
</view>
</view>
</view>
</AppLayout>
@@ -139,7 +185,9 @@
})
}else if(flag.value=='nw'){
$api.myRequest('/auth/login',form,'post',9100).then((res) => {
uni.setStorageSync('Padmin-Token', res.data.access_token)
uni.setStorageSync('inspur-admin-Token', res.data.access_token)
uni.setStorageSync('fourLevelLinkage-token', res.data.access_token)
uni.reLaunch({
url: '/packageB/priority/helpFilter'
})
@@ -172,130 +220,220 @@
</script>
<style scoped lang="stylus">
.wrap {
background-color: #ffffff;
height: 100vh;
position: relative;
/* 主题色变量 */
$primary-color = #46ca98
$primary-light = #e8f8f0
$primary-dark = #3ab882
$text-primary = #1a1a1a
$text-secondary = #666666
$text-placeholder = #b5b5b5
$bg-light = #f8faf9
$border-color = #e8e8e8
.lg-head {
height: 480rpx;
background: #46ca98;
position: relative;
.login-container
background: linear-gradient(180deg, #f8faf9 0%, #ffffff 100%)
min-height: 100vh
display: flex
flex-direction: column
align-items: center
position: relative
overflow: hidden
.view_logo {
text-align: center;
/* 顶部装饰 */
.header-decoration
position: absolute
top: 0
left: 0
right: 0
height: 400rpx
pointer-events: none
.login_logo {
width: 300rpx;
height: 300rpx;
margin-top: 100rpx;
}
}
.decoration-circle
position: absolute
border-radius: 50%
background: linear-gradient(135deg, rgba(70, 202, 152, 0.1) 0%, rgba(70, 202, 152, 0.05) 100%)
.bg-cover {
position: absolute;
bottom: -4rpx;
left: 0;
right: 0;
height: 30rpx;
background-size: 100% 100%;
z-index: 1;
}
}
}
.circle-1
width: 300rpx
height: 300rpx
top: -100rpx
right: -80rpx
.login_index {
font-size: 36rpx;
font-weight: 500;
width: 596rpx;
margin: 0 auto;
.circle-2
width: 200rpx
height: 200rpx
top: 60rpx
left: -60rpx
background: linear-gradient(135deg, rgba(70, 202, 152, 0.08) 0%, rgba(70, 202, 152, 0.02) 100%)
::v-deep .is-input-border {
border: 0;
border-bottom: 1px solid #dcdfe6 !important;
border-radius: 0;
}
/* Logo区域 */
.logo-section
margin-top: 160rpx
display: flex
flex-direction: column
align-items: center
animation: fadeInUp 0.6s ease-out
::v-deep .uni-input-input {
font-size: 32rpx;
padding-left: 10rpx;
}
.logo-wrapper
width: 140rpx
height: 140rpx
background: linear-gradient(145deg, $primary-color 0%, $primary-dark 100%)
border-radius: 36rpx
display: flex
align-items: center
justify-content: center
box-shadow: 0 16rpx 40rpx rgba(70, 202, 152, 0.3)
margin-bottom: 40rpx
::v-deep .uniui-contact-filled:before {
color: #46ca98;
font-size: 50rpx;
}
.logo-icon
font-size: 60rpx
color: #ffffff
::v-deep .uniui-locked-filled:before {
color: #46ca98;
font-size: 50rpx;
}
.logo-title
font-size: 48rpx
font-weight: 600
color: $text-primary
letter-spacing: 2rpx
margin-bottom: 12rpx
.login_yzm {
margin-top: 40rpx;
display: flex;
align-items: center;
.logo-subtitle
font-size: 28rpx
color: $text-secondary
letter-spacing: 1rpx
.yzm {
width: 200rpx;
height: 80rpx;
}
}
/* 表单区域 */
.form-section
width: 600rpx
margin-top: 80rpx
animation: fadeInUp 0.6s ease-out 0.15s backwards
.com-btn {
height: 100rpx;
background: #46ca98;
border-radius: 50rpx;
color: #fff;
margin-top: 100rpx;
}
.form-item
margin-bottom: 40rpx
.login_wt {
margin: 0 auto;
text-align: right;
font-size: 24rpx;
color: rgba(134, 134, 136, 1);
}
}
.form-label
font-size: 26rpx
color: $text-secondary
margin-bottom: 16rpx
padding-left: 8rpx
letter-spacing: 1rpx
.lg-bottom {
position: absolute;
bottom: -3px;
left: 0;
width: 100%;
.input-wrapper
display: flex
align-items: center
background: #ffffff
border-radius: 24rpx
padding: 0 32rpx
height: 100rpx
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.04)
border: 2rpx solid transparent
transition: all 0.3s ease
.bottom-svg {
position: absolute;
bottom: -3px;
left: 0;
width: 100%;
}
}
&:focus-within
border-color: $primary-color
box-shadow: 0 4rpx 24rpx rgba(70, 202, 152, 0.15)
.login_tongyi {
.input-icon
font-size: 36rpx
margin-right: 20rpx
opacity: 0.7
font-size: 26rpx;
color: rgba(196, 196, 196, 1);
width: 620rpx;
margin: 32rpx auto;
text-align: center;
.form-input
flex: 1
height: 100%
font-size: 30rpx
color: $text-primary
text {
color: rgba(86, 176, 236, 1);
}
}
.verify-wrapper
padding-right: 16rpx
.input {
padding: 0 30rpx 0 80rpx;
height: 80rpx;
background: #FFFFFF;
border-radius: 75rpx 75rpx 75rpx 75rpx;
font-size: 28rpx;
}
.verify-input
flex: 1
.inputplace {
font-weight: 400;
font-size: 28rpx;
color: #B5B5B5;
}
.verify-code
width: 180rpx
height: 72rpx
border-radius: 16rpx
margin-left: 16rpx
cursor: pointer
transition: transform 0.2s ease
&:active
transform: scale(0.95)
/* 输入框占位符 */
.inputplace
font-weight: 400
font-size: 28rpx
color: $text-placeholder
/* 按钮区域 */
.button-section
width: 600rpx
margin-top: 60rpx
animation: fadeInUp 0.6s ease-out 0.3s backwards
.login-btn
width: 100%
height: 108rpx
background: linear-gradient(135deg, $primary-color 0%, $primary-dark 100%)
border-radius: 54rpx
display: flex
align-items: center
justify-content: center
box-shadow: 0 12rpx 32rpx rgba(70, 202, 152, 0.35)
transition: all 0.3s ease
border: none
&:active
transform: translateY(2rpx)
box-shadow: 0 8rpx 24rpx rgba(70, 202, 152, 0.3)
.btn-text
font-size: 34rpx
font-weight: 500
color: #ffffff
letter-spacing: 8rpx
.btn-arrow
font-size: 32rpx
color: #ffffff
margin-left: 16rpx
transition: transform 0.3s ease
.login-btn:active .btn-arrow
transform: translateX(8rpx)
/* 底部装饰 */
.footer-decoration
position: absolute
bottom: 60rpx
display: flex
flex-direction: column
align-items: center
animation: fadeInUp 0.6s ease-out 0.45s backwards
.decoration-dots
display: flex
align-items: center
gap: 16rpx
.dot
width: 12rpx
height: 12rpx
border-radius: 50%
background: rgba(70, 202, 152, 0.3)
.dot-active
width: 36rpx
border-radius: 6rpx
background: $primary-color
/* 动画 */
@keyframes fadeInUp
from
opacity: 0
transform: translateY(30rpx)
to
opacity: 1
transform: translateY(0)
</style>