From 38d11c5d99a78a7c65ccb2b24d6f49b97f9c0fdd Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期五, 17 六月 2022 17:27:15 +0800
Subject: [PATCH] 1..完成基础设置:用户清单列表查询、新增、编辑、删除 功能开发
---
src/views/login/index.vue | 81 +++++++++++++++++++++++-----------------
1 files changed, 47 insertions(+), 34 deletions(-)
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index e09f0ef..1c94a2b 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -1,24 +1,43 @@
<template>
<div class="login-container">
-
<div class="login-container-center">
-
<el-carousel
- :autoplay="false"
+ :autoplay="true"
indicator-position="outside"
height="580px"
- interval="3000"
+ :interval="3000"
style="width: 500px;margin-left: 20px"
>
- <el-carousel-item v-for="item in carouselArr" :key="item.title">
- <!-- <h3>{{ item }}</h3>-->
-
- <div :style="{ width:'200px',height:'300px' ,backgroundColor:item.color,margin:'95px 0px 35px 155px'}" />
+ <el-carousel-item>
+ <img src="@/assets/images/img1.png" style="margin-top: -30px">
<div class="itemLabel">
- <div class="title">{{ item.title }}</div>
- <div class="content">{{ item.content }}</div>
+ <p class="title">鏅烘収鐗╄仈</p>
+ <p class="content">鐢熶骇鐜板満鏁版嵁瀹炴椂閲囬泦銆� 浼犻�掋�佸缁村害鍙鍖栧憟鐜�</p>
</div>
</el-carousel-item>
+ <el-carousel-item>
+ <img src="@/assets/images/img2.png" style="margin-top: -30px">
+ <div class="itemLabel">
+ <p class="title">绮剧泭鎬濈淮</p>
+ <p class="content">杩愮敤绮剧泭鎬濇兂鍜孖T绯荤粺鎶� 鏈墦閫犲伐鍘傚埗閫犲崗鍚屽钩鍙�</p>
+ </div>
+ </el-carousel-item>
+ <el-carousel-item>
+ <img src="@/assets/images/img3.png" style="margin-top: -30px">
+ <div class="itemLabel">
+ <p class="title">琛屼笟缁勪欢</p>
+ <p class="content">鍩轰簬鍒堕�犳ā鍨嬪揩閫熺伒娲诲湴 閰嶇疆瀹㈡埛涓撳睘鐨勫簲鐢ㄥ満鏅�</p>
+ </div>
+ </el-carousel-item>
+ <!-- <el-carousel-item v-for="item in carouselArr" :key="item.title">-->
+ <!-- <div :style="{ width:'200px',height:'300px' ,margin:'95px 0px 35px 155px'}">-->
+ <!-- <img :src="item.url" alt="" style="width: 200px;height: 300px">-->
+ <!-- </div>-->
+ <!-- <div class="itemLabel">-->
+ <!-- <div class="title">{{ item.title }}</div>-->
+ <!-- <div class="content">{{ item.content }}</div>-->
+ <!-- </div>-->
+ <!-- </el-carousel-item>-->
</el-carousel>
<el-form
@@ -113,6 +132,7 @@
// callback()
// }
const mPattern = /^\w+$/ // 姝e垯 绛変环浜嶽A-Za-z0-9_]
+
if (value.length < 5) {
callback(new Error('璐﹀彿闀垮害涓嶅皯浜庝簲浣嶏紒'))
} else if (!mPattern.test(value)) {
@@ -130,21 +150,16 @@
}
return {
loginForm: {
- username: 'admin',
- password: '111111'
+ username: 'Admin',
+ password: '123456'
},
loginRules: {
- username: [{ required: true, trigger: 'blur', validator: validateUsername }],
- password: [{ required: true, trigger: 'blur', validator: validatePassword }]
+ username: [{ required: true, trigger: ['blur', 'change'], validator: validateUsername }],
+ password: [{ required: true, trigger: ['blur', 'change'], validator: validatePassword }]
},
loading: false,
passwordType: 'password',
redirect: undefined,
- carouselArr: [
- { color: 'red', title: '鏅烘収鐗╄仈', content: '鐢熶骇鐜板満鏁版嵁瀹炴椂閲囬泦銆佷紶杈俱�佸缁村害鍙鍖栧憟鐜�' },
- { color: 'yellow', title: '鏅烘収鐗╄仈2', content: '鐢熶骇鐜板満鏁版嵁瀹炴椂閲囬泦銆佷紶杈俱�佸缁村害鍙鍖栧憟鐜�2' },
- { color: 'blue', title: '鏅烘収鐗╄仈3', content: '鐢熶骇鐜板満鏁版嵁瀹炴椂閲囬泦銆佷紶杈俱�佸缁村害鍙鍖栧憟鐜�3' }
- ],
focus1: false,
focus2: false
}
@@ -217,7 +232,7 @@
//padding: 12px 5px 12px 15px;
color: #000;;
height: 47px;
- caret-color: $cursor;//鏀瑰彉鍏夋爣棰滆壊
+ caret-color: $cursor; //鏀瑰彉鍏夋爣棰滆壊
&:-webkit-autofill {
box-shadow: 0 0 0px 1000px $bg inset !important;
@@ -240,18 +255,16 @@
$bg: #2d3a4b;
$dark_gray: #889aa4;
$light_gray: #eee;
+$main_color: #42b983;
.login-container {
min-height: 100%;
width: 100%;
- background-color: $bg;
+ //background-color: $bg;
overflow: hidden;
- background: url("../../assets/images/login_bg2.jpg") no-repeat;
+ background: url("../../assets/images/login_bg.png") no-repeat;
background-size: 100% 100%;
- opacity: 0.8;
- // ::v-deep input {
- // color: #000;
- //}
+ opacity: 1;
.login-container-center {
width: 1000px;
@@ -348,27 +361,27 @@
// border: 1px solid red;
//}
- ::v-deep .el-input__inner{
+ ::v-deep .el-input__inner {
border-radius: 5px;
background: #ffffff;
padding-left: 35px;
line-height: 40px;
- border: 1px solid #eee;
+ border: 1px solid #eee;
}
- ::v-deep .el-input__icon{
+ ::v-deep .el-input__icon {
color: #000;
}
- ::v-deep .el-input__inner:focus{
- border: 1px solid #42b983;
+ ::v-deep .el-input__inner:focus {
+ border: 1px solid $main_color;
}
- ::v-deep .el-input__icon:focus{
- color: #42b983;
+ ::v-deep .el-input__icon:focus {
+ color: $main_color;
}
- ::v-deep .el-input input:-webkit-autofill{
+ ::v-deep .el-input input:-webkit-autofill {
-webkit-box-shadow: 0 0 0px 1000px #fff inset !important;
box-shadow: 0 0 0px 1000px #fff inset !important;
-webkit-text-fill-color: #000 !important;
--
Gitblit v1.9.3