浏览代码

style:修改回原来的登入页,但是首页不知道展示什么

sakura 1 年之前
父节点
当前提交
53dde9f8da
共有 2 个文件被更改,包括 78 次插入103 次删除
  1. 20 3
      school-in-out-ui/src/views/index.vue
  2. 58 100
      school-in-out-ui/src/views/login.vue

+ 20 - 3
school-in-out-ui/src/views/index.vue

@@ -1,9 +1,26 @@
 <template>
   <div class="dashboard-editor-container">
+    <el-row :gutter="12">
+      <el-col :span="8">
+        <el-card shadow="always">
+          暂无内容
+        </el-card>
+      </el-col>
+      <el-col :span="8">
+        <el-card shadow="hover">
+          暂无内容
+        </el-card>
+      </el-col>
+      <el-col :span="8">
+        <el-card shadow="never">
+          暂无内容
+        </el-card>
+      </el-col>
+    </el-row>
 
-    <panel-group @handleSetLineChartData="handleSetLineChartData" />
+    <!-- <panel-group @handleSetLineChartData="handleSetLineChartData" /> -->
 
-    <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
+    <!-- <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
       <line-chart :chart-data="lineChartData" />
     </el-row>
 
@@ -23,7 +40,7 @@
           <bar-chart />
         </div>
       </el-col>
-    </el-row>
+    </el-row> -->
 
     
   </div>

+ 58 - 100
school-in-out-ui/src/views/login.vue

@@ -1,85 +1,59 @@
 <template>
   <div class="login">
-    <div class="container">
-      <el-form
-        ref="loginForm"
-        :model="loginForm"
-        :rules="loginRules"
-        class="login-form"
-      >
-        <h3 class="title">学生进出校管理平台</h3>
-        <el-form-item prop="username">
-          <el-input
-            v-model="loginForm.username"
-            type="text"
-            auto-complete="off"
-            placeholder="账号"
-          >
-            <svg-icon
-              slot="prefix"
-              icon-class="user"
-              class="el-input__icon input-icon"
-            />
-          </el-input>
-        </el-form-item>
-        <el-form-item prop="password">
-          <el-input
-            v-model="loginForm.password"
-            type="password"
-            auto-complete="off"
-            placeholder="密码"
-            @keyup.enter.native="handleLogin"
-          >
-            <svg-icon
-              slot="prefix"
-              icon-class="password"
-              class="el-input__icon input-icon"
-            />
-          </el-input>
-        </el-form-item>
-        <el-form-item prop="code" v-if="captchaEnabled">
-          <el-input
-            v-model="loginForm.code"
-            auto-complete="off"
-            placeholder="验证码"
-            style="width: 63%"
-            @keyup.enter.native="handleLogin"
-          >
-            <svg-icon
-              slot="prefix"
-              icon-class="validCode"
-              class="el-input__icon input-icon"
-            />
-          </el-input>
-          <div class="login-code">
-            <img :src="codeUrl" @click="getCode" class="login-code-img" />
-          </div>
-        </el-form-item>
-        <el-checkbox
-          v-model="loginForm.rememberMe"
-          style="margin: 0px 0px 25px 0px"
-          >记住密码</el-checkbox
+    <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
+      <h3 class="title">学生进出校管理平台</h3>
+      <el-form-item prop="username">
+        <el-input
+          v-model="loginForm.username"
+          type="text"
+          auto-complete="off"
+          placeholder="账号"
         >
-        <el-form-item style="width: 100%">
-          <el-button
-            :loading="loading"
-            size="medium"
-            type="primary"
-            style="width: 100%"
-            @click.native.prevent="handleLogin"
-          >
-            <span v-if="!loading">登 录</span>
-            <span v-else>登 录 中...</span>
-          </el-button>
-          <div style="float: right" v-if="register">
-            <router-link class="link-type" :to="'/register'"
-              >立即注册</router-link
-            >
-          </div>
-        </el-form-item>
-      </el-form>
-    </div>
-
+          <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
+        </el-input>
+      </el-form-item>
+      <el-form-item prop="password">
+        <el-input
+          v-model="loginForm.password"
+          type="password"
+          auto-complete="off"
+          placeholder="密码"
+          @keyup.enter.native="handleLogin"
+        >
+          <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
+        </el-input>
+      </el-form-item>
+      <el-form-item prop="code" v-if="captchaEnabled">
+        <el-input
+          v-model="loginForm.code"
+          auto-complete="off"
+          placeholder="验证码"
+          style="width: 63%"
+          @keyup.enter.native="handleLogin"
+        >
+          <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
+        </el-input>
+        <div class="login-code">
+          <img :src="codeUrl" @click="getCode" class="login-code-img"/>
+        </div>
+      </el-form-item>
+      <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
+      <el-form-item style="width:100%;">
+        <el-button
+          :loading="loading"
+          size="medium"
+          type="primary"
+          style="width:100%;"
+          @click.native.prevent="handleLogin"
+        >
+          <span v-if="!loading">登 录</span>
+          <span v-else>登 录 中...</span>
+        </el-button>
+        <div style="float: right;" v-if="register">
+          <router-link class="link-type" :to="'/register'">立即注册</router-link>
+        </div>
+      </el-form-item>
+    </el-form>
     <!--  底部  -->
     <div class="el-login-footer">
       <span>网站备案</span>
@@ -191,27 +165,13 @@ export default {
 </script>
 
 <style rel="stylesheet/scss" lang="scss">
-.login-form .el-input input {
-  color: #000;
-  height: 38px;
-  font-size: 16px;
-}
-.container {
-  width: 85%;
-  height: 85%;
-  background: url("../assets/images/a.jpg") no-repeat;
-  background-size: cover;
-  border-radius: 5px;
-  display: flex;
-  justify-content: end;
-  align-items: center;
-}
 .login {
   display: flex;
   justify-content: center;
   align-items: center;
   height: 100%;
-  background-color: #f8f7f7;
+  background-image: url("../assets/images/login-background.jpg");
+  background-size: cover;
 }
 .title {
   margin: 0px auto 30px auto;
@@ -220,11 +180,9 @@ export default {
 }
 
 .login-form {
-  margin-right: 30px;
-  border-radius: 15px;
-  background: rgba($color: #ffffff, $alpha: 0.6);
+  border-radius: 6px;
+  background: #ffffff;
   width: 400px;
-  height: 60%;
   padding: 25px 25px 5px 25px;
   .el-input {
     height: 38px;
@@ -267,4 +225,4 @@ export default {
 .login-code-img {
   height: 38px;
 }
-</style>
+</style>