| | |
|---|
| | | <div> |
|---|
| | | <div class="fold-btn"></div> |
|---|
| | | <div class="content"> |
|---|
| | | <div class="flood-top"> |
|---|
| | | <input class="analysis-button" type="button" value="洪水淹没分析"/> |
|---|
| | | <input class="history-button" type="button" value="历史风险图"/> |
|---|
| | | <div id="tab"> |
|---|
| | | <div class="tabul"> |
|---|
| | | <ul> |
|---|
| | | <li id ="analysis-button" class="analysis-button">洪水淹没分析</li> |
|---|
| | | <li class="history-button">历史风险图</li> |
|---|
| | | </ul> |
|---|
| | | </div> |
|---|
| | | <div class="flood-middle"> |
|---|
| | | <div class="flood-analysis"> |
|---|
| | | <div class="select-box"> |
|---|
| | | <div> |
|---|
| | | <div class="hd"> |
|---|
| | | <label for="hd-select">河段：</label> |
|---|
| | | <!--做模糊查询选择框时使用--> |
|---|
| | | <input type="text" name="hd-input" id="hd-input" class="hd-input" placeholder="请选择或输入"/> |
|---|
| | | <select name="hd-select" id="hd-select" size="10"> |
|---|
| | | </select> |
|---|
| | | </div> |
|---|
| | | <div class="smx"> |
|---|
| | | <label for="smx-select">水面线：</label> |
|---|
| | | <select id="smx-select" class="smx-select" name="smx"></select> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div style="margin-top: 1%"> |
|---|
| | | <div class="sw" style="display: flex"> |
|---|
| | | <label for="sw-input">水位：</label> |
|---|
| | | <div style="display: flex;flex-direction: column;margin-left: 6px;"> |
|---|
| | | <input id="sw-input" class="sw-input" type="number" name="word" autocomplete="off" |
|---|
| | | maxlength="256" value="0" disabled /> |
|---|
| | | <span class="tip">正数为水位上涨，负数为水位下降</span> |
|---|
| | | <div id="tablist" style="height: 96%"> |
|---|
| | | <div class="flood-middle" style="height: 100%"> |
|---|
| | | <div class="flood-analysis" style="height: 100%"> |
|---|
| | | <div class="select-box"> |
|---|
| | | <div> |
|---|
| | | <div class="hd"> |
|---|
| | | <label for="hd-select">河段：</label> |
|---|
| | | <!--做模糊查询选择框时使用--> |
|---|
| | | <input type="text" name="hd-search" id="hd-input" class="hd-input" placeholder="请选择或输入" autocomplete='off'/> |
|---|
| | | <select name="hd-select-name" id="hd-select" size="10"> |
|---|
| | | </select> |
|---|
| | | </div> |
|---|
| | | <div class="smx"> |
|---|
| | | <label for="smx-select">水面线：</label> |
|---|
| | | <select id="smx-select" class="smx-select" name="smx"></select> |
|---|
| | | </div> |
|---|
| | | <div class="smx"> |
|---|
| | | <label for="glzd">关联站：</label> |
|---|
| | | <input id="glzd" style="width: 80px;height: 26px;" name="glzd" value="未知" disabled /> |
|---|
| | | <label for="qdj">起点距：</label> |
|---|
| | | <input id="qdj" style="width: 80px;height: 26px;" name="qdj" value="未知" disabled /> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <input id="start-analysis-btn" class="start-analysis-btn" type="button" value="开始分析"/> |
|---|
| | | <div style="margin-top: 1%"> |
|---|
| | | <div class="sw" style="display: flex"> |
|---|
| | | <label for="sw-input" id="swtext" style="width: 50px">水位：</label> |
|---|
| | | <div style="display: flex;flex-direction: column;"> |
|---|
| | | <input id="sw-input" class="sw-input" name="word" autocomplete="off" maxlength="10" value="0" disabled /> |
|---|
| | | <!-- <span class="tip">正数为水位上涨，负数为水位下降</span>--> |
|---|
| | | </div> |
|---|
| | | <input id="start-analysis-btn" class="start-analysis-btn" type="button" value="开始分析"/> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="radio-box" style="text-align: center"> |
|---|
| | | <input id="realtime" type="radio" name="middleRadio" value="realtime" checked='checked'>实时 |
|---|
| | | <input id="forecast" type="radio" name="middleRadio" value="forecast">预测 |
|---|
| | | </div> |
|---|
| | | <div class="analysis-box-list" id="analysis-tab1-grid" data-dojo-attach-point="analysis-tab1-grid"> |
|---|
| | | </div> |
|---|
| | | <div class="flood-analysis-pagination" id="analysis-pagination"></div> |
|---|
| | | </div> |
|---|
| | | <div class="radio-box"> |
|---|
| | | <input id="realtime" type="radio" name="middleRadio" value="realtime" checked='checked'>实时 |
|---|
| | | <input id="forecast" type="radio" name="middleRadio" value="forecast">预测 |
|---|
| | | </div> |
|---|
| | | <div class="table-box"> |
|---|
| | | <table> |
|---|
| | | <thead class="flood-table-thead table-thead"> |
|---|
| | | <tr> |
|---|
| | | <th> |
|---|
| | | <div>位置</div> |
|---|
| | | </th> |
|---|
| | | <th> |
|---|
| | | <div>起点距</div> |
|---|
| | | </th> |
|---|
| | | <th> |
|---|
| | | <div>经度</div> |
|---|
| | | </th> |
|---|
| | | <th> |
|---|
| | | <div>纬度</div> |
|---|
| | | </th> |
|---|
| | | <th> |
|---|
| | | <div>水面线</div> |
|---|
| | | </th> |
|---|
| | | <th> |
|---|
| | | <div>水位</div> |
|---|
| | | </th> |
|---|
| | | </tr> |
|---|
| | | </thead> |
|---|
| | | <tbody id="flood-tbody" class="table-tbody flood-tbody"></tbody> |
|---|
| | | </table> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="flood-history"> |
|---|
| | | <div class="search-box"> |
|---|
| | | <label for="search-name">名称：</label> |
|---|
| | | <input id="search-name" class="search-name-input" type="text" name="word" autocomplete="off" |
|---|
| | | maxlength="256" placeholder="请输入筛选名称"/> |
|---|
| | | <input id="search-button" class="search-button" type="button" value="查 询"/> |
|---|
| | | </div> |
|---|
| | | <div class="table-box"> |
|---|
| | | <table> |
|---|
| | | <thead class="flood-table-thead table-thead"> |
|---|
| | | <tr> |
|---|
| | | <th style="width: 30px;"> |
|---|
| | | |
|---|
| | | </th> |
|---|
| | | <th> |
|---|
| | | <div>名称</div> |
|---|
| | | </th> |
|---|
| | | </tr> |
|---|
| | | </thead> |
|---|
| | | <tbody id="flood-history-tbody" class="table-tbody flood-tbody"> |
|---|
| | | <tr> |
|---|
| | | <td> |
|---|
| | | <div><input type="radio" name="tableRadio" value="1"></div> |
|---|
| | | </td> |
|---|
| | | <td> |
|---|
| | | <div>5年洪水淹没图</div> |
|---|
| | | </td> |
|---|
| | | </tr> |
|---|
| | | <tr> |
|---|
| | | <td> |
|---|
| | | <div><input type="radio" name="tableRadio" value="2"></div> |
|---|
| | | </td> |
|---|
| | | <td> |
|---|
| | | <div>10年洪水淹没图</div> |
|---|
| | | </td> |
|---|
| | | </tr> |
|---|
| | | <tr> |
|---|
| | | <td> |
|---|
| | | <div><input type="radio" name="tableRadio" value="3"></div> |
|---|
| | | </td> |
|---|
| | | <td> |
|---|
| | | <div>15年洪水淹没图</div> |
|---|
| | | </td> |
|---|
| | | </tr> |
|---|
| | | </tbody> |
|---|
| | | </table> |
|---|
| | | <div class="flood-history" style="height: 100%"> |
|---|
| | | <div class="search-box"> |
|---|
| | | <label for="search-name">名称：</label> |
|---|
| | | <input id="search-name" class="search-name-input" type="text" name="word" autocomplete="off" |
|---|
| | | maxlength="256" placeholder="请输入筛选名称"/> |
|---|
| | | <input id="search-button" class="search-button" type="button" value="查 询"/> |
|---|
| | | </div> |
|---|
| | | <div class="history-box-list" id="history-tab2-grid" data-dojo-attach-point="history-tab2-grid"> |
|---|
| | | </div> |
|---|
| | | <div class="flood-analysis-pagination" id="history-pagination"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="flood-bottom"> |
|---|
| | | <div class="flood-analysis-pagination" id="analysis-pagination"></div> |
|---|
| | | <div class="flood-analysis-pagination" id="history-pagination"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class='dong-progress'> |
|---|
| | | <h2>分析结果中，请稍等...</h2> |
|---|
| | | <span class="container"> |
|---|
| | | <span id="progress_bar" class="h-100P bar"></span> |
|---|
| | | </span> |
|---|
| | | </div> |
|---|
| | | <div id="restore-icon" class="restore-icon"></div> |
|---|
| | | <!-- 弹窗 --> |
|---|
| | | <div id="myModal" class="modal"> |
|---|
| | | <!-- 关闭按钮 --> |
|---|
| | | <span class="close" onclick="document.getElementById('myModal').style.display='none'">×</span> |
|---|
| | | <div style="height: 100%;display: flex;align-items: center"> |
|---|
| | | <!-- 弹窗内容 --> |
|---|
| | | <img class="modal-content" id="img01" src=""> |
|---|
| | | </div> |
|---|
| | | <!-- 文本描述 --> |
|---|
| | | <div id="caption"></div> |
|---|
| | | </div> |
|---|
| | | <div id="tableTip" class="tableTip"> |
|---|
| | | 11111111 |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
