|
|
@@ -3,10 +3,10 @@
|
|
|
<el-container>
|
|
|
<el-header></el-header>
|
|
|
<el-main>
|
|
|
- <h5 class="title">XXXX系统管理</h5>
|
|
|
- <span class="subtitle">XXXXXX、XXXXXX等管理系统</span>
|
|
|
+ <h5 class="title">SignalDigger</h5>
|
|
|
+ <span class="subtitle">专用场所无线信号安全监控系统</span>
|
|
|
<el-card class="box-card">
|
|
|
- <div class="boxTitle">登陆</div>
|
|
|
+ <div class="center">
|
|
|
<el-form ref="form" :model="form" label-width="0px">
|
|
|
<el-form-item label="">
|
|
|
<el-input v-model="form.name" placeholder="用户名"></el-input>
|
|
|
@@ -19,13 +19,15 @@
|
|
|
<img id="validImg" :src="valImgSrc" alt="" width="100px" height="30px" title="看不清？刷一下试试！">
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
- <el-button type="primary" @click="onSubmit">登陆</el-button>
|
|
|
- <el-button @click="clearForm">清除</el-button>
|
|
|
+ <el-button type="primary" class="primaryBtn" @click="onSubmit">确认</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
+ </div>
|
|
|
</el-card>
|
|
|
</el-main>
|
|
|
- <el-footer></el-footer>
|
|
|
+ <el-footer>
|
|
|
+ <p>Copyright © 2020-{{thisYear}} 专用场所无线信号安全监控系统 版权所有</p>
|
|
|
+ </el-footer>
|
|
|
</el-container>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -38,6 +40,7 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ thisYear:new Date().getFullYear(),
|
|
|
form: {
|
|
|
name: '',
|
|
|
pwd: '',
|
|
|
@@ -147,14 +150,18 @@
|
|
|
overflow: hidden;
|
|
|
display: block;
|
|
|
margin: 0 auto;
|
|
|
- background: #333;
|
|
|
+ background-image: url("../assets/img/login.png");
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-position: top center;
|
|
|
+ background-size: 100% 100%;
|
|
|
}
|
|
|
|
|
|
.title {
|
|
|
- font-size: 60px;
|
|
|
+ font-size: 43px;
|
|
|
+ font-weight: 600;
|
|
|
text-align: center;
|
|
|
color: #fff;
|
|
|
- margin-top: 3%;
|
|
|
+ margin-top: 2%;
|
|
|
margin-bottom: 5px;
|
|
|
}
|
|
|
|
|
|
@@ -170,10 +177,18 @@
|
|
|
}
|
|
|
|
|
|
.box-card {
|
|
|
- width: 400px;
|
|
|
+ width: 626px;
|
|
|
+ min-height: 369px;
|
|
|
overflow: hidden;
|
|
|
display: block;
|
|
|
margin: 0 auto;
|
|
|
+ background: rgba(255,255,255,0.18)!important;
|
|
|
+ /*background: url("../assets/img/goss.png");*/
|
|
|
+ /*background-image: url("../assets/img/goss.png");*/
|
|
|
+ border: 1px solid rgba(255,255,255,0.41);
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-position: top center;
|
|
|
+ background-size: 100% 100%;
|
|
|
}
|
|
|
|
|
|
.box-card .boxTitle {
|
|
|
@@ -186,4 +201,41 @@
|
|
|
float: right;
|
|
|
bottom: 35px;
|
|
|
}
|
|
|
+ .center {
|
|
|
+ width: 300px;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ background: rgba(255,255,255,0.25);
|
|
|
+ border-radius: 12px;
|
|
|
+ margin-top: 27px;
|
|
|
+ padding: 51px 133px;
|
|
|
+ }
|
|
|
+ .primaryBtn {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ height: 44px;
|
|
|
+ line-height: 24px;
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+ .el-card {
|
|
|
+ background: none;
|
|
|
+ }
|
|
|
+ /deep/ .el-input__inner {
|
|
|
+ background: none;
|
|
|
+ border: 1px solid #70C2FF;
|
|
|
+ color: #BEE3FF;
|
|
|
+ }
|
|
|
+ /deep/ .el-input__inner::placeholder {
|
|
|
+ color: #BEE3FF;
|
|
|
+ }
|
|
|
+ /deep/ .el-footer {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ color: #6DC1FF;
|
|
|
+ }
|
|
|
</style>
|
