登陆页面ui更换,调整用户和机构表单字段

main
xuechunyuan 3 years ago
parent 8cd62f2d58
commit 0d28ef4a8a
  1. BIN
      public/img/bg/bg5.png
  2. BIN
      public/img/bg/login-title.png
  3. 6
      src/config/website.js
  4. 21
      src/page/login/index.vue
  5. 4
      src/page/login/userlogin.vue
  6. 102
      src/styles/login.scss
  7. 79
      src/views/blacklist/index.vue
  8. 10
      src/views/system/dept.vue
  9. 2073
      src/views/system/user.vue

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

@ -5,12 +5,12 @@ export default {
title: "车管所体检预约",
logo: "C",
key: 'saber',//配置主键,目前用于存储
indexTitle: '车管所体检预约 管理',
indexTitle: '车管所体检预约管理',
clientId: 'saber', // 客户端id
clientSecret: 'saber_secret', // 客户端密钥
tenantMode: true, // 是否开启租户模式
tenantMode: false, // 是否开启租户模式
tenantId: "000000", // 管理组租户编号
captchaMode: true, // 是否开启验证码模式
captchaMode: false, // 是否开启验证码模式
switchMode: false, // 是否开启部门切换模式
lockPage: '/lock',
tokenTime: 3000,

@ -4,7 +4,7 @@
@keyup.enter.native="handleLogin">
<top-color v-show="false"></top-color>
<div class="login-weaper animated bounceInDown">
<div class="login-left">
<!-- <div class="login-left">
<div class="login-time">
{{time}}
</div>
@ -30,23 +30,24 @@
<br>
<span>----------------------------------------------</span>
</div>
<!--<img class="img" src="/img/logo.png" alt="">-->
</div>
<img class="img" src="/img/logo.png" alt="">
</div> -->
<div class="login-border">
<div class="login-main">
<h4 class="login-title">
{{ $t('login.title') }}{{website.title}}
<top-lang></top-lang>
</h4>
<div class="login-title">
<img class="login-img" src="/img/bg/login-title.png"/>
<div class="login-small-title">VEHICLE MANAGEMENT OFFICE PHYSICAL EXAMINATION<br/>
RESERVATION SYSTEM</div>
</div>
<userLogin v-if="activeName==='user'"></userLogin>
<codeLogin v-else-if="activeName==='code'"></codeLogin>
<!-- <codeLogin v-else-if="activeName==='code'"></codeLogin>
<thirdLogin v-else-if="activeName==='third'"></thirdLogin>
<div class="login-menu">
<a href="#" @click.stop="activeName='user'">{{ $t('login.userLogin') }}</a>
<!--<a href="#" @click.stop="activeName='code'">{{ $t('login.phoneLogin') }}</a>-->
<a href="#" @click.stop="activeName='code'">{{ $t('login.phoneLogin') }}</a>
<a href="#" @click.stop="activeName='third'">{{ $t('login.thirdLogin') }}</a>
<a :href="website.ssoUrl + website.redirectUri">{{ $t('login.ssoLogin') }}</a>
</div>
</div> -->
</div>
</div>

@ -15,7 +15,7 @@
</el-input>
</el-form-item> -->
<el-form-item prop="username">
<el-input size="small"
<el-input
@keyup.enter.native="handleLogin"
v-model="loginForm.username"
auto-complete="off"
@ -24,7 +24,7 @@
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input size="small"
<el-input
@keyup.enter.native="handleLogin"
:type="passwordType"
v-model="loginForm.password"

@ -5,14 +5,18 @@
width: 100%;
height: 100%;
margin: 0 auto;
background-image: url("/img/bg/bg.jpg");
background-image: url("/img/bg/bg5.png");
background-size: 100% 100%;
}
.login-weaper {
margin: 0 auto;
width: 1000px;
box-shadow: -4px 5px 10px rgba(0, 0, 0, 0.4);
margin: 0 144px 0 auto;
// width: 1000px;
width: 500px;
// box-shadow: -4px 5px 10px rgba(0, 0, 0, 0.4);
background: linear-gradient(140deg, #E4ECF7 0%, #F8FAFC 67%, #FFFFFF 100%);
box-shadow: 1px 3px 12px 1px rgba(34, 63, 88, 0.14);
border-radius: 8px;
.el-input-group__append {
border: none;
@ -63,38 +67,54 @@
letter-spacing: 2px;
}
.login-border {
border-left: none;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
color: #fff;
background-color: #fff;
width: 50%;
float: left;
box-sizing: border-box;
}
// .login-border {
// border-left: none;
// border-top-right-radius: 5px;
// border-bottom-right-radius: 5px;
// color: #fff;
// background-color: #fff;
// width: 50%;
// float: left;
// box-sizing: border-box;
// }
.login-main {
margin: 0 auto;
width: 65%;
width: 396px;
box-sizing: border-box;
}
.login-main > h3 {
.login-main>h3 {
margin-bottom: 20px;
}
.login-main > p {
.login-main>p {
color: #76838f;
}
.login-title {
color: #333;
margin-bottom: 40px;
margin-top: 60px;
font-weight: 500;
font-size: 22px;
text-align: center;
letter-spacing: 4px;
// letter-spacing: 4px;
}
.login-img {
width: 396px;
height: 42px;
}
.login-small-title {
color: #999999;
font-size: 12px;
line-height: 16px;
font-family: Microsoft YaHei-Light, Microsoft YaHei;
font-weight: 300;
text-align: left;
margin-top: 14px;
}
.login-menu {
@ -111,21 +131,26 @@
.login-submit {
width: 100%;
height: 45px;
border: 1px solid #409EFF;
background: none;
height: 60px;
// border: 1px solid #409EFF;
background: #1677FF;
;
font-size: 18px;
letter-spacing: 2px;
font-weight: 300;
color: #409EFF;
// color: #409EFF;
color: #fff;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
cursor: pointer;
margin-top: 30px;
font-family: "neo";
margin-top: 50px;
// font-family: "neo";
transition: 0.25s;
border-radius: 8px;
}
.login-form {
margin: 10px 0;
margin: 0 0 60px 0;
i {
color: #333;
@ -136,24 +161,33 @@
}
.el-form-item {
margin-bottom: 12px;
margin-bottom: 20px;
}
.el-input {
input {
padding-bottom: 10px;
height:60px;
// padding-bottom: 10px;
text-indent: 5px;
background: transparent;
border: none;
border-radius: 0;
// background: transparent;
// border: none;
// border-radius: 0;
color: #333;
border-bottom: 1px solid rgb(235, 237, 242);
// border-bottom: 1px solid rgb(235, 237, 242);
border: 1px solid #D2D2D2;
border-radius: 8PX;
&:focus{
border-color: #1677FF;
}
}
.el-input__prefix {
top: 10px;
i {
color: #1677FF;
padding: 0 5px;
font-size: 16px !important;
font-size: 18px !important;
}
}
}
@ -179,5 +213,5 @@
line-height: 38px;
text-indent: 5px;
text-align: center;
cursor:pointer!important;
}
cursor: pointer !important;
}

@ -1,11 +1,11 @@
<template>
<basic-container>
<avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" ref="crud" @row-del="rowDel"
v-model="form" :permission="permissionList" @row-update="rowUpdate" @row-save="rowSave" :before-open="beforeOpen"
@search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange"
@current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
<avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" ref="crud" v-model="form"
:permission="permissionList" :before-open="beforeOpen" @search-change="searchChange" @search-reset="searchReset"
@selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
@refresh-change="refreshChange" @on-load="onLoad">
<template slot-scope="{row}" slot="menu">
<el-button type="text" icon="el-icon-circle-plus-outline" size="small" @click="handleDelete">取消黑名单
<el-button type="text" icon="el-icon-circle-plus-outline" size="small" @click="handleCancel">取消黑名单
</el-button>
</template>
<template slot-scope="{row}" slot="status">
@ -93,44 +93,25 @@ export default {
}
},
methods: {
//
publish(row, done, loading) {
console.log(row, done, loading)
},
rowSave(row, done, loading) {
add(row).then(() => {
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
done();
}, error => {
window.console.log(error);
loading();
});
},
rowUpdate(row, index, done, loading) {
update(row).then(() => {
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
done();
}, error => {
window.console.log(error);
loading();
});
},
rowDel(row) {
this.$confirm("确定将选择数据删除?", {
//
handleCancel(row) {
this.$confirm("确认将此用户移除黑名单吗?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
return remove(row.id);
// update(row).then(() => {
// this.onLoad(this.page);
// this.$message({
// type: "success",
// message: "!"
// });
// done();
// }, error => {
// window.console.log(error);
// loading();
// });
})
.then(() => {
this.onLoad(this.page);
@ -157,28 +138,6 @@ export default {
this.selectionList = [];
this.$refs.crud.toggleSelection();
},
handleDelete() {
if (this.selectionList.length === 0) {
this.$message.warning("请选择至少一条数据");
return;
}
this.$confirm("确定将选择数据删除?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
return remove(this.ids);
})
.then(() => {
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
this.$refs.crud.toggleSelection();
});
},
beforeOpen(done, type) {
if (["edit", "view"].includes(type)) {
getNotice(this.form.id).then(res => {

@ -32,7 +32,7 @@ import {
getDeptTree
} from "@/api/system/dept";
import { mapGetters } from "vuex";
import website from '@/config/website';
// import website from '@/config/website';
export default {
data() {
@ -74,7 +74,7 @@ export default {
},
{
label: "机构logo",
prop: "deptName",
prop: "imgUrl",
html: true,
formatter: (val) => {
return `${val.logo ? '<img src="' + val.logo + '"/>' : ''}`
@ -146,11 +146,11 @@ export default {
}]
},
{
label: "备注",
label: "地址",
prop: "remark",
rules: [{
required: false,
message: "请输入备注",
required: true,
message: "请输入地址",
trigger: "blur"
}],
hide: true

File diff suppressed because it is too large Load Diff
Loading…
Cancel
Save