feat:add_layerchange

src/services/common.ts

@@ -843,7 +843,7 @@ export const getPenTree = () => {
     const elem = calcElem(item);
     elem && list.push(elem);
   }
-  tree.list = list;
+  tree.list = list.reverse();
 
   return tree.list;
 };

src/views/components/ElementTree.vue

@@ -190,6 +190,7 @@ onMounted(() => {
   meta2d.on('combine', getTree);
   meta2d.on('click', getActived);
   meta2d.on('paste', getActived);
+  meta2d.on('layer', layerChange);
 
   if (inTreePanel.timer) {
     clearTimeout(inTreePanel.timer);
@@ -212,6 +213,16 @@ const getTree = () => {
   data.tree = getPenTree();
 };
 
+const layerChange = () =>{
+  getTree();
+  setTimeout(() => {
+    if(meta2d.store.active&&meta2d.store.active[0]){
+      let index = data.tree.findIndex((item) => item.value === meta2d.store.active[0].id);
+      tree.value?.scrollToElement({index:index-5});
+    }
+  }, 500);
+}
+
 const getHiddenGroups = () => {
   data.groups.forEach((item) => {
     if (
@@ -245,8 +256,9 @@ const getActived = () => {
       //   );
       //   element && element.scrollIntoView({ block: 'center' });
       // }, 500);
-      let pens = meta2d.store.data.pens.filter((pen) => !pen.parentId);
-      let index = pens.findIndex((item) => item.id === meta2d.store.active[0].id);
+      // let pens = meta2d.store.data.pens.filter((pen) => !pen.parentId);
+      // let index = pens.findIndex((item) => item.id === meta2d.store.active[0].id);
+      let index = data.tree.findIndex((item) => item.value === meta2d.store.active[0].id);
       tree.value?.scrollToElement({index:index-5});
     }
   }
@@ -408,6 +420,7 @@ onBeforeUnmount(() => {
   meta2d.off('combine', getTree);
   meta2d.off('click', getActived);
   meta2d.off('paste', getActived);
+  meta2d.off('layer', layerChange);
 
   inTreePanel.timer = setTimeout(() => {
     inTreePanel.value = false;