list.html

<!-- Content Header (Page header) -->
<section class="content-header">
 <h1></h1>
</section>
<!-- Main content -->
<section class="content">
 <!-- /.row -->
 <div class="row">
  <div class="col-xs-12">
   <div class="box">
    <div class="box-header">
     <h3 class="box-title"></h3>

     <div class="box-tools">
      <div class="input-group input-group-sm" style="width: 150px;">
       <div class="input-group-btn">
        <button class="btn btn-block btn-primary" onclick="load_page('/pages/service/add.html')">添加服务模块</button>
       </div>
      </div>
     </div>
    </div>
    <div id="service-container" class="box-body table-responsive no-padding">
    </div>
    <!-- /.box-body -->
   </div>
   <!-- /.box -->
  </div>
 </div>
</section>
<script id="service-tpl" type="text/html">
<table class="table table-hover">
  <% if(list.length==0){%>
      <tr>
       <th>还没有服务模块，请添加</th>
      </tr>
  <%}%>
  <%for(var i = 0; i < list.length; i++) {%>
  <% if(i==0){%>
  <tr>
   <th>服务模块</th>
   <th>后端主机域名</th>
   <th>备注描述</th>
   <th>后端服务器状态</th>
   <th>管理</th>
  </tr>
  <%}%>
  <tr>
   <td><%:=list[i].name%></td>
   <td><%:=list[i].host%></td>
   <td><%:=list[i].description%></td>
   <td><%:=list[i].status%></td>
   <td>
    <a href="javascript:;" onclick="service_id=<%:=list[i].id%>;service_name='<%:=list[i].name.replace(/\'/g,"\\\'")%>';load_page('/pages/server/list.html')">后端服务器</a>&nbsp;&nbsp;
    <a href="javascript:;" onclick="service_id=<%:=list[i].id%>;service_name='<%:=list[i].name.replace(/\'/g,"\\\'")%>';load_page('/pages/api/list.html')">URI映射</a>&nbsp;&nbsp;
    <a href="javascript:;" onclick="service_id=<%:=list[i].id%>;load_page('/pages/service/edit.html')" >编辑与限流</a>&nbsp;&nbsp;
    <a href="javascript:;" data-id="<%:=list[i].id%>" class="service-delete">删除</a></td>
  </tr>
  <%}%>
 </table>
</script>
<script type="text/javascript">
    $(".content-header h1").html(domain_name);
    $(".box-title").html(domain_name);
    $(function(){
        api_invoke("/api/v1/service/list", {domain_id:domain_id}, function(data){
            if(data.errno == 0){
                var html = template($("#service-tpl").html(), {list: data.info});
                $("#service-container").html(html);
                $(".service-delete").click(function(){
                    var id=$(this).attr("data-id");
                    if(confirm("Please make sure to delete this service?")){
                        delete_service(id);
                    }
                });
            }else{
                alert(data.msg);
            }
        });
    });
    function delete_service(id){
        api_invoke("/api/v1/service/delete", {service_id:id}, function(data){
            if(data.errno == 0){
                load_page("/pages/service/list.html");
            }else{
                alert(data.msg);
            }
        });
    }
</script>