bootstrap tab页

最新推荐文章于 2023-07-24 22:12:02 发布

_HQ

最新推荐文章于 2023-07-24 22:12:02 发布

阅读量923

点赞数

文章标签： bootstrap tab

本文链接：https://blog.csdn.net/u013499771/article/details/40143929

版权

<script>
    YUI({ filter:'raw' }).use('aui-tabview', function(Y) {

        console.time('How long does it take?');

        new Y.TabView({
            srcNode: '#exhort'
        }).render();

        console.timeEnd('How long does it take?');

    });
</script>

<div id="exhort">
				            <ul class="nav nav-tabs">
				                <li class="active"><a href="#body">体格检查</a></li>
				                <li ><a href="#check">检验检查</a></li>	
				                <li><a href="#wstMedicine">西医医嘱</a></li>
				                <li><a href="#chinaMedicine">中医医嘱</a></li> 
				            </ul>
				            
				            <div class="tab-content" style="margin-top: 5px">
				           	 <div id="body" class="tab-pane">
				           	 	<p>体格检查</p>
				                <div id="check" class="tab-pane">
				                    <table class="table table-hover table-condensed table-bordered ">
					                    <thead>
											<tr>
												<th width="auto">类型</th>
												<th width="auto">名称</th>
												<th width="auto">检体或检验部位</th>
												<th width="auto">单价</th>
												<th width="auto">数量</th>
												<th width="auto">单价</th>
												<th width="auto">总价</th>
												<th width="auto">日期</th>
												<th width="auto">医生</th>
											</tr>
										</thead>
										<tbody>
										<tr>
											<td>检查</td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
										</tr>
									</tbody>
									</table>
				                </div>
				                <div id="wstMedicine" class="tab-pane">
				                    <table class="table table-hover table-condensed table-bordered ">
					                    <thead>
											<tr>
												<th width="auto">医嘱类型 </th>
												<th width="auto">名称</th>
												<th width="auto">单次剂量</th>
												<th width="auto">频次 </th>
												<th width="auto">用法 </th>
												<th width="auto">疗程</th>
												<th width="auto">数量</th>
												<th width="auto">单位 </th>
												<th width="auto">单价</th>
												<th width="auto">皮试  </th>
												<th width="auto">日期</th>
												<th width="auto">金额 </th>
												<th width="auto">医生 </th></tr>
										</thead>
										<tbody>
										<tr>
											<td>临时</td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
										</tr>
									</tbody>
									</table>
				                </div>
				                	
				                <div id="chinaMedicine" class="row-fluid">
									<div class="row-fluid">
									<aui:layout>
										<aui:column>
											<aui:row>
											<aui:column>
												<label for="name">用药付数:</label> 
											</aui:column>
											<aui:column>
											<select style="width: 80px"
												class="combobox" name="language"><option value="1">1付</option>
												<option value="2">2付</option>
												<option value="3">7付</option></select>
											</aui:column>
											</aui:row>
										</aui:column>
										<aui:column>
											<aui:row>
												<aui:column>												
													<label for="name">用法:</label>
												</aui:column>
												<aui:column>
													<select style="width: 80px; height: 25px;" class="combobox" name="language"><option
															value="1">煎服</option>
														<option value="2">坐浴</option>
														<option value="3">代茶饮</option></select>
												</aui:column>
											</aui:row>
										</aui:column>
										<aui:column>										
											<aui:row>
												<aui:column>
												<label for="name">频次:</label>
												</aui:column>
												<aui:column>
													<select style="width: 140px; height: 25px;" class="combobox" name="language"><option
															value="1">每日1剂,遵医嘱</option>
														<option value="2">每日1剂,每日1次</option></select>
											</aui:column>
											</aui:row>
										</aui:column>
										<aui:column>
											<aui:row>
												<aui:column>
												<label for="name">一次剂量:</label>
												</aui:column>
												<aui:column>
													<input name="" style="width: 80px; height: 25px;"></input>
											</aui:column>
											</aui:row>
									</aui:column>									
									</aui:layout>
									</div>
									<table class="table table-hover table-condensed table-bordered ">
					                    <thead>
											<tr>
												<th width="auto">名称</th>
												<th width="auto">重量</th>
												<th width="auto">名称</th>
												<th width="auto">重量</th>
												<th width="auto">名称</th>
												<th width="auto">重量</th>
												<th width="auto">名称</th>
												<th width="auto">重量</th>
												<th width="auto">名称</th>
												<th width="auto">重量</th>
												<th width="auto">名称</th>
												<th width="auto">重量</th>
										</thead>
										<tbody>
										<tr>
											<td>蓖麻籽</td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
											<td></td>
										</tr>
									</tbody>
									</table>									
								</div>
				            </div>