<template>
  <div class="page">
    <header class="page-header">
        <div class="main-header">
            <section class="header-title">
				<img src="../../../share/Login_logo.jpg">
				<span>Hello，美好的一天开始！</span>
            </section>
            <section class="header-extra">
				<!--此处显示右侧扩展信息，添加内容部署可查看效果-->
            </section>
        </div>
    </header>
    <div class="page-main">
        <div class="main-warpper">
            <!--登录信息面板start{-->
            <div class="login-panel">
                <div class="login-panel-swiper" :style="{left:`${sideLeft}px`}">
                    <section class="static-form">
                        <h5 class="login-panel-title">账号登录</h5>
                        <vui-form @keyup.enter.native="$emit('logining')">
							<!-- 用户名文本 -->
                            <vui-form-item>
                                <vui-input v-model="loginAccount.current.AccountName" autofocus size="large" placeholder=" 用户名 "></vui-input>
                            </vui-form-item>
							<!-- 密码文本 -->
                            <vui-form-item>
                                <vui-input v-model="loginAccount.current.AccountPwd" size="large" placeholder=" 密码 " type="password"></vui-input>
                            </vui-form-item>
                            <vui-form-item>
                                <CheckboxGroup>                                   
                                    <Checkbox label="记住我" v-model="loginAccount.current.isRemember"></Checkbox>
                                </CheckboxGroup>
                            </vui-form-item>
                            <vui-form-item>
                                <vui-button type="primary" size="large" long  @click="$emit('logining')">登录</vui-button>
                            </vui-form-item>
                        </vui-form>
						<em class="login-panel-handler" @click="toggle">
							 <vui-icon type="android-phone-portrait" title="手机扫码登录"></vui-icon>
						</em>
                    </section>
                    <section class="quick-form">
                        <h5 class="login-panel-title">扫码登录</h5>
                        <div class="qrcode-img">
                            <img src="../../../share/qrcode.png">
                        </div>
                        <p>打开微信扫一扫</p>
						<em class="login-panel-handler" @click="toggle">
							<vui-icon type="android-desktop" title="账号登录"></vui-icon>
                        </em>
                    </section>
                </div>
            </div>
            <!--}end-->
        </div>
    </div>
    <!--footer-->
    <footer class="page-footer">
           <div class="footer-main">
			 ©2018xxxxx有限公司版权所有 备案号：粤ICP110739992号-2
           </div>
    </footer>
</div>
</template>
<script>
  import vdk from 'v3-vdk';
import entities from './entities.js';
export default {
    props: entities,
    data: function () {
        return {
            sideLeft:0,
            Fold:false,
        };
    },
    methods: {
        toggle(){
            if (!this.Fold) {
                this.Fold = true;
                $(".static-form").hide();
                $(".quick-form").show();
            } else {
                this.Fold = false;
                $(".static-form").show();
                $(".quick-form").hide();
            }
        }
    }
};
</script>
<style scoped lang="less" src="./theme.less"></style>

