From 157865388bfc38a97df32a9f24f8d6c7583a1498 Mon Sep 17 00:00:00 2001
From: FengRuwei <fruwei@163.com>
Date: Thu, 16 Jun 2016 19:17:53 +0800
Subject: [PATCH] tree 增删改
---
monitor-ui-common/src/main/java/com/ui/contants/HttpUriContants.java | 7 ++++++-
monitor-ui-ctrl/src/main/java/com/ui/ctrl/TypeCtrl.java | 91 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
monitor-ui-web/src/main/webapp/jsp/table.jsp | 189 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-------------------------------------------
3 files changed, 243 insertions(+), 44 deletions(-)
create mode 100644 monitor-ui-ctrl/src/main/java/com/ui/ctrl/TypeCtrl.java
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 9a0c96b..4f7c27c 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
@@ -9,6 +9,11 @@ public class HttpUriContants {
public static final String HOST_GROUP_GETALL = "/hostGroup/getHostGroups";
/*** 机组信息 ****/
- public static String GET_ALL_TYPE = "/type/query";
+
+ //类型信息
+ public static String TYPE_GET_ALL = "/type/query";
+ public static String TYPE_ADD = "/type/add";
+ public static String TYPE_DEL = "/type/delete";
+ public static String TYPE_UPDATE = "/type/update";
}
diff --git a/monitor-ui-ctrl/src/main/java/com/ui/ctrl/TypeCtrl.java b/monitor-ui-ctrl/src/main/java/com/ui/ctrl/TypeCtrl.java
new file mode 100644
index 0000000..5ecf9d5
--- /dev/null
+++ b/monitor-ui-ctrl/src/main/java/com/ui/ctrl/TypeCtrl.java
@@ -0,0 +1,91 @@
+package com.ui.ctrl;
+
+import com.alibaba.fastjson.JSONObject;
+import com.ui.contants.HttpUriContants;
+import com.ui.http.HttpRestClient;
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Controller;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestParam;
+import org.springframework.web.bind.annotation.ResponseBody;
+
+/**
+ * Created by fruwei on 2016/6/16.
+ */
+@Controller
+@RequestMapping("type")
+public class TypeCtrl {
+ Logger logger = LoggerFactory.getLogger(TypeCtrl.class);
+
+ @Autowired
+ private HttpRestClient httpClient;
+
+ @RequestMapping("/all")
+ @ResponseBody
+ public String getAllType() {
+ String strType = "";
+
+ logger.debug("get all type");
+
+ strType = httpClient.defaultGet(HttpUriContants.TYPE_GET_ALL, String.class);
+
+ logger.info("all type: {}", strType);
+
+ return strType;
+ }
+
+
+ @RequestMapping("/add")
+ @ResponseBody
+ public String addType(@RequestParam String name, @RequestParam int pid, @RequestParam int isleaf) {
+
+ String rel;
+ logger.info("add type name:{},pid:{},isLeaf{}", name, pid, isleaf);
+
+ JSONObject req=new JSONObject();
+ req.put("typeName",name);
+ req.put("typeParentId",pid);
+ req.put("typeIsLeaf",isleaf);
+
+ rel = httpClient.defaultPost(HttpUriContants.TYPE_ADD, req,String.class);
+
+ logger.info("all type: {}", rel);
+
+
+
+ return rel;
+ }
+
+
+ @RequestMapping("/del")
+ @ResponseBody
+ public String delType(@RequestParam int id) {
+ String rel = "";
+ logger.info("update type id {} ", id);
+ rel = httpClient.defaultGet(HttpUriContants.TYPE_DEL+"/"+id,String.class);
+ logger.info("update type: {}", rel);
+ return "ok";
+ }
+
+
+ @RequestMapping("/update")
+ @ResponseBody
+ public String updateType(@RequestParam int id, @RequestParam String name) {
+ String rel = "";
+
+ logger.info("update type id {} ,name {}", id, name);
+
+ JSONObject req=new JSONObject();
+
+ req.put("typeId",id);
+ req.put("typeName",name);
+
+ rel = httpClient.defaultPost(HttpUriContants.TYPE_UPDATE, req,String.class);
+ logger.info("update type: {}", rel);
+
+ return rel;
+ }
+
+}
diff --git a/monitor-ui-web/src/main/webapp/jsp/table.jsp b/monitor-ui-web/src/main/webapp/jsp/table.jsp
index 8bb2182..3da5f29 100644
--- a/monitor-ui-web/src/main/webapp/jsp/table.jsp
+++ b/monitor-ui-web/src/main/webapp/jsp/table.jsp
@@ -20,7 +20,6 @@
<!-- 树 -->
<div style="margin-top: 45px; float: left;margin-top: 54px;border: dashed;width: 300px;color: #D3D3D3;height: 580px;">
<div class="widget-title">
-
<h5>Tree Title</h5>
</div>
<ul class="ui-widget ui-helper-clearfix" id="icons" style="float: left;margin-left: 165px;">
@@ -31,8 +30,8 @@
<li title=".ui-icon-minusthick" class="ui-state-default ui-corner-all" onclick="editbtn()"><span
class="ui-icon ui-icon-minusthick"></span></li>
</ul>
- <div id="continer"></div>
- <div id="jstree"></div>
+ <div id="jstree" class="jstree jstree-default jstree-default-small" role="tree" aria-multiselectable="true"
+ tabindex="0" style="height: 400px"></div>
</div>
<!-- 列表 -->
<div class="widget-content nopadding" style="margin-left: 300px;">
@@ -107,10 +106,6 @@
});
-
-
-
-
var dom = document.getElementById("icons");
var str = dom.getAttribute("style");
str = str.replace(/height\b\s*\:\s*\d+\px;?/ig, "");
@@ -126,82 +121,149 @@
<script>
var treeData = [];
- var addType = function (id, pid, name, isleaf) {
+ var addType = function (node) {
var rel = 0;
+ var pid;
+ var name;
+ var isleaf;
+ $('#modal_type_update').hide();
+ $('#modal_type_add').show();
- $.get("type/add",
- {
- "id": id, "pid": pid, "name": name, "isleaf": isleaf
- }
- ,
- function (data, state) {
+ $('#tx_type_id').val(node.id);
+ $('#tx_type_action').val("add");
+ $('#tx_new_type_isleaf').val(1);
+ $('#tx_new_type_parent').val(node.id);
- }
- );
+ $('#myModal').modal({keyboard: true});
return rel;
};
- var delType = function () {
+ var delType = function (id) {
var rel = 0;
- $.get("type/del", function (data, state) {
-
-
- });
+ $('#tx_type_action').val("del");
+ $('#modal_type_update').hide();
+ $('#modal_type_add').hide();
+ $('#tx_type_id').val(id);
+ $('#myModal').modal({keyboard: true});
+ $.get("type/del",
+ {"id": id},
+ function (data, state) {
+ });
return rel;
};
- var updateType = function () {
+ var updateType = function (id, oldName) {
var rel = 0;
-
+ $('#tx_type_action').val("update");
+ $('#tx_type_id').val(id);
+ $('#tx_update_type_name_old').val(oldName);
+ $('#modal_type_update').show();
+ $('#modal_type_add').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) {
+
+
+ }
+ );
+ }
+ 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) {
+
+
+ }
+ );
+ }
+ var doDelType = function () {
+ var id = $('#tx_type_id').val();
+ console.log("delete "+id);
+ $.get("type/del",
+ {"id": id},
+ function (data, state) {
+
+ }
+ );
+ }
+ $("#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');
+ });
+
$(function () {
$.get("type/all", function (data, state) {
- console.log(state)
+// console.log(state)
console.log(data);
var jsonData = JSON.parse(data);
- treeData=[]; //重置
+ treeData = []; //重置
$.each(jsonData, function (n, val) {
var treeNode = {};
treeNode.id = "" + val.typeId;
treeNode.parent = "" + (val.typeParentId == 0 ? "#" : val.typeParentId);
treeNode.text = val.typeName;
+ treeNode.isleaf = val.typeIsLeaf;
treeData.push(treeNode)
})
$('#jstree').jstree({
- "plugins": ["themes", "checkbox", "contextmenu", "ui", "types"],
+ "plugins": ["themes", "checkbox", "contextmenu", "ui", "types", "crrm", "core"],
'core': {
"themes": {
"icons": false
},
- 'data': treeData
+ 'data': treeData,
+ 'check_callback': true
},
'contextmenu': {
"items": {
"ADD": {
- "label": "ADD",
+ "label": "添加",
"action": function (obj) {
var inst = jQuery.jstree.reference(obj.reference);
var clickedNode = inst.get_node(obj.reference);
- alert("add operation--clickedNode's id is:" + clickedNode.id);
+ console.log(obj);
+ console.log(clickedNode);
+ console.log("add operation--clickedNode's id is:" + clickedNode.id);
+ addType(clickedNode);
}
}, "DEL": {
- "label": "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);
- addType()
+ delType(clickedNode.id);
+ $('#jstree').jstree("delete_node", clickedNode);
}
}, "UPDATE": {
- "label": "UPDATE",
+ "label": "修改",
"action": function (obj) {
var inst = jQuery.jstree.reference(obj.reference);
var clickedNode = inst.get_node(obj.reference);
- alert("update operation--clickedNode's id is:" + clickedNode.id);
+ updateType(clickedNode.id, clickedNode.text);
}
}
}
@@ -209,19 +271,60 @@
}).bind("loaded.jstree", function (event, data) {
$(this).jstree("open_all");
});
-
-// .bind("select_node.jstree", function(event, data) {
-//
-// var evt = window.event || event;
-// var button = evt.which || evt.button;
-// console.log("fdfdfdf"+button);
-// if( button != 1 ) return false;
-//
-// })
});
});
-</script>
\ No newline at end of file
+</script>
+
+<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
+ aria-labelledby="myModalLabel" aria-hidden="true">
+ <div class="modal-dialog">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close"
+ data-dismiss="modal" aria-hidden="true">
+ ×
+ </button>
+ <h4 class="modal-title" id="myModalLabel">
+ 添加类型
+ </h4>
+ </div>
+ <div class="modal-body" style="height: 200px">
+ <input type="hidden" id="tx_type_action"/>
+ <input type="hidden" id="tx_type_id"/>
+
+ <div id="modal_type_add">
+ <div class="input-group" style="float: left;">
+ <span class="input-group-addon">Name：</span>
+ <input type="text" id="tx_new_type_name" class="form-control" placeholder=""/>
+ </div>
+ <div class="input-group" style="float: left;">
+ <span class="input-group-addon">父节点：</span>
+ <input type="text" id="tx_new_type_parent" class="form-control" placeholder=""/>
+ </div>
+ <div class="input-group" style="float: left;">
+ <span class="input-group-addon">是否叶子节点：</span>
+ <input type="text" id="tx_new_type_isleaf" class="form-control" placeholder=""/>
+ </div>
+ </div>
+ <div id="modal_type_update">
+ <div class="input-group" style="float: left;">
+ <span class="input-group-addon">原名称：</span>
+ <input type="text" id="tx_update_type_name_old" class="form-control" placeholder=""/>
+ </div>
+ <div class="input-group" style="float: left;">
+ <span class="input-group-addon">新名称：</span>
+ <input type="text" id="tx_update_type_name_new" class="form-control" placeholder=""/>
+ </div>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
+ <button type="button" id="btn4type" class="btn btn-primary">确认</button>
+ </div>
+ </div>
+ </div>
+</div>
\ No newline at end of file
--
libgit2 0.24.0