jjhc
/
recruit


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283
							<!DOCTYPE html>
<html lang="zh-cn">
<head>
    {include file="public/meta_header"/}
    <style>
        :root {
            --el-color-primary: #dd4250;
        }

        .el-tabs__item {
            font-size: 18px;
        }

        .el-form-item {
            padding-top: 15px;
        }

        .el-input__inner, .el-form-item__label {
            height: 40px;
            line-height: 40px;
        }

        .el-form-item__label {
            font-size: 16px;
        }

        .login-box {
            width: 472px;
            margin: 0 auto;
            padding-bottom: 150px;
            padding-top: 90px;
        }

        .login-box .login-logo {
            margin-bottom: 35px;
            margin-left: 50px;
        }

        .login-box .login-logo a {
            display: inline-block;
            vertical-align: middle;
        }

        .login-box .login-logo img {
            width: 40px;
        }

        .login-box .login-logo .backhome {
            background: url("/static/home/images/bg_back.png") no-repeat center;
            padding: 5px 15px;
            font-size: 13px;
            color: #616887;
            margin-top: 10px;
        }

        .login-box .login-box-per-body {
            background-color: #fff;
            width: 472px;
            border-radius: 5px;
            -moz-box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.1);
            -webkit-box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.1);
            box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.1);
        }

        .form-box {
            width: 332px;
            margin: 0 auto;
            padding: 30px 0;
        }

        .login-box .txt-group {
            font-size: 12px;
            width: 332px;
            margin-bottom: 30px;
            height: 16px;
        }

        .login-box .txt-group .txt-r {
            float: right;
            color: #9ea1b1;
            text-decoration: none;
        }

        .login-box .btn-group {
            width: 332px;
            height: 50px;
            background-color: #dd4250;
            border-radius: 25px;
            text-align: center;
            line-height: 42px;
            color: #ffffff;
            margin-bottom: 20px;
            cursor: pointer;
            border: none;
            font-size: 20px;
            letter-spacing: 10px;
        }

        .login-box .reg-link-box {
            width: 332px;
            color: #9ea1b1;
            font-size: 14px;
            margin-bottom: 15px;
            line-height: 26px;
            height: 26px;
            text-align: right;
        }

        .login-box .reg-link-box .reg-txt {
            display: inline-block;
            color: #fe2e5f;
            text-decoration: none;
        }

        .bind_code {
            position: relative;
        }

        .bind_code .el-button {
            border: 0;
            background: none;
            padding: 0;
            border-radius: 0;
        }

        .bind_code .bind_code_gain {
            position: absolute;
            right: 10px;
            font-size: 14px;
            color: #dd4250;
            cursor: pointer;
            padding-left: 10px;
            border-left: 1px solid #d8d8d8;
            height: 40px;
            line-height: 40px;
        }
    </style>
</head>
<body>
<div id="app">
    <div class="login-box">
        <div class="login-logo">
            <a href="{:url('/')}"><img src="/static/home/images/img_logo.png" alt="logo"></a>
            <a href="{:url('/')}" class="backhome">返回首页</a>
        </div>

        <div class="login-box-per-body">
            <div class="form-box">
                <el-form :model="form" label-width="auto" style="max-width: 600px">
                    <el-form-item label="手机号">
                        <el-input v-model="form.mobile" placeholder="请输入手机号"></el-input>
                    </el-form-item>
                    <el-form-item label="验证码">
                        <div class="bind_code margin_top">
                            <el-input
                                    class="bind_code_input code"
                                    v-model="form.verify"
                                    type="text"
                                    placeholder="请输入验证码"
                            ></el-input>
                            <el-button
                                    @click="bindSendCode"
                                    class="bind_code_gain"
                                    :disabled="disabled"
                            >{{ btnText }}
                            </el-button>
                        </div>
                    </el-form-item>
                    <el-form-item label="密码" prop="password">
                        <el-input v-model="form.password" type="password" autocomplete="off"
                                  placeholder="请输入密码"></el-input>
                    </el-form-item>
                    <el-form-item label="确认密码" prop="re_password">
                        <el-input v-model="form.re_password" type="password" autocomplete="off"
                                  placeholder="请确认密码"></el-input>
                    </el-form-item>
                    <input style="margin-top:20px;" class="btn-group login-account" @click="doRegister" type="button" value="注册">
                    <div class="reg-link-box">
                        已有账号？<a class="reg-txt register_user" href="{:url('login/index')}">立刻登录</a>
                    </div>
                </el-form>
            </div>
        </div>
    </div>
    <div class="index_footer">
        <div class="index_footer_links">
            <a target="_blank" href="http://hxks.hxrc-app.com">网站首页</a>
            <a target="_blank" href="http://hxks.hxrc-app.com/content/explain/show/9">单位介绍</a>
            <a target="_blank" href="http://hxks.hxrc-app.com/content/suggest/index">意见建议</a>
        </div>
        <div class="index_footertxt">
            <p>招考服务热线：0595-82008296</p>
            <p>地址：福建省泉州市晋江市梅岭街道碧山社区梅岭路273号</p>
            <p>网站备案：<a href="https://beian.miit.gov.cn/" target="_blank">闽ICP备17033895号</a></p>

        </div>
    </div>
</div>

<script>
    function v_setup() {
        let base = {};

        base.form = Vue.reactive({mobile: '', verify: '', password: '', re_password: ''});

        base.btnText = Vue.ref('获取验证码');
        base.disabled = Vue.ref(false);
        base.bindSendCode = () => {
            //手机号 为空的话
            if (base.form.mobile != '') {
                postJson('/register/sendSms',base.form).then(() => {
                    ElMessage.success('已发送验证码，请查收')
                    base.disabled.value = true;
                    base.btnText.value = "请稍候...";
                    setTimeout(() => {
                        base.doLoop(60);
                    }, 500);
                });
            } else {
                ElMessage.error('请输入手机号')
            }
        }
        base.doLoop = function (seconds) {
            seconds = seconds ? seconds : 60;
            base.btnText.value = seconds + "s后获取";
            let countdown = setInterval(() => {
                if (seconds > 0) {
                    base.btnText.value = seconds + "s后获取";
                    --seconds;
                } else {
                    base.btnText.value = "获取验证码";
                    base.disabled.value = false;
                    clearInterval(countdown);
                }
            }, 1000);
        }

        base.doRegister = () => {
            if (base.form.mobile === '') {
                ElMessage.error('请输入手机号');
                return false;
            }
            if (base.form.verify === '') {
                ElMessage.error('请输入验证码');
                return false;
            }
            if (base.form.password === '') {
                ElMessage.error('请输入密码');
                return false;
            }
            if (base.form.password !== base.form.re_password) {
                ElMessage.error('两次密码不一致');
                return false;
            }
            postJson('/register/doRegister',base.form).then(({data}) => {
                location.href = "{:url('login/index')}";
            });
        }

        return base;
    }
</script>
<script>
    const vue3 = {
        setup() {
            return v_setup();
        }
    };

    const app = Vue.createApp(vue3);
    for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
        app.component(key, component);
    }
    app.use(ElementPlus);
    const ElMessageBox = ElementPlus.ElMessageBox;
    const ElMessage = ElementPlus.ElMessage;
</script>
{block name="vue"}{/block}
<script>
    app.mount('#app');
</script>
</body>
</html>