* Adjust code .
This commit is contained in:
@@ -50,12 +50,16 @@ li.drag-shadow ul {display: none!important;}
|
||||
.main-table-content > .side {flex: 0 0 300px;}
|
||||
.main-table-content > .content {flex: 1;}
|
||||
|
||||
/* css for mian */
|
||||
.split-row > #sideBar {flex: 0 0 200px; overflow-x: auto;}
|
||||
|
||||
/* css for tree */
|
||||
.file-tree {overflow-x: auto; padding: 10px;}
|
||||
.file-tree a {height: 30px;}
|
||||
.flex-between {display: flex; align-items: center; justify-content: space-between;}
|
||||
.flex-center {display: flex; align-items: center; justify-content: center;}
|
||||
.tree li>.list-toggle {top: 4px;}
|
||||
.input-tree {width: 120px;}
|
||||
|
||||
/* css for sidebar */
|
||||
.sidebar-toggle > .icon {position: absolute; top: 50%; left: -12px; width: 12px; height: 30px; margin-top: -10px; line-height: 30px; color: #fff; text-align: center; background: #7dcdfe; border-radius: 6px; cursor: pointer;}
|
||||
|
||||
+21
-138
@@ -144,7 +144,7 @@ $(function()
|
||||
if($(libClass).find('li').length == 0) return '';
|
||||
|
||||
var dropdown = '<ul class="dropdown-menu dropdown-in-tree" id="' + option.type + '" style="display: unset; left:' + option.left + 'px; top:' + option.top + 'px;">';
|
||||
dropdown += $(libClass).html().replace(/%libID%/g, option.libID).replace(/%moduleID%/g, option.moduleID);
|
||||
dropdown += $(libClass).html().replace(/%libID%/g, option.libID).replace(/%moduleID%/g, option.moduleID).replace(/%hasChildren%/g, option.hasChildren);
|
||||
dropdown += '</ul>';
|
||||
return dropdown;
|
||||
};
|
||||
@@ -157,6 +157,7 @@ $(function()
|
||||
var libID = 0;
|
||||
var moduleID = 0;
|
||||
var $module = $(this).closest('a');
|
||||
var hasChildren = $module.data('has-children');
|
||||
if($module.hasClass('lib'))
|
||||
{
|
||||
libID = $module.data('id');
|
||||
@@ -168,11 +169,12 @@ $(function()
|
||||
}
|
||||
|
||||
var option = {
|
||||
left : e.pageX,
|
||||
top : e.pageY,
|
||||
type : dropDownID,
|
||||
libID : libID,
|
||||
moduleID : moduleID
|
||||
left : e.pageX,
|
||||
top : e.pageY,
|
||||
type : dropDownID,
|
||||
libID : libID,
|
||||
moduleID : moduleID,
|
||||
hasChildren : hasChildren
|
||||
};
|
||||
var dropDown = renderDropdown(option);
|
||||
$(".m-doc-tablecontents").append(dropDown);
|
||||
@@ -194,147 +196,28 @@ $(function()
|
||||
}).show();
|
||||
}
|
||||
if(item.type !== 'add') return;
|
||||
var $item = $(this);
|
||||
switch(item.method)
|
||||
{
|
||||
case 'addCataLib' :
|
||||
var $input = '';
|
||||
if(item.hasChildren)
|
||||
{
|
||||
var $rootDom = $('[data-id=' + item.libid + ']li').find('ul');
|
||||
$input += $('[data-id=liTreeModal]').html();
|
||||
}
|
||||
else
|
||||
{
|
||||
}
|
||||
$rootDom.append($input);
|
||||
break;
|
||||
case 'addCata' :
|
||||
break;
|
||||
case 'addCataChild' :
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
/*
|
||||
*
|
||||
*/
|
||||
function initSplitRow()
|
||||
}).on('blur', '.file-tree input.input-tree', function()
|
||||
{
|
||||
/* Init split row. */
|
||||
var NAME = 'zui.splitRow';
|
||||
/* The SplitRow model class. */
|
||||
var SplitRow = function(element, options)
|
||||
{
|
||||
var that = this;
|
||||
that.name = NAME;
|
||||
var $element = that.$ = $(element);
|
||||
|
||||
options = that.options = $.extend({}, SplitRow.DEFAULTS, this.$.data(), options);
|
||||
var id = options.id || $element.attr('id') || $.zui.uuid();
|
||||
var $cols = $element.children('.col');
|
||||
var $firstCol = $cols.first();
|
||||
var $firstBar = $('#leftBar > .btn-group');
|
||||
var $secondCol = $cols.eq(1);
|
||||
var $spliter = $firstCol.next('.col-spliter');
|
||||
if (!$spliter.length)
|
||||
{
|
||||
$spliter = $(options.spliter);
|
||||
if (!$spliter.parent().length) $spliter.insertAfter($firstCol);
|
||||
}
|
||||
var spliterWidth = $spliter.width();
|
||||
var minFirstColWidth = $firstCol.data('min-width');
|
||||
var minSecondColWidth = $secondCol.data('min-width');
|
||||
var rowWidth = $element.width();
|
||||
var setFirstColWidth = function(width)
|
||||
{
|
||||
var maxFirstWidth = 400;
|
||||
width = Math.max(minFirstColWidth, Math.min(width, maxFirstWidth));
|
||||
$firstCol.width(width);
|
||||
$firstBar.width(width);
|
||||
$secondCol.width($('#mainContent').width() - width);
|
||||
$.zui.store.set('splitRowFirstSize:' + id, width);
|
||||
};
|
||||
|
||||
var defaultWidth = $.zui.store.get('splitRowFirstSize:' + id);
|
||||
if(typeof(defaultWidth) == 'undefined') defaultWidth = $element.width() * 0.33;
|
||||
setFirstColWidth(defaultWidth);
|
||||
|
||||
var documentEventName = '.' + id;
|
||||
|
||||
var mouseDownX, isMouseDown, startFirstWidth, rafID;
|
||||
$spliter.on('mousedown', function(e)
|
||||
{
|
||||
startFirstWidth = $firstCol.width();
|
||||
mouseDownX = e.pageX;
|
||||
isMouseDown = true;
|
||||
$element.addClass('row-spliting');
|
||||
e.preventDefault();
|
||||
var handleMouseMove = function(e)
|
||||
{
|
||||
if(isMouseDown)
|
||||
{
|
||||
var deltaX = e.pageX - mouseDownX;
|
||||
setFirstColWidth(startFirstWidth + deltaX);
|
||||
e.preventDefault();
|
||||
}
|
||||
else
|
||||
{
|
||||
$(document).off(documentEventName);
|
||||
$element.removeClass('row-spliting');
|
||||
}
|
||||
};
|
||||
$(document).on('mousemove' + documentEventName, function(e)
|
||||
{
|
||||
if(rafID) cancelAnimationFrame(rafID);
|
||||
rafID = requestAnimationFrame(function()
|
||||
{
|
||||
handleMouseMove(e);
|
||||
rafID = 0;
|
||||
});
|
||||
}).on('mouseup' + documentEventName + ' mouseleave' + documentEventName, function(e)
|
||||
{
|
||||
if(rafID) cancelAnimationFrame(rafID);
|
||||
isMouseDown = false;
|
||||
$(document).off(documentEventName);
|
||||
$element.removeClass('row-spliting');
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
/* default options. */
|
||||
SplitRow.DEFAULTS =
|
||||
{
|
||||
spliter: '<div class="col-spliter"></div>',
|
||||
};
|
||||
|
||||
/* Extense jquery element. */
|
||||
$.fn.splitRow = function(option)
|
||||
{
|
||||
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 SplitRow(this, options)));
|
||||
});
|
||||
};
|
||||
|
||||
SplitRow.NAME = NAME;
|
||||
|
||||
$.fn.splitRow.Constructor = SplitRow;
|
||||
|
||||
/* Auto call splitRow after document load complete. */
|
||||
$(function()
|
||||
{
|
||||
$('.split-row').splitRow();
|
||||
});
|
||||
}
|
||||
|
||||
initSplitRow();
|
||||
|
||||
$('#spliter').on('click', '.icon', function()
|
||||
{
|
||||
if($(this).hasClass('isHide'))
|
||||
{
|
||||
$(this).addClass('icon-angle-left');
|
||||
$(this).removeClass('icon-angle-right isHide');
|
||||
$('#sideBar').removeClass('hidden');
|
||||
}
|
||||
else
|
||||
{
|
||||
$(this).removeClass('icon-angle-left');
|
||||
$(this).addClass('icon-angle-right isHide');
|
||||
$('#sideBar').addClass('hidden');
|
||||
}
|
||||
console.log($(this));
|
||||
});
|
||||
});
|
||||
|
||||
@@ -66,10 +66,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div id='mainContent'class="fade flex split-row">
|
||||
<div id='sideBar' class="panel side side-col col overflow-auto flex-none" data-min-width="150">
|
||||
<div id='sideBar' class="panel side side-col col overflow-auto" data-min-width="150">
|
||||
<div id="fileTree" class="file-tree"></div>
|
||||
</div>
|
||||
<div id="spliter" class="spliter col-spliter sidebar-toggle"></div>
|
||||
<div class="sidebar-toggle"></div>
|
||||
<div class="main-col flex-full col overflow-auto flex-auto" data-min-width="500">
|
||||
<div class="cell<?php if($browseType == 'bySearch') echo ' show';?>" style="min-width: 400px" id="queryBox" data-module=<?php echo $type . $libType . 'Doc';?>></div>
|
||||
<?php
|
||||
@@ -91,7 +91,7 @@
|
||||
<div class='hidden' id='dropDownData'>
|
||||
<div class='libDorpdown'>
|
||||
<?php if(common::hasPriv('tree', 'browse')):?>
|
||||
<li data-method="addCataLib" data-type="add"><a><i class="icon icon-controls"></i><?php echo $lang->doc->libDropdown['addModule'];?></a></li>
|
||||
<li data-method="addCataLib" data-has-children='%hasChildren%' data-libid='%libID%' data-moduleid="%moduleID%" data-type="add"><a><i class="icon icon-controls"></i><?php echo $lang->doc->libDropdown['addModule'];?></a></li>
|
||||
<?php endif;?>
|
||||
<?php if(common::hasPriv('doc', 'editLib')):?>
|
||||
<li data-method="editLib"><a href='<?php echo inlink('editLib', 'libID=%libID%');?>' data-toggle='modal' data-type='iframe'><i class="icon icon-edit"></i><?php echo $lang->doc->libDropdown['editLib'];?></a></li>
|
||||
@@ -109,4 +109,18 @@
|
||||
<?php endif;?>
|
||||
</div>
|
||||
</div>
|
||||
<div class='hidden' data-id="ulTreeModal">
|
||||
<ul data-id="liTreeModal" class="menu-active-primary menu-hover-primary has-input">
|
||||
<li data-id="insert" class="has-input">
|
||||
<input data-target="%target%" class="form-control input-tree"></input>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="hidden" data-id="aTreeModal">
|
||||
<a href="###" data-has-children="false" title="%name%" data-id="%id%">
|
||||
<div class="text h-full w-full flex-between">"%name"
|
||||
<i class="icon icon-drop icon-ellipsis-v float-r hidden" data-iscatalogue="true"></i>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<?php include '../../common/view/footer.html.php';?>
|
||||
|
||||
Reference in New Issue
Block a user