nsgk_web/sunVillage_info/static/js/project/login.js

/**
 * Created by admin on 2021/4/5.
 *
 */
define(['jquery', "Tools","user"], function ($, Tools) {
    //数据存储
    var module = {
        uuid: '',  //验证码uuid
        computeTime:60,
        timer:null,
        loginType:'login'
    };
    //自定义公共方法
    var tools = new Tools();

    // 可调参数
    var BACKGROUND_COLOR = "#4A97F4";   // 背景颜色
    var POINT_NUM = 100;                        // 星星数目
    var POINT_COLOR = "rgba(255,255,255,0.7)";  // 点的颜色
    var LINE_LENGTH = 10000;                    // 点之间连线长度(的平方)

    // 创建背景画布
    var cvs = document.createElement("canvas");
    cvs.width = window.innerWidth;
    cvs.height = window.innerHeight;
    cvs.style.cssText = "\
            position:fixed;\
            top:0px;\
            left:0px;\
            z-index:-1;\
            opacity:1.0;\
            ";
    document.body.appendChild(cvs);

    var ctx = cvs.getContext("2d");

    var startTime = new Date().getTime();

    //默认进入页面加载方法
    module.init = function (page) {
        //点击登录
        $('#login-submit').on('click', module.login)
        //点击图形验证码
        $('#graphicImg').on('click', module.verificationCode)
        //点击图形验证码
        $('#mobileGraphicImg').on('click', module.verificationCode1)
        //点击发送验证码
        $('#getSmsCode').on('click', module.getSmsCode)
        //图形验证码加载
        module.verificationCode()
        //背景高度
        module.register()
        //网站配置信息（网站名称 底部联系方式 公安备案号 网站备案号）
        tools.getWebConfig();
        document.onkeydown = function (event) {
            var e = event || window.event;
            if (e && e.keyCode == 13) { //回车键的键值为13
                $("#login-submit").click(); //调用登录按钮的登录事件
            }
        };
        initPoints(POINT_NUM);
        drawFrame();
    };

    //随机数函数
    function randomInt(min, max) {
        return Math.floor((max - min + 1) * Math.random() + min);
    }

    function randomFloat(min, max) {
        return (max - min) * Math.random() + min;
    }

    //构造点类
    function Point() {
        this.x = randomFloat(0, cvs.width);
        this.y = randomFloat(0, cvs.height);

        var speed = randomFloat(0.3, 1.4);
        var angle = randomFloat(0, 2 * Math.PI);

        this.dx = Math.sin(angle) * speed;
        this.dy = Math.cos(angle) * speed;

        this.r = 1.2;

        this.color = POINT_COLOR;
    }

    Point.prototype.move = function () {
        this.x += this.dx;
        if (this.x < 0) {
            this.x = 0;
            this.dx = -this.dx;
        } else if (this.x > cvs.width) {
            this.x = cvs.width;
            this.dx = -this.dx;
        }
        this.y += this.dy;
        if (this.y < 0) {
            this.y = 0;
            this.dy = -this.dy;
        } else if (this.y > cvs.height) {
            this.y = cvs.height;
            this.dy = -this.dy;
        }
    }

    Point.prototype.draw = function () {
        ctx.fillStyle = this.color;
        ctx.beginPath();
        ctx.arc(this.x, this.y, this.r, 0, Math.PI * 2);
        ctx.closePath();
        ctx.fill();
    }

    var points = [];

    function initPoints(num) {
        for (var i = 0; i < num; ++i) {
            points.push(new Point());
        }
    }

    var p0 = new Point(); //鼠标
    p0.dx = p0.dy = 0;
    var degree = 2.5;
    document.onmousemove = function (ev) {
        p0.x = ev.clientX;
        p0.y = ev.clientY;
    }
    document.onmousedown = function (ev) {
        degree = 5.0;
        p0.x = ev.clientX;
        p0.y = ev.clientY;
    }
    document.onmouseup = function (ev) {
        degree = 2.5;
        p0.x = ev.clientX;
        p0.y = ev.clientY;
    }
    window.onmouseout = function () {
        p0.x = null;
        p0.y = null;
    }

    function drawLine(p1, p2, deg) {
        var dx = p1.x - p2.x;
        var dy = p1.y - p2.y;
        var dis2 = dx * dx + dy * dy;
        if (dis2 < 2 * LINE_LENGTH) {
            if (dis2 > LINE_LENGTH) {
                if (p1 === p0) {
                    p2.x += dx * 0.03;
                    p2.y += dy * 0.03;
                } else return;
            }
            var t = (1.05 - dis2 / LINE_LENGTH) * 0.2 * deg;
            ctx.strokeStyle = "rgba(255,255,255," + t + ")";
            ctx.beginPath();
            ctx.lineWidth = 1.5;
            ctx.moveTo(p1.x, p1.y);
            ctx.lineTo(p2.x, p2.y);
            ctx.closePath();
            ctx.stroke();
        }
        return;
    }

    //绘制每一帧
    function drawFrame() {
        cvs.width = window.innerWidth;
        cvs.height = window.innerHeight;
        ctx.fillStyle = BACKGROUND_COLOR;
        ctx.fillRect(0, 0, cvs.width, cvs.height);

        var arr = (p0.x == null ? points : [p0].concat(points));
        for (var i = 0; i < arr.length; ++i) {
            for (var j = i + 1; j < arr.length; ++j) {
                drawLine(arr[i], arr[j], 1.0);
            }
            arr[i].draw();
            arr[i].move();
        }

        window.requestAnimationFrame(drawFrame);
    }

    module.getSmsCode = function () {
        var mobile = $('#mobile').val();

        tools.doPost(getSmsCode, {mobile:mobile,code:$('#mobileCode').val(),uuid:module.uuid}, module.getSmsCodeAjax, true)
    }

    module.getSmsCodeAjax = function (data) {
        module.uuid = data.uuid;
        module.computeTime = 60;
        module.timer = setInterval(() => {
            module.computeTime--;
            document.getElementById('getSmsCode').value = module.computeTime;
            if (module.computeTime <= 0) {
                clearInterval(module.timer);
                document.getElementById('getSmsCode').value = '发送验证码';
            }
        }, 1000);
    }

    //底部友情链接
    module.bottomFriendsLinks = function (data) {
        if (data.code == 200) {
            var content = data.data;
            console.log(content)
            module.data.friendsLinksList = content;
            var friendsLinksData = template('friendsLinksData', module.data);
            $("#friendsLinksContent").html(friendsLinksData);
        }
    }
    /*-----------------------------自定义方法-------------------------------------*/
    //登录方式切换
    loginTab = function(type){
        document.getElementById('loginTab').style.display = 'none'
        document.getElementById('remberPsw').style.display = 'none'
        document.getElementById('phoneTab').style.display = 'none'
        document.getElementById(type+'Tab').style.display = 'block'
        module.loginType = type;

        if (type == 'phone'){
            //图形验证码加载
            module.verificationCode1()
        }

        if (type == 'login'){
            //图形验证码加载
            module.verificationCode()
            document.getElementById('remberPsw').style.display = 'block'
        }

        $('#loginBtn').attr('class','')
        $('#phoneBtn').attr('class','')
        $('#'+type+'Btn').attr('class','active')
    }
    //背景高度
    module.register = function(){
        document.getElementById('registerBody').style.height = (document.body.offsetHeight - 112) +'px';
    }
    //图形验证码
    module.verificationCode = function () {
        tools.doGet(captchaImage_get, {}, module.verificationAjax, true)
    }
    module.verificationAjax = function (data) {
        if (data.code == 200) {
            $('#graphicImg').attr('src', 'data:image/gif;base64,' + data.img)
            module.uuid = data.uuid;
        }
    }

    //图形验证码
    module.verificationCode1 = function () {
        tools.doGet(captchaImage_get, {}, module.verificationAjax1, true)
    }
    module.verificationAjax1 = function (data) {
        if (data.code == 200) {
            $('#mobileGraphicImg').attr('src', 'data:image/gif;base64,' + data.img)
            module.uuid = data.uuid;
        }
    }
    //用户登录
    module.login = function () {
        if (module.check()) {
            var data = {};

            var usernameVal = tools.encrypt($('#username').val());
            var passwordVal = tools.encrypt($('#password').val());
            var codeVal = $('#code').val();

            var mobile = $('#mobile').val();
            var mobileCode = $('#mobileCode').val();
            var smsCode = $('#smsCode').val();

            data['uuid'] = module.uuid;

            if(module.loginType == 'login'){
                data['username'] = usernameVal;
                data['password'] = passwordVal;
                data['code'] = codeVal;
                tools.doPost(login_post, data, module.loginData, true)
            }

            if(module.loginType == 'phone'){
                data['mobile'] = mobile;
                data['smsCode'] = smsCode;
                data['code'] = mobileCode;
                tools.doPost(login_sms_post, data, module.loginData, true)
            }
        }
    };
    //手动验证表单
    module.check = function () {
        var usernameVal = $('#username').val();
        var passwordVal = $('#password').val();
        var codeVal = $('#code').val();

        var mobile = $('#mobile').val();
        var mobileCode = $('#mobileCode').val();
        var smsCode = $('#smsCode').val();

        var type = module.loginType;

        if (type == 'login'){
            /* 手机号 */
            if (usernameVal == '') {
                $('#username')[0].focus()
                tools.initTips('请输入用户名', 'right', $('#username')[0], 2000)
                return false;
            }
            /* 密码 */
            if (passwordVal == '') {
                $('#password')[0].focus()
                tools.initTips('请输入密码', 'right', $('#password')[0], 2000)
                return false;
            } else if (parseInt(passwordVal.length) < 6 || parseInt(passwordVal.length) > 18) {
                $('#password')[0].focus()
                tools.initTips('请输入正确格式密码', 'right', $('#password')[0], 2000)
                return false;
            }
            /*图形验证码*/
            if (module.uuid == '' || codeVal == '') {
                $('#code')[0].focus()
                tools.initTips('请输入图形验证码', 'right', $('#code')[0], 2000)
                return false;
            }
        }
        if (type == 'phone'){
            /* 手机号 */
            if (mobile == '') {
                $('#mobile')[0].focus()
                tools.initTips('请输入手机号码', 'right', $('#mobile')[0], 2000)
                return false;
            }
            /*图形验证码*/
            if (module.uuid == '' || mobileCode == '') {
                $('#mobileCode')[0].focus()
                tools.initTips('请输入图形验证码', 'right', $('#mobileCode')[0], 2000)
                return false;
            }
            /* 密码 */
            if (smsCode == '') {
                $('#smsCode')[0].focus()
                tools.initTips('请输入验证码', 'right', $('#smsCode')[0], 2000)
                return false;
            }
        }


        return true;
    }
    //登录校验
    module.loginData = function (data) {
        console.log(data)
        if (data.code == 500) {

            if (module.loginType == 'login'){
                module.verificationCode()
            }
            if (module.loginType == 'phone'){
                module.verificationCode1()
            }

        } else {
            tools.setCookie('Admin-Token', data.token, 24 * 60 * 60)
            //用户资料
            tools.doGet(userData, {}, module.userData);
            //tools.skip('/')
        }
    }
    //个人中心用户信息
    module.userData = function(data){
        if (data.code == 200) {
            var content = data.user;
            console.log(content)
            tools.setCookie('userId', content.userId, 24 * 60 * 60);
            tools.doGet(userMember + '/' + content.userId, {}, module.userMember);//memberType 1个人 2单位
        }
    }

    //个人中心用户资料
    module.userMember = function(data){
        if (data.code == 200) {
            var content = data.data;
            tools.setCookie('userName', content.realname, 24 * 60 * 60);
            tools.setCookie('memberId', content.id, 24 * 60 * 60);
            tools.setCookie('idCardNum',content.idCardNum,24 * 60 * 60)
            tools.setCookie('phone',content.phone,24 * 60 * 60)
            tools.setCookie('address',content.address,24 * 60 * 60)
            tools.setCookie('bankAddress',content.bankAddress,24 * 60 * 60)
            tools.setCookie('bankCardName',content.bankCardName,24 * 60 * 60)
            tools.setCookie('bankCardNum',content.bankCardNum,24 * 60 * 60)
            tools.setCookie('accountType',content.accountType,24 * 60 * 60)
            tools.setCookie('payeePaymentLines',content.payeePaymentLines,24 * 60 * 60)
            tools.setCookie('bankType',content.bankType,24 * 60 * 60)
            tools.skip('/sunVillage_info/index.html')
        }
    }
    return module;
});