v3

Author: ydtg1993

resources/assets/component.css

@@ -13,9 +13,9 @@
     user-select: none!important;
     text-align: left;
     -webkit-appearance: none!important;
-    -webkit-box-sizing: unset!important;
-    -moz-box-sizing: unset!important;
-    box-sizing: unset!important;
+    -webkit-box-sizing: border-box!important;
+    -moz-box-sizing: border-box!important;
+    box-sizing: border-box!important;
 }
 .dlp i{cursor: pointer!important;}
 .dlp p,.dlp span{margin: 0!important;padding: 0!important;}
@@ -136,7 +136,7 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    height: 20px!important;
+    height: 27px!important;
     padding-left: 24px;
     padding-right: 24px;
     max-width: unset;
@@ -244,7 +244,7 @@
     align-items:center;
     border-bottom: 1px solid #505050;
     border-radius: 3px 3px 0 0;
-    height: 18px!important;
+    height: 24px!important;
 }
 .plane-header .header-content{
     margin-right: auto;
@@ -257,23 +257,29 @@
     vertical-align: bottom;
 }
 #dlp-plane .plane-body,.dot-cascade-panel>.plane-body{
-    background-color: rgb(244, 244, 244); padding: 0; overflow-y: auto;border-radius: 0 0 3px 3px;box-shadow: 0 .4rem 1.2rem rgba(0,0,0,.4)!important;position: relative!important;min-height: 100px;
+    background-color: rgb(244, 244, 244);
+    padding: 0;
+    overflow-y: auto;
+    border-radius: 0 0 3px 3px;
+    box-shadow: 0 .4rem 1.2rem rgba(0,0,0,.4)!important;
+    position: relative!important;
+    min-height: 70px;
 }
 .dot-cascade-panel>.plane-body{
     height: calc(100% - 23px);
     background: rgb(54 54 54)!important;
 }
 .dot-cascade-panel>.plane-header-delete{
     width: 270px;
-    margin: 60px auto 0;
+    margin: 30px auto 0;
 }
 .dot-cascade-panel>.plane-body-delete{
     display: flex;
     justify-content: center;
     align-items: center;
     width: 270px;
     height: 50px;
-    min-height: 50px;
+    min-height: 50px!important;
     margin: 0 auto;
     overflow: hidden;
     padding: 3px;

resources/assets/component.js

@@ -994,7 +994,7 @@ class ComponentPlane {
         _component.request(this.URL, 'GET', {}, function (response) {
             _component.loading(object.MODEL_BODY_DOM, true);
             let fragment = document.createRange().createContextualFragment(response);
-            document.querySelector('#dlp-plane .plane-body').appendChild(fragment);
+            object.MODEL_BODY_DOM.appendChild(fragment);
             let listener = object.XHR.listener;
             if (typeof listener === 'function') {
                 let target = listener(object.MODEL_BODY_DOM);

src/Widget/CascadeDot.php

@@ -16,7 +16,7 @@ class CascadeDot extends DLPField
     public function render()
     {
         $id = $this->formatName($this->id);
-        $height = isset($this->attributes['height']) ?  $this->attributes['height'] : '200px';
+        $height = isset($this->attributes['height']) ?  $this->attributes['height'] : '250px';
         $limit = isset($this->attributes['limit']) ? (int)$this->attributes['limit'] : 0;
         $this->addVariables(['height'=>$height]);
         $select = json_encode($this->options, JSON_UNESCAPED_UNICODE | JSON_HEX_QUOT | JSON_HEX_APOS);

src/Widget/CascadeLine.php

@@ -16,7 +16,7 @@ class CascadeLine extends DLPField
     public function render()
     {
         $id = $this->formatName($this->id);
-        $height = isset($this->attributes['height']) ?  $this->attributes['height'] : '200px';
+        $height = isset($this->attributes['height']) ?  $this->attributes['height'] : '250px';
         $this->addVariables(['height'=>$height]);
         $select = json_encode($this->options, JSON_UNESCAPED_UNICODE | JSON_HEX_QUOT | JSON_HEX_APOS);
         $xhr = $this->xhr ?? '';