java_restart.jsp 10.1 KB
<%@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 + "/";

    String api_type = request.getParameter("api_type");
    if (api_type == null)
        api_type = "0";
%>

<!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 %>';
        var api_type = "<%=api_type %>";
    </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> 关键切换</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>

                        <button id="awsRestart" class="btn btn-primary" style="margin-top: 12px;margin-left: 100px;"
                                onclick="restart('all','aws')">
                            aws重启
                        </button>
                        &nbsp;
                        <button id="qcloudRestart" class="btn btn-primary" style="margin-top: 12px;margin-left: 100px;"
                                onclick="restart('all','qcloud')">
                            qq重启
                        </button>
                        &nbsp;
                        <button id="allRestart" class="btn btn-primary" style="margin-top: 12px;margin-left: 100px;"
                                onclick="restart('all','mix')">
                            所有重启
                        </button>
                    </div>
                </div>
                <div id="infoTable">

                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script src="<%=basePath %>script/common/genarate_left_panel.js"></script>
<script>
    $("#li_switch").addClass("active open");
    $("#li_javarestart").addClass("active");</script>
<script>
    var table_data;
    $(function () {
        var tableParam = {
            columnAutoWidth: false,
            url: contextPath + "/javaRestart/query",
            striped: true,
            title: "java服务进程列表",
            dataType: "json",
            pagination: true,
            pageSize: 10,
            loadFilter: function (data) {
                return defaultLoadFilter(data);
            },
            onLoadSuccess: function (data) {
//                console.log(data);
                table_data = data;
                setStatus();
            },
            columns: [{
                title: "项目名称",
                field: "name",
                width: "10%"
            }, {
                title: "aws",
                field: "name",
                formatter: function (value, rowData, rowIndex) {
                    var div = $("<div >").attr('id', 'aws_' + rowData.name);
                    return div;
                },
                width: "35%"
            }, {
                title: "qcloud",
                field: "name",
                formatter: function (value, rowData, rowIndex) {
                    var div = $("<div >").attr('id', 'qcloud_' + rowData.name);
                    return div;
                },
                width: "35%"

            }, {
                title: "操作",
                field: "op",
                formatter: function (value, rowData, rowIndex) {
                    var div = $("<div>");
                    $("<button onclick=\"restart(\'" + rowData.name + "\',\'aws\')\">").addClass("btn btn-xs btn-primary").html("aws重启").appendTo(div);
                    div.append("&nbsp;");
                    $("<button onclick=\"restart(\'" + rowData.name + "\',\'qcloud\')\">").addClass("btn btn-xs btn-primary").html("qq重启").appendTo(div);
                    div.append("&nbsp;");
                    $("<button onclick=\"restart(\'" + rowData.name + "\',\'mix\')\">").addClass("btn btn-xs btn-primary").html("全部重启").appendTo(div);
                    return div;
                },
                width: "20%"
            }]
        };

        //加载表格
        $("#infoTable").table(tableParam);
    });

    function setStatus() {
        if (table_data == null || table_data.rows == undefined)
            return;

        $.each(table_data.rows, function (idx, val) {
            createJavaAppDiv(val.name);
        });
    }

    var createJavaAppDiv = function (name) {
        $.ajax({
            type: 'post',
            url: contextPath + "/javaRestart/getProjectStatus?project=" + name,
            dataType: 'json',
            success: function (resp) {
                if (!resp || resp.code != 200) {
                    return;
                }
                var aws_div = $("<div>");
                var qcloud_div = $("<div>");

                $.each(resp.data, function (idx, val) {
                    var span;
                    span = $("<button class='btn btn-default btn-xs has-popover' >").attr("id", "span_" + name + "_" + val.ip).html(val.ip);
                    span.attr("data-toggle", "popover");
                    span.attr("data-placement", "bottom");
                    span.attr("data-html", "true");
                    span.attr("data-content", val.lastStart);
                    if(val.status == "1"){
                        span.addClass('btn-success');
                    }else{
                        span.addClass('btn-danger');
                    }
                    if(val.cloud == "aws"){
                        aws_div.append(span);
                    }else{
                        qcloud_div.append(span);
                    }
                    span.popover({
                        delay: {"show": 500, "hide": 100}
                        //  container: 'tip_well'
                    });
                });

                $("#aws_" + name).html("");
                $("#aws_" + name).append(aws_div);

                $("#qcloud_" + name).html("");
                $("#qcloud_" + name).append(qcloud_div);
            },
            error: function (data) {
                layer.msg("异常", {icon: 2});
            }
        });
    }


    function restart(project, cloud) {

    }
</script>