111
This commit is contained in:
parent
d6dbe82783
commit
596f6da4a1
@ -26,6 +26,9 @@
|
||||
<script src="./src/icontains.js" type="text/javascript"></script>
|
||||
<!-- 多级下拉框选项 -->
|
||||
<script src="./src/comboTreePlugin.js" type="text/javascript"></script>
|
||||
|
||||
<script src="./src/jquery.dad.min.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
<!-- <script src="./src/doT.js"></script> -->
|
||||
<!-- <script src="./src/puble.js"></script> -->
|
||||
|
||||
267
web/src/jquery.dad.min.js
vendored
Normal file
267
web/src/jquery.dad.min.js
vendored
Normal file
@ -0,0 +1,267 @@
|
||||
/*!
|
||||
* jquery.dad.js v1 (http://konsolestudio.com/dad)
|
||||
* Author William Lima
|
||||
*/
|
||||
;(function ($) {
|
||||
'use strict'
|
||||
function O_dad() {
|
||||
var self = this
|
||||
this.x = 0
|
||||
this.y = 0
|
||||
this.target = false
|
||||
this.clone = false
|
||||
this.placeholder = false
|
||||
this.cloneoffset = { x: 0, y: 0 }
|
||||
this.move = function (e) {
|
||||
self.x = e.pageX
|
||||
self.y = e.pageY
|
||||
if (self.clone != false && self.target != false) {
|
||||
self.clone.css({
|
||||
top: self.y - self.cloneoffset.y,
|
||||
left: self.x - self.cloneoffset.x,
|
||||
})
|
||||
} else {
|
||||
}
|
||||
}
|
||||
$(window).on('mousemove', function (e) {
|
||||
self.move(e)
|
||||
})
|
||||
}
|
||||
$.prototype.dad = function (opts) {
|
||||
var me, defaults, options
|
||||
me = this
|
||||
defaults = {
|
||||
target: '>div',
|
||||
draggable: false,
|
||||
placeholder: 'drop here',
|
||||
callback: false,
|
||||
containerClass: 'dad-container',
|
||||
childrenClass: 'dads-children',
|
||||
cloneClass: 'dads-children-clone',
|
||||
active: true,
|
||||
}
|
||||
options = $.extend({}, defaults, opts)
|
||||
$(this).each(function () {
|
||||
var mouse,
|
||||
target,
|
||||
dragClass,
|
||||
active,
|
||||
callback,
|
||||
placeholder,
|
||||
daddy,
|
||||
childrenClass,
|
||||
jQclass,
|
||||
cloneClass
|
||||
mouse = new O_dad()
|
||||
active = options.active
|
||||
daddy = $(this)
|
||||
if (!daddy.hasClass('dad-active') && active == true)
|
||||
daddy.addClass('dad-active')
|
||||
childrenClass = options.childrenClass
|
||||
cloneClass = options.cloneClass
|
||||
jQclass = '.' + childrenClass
|
||||
daddy.addClass(options.containerClass)
|
||||
target = daddy.find(options.target)
|
||||
placeholder = options.placeholder
|
||||
callback = options.callback
|
||||
dragClass = 'dad-draggable-area'
|
||||
me.addDropzone = function (selector, func) {
|
||||
$(selector)
|
||||
.on('mouseenter', function () {
|
||||
if (mouse.target != false) {
|
||||
mouse.placeholder.css({ display: 'none' })
|
||||
mouse.target.css({ display: 'none' })
|
||||
$(this).addClass('active')
|
||||
}
|
||||
})
|
||||
.on('mouseup', function () {
|
||||
if (mouse.target != false) {
|
||||
mouse.placeholder.css({ display: 'block' })
|
||||
mouse.target.css({ display: 'block' })
|
||||
func(mouse.target)
|
||||
dad_end()
|
||||
}
|
||||
$(this).removeClass('active')
|
||||
})
|
||||
.on('mouseleave', function () {
|
||||
if (mouse.target != false) {
|
||||
mouse.placeholder.css({ display: 'block' })
|
||||
mouse.target.css({ display: 'block' })
|
||||
}
|
||||
$(this).removeClass('active')
|
||||
})
|
||||
}
|
||||
me.getPosition = function () {
|
||||
var positionArray = []
|
||||
$(this)
|
||||
.find(jQclass)
|
||||
.each(function () {
|
||||
positionArray[$(this).attr('data-dad-id')] = parseInt(
|
||||
$(this).attr('data-dad-position')
|
||||
)
|
||||
})
|
||||
return positionArray
|
||||
}
|
||||
me.activate = function () {
|
||||
active = true
|
||||
if (!daddy.hasClass('dad-active')) {
|
||||
daddy.addClass('dad-active')
|
||||
}
|
||||
return me
|
||||
}
|
||||
me.deactivate = function () {
|
||||
active = false
|
||||
daddy.removeClass('dad-active')
|
||||
return me
|
||||
}
|
||||
$(document).on('mouseup', function () {
|
||||
dad_end()
|
||||
})
|
||||
var order = 1
|
||||
target.addClass(childrenClass).each(function () {
|
||||
if ($(this).data('dad-id') == undefined) {
|
||||
$(this).attr('data-dad-id', order)
|
||||
}
|
||||
$(this).attr('data-dad-position', order)
|
||||
order++
|
||||
})
|
||||
function update_position(e) {
|
||||
var order = 1
|
||||
e.find(jQclass).each(function () {
|
||||
$(this).attr('data-dad-position', order)
|
||||
order++
|
||||
})
|
||||
}
|
||||
function dad_end() {
|
||||
if (mouse.target != false && mouse.clone != false) {
|
||||
if (callback != false) {
|
||||
callback(mouse.target)
|
||||
}
|
||||
var appear = mouse.target
|
||||
var desapear = mouse.clone
|
||||
var holder = mouse.placeholder
|
||||
var bLeft = 0
|
||||
Math.floor(parseFloat(daddy.css('border-left-width')))
|
||||
var bTop = 0
|
||||
Math.floor(parseFloat(daddy.css('border-top-width')))
|
||||
if ($.contains(daddy[0], mouse.target[0])) {
|
||||
mouse.clone.animate(
|
||||
{
|
||||
top:
|
||||
mouse.target.offset().top -
|
||||
daddy.offset().top -
|
||||
bTop,
|
||||
left:
|
||||
mouse.target.offset().left -
|
||||
daddy.offset().left -
|
||||
bLeft,
|
||||
},
|
||||
300,
|
||||
function () {
|
||||
appear
|
||||
.css({ visibility: 'visible' })
|
||||
.removeClass('active')
|
||||
desapear.remove()
|
||||
}
|
||||
)
|
||||
} else {
|
||||
mouse.clone.fadeOut(300, function () {
|
||||
desapear.remove()
|
||||
})
|
||||
}
|
||||
holder.remove()
|
||||
mouse.clone = false
|
||||
mouse.placeholder = false
|
||||
mouse.target = false
|
||||
update_position(daddy)
|
||||
}
|
||||
$('html,body').removeClass('dad-noSelect')
|
||||
}
|
||||
function dad_update(obj) {
|
||||
if (mouse.target != false && mouse.clone != false) {
|
||||
var newplace, origin
|
||||
origin = $('<span style="display:none"></span>')
|
||||
newplace = $('<span style="display:none"></span>')
|
||||
if (obj.prevAll().hasClass('active')) {
|
||||
obj.after(newplace)
|
||||
} else {
|
||||
obj.before(newplace)
|
||||
}
|
||||
mouse.target.before(origin)
|
||||
newplace.before(mouse.target)
|
||||
mouse.placeholder.css({
|
||||
top: mouse.target.offset().top - daddy.offset().top,
|
||||
left: mouse.target.offset().left - daddy.offset().left,
|
||||
width: mouse.target.outerWidth() - 10,
|
||||
height: mouse.target.outerHeight() - 10,
|
||||
})
|
||||
origin.remove()
|
||||
newplace.remove()
|
||||
}
|
||||
}
|
||||
var jq = options.draggable != false ? options.draggable : jQclass
|
||||
daddy.find(jq).addClass(dragClass)
|
||||
daddy.find(jq).on('mousedown touchstart', function (e) {
|
||||
if (mouse.target == false && e.which == 1 && active == true) {
|
||||
if (options.draggable != false) {
|
||||
mouse.target = daddy.find(jQclass).has(this)
|
||||
} else {
|
||||
mouse.target = $(this)
|
||||
}
|
||||
mouse.clone = mouse.target.clone()
|
||||
mouse.target
|
||||
.css({ visibility: 'hidden' })
|
||||
.addClass('active')
|
||||
mouse.clone.addClass(cloneClass)
|
||||
daddy.append(mouse.clone)
|
||||
mouse.placeholder = $('<div></div>')
|
||||
mouse.placeholder.addClass('dads-children-placeholder')
|
||||
mouse.placeholder
|
||||
.css({
|
||||
top: mouse.target.offset().top - daddy.offset().top,
|
||||
left:
|
||||
mouse.target.offset().left -
|
||||
daddy.offset().left,
|
||||
width: mouse.target.outerWidth() - 10,
|
||||
height: mouse.target.outerHeight() - 10,
|
||||
lineHeight: mouse.target.height() - 18 + 'px',
|
||||
textAlign: 'center',
|
||||
})
|
||||
.text(placeholder)
|
||||
daddy.append(mouse.placeholder)
|
||||
var difx, dify
|
||||
var bLeft = Math.floor(
|
||||
parseFloat(daddy.css('border-left-width'))
|
||||
)
|
||||
var bTop = Math.floor(
|
||||
parseFloat(daddy.css('border-top-width'))
|
||||
)
|
||||
difx =
|
||||
mouse.x -
|
||||
mouse.target.offset().left +
|
||||
daddy.offset().left +
|
||||
bLeft
|
||||
dify =
|
||||
mouse.y -
|
||||
mouse.target.offset().top +
|
||||
daddy.offset().top +
|
||||
bTop
|
||||
mouse.cloneoffset.x = difx
|
||||
mouse.cloneoffset.y = dify
|
||||
mouse.clone
|
||||
.removeClass(childrenClass)
|
||||
.css({
|
||||
position: 'absolute',
|
||||
top: mouse.y - mouse.cloneoffset.y,
|
||||
left: mouse.x - mouse.cloneoffset.x,
|
||||
})
|
||||
$('html,body').addClass('dad-noSelect')
|
||||
}
|
||||
})
|
||||
$(jQclass).on('mouseenter', function () {
|
||||
dad_update($(this))
|
||||
})
|
||||
})
|
||||
return this
|
||||
}
|
||||
})(jQuery)
|
||||
41
web/src/x.min.js
vendored
41
web/src/x.min.js
vendored
@ -3802,6 +3802,13 @@ var X = window.X || {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// $('.layui-row').dad({
|
||||
// draggable: '.layui-card'
|
||||
// });
|
||||
$('.layui-row').dad({
|
||||
// draggable
|
||||
});
|
||||
})
|
||||
},
|
||||
|
||||
@ -3903,14 +3910,20 @@ var X = window.X || {
|
||||
X.api('dashboard/','post',{id:X.DATA['dashboard_id']},function(d){
|
||||
var modellist=[];
|
||||
for(let i in d){
|
||||
modellist.push(d[i]['sort']);
|
||||
var arr = {
|
||||
sort:d[i]['sort'],
|
||||
report_id:d[i]['report_id']
|
||||
}
|
||||
modellist.push(arr);
|
||||
}
|
||||
modellist.sort(); //排序
|
||||
|
||||
modellist.sort( X.pageLogic['dashboard'].compare("sort"));
|
||||
|
||||
for(let i in modellist){
|
||||
for(let z in d){
|
||||
if(modellist[i] == d[z]['sort']){
|
||||
//渲染模板和数据
|
||||
// console.log(d[z]);
|
||||
console.log(d[z]);
|
||||
X.laytpldata("#kanban-model-box-dot",d[z],null,function(html){
|
||||
$('#model-box').append(html);
|
||||
X.pageLogic['dashboard'].fillmodeldata(d[z]);
|
||||
@ -3918,14 +3931,26 @@ var X = window.X || {
|
||||
}
|
||||
}
|
||||
}
|
||||
// $(".layui-col").Tdrag({
|
||||
// scope:".layui-row",
|
||||
// pos:true,
|
||||
// dragChange:true
|
||||
// });
|
||||
|
||||
})
|
||||
},
|
||||
|
||||
//定义一个比较器--降序排列
|
||||
compare:function(propertyName) {
|
||||
console.log(propertyName)
|
||||
return function(object1, object2) {
|
||||
var value1 = object1[propertyName];
|
||||
var value2 = object2[propertyName];
|
||||
if(value2 < value1) {
|
||||
return 1;
|
||||
} else if(value2 > value1) {
|
||||
return -1;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
})();
|
||||
|
||||
|
||||
@ -416,6 +416,13 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// $('.layui-row').dad({
|
||||
// draggable: '.layui-card'
|
||||
// });
|
||||
$('.layui-row').dad({
|
||||
// draggable
|
||||
});
|
||||
})
|
||||
},
|
||||
|
||||
@ -517,14 +524,20 @@
|
||||
X.api('dashboard/','post',{id:X.DATA['dashboard_id']},function(d){
|
||||
var modellist=[];
|
||||
for(let i in d){
|
||||
modellist.push(d[i]['sort']);
|
||||
var arr = {
|
||||
sort:d[i]['sort'],
|
||||
report_id:d[i]['report_id']
|
||||
}
|
||||
modellist.push(arr);
|
||||
}
|
||||
modellist.sort(); //排序
|
||||
|
||||
modellist.sort( X.pageLogic['dashboard'].compare("sort"));
|
||||
|
||||
for(let i in modellist){
|
||||
for(let z in d){
|
||||
if(modellist[i] == d[z]['sort']){
|
||||
//渲染模板和数据
|
||||
// console.log(d[z]);
|
||||
console.log(d[z]);
|
||||
X.laytpldata("#kanban-model-box-dot",d[z],null,function(html){
|
||||
$('#model-box').append(html);
|
||||
X.pageLogic['dashboard'].fillmodeldata(d[z]);
|
||||
@ -532,13 +545,25 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
// $(".layui-col").Tdrag({
|
||||
// scope:".layui-row",
|
||||
// pos:true,
|
||||
// dragChange:true
|
||||
// });
|
||||
|
||||
})
|
||||
},
|
||||
|
||||
//定义一个比较器--降序排列
|
||||
compare:function(propertyName) {
|
||||
// console.log(propertyName)
|
||||
return function(object1, object2) {
|
||||
var value1 = object1[propertyName];
|
||||
var value2 = object2[propertyName];
|
||||
if(value2 < value1) {
|
||||
return 1;
|
||||
} else if(value2 > value1) {
|
||||
return -1;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
})();
|
||||
|
||||
@ -22,6 +22,51 @@
|
||||
.layui-anim-downbit { max-height: 350px; overflow-y: auto; overflow-x: hidden; }
|
||||
/* .layui-nav .layui-nav-child dd.layui-this a, .layui-nav-child dd.layui-this { background-color: #f6f8fa !important; } */
|
||||
|
||||
.dad-noSelect,.dad-noSelect *{
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
cursor: -webkit-grabbing !important;
|
||||
cursor: -moz-grabbing !important;
|
||||
}
|
||||
|
||||
.dad-container{
|
||||
position: relative;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
.dad-container::after{
|
||||
content: '';
|
||||
clear: both !important;
|
||||
display: block;
|
||||
}
|
||||
.dad-active .dad-draggable-area{
|
||||
cursor: -webkit-grab;
|
||||
cursor: -moz-grab;
|
||||
}
|
||||
.dads-children-clone{
|
||||
opacity: 0.8;
|
||||
z-index: 9999;
|
||||
pointer-events: none;
|
||||
}
|
||||
.dads-children-placeholder{
|
||||
overflow: hidden;
|
||||
position: absolute !important;
|
||||
box-sizing: border-box;
|
||||
border:2px dashed #639BF6;
|
||||
margin:5px;
|
||||
text-align: center;
|
||||
color: #639BF6;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.username { color: #67729d; margin-right: 16px; }
|
||||
.layui-project { position:absolute; top: 0; left: 80px; ;}
|
||||
.layui-nav-bar { width: 0px !important; height: 0px !important; }
|
||||
|
||||
Loading…
Reference in New Issue
Block a user