ops / monitor-ui · Commits

Go to a project

Authored by zhengyouwei
Commit a64d505ee50d3f5e04dce9f8e587221f52083677 1 parent 43ccd668

项目同时执行

Inline Side-by-side
Showing 6 changed files with 345 additions and 209 deletions
package com.ui.model.domain;
/**
* Created by zhengyouwei on 2016/6/29.
*/
public class BuildMessage {
private String id;
private String projectOrder;
private String message;
private String currentProject;
public BuildMessage(){
}
public BuildMessage(String id, String projectOrder){
this.id = id;
this.projectOrder = projectOrder;
}
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getProjectOrder() {
return projectOrder;
}
public void setProjectOrder(String projectOrder) {
this.projectOrder = projectOrder;
}
public String getMessage() {
return message;
}
public void setMessage(String message) {
this.message = message;
}
public String getCurrentProject() {
return currentProject;
}
public void setCurrentProject(String currentProject) {
this.currentProject = currentProject;
}
}
... ...
... ... @@ -4,6 +4,7 @@ import com.alibaba.fastjson.JSONArray;
import com.ui.contants.HttpUriContants;
import com.ui.http.HttpRestClient;
import com.ui.model.BaseResponse;
import com.ui.model.domain.BuildMessage;
import com.ui.model.req.*;
import com.ui.project.ProjectEnvironment;
import com.ui.project.ProjectOnline;
... ... @@ -16,8 +17,7 @@ import org.springframework.web.bind.annotation.*;
import org.springframework.web.servlet.ModelAndView;
import javax.servlet.http.HttpSession;
import java.util.HashMap;
import java.util.Map;
import java.util.*;
/**
* Created by fruwei on 2016/6/16.
... ... @@ -57,7 +57,7 @@ public class ProjectBuildCtrl {
model.addAttribute("projects", ProjectOnline.getJavaList());
return new ModelAndView("project/history");
return new ModelAndView("project/history");
}
/**
... ... @@ -109,22 +109,80 @@ public class ProjectBuildCtrl {
}
@RequestMapping(value = "tobuildpage")
@ResponseBody
public ModelAndView tobuildpage(String messageid, String project, String environment, String operate, String branch, String rollbackfile, Model model) {
model.addAttribute("messageid", messageid);
model.addAttribute("project", project);
model.addAttribute("environment", environment);
model.addAttribute("operate", operate);
model.addAttribute("branch", branch);
model.addAttribute("rollbackfile", rollbackfile);
return new ModelAndView("project/single_project_build");
}
/**
* 执行任务
*
* @param request
* @return
*/
@RequestMapping(value = "build", method = RequestMethod.POST)
@ResponseBody
public String build(@RequestBody BuildRequest request, HttpSession session) {
public ModelAndView build(String project_name, String environment_name, String operate_name, String branch_name, String rollbackfile_name, Model model, HttpSession session) {
try {
User user = (User) session.getAttribute("user");
request.setUser(user.getName());
return httpRestClient.post(ProjectEnvironment.getUrl(request.getEnvironment()) + "build", request, String.class);
List<BuildMessage> list = new ArrayList<>();
BuildRequest buildRequest = new BuildRequest();
buildRequest.setBranch(branch_name);
buildRequest.setUser(user.getName());
buildRequest.setEnvironment(environment_name);
buildRequest.setRollbackfile(rollbackfile_name);
buildRequest.setOperate(operate_name);
String messageids = "";
if ("Deploy".equals(operate_name)) {
String[] array = project_name.split(",");
if (array.length > 4) {
String[] newArray = new String[]{"","","",""};
for (int i = 0; i < array.length; i++) {
newArray[i%4] = newArray[i%4] + array[i] + ",";
}
for (String project : newArray) {
buildRequest.setProject(project.substring(0,project.length() - 1));
BuildMessage buildMessage = httpRestClient.post(ProjectEnvironment.getUrl(environment_name) + "build", buildRequest, BuildMessage.class);
if (buildMessage != null) {
list.add(buildMessage);
messageids = messageids + buildMessage.getId() + ",";
}
}
} else {
for (String project : array) {
buildRequest.setProject(project);
BuildMessage buildMessage = httpRestClient.post(ProjectEnvironment.getUrl(environment_name) + "build", buildRequest, BuildMessage.class);
if (buildMessage != null) {
list.add(buildMessage);
messageids = messageids + buildMessage.getId() + ",";
}
}
}
} else {
BuildMessage buildMessage = httpRestClient.post(ProjectEnvironment.getUrl(environment_name) + "build", buildRequest, BuildMessage.class);
if (buildMessage != null) {
list.add(buildMessage);
messageids = messageids + buildMessage.getId() + ",";
}
}
model.addAttribute("environment_name", environment_name);
model.addAttribute("operate_name", operate_name);
model.addAttribute("branch_name", branch_name);
model.addAttribute("rollbackfile_name", rollbackfile_name);
model.addAttribute("messageids", messageids);
model.addAttribute("messageList", list);
} catch (Exception ex) {
return "failed";
}
return new ModelAndView("project/project_build");
}
/**
... ... @@ -140,6 +198,7 @@ public class ProjectBuildCtrl {
Map<String, String> map = new HashMap<>();
map.put("messageid", messageid);
map.put("project", project);
return httpRestClient.get(ProjectEnvironment.getUrl(messageid.split("_")[0]) + "getbuildmsg", String.class, map);
} catch (Exception ex) {
... ...
... ... @@ -73,12 +73,6 @@
<div class="col-sm-8" id="project-div">
</div>
</div>
<%--<div class="form-group" id="tag-div">--%>
<%--<label class="col-sm-1 control-label">TAG输入</label>--%>
<%--<div class="col-sm-8">--%>
<%--<input name="tag" type="text" placeholder="默认为master最新版本" class="form-control" style="width: 300px" />--%>
<%--</div>--%>
<%--</div>--%>
<div class="form-group" id="branch-div">
<label class="col-sm-1 control-label">Branch输入</label>
... ... @@ -100,33 +94,12 @@
<div class="col-sm-8">
<button type="button" id="submit-btn" onclick="comfirmSubmit()" class="btn btn-primary">提交</button>
<button type="button" id="cancel-btn" onclick="cancelBuild()" class="btn btn-danger">取消</button>
</div>
</div>
<div class="form-group">
<label class="col-sm-1 control-label">操作提示</label>
<div class="col-sm-8">
<div class="alert alert-warning" id="task-info-div">
</div>
<div id="show-project-div">
</div>
</div>
</div>
</form>
</div>
<!-- query panel -->
<HR class="title-hr"
style="FILTER: alpha(opacity = 100, finishopacity = 0, style = 3)"
SIZE=3>
&nbsp; &nbsp; &nbsp; &nbsp;
<textarea id="resultArea" rows="30" cols="120"
style="background-color: black; color: white" readonly="readonly"></textarea>
</div>
<input type="hidden" id="messageid">
<input type="hidden" id="currentproject">
<!-- 初始化确认页面 -->
<div class="modal fade" id="confirmSubmitDivId" tabindex="-1" role="dialog" aria-labelledby="confirmSubmitLabel"
... ... @@ -140,8 +113,8 @@
</h2>
</div>
<div class="modal-body">
<form class="bs-example bs-example-form" action="<%=path %>/createBranch.do" role="form"
id="GitBranchCreateForm">
<form class="bs-example bs-example-form" action="<%=basePath %>project/build" role="form"
id="GitBranchCreateForm" method="post">
<div class="input-group">
<span class="input-group-addon">操作类型</span>
<input type="text" name="operate_name" class="form-control" readonly="readonly">
... ... @@ -170,12 +143,13 @@
<span class="input-group-addon">回滚文件</span>
<input type="text" name="rollbackfile_name" class="form-control" readonly="readonly">
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary">确认</button>
<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" onclick="projectbuild();">确认</button>
<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
</div>
</div>
</div>
</div>
... ... @@ -191,11 +165,5 @@
$("#li_project").addClass("active open");
$("#li_projectRelease").addClass("active");
</script>
<script language="JavaScript">
window.onbeforeunload = function () {
return "真的离开?";
}
</script>
</body>
</html>
... ...
<%@page language="java" contentType="text/html;charset=utf-8" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
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>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="<%=basePath %>css/bootstrap.min.css"/>
<link rel="stylesheet" href="<%=basePath %>css/bootstrap-datetimepicker.css"/>
<link href="<%=basePath %>js/bootstrap-plugin/css/bootstrap.table.css" rel="stylesheet" media="screen"/>
<link rel="stylesheet" href="<%=basePath %>css/bootstrap-responsive.min.css"/>
<link rel="stylesheet" href="<%=basePath %>css/fullcalendar.css"/>
<link rel="stylesheet" href="<%=basePath %>css/unicorn.main.css"/>
<link rel="stylesheet" href="<%=basePath %>css/unicorn.grey.css"/>
<link rel="stylesheet" href="<%=basePath %>css/jquery-ui.css"/>
<link rel="stylesheet" href="<%=basePath %>css/uniform.css"/>
<link rel="stylesheet" href="<%=basePath %>css/select2.css"/>
<link rel="stylesheet" href="<%=basePath %>js/jstree/themes/proton/style.css"/>
<link rel="stylesheet" href="<%=basePath %>css/select2.css"/>
<link rel="stylesheet" href="<%=basePath %>css/yoho.css"/>
<script src="<%=basePath %>js/excanvas.min.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/jquery-1.12.0.min.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/jquery-ui.custom.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>/js/bootstrap.min.js"></script>
<script src="<%=basePath %>/js/unicorn.js"></script>
<script src="<%=basePath %>js/bootstrap-plugin/datetimepicker/moment-with-locales.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/datetimepicker/bootstrap-datetimepicker.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/global.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.pagination.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.table.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.dialog.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.form.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.panel.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.alerts.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.accordion.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.breadcrumb.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.validate.js" charset="UTF-8"
type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.form.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/layer/layer.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/bootstrap-plugin/bootstrap.select.js" charset="UTF-8" type="text/javascript"></script>
<script src="<%=basePath %>js/jstree/jstree.min.js"></script>
<script src="<%=basePath %>js/jquery.toaster.js"></script>
<script>
var contextPath = '<%=basePath %>';
</script>
<title>YOHO!运维</title>
</head>
<body>
<!-- 头部 -->
<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">发布进程</a>
</div>
<div class="container-fluid">
<div class="widget-box">
<div class="widget-title">
<h5>发布进程信息</h5>
</div>
<div class="widget-content nopadding">
<div class="widget-title" style="height: 53px;">
<div>
<div class="form-inline" role="form" id="inBoxQueryDiv"
style=" margin-top: 12px;margin-left: 25px;float: left;">
<div class="input-group" style="float: left;">
<span class="input-group-addon">操作：</span>
<input type="text" id="operate_name" name="operate_name" class="form-control"
readonly="readonly" value="${operate_name}"/>
</div>
<div class="input-group" style="float: left;">
<span class="input-group-addon">环境：</span>
<input type="text" id="environment_name" name="environment_name" class="form-control"
readonly="readonly" value="${environment_name}"/>
</div>
<div class="input-group" style="float: left;">
<span class="input-group-addon">分支：</span>
<input type="text" id="branch_name" name="branch_name" class="form-control"
readonly="readonly" value="${branch_name}"/>
</div>
<div class="input-group" style="float: left;">
<span class="input-group-addon">回滚：</span>
<input type="text" id="rollbackfile_name" name="rollbackfile_name" class="form-control"
readonly="readonly" value="${rollbackfile_name}"/>
</div>
</div>
</div>
</div>
<c:forEach items="${messageList }" var="message">
<div style="float: left;height: 600px;">
<hr>
<div>执行顺序：<strong>${message.projectOrder}</strong>
</div>
<div>当前项目：<input type="text" id="currentProject_${message.id}" value="${message.currentProject}" readonly="readonly">
<button type="button" id="cancel-btn_${message.id}" onclick="cancelBuild('${message.id}')"
class="btn btn-xs btn-danger">取消
</button>
</div>
<div style="height: 50px" class="alert alert-warning" id="task-info-div_${message.id}">
</div>
<textarea id="resultArea_${message.id}" rows="25" cols="100"
style="background-color: black; color: white" readonly="readonly"></textarea>
</div>
</c:forEach>
</div>
</div>
</div>
</div>
<input type="hidden" id="messageListHidden" value="${messageids}">
</body>
<script src="<%=basePath %>script/common/genarate_left_panel.js"></script>
<script>
$("#li_project").addClass("active open");
$("#li_projectRelease").addClass("active");
</script>
<script>
var myArray;
var removeArray = new Array();
$(function () {
var messageListHidden = $("#messageListHidden").val();
myArray = messageListHidden.split(",");
var interval = setInterval(function () {//查后台，展示数据
$.each(myArray, function (idx, val) {
if(jQuery.inArray(val, removeArray) != -1){
return;
}
if(val == ""){
return;
}
var cproject = $("#currentProject_"+val).val();
$.ajax({
url: contextPath + 'project/getbuildmsg?messageid=' + val+"&project="+cproject,
type: 'POST',
dataType: 'json',
success: function (data3) {
var obj2 = eval("(" + data3 + ")");
var messagedata = obj2.data;
var currproject = messagedata.currentProject;
if (currproject != cproject) {
$("#currentProject_"+val).val(currproject);//更换当前的项目
$("#resultArea_" + val).val("")
}
if (messagedata.message != "") {
var d = $("#resultArea_" + val).val();
$("#resultArea_"+ val).val(d + messagedata.message);
var scrollTop = $("#resultArea_" + val)[0].scrollHeight;
$("#resultArea_" + val).scrollTop(scrollTop);
}
//code为2 ,则结束
var code = obj2.code;
var message = obj2.message;
if (code == 2) {
document.getElementById("task-info-div_" + val).innerHTML = "<strong>'" + message + "'</strong>";
removeArray.push(val);
$("#cancel-btn_"+val).hide();
}
},
error: function (e) {
}
});
});
}, 3000);
});
/**
* 取消
*/
function cancelBuild(messageid) {
var jsondata = {"id": messageid};
$.ajax({
url: contextPath + 'project/cancelBuild',
type: 'POST',
dataType: 'json',
data: jsondata,
success: function (data) {
},
error: function (e) {
}
});
}
</script>
\ No newline at end of file
... ...
... ... @@ -257,8 +257,8 @@
className: "btn-success",
onclick: function () {
var iWidth = 1200;
var iHeight = 900;
var iWidth = 900;
var iHeight = 700;
var iTop = (window.screen.availHeight - 30 - iHeight) / 2; //获得窗口的垂直位置;
var iLeft = (window.screen.availWidth - 10 - iWidth) / 2; //获得窗口的水平位置;
window.open(contextPath + "javaRestart/toStopOrRestart?project=" + project + "&cloud=" + cloud + "&exe=restart"+ "&ip=" + ip, "_blank", "height=" + iHeight + ", width=" + iWidth + ", top=" + iTop + ", left=" + iLeft);
... ...
jQuery(document).ready(function () {
getProjects();
$("#cancel-btn").hide();
});
/**
... ... @@ -222,127 +221,6 @@ function comfirmSubmit() {
}
}
function projectbuild() {
var operate = $("input[name='operate_name']").val();
var projects = $("input[name='project_name']").val();
var environment = $("input[name='environment_name']").val();
var branch = $("input[name='branch_name']").val();
var rollbackfile = $("input[name='rollbackfile_name']").val();
$('#confirmSubmitDivId').modal('hide');
$("#submit-btn").hide();
$("#cancel-btn").show();
$("#resultArea").val("");
document.getElementById("task-info-div").innerHTML = "<strong>任务执行中，请不要关闭页面...</strong>";
var jsondata = {
"project": projects,
"environment": environment,
"operate": operate,
"branch": branch,
"rollbackfile": rollbackfile
};
$.ajax({
url: 'build',
type: 'POST',
dataType: 'json',
contentType: "application/json",
data: JSON.stringify(jsondata),
success: function (data2) {
var obj = eval("(" + data2 + ")");
var projectOrder = obj.data.projectOrder;
var projectOrders = projectOrder.split(",");
$("#currentproject").val(projectOrders[0]);
$("#messageid").val(obj.data.id);
// 展示执行顺序
var HTML = "";
for (var i = 0; i < projectOrders.length; i++) {
var p = projectOrders[i];
HTML += "<div class='ckbox ckbox-danger' id='show-" + p + "-div' style='display: inline'>";
HTML += " <input name='show-" + p + "' type='checkbox' id='show-" + p + "' value='" + p + "' checked='checked' disabled/>";
HTML += "<label for='show-" + p + "' style='width: 200px'>" + p + "</label></div>";
if ((i + 1) % 4 == 0) {
HTML += "</br>";
}
}
document.getElementById("show-project-div").innerHTML = HTML;
$("#show-" + projectOrders[0] + "-div").attr("class", "ckbox ckbox-warning");
var interval = setInterval(function () {//查后台，展示数据
var cproject = $("#currentproject").val();
$.ajax({
url: 'getbuildmsg?messageid=' + obj.data.id + '&project=' + cproject,
type: 'POST',
dataType: 'json',
success: function (data3) {
var obj2 = eval("(" + data3 + ")");
var messagedata = obj2.data;
var currproject = messagedata.currentProject;
if (currproject != cproject) {
$("#currentproject").val(currproject);//更换当前的项目
$("#show-" + cproject + "-div").attr("class", "ckbox ckbox-success");
$("#show-" + currproject + "-div").attr("class", "ckbox ckbox-warning");
$("#resultArea").val("")
}
if (messagedata.message != "") {
var d = $("#resultArea").val();
$("#resultArea").val(d + messagedata.message);
var scrollTop = $("#resultArea")[0].scrollHeight;
$("#resultArea").scrollTop(scrollTop);
}
//code为2 ,则结束
var code = obj2.code;
var message = obj2.message;
if (code == 2) {
$("#submit-btn").show();
$("#cancel-btn").hide();
$("#show-" + cproject + "-div").attr("class", "ckbox ckbox-success");
document.getElementById("task-info-div").innerHTML = "<strong>'"+ message +"'</strong>";
clearInterval(interval);
}
},
error: function (e) {
alert("从后台获取数据出错");
}
});
}, 3000);
},
error: function (e) {
alert("从后台获取数据出错");
}
});
}
/**
* 取消
*/
function cancelBuild() {
$("#submit-btn").show();
$("#cancel-btn").hide();
var messageid = $("#messageid").val();
if (messageid != null && messageid != "") {
var jsondata = {"id": messageid};
$.ajax({
url: 'cancelBuild',
type: 'POST',
dataType: 'json',
data: jsondata,
success: function (data) {
if (data == "success") {
} else {
alert(data)
}
},
error: function (e) {
}
});
}
}
function getRollbackList() {
var project = $("input[name='project']:checked").val();
var environment = $("input[name='environments']:checked").val();
... ... @@ -401,43 +279,6 @@ function branchdefault() {
}
//function getmessage() {
// var messageid = $("#messageid").val();
// if(messageid != null && messageid != ""){
// var jsondata = {"messageid":messageid};
// $.ajax({
// url : 'getbuildmsg',
// type : 'POST',
// dataType : 'json',
// data : jsondata,
// success : function(data) {
// var d= $("#resultArea").val();
// $("#resultArea").val(d+data);
// var scrollTop = $("#resultArea")[0].scrollHeight;
// $("#resultArea").scrollTop(scrollTop);
//
// if(data.indexOf("Process Cancel") != -1){
// $("#messageid").val("");
// $("#submit-btn").show();
// $("#cancel-btn").hide();
// $("#exe_div").html("&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;任务已经取消");
// return false;
// }
//
// if(data.indexOf("@@@@@@@@@@@@@@") != -1){
// $("#messageid").val("");
// $("#exe_div").html("&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;任务执行结束");
// }
//
// },
// error : function(e) {
// }
// });
// }
// return false;
//}
... ...