docker_project.jsp 15.2 KB
<%@page language="java" contentType="text/html;charset=utf-8" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>项目发布</title>
    <link rel="stylesheet" href="<%=basePath %>css/unicorn.main.css"/>
    <link rel="stylesheet" href="<%=basePath %>css/unicorn.grey.css"/>
    <link rel="stylesheet" href="<%=basePath %>css/bootstrap.min.css"/>
    <link href="<%=basePath%>css/style.default.css" rel="stylesheet">
    <link href="<%=basePath%>css/morris.css" rel="stylesheet">
    <link href="<%=basePath%>css/select2.css" rel="stylesheet"/>
    <script>
        var contextPath = '<%=basePath %>';
    </script>
</head>

<body style="background-color: #444444;font-size: 14px">

<!-- 头部 -->
<div id="head">
</div>
<div id="content">
    <div id="breadcrumb">
        <a href="#" title="Go to Home" class="tip-bottom"><i
                class="icon-home"></i> Home</a> <a href="#" class="current">项目发布Docker</a>
    </div>
    <div>
        <!-- query panel -->
        <form class="form-bordered">
            <div class="form-group">
                <label class="col-sm-1 control-label">操作选择</label>

                <div class="col-sm-8"  style="display: inline">
                    <div class="rdio rdio-default">
                        <input type="radio" name="operate" id="operatedeploy" value="Deploy" checked="checked"/>
                        <label for="operatedeploy">发布</label>
                    </div>

                    <%--<div class="rdio rdio-default">
                        <input type="radio" name="operate" value="Rollback" id="operateback" onclick="operateChange()"/>
                        <label for="operateback">回滚</label>
                    </div>--%>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-1 control-label">发布环境</label>

                <div class="col-sm-8">
                    <c:forEach items="${environments }" var="envi" varStatus="enviStatus">
                        <div class="rdio rdio-default">
                            <input type="radio" name="environments" id="${envi }" value="${envi }"
                                    <c:choose>
                                        <c:when test="${releaseWorkJob_environment!=null}">
                                            <c:set var="envi_comm">${envi},</c:set>
                                            <c:if test="${fn:containsIgnoreCase(releaseWorkJob_environment,envi_comm)}">checked="checked"</c:if>
                                        </c:when>
                                        <c:otherwise>
                                            <c:if test="${enviStatus.index==0}">checked="checked"</c:if>
                                        </c:otherwise>
                                    </c:choose>
                            />
                            <label for="${envi }">${envi }</label>
                        </div>
                    </c:forEach>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-1 control-label">项目类别</label>

                <div class="col-sm-8">
                    <c:forEach items="${projectTypes }" var="projType" varStatus="projTypeStatus">
                        <div class="rdio rdio-default"  style='display: inline'>
                            <input type="radio" name="projectTypes" id="${projType }" value="${projType }"
                                   onclick="getProjects()"
                                   <c:if test="${projTypeStatus.index==0}">checked="checked"</c:if>
                            />
                            <label for="${projType }">${projType }</label>&nbsp;&nbsp;&nbsp;
                        </div>
                    </c:forEach>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-1 control-label">项目选择</label>

                <div class="col-sm-8" id="project-div">
                </div>
            </div>

            <div class="form-group" id="branch-div">
                <label class="col-sm-1 control-label">Branch输入</label>
                <div class="col-sm-8">
                    <input name="branch" type="text" class="form-control"
                           value="${releaseWorkJob_branch}"
                           style="width: 300px"/>
                </div>
            </div>

            <div class="form-group" id="workid-div">
                <label class="col-sm-1 control-label">关联工单</label>
                <div class="col-sm-8">
                    <input name="workid" type="text" class="form-control"
                           value="${releaseWorkJob_id}"
                           style="width: 300px" placeholder="填写 release0 可以不关联工单号"/>
                </div>
            </div>

            <div class="form-group" id="rollback-div" style="display: none">
                <label class="col-sm-1 control-label">回滚版本选择</label>

                <div class="col-sm-8" id="select-rollbackList-div">

                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-1 control-label">确认操作</label>

                <div class="col-sm-8">
                    <button type="button" id="submit-btn" onclick="comfirmSubmit()" class="btn btn-primary">提交</button>
                </div>
            </div>

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

<!-- 初始化确认页面  -->
<div class="modal fade" id="confirmSubmitDivId" tabindex="-1" role="dialog" aria-labelledby="confirmSubmitLabel"
     aria-hidden="true" style="padding-top: 10%">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <%--<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>--%>
                <h2 class="modal-title" id="confirmSubmitLabel">
                    <span style="font-weight: bold;"> 确认提交</span>
                </h2>
            </div>
            <div class="modal-body">
                <form class="bs-example bs-example-form"  role="form"
                       method="post">
                    <div class="input-group">
                        <span class="input-group-addon">操作类型</span>
                        <input type="text" name="operate_name" class="form-control" readonly="readonly">
                    </div>
                    <br>

                    <div class="input-group">
                        <span class="input-group-addon">发布环境</span>
                        <input type="text" name="environment_name" class="form-control" readonly="readonly">
                    </div>
                    <br>

                    <div class="input-group">
                        <span class="input-group-addon">工程名称</span>
                        <input type="hidden" name="project_id" class="form-control" readonly="readonly">
                        <input type="text" name="project_name" class="form-control" readonly="readonly">
                    </div>
                    <br>

                    <div class="input-group">
                        <span class="input-group-addon">分支名称</span>
                        <input type="text" name="branch_name" class="form-control" readonly="readonly">
                    </div>
                    <br>

                    <div class="input-group">
                        <span class="input-group-addon">关联工单</span>
                        <input type="text" name="workid_name" class="form-control" readonly="readonly">
                    </div>
                    <br>


                    <div class="modal-footer">
                        <button id="confirmBtn" type="button" class="btn btn-primary" onclick="mirrorAndDeploy()">确认</button>
                        <button id="cancelBtn" type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    </div>
                </form>
            </div>

        </div>
    </div>
</div>
<!-- 初始化确认页面  end -->

</body>
<script type="text/javascript">
    var default_releaseWorkJob_branch="${releaseWorkJob_branch}";
    var default_releaseWorkJob_project="${releaseWorkJob_project}";
    var default_releaseWorkJob_enviCount = "${releaseWorkJob_enviCount}";
    var default_releaseWorkJob_environment="${releaseWorkJob_environment}";
</script>
<script src="<%=basePath%>js/jquery-2.1.4.min.js"></script>
<script src="<%=basePath%>js/bootstrap.min.js"></script>
<script src="<%=basePath%>js/select2.min.js"></script>
<script src="<%=basePath%>js/custom.js"></script>
<script src="<%=basePath %>/js/unicorn.js"></script>
<script src="<%=basePath %>script/common/genarate_left_panel.js"></script>
<script type="text/javascript">
    $("#li_project").addClass("active open");
    $("#li_dockerRelease").addClass("active");
</script>

</html>
<script type="text/javascript">
    jQuery(document).ready(function () {
        getProjects();
    });

    /**
     * 根据操作获取当前的项目列表
     */
    function getProjects() {
        $.ajax({
            type: 'post',
            url: contextPath + "dockerBuild/getProjects",
            data: {
                projectType:$("input[name='projectTypes']:checked").val()
             },
            dataType: 'json',
            success: function (data) {
                var obj = eval("(" + data + ")");
                var order1HTML="";
                var order1num = 1;
                for (var i = 0; i < obj.length; i++) {
                    var projectId = obj[i].id;
                    var name = obj[i].projectName;
                    var checkstr="";
                    if(default_releaseWorkJob_project!=null&&default_releaseWorkJob_project.indexOf(name+",")>=0){
                        checkstr = " checked ";
                    }
                    order1HTML += "<div class='ckbox ckbox-primary' style='display: inline'>";
                    order1HTML += " <input name='project1' type='checkbox' " + checkstr ;
                    order1HTML += " id='" + name + "' value='" + projectId + "'/>";
                    order1HTML += "<label for='" + name + "' style='width: 200px'>" + name + "</label></div>";
                    if (order1num % 4 == 0) {
                        order1HTML += "</br>";
                    }
                    order1num += 1;
                }
                document.getElementById("project-div").innerHTML = order1HTML ;
                branchdefault();
                workiddefault();

                if(default_releaseWorkJob_enviCount!=null&&default_releaseWorkJob_enviCount>=2){
                    alert("提醒:工单的发布环境为"+default_releaseWorkJob_environment+"当前只选中一个!");
                }
            },
            error: function (e) {
                alert("从后台获取数据出错");
            }
        });
    }

    function branchdefault() {
        var operate = $("input[name='operate']:checked").val();
        if (operate == "Deploy") {
            if(default_releaseWorkJob_branch!=null&&default_releaseWorkJob_branch.length>0){
                $("input[name='branch']").val(default_releaseWorkJob_branch);
                return;
            }
            //var environment = $("input[name='environments']:checked").val();
            $("input[name='branch']").val("master");
        }
    }
    
    function workiddefault() {
        var default_releaseWorkJob_workId="${releaseWorkJob_id}";
        if(default_releaseWorkJob_workId!=null&&default_releaseWorkJob_workId.length>0){
            $("input[name='workid']").val(default_releaseWorkJob_workId);
            return;
        }
        $("input[name='workid']").val("release0");
    }

    //确认提交
    function comfirmSubmit() {
        var operate = $("input[name='operate']:checked").val();
        var environment = $("input[name='environments']:checked").val();
        var projects = new Array();
        var projectNames = new Array();
        if ("Deploy" == operate) {//发布
            $('input[name="project1"]:checked').each(function () {
                projects.push($(this).val());//向数组中添加元素
                projectNames.push($(this).next().text());
            });

            if (projects.length == 0) {
                alert("请选择项目");
                return;
            }

            var branch = $("input[name='branch']").val();
            if (branch == "") {
                alert("请填写分支名称");
                return;
            }
            var workid = $("input[name='workid']").val();
            if (workid == "") {
                alert("请填写关联工单号");
                return;
            }

            $("input[name='operate_name']").val(operate);
            $("input[name='project_id']").val(projects);
            $("input[name='project_name']").val(projectNames);
            $("input[name='environment_name']").val(environment);
            $("input[name='branch_name']").val(branch);
            $("input[name='workid_name']").val(workid);
            $('#confirmSubmitDivId').modal('show');
        }
    }
    
    function mirrorAndDeploy() {
        $("#confirmBtn").attr("disabled","disabled");
        $("#cancelBtn").attr("disabled","disabled");
        var param={};
        param.operate_name=$("input[name='operate_name']").val();
        param.project_id=$("input[name='project_id']").val();
        param.project_name=$("input[name='project_name']").val();
        param.environment_name=$("input[name='environment_name']").val();
        param.branch_name=$("input[name='branch_name']").val();
        param.workid_name=$("input[name='workid_name']").val();

        $.ajax({
            url: contextPath + "dockerBuild/mirrorAndDeploy",
            type: "post",
            dataType: "json",
            data: param ,
            success: function (response) {
                if(response!=null&&(response.code==200||response.code==2000)){
                    //成功(或者部分成功),进入刷新进度界面
                    param.buildIds=response.data;
                    param.failMsg=response.message;
                    GobalStandardPost( contextPath+ "dockerBuild/toBuildView",param);
                }else{
                    //失败
                    if(response==null){
                        mirrorFail("制作镜像失败!");
                    }else{
                        mirrorFail(response.message);
                    }

                }
            },
            error: function (e) {
                mirrorFail(e);
            }
        });
    }

    function mirrorFail(msg) {
        $("#confirmBtn").removeAttr("disabled");
        $("#cancelBtn").removeAttr("disabled");
        localAlert("msg");
    }

</script>