添加wmp登录

src/pages/wmp/components/layout.vue

+<template>
+  <div class="login-page" :style="setHeight">
+    <div class="login-box">
+      <div class="login-mian">
+        <div class="left">
+          <img src="../assets/login-tit1.png" alt="" class="txt1">
+          <img src="../assets/login-tit2.png" alt="" class="txt2">
+          <img v-if="imgUrl==='pc'" src="../assets/login-tit3-pc.png" alt="" class="txt3">
+          <img v-if="imgUrl==='mobile'" src="../assets/login-tit3.png" alt="" class="txt3">
+        </div>
+        <div class="login-modules">
+          <router-view></router-view>
+        </div>
+      </div>
+    </div>
+    <div class="mobile-login" :style="setHeight">
+      <div class="title-box">
+        <img src="../assets/mlogin-tit1.png" alt="" class="tit1">
+        <img src="../assets/mlogin-tit2.png" alt="" class="tit2">
+      </div>
+      <div class="logo-box">
+        <img src="../assets/mlogin-logo1.png" alt="" class="tit1">
+        <img src="../assets/mlogin-logo2.png" alt="" class="tit2">
+      </div>
+      <div class="text-box">
+        <img src="../assets/login-tit1.png" alt="" class="tit1">
+        <img src="../assets/login-tit2.png" alt="" class="tit2">
+        <img src="../assets/login-tit3.png" alt="" class="tit3">
+      </div>
+      <div class="mlogin-modules">
+        <router-view></router-view>
+      </div>
+      <!-- <div class="new-user" @click="go">我是新用户?</div> -->
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'WmpLayout',
+  data() {
+    return {
+      imgUrl: 'pc',
+      setHeight: 0
+    }
+  },
+  created () {
+    if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
+      this.imgUrl = 'mobile'
+    } else {
+      this.imgUrl = 'pc'
+    }
+    this.setHeight = `height: ${document.documentElement.clientHeight}px`
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+::v-deep .el-button--primary{
+  background: #006dbf;
+  border: none;
+}
+.login-page{
+  width: 100%;
+  height: 100%;
+}
+.mobile-login{
+  width: 100%;
+  height: 100%;
+  background: url('../assets/mlogin-bg.png');
+  background-size:100% 100%;
+  .title-box{
+    padding-top: 13px;
+    .tit1{
+      width: 40%;
+    }
+    .tit2{
+      width: 40%;
+      margin-top: 10px;
+    }
+    img{
+      display: block;
+      margin-left: 13%;
+    }
+  }
+  .logo-box{
+    width: 75%;
+    margin: 0 auto;
+    margin-top:15%;
+    overflow: hidden;
+    .tit2{
+      float: right;
+    }
+    img{
+      float: left;
+      display: block;
+      width: 45%;
+    }
+  }
+  .text-box{
+    padding-top: 5%;
+    width: 75%;
+    margin: 0 auto;
+    img{
+      display: block;
+      width: 100%;
+      margin-top: 5%;
+    }
+  }
+  .mlogin-modules{
+    width: 75%;
+    margin: 10% auto;
+  }
+}
+.login-box{
+  width: 100%;
+  height: 100%;
+  background: url('../assets/login-bg.png');
+  background-size:100% 100%;
+  .login-mian{
+    position: relative;
+    width: 1100px;
+    height: 100%;
+    margin: 0 auto;
+    .left{
+      position: absolute;
+      top: 50%;
+      left: 0;
+      -webkit-transform: translateY(-50%);
+      -ms-transform: translateY(-50%);
+      -o-transform: translateY(-50%);
+      transform: translateY(-50%);
+      img{
+        display: block;
+      }
+      .txt1{
+        width: 544px;
+      }
+      .txt2{
+        width: 541px;
+        margin: 30px 0;
+      }
+      .txt3{
+        width: 542px;
+      }
+    }
+    .login-modules{
+      position: absolute;
+      top: 50%;
+      -webkit-transform: translateY(-50%);
+      -ms-transform: translateY(-50%);
+      -o-transform: translateY(-50%);
+      transform: translateY(-50%);
+      right: 0;
+      width: 400px;
+    }
+  }
+}
+.new-user{
+  font-size: 16px;
+  font-weight:bold;
+  color:rgba(255,158,100,1);
+  text-align: center;
+  padding-top: 30px;
+  text-decoration: underline;
+}
+/* normal 登录 */
+.code-login a{ float: left; cursor: pointer; color:#186AA9;text-decoration:none;}
+.forget-pwd a{ float: right; cursor: pointer; color:#186AA9;}
+@media screen and (max-width: 480px){
+  .login-box{display: none;}
+}
+@media screen and (min-width: 1000px){
+  .mobile-login{display: none;}
+}
+</style>

src/pages/wmp/login.vue

+<template>
+  <router-view @success="handleSuccess"></router-view>
+</template>
+
+<script>
+export default {
+  name: 'CiisLogin',
+  methods: {
+    handleSuccess(response) {
+      const { url } = webConf.others.ciis
+      window.location.href = url
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+::v-deep .login-footer a {
+  color: inherit;
+}
+</style>

src/pages/wmp/password.vue

+<template>
+  <div class="password">
+    <el-page-header @back="$router.push('login')" title="返回登录" content="忘记密码"></el-page-header>
+    <div class="password-form">
+      <router-view></router-view>
+    </div>
+  </div>
+</template>
+
+<script>
+export default { name: 'CiisPassword' }
+</script>
+
+<style lang="scss" scoped>
+.password-form {
+  margin-top: 20px;
+}
+</style>

src/router/routes.js

@@ -45,5 +45,26 @@ export default [
         children: [{ path: '', component: password }]
       }
     ]
+  },
+  {
+    path: '/wmp',
+    component: () => import(/* webpackChunkName: "wmp" */ '../pages/wmp/components/layout.vue'),
+    children: [
+      { path: '', redirect: 'login/index' },
+      {
+        path: 'login',
+        component: () => import(/* webpackChunkName: "wmp" */ '../pages/wmp/login.vue'),
+        children: [
+          { path: '', redirect: 'index' },
+          { path: 'index', component: loginAccount },
+          { path: 'code', component: loginCode }
+        ]
+      },
+      {
+        path: 'password',
+        component: () => import(/* webpackChunkName: "wmp" */ '../pages/wmp/password.vue'),
+        children: [{ path: '', component: password }]
+      }
+    ]
   }
 ]