flask与jquery架构下的运维平台

公司目前的运维平台是使用flask+JQuery来实现的。都0202年了，准备进行一波架构更新，初步决定将前后端进行分离。

虽然对于运维平台来说功能能用就行，老的性能也不存在并发的问题；但技术总是在发展，无论对于个人还是公司来说都需要紧跟技术发展趋势。最终后台的框架会在python fastapi与go gin框架中选出，目前还在研究中。先对老的系统进行一下总结。

整个项目功能如xmind所示：

很多功能都是根据大家的需要进行的开发。

目录结构：

后台：

选择了flask框架，flask可以自己进行扩展。当然目前社区发展的并不是很好，如果能重来我用fastapi，^_^。

程序目录中每个目录都对应着一个blueprint，对应着网站中的一段url：比如app目录定义了blueprint并且注册到了init文件中:

先看下目录结构:

__init__.py中定义blueprint

# Created by mark
from flask import Blueprint

apps = Blueprint(apps, __name__)
from . import views

项目主入口__init__.py注册blueprint

# 应用管理页面
    from oms.apps import apps as apps_blueprint
    app.register_blueprint(apps_blueprint, url_prefix=/apps)

这样所有views.py里面对应的url都将是/apps开头的，比如：

@apps.route(/all_apps)
@login_required
def all_apps():
    """
    展示所有app信息
    :return:
    """
    session[menu_path] = [xxx, xxxx]
    all_apps = Apps.query.filter(xxxx).all()
    user_organize = current_user.organize_id
    return render_template(apps/all_apps.html, all_apps=all_apps, user_organize=user_organize)

对应的url就是/apps/all_apps

models.py主要是此模块数据库表信息，使用sqlalchemy数据库ORM技术

#示例
class Projects(db.Model):
    __tablename__ = oms_projects
    id = db.Column(db.Integer, primary_key=True)
    # 项目名称
    project_name = db.Column(db.String(200), unique=True)
    # git库地址
    git_core = db.Column(db.Text)
    # jenkins地址
    jenkins_jobs = db.Column(db.Text)
    # 包含的服务
    services = db.Column(db.Text)
    # 包含的域名
    domains = db.Column(db.Text)
    # 项目状态
    status = db.Column(db.Boolean, default=True)
    # 描述
    desc = db.Column(db.String(200))

前端展示使用bootstrap+jquery来做，使用了jinja2模板做一些数据操作，我这边没有使用flask中的form表单，直接使用了原生的前端来做的：

整体菜单栏：

利用jinjia2后台可以直接将查询出的数据传给前端来渲染，不一定要传入json格式，示例：

<table class="table table-striped table-bordered table-hover" id="projects_table">
                        <thead>
                        <tr>
                            <th>
                                <div></div>
                            </th>
                            <th width="20px;">No</th>
                            <th>项目名</th>
                            <th>描述</th>
                        </tr>
                        </thead>
                        {% for project in projects %}
                            <tr data="{
         
  { project.id }}">
                                <td>
                                    <div class="checker"><span><input type="checkbox" checked></span></div>
                                </td>
                                <td>{
         
  { loop.index }}</td>
                                <td>{
         
  { project.project_name }}</td>
                                <td>{
         
  { project.desc }}</td>
                            </tr>
                        {% endfor %}
                        <tbody>
                        </tbody>
                    </table>

以上就是每个模块的结构。