Merge branch 'master' of http://gitlab.oytour.com/huangyuanyuan/electricitysheep

src/App.vue

@@ -11,14 +11,14 @@ export default {
 </script>
 
 <style>
-@import "//at.alicdn.com/t/font_1769104_02vy4h75rlau.css";
+@import "//at.alicdn.com/t/font_1769104_qg9btfnng5.css";
 html,
 body {
   margin: 0;
   padding: 0;
   height: 100%;
 }
-p{
+*{
   margin:0;
   padding:0;
 }

src/components/Forgetpassword.vue

+<style>
+    .Forgetpassword .resHeader{
+        width:100%;
+        height:190px;
+        background-image: url("../assets/img/fpassword.png");
+    }
+    .Forgetpassword .resHeader .title{
+        height: 50px;
+        font-size: 26px;
+        width: 274px;
+        margin: 0 auto 5px;
+        display: flex;
+        flex-wrap: nowrap;
+    }
+    .Forgetpassword .resHeader .title div {
+        padding: 0 10px;
+        width: 125px;
+    }
+    .Forgetpassword .resHeader .title{
+        font-size: 26px;
+        color: #333;
+        padding-top: 75px;
+        text-align: center;
+    }
+    .Forgetpassword .regisLogo {
+        float: right;
+        height: 50px;
+    }
+    .Forgetpassword .regisLine {
+        height: 25px; 
+        width: 1px!important; 
+        background: rgb(68, 68, 68); 
+        padding: 0px!important;
+        margin:21px 0 0 10px;
+    }
+    .Forgetpassword .regisWelcome{
+        padding:0!important;
+        margin:14px 0 0 10px;
+    }
+    .Forgetpassword .login {
+        color: #409EFF;
+        cursor: pointer;
+    }
+    .Forgetpassword .regisLogin{
+        color: rgb(125, 125, 125);
+        text-align:center;
+        margin-top:15px;
+    }
+    .Forgetpassword .regisMain{
+        display: block;
+        -webkit-box-flex: 1;
+        -ms-flex: 1;
+        flex: 1;
+        -ms-flex-preferred-size: auto;
+        flex-basis: auto;
+        overflow: auto;
+        box-sizing: border-box;
+        padding: 20px;
+        flex:1;
+    }
+    .Forgetpassword .box-card{
+        width:700px;
+        margin:40px auto 0;
+    }
+    .Forgetpassword .box-card .el-input .el-input__inner {
+        height: 45px;
+        border-radius: 22.5px;
+    }
+    .Forgetpassword .box-card .el-form-item__content {
+        width: 420px;
+    }
+    .Forgetpassword .NextStep{
+        width:300px;
+        text-align: left;
+        margin:40px auto 20px;
+    }
+    .Forgetpassword .box-card .code .el-input__inner {
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+    }
+    .Forgetpassword .box-card .code .el-input-group__append {
+        background-color: #007BFF;
+        color: #fff;
+        border-top-right-radius: 22.5px;
+        border-bottom-right-radius: 22.5px;
+        border: 1px solid #007BFF;
+    }
+    .Forgetpassword .el-footer {
+        color: #ACACAC;
+        text-align: center;
+        line-height: 60px;
+        background-color: #F6F6F6;
+        font-size:14px;
+    }
+    .Forgetpassword .forgetBtn{
+        font-size:16px;
+        width:120px;
+        height:45px;
+        border-radius:23px;
+    }
+</style>
+<template>
+    <div class="Forgetpassword">
+        <div class="resHeader">
+            <div class="title">
+                <div>
+                    <img src="../assets/img/logo.png" alt="" class="regisLogo"/>
+                </div>
+                <div class="regisLine"></div>
+                <div class="regisWelcome">重置密码</div>
+            </div>
+            <div class="regisLogin" style="">
+                已有账号？<span class="login" @click="goLogin">登录</span>
+            </div>
+        </div>
+        <div class="regisMain" :style="{minHeight: Height+'px'}">
+            <div class="box-card">
+                <el-form :model="msg" :rules="rules" ref="msg" label-width="130px" style="padding:0 50px;">
+                    <el-form-item label="手机号" prop="phone">
+                        <el-input type="text" v-model="msg.phone" maxlength="25" placeholder="请输入手机号"/>
+                    </el-form-item>
+                    <el-form-item label="短信验证码" prop="ValidataCode" class="code">
+                        <el-input v-model="msg.ValidataCode" maxlength="10" type="text">
+                            <template slot="append">获取短信验证码</template>
+                        </el-input>
+                    </el-form-item>
+                    <el-form-item label="设置密码" prop="Password">
+                        <el-input type="password" v-model="msg.Password" maxlength="25" placeholder="请输入密码"/>
+                    </el-form-item>
+                    <el-form-item label="确认密码" prop="Password2">
+                        <el-input type="password" v-model="msg.Password2" maxlength="25" placeholder="请再次输入密码"/>
+                    </el-form-item>
+                </el-form>
+                <div class="NextStep">
+                    <button class="el-button el-button--primary forgetBtn" @click="submitForm('msg')">提交</button>
+                </div>
+            </div>
+        </div>
+        <div class="el-footer el-footer" style="height: 60px;">
+            <a target="_blank" style="text-decoration: none;">由微途科技提供技术支持</a>
+        </div>
+    </div>
+</template>
+<script>
+  export default {
+    data() {
+      let validataPwd = (rule, value, callback) => {
+        if (this.msg.Password =='') {
+            return callback(new Error('请输入密码'));
+        } 
+        if(this.msg.Password.trim().length<6||this.msg.Password.trim().length>15){
+            return callback(new Error('密码应在6至15位之间'));
+        }
+        else {
+            callback();
+        }
+      }
+      let validataPwd2 = (rule, value, callback) => {
+        if (this.msg.Password2 =='') {
+            return callback(new Error('请再次输入密码'));
+        } 
+        if(this.msg.Password2.trim().length<6||this.msg.Password2.trim().length>15){
+            return callback(new Error('密码应在6至15位之间'));
+        }
+        if(this.msg.Password!=this.msg.Password2){
+            return callback(new Error('两次输入密码不一致!'));
+        }
+        else {
+            callback();
+        }
+      }
+      return {
+         Height:0,
+         msg:{
+            phone:'',
+            ValidataCode:'',
+            Password:'',
+            Password2:''
+         },
+         rules: {
+            phone: [
+                { required: true, message: "手机号不能为空", trigger: "blur" }
+            ],
+            ValidataCode: [
+                { required: true, message: "手机验证码不能为空", trigger: "blur" }
+            ],
+            Password: [
+                 { validator: validataPwd, trigger: "blur",required: true}
+            ],
+            Password2: [
+                 { validator: validataPwd2, trigger: "blur",required: true}
+            ]
+        },
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      submitForm(addMsg){
+        //提交创建、修改表单
+        this.$refs[addMsg].validate(valid => {
+            if (valid) {
+                this.resetInfo();
+            } else {
+                return false;
+            }
+        });
+      },
+      //提交重置
+      resetInfo(){
+
+      },
+      //跳转登录
+      goLogin() {
+        this.$router.push({
+          name: 'login',
+          query: {
+            blank: "y"
+          }
+        });
+      },
+
+    },
+    mounted() {
+        this.Height = document.documentElement.clientHeight - 250;  
+    　　//监听浏览器窗口变化　
+        window.onresize = ()=> {this.Height = document.documentElement.clientHeight -250}
+
+    }
+  };
+</script>
\ No newline at end of file

src/components/main.vue

+<style>
+    .mainContainer{
+        height:100%;
+        display:flex;
+        -webkit-box-orient: horizontal;
+        -ms-flex-direction: row;
+        flex-direction: row;
+        -webkit-box-flex: 1;
+        -ms-flex: 1;
+        flex: 1;
+        -ms-flex-preferred-size: auto;
+        flex-basis: auto;
+        -webkit-box-sizing: border-box;
+        box-sizing: border-box;
+        min-width: 0;
+        font-size:14px;
+    }
+    .mainLeftMenu{
+        position: relative;
+        display: flex;
+        flex-direction: row;
+        color:#fff;
+    }
+    .leftMenu1{
+        background: #444444;
+        cursor: pointer;
+        width: 130px;
+        height: 100%;
+        overflow-y: auto;
+        -webkit-user-select: none;
+        -moz-user-select: none;
+        -ms-user-select: none;
+        user-select: none;
+    }
+    .asideInner{
+        background: rgba(0, 0, 0, 0.15);
+        padding: 6px 6px;
+        width: 100%;
+        border-radius: 3px;
+        font-weight: bold;
+    }
+    .aside-logo {
+        height: 60px;
+        background: #444444;
+        color: #f2f2f2;
+        cursor: pointer;
+        font-weight: bold;
+        text-align: center;
+        padding: 0 15px;
+        display: flex;
+        align-items: center;
+    }
+    .leftUl li{
+        list-style-type: none;
+        display: block;
+        height:60px;
+        padding:10px;
+        width:100%;
+    }
+    .menu-item{
+        height: 60px;
+        padding: 0 10px;
+        display: flex;
+        -webkit-box-align: center;
+        -webkit-align-items: center;
+        -ms-flex-align: center;
+        align-items: center;
+        flex-direction: row;
+    }
+    .vue-line-clamp{
+        word-break: break-all;
+        -webkit-line-clamp: 1;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        margin-left:5px;
+    }
+    .menu-item:hover{
+        color:#fff;
+        background-color: #666666;
+        cursor: pointer;
+    }
+    .menuActive{
+        color: #000000!important;
+        background: #ffffff!important;
+    }
+    .leftMenu2{
+        border-right: 1px solid #E6E6E6;
+        position: relative;
+        width: 130px;
+        height: 100%;
+        overflow-y: auto;
+        -webkit-user-select: none;
+        -moz-user-select: none;
+        -ms-user-select: none;
+        user-select: none;
+    }
+    .is-show-menu-1 {
+        position: absolute;
+        width: 14px;
+        background: #F3F3F3;
+        color: #A1A4A9;
+        border-radius: 10px 0 0 10px;
+        padding: 2px 8px;
+        right: 0;
+        top: 17px;
+        cursor: pointer;
+    }
+    .menu-item-2-title{
+        width:100%;
+        color: #909399;
+        border-bottom: 1px solid #E6E6E6;
+        text-align: center;
+        height: 59px;
+        line-height: 59px;
+    }
+    /* .mainRightContent{
+
+    } */
+    .leftMenu2 .el-submenu__title span{
+        padding-left:20px;
+    }
+    .leftMenu2 .el-submenu__icon-arrow{
+        right:80%;
+    }
+    .leftMenu2 .el-submenu__title:hover{
+        background: transparent;
+        color:#5DA8FC;
+    }
+    .leftMenu2 .el-submenu__title:hover i{
+        color:#5DA8FC;
+    }
+    .leftMenu2 .el-menu-item:hover{
+        background-color: transparent;
+        color:#5DA8FC;
+    }
+    .el-menu-item.is-active{
+        width: 100%;
+        height: 100%;
+        border-radius: 4px;
+        background-color: transparent;
+        cursor: pointer;
+        color:#303133;
+    }
+    .leftMenu2 .el-menu-item-group__title{
+        padding:0 0 7px 20px!important;
+    }
+    .leftMenu2 .el-menu{
+        border-right:0;
+    }
+    .mainLeftMenu .is-show-menu-2{
+        position: absolute;
+        width: 14px;
+        background: #F3F3F3;
+        color: #A1A4A9;
+        border-radius: 0 10px 10px 0;
+        padding: 2px 8px;
+        right: -30px;
+        top: 17px;
+        cursor: pointer;
+        z-index: 10;
+    }
+    .isaa{
+        width: 104px;
+        height: 42px;
+        line-height: 42px;
+        text-indent: 22px;
+        display: inline-block;
+        text-align: left;
+
+    }
+    .el-submenu.is-active .isActive{
+        background: #ebedf0!important;
+        border-radius:4px;
+    }
+    .el-submenu .el-menu-item{
+        padding-left:0!important;
+        min-width: 130px!important;
+        padding: 0!important;
+        text-align: center;
+    }
+    .mainRightContent{
+        width:100%;
+        height:100%;
+        background-color: #f3f3f3;
+    }
+    .mainRightTop{
+        width:100%;
+        height:60px;
+        background: #fff;
+        display: flex;
+        justify-content: space-between;
+        color:#909399;
+    }
+    .mainRightLeft{
+        width:110px;
+        height:60px;
+        line-height: 62px;
+        /* border-bottom:2px solid #409EFF; */
+        text-align: center;
+        margin-left:30px;
+        cursor: pointer;
+        position: relative;
+        top:-2px;
+    }
+    .marinRightList{
+        display:flex;
+        flex-wrap: wrap;
+        align-items: center;
+        width:300px;
+    }
+    .marinRightList ul{
+        display:flex;
+        width:100%;
+        justify-content: space-around;
+    }
+    .marinRightList ul li{
+        display: block;
+        list-style-type: none;
+        cursor: pointer;
+        color:#909399;
+        outline: none;
+        border:none;
+    }
+    .mainRightLeft:hover{
+        color:#303133;
+    }
+    .marinRightList ul li:hover{
+        color:#303133;
+    }
+    .marinRightList ul li .el-dropdown>span:hover{
+        color:#303133;
+    }
+    .marinRightList ul li .el-dropdown>span{
+        color:#909399;
+    }
+</style>    
+<template>
+    <div class="mainContainer">
+        <div class="mainLeftMenu">
+            <div class="is-show-menu-2" v-if="isShowOne" @click="showTwo=true,isShowOne=false">>></div>
+            <div class="leftMenu1">
+                <div class="aside-logo">
+                    <div class="asideInner">赞羊严选</div>
+                </div>
+                <ul>
+                    <li class="menu-item" @mouseover="mouseOver">
+                        <i class="iconfont icon-dianpuguanli"></i>
+                        <div class="vue-line-clamp">店铺管理</div>
+                    </li>
+                    <li class="menu-item" @mouseover="mouseOver">
+                        <i class="iconfont icon-shangpinguanli"></i>
+                        <div class="vue-line-clamp">商品管理</div>
+                    </li>
+                    <li class="menu-item" @mouseover="mouseOver">
+                        <i class="iconfont icon-dingdanguanli"></i>
+                        <div class="vue-line-clamp">订单管理</div>
+                    </li>
+                    <li class="menu-item" @mouseover="mouseOver">
+                        <i class="iconfont icon-yonghuguanli"></i>
+                        <div class="vue-line-clamp">用户管理</div>
+                    </li>
+                    <li class="menu-item" @mouseover="mouseOver">
+                        <i class="iconfont icon-shujutongji"></i>
+                        <div class="vue-line-clamp">数据统计</div>
+                    </li>
+                    <li class="menu-item" @mouseover="mouseOver">
+                        <img src="../assets/img/plugins.png"/>
+                        <div class="vue-line-clamp">营销中心</div>
+                    </li>
+                    <li class="menu-item" @mouseover="mouseOver">
+                        <i class="iconfont icon-shezhi"></i>
+                        <div class="vue-line-clamp">设置</div>
+                    </li>
+                </ul>
+            </div>
+            <div class="leftMenu2" v-if="showTwo">
+                <div class="is-show-menu-1" @click="hideTwo()"><<</div> 
+                <div class="menu-item-2-title">
+                    店铺管理
+                </div>
+                <div>
+                    <el-menu :default-active="defaultActive" :unique-opened="true" class="el-menu-vertical-demo">
+                        <el-submenu index="1">
+                            <template slot="title">
+                                <span>店铺设计</span>
+                            </template>
+                            <el-menu-item-group>
+                                <el-menu-item index="1-1" @click="changeMenu()">
+                                    <div class="isaa" :class="defaultActive=='1-1'?'isActive':''">轮播图</div>
+                                </el-menu-item>
+                                <el-menu-item index="1-2">
+                                    <div class="isaa" :class="defaultActive=='1-2'?'isActive':''">导航图标</div>
+                                </el-menu-item>
+                                <el-menu-item index="1-3">商城风格</el-menu-item>
+                                <el-menu-item index="1-4">图片魔方</el-menu-item>
+                            </el-menu-item-group>
+                        </el-submenu>
+                        <el-submenu index="2">
+                            <template slot="title">
+                                <span>店铺设计</span>
+                            </template>
+                            <el-menu-item-group>
+                                <el-menu-item index="2-1">轮播图</el-menu-item>
+                                <el-menu-item index="2-2">导航图标</el-menu-item>
+                                <el-menu-item index="2-3">商城风格</el-menu-item>
+                                <el-menu-item index="2-4">图片魔方</el-menu-item>
+                            </el-menu-item-group>
+                        </el-submenu>
+                    </el-menu>
+                </div>  
+            </div>
+        </div>
+        <div class="mainRightContent">
+            <div class="mainRightTop">
+                <div class="mainRightLeft">微信小程序</div>
+                <div class="marinRightList">
+                    <ul>
+                        <li>缓存</li>
+                        <li title="教程管理">
+                            <el-dropdown trigger="click">
+                                <span class="el-dropdown-link">
+                                    教程管理<i class="el-icon-arrow-down el-icon--right"></i>
+                                </span>
+                                <el-dropdown-menu slot="dropdown">
+                                    <el-dropdown-item>操作教程</el-dropdown-item>
+                                </el-dropdown-menu>
+                            </el-dropdown>
+                        </li>
+                        <li title="赞羊严选">
+                            <el-dropdown trigger="click">
+                                <span class="el-dropdown-link">
+                                    赞羊严选<i class="el-icon-arrow-down el-icon--right"></i>
+                                </span>
+                                <el-dropdown-menu slot="dropdown">
+                                    <el-dropdown-item disabled>赞羊严选</el-dropdown-item>
+                                    <el-dropdown-item disabled>T1219561424(T1219561424)</el-dropdown-item>
+                                    <el-dropdown-item>返回系统</el-dropdown-item>
+                                </el-dropdown-menu>
+                            </el-dropdown>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+            <router-view/>
+        </div>
+    </div>
+</template>
+<script>
+  export default {
+    data() {
+      return {
+        //是否显示关闭后的箭头
+        isShowOne:false,
+        showTwo:false,
+        defaultActive:'1-1'
+      };
+    },
+    created() {
+
+    },
+    methods: {
+        //点击关闭二级窗口
+        hideTwo(){
+           this.showTwo=false;
+           this.isShowOne=true;
+        },
+        //鼠标移入
+        mouseOver(){
+            this.showTwo=true;
+        },
+        changeMenu: function() {
+            this.$router.push({
+                path: 'Register'
+            });
+        }
+    },
+    mounted() {
+    }
+  };
+</script>
\ No newline at end of file

src/components/zanIndex.vue

+<style>
+    
+</style>
+<template>
+    <div>
+        123
+    </div>
+</template>
\ No newline at end of file

src/router/index.js

@@ -15,6 +15,11 @@ export default new Router({
       name: 'login',
       component: resolve => require(['@/components/Login'], resolve),
     },
+    {
+      path:'/Forgetpassword',
+      name: 'Forgetpassword',
+      component: resolve => require(['@/components/Forgetpassword'], resolve),
+    },
     {
       path: '/Register',
       name: 'Register',
@@ -24,6 +29,19 @@ export default new Router({
       path: '/index',
       name: 'index',
       component: resolve => require(['@/components/index'], resolve),
-    }
+    },
+    {
+      path: '/main',
+      name: 'main',
+      component: resolve => require(['@/components/main'], resolve),
+      children:[
+        {
+          path: '/zanIndex',
+          name: 'zanIndex',
+          component: resolve => require(['@/components/zanIndex'], resolve),
+        }
+      ]
+    },
+    
   ]
 })