Skip to content

Commit 52563f8

Browse files
author
hikki
committed
v4.0
1 parent dd1b4d0 commit 52563f8

File tree

2 files changed

+138
-24
lines changed

2 files changed

+138
-24
lines changed

‎resources/assets/component.js

Lines changed: 136 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -91,16 +91,27 @@ window._component = {
9191
<div class="dlp-loader-line-wrap"><div class="dlp-loader-line"></div></div>
9292
</div></div>`);
9393
},
94-
alert: function (message, time = 1, callback = null) {
94+
alert: function (message, time = 1, callback = null,dom) {
9595
let div = document.createElement('div');
9696
div.innerHTML = message;
97-
let w = window.innerWidth / 2 - 140;
98-
let h = window.innerHeight / 2 - 145;
99-
let style = "z-index: 1000000; position: fixed;background-color: rgba(0,0,0,.6);color: #fff;" +
100-
"width: 320px;max-height: 450px;line-height: 30px;overflow: hidden;border-radius: 3px;text-align: center;display: block;" +
101-
"top:" + h + "px;left:" + w + "px;";
102-
div.setAttribute('style', style);
103-
document.getElementsByTagName("BODY")[0].appendChild(div);
97+
let w,h;
98+
div.setAttribute('style',"z-index: 1000000; background-color: rgba(0,0,0,.6);color: #fff;width: 320px;max-height: 450px;line-height: 30px;overflow: hidden;border-radius: 3px;text-align: center;display: block;");
99+
if(!dom) {
100+
w = window.innerWidth / 2 - 140;
101+
h = window.innerHeight / 2 - 145;
102+
div.style.position = 'fixed';
103+
}else {
104+
w = dom.offsetWidth / 2 - 140;
105+
h = dom.offsetHeight / 2;
106+
div.style.position = 'absolute';
107+
}
108+
div.style.top = h+'px';
109+
div.style.left = w+'px';
110+
if(!dom) {
111+
document.getElementsByTagName("BODY")[0].appendChild(div);
112+
}else {
113+
dom.append(div);
114+
}
104115
setTimeout(() => {
105116
div.parentNode.removeChild(div);
106117
if (typeof callback === 'function') callback();
@@ -115,7 +126,7 @@ window._component = {
115126
list.forEach((v) => {
116127
let li = document.createElement('li');
117128
li.className = 'dlp dlp-text';
118-
li.textContent = v.title;
129+
li.insertAdjacentHTML('afterbegin',v.title);
119130
li.style.width = options.W;
120131
if (typeof v.func === 'function') {
121132
li.addEventListener('click', () => {
@@ -1486,7 +1497,8 @@ window.ComponentCascadeLine = class {
14861497
detail: true,
14871498
insert: true,
14881499
update: true,
1489-
delete: true
1500+
delete: true,
1501+
root: true
14901502
}, options);
14911503
this.DOM = document.getElementById(name);
14921504
this.URL = url;
@@ -1526,8 +1538,8 @@ window.ComponentCascadeLine = class {
15261538
let object = this;
15271539
_component.request(this.URL + '/create', 'GET', {}, function (response) {
15281540
object.panelContent(response, {key: 0}, object.URL, 'POST', (response) => {
1529-
if (response.data.key === undefined) return _component.alert('返回数据结构缺少key', 3);
1530-
if (response.data.val === undefined) return _component.alert('返回数据结构缺少val', 3);
1541+
if (response.data.key === undefined) return _component.alert('返回数据结构缺少key', 3,null,object.DOM);
1542+
if (response.data.val === undefined) return _component.alert('返回数据结构缺少val', 3,null,object.DOM);
15311543
let key = parseInt(response.data.key);
15321544
let val = response.data.val;
15331545
let len = object.dimensional_data[0].push({
@@ -1611,6 +1623,36 @@ window.ComponentCascadeLine = class {
16111623
this.nodeDelete(div, data, stack);
16121624
}
16131625
});
1626+
if (this.OPTIONS.root) settings.push({
1627+
title: _component.node, func: () => {
1628+
let stack = parseInt(div.getAttribute('data-stack'));
1629+
let index = parseInt(div.getAttribute('data-k'));
1630+
let node_data = this.dimensional_data[stack][index];
1631+
this.dialog(`<span class="dlp-text title" title="${node_data.val}">${node_data.val}</span> 迁移到根节点`, 90);
1632+
let M = document.createElement('div');
1633+
M.className = 'dlp dlp-text dlp-label';
1634+
M.insertAdjacentHTML('afterbegin', `<span>${node_data.val}</span><i class="right">${_component.check_circle}</i>`);
1635+
this.PLANE_BODY.insertAdjacentHTML('afterbegin', `<div class="dlp" style="display: flex">${_component.node}</div>`);
1636+
this.PLANE_BODY.insertAdjacentHTML('beforeend', `<div style="font-size: 16px!important;">↑</div>`);
1637+
let object = this;
1638+
M.addEventListener('click', (() => {
1639+
if(node_data.stack === 0)return;
1640+
if (object.submit_block) return;
1641+
object.submit_block = true;
1642+
M.querySelector('.right').innerHTML = _component.sub_loading;
1643+
_component.request(this.URL, 'GET', {event:'root',node_key:node_data.key,node_val:node_data.val}, function (response) {
1644+
object.submit_block = false;
1645+
response = JSON.parse(response);
1646+
if (response.code !== 0) return _component.alert(response.message, 3,null,object.DOM);
1647+
object.nodeRootExec(div, node_data);
1648+
object.PLANE_DOM.remove();
1649+
}, function () {
1650+
object.submit_block = false;
1651+
});
1652+
}));
1653+
this.PLANE_BODY.append(M);
1654+
}
1655+
});
16141656
_component.contextmenu(e, settings);
16151657
});
16161658
if (this.OPTIONS.movable) div.insertAdjacentHTML('beforeend', `<i class="right">${_component.move}</i>`);
@@ -1763,7 +1805,7 @@ window.ComponentCascadeLine = class {
17631805
object.submit_block = false;
17641806
element.innerHTML = _component.check;
17651807
if (response.code !== 0) {
1766-
return _component.alert(response.message, 3);
1808+
return _component.alert(response.message, 3,null,object.DOM);
17671809
}
17681810
callback(response);
17691811
}, function () {
@@ -1787,9 +1829,9 @@ window.ComponentCascadeLine = class {
17871829
let nextStack = parseInt(stack) + 1;
17881830
_component.request(this.URL + '/create', 'GET', {id: data.key}, function (response) {
17891831
object.panelContent(response, data, object.URL, 'POST', (response) => {
1790-
if (response.code !== 0) return _component.alert(response.message, 3);
1791-
if (response.data.key === undefined) return _component.alert('返回数据结构缺少key', 3);
1792-
if (response.data.val === undefined) return _component.alert('返回数据结构缺少val', 3);
1832+
if (response.code !== 0) return _component.alert(response.message, 3,null,object.DOM);
1833+
if (response.data.key === undefined) return _component.alert('返回数据结构缺少key', 3,null,object.DOM);
1834+
if (response.data.val === undefined) return _component.alert('返回数据结构缺少val', 3,null,object.DOM);
17931835
let key = parseInt(response.data.key);
17941836
let val = response.data.val;
17951837
let parents = data.parentNodes.slice(0);
@@ -1849,8 +1891,8 @@ window.ComponentCascadeLine = class {
18491891
let object = this;
18501892
_component.request(this.URL + '/' + data.key + '/edit', 'GET', {val: data.val}, function (response) {
18511893
object.panelContent(response, data, object.URL + '/' + data.key, 'PUT', (response) => {
1852-
if (response.code !== 0) return _component.alert(response.message, 3);
1853-
if (response.data.val === undefined) return _component.alert('返回数据结构缺少val', 3);
1894+
if (response.code !== 0) return _component.alert(response.message, 3,null,object.DOM);
1895+
if (response.data.val === undefined) return _component.alert('返回数据结构缺少val', 3,null,object.DOM);
18541896
let val = response.data.val;
18551897
data.val = val;
18561898
dom.querySelector('span').textContent = val;
@@ -1893,7 +1935,7 @@ window.ComponentCascadeLine = class {
18931935
D.querySelector('.right').innerHTML = _component.sub_loading;
18941936
_component.request(this.URL + '/' + data.key, 'DELETE', {}, function (response) {
18951937
object.submit_block = false;
1896-
if (response.code !== 0) return _component.alert(response.message, 3);
1938+
if (response.code !== 0) return _component.alert(response.message, 3,null,object.DOM);
18971939
object.nodeDeleteExec(data, stack);
18981940
object.PLANE_DOM.remove();
18991941
}, function () {
@@ -2145,7 +2187,7 @@ window.ComponentCascadeLine = class {
21452187
_component.request(this.URL, 'GET', {event:event, node_key:node_data.key,node_val:node_data.val, aim_node_key:aim_node_data.key,aim_node_val:aim_node_data.val}, function (response) {
21462188
object.submit_block = false;
21472189
response = JSON.parse(response);
2148-
if (response.code !== 0) return _component.alert(response.message, 3);
2190+
if (response.code !== 0) return _component.alert(response.message, 3,null,object.DOM);
21492191
if (event === 'exchange') object.nodeExchangeExec(node, node_data, aim_node, aim_node_data);
21502192
if (event === 'migrate') object.nodeMigrateExec(node, node_data, aim_node, aim_node_data);
21512193
object.PLANE_DOM.remove();
@@ -2156,18 +2198,88 @@ window.ComponentCascadeLine = class {
21562198
this.PLANE_BODY.append(M);
21572199
}
21582200

2201+
nodeRootExec(node, node_data) {
2202+
let parent = node_data.parentNodes.slice().pop();
2203+
let parent_stack = node_data.stack - 1;
2204+
node_data.parentNodes = [];
2205+
let diffStack = 0 - node_data.stack;
2206+
let index = parseInt(node.getAttribute('data-k'));
2207+
this.dimensional_data[node_data.stack].splice(index, 1);
2208+
this.dimensional_data[0].push(node_data);
2209+
if(node_data.nodes !== null)this.resetChildrenDimensional(node_data,node_data.stack + 1,diffStack);
2210+
node_data.stack = 0;
2211+
this.dimensional_data = this.dimensional_data.filter((d)=>{
2212+
if(d.length>0)return true;
2213+
return false;
2214+
});
2215+
this.CONTENT_DOM.innerHTML = '';
2216+
for (let stack in this.dimensional_data) {
2217+
if (!this.dimensional_data.hasOwnProperty(stack)) continue;
2218+
stack = parseInt(stack);
2219+
let data = this.dimensional_data[stack];
2220+
let stackDom = document.createElement('div');
2221+
stackDom.className = 'dot-cascade-stack dlp-scroll';
2222+
data.forEach((v, k) => {
2223+
if(parseInt(stack) === parent_stack && v.key === parent){
2224+
v.nodes.splice(v.nodes.indexOf(node_data.key), 1);
2225+
}
2226+
if (Array.isArray(v.nodes) && v.nodes.length !== 0) {
2227+
v.expand = false;
2228+
} else {
2229+
v.nodes = null;
2230+
}
2231+
let labelDom = this.insertLabelDom(v, k, stack);
2232+
if (v.nodes !== null) {
2233+
labelDom.insertAdjacentHTML('afterbegin', `<i class="left">${_component.caret_right}</i>`);
2234+
}
2235+
stackDom.append(labelDom);
2236+
});
2237+
this.CONTENT_DOM.append(stackDom);
2238+
}
2239+
this.STACKS = this.CONTENT_DOM.childNodes;
2240+
for (let D of this.DOM.querySelectorAll('i.right')) {
2241+
this.nodeMigrate(D);
2242+
}
2243+
}
2244+
21592245
nodeMigrateExec(node, node_data, aim_node, aim_node_data) {
2246+
/*parent*/
2247+
let parent_node = node_data.parentNodes.slice().pop();
2248+
let parent_node_stack = node_data.stack - 1;
21602249
let parents = aim_node_data.parentNodes.slice(0);
21612250
parents.push(aim_node_data.key);
21622251
node_data.parentNodes = parents;
2252+
/*last_child_node*/
2253+
let last_child_node;
2254+
if(aim_node_data.nodes !== null) last_child_node = aim_node_data.nodes.slice(0).pop();
2255+
/*stack*/
21632256
let stack = aim_node_data.stack + 1;
21642257
let diffStack = stack - node_data.stack;
2258+
/*delete*/
21652259
let index = parseInt(node.getAttribute('data-k'));
21662260
this.dimensional_data[node_data.stack].splice(index, 1);
21672261
if (!Array.isArray(this.dimensional_data[stack])) this.dimensional_data[stack] = [];
2168-
this.dimensional_data[stack].push(node_data);
2262+
/*insert*/
2263+
if(!last_child_node){
2264+
this.dimensional_data[stack].push(node_data);
2265+
}else {
2266+
let index = 0;
2267+
for (let key in this.dimensional_data[aim_node_data.stack+1]){
2268+
if(!this.dimensional_data[aim_node_data.stack+1].hasOwnProperty(key))continue;
2269+
if(this.dimensional_data[aim_node_data.stack+1][key].key === last_child_node){
2270+
index = key;
2271+
break;
2272+
}
2273+
}
2274+
index++;
2275+
this.dimensional_data[aim_node_data.stack+1].splice(index,0,node_data);
2276+
}
21692277

21702278
this.resetChildrenDimensional(node_data, node_data.stack + 1, diffStack);
2279+
this.dimensional_data = this.dimensional_data.filter((d)=>{
2280+
if(d.length>0)return true;
2281+
return false;
2282+
});
21712283
node_data.stack = stack;
21722284
/*aim node*/
21732285
if (!Array.isArray(aim_node_data.nodes)) aim_node_data.nodes = [];
@@ -2181,6 +2293,9 @@ window.ComponentCascadeLine = class {
21812293
let stackDom = document.createElement('div');
21822294
stackDom.className = 'dot-cascade-stack dlp-scroll';
21832295
data.forEach((v, k) => {
2296+
if(parseInt(stack) === parent_node_stack && v.key === parent_node){
2297+
v.nodes.splice(v.nodes.indexOf(node_data.key), 1);
2298+
}
21842299
if (Array.isArray(v.nodes) && v.nodes.length !== 0) {
21852300
v.expand = false;
21862301
} else {
@@ -2195,7 +2310,6 @@ window.ComponentCascadeLine = class {
21952310
this.CONTENT_DOM.append(stackDom);
21962311
}
21972312
this.STACKS = this.CONTENT_DOM.childNodes;
2198-
if (!this.OPTIONS.movable) return;
21992313
for (let D of this.DOM.querySelectorAll('i.right')) {
22002314
this.nodeMigrate(D);
22012315
}

‎src/DLPServiceProvider.php

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,8 +29,8 @@ public function boot(DLP $extension)
2929
}
3030

3131
Admin::booting(function () {
32-
Admin::css('vendor/dlp/component.min.css?v3.8');
33-
Admin::headerJs('vendor/dlp/component.min.js?v3.8');
32+
Admin::css('vendor/dlp/component.min.css?v4.0');
33+
Admin::headerJs('vendor/dlp/component.min.js?v4.0');
3434
Form::extend('Dot', Dot::class);
3535
Form::extend('CascadeDot', CascadeDot::class);
3636
Form::extend('Linear', Linear::class);

0 commit comments

Comments
 (0)