rencuiliang
/
meibang


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157
							<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="/static/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/static/css/login.css">
    <script src="/static/js/jquery.min.js"></script>
    <script src="/static/js/bootstrap.min.js"></script>
    <script src="/static/js/vue-2.4.0.js"></script>
    <script src="/static/js/axios.min.js"></script>
    <script type="text/javascript" src="/static/js/jquery.select.js"></script>
    <title>Document</title>
</head>

<body>
    <div class="container container-small" id="app">
        <h1>登录
            <small>忘记密码？<a href="" onclick="return false;" data-toggle="modal" data-target="#myModal">修改密码</a></small>
        </h1>
        <div class="form-group">
            <label for="user1">用户名</label>
            <input type="text" class="form-control" id="user1" >
        </div>
        <div class="form-group">
            <label>密码</label>
            <input type="password" class="form-control" v-model="pswd">
        </div>
        <div class="form-group">
            <button type="submit" class="btn btn-primary submit" @click="login">登录</button>
        </div>
    </div>
    <div class="modal fade" id="myModal">
        <div class="modal-dialog">
            <div class="modal-content" style="width: 65%;">
                <div class="modal-header">
                    <div class="modal-title">修改密码</div>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label for="user2">用户名</label>
                        <input type="text" class="form-control upinput"  id="user2" autocomplete="off">
                    </div>
                    <div class="form-group">
                        <label for="pswd">旧密码</label>
                        <input type="password" class="form-control upinput" name="aa" id="oldpswd">
                    </div>
                    <div class="form-group">
                        <label for="pswd">新密码</label>
                        <input type="password" class="form-control upinput" name="aa" id="oldpswd">
                    </div>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-primary" data-dismiss="modal">确定</button>
                    <button class="btn btn-primary" data-dismiss="modal">取消</button>
                </div>
            </div>
        </div>
    </div>
    <script>
        var vm = new Vue({
            el: '#app',
            data: {
                up_time: '',
                user_1:'',
                user_2:'',
                pswd:'',
                pswd_old:'',
                pswd_new:'',
            },
            methods: {
                login() {
                    console.log($("#user1").val())
                    this.user_1 = $("#user1").val()
                    axios.post('/login/', {
                        params: {
                            user_1: this.user_1,
                            pswd: this.pswd,
                        }
                    })
                        .then(res => {
                            // alert(res.data)
                            var data1 = res.data
                            console.log(data1)
                        })
                        .catch(err => {
                            console.log(err.response["data"] + err.response["status"])
                        })
                },
            },
            created() {
            }
        });

        $(function () {
            // 开始写 jQuery 代码...
            var timer = null;
            // 定义一个公用的搜索接口
            function getStr(n, url, field, clickif) {
                //n为搜索的参数 url为请求的路由，filed是定位表单的id,
                //clickif用于判断是否是第一次加载，如果不是第一次加载则需要模拟点击
                var search = n
                // 配置路由
                if (typeof search === 'undefined') {
                    search = ''
                };
                console.log(search)
                axios.get(url, {
                    params: {
                        search_no: search
                    }
                })
                    .then(res => {
                        // alert(res.data)
                        var data1 = res.data.data
                        datas = data1
                        console.log(datas)
                        if (datas.length == 0) {
                            alert("没有搜索到数据")
                            return
                        }
                        $.selectSuggest(field, datas);
                        // 是否第一次进入
                        if (clickif !== 1) {
                            $("#" + field).trigger("click");
                        }
                    })
                    .catch(err => {
                        console.log('error:' + err)
                    })
            };

            //登录时获取用户信息
            $("#user1").bind("input propertychange", function (event) {
                var search = $("#user1").val()
                console.log($("#user1").val())
                timer && clearTimeout(timer);
                timer = setTimeout(function () {
                    getStr(search, '/logininformation/', 'user1');
                }, 2000);
            });
            getStr('', '/logininformation/', 'user1', 1);
            //修改密码时获取用户信息
            $("#user2").bind("input propertychange", function (event) {
                var search = $("#user2").val()
                console.log($("#user2").val())
                timer && clearTimeout(timer);
                timer = setTimeout(function () {
                    getStr(search, '/logininformation/', 'user2');

                }, 2000);
            });
        });
    </script>
</body>

</html>