Skip to content

Commit 5c2f785

Browse files
vominhquocvominhquoc
committed
add chart
0 parents  commit 5c2f785

File tree

690 files changed

+775450
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

690 files changed

+775450
-0
lines changed

‎.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
bower_components

‎.idea/DemoDeck.iml

+8
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎.idea/copyright/profiles_settings.xml

+3
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎.idea/modules.xml

+8
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎.idea/workspace.xml

+328
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎README

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
npm install -g bower
2+
bower install

‎bower.json

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
{
2+
"name": "DemoDeck",
3+
"homepage": "https://github.com/vominhquoc/DAGK_Angular",
4+
"authors": [
5+
"vominhquoc <[email protected]>"
6+
],
7+
"description": "",
8+
"main": "",
9+
"license": "MIT",
10+
"ignore": [
11+
"**/.*",
12+
"node_modules",
13+
"bower_components",
14+
"test",
15+
"tests"
16+
],
17+
"dependencies": {
18+
"angular": "^1.5.8",
19+
"bootstrap": "^3.3.7",
20+
"lodash": "^4.16.6"
21+
}
22+
}

‎index.html

+114
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
<!DOCTYPE html>
2+
<html lang="en" data-ng-app="test">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>DEMO</title>
6+
<link rel="stylesheet" href="js/kendo-ui/styles/kendo.common.min.css" />
7+
<link rel="stylesheet" href="js/kendo-ui/styles/kendo.default.min.css" />
8+
<link rel="stylesheet" href="js/kendo-ui/styles/kendo.default.mobile.min.css" />
9+
<link rel="stylesheet" href="js/getorgchart/getorgchart.css" />
10+
<style>
11+
.get-org-chart .get-left,
12+
.get-org-chart .get-right,
13+
.get-org-chart .get-up, .get-down,
14+
.get-org-chart .get-oc-tb,
15+
g[data-btn-action]{
16+
display: none !important;
17+
}
18+
.get-box:hover{
19+
fill: red;
20+
}
21+
</style>
22+
</head>
23+
<body data-ng-controller="testCtrl">
24+
<div id="chart"
25+
kendo-tooltip
26+
k-target="'#chart'"
27+
k-filter="'g[data-node-id]'"
28+
k-content= "'theContent'"
29+
>
30+
</div>
31+
<ul data-ng-if="isChartRendered"
32+
kendo-context-menu
33+
k-target="'#chart'"
34+
k-filter="'g[data-node-id]'"
35+
k-on-select="onSelect(kendoEvent)">
36+
<li data-tag="add">Add Child</li>
37+
<li data-tag="copy">Copy</li>
38+
<li data-tag="delete">Delete</li>
39+
</ul>
40+
<script src="bower_components/lodash/dist/lodash.js"></script>
41+
<script src="js/jquery.js"></script>
42+
<script src="bower_components/angular/angular.js"></script>
43+
<script src="js/kendo-ui/kendo.all.js"></script>
44+
<script src="js/getorgchart/getorgchart.js"></script>
45+
<script>
46+
var app = angular.module('test', ['kendo.directives']);
47+
app.controller('testCtrl', function($scope, $timeout){
48+
$scope.generateId = function(){
49+
return new Date().getUTCMilliseconds();
50+
};
51+
$scope.dataSource = [
52+
{ id: $scope.generateId(), parentId: null, Name: 'Root Item'}
53+
];
54+
$scope.onSelect = function(e) {
55+
var command = $(e.item).data('tag');
56+
var nodeId = $(e.target).data('nodeId');
57+
switch (command.toUpperCase()){
58+
case "ADD":
59+
{
60+
var newNode = { id: $scope.generateId(), parentId: nodeId, Name: "New Item"};
61+
$scope.dataSource.push(newNode);
62+
}
63+
break;
64+
65+
case "DELETE":
66+
{
67+
function _deleteRecusive(nodeId){
68+
for(var i=0; i<$scope.dataSource.length; ++i){
69+
var node = $scope.dataSource[i];
70+
if(node.id === nodeId) {
71+
$scope.dataSource.splice(i, 1);
72+
--i;
73+
}
74+
else if(node.parentId === nodeId){
75+
_deleteRecusive(node.id);
76+
$scope.dataSource.splice(i, 1);
77+
--i;
78+
}
79+
}
80+
}
81+
_deleteRecusive(nodeId);
82+
}
83+
break;
84+
85+
case "COPY":
86+
{
87+
var index = _.findIndex($scope.dataSource, {id: nodeId});
88+
var newNode = { id: $scope.generateId(), parentId: $scope.dataSource[index].parentId, Name: "Copy Item"};
89+
$scope.dataSource.push(newNode);
90+
}
91+
break;
92+
}
93+
if(!$scope.dataSource.length)
94+
$scope.dataSource = [{}];
95+
$scope.renderChart();
96+
};
97+
$scope.renderChart = function(){
98+
var chart = new getOrgChart($scope.$chart, {
99+
siblingSeparation: 150,
100+
orientation: getOrgChart.RO_TOP_PARENT_LEFT,
101+
enableEdit: false,
102+
dataSource: angular.copy($scope.dataSource)
103+
});
104+
};
105+
106+
$timeout(function() {
107+
$scope.$chart = document.getElementById('chart');
108+
$scope.renderChart();
109+
$scope.isChartRendered = true;
110+
});
111+
});
112+
</script>
113+
</body>
114+
</html>

‎js/getorgchart/getorgchart.css

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)