Browse Source

登陆界面

shihang 6 năm trước cách đây
mục cha
commit
4f38a377cf

+ 2 - 2
src/dashoo.cn/frontend_web/nuxt.config.js

@@ -159,8 +159,8 @@ module.exports = {
   },
 
   axios: {
-    baseURL: '//localhost:9081/api/' // 本机开发使用
-    // baseURL: '//47.92.238.200:9081/api/' // BioBank on ALi发布使用
+    // baseURL: '//localhost:9081/api/' // 本机开发使用
+    baseURL: '//47.92.238.200:9081/api/' // BioBank on ALi发布使用
     // baseURL: '//188.188.30.89:9081/api/' //临沂使用
     // baseURL: '//api09.labsop.cn/api/'
     // baseURL: '//192.168.0.211:10091/api/' // 花生所系统

BIN
src/dashoo.cn/frontend_web/src/assets/img/basic.png


BIN
src/dashoo.cn/frontend_web/src/assets/img/left_dagang.png


BIN
src/dashoo.cn/frontend_web/src/assets/img/logo3.png


BIN
src/dashoo.cn/frontend_web/src/assets/img/major.png


BIN
src/dashoo.cn/frontend_web/src/assets/img/std.png


BIN
src/dashoo.cn/frontend_web/src/assets/img/std2.png


BIN
src/dashoo.cn/frontend_web/src/assets/img/title_dagang.png


BIN
src/dashoo.cn/frontend_web/src/assets/img/title_gongfang.png


+ 59 - 77
src/dashoo.cn/frontend_web/src/pages/login.vue

@@ -1,7 +1,9 @@
 <template>
   <div class="nav">
     <header>
-      <a href="/" class="nav-logo leftpadding" alt="egg"><img src="../assets/img/logo.png" style="height:55px;"></a>
+      <a href="/" class="nav-logo leftpadding" alt="egg">
+        <img src="../assets/img/logo.png" style="height:55px;">
+      </a>
       <ul class="nav-item">
         <li><a href="http://www.dashoo.cn/product-3-1.html" alt="介绍">产品中心</a></li>
         <li><a href="http://www.dashoo.cn/service-2-1.html" alt="其他">解决方案</a></li>
@@ -22,16 +24,11 @@
             <img src="../assets/img/basic.png" class="intelligent-img" /> </div>
         </el-col>
         <el-col :span="9">
-          <el-card class="box-card" style="width: 300px;margin-top: 160px;height: 350px;">
+          <el-card class="box-card" style="width: 300px;margin-top: 130px;height: 360px;">
             <el-form class="login-form" auto-complete="off" :model="model" :rules="rules" ref="user">
               <h2 class="heading">登录</h2>
               <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="普通账户" :value="1"></el-option>
-                    <el-option label="PTR认证" :value="2"></el-option>
-                  </el-select>
-                </el-input>
+                <el-input type="text" v-model="model.username" placeholder="请输入用户名"></el-input>
               </el-form-item>
               <el-form-item label="密码" prop="password">
                 <el-input type="password" v-model="model.password" placeholder="请输入密码" @keyup.enter.native="login()" />
@@ -39,33 +36,32 @@
               <el-button type="primary" :loading="loading" @click="login()">{{ loading ? '登录中...' : '登录' }}</el-button>
             </el-form>
           </el-card>
-
         </el-col>
       </el-row>
     </div>
 
     <div class="footer">
-      <footer style="background: #F9F9F9;">
+      <footer>
         <el-row>
           <el-col :span="12">
             <div class="login_bg4">
-              <img src="../assets/img/logo2.png" class="logolabsop-img">
+              <img src="../assets/img/logo3.png" class="logodashoo-img">
             </div>
           </el-col>
-          <el-col :span="10">
+          <el-col :span="7.5">
             <div>
               <el-row class="coptright">
-                <a href="http://www.dashoo.cn" target="_blank">关于我们</a>
-                <a href="http://www.dashoo.cn" target="_blank">公司简介</a>
-                <a href="http://www.dashoo.cn" target="_blank">免责声明</a>
-                <a href="http://www.dashoo.cn" target="_blank">隐私政策</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 关于我们 |</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 公司简介 |</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 免责声明 |</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 隐私政策 |</a>
               </el-row>
               <el-row>
                 <div class="license">青岛大数华创科技有限公司版权所有 Coptright @ 2019 DASHOO.</div>
               </el-row>
             </div>
           </el-col>
-          <el-col :span="2">
+          <el-col :span="4.5">
             <div class="login_bg5">
               <img src="../assets/img/QRcode.png" class="weixin-img">
             </div>
@@ -81,14 +77,11 @@
   import Component from 'class-component'
   @Component({
     data() {
-      // form model
-      // TODO: remove default values
       const model = {
         username: '',
         password: ''
       }
 
-      // form validate rules
       const rules = {
         username: [{
           required: true,
@@ -101,7 +94,6 @@
       }
 
       return {
-        loginMode: 1,
         model: model,
         rules: rules,
         error: null,
@@ -133,7 +125,6 @@
             }
           }
         } catch (e) {
-          // this.$message.warning(e.message)
           this.$message.warning('账号或密码错误')
         } finally {
           this.logging = false
@@ -155,18 +146,14 @@
     border-bottom: 1px solid rgba(230, 230, 230, 0.99);
     z-index: 2;
     width: 100%;
+    // min-height: 1100px;
     position: fixed;
     top: 0;
   }
 
-  .nav {
-    min-width: 1100px;
-    min-height: 600px;
-  }
-
   .nav .nav-logo {
     padding-top: 2px;
-    padding-left: 35px;
+    padding-left: 250px;
   }
 
   .nav-logo {
@@ -178,31 +165,32 @@
 
   .nav header {
     padding: 0px 0 0px;
-    min-width: 1100px;
+    height: 65px;
+    width: 100%;
     margin: 0 auto;
   }
 
-  .nav header .search-query {
-    height: 30px;
-    line-height: 32px;
-    box-sizing: border-box;
-    border: 1px solid #e6e6e6;
-    border-radius: 15px;
-    outline: none;
-    padding: 0 15px 0 32px;
-    background-size: 20px;
-  }
+  // .nav header .search-query {
+  //   height: 30px;
+  //   line-height: 32px;
+  //   box-sizing: border-box;
+  //   border: 1px solid #e6e6e6;
+  //   border-radius: 15px;
+  //   outline: none;
+  //   padding: 0 15px 0 32px;
+  //   background-size: 20px;
+  // }
 
   .nav ul.nav-item {
     height: 32px;
-    float: right;
+    float: left;
     line-height: 32px;
-    padding-right: 0px;
+    padding-left: 390px;
   }
 
   .nav ul.nav-item li {
     display: inline-block;
-    margin-left: 40px;
+    margin-left: 45px;
   }
 
   .nav ul.nav-item a {
@@ -216,7 +204,9 @@
     text-align: center;
     background: url("../assets/img/Background.png");
     width: 100%;
-    height: 150%;
+    // height: 150%;
+    min-height: 575px;
+    height: calc(100vh - 200px);
     margin: 0 auto;
     background-size: cover;
   }
@@ -227,8 +217,9 @@
   }
 
   .intelligent-img {
-    width: 650px;
-    margin-top: -40px;
+    width: 600px;
+    margin-bottom: 2.5rem;
+    margin-top: -30px;
   }
 
   .box-card {
@@ -239,6 +230,7 @@
   .footer {
     min-width: 1100px;
     width: 100%;
+    height:calc(100vh - 500px);
   }
 
   .footer a {
@@ -247,25 +239,27 @@
 
   .footer footer {
     overflow: hidden;
-    // max-width: 1136px;
-    max-width: 1480px;
+    min-width: 1136px;
+    // max-width: 1550px;
     margin: 0 auto;
     padding-top: 0px;
     padding-bottom: 30px;
   }
 
   .coptright {
-    padding-top: 40px;
+    padding-top: 30px;
     padding-left: 150px;
   }
 
   .login_bg4 {
-    padding-left: 100px;
-    padding-top: 5%;
+    float: right;
+    // padding-left: 220px;
+    padding-right: 350px;
+    padding-top: 15px;
   }
 
-  .logolabsop-img {
-    width: 400px;
+  .logodashoo-img {
+    width: 180px;
   }
 
   .license {
@@ -277,7 +271,7 @@
   }
 
   .login_bg5 {
-    padding-right: 10px;
+    //padding-left: 0px;
     float: left;
     padding-top: 10px;
   }
@@ -286,30 +280,18 @@
     width: 77px;
   }
 
-  .nav ul.nav-item {
-    height: 32px;
-    float: left;
-    line-height: 32px;
-    padding-left: 350px;
-  }
-
-  // .logu {
-
-  //   margin-top: 100px;
-  //   // padding-left: 120px;
-  // }
-
-
-
-  // .login {
-  //   &-form {
-  //     // position: absolute;
+  .login {
+    &-form {
+      .heading {
+        text-align: center;
+        color: #1c96ff;
+      }
 
-  //     .el-button {
-  //       margin-top: 0.5rem;
-  //       width: 100%;
-  //     }
-  //   }
-  // }
+      .el-button {
+        margin-top: 0.5rem;
+        width: 100%;
+      }
+    }
+  }
 
 </style>

+ 51 - 72
src/dashoo.cn/frontend_web/src/pages/login_major.vue

@@ -1,7 +1,9 @@
 <template>
   <div class="nav">
     <header>
-      <a href="/" class="nav-logo leftpadding" alt="egg"><img src="../assets/img/logo.png" style="height:55px;"></a>
+      <a href="/" class="nav-logo leftpadding" alt="egg">
+        <img src="../assets/img/logo.png" style="height:55px; margin-left: 200px">
+      </a>
       <ul class="nav-item">
         <li><a href="http://www.dashoo.cn/product-3-1.html" alt="介绍">产品中心</a></li>
         <li><a href="http://www.dashoo.cn/service-2-1.html" alt="其他">解决方案</a></li>
@@ -22,16 +24,11 @@
             <img src="../assets/img/major.png" class="intelligent-img" /> </div>
         </el-col>
         <el-col :span="9">
-          <el-card class="box-card" style="width: 300px;margin-top: 160px;height: 350px;">
+          <el-card class="box-card" style="width: 300px;margin-top: 130px;height: 360px;">
             <el-form class="login-form" auto-complete="off" :model="model" :rules="rules" ref="user">
               <h2 class="heading">登录</h2>
               <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="普通账户" :value="1"></el-option>
-                    <el-option label="PTR认证" :value="2"></el-option>
-                  </el-select>
-                </el-input>
+                <el-input type="text" v-model="model.username" placeholder="请输入用户名"></el-input>
               </el-form-item>
               <el-form-item label="密码" prop="password">
                 <el-input type="password" v-model="model.password" placeholder="请输入密码" @keyup.enter.native="login()" />
@@ -39,7 +36,6 @@
               <el-button type="primary" :loading="loading" @click="login()">{{ loading ? '登录中...' : '登录' }}</el-button>
             </el-form>
           </el-card>
-
         </el-col>
       </el-row>
     </div>
@@ -49,23 +45,23 @@
         <el-row>
           <el-col :span="12">
             <div class="login_bg4">
-              <img src="../assets/img/logo2.png" class="logolabsop-img">
+              <img src="../assets/img/logo3.png" class="logodashoo-img">
             </div>
           </el-col>
-          <el-col :span="10">
+          <el-col :span="7.5">
             <div>
               <el-row class="coptright">
-                <a href="http://www.dashoo.cn" target="_blank">关于我们</a>
-                <a href="http://www.dashoo.cn" target="_blank">公司简介</a>
-                <a href="http://www.dashoo.cn" target="_blank">免责声明</a>
-                <a href="http://www.dashoo.cn" target="_blank">隐私政策</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 关于我们 |</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 公司简介 |</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 免责声明 |</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 隐私政策 |</a>
               </el-row>
               <el-row>
                 <div class="license">青岛大数华创科技有限公司版权所有 Coptright @ 2019 DASHOO.</div>
               </el-row>
             </div>
           </el-col>
-          <el-col :span="2">
+          <el-col :span="4.5">
             <div class="login_bg5">
               <img src="../assets/img/QRcode.png" class="weixin-img">
             </div>
@@ -81,14 +77,11 @@
   import Component from 'class-component'
   @Component({
     data() {
-      // form model
-      // TODO: remove default values
       const model = {
         username: '',
         password: ''
       }
 
-      // form validate rules
       const rules = {
         username: [{
           required: true,
@@ -101,7 +94,6 @@
       }
 
       return {
-        loginMode: 1,
         model: model,
         rules: rules,
         error: null,
@@ -155,18 +147,14 @@
     border-bottom: 1px solid rgba(230, 230, 230, 0.99);
     z-index: 2;
     width: 100%;
+    min-height: 1100px;
     position: fixed;
     top: 0;
   }
 
-  .nav {
-    min-width: 1100px;
-    min-height: 600px;
-  }
-
   .nav .nav-logo {
     padding-top: 2px;
-    padding-left: 35px;
+    padding-left: 20px;
   }
 
   .nav-logo {
@@ -178,31 +166,32 @@
 
   .nav header {
     padding: 0px 0 0px;
-    min-width: 1100px;
+    height: 65px;
+    width: 100%;
     margin: 0 auto;
   }
 
-  .nav header .search-query {
-    height: 30px;
-    line-height: 32px;
-    box-sizing: border-box;
-    border: 1px solid #e6e6e6;
-    border-radius: 15px;
-    outline: none;
-    padding: 0 15px 0 32px;
-    background-size: 20px;
-  }
+  // .nav header .search-query {
+  //   height: 30px;
+  //   line-height: 32px;
+  //   box-sizing: border-box;
+  //   border: 1px solid #e6e6e6;
+  //   border-radius: 15px;
+  //   outline: none;
+  //   padding: 0 15px 0 32px;
+  //   background-size: 20px;
+  // }
 
   .nav ul.nav-item {
     height: 32px;
-    float: right;
+    float: left;
     line-height: 32px;
-    padding-right: 0px;
+    padding-left: 405px;
   }
 
   .nav ul.nav-item li {
     display: inline-block;
-    margin-left: 40px;
+    margin-left: 45px;
   }
 
   .nav ul.nav-item a {
@@ -219,6 +208,7 @@
     height: 150%;
     margin: 0 auto;
     background-size: cover;
+    // position: relative;
   }
 
   .leftpadding {
@@ -227,8 +217,9 @@
   }
 
   .intelligent-img {
-    width: 650px;
-    margin-top: -50px;
+    width: 600px;
+    margin-bottom: 2.5rem;
+    margin-top: -30px;
   }
 
   .box-card {
@@ -248,24 +239,24 @@
   .footer footer {
     overflow: hidden;
     // max-width: 1136px;
-    max-width: 1480px;
+    max-width: 1550px;
     margin: 0 auto;
     padding-top: 0px;
     padding-bottom: 30px;
   }
 
   .coptright {
-    padding-top: 40px;
+    padding-top: 30px;
     padding-left: 150px;
   }
 
   .login_bg4 {
-    padding-left: 100px;
-    padding-top: 5%;
+    padding-left: 220px;
+    padding-top: 15px;
   }
 
-  .logolabsop-img {
-    width: 400px;
+  .logodashoo-img {
+    width: 180px;
   }
 
   .license {
@@ -277,7 +268,7 @@
   }
 
   .login_bg5 {
-    padding-right: 10px;
+    //padding-left: 0px;
     float: left;
     padding-top: 10px;
   }
@@ -286,30 +277,18 @@
     width: 77px;
   }
 
-  .nav ul.nav-item {
-    height: 32px;
-    float: left;
-    line-height: 32px;
-    padding-left: 350px;
+  .login {
+    &-form {
+      .el-button {
+        margin-top: 0.5rem;
+        width: 100%;
+      }
+    }
   }
 
-  // .logu {
-
-  //   margin-top: 100px;
-  //   // padding-left: 120px;
-  // }
-
-
-
-  // .login {
-  //   &-form {
-  //     // position: absolute;
-
-  //     .el-button {
-  //       margin-top: 0.5rem;
-  //       width: 100%;
-  //     }
-  //   }
-  // }
+  .heading {
+    text-align: center;
+    color: #1c96ff;
+  }
 
 </style>

+ 46 - 72
src/dashoo.cn/frontend_web/src/pages/login_std.vue

@@ -1,7 +1,9 @@
 <template>
   <div class="nav">
     <header>
-      <a href="/" class="nav-logo leftpadding" alt="egg"><img src="../assets/img/logo.png" style="height:55px;"></a>
+      <a href="/" class="nav-logo leftpadding" alt="egg">
+        <img src="../assets/img/logo.png" style="height:55px; margin-left: 200px">
+      </a>
       <ul class="nav-item">
         <li><a href="http://www.dashoo.cn/product-3-1.html" alt="介绍">产品中心</a></li>
         <li><a href="http://www.dashoo.cn/service-2-1.html" alt="其他">解决方案</a></li>
@@ -22,16 +24,11 @@
             <img src="../assets/img/std.png" class="intelligent-img" /> </div>
         </el-col>
         <el-col :span="9">
-          <el-card class="box-card" style="width: 300px;margin-top: 160px;height: 350px;">
+          <el-card class="box-card" style="width: 300px;margin-top: 130px;height: 360px;">
             <el-form class="login-form" auto-complete="off" :model="model" :rules="rules" ref="user">
               <h2 class="heading">登录</h2>
               <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="普通账户" :value="1"></el-option>
-                    <el-option label="PTR认证" :value="2"></el-option>
-                  </el-select>
-                </el-input>
+                <el-input type="text" v-model="model.username" placeholder="请输入用户名"></el-input>
               </el-form-item>
               <el-form-item label="密码" prop="password">
                 <el-input type="password" v-model="model.password" placeholder="请输入密码" @keyup.enter.native="login()" />
@@ -39,7 +36,6 @@
               <el-button type="primary" :loading="loading" @click="login()">{{ loading ? '登录中...' : '登录' }}</el-button>
             </el-form>
           </el-card>
-
         </el-col>
       </el-row>
     </div>
@@ -49,23 +45,23 @@
         <el-row>
           <el-col :span="12">
             <div class="login_bg4">
-              <img src="../assets/img/logo2.png" class="logolabsop-img">
+              <img src="../assets/img/logo3.png" class="logodashoo-img">
             </div>
           </el-col>
-          <el-col :span="10">
+          <el-col :span="7.5">
             <div>
               <el-row class="coptright">
-                <a href="http://www.dashoo.cn" target="_blank">关于我们</a>
-                <a href="http://www.dashoo.cn" target="_blank">公司简介</a>
-                <a href="http://www.dashoo.cn" target="_blank">免责声明</a>
-                <a href="http://www.dashoo.cn" target="_blank">隐私政策</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 关于我们 |</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 公司简介 |</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 免责声明 |</a>
+                <a href="http://www.dashoo.cn" target="_blank"> 隐私政策 |</a>
               </el-row>
               <el-row>
                 <div class="license">青岛大数华创科技有限公司版权所有 Coptright @ 2019 DASHOO.</div>
               </el-row>
             </div>
           </el-col>
-          <el-col :span="2">
+          <el-col :span="4.5">
             <div class="login_bg5">
               <img src="../assets/img/QRcode.png" class="weixin-img">
             </div>
@@ -81,14 +77,11 @@
   import Component from 'class-component'
   @Component({
     data() {
-      // form model
-      // TODO: remove default values
       const model = {
         username: '',
         password: ''
       }
 
-      // form validate rules
       const rules = {
         username: [{
           required: true,
@@ -101,7 +94,6 @@
       }
 
       return {
-        loginMode: 1,
         model: model,
         rules: rules,
         error: null,
@@ -155,15 +147,11 @@
     border-bottom: 1px solid rgba(230, 230, 230, 0.99);
     z-index: 2;
     width: 100%;
+    min-height: 1100px;
     position: fixed;
     top: 0;
   }
 
-  .nav {
-    min-width: 1100px;
-    min-height: 600px;
-  }
-
   .nav .nav-logo {
     padding-top: 2px;
     padding-left: 35px;
@@ -174,35 +162,37 @@
     display: inline-block;
     float: left;
     padding-top: 2px;
+    background: #fff;
   }
 
   .nav header {
     padding: 0px 0 0px;
-    min-width: 1100px;
+    height: 65px;
+    width: 100%;
     margin: 0 auto;
   }
 
-  .nav header .search-query {
-    height: 30px;
-    line-height: 32px;
-    box-sizing: border-box;
-    border: 1px solid #e6e6e6;
-    border-radius: 15px;
-    outline: none;
-    padding: 0 15px 0 32px;
-    background-size: 20px;
-  }
+  // .nav header .search-query {
+  //   height: 30px;
+  //   line-height: 32px;
+  //   box-sizing: border-box;
+  //   border: 1px solid #e6e6e6;
+  //   border-radius: 15px;
+  //   outline: none;
+  //   padding: 0 15px 0 32px;
+  //   background-size: 20px;
+  // }
 
   .nav ul.nav-item {
     height: 32px;
-    float: right;
+    float: left;
     line-height: 32px;
-    padding-right: 0px;
+    padding-left: 405px;
   }
 
   .nav ul.nav-item li {
     display: inline-block;
-    margin-left: 40px;
+    margin-left: 45px;
   }
 
   .nav ul.nav-item a {
@@ -227,8 +217,9 @@
   }
 
   .intelligent-img {
-    width: 650px;
-    margin-top: -40px;
+    width: 600px;
+    margin-bottom: 2.5rem;
+    margin-top: -30px;
   }
 
   .box-card {
@@ -248,24 +239,24 @@
   .footer footer {
     overflow: hidden;
     // max-width: 1136px;
-    max-width: 1480px;
+    max-width: 1550px;
     margin: 0 auto;
     padding-top: 0px;
     padding-bottom: 30px;
   }
 
   .coptright {
-    padding-top: 40px;
+    padding-top: 30px;
     padding-left: 150px;
   }
 
   .login_bg4 {
-    padding-left: 100px;
-    padding-top: 5%;
+    padding-left: 220px;
+    padding-top: 15px;
   }
 
-  .logolabsop-img {
-    width: 400px;
+  .logodashoo-img {
+    width: 180px;
   }
 
   .license {
@@ -277,7 +268,7 @@
   }
 
   .login_bg5 {
-    padding-right: 10px;
+    //padding-left: 0px;
     float: left;
     padding-top: 10px;
   }
@@ -286,30 +277,13 @@
     width: 77px;
   }
 
-  .nav ul.nav-item {
-    height: 32px;
-    float: left;
-    line-height: 32px;
-    padding-left: 350px;
+  .login {
+    &-form {
+      .el-button {
+        margin-top: 0.5rem;
+        width: 100%;
+      }
+    }
   }
 
-  // .logu {
-
-  //   margin-top: 100px;
-  //   // padding-left: 120px;
-  // }
-
-
-
-  // .login {
-  //   &-form {
-  //     // position: absolute;
-
-  //     .el-button {
-  //       margin-top: 0.5rem;
-  //       width: 100%;
-  //     }
-  //   }
-  // }
-
 </style>