{extend name="layout/user"}
{block name="css"}
<link href="__CSS__/plugins/datatables/css/jquery.datatables.min.css" rel="stylesheet" type="text/css"/>	
<link href="__CSS__/plugins/datatables/css/jquery.datatables_themeroller.css" rel="stylesheet" type="text/css"/>	
{/block}
{block name="text"}
 <div class="page-inner">
     <div class="page-title">
                <h3 class="breadcrumb-header">域名列表</h3>
        </div>
	<div id="main-wrapper">
        <div class="row">
            <div class="col-md-12">
                   <div class="panel panel-white">
                                <div class="panel-heading">
                                    <h4 class="panel-title"><button class="btn btn-primary" data-toggle="modal" data-target="#myModal" type="button"><i class="fa fa-plus"></i>  添加域名</button></h4>
                                </div>
                                <div class="panel-body">
                                    <div class="table-responsive">
                                        <table id="apis" class="display table" style="width: 100%; cellspacing: 0;">
                                            <thead>
                                                <tr>
                                                    <td>记录ID</td>
													<td>网站名称</td>
													<td>域名链接</td>
													<td>访问ID</td>
													<td>添加时间</td>
													<td>到期时间</td>
													<td>剩余时间</td>
													<td>状态</td>
													<td>操作</td>
                                                </tr>
                                            </thead>
											<tbody></tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                      </div>
			   </div>

		</div>
	</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
  <div class="modal-dialog" role="document" style="margin-top: 10%;">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="exampleModalLabel">添加域名</h4>
      </div>
      <div class="modal-body">
        <form id="formk">
          <div class="form-group">
            <label for="recipient-name" class="control-label">网站名称:</label>
            <input type="text" name="name" class="form-control" maxlength="20" id="name">
          </div>
		  <div class="form-group">
            <label for="recipient-name" class="control-label">链接地址:</label>
             <input type="text" name="url" class="form-control" value="http://" maxlength="200" id="url">
          </div>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" id="bttn"  class="btn btn-primary">确认添加</button>
		 <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="editD" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
  <div class="modal-dialog" role="document" style="margin-top: 10%;">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="exampleModalLabel">修改域名</h4>
      </div>
      <div class="modal-body">
        <form id="eform">
          <div class="form-group">
            <label for="recipient-name" class="control-label">网站名称:</label>
            <input type="text" name="name" class="form-control" maxlength="20" id="name">
          </div>
		  <div class="form-group">
            <label for="recipient-name" class="control-label">链接地址:</label>
             <input type="text" name="url" class="form-control" value="http://" maxlength="200" id="url">
          </div>
		  <input type="hidden" name="id" value="">
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" id="editbtn"  class="btn btn-primary">确认修改</button>
		 <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="xf" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
  <div class="modal-dialog" role="document" style="margin-top: 10%;">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="exampleModalLabel">域名续费</h4>
      </div>
      <div class="modal-body">
        <form id="xfform">
          <div class="form-group">
            <label for="recipient-name" class="control-label">网站名称:</label>
            <label class="control-label" id="title">ddd</label>
          </div>
		  <div class="form-group">
            <label for="recipient-name" class="control-label">选择时间:</label>
             <select class="form-control" name="type" id="type">
			 {foreach name="fg" item="vo" key="k" }
			 <option value="{$k}">{$k}月{$vo}元</option>
			 {/foreach}
			</select>
          </div>
		  <input type="hidden" name="id" value="">
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" id="xfbtn"  class="btn btn-primary">确认</button>
		 <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
      </div>
    </div>
  </div>
</div>
{/block}
{block name="js"}
{include file="layout/footda"/}
<script>
$(function(){
    	 $("#xfbtn").click(function(){
			 $.post("{:U('home/gong/xfDomain')}",$("#xfform").serialize(),function(res){
				if(res.code==1){
					layer.alert(res.msg, {
						  icon: 1,
						  skin: 'layer-ext-moon'},function(index){
							layer.close(index);
							$('#xf').modal('hide');
							var le=$('#apis').DataTable();
							le.draw(false);
						})
					}else{
					layer.alert(res.msg, {
						  icon: 2,
						  skin: 'layer-ext-moon'})
					}
			  
		    
		 })
	 })
	  $("#editbtn").click(function(){
			 $.post("{:U('home/gong/addDomain')}",$("#eform").serialize(),function(res){
				if(res.code==1){
					layer.alert(res.msg, {
						  icon: 1,
						  skin: 'layer-ext-moon'},function(index){
							layer.close(index);
							$('#editD').modal('hide');
							var lle=$('#apis').DataTable();
							lle.draw(false);
						})
					}else{
					layer.alert(res.msg, {
						  icon: 2,
						  skin: 'layer-ext-moon'})
					}
			  
		    
		 })
	 })
	  $("#bttn").click(function(){
	         var da=$("#formk").serialize();
			 $.post("{:U('home/gong/addDomain')}",da,function(res){
				if(res.code==1){
					layer.alert(res.msg, {
						  icon: 1,
						  skin: 'layer-ext-moon'},function(index){
							layer.close(index);
							$('#myModal').modal('hide');
							var table=$('#apis').DataTable();
							table.draw(false);
						})
					}else if(res.code==2){
					layer.confirm('免费域已经用完,添加一个将扣费{:C("wf_domain")}元', {btn: ['继续添加','算了']}, function(){
					     da += "&ty=1";
						 $.post("{:U('home/gong/addDomain')}",da,function(e){
								   if(e.code==1){
									 layer.alert(e.msg, {icon: 1,skin: 'layer-ext-moon'},function(index){
													 layer.close(index);
													$('#myModal').modal('hide');
													var table=$('#apis').DataTable();
													table.draw(false);
												  })
									}else{
									 layer.alert(e.msg, {icon: 2,skin: 'layer-ext-moon'})
									}
						 })
						 })
					}else{
					layer.alert(res.msg, {
						  icon: 2,
						  skin: 'layer-ext-moon'})
					}
			  
		    
		 })
	 })
    $('#apis').DataTable({
        'language': {
            "url": url
        },
		'bLengthChange':false,
		"pagingType": "full_numbers",
		"serverSide":true,
		"ajax": "",
		'order':[[0,'desc']],
	    "columns": [
		    { "data": "id" },
			{ "data": "name" ,"bSortable": false},
			{ "data": "url","bSortable": false},
			{ "data": 'uurl' ,"bSortable": false},
			{ "data": "addtime","bSortable": false },
			{ "data": "stoptime"},
			{ "data": "timeed" },
			{ "data": "state" },
			{ "data": null,"bSortable": false}

		],
		"fnInitComplete": function (oSettings, json) {
			$('.fa-question-circle').each(function () {
				$(this).tooltip();
			})
        },
        columnDefs: [
		   {
			targets: 2,
	        orderable : false,
	        render: function(data,type,row,meta) {
				return "<p class='text-danger'>"+data+"</p>";
	        }
			},
			{
				targets: 3,
				orderable : false,
				render: function(data,type,row,meta) {
					return "<p class='text-danger'>"+data+"</p>";
				}
			},
			{
				targets: 6,
				orderable : false,
				render: function(data,type,row,meta) {
				    let str=data+"天"+row.hour+"小时";
				    if(data==0 && row.hour>0)str="<p class='text-danger'>"+row.hour+"小时</p>";
					if(data==0 && row.hour==0)str="<p class='text-danger'>已过期</p>";
					return str;
				}
			},
			{
				targets: 7,
				orderable : false,
				render: function(data,type,row,meta) { 
                    var res=(row.count==null || row.count=="")?"请联系管理员":row.count;	
				   var str="<p class='text-danger'>暂停服务<i data-toggle='tooltip' class='fa fa-question-circle' style='color:#337ab7' title='"+res+"'></i></p>";
					if(data==1){
					  var str="<p class='text-success'>正常</p>";
					}
					return str;
				}
			},
			{
				"targets": -1,
				"render": function ( data, type, full, meta ) {
				     var str="";
					 str += "<div class='btn-group'><button type = 'button' class='btn btn-primary' id = 'editButton' ><i class='fa fa-edit'></i> 修改</button>";
					 str += "<button type = 'button' class='btn btn-success' id = 'xfButton' ><i class='fa fa-dollar'></i> 续费</button>";
					 str += "<button type = 'button' class='btn btn-danger' id = 'delButton' ><i class='fa fa-close'></i> 删除</button></div>";
					return str;
				}
			}
			
       ]			
	});
	$("#apis tbody").on("click", "#editButton", function () {
	  var row = $("table#apis tr").index($(this).closest("tr"));
      var name = $("table#apis").find("tr").eq(row).find("td").eq(0).text();
	  var title = $("table#apis").find("tr").eq(row).find("td").eq(1).text();
	  var url = $("table#apis").find("tr").eq(row).find("td").eq(2).text();
	   $("#editD input[name=id]").val(name);
	   $("#editD #name").val(title);
	   $("#editD #url").val(url);
		$("#editD").modal("show");
	})
	$("#apis tbody").on("click", "#xfButton", function () {
	  var row = $("table#apis tr").index($(this).closest("tr"));
      var name = $("table#apis").find("tr").eq(row).find("td").eq(0).text();
	  var title = $("table#apis").find("tr").eq(row).find("td").eq(1).text();
	  $("#xf input[name=id]").val(name);
	   $("#xf #title").text(title);
		$("#xf").modal("show"); 
	})
	$("#apis tbody").on("click", "#delButton", function () {
	  var row = $("table#apis tr").index($(this).closest("tr"));
      var name = $("table#apis").find("tr").eq(row).find("td").eq(0).text();
	  layer.confirm('你确定删除该域名？', {
					  btn: ['确定删除','算了'] //按钮
					}, function(){
		 $.post("{:U('home/gong/domainDel')}",{id:name},function(e){
				   if(e.code==1){
				     layer.alert(e.msg, {
								  icon: 1,
								  skin: 'layer-ext-moon'},function(index){
								     layer.close(index);
								     $("table#apis").find("tr").eq(row).remove();
								  })
					}else{
					 layer.alert(e.msg, {icon: 2,skin: 'layer-ext-moon'})
					}
		 })
		 })
	})
 })
</script>

{/block}