123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304 |
- <!DOCTYPE html>
- <html lang = "en">
- <head>
- <meta charset = "UTF-8">
- <title>CloudSql_首页</title>
- </head>
- <link rel = "stylesheet" type = "text/css" href = "css/Default.css">
- <link rel = "stylesheet" type = "text/css" href = "css/databaseList.css">
- <body>
- <div class = "container">
- <!-- 顶部导航栏 -->
- <div class = "header">
- <div class = "header_column">
- <i class = "mdui-icon material-icons" id="icon">menu</i>
- <a href = "">CloudSQL Admin Panel</a>
- </div>
- <div class = 'header_icon'>
- <a href = ""><i class = "mdui-icon material-icons">exit_to_app</i></a>
- </div>
- </div>
- <!-- body -->
- <div class = 'body'>
- <!-- 左侧导航栏 -->
- <div id="sidebar">
- <div class = 'row'>
- <i class = "mdui-list-item-icon mdui-icon material-icons">view_list</i>
- <p class = 'p_database'>数据库列表</p>
- </div>
- <div class = 'row'>
- <i class = "mdui-list-item-icon mdui-icon material-icons">person</i>
- <p class = 'p_user'>用户列表</p>
- </div>
- <div class = 'row'>
- <i class = "mdui-list-item-icon mdui-icon material-icons">info</i>
- <p class = 'p_about'>关于</p>
- </div>
- </div>
- <!-- 页面导航 -->
- <div class = "main">
- <div class='mdui-container'>
- <h2 class='mdui-text-color-theme'>用户数据库列表</h2>
- <div class='mdui-table-fluid'>
- <div class='mdui-toolbar'>
- <div class='mdui-row1'>
- <i class="mdui-icon material-icons">menu</i>
- <span class="mdui-typo-title">工具栏</span>
- </div>
- <div class='mdui-row2'>
- <i class="mdui-icon material-icons">search</i>
- <i class="mdui-icon material-icons">refresh</i>
- </div>
- </div>
- <table class='mdui-table'>
- <thead>
- <tr>
- <th class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></th>
- <th class='table_column1'>数据库名</th>
- <th class='table_column2'>用户ID</th>
- <th class='table_column3'>用户名称</th>
- <th class='table_column4'>创建时间</th>
- <th class="table_column5">操作</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button></td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button></td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- <tr>
- <td class=' mdui-table-cell-checkbox'><i class="material-icons icon">check_box_outline_blank</i></td>
- <td class='table_column1'>mcp1</td>
- <td class='table_column2'>f7cf0dc7-1447-415c-92c2-d2fe68c2bcf6</td>
- <td class='table_column3'>13670264009</td>
- <td class='table_column4'>2016-12-20 08:55:44</td>
- <td class="table_column5">
- <button class="mdui-btn" id='mdui-btn'>查看详情</button>
- <button class="mdui-btn mdui-color-theme-accent">删除</button>
- </td>
- </tr>
- </tbody>
- </table>
- <div class="mdui-float-right">
- <span class="mdui-float-left">共18页,当前为</span>
- <input class="mdui-float-left" name="pageNum" type="text">
- <span class="mdui-float-left">页</span>
- <button class="mdui-float-left mdui-btn">跳转</button>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
- <script src="js/Default.js" type="text/javascript"></script>
- </body>
- </html>
|