editHostInfo.jsp 7.47 KB
<%@page language="java" contentType="text/html;charset=utf-8" %>
<form method="post" class="form-horizontal" id="hostInfoForm" name="hostInfoForm">

    <div class="form-group" >
        <label class="col-sm-2 control-label"> <span style="color:red">*</span>主机IP:</label>
        <div class="col-sm-8">
            <input type="text" class="form-control" id="hostIp" name="hostIp" placeholder="输入IP地址" maxlength="30" size="40" onblur="autoHostName();"/>
        </div>
    </div>

    <div class="form-group" >
        <label class="col-sm-2 control-label"> <span style="color:red">*</span>云类型:</label>
        <div class="col-sm-8">
            <select id="cloudType" name="cloudType" class="form-control" onchange="autoHostName();">
                <option value="1">AWS</option>
                <option value="2">Qcloud</option>
                <option value="3">其他</option>
            </select>
        </div>
    </div>

    <div class="form-group" >
        <label class="col-sm-2 control-label">标签:</label>
        <div class="col-sm-8" id="appNameContent">

        </div>
    </div>

    <div class="form-group" >
        <label class="col-sm-2 control-label"> <span style="color:red">*</span>主机别名:</label>
        <div class="col-sm-8">
            <input type="text" class="form-control" id="alias" name="alias" placeholder="输入主机别名" maxlength="30" size="40" />
        </div>
    </div>
    <div class="form-group" >
        <label class="col-sm-2 control-label"></label>
        <div class="col-sm-8" id="messageAlert"></div>
     </div>
</form>


<script>
    var tagTypes = eval(${tagTypeMapJson});

    function autoHostName(){
        var hostIp=$("#hostInfoForm #hostIp").val();
        var cloudType=$('#hostInfoForm #cloudType option:selected').text();
        var tags="";
        $("input[name='appName']:checked").each(function(){
            if(tags.indexOf($(this).attr('value')+'-')<0){
                tags += $(this).attr('value')+'-';
            }
        });
        $("#hostInfoForm #alias").val(cloudType+"-"+tags+hostIp);
    }

    function endWithChars(str,endStr){
        var d=str.length-endStr.length;
        return (d>=0&&str.lastIndexOf(endStr)==d)
    }

    $(function () {
        /*$.ajax({
            url : contextPath +"/hostGroup/getAllTagsGroupByType",
            type : 'post',
            async : false,
            dataType : "json",
            success : function(data) {
                var contentHtml='';
                contentHtml += "<table border=1>";

                for (var key in tagTypes) {
                    contentHtml += "<tr>";
                    contentHtml += "<td width='60'>";
                    contentHtml += tagTypes[key] ;
                    contentHtml += "</td>";
                    contentHtml += "<td>";
                    $.each(data.data[key],function(n,value) {
                        if(n>0&&n%6==0){
                            contentHtml+='</br>';
                        }
                        contentHtml+='<input type="checkbox" name="appName"  onchange="autoHostName();" value="'+value.groupName+'">' +value.groupName+'&nbsp;&nbsp;';
                    });
                    contentHtml += "</td>";
                    contentHtml += "</tr>";
                }
                contentHtml += "</table>";
                $("#hostInfoForm #appNameContent").html(contentHtml);
            }
        });*/


        $.ajax({
            url : contextPath +"/hostGroup/getAllTagsGroupTreegridByType",
            type : 'post',
            async : false,
            dataType : "json",
            success : function(data) {
                var contentHtml='';
                contentHtml += "<table border=1>";
                for (var key in tagTypes) {
                    contentHtml += "<tr>";
                    contentHtml += "<td width='60'>";
                    contentHtml += tagTypes[key] ;
                    contentHtml += "</td>";
                    contentHtml += "<td>";
                    if(key=="app"||key=="mid"){
                       contentHtml += constructTr(data.data[key],1);
                    }else{
                        contentHtml += constructTr(data.data[key]);
                    }

                    contentHtml += "</td>";
                    contentHtml += "</tr>";
                }
                contentHtml += "</table>";
                $("#hostInfoForm #appNameContent").html(contentHtml);
            }
        });

        function constructTrLevel2(treeData,levelnum){
            var contentHtml="";
            $.each(treeData,function(n,value) {
                if(!endWithChars(contentHtml,"</br>")){
                    if((n>0&&n%6==0)){
                        contentHtml+='</br>';
                    }
                }
                contentHtml+='<input type="checkbox" name="appName"  onchange="autoHostName();" value="'+value.groupName+'">' +value.groupName+'&nbsp;&nbsp;';
                if(value.children!=null&&value.children.length>0){
                    levelnum++;
                    if(!endWithChars(contentHtml,"</br>")){
                        contentHtml+='</br>';
                    }
                    if(levelnum<=3){
                        if(levelnum==2){
                            contentHtml+='&nbsp;&nbsp;&nbsp;&nbsp;';
                        }else {
                            contentHtml+='&nbsp;&nbsp;&nbsp;&nbsp;';
                            contentHtml+='&nbsp;&nbsp;&nbsp;&nbsp;';
                        }
                    }
                   // }
                    contentHtml += constructTrLevel2(value.children,levelnum);
                    levelnum--;
                    if(!endWithChars(contentHtml,"</br>")){
                        contentHtml+='</br>';
                    }
                }
            });
            return contentHtml;
        }

        function constructTr(treeData){
            var contentHtml="";
            $.each(treeData,function(n,value) {
                if(n>0&&n%6==0){
                    contentHtml+='</br>';
                }
                contentHtml+='<input type="checkbox" name="appName"  onchange="autoHostName();" value="'+value.groupName+'">' +value.groupName+'&nbsp;&nbsp;';
                if(value.children!=null&&value.children.length>0){
                    contentHtml += constructTr(value.children);
                }
            });
            return contentHtml;
        }

            //加载form
            $("#hostInfoForm").form({
                loadUrl : "getHostInfoById.do",
                loadParams : {
                    id : paramObj.hoseInfoId
                },
                loadFilter : function(data) {
                    return defaultLoadFilter(data);
                },
                onBeforeLoad : function(loadParams) {
                    if (loadParams.hoseInfoId == 0) {
                        return false;
                    }
                },
                onLoadSuccess : function(data) {
                    $("#hostInfoForm #hostIp").prop("readonly",true);
                    //$(":checkbox[value='"+java+"']").prop("checked",true);
                    if(data.tags != null && data.tags != ""){
                        var tags=data.tags.substr(0,data.tags.length-1);
                        var tagArr=tags.split(",");
                        for(i=0;i<tagArr.length;i++){
                            $(":checkbox[value='"+tagArr[i]+"']").prop("checked",true);
                        }
                    }
                }
            });

    });
</script>