Browse Source

登录页

Signed-off-by: lijunqing <lijunqing@dashoo.cn>
lijunqing 6 years ago
parent
commit
4d5b0a0f0c
1 changed files with 98 additions and 80 deletions
  1. 98 80
      src/dashoo.cn/frontend_web/src/pages/login.vue

+ 98 - 80
src/dashoo.cn/frontend_web/src/pages/login.vue

@@ -2,24 +2,29 @@
   <div style="width: 100%; overflow-y: auto; background-color: white">
   <div style="width: 100%; overflow-y: auto; background-color: white">
     <sticky v-if="activeIndex==1 || activeIndex==2">
     <sticky v-if="activeIndex==1 || activeIndex==2">
       <div class="top-wrapper">
       <div class="top-wrapper">
-          <router-link to="/">
-            <img src="../assets/img/title_login.png" style="height:100px; margin-top: 2px;">
-          </router-link>
-
+        <router-link to="/">
+          <img src="../assets/img/title_login.png"
+               style="height:100px; margin-top: 2px;">
+        </router-link>
 
 
         <div style="float: right;">
         <div style="float: right;">
           <router-link :to="'/signup'">
           <router-link :to="'/signup'">
-            <el-button type="text" round>没有账户?请注册</el-button>
+            <el-button type="text"
+                       round>没有账户?请注册</el-button>
           </router-link>
           </router-link>
 
 
-          <el-button type="info" size="small" round @click="activeIndex=0">登录系统</el-button>
+          <el-button type="info"
+                     size="small"
+                     round
+                     @click="activeIndex=0">登录系统</el-button>
         </div>
         </div>
       </div>
       </div>
     </sticky>
     </sticky>
 
 
     <div v-if="activeIndex==0">
     <div v-if="activeIndex==0">
       <div class="top-wrapper">
       <div class="top-wrapper">
-        <img src="../assets/img/title_login.png" style="height:100px; margin-top: 2px; margin-left: -250px;">
+        <img src="../assets/img/title_login.png"
+             style="height:100px; margin-top: 2px; margin-left: -250px;">
       </div>
       </div>
       <div class="back-width">
       <div class="back-width">
         <div class="login-body">
         <div class="login-body">
@@ -33,7 +38,10 @@
               <!--<div slot="header" class="clearfix">
               <!--<div slot="header" class="clearfix">
                 <span style="font-weight: bold;">用户登录</span>
                 <span style="font-weight: bold;">用户登录</span>
               </div>-->
               </div>-->
-              <el-menu size="small" :default-active="activeIndex+''" @select="handleSelect" mode="horizontal">
+              <el-menu size="small"
+                       :default-active="activeIndex+''"
+                       @select="handleSelect"
+                       mode="horizontal">
                 <el-menu-item index="0">
                 <el-menu-item index="0">
                   <i class="el-icon-tickets"></i>
                   <i class="el-icon-tickets"></i>
                   <span><b>登录</b></span>
                   <span><b>登录</b></span>
@@ -56,66 +64,69 @@
                   </div>
                   </div>
                 </el-col>-->
                 </el-col>-->
                 <el-col :span="24">
                 <el-col :span="24">
-                  <el-form
-                    class="login-form"
-                    auto-complete="off"
-                    :model="model"
-                    :rules="rules"
-                    ref="user"
-                    label-position="left"
-
-                  >
-                    <el-form-item label="用户名" prop="username">
-                      <el-input type="text" v-model="model.username" placeholder="请输入用户名">
-                        <el-select
-                          v-model="loginMode"
-                          slot="append"
-                          placeholder="登录类型"
-                          style="width: 110px;"
-                        >
-                          <el-option label="PTR认证" :value="2"></el-option>
-                          <el-option label="普通账户" :value="1"></el-option>
+                  <el-form class="login-form"
+                           auto-complete="off"
+                           :model="model"
+                           :rules="rules"
+                           ref="user"
+                           label-position="left">
+                    <el-form-item label="用户名"
+                                  prop="username">
+                      <el-input type="text"
+                                v-model="model.username"
+                                placeholder="请输入用户名">
+                        <el-select v-model="loginMode"
+                                   slot="append"
+                                   placeholder="登录类型"
+                                   style="width: 110px;">
+                          <el-option label="PTR认证"
+                                     :value="2"></el-option>
+                          <el-option label="普通账户"
+                                     :value="1"></el-option>
                         </el-select>
                         </el-select>
                       </el-input>
                       </el-input>
                     </el-form-item>
                     </el-form-item>
-                    <el-form-item label="密码" prop="password">
-                      <el-input
-                        type="password"
-                        v-model="model.password"
-                        placeholder="请输入密码"
-                      />
+                    <el-form-item label="密码"
+                                  prop="password">
+                      <el-input type="password"
+                                v-model="model.password"
+                                placeholder="请输入密码" />
                     </el-form-item>
                     </el-form-item>
                     <el-row>
                     <el-row>
                       <el-col :span="16">
                       <el-col :span="16">
-                        <el-form-item label="验证码" prop="verifycode">
-                          <el-input v-model="model.verifycode" placeholder="请输入验证码" @keyup.enter.native="loginall()"></el-input>
+                        <el-form-item label="验证码"
+                                      prop="verifycode">
+                          <el-input v-model="model.verifycode"
+                                    placeholder="请输入验证码"
+                                    @keyup.enter.native="loginall()"></el-input>
                         </el-form-item>
                         </el-form-item>
                       </el-col>
                       </el-col>
                       <el-col :span="8">
                       <el-col :span="8">
                         <el-form-item>
                         <el-form-item>
-                            <div class="identifybox">
-                              <div @click="refreshCode" title="看不清,换一张">
-                                <s-identify :identifyCode="identifyCode"></s-identify>
-                              </div>
-                              <!-- <el-button @click="refreshCode" type='text' class="textbtn">看不清,换一张</el-button> -->
+                          <div class="identifybox">
+                            <div @click="refreshCode"
+                                 title="看不清,换一张">
+                              <s-identify :identifyCode="identifyCode"></s-identify>
                             </div>
                             </div>
+                            <!-- <el-button @click="refreshCode" type='text' class="textbtn">看不清,换一张</el-button> -->
+                          </div>
                         </el-form-item>
                         </el-form-item>
                       </el-col>
                       </el-col>
                     </el-row>
                     </el-row>
-                    <el-button
-                      type="primary"
-                      :loading="loading"
-                      @click="loginall()"
-                    >{{ loading ? '登录中...' : '登录' }}</el-button>
+                    <el-button type="primary"
+                               :loading="loading"
+                               @click="loginall()">{{ loading ? '登录中...' : '登录' }}</el-button>
                     <el-row>
                     <el-row>
                       <el-col :span="12">
                       <el-col :span="12">
                         <router-link :to="'/signup'">
                         <router-link :to="'/signup'">
-                          <el-button type="text" round>没有账户?请注册</el-button>
+                          <el-button type="text"
+                                     round>没有账户?请注册</el-button>
                         </router-link>
                         </router-link>
                       </el-col>
                       </el-col>
                       <el-col :span="12">
                       <el-col :span="12">
                         <router-link :to="'/passwordback'">
                         <router-link :to="'/passwordback'">
-                          <el-button type="text" round>忘记密码?</el-button>
+                          <el-button type="text"
+                                     round>忘记密码?</el-button>
                         </router-link>
                         </router-link>
                       </el-col>
                       </el-col>
                     </el-row>
                     </el-row>
@@ -130,21 +141,23 @@
     </div>
     </div>
 
 
     <div v-if="activeIndex==1">
     <div v-if="activeIndex==1">
-      <div
-        class="components-container home-wrapper"
-        style="background-color: white;">
-        <el-table
-          :data="noticeList"
-          height="50%"
-          style="width: 100%; height: 100vh;"
-        >
-          <el-table-column prop="Name" label="通知标题">
+      <div class="components-container home-wrapper"
+           style="background-color: white;">
+        <el-table :data="noticeList"
+                  height="50%"
+                  style="width: 100%; height: 100vh;">
+          <el-table-column prop="Name"
+                           label="通知标题">
             <template slot-scope="scope">
             <template slot-scope="scope">
               <!--<i class="el-icon-caret-right"></i>-->
               <!--<i class="el-icon-caret-right"></i>-->
-              <el-link :href="getDownloadFile(scope.row.FileURL)"  target="_blank" type="primary">{{ scope.row.Name }}</el-link>
+              <el-link :href="getDownloadFile(scope.row.FileURL)"
+                       target="_blank"
+                       type="primary">{{ scope.row.Name }}</el-link>
             </template>
             </template>
           </el-table-column>
           </el-table-column>
-          <el-table-column prop="CreateOn" label="时间" width="141">
+          <el-table-column prop="CreateOn"
+                           label="时间"
+                           width="141">
             <template slot-scope="scope">{{ jstimehandle(scope.row.CreateOn+'') }}</template>
             <template slot-scope="scope">{{ jstimehandle(scope.row.CreateOn+'') }}</template>
           </el-table-column>
           </el-table-column>
         </el-table>
         </el-table>
@@ -152,21 +165,23 @@
     </div>
     </div>
 
 
     <div v-if="activeIndex==2">
     <div v-if="activeIndex==2">
-      <div
-        class="components-container home-wrapper"
-        style="background-color: white">
-        <el-table
-          :data="fileList"
-          height="50%"
-          style="width: 100%;  height: 100vh;"
-        >
-          <el-table-column prop="Name" label="文件名">
+      <div class="components-container home-wrapper"
+           style="background-color: white">
+        <el-table :data="fileList"
+                  height="50%"
+                  style="width: 100%;  height: 100vh;">
+          <el-table-column prop="Name"
+                           label="文件名">
             <template slot-scope="scope">
             <template slot-scope="scope">
               <!--<i class="el-icon-caret-right"></i>-->
               <!--<i class="el-icon-caret-right"></i>-->
-              <el-link :href="getDownloadFile(scope.row.FileURL)"  target="_blank" type="primary">{{ scope.row.Name }}</el-link>
+              <el-link :href="getDownloadFile(scope.row.FileURL)"
+                       target="_blank"
+                       type="primary">{{ scope.row.Name }}</el-link>
             </template>
             </template>
           </el-table-column>
           </el-table-column>
-          <el-table-column prop="CreateOn" label="时间" width="141">
+          <el-table-column prop="CreateOn"
+                           label="时间"
+                           width="141">
             <template slot-scope="scope">{{ jstimehandle(scope.row.CreateOn+'') }}</template>
             <template slot-scope="scope">{{ jstimehandle(scope.row.CreateOn+'') }}</template>
           </el-table-column>
           </el-table-column>
         </el-table>
         </el-table>
@@ -174,7 +189,8 @@
     </div>
     </div>
 
 
     <div>
     <div>
-      <footer class="login-footer" style="color:#A9A9A9">
+      <footer class="login-footer"
+              style="color:#A9A9A9">
         ©企业法规处 版权所有
         ©企业法规处 版权所有
       </footer>
       </footer>
     </div>
     </div>
@@ -455,16 +471,16 @@ export default class Login extends Vue {
 @import "../assets/styles/base/variables";
 @import "../assets/styles/base/variables";
 
 
 .el-form-item {
 .el-form-item {
-  margin-bottom: 2px;
+  margin-bottom: 10px;
 }
 }
 
 
-.identifybox{
-  margin-top:42px;
+.identifybox {
+  margin-top: 42px;
   margin-left: 20px;
   margin-left: 20px;
 }
 }
 
 
-.identifybox:hover{
-  cursor:pointer;
+.identifybox:hover {
+  cursor: pointer;
 }
 }
 .components-container div {
 .components-container div {
   margin-top: 20px;
   margin-top: 20px;
@@ -557,10 +573,12 @@ export default class Login extends Vue {
 }
 }
 
 
 .login-body {
 .login-body {
-  background: url("../assets/img/gf20190628.png") no-repeat  left;
+  background: url("../assets/img/gf20190628.png");
   font-family: "Open Sans", sans-serif;
   font-family: "Open Sans", sans-serif;
-  background-color: white; /*#3273FC*/
-  background-size: cover;
+  background-repeat: no-repeat;
+  background-position: center;
+  background-color: #aecdea; /*#3273FC*/
+  background-size: auto 520px;
 
 
   /*background-size: cover;
   /*background-size: cover;
     -webkit-background-size: cover;
     -webkit-background-size: cover;
@@ -574,7 +592,7 @@ export default class Login extends Vue {
   right: 0;
   right: 0;
   top: 0;
   top: 0;
   width: 100%;
   width: 100%;
-  height: 580px;
+  height: 520px;
 
 
   /*margin: auto;
   /*margin: auto;
   left: 0px;
   left: 0px;
@@ -605,7 +623,7 @@ export default class Login extends Vue {
   width: 100%;*/
   width: 100%;*/
   position: relative;
   position: relative;
   max-width: 27rem;
   max-width: 27rem;
-  top: 60px;
+  top: 20px;
   left: 55%;
   left: 55%;
   margin-left: 100px;
   margin-left: 100px;
   font-size: 0.875rem;
   font-size: 0.875rem;