diff --git a/monitor-ui-common/src/main/java/com/ui/contants/HttpUriContants.java b/monitor-ui-common/src/main/java/com/ui/contants/HttpUriContants.java
index 7a5b64c..97a33cc 100644
--- a/monitor-ui-common/src/main/java/com/ui/contants/HttpUriContants.java
+++ b/monitor-ui-common/src/main/java/com/ui/contants/HttpUriContants.java
@@ -7,6 +7,7 @@ public class HttpUriContants {
/*** 机组信息 ****/
public static final String HOST_GROUP_GETALL = "/hostGroup/getHostGroups";
+ public static final String HOST_GROUP_SAVE = "/hostGroup/saveHostGroup";
public static final String HOST_ALL_GROUPS = "/hostGroup/getAllGroups";
diff --git a/monitor-ui-ctrl/src/main/java/com/ui/ctrl/HostGroupCtrl.java b/monitor-ui-ctrl/src/main/java/com/ui/ctrl/HostGroupCtrl.java
index de7c55b..68edec6 100644
--- a/monitor-ui-ctrl/src/main/java/com/ui/ctrl/HostGroupCtrl.java
+++ b/monitor-ui-ctrl/src/main/java/com/ui/ctrl/HostGroupCtrl.java
@@ -31,7 +31,13 @@ public class HostGroupCtrl {
@ResponseBody
public BaseResponse getHostGroups(PageRequest req) {
BaseResponse response=httpRestClient.defaultPost(HttpUriContants.HOST_GROUP_GETALL, req, BaseResponse.class);
- System.out.println("*****************************"+ JSON.toJSON(response));
+ return response;
+ }
+
+ @RequestMapping("/saveHostGroup")
+ @ResponseBody
+ public BaseResponse saveHostGroup(String req) {
+ BaseResponse response = httpRestClient.defaultPost(HttpUriContants.HOST_GROUP_SAVE, req, BaseResponse.class);
return response;
}
diff --git a/monitor-ui-web/src/main/webapp/jsp/host/editHostGroup.jsp b/monitor-ui-web/src/main/webapp/jsp/host/editHostGroup.jsp
deleted file mode 100644
index c030319..0000000
--- a/monitor-ui-web/src/main/webapp/jsp/host/editHostGroup.jsp
+++ /dev/null
@@ -1,68 +0,0 @@
-<%@page language="java" contentType="text/html;charset=utf-8" %>
-<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
-<div id="breadcrumb">
- <a href="#" title="Go to Home" class="tip-bottom"><i
- class="icon-home"></i> Home</a> <a href="#" class="current">Tables</a>
-</div>
-
-<div class="container-fluid">
-
-
- <div class="widget-box">
- <div class="widget-title">
-
- <h5>Dynamic table</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">IP：</span>
- <input type="text" id="" class="form-control" placeholder=""/>
- </div>
- <div class="input-group" style="float: left;">
- <span class="input-group-addon">IP：</span>
- <input type="text" id="" class="form-control" placeholder=""/>
- </div>
- <button id="submit" class="btn btn-default">搜索</button>
- </div>
- <button id="addBtn" class="btn btn-primary" style="margin-top: 12px;margin-left: 900px;">新增</button>
- </div>
- </div>
- <div id="table">
-
-
- </div>
- </div>
- </div>
-</div>
-<script>
- $(function () {
- var data = [];
- for (var i = 0; i < 20; i++) {
- data.push({
- userId: i,
- userName: "用户" + i,
- status: i % 3 == 0 ? 0 : 1
- });
- }
- $("#table").table({
- striped: true,
- panelClass: "panel-success",
- pagination: true,
- columns: [{
- title: "用户id",
- field: "userId"
- }, {
- title: "用户名称",
- field: "userName"
- }, {
- title: "状态",
- field: "status"
- }],
- data: data
- });
- });
-</script>
diff --git a/monitor-ui-web/src/main/webapp/jsp/host/hostGroupList.jsp b/monitor-ui-web/src/main/webapp/jsp/host/hostGroupList.jsp
index 7efba00..66818bd 100644
--- a/monitor-ui-web/src/main/webapp/jsp/host/hostGroupList.jsp
+++ b/monitor-ui-web/src/main/webapp/jsp/host/hostGroupList.jsp
@@ -15,13 +15,33 @@
</div>
<div class="widget-content nopadding">
<div class="widget-title" style="height: 53px;">
- <div>
- <button id="addBtn" class="btn btn-primary" style="margin-top: 12px;margin-left: 900px;">新增</button>
- </div>
+ <div>
+ <a href="#" id="open-modal" class="btn btn-primary">新增主机组</a> </div>
</div>
<div id="hostGroupTable">
</div>
+ <div id="myModal" class="modal hide">
+ <div class="modal-header">
+ <button data-dismiss="modal" class="close" type="button">×</button>
+ <h3>Modal header</h3>
+ </div>
+ <div class="modal-body">
+ <label class="control-label">机组ID</label>
+ <div class="controls">
+ <input type="text" name="editGroupId"/>
+ </div>
+ <label class="control-label">机组名称</label>
+ <div class="controls">
+ <input type="text" name="editGroupName"/>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">关闭
+ </button>
+ <button type="button" id="submitBtn" class="btn btn-primary">提交</button>
+ </div>
+ </div>
</div>
</div>
</div>
@@ -58,11 +78,25 @@
},{
title : "操作",
- field : "op",
- width : "15%"
- }]
+ formatter : function(rowData) {
+ var div = $("<div>");
+ var editBtn = $("<button onclick='editHostGroup(rowData.id,rowData.groupName)'>").addClass("btn btn-xs btn-success").html("修改").appendTo(div);
+ div.append(" ");
+ var delBtn = $("<button onclick='deleteHostGroup(rowData.id)'>").addClass("btn btn-xs btn-danger").html("删除")
+ .appendTo(div);
+ delBtn.click(function() {
+
+ });
+ return div;
+ }
+ } ]
});
});
+
+ //打开新增或修改页面
+ function editHostGroup(id,groupName) {
+
+ }
</script>
\ No newline at end of file
diff --git a/monitor-ui-web/src/main/webapp/jsp/table.jsp b/monitor-ui-web/src/main/webapp/jsp/table.jsp
index a5df73e..0b88417 100644
--- a/monitor-ui-web/src/main/webapp/jsp/table.jsp
+++ b/monitor-ui-web/src/main/webapp/jsp/table.jsp
@@ -98,220 +98,9 @@
</script>
-<script>
- var treeData = [];
- var nodeId2id = function (nodeid) {
- if (nodeid == "#") {
- return 0;
- } else {
- return nodeid.split("_")[1];
- }
- };
-
- var getPath = function (nodeid) {
- var paths = [];
- var num = 0;
- var currentId = nodeid;
- while (currentId != "#") {
- var node = $("#jstree").jstree().get_node(currentId);
- console.log(node);
- paths.push(node.text);
- num++;
- currentId = node.parent
- }
-
- var strPath = "";
- for (var i = 0; i < num; i++) {
- strPath += paths.pop() + "/";
- }
-
- return strPath;
-
- }
-
- var openTree = function (node_id, level) {
-// console.log("open tree" + node_id);
- var node = $("#jstree").jstree().get_node(node_id);
- $("#jstree").jstree("open_node", node)
- var children = node.children;
-// console.log("open children" +children);
- if (level <= 1)
- return;
- level--;
- $.each(children, function (n, data) {
- openTree(data, level);
- });
- }
-
- var addType = function (node) {
- var rel = 0;
- var pid;
- var name;
- var isleaf;
- $('#modal_type_update').hide();
- $('#modal_type_del').hide();
- $('#modal_type_add').show();
- $('#myModalLabel').html("添加类型");
- $('#tx_type_id').val(nodeId2id(node.id));
- $('#tx_type_action').val("add");
- $('#tx_new_type_isleaf').val(1);
- $('#tx_new_type_parent').val(getPath(node.id));
-
- $('#myModal').modal({keyboard: true});
+<script type="text/javascript" src="<%=basePath %>/script/yoho.type.tree.js"></script>
- return rel;
- };
- var delType = function (id) {
- var rel = 0;
- $('#myModalLabel').html("确认删除?");
- $('#tx_type_action').val("del");
- $('#modal_type_update').hide();
- $('#modal_type_add').hide();
- $('#modal_type_del').show();
- $('#tx_type_id').val(nodeId2id(id));
- $('#myModal').modal({keyboard: true});
- return rel;
- };
- var updateType = function (id, oldName) {
- var rel = 0;
- $('#myModalLabel').html("更新类型");
- $('#tx_type_action').val("update");
- $('#tx_type_id').val(nodeId2id(id));
- $('#tx_update_type_name_old').val(oldName);
- $('#modal_type_update').show();
- $('#modal_type_add').hide();
- $('#modal_type_del').hide();
- $('#myModal').modal({keyboard: true});
- return rel;
- };
-
- var doAddType = function () {
- var pid = $('#tx_type_id').val();
- var name = $('#tx_new_type_name').val();
- var isleaf = 1;
- $.get("type/add", {"pid": pid, "name": name, "isleaf": isleaf},
- function (data, state) {
- $.toaster('添加成功', '添加', 'info');
- refreshTypeTree();
- }
- );
- }
- var doUpdateType = function () {
- var id = $('#tx_type_id').val();
- var name = $('#tx_update_type_name_new').val();
- console.log("update " + id + " name " + name);
- $.get("type/update", {"id": id, "name": name},
- function (data, state) {
- $.toaster('更新成功', '更新', 'info');
- refreshTypeTree();
- }
- );
- }
- var doDelType = function () {
- var id = $('#tx_type_id').val();
- console.log("delete " + id);
- $.get("type/del", {"id": id},
- function (data, state) {
- $('#jstree').jstree("delete_node", $("#" + id));
- }
- );
- }
- $("#btn4type").click(function () {
- console.log("frw");
- if ($("#tx_type_action").val() == "add") {
- doAddType();
- }
- else if ($("#tx_type_action").val() == "update") {
- doUpdateType();
- } else if ($("#tx_type_action").val() == "del") {
- doDelType();
- }
- $('#myModal').dialog('hide');
- });
-
-
- var refreshTypeTree = function () {
- console.log("refresh tree");
- treeData = []; //重置
- $.get("type/all", function (data, state) {
- console.log(state)
- var jsonData = JSON.parse(data);
- $.each(jsonData.data, function (n, val) {
- var treeNode = {};
- treeNode.id = "node_" + val.typeId;
- treeNode.parent = (val.typeParentId == 0 ? "#" : "node_" + val.typeParentId);
- treeNode.text = val.typeName;
- treeNode.data = val.typeIsLeaf;
- treeData.push(treeNode)
- })
- $('#jstree').jstree(true).settings.core.data = treeData;
- $('#jstree').jstree().refresh(true, true);
-
- setInterval("openTree('#', 3)", 300); //展开三层
- });
- }
-
- $(function () {
-
-
- $('#jstree').jstree({
- "plugins": ["themes", "checkbox", "contextmenu", "ui", "types", "crrm", "core", "status"],
- 'core': {
- "themes": {
- "icons": false
- },
- 'data': treeData,
- 'check_callback': true
- },
- 'contextmenu': {
- "select_node": false,
- "items": {
- "ADD": {
- "label": "添加类型",
- "action": function (obj) {
- var inst = jQuery.jstree.reference(obj.reference);
- var clickedNode = inst.get_node(obj.reference);
- console.log(obj);
- console.log(clickedNode);
- console.log("add operation--clickedNode's id is:" + clickedNode.id);
- addType(clickedNode);
- }
- }, "UPDATE": {
- "label": "修改类型",
- "action": function (obj) {
- var inst = jQuery.jstree.reference(obj.reference);
- var clickedNode = inst.get_node(obj.reference);
- updateType(clickedNode.id, clickedNode.text);
- }
- }, "DEL": {
- "label": "删除类型",
- "action": function (obj) {
- var inst = jQuery.jstree.reference(obj.reference);
- var clickedNode = inst.get_node(obj.reference);
- console.log("del operation--clickedNode's id is:" + clickedNode.id);
- delType(clickedNode.id);
- }
- }, "ADDM": {
- "label": "添加服务对象",
- "action": function (obj) {
- var inst = jQuery.jstree.reference(obj.reference);
- var clickedNode = inst.get_node(obj.reference);
- console.log(obj);
- addMObjType(clickedNode);
- }
- }
- }
- }
- }).bind("loaded.jstree", function (event, data) {
- openTree("#", 3); //展开三层
- });
-
- refreshTypeTree();
-
- });
-
-</script>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel" aria-hidden="true">
@@ -362,4 +151,4 @@
</div>
</div>
</div>
-</div>
\ No newline at end of file
+</div>
diff --git a/monitor-ui-web/src/main/webapp/script/yoho.type.tree.js b/monitor-ui-web/src/main/webapp/script/yoho.type.tree.js
new file mode 100644
index 0000000..a5ca12c
--- /dev/null
+++ b/monitor-ui-web/src/main/webapp/script/yoho.type.tree.js
@@ -0,0 +1,256 @@
+/**
+ * Created by frw on 2016/6/17.
+ */
+var treeData = [];
+var nodeId2id = function (nodeid) {
+ if (nodeid == "#") {
+ return 0;
+ } else {
+ return nodeid.split("_")[1];
+ }
+};
+
+var getPath = function (nodeid) {
+ var paths = [];
+ var num = 0;
+ var currentId = nodeid;
+ while (currentId != "#") {
+ var node = $("#jstree").jstree().get_node(currentId);
+ console.log(node);
+ paths.push(node.text);
+ num++;
+ currentId = node.parent
+ }
+
+ var strPath = "";
+ for (var i = 0; i < num; i++) {
+ strPath += paths.pop() + "/";
+ }
+
+ return strPath;
+}
+
+var openTree = function (node_id, level) {
+// console.log("open tree" + node_id);
+ var node = $("#jstree").jstree().get_node(node_id);
+ $("#jstree").jstree("open_node", node)
+ var children = node.children;
+// console.log("open children" +children);
+ if (level <= 1)
+ return;
+ level--;
+ $.each(children, function (n, data) {
+ openTree(data, level);
+ });
+}
+
+var addType = function (node) {
+ var rel = 0;
+ var pid;
+ var name;
+ var isleaf;
+ $('#modal_type_update').hide();
+ $('#modal_type_del').hide();
+ $('#modal_type_add').show();
+ $('#myModalLabel').html("添加类型");
+ $('#tx_type_id').val(nodeId2id(node.id));
+ $('#tx_type_action').val("add");
+ $('#tx_new_type_isleaf').val(1);
+ $('#tx_new_type_parent').val(getPath(node.id));
+
+ $('#myModal').modal({keyboard: true});
+
+ return rel;
+};
+var delType = function (id) {
+ var rel = 0;
+ $('#myModalLabel').html("确认删除?");
+ $('#tx_type_action').val("del");
+ $('#modal_type_update').hide();
+ $('#modal_type_add').hide();
+ $('#modal_type_del').show();
+ $('#tx_type_id').val(nodeId2id(id));
+ $('#myModal').modal({keyboard: true});
+ return rel;
+};
+var updateType = function (id, oldName) {
+ var rel = 0;
+ $('#myModalLabel').html("更新类型");
+ $('#tx_type_action').val("update");
+ $('#tx_type_id').val(nodeId2id(id));
+ $('#tx_update_type_name_old').val(oldName);
+ $('#modal_type_update').show();
+ $('#modal_type_add').hide();
+ $('#modal_type_del').hide();
+ $('#myModal').modal({keyboard: true});
+
+ return rel;
+};
+
+
+var addMObjType = function (nodeid, name) {
+ var id = nodeId2id(nodeid); //服务对象id
+ var path = getPath(nodeid); //服务对象完整类型路径
+
+ console.log("id: " + id + " path: " + path + " name :" + name);
+ //TODO 打开新增服务对象对话框
+
+
+}
+
+
+var doAddType = function () {
+ var pid = $('#tx_type_id').val();
+ var name = $('#tx_new_type_name').val();
+ var isleaf = 1;
+ $.get("type/add", {"pid": pid, "name": name, "isleaf": isleaf},
+ function (data, state) {
+ $.toaster('添加成功', '添加', 'info');
+ refreshTypeTree();
+ }
+ );
+}
+var doUpdateType = function () {
+ var id = $('#tx_type_id').val();
+ var name = $('#tx_update_type_name_new').val();
+ console.log("update " + id + " name " + name);
+ $.get("type/update", {"id": id, "name": name},
+ function (data, state) {
+ $.toaster('更新成功', '更新', 'info');
+ refreshTypeTree();
+ }
+ );
+}
+var doDelType = function () {
+ var id = $('#tx_type_id').val();
+ console.log("delete " + id);
+ $.get("type/del", {"id": id},
+ function (data, state) {
+ $('#jstree').jstree("delete_node", $("#" + id));
+ }
+ );
+}
+
+
+/**
+ * 获取所有选择节点
+ * @param isleaf true:仅获取叶子节点;false:所有节点
+ * @returns {Array}
+ */
+var getSelectType = function (isleaf) {
+ var seltypes = [];
+ $.each($("#jstree").jstree('get_selected'), function (idx, nodeid) {
+ var node = $('#jstree').jstree().get_node(nodeid);
+ if (isleaf == true && node.data != 1)
+ return;
+ seltypes.push(nodeId2id(nodeid));
+ });
+
+ return seltypes;
+
+}
+
+
+/**
+ * 检查节点是否子节点
+ * @param nodeid
+ * @returns {boolean}
+ */
+var checkIsLeaf = function (nodeid) {
+ var node = $('#jstree').jstree().get_node(nodeid);
+ var isLeaf = node.data == 1 ? true : false;
+ return isLeaf;
+}
+
+
+$("#btn4type").click(function () {
+ console.log("frw");
+ if ($("#tx_type_action").val() == "add") {
+ doAddType();
+ }
+ else if ($("#tx_type_action").val() == "update") {
+ doUpdateType();
+ } else if ($("#tx_type_action").val() == "del") {
+ doDelType();
+ }
+ $('#myModal').dialog('hide');
+});
+
+
+var refreshTypeTree = function () {
+ console.log("refresh tree");
+ treeData = []; //重置
+ $.get("type/all", function (data, state) {
+ console.log(state)
+ var jsonData = JSON.parse(data);
+ $.each(jsonData.data, function (n, val) {
+ var treeNode = {};
+ treeNode.id = "node_" + val.typeId;
+ treeNode.parent = (val.typeParentId == 0 ? "#" : "node_" + val.typeParentId);
+ treeNode.text = val.typeName;
+ treeNode.data = val.typeIsLeaf;
+ treeData.push(treeNode)
+ })
+ $('#jstree').jstree(true).settings.core.data = treeData;
+ $('#jstree').jstree().refresh(true, true);
+
+ setInterval("openTree('#', 3)", 300); //展开三层
+ });
+}
+
+$(function () {
+ $('#jstree').jstree({
+ "plugins": ["themes", "checkbox", "contextmenu", "ui", "types", "crrm", "core", "status"],
+ 'core': {
+ "themes": {
+ "icons": false
+ },
+ 'data': treeData,
+ 'check_callback': true
+ },
+ 'contextmenu': {
+ "select_node": false,
+ "items": {
+ "ADD": {
+ "label": "添加类型",
+ "action": function (obj) {
+ var inst = jQuery.jstree.reference(obj.reference);
+ var clickedNode = inst.get_node(obj.reference);
+ console.log(obj);
+ console.log(clickedNode);
+ console.log("add operation--clickedNode's id is:" + clickedNode.id);
+ addType(clickedNode);
+ }
+ }, "UPDATE": {
+ "label": "修改类型",
+ "action": function (obj) {
+ var inst = jQuery.jstree.reference(obj.reference);
+ var clickedNode = inst.get_node(obj.reference);
+ updateType(clickedNode.id, clickedNode.text);
+ }
+ }, "DEL": {
+ "label": "删除类型",
+ "action": function (obj) {
+ var inst = jQuery.jstree.reference(obj.reference);
+ var clickedNode = inst.get_node(obj.reference);
+ console.log("del operation--clickedNode's id is:" + clickedNode.id);
+ delType(clickedNode.id);
+ }
+ }, "ADDM": {
+ "label": "添加服务对象",
+ "action": function (obj) {
+ var inst = jQuery.jstree.reference(obj.reference);
+ var clickedNode = inst.get_node(obj.reference);
+ console.log("add minfo--clickedNode's id is : " + clickedNode.id);
+ addMObjType(clickedNode.id, clickedNode.text);
+ }
+ }
+ }
+ }
+ }).bind("loaded.jstree", function (event, data) {
+ openTree("#", 3); //展开三层
+ });
+
+ refreshTypeTree();
+
+});
\ No newline at end of file