*

Author: hikki

resources/assets/component.js

@@ -33,6 +33,9 @@ const _component = {
     <animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 20 20" to="360 20 20" dur="0.5s" repeatCount="indefinite"></animateTransform>
     </path>
   </svg>`,
+    'node':`<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-diagram-3-fill" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M6 3.5A1.5 1.5 0 0 1 7.5 2h1A1.5 1.5 0 0 1 10 3.5v1A1.5 1.5 0 0 1 8.5 6v1H14a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-1 0V8h-5v.5a.5.5 0 0 1-1 0V8h-5v.5a.5.5 0 0 1-1 0v-1A.5.5 0 0 1 2 7h5.5V6A1.5 1.5 0 0 1 6 4.5v-1zm-6 8A1.5 1.5 0 0 1 1.5 10h1A1.5 1.5 0 0 1 4 11.5v1A1.5 1.5 0 0 1 2.5 14h-1A1.5 1.5 0 0 1 0 12.5v-1zm6 0A1.5 1.5 0 0 1 7.5 10h1a1.5 1.5 0 0 1 1.5 1.5v1A1.5 1.5 0 0 1 8.5 14h-1A1.5 1.5 0 0 1 6 12.5v-1zm6 0a1.5 1.5 0 0 1 1.5-1.5h1a1.5 1.5 0 0 1 1.5 1.5v1a1.5 1.5 0 0 1-1.5 1.5h-1a1.5 1.5 0 0 1-1.5-1.5v-1z"/>
+</svg>`,
     request: function (url, method = "GET", data = {}, callback = null,error_callback=null) {
         let xhr = new XMLHttpRequest();
         if (method === 'GET') url = _component.parseParams(url,data);
@@ -1192,12 +1195,12 @@ class ComponentCascadeLine {
                 },
                 {
                     title: '修改', func: () => {
-                        this.nodeUpdate(e,data,stack);
+                        this.nodeUpdate(e,data);
                     }
                 },
                 {
                     title: '删除', func: () => {
-
+                        this.nodeDelete(e,data,stack);
                     }
                 }
             ]);
@@ -1302,7 +1305,7 @@ class ComponentCascadeLine {
         if (left_mark) left_mark.innerHTML = _component.caret_right;
     }
 
-    panel(){
+    panel(title){
         let html = `<div class="dot-cascade-panel"><div class="dlp plane-header"></div><div class="plane-body dlp-scroll"></div></div>`;
         this.DOM.childNodes[0].insertAdjacentHTML('beforeEnd', html);
         let panelDom = this.DOM.childNodes[0].lastChild;
@@ -1316,6 +1319,12 @@ class ComponentCascadeLine {
         panelDom.querySelector('.plane-header').append(X);
         this.PLANE_BODY = panelDom.querySelector('.plane-body');
         _component.loading(this.PLANE_BODY);
+
+        let T = document.createElement('div');
+        T.style.position = 'absolute';
+        T.style.left = '3px';
+        T.insertAdjacentHTML('afterbegin',_component.node+` <span style="vertical-align: top;">${title}</span>`);
+        panelDom.querySelector('.plane-header').append(T);
     }
 
     panelContent(response,data,xhr,method,callback) {
@@ -1354,7 +1363,7 @@ class ComponentCascadeLine {
     }
 
     nodeInsert(e,data,stack){
-        this.panel(e,data);
+        this.panel(data.val+' 新增节点');
         let object = this;
         let nextStack = parseInt(stack) + 1;
         _component.request(this.URL+'/create', 'GET', {id:data.key}, function (response) {
@@ -1408,8 +1417,8 @@ class ComponentCascadeLine {
         });
     }
 
-    nodeUpdate(e,data,stack){
-        this.panel(e,data);
+    nodeUpdate(e,data){
+        this.panel(data.val+' 修改节点');
         let object = this;
         _component.request(this.URL+'/'+data.key+'/edit', 'GET', {val:data.val}, function (response) {
             object.panelContent(response,data,object.URL+'/'+data.key,'PUT',(response)=>{
@@ -1428,7 +1437,7 @@ class ComponentCascadeLine {
         });
     }
 
-    nodeDelete(){
+    nodeDelete(e,data){
 
     }
 }