Flask应用开发综合示例——在线招聘系统

下面是一个与前面不同的综合示例，展示如何使用 Python + Flask + HTML + CSS + JavaScript + jQuery + Bootstrap + SQLAlchemy 开发一个简单的 在线招聘系统。企业可以发布职位，求职者可以浏览职位、申请职位，并查看申请状态。

1. 项目结构

job_portal/
│
├── app.py                  # Flask 应用主文件
├── models.py               # SQLAlchemy 模型定义
├── requirements.txt        # 依赖文件
├── static/                 # 静态文件（CSS, JS, 图片等）
│   ├── css/
│   │   └── styles.css      # 自定义 CSS
│   └── js/
│       └── scripts.js      # 自定义 JavaScript
│
├── templates/              # HTML 模板文件
│   ├── base.html           # 基础模板
│   ├── index.html          # 主页模板
│   ├── post_job.html       # 发布职位模板
│   ├── jobs.html           # 职位列表模板
│   ├── job_detail.html     # 职位详情模板
│   ├── apply_job.html      # 申请职位模板
│   └── applications.html   # 申请记录模板
│
└── database.db             # SQLite 数据库文件

2. 安装依赖

在项目根目录下创建 requirements.txt 文件，内容如下：

Flask==2.3.2
Flask-SQLAlchemy==3.0.5
Bootstrap==5.3.0
jQuery==3.6.0

安装依赖：

pip install -r requirements.txt

3. Flask 应用 (`app.py`)

from flask import Flask, render_template, request, redirect, url_for, flash
from flask_sqlalchemy import SQLAlchemy

app = Flask(__name__)
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///database.db'  # SQLite 数据库
app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = False
app.config['SECRET_KEY'] = 'your_secret_key'  # 用于消息闪现的密钥
db = SQLAlchemy(app)

# 职位模型
class Job(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    title = db.Column(db.String(100), nullable=False)
    company = db.Column(db.String(100), nullable=False)
    location = db.Column(db.String(100), nullable=False)
    description = db.Column(db.Text, nullable=False)
    applications = db.relationship('Application', backref='job', lazy=True)

# 申请模型
class Application(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    applicant_name = db.Column(db.String(100), nullable=False)
    applicant_email = db.Column(db.String(100), nullable=False)
    job_id = db.Column(db.Integer, db.ForeignKey('job.id'), nullable=False)

# 主页路由
@app.route('/')
def index():
    return render_template('index.html')

# 发布职位路由
@app.route('/post_job', methods=['GET', 'POST'])
def post_job():
    if request.method == 'POST':
        title = request.form['title']
        company = request.form['company']
        location = request.form['location']
        description = request.form['description']
        new_job = Job(title=title, company=company, location=location, description=description)
        db.session.add(new_job)
        db.session.commit()
        flash('职位发布成功！', 'success')
        return redirect(url_for('jobs'))
    return render_template('post_job.html')

# 职位列表路由
@app.route('/jobs')
def jobs():
    jobs = Job.query.all()
    return render_template('jobs.html', jobs=jobs)

# 职位详情路由
@app.route('/job/<int:id>')
def job_detail(id):
    job = Job.query.get_or_404(id)
    return render_template('job_detail.html', job=job)

# 申请职位路由
@app.route('/apply/<int:id>', methods=['GET', 'POST'])
def apply_job(id):
    job = Job.query.get_or_404(id)
    if request.method == 'POST':
        applicant_name = request.form['applicant_name']
        applicant_email = request.form['applicant_email']
        new_application = Application(applicant_name=applicant_name, applicant_email=applicant_email, job=job)
        db.session.add(new_application)
        db.session.commit()
        flash('申请提交成功！', 'success')
        return redirect(url_for('job_detail', id=job.id))
    return render_template('apply_job.html', job=job)

# 申请记录路由
@app.route('/applications')
def applications():
    applications = Application.query.all()
    return render_template('applications.html', applications=applications)

if __name__ == '__main__':
    with app.app_context():
        db.create_all()
    app.run(debug=True)

4. HTML 模板

基础模板 (`templates/base.html`)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>在线招聘系统</title>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}">
</head>
<body>
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
        <div class="container">
            <a class="navbar-brand" href="{{ url_for('index') }}">在线招聘系统</a>
            <div class="navbar-nav">
                <a class="nav-link" href="{{ url_for('post_job') }}">发布职位</a>
                <a class="nav-link" href="{{ url_for('jobs') }}">职位列表</a>
                <a class="nav-link" href="{{ url_for('applications') }}">申请记录</a>
            </div>
        </div>
    </nav>
    <div class="container mt-4">
        {% with messages = get_flashed_messages(with_categories=true) %}
            {% if messages %}
                {% for category, message in messages %}
                    <div class="alert alert-{{ category }}">{{ message }}</div>
                {% endfor %}
            {% endif %}
        {% endwith %}
        {% block content %}{% endblock %}
    </div>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
    <script src="{{ url_for('static', filename='js/scripts.js') }}"></script>
</body>
</html>

主页模板 (`templates/index.html`)

{% extends 'base.html' %}

{% block content %}
<h1>欢迎来到在线招聘系统！</h1>
<p>发布职位或申请职位。</p>
<a href="{{ url_for('post_job') }}" class="btn btn-primary">发布职位</a>
<a href="{{ url_for('jobs') }}" class="btn btn-secondary">查看职位列表</a>
{% endblock %}

发布职位模板 (`templates/post_job.html`)

{% extends 'base.html' %}

{% block content %}
<h1>发布职位</h1>
<form method="POST">
    <div class="mb-3">
        <label for="title" class="form-label">职位标题</label>
        <input type="text" class="form-control" id="title" name="title" required>
    </div>
    <div class="mb-3">
        <label for="company" class="form-label">公司名称</label>
        <input type="text" class="form-control" id="company" name="company" required>
    </div>
    <div class="mb-3">
        <label for="location" class="form-label">工作地点</label>
        <input type="text" class="form-control" id="location" name="location" required>
    </div>
    <div class="mb-3">
        <label for="description" class="form-label">职位描述</label>
        <textarea class="form-control" id="description" name="description" rows="5" required></textarea>
    </div>
    <button type="submit" class="btn btn-primary">发布</button>
</form>
{% endblock %}

职位列表模板 (`templates/jobs.html`)

{% extends 'base.html' %}

{% block content %}
<h1>职位列表</h1>
<ul class="list-group">
    {% for job in jobs %}
    <li class="list-group-item">
        <h5>{{ job.title }}</h5>
        <p>公司: {{ job.company }}</p>
        <p>地点: {{ job.location }}</p>
        <a href="{{ url_for('job_detail', id=job.id) }}" class="btn btn-primary btn-sm">查看详情</a>
    </li>
    {% endfor %}
</ul>
{% endblock %}

职位详情模板 (`templates/job_detail.html`)

{% extends 'base.html' %}

{% block content %}
<h1>{{ job.title }}</h1>
<p>公司: {{ job.company }}</p>
<p>地点: {{ job.location }}</p>
<p>描述: {{ job.description }}</p>
<a href="{{ url_for('apply_job', id=job.id) }}" class="btn btn-primary">申请职位</a>
<a href="{{ url_for('jobs') }}" class="btn btn-secondary">返回职位列表</a>
{% endblock %}

申请职位模板 (`templates/apply_job.html`)

{% extends 'base.html' %}

{% block content %}
<h1>申请职位: {{ job.title }}</h1>
<form method="POST">
    <div class="mb-3">
        <label for="applicant_name" class="form-label">姓名</label>
        <input type="text" class="form-control" id="applicant_name" name="applicant_name" required>
    </div>
    <div class="mb-3">
        <label for="applicant_email" class="form-label">邮箱</label>
        <input type="email" class="form-control" id="applicant_email" name="applicant_email" required>
    </div>
    <button type="submit" class="btn btn-primary">提交申请</button>
</form>
<a href="{{ url_for('job_detail', id=job.id) }}" class="btn btn-secondary mt-3">返回职位详情</a>
{% endblock %}

申请记录模板 (`templates/applications.html`)

{% extends 'base.html' %}

{% block content %}
<h1>申请记录</h1>
<ul class="list-group">
    {% for application in applications %}
    <li class="list-group-item">
        <h5>{{ application.applicant_name }}</h5>
        <p>邮箱: {{ application.applicant_email }}</p>
        <p>职位: {{ application.job.title }}</p>
    </li>
    {% endfor %}
</ul>
<a href="{{ url_for('jobs') }}" class="btn btn-primary mt-3">返回职位列表</a>
{% endblock %}

5. 静态文件

CSS (`static/css/styles.css`)

body {
    padding: 20px;
}

h1 {
    color: #333;
}

JavaScript (`static/js/scripts.js`)

$(document).ready(function() {
    console.log("Job Portal is ready!");
});

6. 运行应用

在项目根目录下运行：

python app.py

访问 http://127.0.0.1:5000/ 即可看到在线招聘系统。

7. 功能说明

发布职位：企业可以发布职位。
职位列表：用户可以查看所有职位。
职位详情：用户可以查看职位详情并申请职位。
申请记录：用户可以查看所有申请记录。

8. 扩展功能

添加用户认证系统，区分企业和求职者。
增加职位分类和搜索功能。
使用 AJAX 实现无刷新申请提交和职位列表更新。

希望这个示例对你有帮助！如果有任何问题，欢迎随时提问！

Flask应用开发综合示例——在线招聘系统

1. 项目结构

2. 安装依赖

3. Flask 应用 (app.py)

4. HTML 模板

基础模板 (templates/base.html)

主页模板 (templates/index.html)

发布职位模板 (templates/post_job.html)

职位列表模板 (templates/jobs.html)

职位详情模板 (templates/job_detail.html)

申请职位模板 (templates/apply_job.html)

申请记录模板 (templates/applications.html)