测开之路七十：监控平台之html

监控平台的html

<!-- 继承base模板 -->
{% extends "base.html" %}

<!-- 引入bootstrap-datetimepicker下的css -->
{% block style %}
    <link rel="stylesheet" href="/monitor/static/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css">
{% endblock %}

{% block script %}
    <!-- 引入js文件，需要在base.html留入口，不然渲染会出问题。 -->
    <!-- 引入bootstrap-datetimepicker下的js -->
    <script src="/monitor/static/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
    <script src="https://cdn.bootcss.com/echarts/4.1.0-release/echarts.min.js"></script>  <!-- 引入echarts -->
    <script src="/monitor/static/monitor.js"></script>
{% endblock %}

<!-- 渲染内容 -->
{% block content %}
    <!-- bootstrap布局，声明容器 -->
    <div class="container">

        <!-- 声明一行（默认为12列）-->
        <div class="row">
            <div class="col-sm-12 col-md-4 col-lg-4">  <!-- 第一份占4列 -->
                <!-- 选择起始时间段的下拉框 -->
                <div class="input-group input-daterange"> <!-- 时间控件固定格式 -->
                    <!-- data-provide="datetimepicker"为固定格式 -->
                    <input ; font-size: 15px'>{% endblock %}