postjob.html 26.8 KB

原文件审查历史永久链接

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link rel="stylesheet" href="https://at.alicdn.com/t/font_886149_x7uh64tifl.css">

    <link rel="stylesheet" href="__TMPL__/public/assets/css/swiper.min.css">
    <link rel="stylesheet" href="__TMPL__/public/assets/css/weui.css"/>
    <link rel="stylesheet" href="__TMPL__/public/assets/css/base.css">
    <link rel="stylesheet" href="__TMPL__/public/assets/css/index.css">

    <title>我要兼职</title>
    <script type="text/javascript" src="__TMPL__/public/assets/js/jquery.min.js"></script>
    <script type="text/javascript" src="__TMPL__/public/assets/js/base.js"></script>
    <style>
        .weui-picker__item{
            font-size: 0.3rem;
        }
        .swiper-container,.swiper-wrapper,.swiper-slide{
            height:2.78rem;
        }
        .swiper-slide img{
            height:100%;
            width:100%;
        }
        .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
            bottom: 6px;
            left: 0;
            width: 100%;
        }
        .join{
            display:flex;
            height: 1rem;
            padding: 0 0.29rem;
            align-items: center;
            background: #F5F6FA;
            margin-top: 0.36rem;
        }
        #select{
            width:4rem;
            height:0.5rem;
            font-size: 0.3rem;
            background: transparent;
            margin-bottom: 1.1rem;
            border:none;
            outline: nones;
        }
        .list_attention{
            display:flex;
            justify-content: space-between;
            align-items: center;
        }
        .selsctoption{
            width: 4.5rem;

            color: #97A0A8;
            font-size: 0.26rem;
            height: 0.5rem;
            line-height: 0.5rem;
        }
    </style>
</head>
<body>
<!--实名认证-->
<div class="registerwrapper" <eq name="final.is_check" value="1"> style="display: none" </eq>>
    <div class="registerpop">
        <div class="cloudhead">
            <p class="cloudone">
                <img src="__TMPL__/public/assets/images/aicon01@2x.png" alt="">
            </p>
            <p class="authrity">实名认证</p>
            <p class="cloudtwo">
                <img src="__TMPL__/public/assets/images/aicon02@2x.png" alt="">
            </p>
        </div>
        <div class="people">
            <p class="people_nameimg"><img src="__TMPL__/public/assets/images/aicon03@2x.png" alt=""></p>
            <p class="people_name">
                <input type="text" placeholder="姓名" class="peopelname">
            </p>
        </div>
        <div class="people">
            <p class="people_phoneimg"><img src="__TMPL__/public/assets/images/aicon04@2x.png" alt=""></p>
            <p class="people_phonename">
                <input type="text" placeholder="手机号" class="peopelphone">
            </p>
        </div>
        <div class="people">
            <p class="people_cardimg"><img src="__TMPL__/public/assets/images/aicon05@2x.png" alt=""></p>
            <p class="people_cardname">
                <input type="text" placeholder="身份证号" class="peopelcard">
            </p>
        </div>
        <div class="sub">提交</div>
    </div>
</div>
<!--用户协议-->
<div class="workerwapper" style="display:none">
    <div class="worderpop">
        <div class="workerhead">
            {$final.art.title}
        </div>
        <div class="worktext">
            {$final.art.content}
        </div>
        <p class="agree">点击“同意”，即表示您同意上述内容。</p>
        <div class="agreebtn">
            <p class="cancel">取消</p>
            <p class="agreematerial">同意</p>
        </div>
    </div>
</div>

<!--提交审核之后的弹层-->
<div class="examinewrapper" style="display:none">
    <div class="examinepop">
        <div class="examine">
            <p class="waitexamine">您的申请已经提交，请等待审核</p>
            <p class="waitimg">
                <img src="__TMPL__/public/assets/images/aicon08@2x.png" alt="">
            </p>
        </div>

    </div>
</div>
<!--提交成功之后弹层-->
<div class="materialwrapper" <eq name="final.is_resume" value="0"> style="display: none" </eq>>
    <div class="materialpop">
        <p class="materialimg">
            <img src="__TMPL__/public/assets/images/bicon06@2x.png" alt="">
        </p>
        <div class="material_name">
            <eq name="final.is_resume" value="2">
            <p class="materialname">您已成功填写求职信息，请等待审核</p>

            </eq>
            <eq name="final.is_resume" value="3">
                <p class="materialname">您已成功填写求职信息，请在个人中心</p>
                <p class="materialname">
                    <a href="{:url('member/myresume')}" class="myresume">我的简历</a>
                    进行查看
                </p>
            </eq>
        </div>
    </div>
</div>
<div class="container">
    <!--<div class="head">-->
    <!--<img src="__TMPL__/public/assets/images/abanner@2x.png" alt="">-->
    <!--</div>-->

    <div class="head">
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <volist name="final.banner" id="banner">
                    <div class="swiper-slide">
                        <img src="{:cmf_get_image_url($banner.pic)}" alt="" >
                    </div>
                </volist>
            </div>
            <div class="swiper-pagination"></div>
        </div>
    </div>
    <div class="bad">

        <div class="position">
            <div class="sign">
                <img src="__TMPL__/public/assets/images/aicon09@2x.png" alt="">
            </div>
            <!--<p class="place">我的位置：</p>-->
            <input type="text" class="place" placeholder="我的位置" readonly>
            <input type="text" class="enterplace"  placeholder="天津市西青区花园科技园">
        </div>


        <!--雇佣信息-->
        <div class="hire">
            <p class="hire_img">
                <img src="__TMPL__/public/assets/images/aicon06@2x.png" alt="">
            </p>
            <p class="hire_name">兼职信息</p>
            <p class="wire"></p>
        </div>

        <div class="list">
            <div class="list_name">微信号</div>
            <div class="listenter">
                <input type="text" placeholder="请输入您的微信号" class="wx" >
            </div>
        </div>
        <div class="list">
            <p class="list_name">年龄</p>
            <div class="listenter">
                <input type="text" placeholder="请输入您的年龄" class="age" >
            </div>
        </div>
        <div class="list_sex sexselect">

            <!--<div class="listenter">-->
            <!--<input type="text" placeholder="请输入雇主名称" >-->
            <!--</div>-->
            <div class="sex_name">
                <p class="list_sexname">性别</p>
                <p class="sexchose">请选择</p>
            </div>

            <p class="row">
                <img src="__TMPL__/public/assets/images/bicon01@2x.png" alt="">
            </p>
        </div>

        <div class="list_sex seclectschool">

            <!--<div class="listenter">-->
            <!--<input type="text" placeholder="请输入雇主名称" >-->
            <!--</div>-->
            <div class="sex_name ">
                <p class="list_sexname">学历</p>
                <p class="sex">小学毕业</p>
            </div>

            <p class="row">
                <img src="__TMPL__/public/assets/images/bicon01@2x.png" alt="">
            </p>
        </div>
        <div class="list">
            <p class="list_name">居住地址</p>
            <div class="listenter">
                <input type="text" placeholder="请填写您的居住地址" class="address" >
            </div>
        </div>

        <div class="list">
            <p class="list_name">赋闲时间</p>
            <div class="listenter">
                <input type="text" placeholder="请输入您的赋闲时间" class="free_time">
            </div>
        </div>

        <div class="list" >

            <div class="list_name">求职意向</div>
            <div class="listenter list_attention"  >
                <p class="selsctoption">请选择求职意向</p>
                <p class="row">
                    <img src="__TMPL__/public/assets/images/bicon01@2x.png" alt="">
                </p>
            </div>
        </div>

        <div class="skill">
            <div class="jobskillname">
                职业技能
            </div>
            <div class="skillist">
                <div class="skill_item " >
                    <!--<div class="skill_itemname">-->
                    <!--&lt;!&ndash;<p class="skill_itemtext">办公软件</p>&ndash;&gt;-->
                    <!--<input type="text" class="skill_itemtext skill1" placeholder="办公软件" >-->
                    <!--<p class="skill_itemimg deleteimg"><img src="__TMPL__/public/assets/images/bicon02@2x.png" alt=""></p>-->
                <!--</div>-->
                </div>
                <div class="addskill">
                    <input type="text" placeholder="请添加您的职业技能" class="enterskill skillCount">
                    <p class="addskillimg">
                        <img src="__TMPL__/public/assets/images/bicon03@2x.png" alt="">
                    </p>
                </div>
            </div>
        </div>

        <div class="work">
            <p class="workrequire">工作经历</p>
            <textarea name="" id="workrequire" cols="30" rows="5" placeholder="请输入您的工作经历" class="experience"></textarea>
            <div class="wordnum">
                <p class="before">0</p>
                <p class="line">/</p>
                <p class="after">500</p>
            </div>
        </div>

        <div class="uploadpic">
            <p class="uploadcard">上传身份证正反面照片</p>
            <div class="uploadcardimg">
                <div class="front">
                    <!--<p class="uploadimg">-->
                    <!--<img src="__TMPL__/public/assets/images/bicon04@2x.png" alt="">-->
                    <!--</p>-->

                    <div id="preview" class="uploadimg">
                        <img id="imghead" border="0" src="__TMPL__/public/assets/images/bicon04@2x.png" style="width:100%;height:100%" onclick="$('#previewImg').click();">
                    </div>
                    <!--<img src="__TMPL__/public/assets/images/delet.png" alt="" style="position:absolute;bottom:92px;left:46px" class="deleteimg"/>-->
                    <input type="file" onchange="previewImage(this)" style="display: none;" id="previewImg">
                    <input type="hidden" id="face"/>
                    <p class="uploadimgname uploadfront">点击上传正面照</p>
                </div>
                <div class="back">
                    <!--<p class="uploadimg">-->
                    <!--<img src="__TMPL__/public/assets/images/bicon04@2x.png" alt="">-->
                    <!--</p>-->
                    <div id="preview1" class="uploadimg">
                        <img id="imghead1" border="0" src="__TMPL__/public/assets/images/bicon04@2x.png" style="width:100%;height:100%" onclick="$('#previewImg1').click();">
                    </div>
                    <!--<img src="__TMPL__/public/assets/images/delet.png" alt="" style="position:absolute;bottom:92px;left:46px" class="deleteimg"/>-->
                    <input type="hidden" id="back"/>
                    <input type="file" onchange="previewImage1(this)" style="display: none;" id="previewImg1">

                    <p class="uploadimgname uploadback">点击上传反面照</p>
                </div>
            </div>
        </div>
        <div class="agree">
            <p class="iconfont select icon-weixuanze "></p>
            <div class="agreement">
                <p class="meagree">我已同意</p>
                <p class="protoal">《用户协议》</p>
            </div>
        </div>
        <div class="listenme">
            <div class="listen">
                <p class="listen_img">
                    <img src="__TMPL__/public/assets/images/aicon07@2x.png" alt="">
                </p>
                <p class="listen_name">联系客服</p>
            </div>
            <div class="mesub">
                提交
            </div>
        </div>
    </div>

</div>


<!--begin:提示弹层-->
<div class="pop_fn"></div>

<script type="text/javascript" src="__TMPL__/public/assets/js/swiper.min.js"></script>

<script>
    var mySwiper = new Swiper('.swiper-container', {
        pagination: {
            el: '.swiper-pagination',
        },
        autoplay: true,//可选选项，自动滑动

    });
    // 实名认证提交
    $('.sub').click(function () {
        $.ajax({
            type: 'POST',
            url: "{:url('Index/Authentication')}",
            data: {
                'name' : $('.peopelname').val(),
                'tel' : $('.peopelphone').val(),
                'card_num' : $('.peopelcard').val()
            },
            success: function (res) {
                if(res.code == 1){
                    popup('实名认证成功');
                    $('.registerwrapper').css('display','none');
                }else{
                    popup(res.message)
                }
            },
            error: function (res) {
                popup('网络错误，请刷新')
            }
        });
    })


    var sexlist=[{
        label: '男',
        value: 0
    }, {
        label: '女',
        value: 1
    }]
    $('.sexselect').on('click', function () {

        weui.picker(sexlist, {
            onChange: function (result) {
                console.log(result);
            },
            onConfirm: function (result) {
                console.log(sexlist[result[0]].label);
                $(".sexchose").html(sexlist[result[0]].label)
                $(".sexchose").attr('index',sexlist[result[0]].value)
            }
        });
    });


    var list=[{
        label: '小学毕业',
        value: 0
    }, {
        label: '初中毕业',
        value: 1
    }, {
        label: '高中毕业',
        value: 2
    }, {
        label: '中等专业学校毕业',
        value: 3
    }, {
        label: '专科毕业',
        value: 4
    }, {
        label: '本科毕业',
        value: 5
    }, {
        label: '硕士研究生',
        value: 6
    }, {
        label: '博士研究生',
        value: 7
    }, {
        label: '其他',
        value: 8
    }]
    $('.seclectschool').on('click', function () {

        weui.picker(list, {
            onChange: function (result) {
                console.log(result);
            },
            onConfirm: function (result) {
                console.log(list[result[0]].label);
                $(".sex").html(list[result[0]].label);
                $(".sex").attr('index',list[result[0]].value);
            }
        });
    });


    //选择注意事项

    var postlist=[{
        label: '男',
        value: 0
    }, {
        label: '女',
        value: 1
    }];
    console.log(postlist);
    // $('.list_attention').on('click', function () {
    //     weui.picker(joblist3, {
    //         onChange: function (result3) {
    //             // console.log(result3);
    //             console.log('222222222');
    //             console.log(result3);
    //             $(".selsctoption").html(joblist3[result3[0]].label)
    //             $(".selsctoption").attr('index',joblist3[result3[0]].value)
    //         },
    //         onConfirm: function (result3) {
    //             // console.log(result3);
    //             console.log('111111111111');
    //             // console.log(joblist[result[0]].label);
    //             $(".selsctoption").html(joblist3[0].label)
    //             $(".selsctoption").attr('index',joblist3[0].value)
    //         }
    //     });
    // });


    $('.list_attention').on('click', function () {

        weui.picker(postlist, {
            onChange: function (result) {
                console.log(result);
            },
            onConfirm: function (result) {
                $(".selsctoption").html(result[0].label)
                $(".selsctoption").attr('index',result[0].value)
            }
        });
    });
    //用户协议
    $(".protoal").click(function(){
        $(".workerwapper").css("display","block");
        $('.select').removeClass("icon-weixuanze");
        $('.select').addClass("icon-yixuanze");
    })
    $(".cancel,.agreematerial").click(function(){
        $(".workerwapper").css("display","none")
    })
    //是否同意协议
    $(".select").click(function(){
        console.log($(this).attr("class"))
        if($(this).attr("class")=='iconfont select icon-weixuanze '){
            $(this).removeClass("icon-weixuanze");
            $(this).addClass("icon-yixuanze");
        }else if($(this).attr("class")=='iconfont select icon-yixuanze'){
            $(this).removeClass("icon-yixuanze");
            $(this).addClass("icon-weixuanze");
        }
    })
    //字体输入
    $("#workrequire").keyup(function(){
        var len=$(this).val().length;
        $(".before").html(len);
        var tt=$("#workrequire").val().substring(0,500)
        if(len>500){
            popup("请输入500个内的字");
            $(this).val(tt)
        }
    })
    //添加职业技能
    $(".addskillimg").click(function(){
        var cal=$(this).siblings(".enterskill").val();

        if(cal.length ==0 ){
            popup("请添加您的职业技能")
        }else{

            var text="";
            text+=' <div class="skill_itemname">' +
                ' <input type="text" class="skill_itemtext skillCount" value="'+cal+'">'+
                '<p class="skill_itemimg deleteimg"><img src="__TMPL__/public/assets/images/bicon02@2x.png" alt=""></p>\n' +
                '</div>'

            $(".skill_item").append(text);
            // $(".enterskill").val("请添加您的职业技能")
            $(".enterskill").val('');
            $(".enterskill").attr('placeholder',"请添加您的职业技能");
        }

    })

    $(".skill").on("click",".deleteimg",function(){
    $(this).parents(".skill_itemname").remove();
    })

    // 提交时资料不完善
    $(".mesub").click(function(){
        var wx = $('.wx').val();
        var age = $('.age').val();
        var sex = $(".sexchose").attr('index');
        var education = $(".sex").attr('index');
        var address = $('.address').val();
        var free_time = $('.free_time').val();
        var select_id = $('#select').val();
        var skill = $('.skill1').val();
        var experience = $('.experience').val();
        var isTrue = $(".select").hasClass("icon-yixuanze");
        var face = $('#face').val();
        var back = $('#back').val();
        var arr = [];
        $('.skillCount').each(function (index,val) {
            arr.push($(this).val());
        });
        if(isTrue == true){
            $.ajax({
                type: 'POST',
                url: "{:url('Index/resume')}",
                data: {
                    'wx' : wx,
                    'age' : age,
                    'sex' : sex,
                    'education' : education,
                    'address' : address,
                    'free_time' : free_time,
                    'select_id' : select_id,
                    'skill' : arr,
                    'experience' : experience,
                    'just' : face,
                    'back' : back,
                },
                success: function (res) {
                    if(res.code == 1){
                        $('.examinewrapper').css('display','block');
                        setTimeout(location.href="{:url('Member/index')}",2000);
                    }else{
                        popup(res.message);
                    }
                    console.log('1111111');
                    console.log(res);
                },
                error: function (res) {
                    console.log('33333333');
                    console.log(res);
                }
            });
        }else{
            console.log('2w22222222');
            popup('请先勾选劳动者协议');
        }
    });
    // 上传图片
    function clacImgZoomParam(maxWidth, maxHeight, width, height) {
        var param = {
            top: 0,
            left: 0,
            width: width,
            height: height
        };
        if(width > maxWidth || height > maxHeight) {
            rateWidth = width / maxWidth;
            rateHeight = height / maxHeight;

            if(rateWidth > rateHeight) {
                param.width = maxWidth;
                param.height = Math.round(height / rateWidth);
            } else {
                param.width = Math.round(width / rateHeight);
                param.height = maxHeight;
            }
        }
        param.left = Math.round((maxWidth - param.width) / 2);
        param.top = Math.round((maxHeight - param.height) / 2);
        return param;
    }
    //正面照
    function previewImage(file) {
        $(".uploadfront").css("display","none")
        var MAXWIDTH = 50;
        var MAXHEIGHT = 50;
        var div = document.getElementById('preview');
        if(file.files && file.files[0]) {
            div.innerHTML = '<img id=imghead onclick=$("#previewImg").click()>';
            var img = document.getElementById('imghead');
            img.onload = function() {
                var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
                img.width = rect.width;
                img.height = rect.height;
                //                 img.style.marginLeft = rect.left+'px';
                img.style.marginTop = rect.top + 'px';
            }
            var reader = new FileReader();
            reader.onload = function(evt) {
                img.src = evt.target.result;
            }
            reader.readAsDataURL(file.files[0]);
        } else //兼容IE
        {
            var sFilter = 'filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src="';
            file.select();
            var src = document.selection.createRange().text;
            div.innerHTML = '<img id=imghead>';
            var img = document.getElementById('imghead');
            img.filters.item('DXImageTransform.Microsoft.AlphaImageLoader').src = src;
            var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
            status = ('rect:' + rect.top + ',' + rect.left + ',' + rect.width + ',' + rect.height);
            div.innerHTML = "<div id=divhead style='width:" + rect.width + "px;height:" + rect.height + "px;margin-top:" + rect.top + "px;" + sFilter + src + "\"'></div>";
        }

        var thisFile = document.getElementById("previewImg").files[0];
        var formData = new FormData();
        formData.append('file',thisFile);
        $.ajax({
            url: "{:url('Index/getPic')}",
            type: "POST",
            data: formData,
            /**
             *必须false才会自动加上正确的Content-Type
             */
            contentType: false,
            /**
             * 必须false才会避开jQuery对 formdata 的默认处理
             * XMLHttpRequest会对 formdata 进行正确的处理
             */
            processData: false,
            success: function (data) {
                if(data.code == 1){
                    $('#face').val(data.data);
                    // popup('上传成功');
                }else{
                    popup(data.message)
                }
                console.log(data);
            },
            error: function () {
                popup("上传失败！");
            }
        });


    }

    //  反面照
    function previewImage1(file) {
        $(".uploadback").css("display","none")
        var MAXWIDTH = 50;
        var MAXHEIGHT = 50;
        var div = document.getElementById('preview1');
        if(file.files && file.files[0]) {
            div.innerHTML = '<img id=imghead1 onclick=$("#previewImg1").click()>';
            var img = document.getElementById('imghead1');
            img.onload = function() {
                var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
                img.width = rect.width;
                img.height = rect.height;
                //                 img.style.marginLeft = rect.left+'px';
                img.style.marginTop = rect.top + 'px';
            }
            var reader = new FileReader();
            reader.onload = function(evt) {
                img.src = evt.target.result;
            }
            reader.readAsDataURL(file.files[0]);
        } else //兼容IE
        {
            var sFilter = 'filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src="';
            file.select();
            var src = document.selection.createRange().text;
            div.innerHTML = '<img id=imghead>';
            var img = document.getElementById('imghead');
            img.filters.item('DXImageTransform.Microsoft.AlphaImageLoader').src = src;
            var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
            status = ('rect:' + rect.top + ',' + rect.left + ',' + rect.width + ',' + rect.height);
            div.innerHTML = "<div id=divhead style='width:" + rect.width + "px;height:" + rect.height + "px;margin-top:" + rect.top + "px;" + sFilter + src + "\"'></div>";
        }

        var thisFile1 = document.getElementById("previewImg1").files[0];
        var formData1 = new FormData();
        formData1.append('file',thisFile1);
        $.ajax({
            url: "{:url('Index/getPic')}",
            type: "POST",
            data: formData1,
            /**
             *必须false才会自动加上正确的Content-Type
             */
            contentType: false,
            /**
             * 必须false才会避开jQuery对 formdata 的默认处理
             * XMLHttpRequest会对 formdata 进行正确的处理
             */
            processData: false,
            success: function (data) {
                if(data.code == 1){
                    $('#back').val(data.data);
                    // popup('上传成功');
                }else{
                    popup(data.message)
                }
                console.log(data);
            },
            error: function () {
                popup("上传失败！");
            }
        });
    }


</script>

<script src="__TMPL__/public/assets/js/zepto.min.js"></script>
<script type="text/javascript" src="https://res.wx.qq.com/op__TMPL__/public/assets/js/jweixin-1.0.0.js"></script>
<script src="https://res.wx.qq.com/open/libs/weuijs/1.0.0/weui.min.js"></script>
<script src="__TMPL__/public/assets/js/example.js"></script>
</body>
</html>