address-book
/
login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>

    <link rel="stylesheet" href="./assets/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="./assets/css/animate.min.css"/>
    <link rel="stylesheet" href="./assets/bootstrap-validator/bootstrapValidator.min.css">
    <link rel="stylesheet" href="./assets/mui/css/mui.min.css">

    <link rel="stylesheet/less" href="./assets/css/reset.less"/>
    <link rel="stylesheet/less" href="./assets/css/common.less"/>
    <link rel="stylesheet/less" href="./assets/css/UserLogin.less"/>
</head>
<body>
<!-- 用户信息 -->
<div class="user">
    <div class="avatar wow fadeInUp">
        <img src="./assets/images/avatar.png"/>
    </div>

    <div class="notice wow fadeInUp" data-wow-delay="100ms">请填写已有账号或新注册账号</div>
</div>

<form class="login wow fadeInUp" data-wow-delay="200ms" id="login">
    <div class="form-group">
        <label for="mobile">手机号</label>
        <input type="tel" class="form-control" id="mobile" name="mobile" placeholder="请输入手机号" required/>
    </div>
    <!--    <div class="form-group">-->
    <!--        <label for="email">邮箱</label>-->
    <!--        <input type="email" class="form-control" id="email" placeholder="请输入邮箱" required/>-->
    <!--    </div>-->

    <div class="form-group">
        <label for="password">密码</label>
        <input type="password" class="form-control" id="password" placeholder="请输入密码" required/>
    </div>

    <div class="action">
        <button class="btn" id="submit">登录</button>
    </div>
</form>
</body>
<script src="./assets/js/less.min.js"></script>
<script src="./assets/js/jquery.min.js"></script>
<script src="./assets/js/bootstrap.min.js"></script>
<script src="./assets/js/wow.min.js"></script>
<script src="./assets/bootstrap-validator/bootstrapValidator.min.js"></script>
<script src="assets/mui/js/mui.min.js"></script>
<script src="assets/axios/axios.min.js"></script>
<script src="assets/axios/request.js"></script>
<script src="./assets/js/cookie.js"></script>

<script>
    new WOW().init()

    let business = cookie.get('business') ? JSON.parse(cookie.get('business')) : {}

    if (JSON.stringify(business) !== '{}') {
        let id = business.id ? business.id : 0
        let mobile = business.mobile ? business.mobile : ''

        let result = POST({
            url: 'business/check',
            params: {
                id,
                mobile
            }
        })

        if (result.code === 0) {
            cookie.remove('business')
            mui.toast('非法登录')
            setTimeout(() => {
                location.reload()
            }, 2000)
        }

        mui.toast('你已经登录了，无需重复')
        setTimeout(() => {
            location.href = 'UserIndex.html'
        }, 2000)
    }


    $('#login').bootstrapValidator({
        message: '表单内容不能为空',
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        fields: {
            mobile: {
                message: '手机号验证失败',
                validating: {
                    notEmpty: {
                        message: '手机号不能为空'
                    },
                    stringLength: {
                        mix: 11,
                        max: 11,
                        message: '手机号长度为11位'
                    },
                    regexp: {
                        regexp: /^1[3-9][0-9]{9}$/,
                        message: '手机号码格式有误'
                    }
                }
            },
            password: {
                validating: {
                    notEmpty: {
                        message: '请输入密码'
                    }
                }
            }
        }
    }).on('success.from.bv', (e) => {
        e.preventDefault()
    })

    $('#login').on('submit', async (e) => {
        e.preventDefault()
        if (!$('#login').data('bootstrapValidator').isValid()) {
            this.data('bootstrapValidator').resetForm()
            return false
        }

        let data = {
            mobile: $.trim($('#mobile').val()),
            password: $.trim($('#password').val())
        }

        let result = await POST({
            url: 'business/login',
            params: data
        })

        if (result.code === 1) {
            mui.toast(result.msg)
            cookie.set('business', JSON.stringify(result.data))
            setTimeout(() => {
                location.href = 'UserIndex.html'
            }, 2000)
        } else {
            mui.toast(result.msg)
            $('#login').data('bootstrapValidator').resetForm()
        }
        return false
    })
</script>
</html>