lxy/lxy-kit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

.

Browse Source
This commit is contained in:
lxyer
2019-03-13 16:03:59 +08:00
commit ca2f3f4822
224 changed files with 56136 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
root/res/zui/lib/treemap/zui.treemap.css Normal file
View File

@@ -0,0 +1,120 @@
/*!
* ZUI: 树形图 - v1.8.1 - 2018-01-18
* http://zui.sexy
* GitHub: https://github.com/easysoft/zui.git
* Copyright (c) 2018 cnezsoft.com; Licensed MIT
*/
.treemap-data {
text-align: left;
}
.treemap-nodes {
position: relative;
display: table;
padding: 10px;
margin-right: auto;
margin-left: auto;
text-align: center;
-webkit-user-select: none;
-moz-user-select: none;
}
.treemap-node {
display: table-cell;
vertical-align: top;
}
.treemap-node-wrapper {
position: relative;
z-index: 5;
display: inline-block;
padding: 5px 10px;
border: 1px solid #808080;
border-radius: 1px;
}
a.treemap-node-wrapper {
color: #353535;
cursor: pointer;
}
a.treemap-node-wrapper:active,
a.treemap-node-wrapper:focus,
a.treemap-node-wrapper:hover {
color: #3280fc;
text-decoration: none;
background-color: #ebf2f9;
border-color: #3280fc;
}
.treemap-node-root > .treemap-node-wrapper {
background-color: rgba(0, 0, 0, .1);
}
.treemap-node-children {
display: table;
margin-top: 20px auto 0;
}
.treemap-line-top,
.treemap-line-bottom {
position: absolute;
top: 100%;
left: 50%;
margin-left: -1px;
border-right: none!important;
border-bottom: none!important;
}
.treemap-line-top {
top: 0;
}
.treemap-node > .treemap-line {
position: absolute;
right: 0;
left: 0;
z-index: 1;
border-right: none!important;
border-bottom: none!important;
}
.treemap-node-fold-icon {
position: absolute;
top: -6px;
left: -5px;
z-index: 10;
display: block!important;
width: 10px;
height: 10px;
line-height: 10px;
color: #808080;
background-color: #fff;
border-radius: 5px;
opacity: 0;
-webkit-transition: opacity .2s, -webkit-transform .1s;
-o-transition: opacity .2s, -o-transform .1s;
transition: opacity .2s, -webkit-transform .1s;
transition: opacity .2s, transform .1s;
transition: opacity .2s, transform .1s, -webkit-transform .1s, -o-transform .1s;
}
.treemap-node-fold-icon:before {
min-width: 10px;
content: '\e6f2';
}
.treemap-node-wrapper:hover .treemap-node-fold-icon {
opacity: 1;
}
.treemap-node.collapsed > .treemap-line,
.treemap-node.collapsed .treemap-line-bottom {
border-color: transparent!important;
}
.treemap-node.collapsed > .treemap-node-children {
display: none;
}
.treemap-node.collapsed .treemap-node-fold-icon {
top: -6px;
color: #808080;
opacity: 1;
-webkit-transform: none!important;
-ms-transform: none!important;
-o-transform: none!important;
transform: none!important;
}
.treemap-node.collapsed .treemap-node-fold-icon:before {
content: '\e6f1';
}
.treemap-node.tree-node-collapsing > .treemap-line,
.treemap-node.tree-node-collapsing > .treemap-node-children {
visibility: hidden;
}

415
root/res/zui/lib/treemap/zui.treemap.js Normal file
View File

@@ -0,0 +1,415 @@
/*!
* ZUI: 树形图 - v1.8.1 - 2018-01-18
* http://zui.sexy
* GitHub: https://github.com/easysoft/zui.git
* Copyright (c) 2018 cnezsoft.com; Licensed MIT
*/
/* ========================================================================
* ZUI: treemap.js
* http://zui.sexy
* ========================================================================
* Copyright (c) 2014-2016 cnezsoft.com; Licensed MIT
* ======================================================================== */
// Tree map data format
// {
// text: main text,
// html: main text as html format
// style: node style,
// textColor: text color,
// color: background color
// border: border style,
// cableWidth: 2,
// cableColor: '#808080'
// cableStyle: 'solid'
// }
(function($, window, document, Math, undefined) {
'use strict';
var NAME = 'zui.treemap',
DEFAULTS = {
data: [],
// direction: 'bottom', // or 'top', 'left', 'right'
cableWidth: 1,
cableColor: '#808080',
cableStyle: 'solid',
rowSpace: 30,
nodeSpace: 20,
listenNodeResize: true,
nodeTemplate: '<div class="treemap-node"><a class="treemap-node-wrapper"></a></div>',
foldable: true,
clickNodeToFold: true,
// sort: false, // Boolean or function
// tooltip: null,
// nodeStyle: null,
};
// var DEFAULT_NODE = {
// id: uuid(), // uuid
// text: '', // main text,
// html: '', // main text as html format
// style: null, // node element style
// textColor: '', // text color
// color: '', // background color
// border: '', // border style,
// tooltip: '' // node caption
// attrs: null // attrs
// title: '' // node title
// tooltip: '' // node tooltip
// };
var getDataFromUlList = function($list) {
return $list.children('li,.treemap-data-item').map(function() {
var $item = $(this),
item = $item.data(),
$text = $item.children('.text'),
$html = $item.children('.content'),
$children = $item.children('ul,.treemap-data-list');
if($text.length) item.text = $text.text();
if($html.length) item.html = $html.html();
if($children.length) {
item.children = getDataFromUlList($children);
}
if(!item.text && !item.html) {
var $content = $item.children(':not(ul,.treemap-data-list)');
var $itemClone = $item.clone();
$itemClone.find('ul,.treemap-data-list').remove();
if(!$content.length) {
item.text = $itemClone.text();
} else {
item.html = $itemClone.html();
}
}
return item;
}).get();
};
var Treemap = function(element, options) {
var $element = $(element);
if($.isArray(options)) {
options = {data: options};
}
options = $.extend({}, DEFAULTS, $element.data(), options);
var data = options.data || [];
if(!data.length) {
var $dataList = $element.children('.treemap-data');
if($dataList.length) {
data = getDataFromUlList($dataList.hide());
}
}
var $nodes = $element.children('.treemap-nodes');
if(!$nodes.length) {
$nodes = $('<div class="treemap-nodes" unselectable="on"/>').appendTo($element);
}
var that = this;
that.$ = $element;
that.$nodes = $nodes;
that.data = $.isArray(data) ? data : [data];
that.options = options;
that.offsetX = 0;
that.offsetY = 0;
that.scale = options.scale || 1;
// Bind events
that.render();
$nodes.on('resize', '.treemap-node-wrapper', function() {
that.delayDrawLines();
});
if(options.foldable) {
$nodes.on('click', options.clickNodeToFold ? '.treemap-node-wrapper' : '.treemap-node-fold-icon', function() {
that.toggle($(this).closest('.treemap-node'));
});
}
$nodes.on('click', '.treemap-node-wrapper', function() {
var $node = $(this).closest('.treemap-node');
that.callEvent('onNodeClick', $node.data('node'));
});
};
Treemap.prototype.toggle = function($node, toggle, ignoreAnimation) {
var that = this;
if(typeof $node === 'boolean') {
toggle = $node;
$node = null;
}
if(!$node) {
$node = that.$nodes.children('.treemap-node').first();
}
if($node)
{
if($node.data('node').foldable === false) {
return;
}
if(toggle === undefined) {
toggle = $node.hasClass('collapsed');
}
$node.toggleClass('collapsed', !toggle).find('[data-toggle="tooltip"]').tooltip('hide');
if (!ignoreAnimation) {
$node.addClass('tree-node-collapsing')
}
that.$nodes.find('.tooltip').remove();
that.drawLines();
if (!ignoreAnimation) {
$node.removeClass('tree-node-collapsing');
} else {
clearTimeout(that.toggleTimeTask);
that.toggleTimeTask = setTimeout(function() {
$node.removeClass('tree-node-collapsing');
}, 200);
}
}
};
Treemap.prototype.showLevel = function(level) {
var that = this;
that.$nodes.find('.treemap-node').each(function() {
var $node = $(this);
that.toggle($node, $node.data('level') < level, true);
});
};
Treemap.prototype.render = function(data) {
var that = this;
that.data = data ? ($.isArray(data) ? data : [data]) : that.data;
if(that.data) {
that.createNodes();
that.drawLines();
that.delayDrawLines(500);
}
that.callEvent('afterRender');
};
Treemap.prototype.createNodes = function(nodes, parent, callback) {
var that = this,
options = that.options,
rowSpace = options.rowSpace,
$nodes = that.$nodes;
if(!parent) {
$nodes.find('.treemap-node-wrapper').off('resize.' + NAME);
$nodes.empty();
}
if(options.sort) {
nodes.sort($.isFunction(options.sort) ? options.sort : function(nodeX, nodeY) {
return (nodeX.order || 0) - (nodeY.order);
});
}
var lastNode = null;
nodes = nodes || that.data;
if (!parent) {
that.maxLevel = 1;
}
$.each(nodes, function(idx, node) {
if(typeof node === 'string') {
node = {html: node};
nodes[idx] = node;
}
if(!node.id) node.id = $.zui.uuid();
node.level = parent ? (parent.level + 1) : 1;
that.maxLevel = Math.max(that.maxLevel, node.level);
// Create node element
var isCustomNodeTemplate = $.isFunction(options.nodeTemplate);
var $node = isCustomNodeTemplate ? options.nodeTemplate(node, that) : $(options.nodeTemplate);
// Create node wrapper element
var $wrapper = $node.find('.treemap-node-wrapper');
if(!$wrapper.length) {
$wrapper = $('<div class="treemap-node-wrapper"/>').appendTo($node);
}
var children = node.children;
var hasChild = children && children.length;
node.isOnlyOneChild = hasChild === 1;
// Set node data attributes
node.idx = idx;
var row = parent ? (parent.row + 1) : 0;
$node.toggleClass('treemap-node-has-child', !!hasChild)
.toggleClass('treemap-node-has-parent', !!parent)
.toggleClass('treemap-node-one-child', hasChild === 1)
.toggleClass('collapsed', !!node.collapsed && node.collapsed !== 'false')
.toggleClass('treemap-node-root', !row)
.attr({'data-id': node.id, 'data-level': node.level}).data('node', node);
if(node.className) {
$node.addClass(node.className);
}
node.row = row;
// Set node element attributes and sytle
var style = $.extend({}, options.nodeStyle, node.style);
if(node.textColor) style.color = node.textColor;
if(node.color) style.backgroundColor = node.color;
if(node.border) style.border = node.border;
var attrs = $.extend({}, node.attrs, {
title: node.caption
});
if(node.tooltip) {
attrs['data-toggle'] = 'tooltip';
attrs.title = node.tooltip;
}
$wrapper.attr(attrs).css(style);
if(lastNode) {
$node.css('padding-left', options.nodeSpace);
}
if(!isCustomNodeTemplate) {
if(node.html) $wrapper.append(node.html);
else if(node.text) $wrapper.text(node.text);
}
// append node element to ducument
$node.appendTo(parent ? parent.$children : $nodes);
// Save sizes
// node.bounds = {
// width : $wrapper.outerWidth(),
// height : $wrapper.outerHeight()
// };
if(lastNode) {
lastNode.next = node;
}
node.prev = lastNode;
node.parent = parent;
node.$ = $node;
node.$wrapper = $wrapper;
// Create children
if(hasChild) {
var $children = $node.find('.treemap-node-children');
if(!$children.length) {
$children = $('<div class="treemap-node-children"/>').appendTo($node);
}
$children.css('margin-top', rowSpace);
node.$children = $children;
that.createNodes(children, node);
}
if(options.listenNodeResize) {
$wrapper.on('resize.' + NAME, function() {
// node.bounds.width = $wrapper.outerWidth();
// node.bounds.height = $wrapper.outerHeight();
that.delayDrawLines();
});
}
lastNode = node;
callback && callback($node, node);
});
if(!parent) {
// Init tooltip
$nodes.find('[data-toggle="tooltip"]').tooltip(options.tooltip);
}
};
Treemap.prototype.delayDrawLines = function(delay) {
var that = this;
clearTimeout(that.delayDrawLinesTask);
that.delayDrawLinesTask = setTimeout(function() {
that.drawLines();
}, delay || 10);
};
Treemap.prototype.drawLines = function(nodes, parent) {
var that = this,
options = that.options,
rowSpace = options.rowSpace;
var cableStyle = {};
if(options.cableWidth) cableStyle.borderWidth = options.cableWidth;
if(options.cableStyle) cableStyle.borderStyle = options.cableStyle;
if(options.cableColor) cableStyle.borderColor = options.cableColor;
var rowSpaceHalf = Math.round(rowSpace/2);
var nodesOffsetLeft = that.$nodes.offset().left;
$.each(nodes || that.data, function(idx, node) {
var $wrapper = node.$wrapper;
var children = node.children;
var nodeCableStyle = $.extend({
height: rowSpaceHalf,
top: -rowSpaceHalf - 1,
left: Math.round(($wrapper.outerWidth() - cableStyle.borderWidth)/2),
color: cableStyle.borderColor
}, cableStyle);
if(parent && !parent.isOnlyOneChild) {
var $topLine = $wrapper.find('.treemap-line-top');
if(!$topLine.length) {
$topLine = $('<div class="treemap-line-top"/>').appendTo($wrapper);
}
$topLine.css(nodeCableStyle);
}
if(children && children.length) {
nodeCableStyle.top = $wrapper.outerHeight() - 1;
if(node.isOnlyOneChild) {
nodeCableStyle.height = rowSpace;
}
var $bottomLine = $wrapper.find('.treemap-line-bottom');
if(!$bottomLine.length) {
$bottomLine = $('<div class="treemap-line-bottom"/>').appendTo($wrapper);
if(options.foldable) {
$bottomLine.append('<i class="treemap-node-fold-icon icon" style="transform: translate(-' + Math.floor(nodeCableStyle.borderWidth/2) + 'px, ' + rowSpaceHalf + 'px)"/>');
}
}
$bottomLine.css(nodeCableStyle);
that.drawLines(children, node);
if(children.length > 1) {
var firstChild = children[0],
lastChild = children[children.length - 1];
var $centerLine = node.$.children('.treemap-line');
if(!$centerLine.length) {
$centerLine = $('<div class="treemap-line"/>').insertAfter($wrapper);
}
var lineLeft = Math.round(firstChild.$wrapper.offset().left - nodesOffsetLeft + firstChild.$wrapper.outerWidth()/2);
$centerLine.css($.extend({
marginTop: rowSpaceHalf,
left: lineLeft,
width: lastChild.$wrapper.offset().left - nodesOffsetLeft -lineLeft + lastChild.$wrapper.outerWidth()/2
}, cableStyle));
}
}
});
if(!parent) {
that.callEvent('afterDrawLines');
}
};
// Call event
Treemap.prototype.callEvent = function(name, params) {
var that = this;
if(!$.isArray(params)) params = [params];
that.$.trigger(name, params);
if($.isFunction(that.options[name])) {
return that.options[name].apply(that, params);
}
};
Treemap.DEFAULTS = DEFAULTS;
Treemap.NAME = NAME;
$.fn.treemap = function(option, param1, parma2) {
return this.each(function() {
var $this = $(this);
var data = $this.data(NAME);
var options = typeof option == 'object' && option;
if(!data) $this.data(NAME, (data = new Treemap(this, options)));
if(typeof option == 'string') data[option](param1, parma2);
});
};
$.fn.treemap.Constructor = Treemap;
}(jQuery, window, document, Math, undefined));

6
root/res/zui/lib/treemap/zui.treemap.min.css vendored Normal file
View File

@@ -0,0 +1,6 @@
/*!
* ZUI: 树形图 - v1.8.1 - 2018-01-18
* http://zui.sexy
* GitHub: https://github.com/easysoft/zui.git
* Copyright (c) 2018 cnezsoft.com; Licensed MIT
*/.treemap-data{text-align:left}.treemap-nodes{position:relative;display:table;padding:10px;margin-right:auto;margin-left:auto;text-align:center;-webkit-user-select:none;-moz-user-select:none}.treemap-node{display:table-cell;vertical-align:top}.treemap-node-wrapper{position:relative;z-index:5;display:inline-block;padding:5px 10px;border:1px solid grey;border-radius:1px}a.treemap-node-wrapper{color:#353535;cursor:pointer}a.treemap-node-wrapper:active,a.treemap-node-wrapper:focus,a.treemap-node-wrapper:hover{color:#3280fc;text-decoration:none;background-color:#ebf2f9;border-color:#3280fc}.treemap-node-root>.treemap-node-wrapper{background-color:rgba(0,0,0,.1)}.treemap-node-children{display:table;margin-top:20px auto 0}.treemap-line-bottom,.treemap-line-top{position:absolute;top:100%;left:50%;margin-left:-1px;border-right:none!important;border-bottom:none!important}.treemap-line-top{top:0}.treemap-node>.treemap-line{position:absolute;right:0;left:0;z-index:1;border-right:none!important;border-bottom:none!important}.treemap-node-fold-icon{position:absolute;top:-6px;left:-5px;z-index:10;display:block!important;width:10px;height:10px;line-height:10px;color:grey;background-color:#fff;border-radius:5px;opacity:0;-webkit-transition:opacity .2s,-webkit-transform .1s;-o-transition:opacity .2s,-o-transform .1s;transition:opacity .2s,-webkit-transform .1s;transition:opacity .2s,transform .1s;transition:opacity .2s,transform .1s,-webkit-transform .1s,-o-transform .1s}.treemap-node-fold-icon:before{min-width:10px;content:'\e6f2'}.treemap-node-wrapper:hover .treemap-node-fold-icon{opacity:1}.treemap-node.collapsed .treemap-line-bottom,.treemap-node.collapsed>.treemap-line{border-color:transparent!important}.treemap-node.collapsed>.treemap-node-children{display:none}.treemap-node.collapsed .treemap-node-fold-icon{top:-6px;color:grey;opacity:1;-webkit-transform:none!important;-ms-transform:none!important;-o-transform:none!important;transform:none!important}.treemap-node.collapsed .treemap-node-fold-icon:before{content:'\e6f1'}.treemap-node.tree-node-collapsing>.treemap-line,.treemap-node.tree-node-collapsing>.treemap-node-children{visibility:hidden}

7
root/res/zui/lib/treemap/zui.treemap.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long