function loginRegister(id) {
    this.$modalBtn = $("#" + id);
}

loginRegister.prototype.getFormDatat = function (_this) {
    let formData = {};
    $("#modal-skew-from-left .swiper_type_form input").each(function (index, elem) {
        let name = $(elem).attr("name");
        let value = $(elem).val();
        formData[name] = value;
    });
    return formData;
}
loginRegister.prototype.initEvent = function () {
    let _this = this;
    this.initLoginRegister();
    $("#login_box").submit(function (e) {
        event.preventDefault();
        console.log(_this.getFormDatat(this));
        _this.closeModal();
    });
    this.$modalBtn.click(function () {
        _this.showLoginRegister();
    });
    $('.modal-background,.close_btn').on('click', function (e) {
        e.preventDefault();
        _this.closeModal();
    });
}
loginRegister.prototype.showLoginRegister = function () {
    $('.modal-background').addClass('show');
    $('#modal-skew-from-left').addClass('show');
}
loginRegister.prototype.closeModal = function () {
    $('.modal-background').removeClass('show');
    $('.modal_box.show').removeClass('show');
}
loginRegister.prototype.initLoginRegister = function () {
    if ($("#modal-skew-from-left").length < 1) {
        $("body").append(`
					<style>
						.clearfix:after {content:"";display:block;height:0;clear:both;}
						.clearfix {zoom:1;}
						#modal-skew-from-left {top: 40%;left: 0;transform: skewX(40deg) translate(-200%, -50%);transition: all 1s cubic-bezier(0.68, -0.55, 0.265, 1.55);}
						#modal-skew-from-left.show {left: 50%;transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1);transform: translate(-50%, -50%);}
						.modal-background {position: fixed;top: 0;right: 0;bottom: 0;left: 0;background: rgba(0, 0, 0, 0.5);z-index: 98;pointer-events: none;display: none;}
						.modal-background.show {display: block;opacity: 1;pointer-events: auto;animation: fadein 0.8s;}
						.modal-background.hide {animation: fadeout 0.8s;}
						@keyframes fadein {from {opacity: 0;}to {opacity: 1;}}
						@keyframes fadeout {from {opacity: 1;}to {opacity: 0;}}
						.modal_box {position: fixed;padding-bottom: 15px;box-shadow: 0px 0px 5px 0px #fff;background: #fff;color: #fff;
						transform-style: preserve-3d;border-radius: 5px;z-index: 999;width: 254px;}
						.modal_box h3{margin: 10px 0;color: #39B778;font-size: 16px;font-weight: bold;text-align: center;text-indent:10px;line-height: 40px;position: relative;}
						.modal_box .form_box{padding:0 15px;}
						.modal_box .form_box .input_box{position:relative;}
						.modal_box .form_box .input_box:before{content:"";position:absolute;top:10px;left:8px;width:18px;height:21px;background:url(/imagesnewmob/info_phone.png) no-repeat center center;background-size:cover;}
						.modal_box .form_box div input{color: #333;height: 43px;line-height:43px;font-size: 14px;width: 100%;padding: 0px 15px 0 30px;box-sizing: border-box;border:1px solid #eee;border-radius:10px;}
						.modal_box .form_box  button{margin-top: 20px;font-size: 14px;height: 36px;border: none;line-height: 36px;text-align: center;width: 45%;color: #fff;border-radius: 5px;}
						.modal_box .form_box .btn_item .sure{float:left; background-color: #39B778;color: #fff;}
						.modal_box .form_box .btn_item .close_btn{float:right;background-color: #E5FFF7;color: #39B778;}
					</style>
					<div id="modal-skew-from-left" class="modal_box">
						<h3 class="type_list active">预约下载</h3>
						<div class="swiper_type swiper_type_form">
							<div class="type_list active">
								<form class="form_box" id="login_box"  action="" method="get">
									<div class="input_box"><input name="phone" placeholder="请输入手机号" type="text" ></div>
									<div class="btn_item clearfix">
										<button class="sure" type="submit">我要预约</button>
										<button class="close_btn" type="cancel">取消</button>
									</div>
								</form>
							</div>
						</div>
					</div>
					<div class="modal-background"></div>
				`);
    }
}
let loginRegisterClass = new loginRegister("appointment_btn");
loginRegisterClass.initEvent();