gxwebsoft
f7eea88945
- 配置文件 website.js 中将 captchaType 从 'behavior' 改为 'image' - 修改 userlogin.vue，图形验证码图片由输入框内联改为输入框旁独立显示 - 重写 login.scss 样式，实现验证码图片区域带边框和高亮效果 - 确保验证码图片点击可刷新，且支持从后端接口获取数据 - 登录页仍默认显示 IAM 登录，需切换「账号密码登录」显示验证码区域 feat(contract-manage): 优化所属组织搜索栏为树形下拉选择框 - 引入并应用 organization-search mixin 统一管理所属组织搜索 - contract-manage.js、driver.js、transport-ship.js、transport-vehicle.js 中所属组织搜索改为 searchslot 模式 - contract-manage.vue 中新增 renderOrganizationSearch 方法，渲染基于 ElTreeSelect 的树形下拉组件 - 组织树数据加载时自动排除「外部组织」节点，保持搜索选项清晰 - 所有相关所属组织搜索统一样式与交互，提升用户体验 feat(system): 用户和部门视图样式及操作改进 - user.vue 和 userinfo.vue 中 el-tabs 组件添加 border-card 类型，提升标签页视觉效果 - dept.vue 中添加查看、编辑、删除操作入口，绑定对应方法，通过权限控制显示权限按钮 - dept.vue 菜单宽度、对话框宽度及行为配置优化 style(login): 调整登录样式及验证码布局细节 - 调整 .login-code-wrap 及内部元素的 flex 布局，输入框与验证码图片并排显示 - 设置验证码图片容器尺寸、边框及 hover 高亮样式 - 确保验证码图片撑满容器并禁止用户选中 refactor(mixins): 新增 organization-search 统一搜索 mixin - 实现组织树数据加载、排除外部节点、归一化及扁平化处理 - 提供 renderOrganizationSearch 方法用于渲染统一树形选择搜索框 - 减少重复代码，方便各页面快速接入和统一维护 chore(vehicle): 车辆页面引入 organization-search mixin - 在车辆视图 vehicle.vue 中混入 organization-search，增强所属组织搜索功能一致性
171 lines
2.9 KiB
SCSS
171 lines
2.9 KiB
SCSS
.login-container {
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-image: url('/img/运输登录.jpg');
|
|
background-position: center center;
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
overflow: hidden;
|
|
&::before {
|
|
// content:' ';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
margin-left: -48%;
|
|
background-image: url('/img/运输登录.jpg');
|
|
background-position: 100%;
|
|
background-repeat: no-repeat;
|
|
background-size: auto 100%;
|
|
}
|
|
}
|
|
.login-weaper {
|
|
margin: 0 auto;
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.login-border {
|
|
position: relative;
|
|
min-height: 500px;
|
|
align-items: center;
|
|
display: flex;
|
|
}
|
|
.login-time {
|
|
position: absolute;
|
|
left: 25px;
|
|
top: 25px;
|
|
width: 100%;
|
|
color: #fff;
|
|
font-weight: 200;
|
|
opacity: 0.9;
|
|
font-size: 18px;
|
|
overflow: hidden;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.login-border {
|
|
border-left: none;
|
|
border-top-right-radius: 5px;
|
|
border-bottom-right-radius: 5px;
|
|
color: #fff;
|
|
width: 50%;
|
|
box-sizing: border-box;
|
|
}
|
|
.login-main {
|
|
margin: 0 auto;
|
|
padding: 30px 50px;
|
|
width: 70%;
|
|
//box-shadow: -4px 5px 10px rgba(255, 255, 255, 0.4);
|
|
box-sizing: border-box;
|
|
background: white;
|
|
}
|
|
.login-main > h3 {
|
|
margin-bottom: 20px;
|
|
}
|
|
.login-title {
|
|
color: #000;
|
|
margin-bottom: 50px;
|
|
font-weight: bold;
|
|
font-size: 28px;
|
|
text-align: center;
|
|
letter-spacing: 4px;
|
|
}
|
|
.login-menu {
|
|
margin-top: 40px;
|
|
width: 100%;
|
|
text-align: center;
|
|
a {
|
|
color: #999;
|
|
font-size: 12px;
|
|
margin: 0px 8px;
|
|
}
|
|
}
|
|
.login-submit {
|
|
width: 100%;
|
|
height: 45px;
|
|
font-size: 18px;
|
|
letter-spacing: 2px;
|
|
font-weight: 300;
|
|
cursor: pointer;
|
|
margin-top: 30px;
|
|
transition: 0.25s;
|
|
background-color: #2c77f1;
|
|
}
|
|
.register-submit {
|
|
width: 100%;
|
|
height: 45px;
|
|
font-size: 18px;
|
|
letter-spacing: 2px;
|
|
font-weight: 300;
|
|
cursor: pointer;
|
|
margin-top: 30px;
|
|
margin-left: 0 !important;
|
|
transition: 0.25s;
|
|
}
|
|
.login-form {
|
|
margin: 10px 0;
|
|
i {
|
|
color: #333;
|
|
}
|
|
.el-input {
|
|
input {
|
|
text-indent: 5px;
|
|
}
|
|
.el-input__wrapper {
|
|
padding: 5px 10px;
|
|
border-radius: 0;
|
|
}
|
|
.el-input__suffix,
|
|
.el-input__prefix {
|
|
display: flex;
|
|
align-items: center;
|
|
text-align: center;
|
|
}
|
|
.el-input__prefix {
|
|
margin-left: 8px;
|
|
}
|
|
}
|
|
}
|
|
.login-code {
|
|
width: 100%;
|
|
}
|
|
.login-code-wrap {
|
|
display: flex;
|
|
align-items: stretch;
|
|
width: 100%;
|
|
gap: 10px;
|
|
.el-input {
|
|
flex: 1;
|
|
}
|
|
}
|
|
.login-code-box {
|
|
width: 130px;
|
|
height: 38px;
|
|
flex: none;
|
|
border: 1px solid #dcdfe6;
|
|
border-radius: 4px;
|
|
overflow: hidden;
|
|
cursor: pointer;
|
|
background: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
transition: border-color 0.2s;
|
|
&:hover {
|
|
border-color: #409eff;
|
|
}
|
|
}
|
|
.login-code-img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: fill;
|
|
display: block;
|
|
user-select: none;
|
|
}
|