ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

tp+javascript 输入框/绑定邮箱

2022-08-29 21:03:20  阅读:300  来源: 互联网

标签:ok resume javascript json tp 输入框 JSON file id


添加数据库 and 绑定邮箱!!!

 

实现效果:

 

 

数据库设计:

CREATE TABLE `o_my_resume` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `name` varchar(255) NOT NULL COMMENT '姓名',
  `job` text NOT NULL COMMENT '申请的岗位',
  `tel` varchar(255) NOT NULL COMMENT '手机号码',
  `ip` varchar(255) NOT NULL COMMENT 'IP',
  `addr` text NOT NULL COMMENT '地址',
  `file_id` text NOT NULL COMMENT '简历文件的ID',
  `status` tinyint(1) DEFAULT '1',
  `create_time` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT '申请日期',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=138 DEFAULT CHARSET=utf8 COMMENT='用户提交的简历';

前端页面:

<div class="job-apply-dialog">
    <div class="job-apply-dialog-inner">
        <div class="close"><i class="iconfont icon-close"></i></div>
        <div class="job-apply-dialog-header">
            <h3>填写简历</h3>
        </div>
        <div class="job-apply-dialog-body">
                <form id="form" method="post" role="form" class="job-apply-dialog-form" enctype="multipart/form-data">
                <div>
                    <label for="job">申请职位:</label>
                    <select name="job" id="job">
                        <volist name="jobs" id="job">
                            <option value="{$job.name}">{$job.name}</option>
                        </volist>
                    </select>
                </div>
                <div class="form-group ly-group">
                    <label for="">姓名:</label>
                    <input type="text" id="name" name="name"  placeholder="请输入姓名">
                </div>
                <div class="form-group ly-group">
                    <label for="">手机号码:</label>
                    <input type="text" id="tel" name="tel"  placeholder="请输入手机号码">
                </div>
                <div class="form-group ly-group">
                    <label for="">地址:</label>
                    <input type="text" id="addr" name="addr" required placeholder="请输入地址">
                </div>
                <div class="form-group ly-group">
                    <label for="">简历:<span class="tip">(请选择 PDF 或 Word,文件小于 5
                            MB)</span></label>
                    <input type="file" id="file" name="file" accept=".pdf, .doc, .docx" required>
                </div>
                <div class="form-group ly-group">
                    <label for="verify">验证码:<span class="tip">(如果验证码看不清,点击图片刷新)</span></label>
                    <div class="verify-block">
                        <input type="text" id="verify" name="verify" required size="4" minlength="4"
                            maxlength="4" placeholder="请输入4位验证码,不区分大小写">
                        <img class="verifyImage" src="/join/verifyImage" alt="验证码图片" width="220"
                            height="60">
                    </div>
                </div>
                <!-- <div class="submit" >
                    <button>提交简历</button>
                </div> -->
                <button type="submit">提交</button>
            </form>
        </div>
    </div>
</div>

script代码:

  <script>
        $('.job-apply-dialog-form').submit(function (event) {
            event.preventDefault();
            var form = event.target;
            var formData = new FormData(form);
            axios({
                method: "POST",
                // url: "/join/sendmsg",
                url: "/join/submitResume",
                data: formData,
                headers: { "Content-Type": "multipart/form-data" },
            }).then(function (response) {
                if (!response.data.ok) {
                    alert(response.data.error_msg);
                    return;
                } else {
                    $('.job-apply-dialog').removeClass('on');
                    alert(response.data.ok_msg);
                }
                console.log(response);
            }).catch(function (error) {
                console.log(error);
            }).then(function () {
                // 无论如何(提交成功与否)验证码都需要更新
                verifyImageEl.src += '?' + Math.random();
            })
        });

        var verifyImageEl = document.querySelector('.verifyImage');
        verifyImageEl.addEventListener('click', function (event) {
            this.src = this.src + '?' + Math.random();
        });
    </script>

php代码:

 public function submitResume()
    {
        if (!IS_POST) {
            // http_response_code(400);
            $this->show(json_encode(
                ['ok' => false, 'error_msg' => 'Invalid HTTP method, not POST'],
                JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT
            ), 'utf-8', 'application/json');
            return;
        }

        $verify = new \Think\Verify();
        if (!$verify->check(I('verify'))) {
            // http_response_code(400);
            $this->show(json_encode(
                ['ok' => false, 'error_msg' => '验证码错误'],
                JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT
            ), 'utf-8', 'application/json');
            return;
        }

        $upload = new \Think\Upload();
        $upload->maxSize = 5 * 1024 * 1024;
        $upload->exts = ['pdf', 'doc', 'docs'];
        $upload->rootPath = './Uploads/';
        $upload->savePath = 'Resume/';
        $info = $upload->uploadOne($_FILES['file']);
        if (!$info) {
            // http_response_code(400);
            $upload->getError();
            $this->show(json_encode(
                ['ok' => false, 'error_msg' => $upload->getError()],
                JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT
            ), 'utf-8', 'application/json');
            return;
        }



        $cont .= "申请职位:{$_POST['job']} \n\r";
        $cont = "姓名:{$_POST['name']} \n\r";
        $cont .= "电话:{$_POST['tel']} \n\r";
        $cont .= "地址:{$_POST['addr']} \n\r";
        $fileUrl = "./Uploads/{$info['savepath']}/{$info['savename']}";

        $file = array(
            $fileUrl
        );
    

        $res = think_send_mail('3136967582@qq.com', '您有新消息', '您有新消息', $cont,$file);
 

        // "info": {
        //     "name": "688566 吉贝尔 2020-09-08  关于选举职工代表监事的公告.pdf",
        //     "type": "application\/pdf",
        //     "size": 232146,
        //     "key": 0,
        //     "ext": "pdf",
        //     "md5": "8273ac225f90ed815ae089ec5e8687d2",
        //     "sha1": "b278a09a09ebc696a199551ec289a63076084d1e",
        //     "savename": "6156daca6e86c.pdf",
        //     "savepath": "Resume\/2021-10-01\/"
        // }
        $resume_file_id = M('resume_file')->add($info);
        if (!$resume_file_id) {
            $this->show(json_encode(
                ['ok' => false, 'error_msg' => '文件信息保存到数据库resume_file失败!'],
                JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT
            ), 'utf-8', 'application/json');
            return;
        }


        // job: 合成研究员 (2名)
        // name: a
        // tel: b
        // addr: c
        $result = M('my_resume')->add([
            'job' => I('job'),
            'name' => I('name'),
            'tel' => I('tel'),
            'ip' => get_client_ip(),
            'addr' => I('addr'),
            'file_id' => $resume_file_id,
        ]);


        
        if (!$result) {
            $this->show(json_encode(
                ['ok' => false, 'error_msg' => '简历信息保存到数据库my_resume失败!'],
                JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT
            ), 'utf-8', 'application/json');
            return;
        }
        

        $this->show(json_encode(
            ['ok' => true, 'ok_msg' => '成功提交简历!', 'info' => $info, 'resume_file_id' => $resume_file_id],
            JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT
        ), 'utf-8', 'application/json');

    }

最终结果  效果图:

 

标签:ok,resume,javascript,json,tp,输入框,JSON,file,id
来源: https://www.cnblogs.com/gaoyusui/p/16637320.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有