diff --git a/static/js/demo/organization/branchList.json b/static/js/demo/organization/branchList.json
new file mode 100644
index 0000000000000000000000000000000000000000..6701434c64d8f55784cc7d63e0969ef56d216ee1
--- /dev/null
+++ b/static/js/demo/organization/branchList.json
@@ -0,0 +1,22 @@
+[
+  {
+    "branch_name": "信息与计算机工程学院",
+    "subsidiary_organ": "萍乡学院",
+    "creation_time": "1989-5-6"
+  },
+  {
+    "branch_name": "秃头大本营",
+    "subsidiary_organ": "快程乐码",
+    "creation_time": "2020-03-10"
+  },
+  {
+    "branch_name": "今天你秃头了吗？",
+    "subsidiary_organ": "快程乐码",
+    "creation_time": "2020-03-10"
+  },
+  {
+    "branch_name": "软件技术",
+    "subsidiary_organ": "信息与计算机工程学院",
+    "creation_time": "2019-06-07"
+  }
+]
\ No newline at end of file
diff --git a/static/js/demo/organization/orgList.json b/static/js/demo/organization/orgList.json
new file mode 100644
index 0000000000000000000000000000000000000000..0776a1fe5b212d6ae88ee52cd7741e786b1b674f
--- /dev/null
+++ b/static/js/demo/organization/orgList.json
@@ -0,0 +1,22 @@
+[
+  {
+    "institutional_name": "萍乡学院",
+    "institutional_type": "学校",
+    "creation_time": "2019-06-07"
+  },
+  {
+    "institutional_name": "快程乐码",
+    "institutional_type": "培训机构",
+    "creation_time": "2018-12-26"
+  },
+  {
+    "institutional_name": "建雄集团有限公司",
+    "institutional_type": "上市公司",
+    "creation_time": "2021-04-01"
+  },
+  {
+    "institutional_name": "五道口职业技术学院",
+    "institutional_type": "学校",
+    "creation_time": "1911"
+  }
+]
\ No newline at end of file
diff --git a/templates/empty_page.html b/templates/empty_page.html
index 34aedba480f0210f1546b45af520d10b56bc58ba..509b885aa861ca86eb596fd842261ad440102815 100644
--- a/templates/empty_page.html
+++ b/templates/empty_page.html
@@ -26,22 +26,7 @@
 
 <body class="gray-bg">
     <div class="row wrapper border-bottom white-bg page-heading">
-        <div class="col-sm-4">
-            <h2>标题</h2>
-            <ol class="breadcrumb">
-                <li>
-                    <a href="index.html">主页</a>
-                </li>
-                <li>
-                    <strong>包屑导航</strong>
-                </li>
-            </ol>
-        </div>
-        <div class="col-sm-8">
-            <div class="title-action">
-                <a href="empty_page.html" class="btn btn-primary">活动区域</a>
-            </div>
-        </div>
+
     </div>
 
     <div class="wrapper wrapper-content">
diff --git a/templates/organization/branchList.html b/templates/organization/branchList.html
new file mode 100644
index 0000000000000000000000000000000000000000..9839317a273929dbdd3c2472f74d670f03702469
--- /dev/null
+++ b/templates/organization/branchList.html
@@ -0,0 +1,224 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:th="http://www.thymeleaf.org">
+
+<head>
+
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="renderer" content="webkit">
+
+    <title>H+ 智慧教育平台 - 分支机构</title>
+
+    <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
+    <meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">
+
+    <!--[if lt IE 9]>
+    <meta http-equiv="refresh" content="0;ie.html"/>
+    <![endif]-->
+
+    <link rel="shortcut icon" href="../../static/favicon.ico" th:href="@{/static/favicon.ico}">
+    <link href="../../static/css/bootstrap.min.css?v=3.3.6" th:href="@{/static/css/bootstrap.min.css(v='3.3.6')｝"
+          rel="stylesheet">
+    <link href="../../static/css/font-awesome.min.css?v=4.4.0" th:href="@{/static/css/font-awesome.min.css(v='4.4.0')}"
+          rel="stylesheet">
+    <link href="../../static/css/animate.css" th:href="@{/static/css/animate.css}" rel="stylesheet">
+    <link href="../../static/css/style.css?v=4.1.0" th:href="@{/static/css/style.css(v='4.1.0')}" rel="stylesheet">
+    <link href="../../static/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
+
+
+</head>
+<body class="gray-bg">
+<div class="row wrapper border-bottom white-bg page-heading">
+    <div class="panel-body" style="padding-bottom:1px;">
+        <div class="panel panel-default">
+            <div class="panel-body">
+                <form class="form-inline">
+                    <div class="form-group">
+                        <label>分支名称:</label>
+                        <input type="text" class="form-control " style="border-color: black" size="3">
+                    </div>
+                    <div class="form-group">
+                        <span>所属机构:</span>
+                        <select class="form-control" style="border-color: black">
+                            <option value="0">萍乡学院</option>
+                            <option value="1">乐程快码</option>
+                        </select>
+                    </div>
+
+                    <button class="btn-success btn">查询</button>
+                    <div style="float: right">
+                        <!-- Button trigger modal -->
+                        <button type="button" class="btn btn-success " data-toggle="modal" data-target="#myModal">
+                            添加
+                        </button>
+
+                        <!-- Modal -->
+                        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+                            <div class="modal-dialog" role="document">
+                                <div class="modal-content">
+                                    <div class="modal-header">
+                                        <h4 class="modal-title" id="myModalLabel">新增</h4>
+                                    </div>
+
+                                    <div class="modal-body">
+                                        <!-- 表单定义 -->
+                                        <div class="form-group form-inline">
+                                            <label class=" control-label">分支名称
+                                                <input type="text" class="form-control">
+                                            </label>
+                                        </div>
+                                        <div class="form-group form-inline">
+                                            <label class=" control-label">所属机构
+                                                <select class="form-control">
+                                                    <option value="学校">学校</option>
+                                                    <option value="培训机构">培训机构</option>
+                                                </select>
+                                            </label>
+                                        </div>
+                                        <!--footer-->
+                                        <div class="modal-footer">
+                                            <button type="button" class="btn btn-default" data-dismiss="modal">
+                                                关闭
+                                            </button>
+                                            <button type="submit" class="btn btn-success"
+                                                    id="update_teacher_btn">保存
+                                            </button>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <button type="submit" id="delete" class="btn btn-success">删除</button>
+                    </div>
+                </form>
+                <div class="form-inline" style="margin-top: 15px">
+                    <label>显示<select class="form-control">
+                        <option value="10">10</option>
+                        <option value="20">20</option>
+                        <option value="50">50</option>
+                        <option value="100">100</option>
+                    </select>项结果</label>
+                </div>
+
+                <table class="table table-striped" id="myTab">
+                    <div class="modal fade" id="updateModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+                        <div class="modal-dialog" role="document">
+                            <div class="modal-content">
+                                <div class="modal-header">
+                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
+                                            aria-hidden="true">&times;</span>
+                                    </button>
+                                    <h4 class="modal-title" id="update">修改</h4>
+                                </div>
+                                <div class="modal-body">
+                                    <!-- 表单定义 -->
+                                    <div class="form-group form-inline">
+                                        <label class=" control-label">分支名称
+                                            <input type="text" class="form-control">
+                                        </label>
+                                    </div>
+                                    <div class="form-group form-inline">
+                                        <label class=" control-label">所属机构
+                                            <select class="form-control">
+                                                <option value="学校">学校</option>
+                                                <option value="培训机构">培训机构</option>
+                                            </select>
+                                        </label>
+                                    </div>
+                                </div>
+                                <div class="modal-footer">
+                                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+                                    <button type="button" class="btn btn-primary">保存</button>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </table>
+            </div>
+        </div>
+    </div>
+</div>
+<!--表单-->
+</table>
+
+<!-- 全局js -->
+<script src="../../static/js/jquery.min.js?v=2.1.4" th:src="@{/static/js/jquery.min.js(v='2.1.4')}"></script>
+<script src="../../static/js/bootstrap.min.js?v=3.3.6" th:src="@{/static/js/bootstrap.min.js(v='3.3.6')}"></script>
+
+<!-- 自定义js -->
+<script src="../../static/js/content.js?v=1.0.0" th:src="@{/static/js/content.js(v='1.0.0')}"></script>
+<!--bootstrap-table-->
+<script src="../../static/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
+<script src="../../static/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
+<script src="../../static/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
+<script>
+    $(function () {
+        $("#myTab").bootstrapTable({
+            url: "../../static/js/demo/organization/branchList.json",
+            toolbar: '#toolbar', // 工具按钮用哪个容器
+            pagination: true,
+            cache: false,
+            sortable: true, //是否启用排序
+            sortOrder: "asc", // 排序方式
+            sidePagination: "client", // 分页方式：client客户端分页，server服务端分页（*）
+            pageNumber: 1,
+            pageSize: 3,
+            pageList: [10, 25, 50, 100],
+            /*  search:true,*/
+            strictSearch: false,                 //查询时是否严格匹配, true表示严格匹配，false表示模糊匹配
+            /* showRefresh:true,*/
+            uniqueId: "ID",
+            columns: [{
+                field: 'checked',
+                checkbox: true, /* 是否添加复选框*/
+                //跟据返回每行的数据
+                formatter: function (value, row, index) {
+                    return row.id;
+                }
+            },
+                {
+                    field: 'branch_name',
+                    title: '分支名称'
+                }, {
+                    field: 'subsidiary_organ',
+                    title: '所属机构'
+                }, {
+                    field: 'creation_time',
+                    title: '创建时间',
+                }, {
+
+                    field: 'operator',
+                    title: '操作',
+                    align: 'center',
+                    valign: 'middle',
+                    width: '10%',
+                    // visible: false,
+                    formatter: function (value, row, index) {
+                        // var sid_code = base64encode(row.sid + '');   //  sid 加密处理
+                        // alert(sid_code);
+                        return '<a  data-toggle="modal" data-target="#updateModal" title="修改">' +
+                            '<i class="glyphicon glyphicon-edit"></i> ' +
+                            '</a>' +
+                            '<a href="javascript:void(0)" title="删除">' +
+                            '<i class="glyphicon glyphicon-trash text-danger"></i> ' +
+                            '</a>';
+                    },
+                    events: {
+                        'click a[title=删除]': function (e, value, row, index) {
+                            if (confirm('确定删除吗？')) {
+                                $.ajax();
+                            }
+                        },
+                        'click a[title=修改]': function (e, value, row, index) {
+                            // e.preventDefault();
+                        },
+                    }
+                }]
+        });
+    });
+
+</script>
+
+</body>
+
+</html>
diff --git a/templates/organization/orgList.html b/templates/organization/orgList.html
new file mode 100644
index 0000000000000000000000000000000000000000..587e7183f34b26bbc9580e37dbf55f6b3b5bab9c
--- /dev/null
+++ b/templates/organization/orgList.html
@@ -0,0 +1,219 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:th="http://www.thymeleaf.org">
+
+<head>
+
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="renderer" content="webkit">
+
+    <title>H+ 智慧教育平台 - 机构列表</title>
+
+    <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
+    <meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">
+
+    <!--[if lt IE 9]>
+    <meta http-equiv="refresh" content="0;ie.html"/>
+    <![endif]-->
+
+    <link rel="shortcut icon" href="../../static/favicon.ico" th:href="@{/static/favicon.ico}">
+    <link href="../../static/css/bootstrap.min.css?v=3.3.6" th:href="@{/static/css/bootstrap.min.css(v='3.3.6')｝"
+          rel="stylesheet">
+    <link href="../../static/css/font-awesome.min.css?v=4.4.0" th:href="@{/static/css/font-awesome.min.css(v='4.4.0')}"
+          rel="stylesheet">
+    <link href="../../static/css/animate.css" th:href="@{/static/css/animate.css}" rel="stylesheet">
+    <link href="../../static/css/style.css?v=4.1.0" th:href="@{/static/css/style.css(v='4.1.0')}" rel="stylesheet">
+    <link href="../../static/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
+
+
+</head>
+<body class="gray-bg">
+<div class="row wrapper border-bottom white-bg page-heading">
+    <div class="panel-body" style="padding-bottom:1px;">
+        <div class="panel panel-default">
+            <div class="panel-body">
+                <form class="form-inline">
+                    <div class="form-group">
+                        <label>机构名称:</label>
+                        <input type="text" class="form-control " style="border-color: black" size="3">
+                    </div>
+                    <div class="form-group">
+                        <span>机构类型:</span>
+                        <select class="form-control" style="border-color: black">
+                            <option value="0">学校</option>
+                            <option value="1">培训机构</option>
+                        </select>
+                    </div>
+                    <button class="btn-success btn">查询</button>
+                    <div style="float: right">
+                        <!-- Button trigger modal -->
+                        <button type="button" class="btn btn-success " data-toggle="modal" data-target="#myModal">
+                            添加
+                        </button>
+                        <!-- Modal -->
+                        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+                            <div class="modal-dialog" role="document">
+                                <div class="modal-content">
+                                    <div class="modal-header">
+                                        <h4 class="modal-title" id="myModalLabel">新增</h4>
+                                    </div>
+
+                                    <div class="modal-body">
+                                        <!-- 表单定义 -->
+                                        <div class="form-group form-inline">
+                                            <label class=" control-label">机构名称
+                                                <input type="text" class="form-control">
+                                            </label>
+                                        </div>
+                                        <div class="form-group form-inline">
+                                            <label class=" control-label">机构类型
+                                                <select class="form-control">
+                                                    <option value="学校">学校</option>
+                                                    <option value="培训机构">培训机构</option>
+                                                </select>
+                                            </label>
+                                        </div>
+                                        <!--footer-->
+                                        <div class="modal-footer">
+                                            <button type="button" class="btn btn-default" data-dismiss="modal">
+                                                关闭
+                                            </button>
+                                            <button type="submit" class="btn btn-success"
+                                                    id="update_teacher_btn">保存
+                                            </button>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <button type="submit" id="delete" class="btn btn-success">删除</button>
+                    </div>
+                </form>
+                <div class="form-inline" style="margin-top: 15px">
+                    <label>显示<select class="form-control">
+                        <option value="10">10</option>
+                        <option value="20">20</option>
+                        <option value="50">50</option>
+                        <option value="100">100</option>
+                    </select>项结果</label>
+                </div>
+
+
+                <table class="table table-striped" id="myTab">
+                    <div class="modal fade" id="updateModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+                        <div class="modal-dialog" role="document">
+                            <div class="modal-content">
+                                <div class="modal-header">
+                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
+                                            aria-hidden="true">&times;</span>
+                                    </button>
+                                    <h4 class="modal-title" id="update">修改</h4>
+                                </div>
+                                <div class="modal-body">
+                                    <!-- 表单定义 -->
+                                    <div class="form-group form-inline">
+                                        <label class=" control-label">机构名称
+                                            <input type="text" class="form-control">
+                                        </label>
+                                    </div>
+                                    <div class="form-group form-inline">
+                                        <label class=" control-label">机构类型
+                                            <select class="form-control">
+                                                <option value="学校">学校</option>
+                                                <option value="培训机构">培训机构</option>
+                                            </select>
+                                        </label>
+                                    </div>
+                                </div>
+                                <div class="modal-footer">
+                                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+                                    <button type="button" class="btn btn-primary">保存</button>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </table>
+            </div>
+        </div>
+    </div>
+</div>
+<!--表单-->
+</table>
+<!-- 全局js -->
+<script src="../../static/js/jquery.min.js?v=2.1.4" th:src="@{/static/js/jquery.min.js(v='2.1.4')}"></script>
+<script src="../../static/js/bootstrap.min.js?v=3.3.6" th:src="@{/static/js/bootstrap.min.js(v='3.3.6')}"></script>
+<!-- 自定义js -->
+<script src="../../static/js/content.js?v=1.0.0" th:src="@{/static/js/content.js(v='1.0.0')}"></script>
+<!--bootstrap-table-->
+<script src="../../static/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
+<script src="../../static/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
+<script src="../../static/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
+<script>
+    $(function () {
+        $("#myTab").bootstrapTable({
+            url: "../../static/js/demo/organization/orgList.json",
+            toolbar: '#toolbar', // 工具按钮用哪个容器
+            pagination: true,
+            cache: false,
+            sortable: true, //是否启用排序
+            sortOrder: "asc", // 排序方式
+            sidePagination: "client", // 分页方式：client客户端分页，server服务端分页（*）
+            pageNumber: 1,
+            pageSize: 3,
+            pageList: [10, 25, 50, 100],
+            /*  search:true,*/
+            strictSearch: false,                 //查询时是否严格匹配, true表示严格匹配，false表示模糊匹配
+            /* showRefresh:true,*/
+            uniqueId: "ID",
+            columns: [{
+                field: 'checked',
+                checkbox: true, /* 是否添加复选框*/
+                //跟据返回每行的数据
+                formatter: function (value, row, index) {
+                    return row.id;
+                }
+            },
+                {
+                    field: 'institutional_name',
+                    title: '机构名称'
+                }, {
+                    field: 'institutional_type',
+                    title: '机构类型'
+                }, {
+                    field: 'creation_time',
+                    title: '创建时间',
+                }, {
+                    field: 'operator',
+                    title: '操作',
+                    align: 'center',
+                    valign: 'middle',
+                    width: '10%',
+                    // visible: false,
+                    formatter: function (value, row, index) {
+                        // var sid_code = base64encode(row.sid + '');   //  sid 加密处理
+                        // alert(sid_code);
+                        return '<a  data-toggle="modal" data-target="#updateModal" title="修改">' +
+                            '<i class="glyphicon glyphicon-edit"></i> ' +
+                            '</a>' +
+                            '<a href="javascript:void(0)" title="删除">' +
+                            '<i class="glyphicon glyphicon-trash text-danger"></i> ' +
+                            '</a>';
+                    },
+                    events: {
+                        'click a[title=删除]': function (e, value, row, index) {
+                            if (confirm('确定删除吗？')) {
+                                $.ajax();
+                            }
+                        },
+                        'click a[title=修改]': function (e, value, row, index) {
+                            // e.preventDefault();
+                        },
+                    }
+                }]
+        });
+    });
+</script>
+
+</body>
+
+</html>
