图层树开发方法（待验证）下拉框选择图片（有bug）

WX

2023-07-21 bf48462e6ce0e0baa899c1c64c24c05290dc77fd

 src/views/layer/layerSet.vue

@@ -74,8 +74,12 @@
          @click="delLayer"
          >删除</el-button
        >
        <el-button type="primary" :icon="Top">向上移动</el-button>
        <el-button type="primary" :icon="Bottom">向下移动</el-button>
        <el-button type="primary" :icon="Top" @click="move(1)"
          >向上移动</el-button
        >
        <el-button type="primary" :icon="Bottom" @click="move(2)"
          >向下移动</el-button
        >
      </div>
      <div class="edit_box_form">
        <el-form :model="form" label-width="120px">
@@ -208,7 +212,7 @@
  }
  var addObj = {
    id: id,
    name: form.name,
    cnName: form.name,
    region: form.region,
    layerUrl: form.layerUrl,
    children: [],
@@ -220,11 +224,13 @@
  }

  if (t == "t") {
    addObj.parentId = selectedObj.value.parentId;
    // console.log(treeRef.value.getNode(selectedObj.value));
    // addObj.parentId = selectedObj.value.parentId;
    treeRef.value.insertAfter(addObj, treeRef.value.getNode(selectedObj.value));
  } else {
    addObj.parentId = selectedNodeId.value;
    // addObj.parentId = selectedNodeId.value;
    treeRef.value.append(addObj, treeRef.value.getNode(selectedObj.value));
  }
  emits("addlayer", addObj);
};
//删除
const delLayer = () => {
@@ -246,6 +252,42 @@
    }
  });
};
//移动
const move = (type) => {
  // let node = treeRef.value.getCurrentNode();
  let node = treeRef.value.getNode(selectedObj.value);
  let data = selectedObj.value;
  // 将变动之前的node备份
  let copyNode = { ...node };
  copyNode.previousSibling = { ...node.previousSibling };
  copyNode.nextSibling = { ...node.nextSibling };
  // window.sessionStorage.setItem("menuNode", CircularJSON.stringify(copyNode));

  if (type === 1) {
    // 上移
    if (node.previousSibling) {
      // 删除原先的node
      treeRef.value.remove(node.data);
      // 拿到copy的node
      // nodeData = CircularJSON.parse(window.sessionStorage.getItem("menuNode"));
      // 复制该node到指定位置(参数：1. 要增加的节点的 data 2. 要增加的节点的后一个节点的 data、key 或者 node)

      treeRef.value.insertBefore(copyNode.data, copyNode.previousSibling.data);
      // window.sessionStorage.removeItem("menuNode");
    } else {
      return ElMessage.warning("该菜单已经是当前层最上级");
    }
  } else {
    // 下移
    if (node.nextSibling) {
      treeRef.value.remove(node.data);
      treeRef.value.insertAfter(copyNode.data, copyNode.nextSibling.data);
    } else {
      return ElMessage.warning("该菜单已经是当前层最下级");
    }
  }
  emits("addlayer", { type: type, id: selectedObj.value.id });
};
</script>

<style lang="less" scoped>