/**
 * 面板列表组
 */
<div class="panel panel-default">
  <!-- Default panel contents -->
  <div class="panel-heading"><{$arr.sn}>.<{$arr.id|getSPFunc=###}>
     <a data-toggle="modal" href="#tianjrule" class=" btn btn-info btn-xs pull-right" >添加</a>
  </div>  
  <!-- List group -->
  <ul class="list-group">
   <form action="__URL__/order" method="post" >
         <volist name='rules' id='rule' empty="没有规则">
            <li class="list-group-item">
                <input type="text" name="sn[<{$rule.id}>]" value="<{$rule.sn}>"  class="input40"/>
                <a  href="__URL__/mod/id/<{$rule.id}>/funcid/<{$arr.id}>"><{$rule.id}>:【<{$rule.state}>】<{$rule.rules}>(<{$rule.fproid|getProNo=###}>)</a>
                <span class="badge"><{$rule.source}></span>
            </li>
        </volist>
        <input type="submit" name="do_submit" value="批量排序" class="btn">
    </form>
  </ul>
</div>
/**
 * 按钮组
 */
<!-- Split button -->
<div class="btn-group">
  <a  data-toggle="modal" href="#tianjcase" type="button" class="btn btn-info btn-xs"><span class="glyphicon glyphicon-plus"></span>添加</a>
  <button type="button" class="btn btn-info btn-xs dropdown-toggle" data-toggle="dropdown">
    <span class="caret"></span>
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <ul class="dropdown-menu" role="menu">
    <li><a target="_blank" href="__APP__/TAdmin/Element/index/funcid/<{$arr.id}>" >模板</a></li>
    <li class="divider "></li>
    
  </ul>
</div>
/**
 * 输入框组
 */
<div class="input-group">
      <input type="text" class="form-control">
      <span class="input-group-btn">
        <button class="btn btn-default" type="button">Go!</button>
      </span>
</div>
/**
 * 导航条
 */
<nav class="navbar navbar-default" role="navigation">
  <div class="container-fluid ">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#"><{$w.testgp}>测试项目</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      
      <form action="__URL__/search " method="post" class="navbar-form navbar-left" role="search">
        <div class="form-group input-group ">
          <input  type="text" class="form-control" name="search" value="<{$w.search}>" placeholder="项目、负责人、状态">
          <input  type="hidden"  name="testgp" value="<{$w.testgp}>" >
          <span class="input-group-btn">
           <button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-search"></span></button>
          </span>
        </div>        
      </form>
      
      <ul class="nav navbar-nav navbar-right">      
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown"><{$w.testgp}>组 <span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
            <volist name='data' id='da' empty="没有数据">
              <li><a href="__APP__/TAdmin/Program/index/testgp/<{$da.v}>"><{$da.v}>组</a></li>
            </volist>
          </ul>
        </li>
        <li><a data-toggle="modal" href="#tianjprogram" class=" btn btn-info" >添加</a></li>       
        
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>     

/**
 * 巨幕
 如果需要让巨幕组件的宽度与浏览器宽度一致并且没有圆角，请把此组件放在所有 .container 元素的外面，并在组件内部添加一个 .container 元素。
 */

<div class="jumbotron">
  <h1>Hello, world!</h1>
  <p>...</p>
  <p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p>
</div>


/**
 * 页头
 主标题带副标题
 */

<div class="page-header">
  <h1>Example page header <small>Subtext for header</small></h1>
</div>

/**
 * 缩略图
通过缩略图组件扩展 Bootstrap 的 栅格系统，可以很容易地展示栅格样式的图像、视频、文本等内容。
 */

<div class="row">
  <div class="col-xs-6 col-md-3">
    <a href="#" class="thumbnail">
      <img data-src="holder.js/100%x180" alt="...">
    </a>
  </div>
  ...
</div>
/**
 * 缩略图
添加一点点额外的标签，就可以把任何类型的 HTML 内容，例如标题、段落或按钮，加入缩略图组件内。
 */

<div class="row">
  <div class="col-sm-6 col-md-4">
    <div class="thumbnail">
      <img data-src="holder.js/300x300" alt="...">
      <div class="caption">
        <h3>Thumbnail label</h3>
        <p>...</p>
        <p><a href="#" class="btn btn-primary" role="button">Button</a> <a href="#" class="btn btn-default" role="button">Button</a></p>
      </div>
    </div>
  </div>
</div>

/**
 * 警告框
 将任意文本和一个可选的关闭按钮组合在一起就能组成一个警告框，.alert 类是必须要设置的，另外我们还提供了有特殊意义的4个类（例如，.alert-success），代表不同的警告信息。
 警告框没有默认类，只有基类和修饰类。默认的灰色警告框并没有多少意义。所以您要使用一种有意义的警告类。目前提供了成功、消息、警告或危险。

 */
<div class="alert alert-success" role="alert">...</div>
<div class="alert alert-info" role="alert">...</div>
<div class="alert alert-warning" role="alert">...</div>
<div class="alert alert-danger" role="alert">...</div>

/**
 * 可关闭的警告框
为警告框添加一个可选的 .alert-dismissible 类和一个关闭按钮。
务必给 <button> 元素添加 data-dismiss="alert" 属性。
 */

<div class="alert alert-warning alert-dismissible" role="alert">
  <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
  <strong>Warning!</strong> Better check yourself, you're not looking too good.
</div>

/**
 * 手风琴
 */
<!--手风琴-->
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
           <volist name='data' id='st' empty="没有数据">
              <div class="panel panel-default">
        <div class="panel-heading" role="tab" id="heading<{$st.id}>">
          <h4 class="panel-title">
              <a data-toggle="collapse" data-parent="#accordion" href="#<{$st.id}>" aria-expanded="true" aria-controls="<{$st.id}>">
                  <{$st.sn}>.<{$st.stage}>:<{$st.state}> 
                  <span class="pull-right"><{$st.document}></span>
               </a>
            </h4>
        </div>
        <div id="<{$st.id}>" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading<{$st.id}>">
          <div class="panel-body">
             <{$st.moder}>&nbsp;更新于:<{$st.updatetime}><br>
             <div class="well well-sm"><{$st.end}>完成
              <ul class="list-group"><{$st.id|getQueue=###}></ul>
             </div>
           </div>
        </div>
         </div>
           </volist>
      </div>