

<title>监控设置 - 节点管理</title>

<div class="layui-card layadmin-header">
  <div class="layui-breadcrumb" lay-filter="breadcrumb">
    <a lay-href="">首页</a>
    <a><cite>节点管理</cite></a>
    <a><cite>监控设置</cite></a>
  </div>
</div>

<style type="text/css">
.layui-elem-quote{padding: 6px;}
.thin-gray{font-weight: 400;color: #999;} 
.small-title{font-weight:700;font-size:14px}
hr {margin-bottom: 30px}
</style>
<div class="layui-fluid">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md12">
      <div class="layui-card">
        <div class="layui-card-body">
         <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
          <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">

              <fieldset class="layui-elem-field">
                <legend>IP可用性监控</legend>
                <div class="layui-field-box">
                  <div class="layui-row layui-col-space10">
                    <div class="layui-col-md2">间隔时间：</div>
                    <div class="layui-col-md2 layui-form">
                      <input type="radio" lay-filter="interval" name="interval" value="30" title="30秒" >
                      <input type="radio" lay-filter="interval" name="interval" value="60" title="1分钟" >
                      <input type="radio" lay-filter="interval" name="interval" value="300" title="5分钟" >
                    </div>
                  </div> 
                  <div class="layui-row layui-col-space10">
                    <div class="layui-col-md2">连续失败次数：</div>
                    <div class="layui-col-md2"><input type="text" name="failed_times"  value="" autocomplete="off" class="layui-input"></div>
                  </div>     
                  <div class="layui-row layui-col-space10">
                    <div class="layui-col-md2">监控点失败比率 (%)：</div>
                    <div class="layui-col-md2"><input type="text" name="failed_rate"  value="" autocomplete="off" class="layui-input"></div>
                  </div>  
    
                  <div class="layui-row layui-col-space10">
                    <div class="layui-col-md2">监控服务器地址：</div>
                    <div class="layui-col-md2"><input type="text" name="monitor_api"  placeholder="留空则使用系统默认" value="" autocomplete="off" class="layui-input"></div>
                  </div> 
                </div>
              </fieldset>
              
              <p>&nbsp;</p>
              <fieldset class="layui-elem-field">
                <legend>节点带宽监控</legend>
                <div class="layui-field-box">
                  <div class="layui-row layui-col-space10">
                    <div class="layui-col-md2">连续带宽超限次数：</div>
                    <div class="layui-col-md2"><input type="text" name="bw_exceed_times"  value="" autocomplete="off" class="layui-input"></div>
                  </div>     
                </div>
              </fieldset>


            </div>
        </div>
      </div>                 

    </div>
  </div>
</div>
</div>
</div>

<script type="text/javascript">
  layui.use(['admin', 'table','form'], function(){
    var $ = layui.$
    ,admin = layui.admin
    ,view = layui.view
    ,table = layui.table
    ,form = layui.form;

    form.render()

    // 获取配置
    admin.req({
      url: '/configs/global-0-system-node_monitor_config' //实际使用请改成服务端真实接口
      ,type: "get"
      ,contentType:"application/json"
      ,dataType: "json"        
      ,done: function(res){
        var data = JSON.parse(res.data.value)
        $("input[name='interval'][value='"+data.interval+"']").prop("checked",true)
        $("input[name='failed_times']").val(data.failed_times)
        $("input[name='failed_rate']").val(data.failed_rate)
        $("input[name='bw_exceed_times']").val(data.bw_exceed_times)
        
        $("input[name='monitor_api']").val(data.monitor_api)
        form.render()
      }
    });

    // 保存
    function save() {
      var interval = $("input[name='interval']:checked").val()
      var failed_times = $("input[name='failed_times']").val()
      var failed_rate = $("input[name='failed_rate']").val()
      var bw_exceed_times = $("input[name='bw_exceed_times']").val()
      var monitor_api = $("input[name='monitor_api']").val()
      var data = JSON.stringify({"monitor_api":monitor_api, "interval":interval,
      "failed_times":failed_times,"failed_rate":failed_rate,"bw_exceed_times":bw_exceed_times})

      admin.req({
        url: '/configs/global-0-system-node_monitor_config' //实际使用请改成服务端真实接口
        ,type: "put"
        ,data: JSON.stringify({"value": data})
        ,contentType:"application/json"
        ,dataType: "json"
        ,done: function(res){ 
          //登入成功的提示与跳转
          layer.msg('保存成功', {
            offset: '15px'
            ,icon: 1
            ,time: 1000
          });
        }
      });
    }


    form.on('radio(interval)', function(data){
      save()
    });  
  
    // 监听input
    $("input[name='failed_times'],input[name='bw_exceed_times'], input[name='failed_rate'],input[name='monitor_api']").change(function (params) {
      save()
    })

  });  

</script>