效果调整

Author: hikki

resources/assets/component.css

@@ -118,6 +118,13 @@
     margin-bottom: 3px;
     position: relative;
 }
+.dot-cascade-stack>.dlp-label-silence{
+    opacity: 0.5;
+    transition: .2s ease-in-out;
+}
+.dot-cascade-stack>.dlp-label-active{
+    animation: dlpLabelActive ease-in-out 1s forwards;
+}
 .dlp-label>i{
     position: absolute!important;
     right: 4px!important;
@@ -127,11 +134,6 @@
     left: 0!important;
     right: unset!important;
 }
-.dot-cascade-stack>.dlp-label-silence{
-    opacity: 0.5;
-    transition: .2s ease-in-out;
-}
-
 .dlp-input{
     vertical-align: middle;
     display: inline-block;
@@ -223,4 +225,9 @@
 @keyframes dlpFadeIn {
     0% {opacity: 0;}
     100% {opacity: 1;}
+}
+
+@keyframes dlpLabelActive{
+    0%   {background: #d6d6d6;}
+    100% {background: #ffffff;}
 }

resources/assets/component.js

@@ -460,14 +460,18 @@ class ComponentCascadeDot {
         currentStackDocuments.forEach((D, index) => {
             let data = this.dimensional_data[stack][index];
             let parents = data.parentNodes;
+            D.classList.remove('dlp-label-active');
             if (checked === true || checked === undefined) {
                 if (parents.length > 0 && (parents[stack - 1] !== parentNode)) {
                     D.classList.add('dlp-label-silence');
                 } else if (parents.length === 0 && parseInt(D.getAttribute('data-id')) !== node) {
                     D.classList.add('dlp-label-silence');
                 } else {
                     D.classList.remove('dlp-label-silence');
-                    if (to_first_index === null && parseInt(D.getAttribute('data-id')) === node) to_first_index = index;
+                    if (to_first_index === null && parseInt(D.getAttribute('data-id')) === node){
+                        to_first_index = index;
+                        D.classList.add('dlp-label-active');
+                    }
                 }
             }
             if (checked === true && node === data.key && data.mark !== true) {