{{ define "index/login.html" }}
{{template "public/header" .}}
    <div class="l_body">
        <div class="l_logo">
            <img src="/static/img/logo_blue.png">
        </div>
        <div class="l_bottom_con">
            <div class="r_con">
                <div class="l_tit_con">
                    <div class="l_tit" title="扫码" data-type="scan"></div>
                    <div class="l_tit" title="账号" data-type="account"></div>
                </div>
                <div class="lc_container layui-form">
                    <div class="l_cc">
                        <div class="l_c">
                            <div class="lc_title">
                                <span>账号登录</span>
                            </div>
                            <div class="l_in">
                                <span>账号</span>
                                <input type="text" name="staffname" placeholder="请输入账号" id="username" onkeydown='if(event.keyCode==13){$("#password").focus()}'/>
                            </div>
                            <div class="l_in">
                                <span>密码</span>
                                <input type="password" name="password" placeholder="请输入密码" id="password" onkeydown='if(event.keyCode==13){$("#btn01").trigger("click")}'/>
                            </div>
                            <!-- <div class="l_other">
                                <label>
                                    <input type="checkbox" name="" id="remember">
                                    <span>记住密码</span>
                                </label>
                            </div> -->
                            <!-- <div class="l_tip">用户名或密码错误</div> -->
                            <div class="l_bottom">
                                <div class="l_btn1" id="btn01" lay-submit lay-filter="formDemo">登录</div>
                            </div>
                        </div>
                    </div>                    
                    <div class="l_cc">
                        <div class="l_c">
                            <div class="lc_title">
                                <img src="/static/img/wechart.png">
                                <span>微信扫一扫登录</span>
                            </div>
                            <div class="lc_ewm" id="qrcode">
                                <img src="">
                            </div>
                            <!-- <div class="lc_ewm_tip">请使用微信扫描二维码登录</div> -->
                        </div>

                        <div class="btn_sx" id="qrmsg"></div>
                    </div>
                </div>
                <div class="l_ip">本机IP：&nbsp; 127.0.0.1</div>
                <div class="l_version">版本：&nbsp; {{.version}}</div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        var intQrcode ,logintype,reloadQRcode,loginFunc;
        
        // $("#btn01").click(function(){
        //     window.location.href = 'orderList.html';
        // })
        layui.use('form', function(){
            var form = layui.form;
            $(".l_tit").on('click', function(){
                $(this).hide()
                $(this).siblings().show()
                console.log($(this).data("type"))
                logintype = $(this).data("type")
                if(logintype == 'scan'){
                    reloadQRcode(true);
                }
                $(".l_cc").eq($(this).index()).hide().siblings().show();
            })

            //监听提交
            form.on('submit(formDemo)', function(data){
                loginFunc(data);
                return false;
            });
            loginFunc = function(data){
                // let loadid = layer.load(1)
                common.ajax({
                    url: "/login",
                    data: data.field,
                }).then((ret)=>{
                    // layer.close(loadid);
                    console.log("login res:",ret)
                    if(ret.code == 200){
                        location.href="/index.html"
                    }else{
                        layer.alert(ret.msg);
                    }
                }).catch((err)=>{
                    layer.close(loadid);
                    layer.alert("错误："+err.message)
                })
               
            }

            reloadQRcode = function (init=false){
                
                if (init){
                    common.showLoading();
                    $("#qrcode").html('<img src="/static/img/ewm.jpg"></img>');
                    intQrcode = ""
                }


                common.ajax({
                    url: "/loginqrcode",
                    data: {qr_code:intQrcode},
                }).then((ret)=>{
                    common.hideLoading();
                    if(ret.code == 200 ){
                        intQrcode = ret.data.qr_code;
                        if(intQrcode == '' || typeof intQrcode == 'undefined'){
                            $("#qrcode").append('<small>二维码已失效</small><a href="#" onclick="reloadQRcode(true);">请点击刷新</a>');
                            return ;
                        }
                        if(init){
                            // console.log("----------");
                            common.hideLoading();
                            $("#qrcode img").attr('src',"/qrshow?data="+ encodeURIComponent(ret.data.qr_code_url));
                        }
                        if(ret.data.state == 'logined'){
                            location.href="/index.html"
                            return;
                        }
                        // intQrcode = setInterval(checkQRcode,3000);
                        if(logintype == "scan"){
                            setTimeout(function(){
                                reloadQRcode();
                            },3000)
                        }
                        
                    }else{
                        if(ret.code == 403){
                            $("#qrcode").append('<small>'+ret.msg+'</small><a href="#" onclick="reloadQRcode(true);">请点击刷新</a>');
                        }else{
                            $("#qrcode").append('<small>二维码已失效</small><a href="#" onclick="reloadQRcode(true);">请点击刷新</a>');
                        }
                        
                        clearInterval(intQrcode);
                    }
                }).catch((err)=>{
                    common.hideLoading();
                    layer.alert('获取二维码失败，请重试。');
                    $("#qrcode").append('<small>二维码获取失败</small><a href="#" onclick="reloadQRcode(true);">请点击刷新</a>');
                    clearInterval(intQrcode);
                })
            }




        });
    </script>
{{template "public/footer" .}}
{{ end }}