* Adjust code .

This commit is contained in:
guofeilong
2023-03-23 10:46:01 +08:00
parent 491434233e
commit e1657a8e72
3 changed files with 42 additions and 141 deletions
+4
View File
@@ -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
View File
@@ -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));
});
});
+17 -3
View File
@@ -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';?>