comptree sort

src/modules/editor/components/Viewport/Slider/SliderRight/CompTree.tsx

@@ -30,8 +30,8 @@ export const CompTree = defineComponent({
         let deep = 0;
         function getCompChildren(ids: string[]): TreeItem[] {
           deep += 1;
-          if (deep >2 ) ids = ids.reverse();
-         
+          if (deep > 2) ids = ids.reverse();
+
           return ids.map((id) => {
             const comp = helper.findComp(id) as DesignComp;
             return {
@@ -41,9 +41,7 @@ export const CompTree = defineComponent({
                 compUICtrl.state.components.get(comp.compKey)?.name ||
                 "未命名",
               value: comp.id,
-              children: getCompChildren(
-                comp.getChildIds(),
-              ),
+              children: getCompChildren(comp.getChildIds()),
             };
           });
         }
@@ -65,7 +63,7 @@ export const CompTree = defineComponent({
     const onDrop = (info: any) => {
       const dragNode = info.dragNode; //被拖拽
       const dropNode = info.node; //拖拽落下
-
+      console.log(dragNode);
       const dragKey = dragNode.key;
       const dropKey = dropNode.key;
 
@@ -98,22 +96,22 @@ export const CompTree = defineComponent({
         currParentComp?.children.default?.splice(index as number, 1);
         helper.extendStreamCard(currParentComp?.id || "");
       }
-      actions.pickComp("");
+
       if (!info.dropToGap) {
         parentComp?.children.default == parentComp?.children.default || [];
-        if (currComp.compKey == "Container") {
+        if (dragLevel <= 3) {
           parentComp?.children.default?.unshift(currComp?.id);
         } else {
           parentComp?.children.default?.push(currComp?.id);
         }
         if (currParent?.id != parentComp.id) {
           const len = parentComp?.children.default?.length;
-          const index = currComp.compKey == "Container" ? 0 : len - 1;
-          const revert = currComp.compKey == "Container" ? false : true;
+          const index = dragLevel > 3 ? len - 1 : 0;
+          const revert = dragLevel > 3 ? true : false;
           sortCompInCard(parentComp, index, revert);
         }
       } else {
-        if (currComp.compKey == "Container") {
+        if (dragLevel <= 3) {
           parentComp?.children.default?.splice(
             info.dropPosition,
             0,
@@ -129,12 +127,14 @@ export const CompTree = defineComponent({
         }
 
         if (currParent?.id != parentComp.id) {
-          const revert = currComp.compKey == "Container" ? false : true;
-          sortCompInCard(parentComp, info.dropPosition, revert);
+          const revert = dragLevel > 3 ? true : false;
+          const len = parentComp?.children.default.length - 1;
+          const index = revert ? len - info.dropPosition : info.dropPosition;
+          sortCompInCard(parentComp, index, revert);
         }
       }
       nextTick(() => {
-        actions.pickComp(currComp.id);
+        actions.pickComp(currComp.id, false);
         helper.extendStreamCard(parentComp.id);
       });
     };