BIM绑定

yanzhu-ui-vue3/src/assets/icons/svg/save.svg

@@ -0,0 +1 @@
+<svg class="icon" style="width: 1em;height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3535"><path d="M292.571429 121.904762v243.809524h438.857142V145.578667l170.666667 175.225904V828.952381a73.142857 73.142857 0 0 1-73.142857 73.142857h-97.52381V536.380952H292.571429v365.714286H195.047619a73.142857 73.142857 0 0 1-73.142857-73.142857V195.047619a73.142857 73.142857 0 0 1 73.142857-73.142857h97.52381z m365.714285 512v268.190476H365.714286V633.904762h292.571428z m-48.761904 48.761905h-195.04762v73.142857h195.04762v-73.142857z m48.761904-560.761905v170.666667H365.714286V121.904762h292.571428z" p-id="3536"></path></svg>

yanzhu-ui-vue3/src/views/manage/plan/bimSelectTools.js

@@ -1,353 +0,0 @@
-import { modelTreeAllChild } from "@/api/bim/bim";
-function selectFeature(that, featureId) {
-  let api = bimSelectionDlgApi;
-  if (that.selectItems.includes(featureId)) {
-    api.Feature.setColor(featureId, "rgba(255,255,255,1)");
-    let index = that.selectItems.indexOf(featureId);
-    if (index > -1) {
-      that.selectItems.splice(index, 1);
-    }
-  } else {
-    api.Feature.setColor(featureId, "rgba(255,0,255,1)");
-    if (!that.showMode) {
-      api.Feature.setVisible(featureId, false);
-    }
-    that.selectItems.push(featureId);
-  }
-}
-
-function hideFeatures(that) {
-  let tmps = that.allBimData.filter((it) => it.id != that.plan.id);
-  tmps.forEach((it) => {
-    it.bim.forEach((it) => {
-      hideFeature(that, it);
-    });
-  });
-}
-
-function getHideFeatures(that, checkedKeys) {
-  let result = [];
-  let tmps = that.allBimData.filter((it) => it.id != that.plan.id);
-  tmps.forEach((it) => {
-    it.bim.forEach((it) => {
-      result.push(it);
-    });
-  });
-  if (checkedKeys.length > 0) {
-    tmps = that.allFeatures
-      .filter((d) => !checkedKeys.includes(d.glid))
-      .filter((d) => d != "0")
-      .map((d) => d.featureId);
-    tmps.forEach((d) => {
-      result.push(d);
-    });
-  }
-  return result;
-}
-
-function hideFeature(that, featureId) {
-  let api = bimSelectionDlgApi;
-  api.Feature.setVisible(featureId, false);
-}
-
-function selectSingle(that) {
-  let api = bimSelectionDlgApi;
-  api.Public.clearHandler();
-  api.Feature.getByEvent(true, (n) => {
-    if (n && n["id"]) {
-      let featureId = n.id;
-      let modelId = featureId.split("^")[0];
-      selectFeature(that, featureId);
-    }
-  });
-}
-
-function clearAllSelection(that) {
-  that.$modal.confirm("确定清除所有已选择构件吗？").then(() => {
-    let api = bimSelectionDlgApi;
-    that.selectItems.forEach((d) => {
-      api.Feature.setColor(d, "rgba(255,255,255,1)");
-    });
-    that.selectItems = [];
-    this.selEl++;
-  });
-}
-
-function initBim(that) {
-  let tmps = that.allBimData.filter((it) => it.id == that.plan.id);
-  if (tmps.length > 0) {
-    tmps[0].bim.forEach((it) => {
-      selectFeature(that, it);
-    });
-  }
-}
-
-function getSelectFeatureIds(that) {
-  let tmps = that.allBimData.filter((it) => it.id == that.plan.id);
-  if (tmps.length > 0) {
-    return tmps[0].bim || [];
-  }
-  return [];
-}
-
-// 加载部分模型(计划中绑定的模型)
-function partLoadModel(that) {
-  let featureIds = getSelectFeatureIds(that);
-  let api = bimSelectionDlgApi;
-  let obj = {};
-  for (let i = 0; i < featureIds.length; i++) {
-    let it = featureIds[i];
-    let tmps = it.split("^");
-    let modelId = tmps[0];
-    if (!obj[modelId]) {
-      obj[modelId] = [];
-    }
-    obj[modelId].push(it);
-  }
-  for (let modelId in obj) {
-    let tmps = that.models.filter((it) => it.modelId == modelId);
-    setTimeout(() => {
-      that.$refs.tree.setChecked(modelId, true, true);
-    }, 1000);
-    if (tmps.length > 0) {
-      let url = `${window.config.modelUrl}/Tools/output/model/${modelId}/root.glt`;
-      that.partLoad = true;
-      api.Model.addPart(
-        url,
-        modelId,
-        obj[modelId].join("#"),
-        (res) => {},
-        (res) => {
-          that.viewPoint = p;
-          that.$message.info("模型加载完成");
-          that.bimLoaded = true;
-          that.doMenu(2);
-          initBim(that);
-        },
-        {
-          FlyTo: true,
-        }
-      );
-    }
-  }
-  if (featureIds.length == 0) {
-    setTimeout(() => {
-      that.$refs.tree.setChecked("root", true, true);
-    }, 1000);
-
-    loadModels(that);
-    let func = () => {
-      if (that.loadedModelCount == that.models.length) {
-        setTimeout(() => {
-          setFeatueShowOrHide(that, []);
-        }, 1000);
-      } else {
-        setTimeout(func, 100);
-      }
-    };
-    func();
-  }
-}
-
-//构建树形数据
-function buildTreeData(that) {
-  that.modelTrees = [
-    {
-      title: "项目模型",
-      level: 0,
-      type: "root",
-      key: "root",
-      children: [],
-      hadLoad: true,
-    },
-  ];
-  that.models.forEach((d) => {
-    let node = {
-      title: d.modelName,
-      level: 1,
-      type: "model",
-      hasLoad: false,
-      modelId: d.lightweightName,
-      key: d.lightweightName,
-      externalId: "0",
-      glid: "",
-      children: [],
-      data: d,
-    };
-    that.modelTrees[0].children.push(node);
-    getModelFeatures(that, d.lightweightName, node);
-  });
-  that.treeExpendedKeys.push("root");
-  that.$message.info("模型构件信息加载完成");
-}
-
-//获取模型所有构件
-function getModelFeatures(that, modelId, node) {
-  let tmps = that.allBimData.filter((it) => it.id != that.plan.id);
-  tmps.forEach((it) => {
-    it.bim.forEach((it) => {
-      if (!that.readlyParts.includes(it)) {
-        that.readlyParts.push(it);
-      }
-    });
-  });
-  //获取模型构件
-  modelTreeAllChild(modelId, "").then((res) => {
-    let objs = res.data || [];
-
-    objs.forEach((o) => {
-      o.modelId = modelId;
-      o.featureId = o.modelId + "^" + o.externalId;
-      o.name = o.name || "";
-      o.name = o.name.replaceAll('"', "").replaceAll("'", "").replaceAll("\\", "");
-      o.info = `[${o.externalId}]${o.groupname}-${o.name}`;
-      if (o.externalId == "0") {
-        return;
-      }
-      let featureId = o.modelId + "^" + o.externalId;
-      if (!that.allParts.includes(featureId)) {
-        that.allParts.push(featureId);
-      }
-    });
-    that.allFeatures = objs;
-    let makeTree = (tmps) => {
-      tmps.forEach((item) => {
-        item.children = objs.filter((it) => it.pglid == item.glid);
-        if (item.children.length > 0) {
-          makeTree(item.children);
-        }
-        item.hasLoad = true;
-        item.title = item.name;
-        item.key = item.glid;
-        item.modelId = node.modelId;
-      });
-      return tmps;
-    };
-
-    node.children = makeTree(objs.filter((item) => item.level == 0));
-    that.treeKey++;
-  });
-  that.showParts = that.allParts.filter((it) => !that.hideParts.includes(it));
-}
-
-//树上点击事件
-function onCheckTree(that, node, event) {
-  let api = bimSelectionDlgApi;
-
-  if (that.partLoad) {
-    that.$refs.tree.setChecked("root", false, true);
-    that.partLoad = false;
-    that.models.forEach((it) => {
-      api.Model.remove(it.modelId);
-    });
-    return;
-  }
-  if (loadModels(that) > 0) {
-    let func = () => {
-      if (that.loadedModelCount == that.models.length) {
-        setTimeout(() => {
-          setTreeNodeChecked(that, node, event);
-        }, 1000);
-      } else {
-        setTimeout(func, 100);
-      }
-    };
-    func();
-  } else {
-    setTreeNodeChecked(that, node, event);
-  }
-}
-//根据选择控制构件的隐藏和显示
-function setTreeNodeChecked(that, node, event) {
-  let api = bimSelectionDlgApi;
-  let checked = event.checkedNodes.includes(node);
-  if (node.type == "root") {
-    if (checked) {
-      that.models.forEach((it) => {
-        api.Model.setVisible(it.modelId, true);
-        api.Model.original(it.modelId);
-      });
-    } else {
-      that.models.forEach((it) => {
-        api.Model.setVisible(it.modelId, false);
-      });
-    }
-  } else if (node.type == "model") {
-    if (checked) {
-      api.Model.setVisible(node.modelId, true);
-      api.Model.original(node.modelId);
-    } else {
-      api.Model.setVisible(node.modelId, false);
-    }
-  } else {
-    api.Model.original(node.modelId);
-  }
-  setFeatueShowOrHide(that, event.checkedKeys);
-}
-
-//处理构件的隐藏和显示
-function setFeatueShowOrHide(that, checkedKeys) {
-  let api = bimSelectionDlgApi;
-  //隐藏构件
-  let hideFeatures = getHideFeatures(that, checkedKeys);
-  api.Feature.setVisible(hideFeatures.join("#"), false);
-
-  //标注已选择的构件
-  that.selectItems.forEach((it) => {
-    api.Feature.setColor(it, "rgba(255,0,255,1)");
-    if (!that.showMode) {
-      api.Feature.setVisible(it, false);
-    }
-  });
-
-  api.Feature.setVisible(that.hideParts.join("#"), false);
-}
-
-//加载模型
-function loadModels(that) {
-  let api = bimSelectionDlgApi;
-  let modelIds = that.models.map((it) => it.lightweightName);
-  let cnt = 0;
-  that.loadedModelCount = 0;
-  modelIds.forEach((modelId) => {
-    if (!api.m_model.has(modelId)) {
-      cnt++;
-      that.addModel(modelId);
-      return;
-    }
-  });
-  return cnt;
-}
-
-//框选构件
-function boxSelection(that) {
-  let api = bimSelectionDlgApi;
-  api.Feature.boxSelect((data) => {
-    data.forEach((featureId) => {
-      selectFeature(that, featureId);
-    });
-  });
-}
-//隐藏构件选择
-function hideSelection(that) {
-  let api = bimSelectionDlgApi;
-  api.Public.clearHandler();
-  api.Feature.getByEvent(true, (n) => {
-    if (n && n["id"]) {
-      let featureId = n.id;
-      that.hideParts.push(featureId);
-      api.Feature.setVisible(featureId, false);
-      that.hideEl++;
-    }
-  });
-}
-export default {
-  selectSingle,
-  initBim,
-  clearAllSelection,
-  partLoadModel,
-  buildTreeData,
-  onCheckTree,
-  boxSelection,
-  hideSelection,
-};

yanzhu-ui-vue3/src/views/manage/plan/bimSelectTools3.js

@@ -0,0 +1,642 @@
+import { modelTreeAllChild } from "@/api/bim/bim";
+import {
+  getModelTree,
+  getTreeAllLeafChild,
+  getModelFeatureInfo,
+  getModelFeatureInfos,
+  modelTreeAllLeafChildByGlids,
+} from "@/api/bim/bimModel";
+import { MergeArray, DelArray } from "@/utils/index";
+import { ElMessage } from "element-plus";
+function selectFeature(that, featureId) {
+  let api = bimSelectionDlgApi;
+  let featureInfo = getFeatureInfo(that, featureId);
+  let tmps = that.selectItems.filter((f) => f.featureId == featureId);
+  if (tmps.length > 0) {
+    api.Feature.setColor(featureId, "rgba(255,255,255,1)");
+    let index = that.selectItems.indexOf(tmps[0]);
+    if (index > -1) {
+      that.selectItems.splice(index, 1);
+    }
+  } else {
+    api.Feature.setColor(featureId, "rgba(255,0,255,1)");
+    if (!that.showMode) {
+      api.Feature.setVisible(featureId, false);
+    }
+    that.selectItems.push(featureInfo);
+  }
+}
+
+function getHideFeatures(that) {
+  let result = [];
+  that.readlyParts.forEach((d) => {
+    result.push(d);
+  });
+  that.hideFeatures.forEach((d) => {
+    result.push(d);
+  });
+  return result;
+}
+
+function hideFeature(that, featureId) {
+  let api = bimSelectionDlgApi;
+  api.Feature.setVisible(featureId, false);
+}
+
+function selectSingle(that) {
+  let api = bimSelectionDlgApi;
+  api.Public.clearHandler();
+  api.Feature.getByEvent(true, async (n) => {
+    if (n && n["id"]) {
+      let featureId = n.id;
+      let modelId = featureId.split("^")[0];
+      await getServerFeatureInfo(that, featureId);
+      selectFeature(that, featureId);
+    }
+  });
+}
+
+//将模型信息转换为构件信息
+function convertFeatureInfo(o, modelId) {
+  o.modelId = modelId;
+  o.featureId = o.modelId + "^" + o.externalId;
+  o.name = o.name || "";
+  o.name = o.name.replaceAll('"', "").replaceAll("'", "").replaceAll("\\", "");
+  o.info = `[${o.externalId}]${o.groupname}-${o.name}`;
+  return o;
+}
+
+function getFeatureInfo(that, featureId) {
+  let tmps = that.allFeatures.filter((d) => d.featureId == featureId);
+  return tmps.length > 0 ? tmps[0] : null;
+}
+//根据FeatureId获取模型信息，并存入allFeatures数组中
+async function getServerFeatureInfo(that, featureId) {
+  if (getFeatureInfo(that, featureId)) {
+    return;
+  }
+  let tmps = featureId.split("^");
+  if (tmps.length < 2) {
+    return;
+  }
+  let modelId = tmps[0];
+  let externalId = tmps[1];
+  let res = await getModelFeatureInfo(modelId, externalId);
+  convertServerDataToFeatureInfo(that, res, modelId);
+}
+
+function convertServerDataToFeatureInfo(that, res, modelId) {
+  (res.data || []).forEach((o) => {
+    o = convertFeatureInfo(o, modelId);
+    if (o.externalId != "0") {
+      if (!that.allParts.includes(o.featureId)) {
+        that.allParts.push(o.featureId);
+      }
+    }
+    that.allFeatures.push({
+      featureId: o.featureId,
+      info: o.info,
+    });
+  });
+}
+
+async function getServerFeatureInfos(that, ids) {
+  if (ids.length == 0) {
+    return;
+  }
+  let tmps = ids[0].split("^");
+  if (tmps.length < 2) {
+    return;
+  }
+  let modelId = tmps[0];
+  let externalIds = ids.map((it) => it.split("^")[1]);
+  let res = await getModelFeatureInfos(modelId, externalIds);
+  convertServerDataToFeatureInfo(that, res, modelId);
+}
+
+function clearAllSelection(that) {
+  that.$modal.confirm("确定清除所有已选择构件吗？").then(() => {
+    let api = bimSelectionDlgApi;
+    that.selectItems.forEach((d) => {
+      api.Feature.setColor(d.featureId, "rgba(255,255,255,1)");
+    });
+    that.selectItems = [];
+    that.selEl++;
+  });
+}
+
+function initBim(that) {
+  let tmps = that.allBimData.filter((it) => it.id == that.plan.id);
+  if (tmps.length > 0) {
+    tmps[0].bim.forEach((it) => {
+      if (
+        that.allFeatures.filter((f) => f.featureId == it.featureId).length == 0
+      ) {
+        that.allFeatures.push(it);
+      }
+      selectFeature(that, it.featureId);
+    });
+  }
+  tmps = that.allBimData.filter((it) => it.id != that.plan.id);
+  tmps.forEach((it) => {
+    it.bim.forEach((it) => {
+      if (
+        that.readlyParts.filter((f) => f.featureId == it.featureId).length == 0
+      ) {
+        that.readlyParts.push(it.featureId);
+      }
+    });
+  });
+}
+
+function getSelectFeatureIds(that) {
+  let tmps = that.allBimData.filter((it) => it.id == that.plan.id);
+  if (tmps.length > 0) {
+    return tmps[0].bim || [];
+  }
+  return [];
+}
+
+// 加载部分模型(计划中绑定的模型)
+function partLoadModel(that) {
+  let featureInfos = getSelectFeatureIds(that);
+  let api = bimSelectionDlgApi;
+  let obj = {};
+  for (let i = 0; i < featureInfos.length; i++) {
+    let it = featureInfos[i].featureId;
+    let tmps = it.split("^");
+    let modelId = tmps[0];
+    if (!obj[modelId]) {
+      obj[modelId] = [];
+    }
+    obj[modelId].push(it);
+  }
+  for (let modelId in obj) {
+    let tmps = that.models.filter((it) => it.modelId == modelId);
+    setTimeout(() => {
+      that.$refs.tree.setChecked(modelId, true, true);
+    }, 3000);
+    if (tmps.length > 0) {
+      let url = `${window.config.modelUrl}/Tools/output/model/${modelId}/root.glt`;
+      that.partLoad = true;
+      api.Model.addPart(
+        url,
+        modelId,
+        obj[modelId].join("#"),
+        (res) => {},
+        (res) => {
+          setTimeout(() => {
+            if (that.viewPoint) {
+              api.Camera.setViewPort(that.viewPoint);
+            } else {
+              api.Camera.getViewPort((p) => {
+                that.viewPoint = p;
+              });
+            }
+          }, 1000);
+          that.$message.info("模型加载完成");
+          that.bimLoaded = true;
+          that.doMenu(2);
+          initBim(that);
+        },
+        {
+          FlyTo: true,
+        }
+      );
+    }
+  }
+  if (featureInfos.length == 0) {
+    setTimeout(() => {
+      that.$refs.tree.setChecked("root", true, true);
+    }, 3000);
+
+    loadModels(that);
+    initBim(that);
+    let func = () => {
+      if (that.loadedModelCount == that.models.length) {
+        setTimeout(() => {
+          setFeatueShowOrHide(that, []);
+        }, 1000);
+      } else {
+        setTimeout(func, 100);
+      }
+    };
+    func();
+  }
+}
+
+//构建树形数据
+function buildTreeData(that) {
+  that.allFeatures = [];
+  that.models.forEach((d) => {
+    getModelFeatures(that, d.lightweightName);
+  });
+}
+
+//获取模型所有构件
+function getModelFeatures(that, modelId) {
+  //获取模型构件
+  modelTreeAllChild(modelId, "").then((res) => {
+    let objs = res.data || [];
+
+    objs.forEach((o) => {
+      o = convertFeatureInfo(o, modelId);
+      let featureId = o.modelId + "^" + o.externalId;
+      if (!that.allParts.includes(featureId)) {
+        that.allParts.push(featureId);
+      }
+      that.allFeatures.push(o);
+    });
+  });
+}
+
+//树上点击事件
+function onCheckTree(that, node, event) {
+  let api = bimSelectionDlgApi;
+
+  if (that.partLoad) {
+    that.$refs.tree.setChecked("root", false, true);
+    that.partLoad = false;
+    that.models.forEach((it) => {
+      api.Model.remove(it.modelId);
+    });
+    return;
+  }
+  if (loadModels(that) > 0) {
+    let func = () => {
+      if (that.loadedModelCount == that.models.length) {
+        setTimeout(() => {
+          setTreeNodeChecked(that, node, event);
+        }, 1000);
+      } else {
+        setTimeout(func, 100);
+      }
+    };
+    func();
+  } else {
+    setTreeNodeChecked(that, node, event);
+  }
+}
+
+let maxLen = 500;
+//根据选择控制构件的隐藏和显示
+async function setTreeNodeChecked(that, node, event) {
+  let api = bimSelectionDlgApi;
+  let checked = event.checkedNodes.includes(node);
+  if (node.type == "root") {
+    if (checked) {
+      that.models.forEach((it) => {
+        api.Model.setVisible(it.modelId, true);
+        it.visible = true;
+        api.Model.original(it.modelId);
+      });
+    } else {
+      that.models.forEach((it) => {
+        api.Model.setVisible(it.modelId, false);
+        it.visible = false;
+      });
+    }
+  } else if (node.type == "model") {
+    if (checked) {
+      api.Model.setVisible(node.modelId, true);
+      that.models.find((d) => d.modelId == node.modelId).visible = true;
+      api.Model.original(node.modelId);
+    } else {
+      api.Model.setVisible(node.modelId, false);
+      that.models.find((d) => d.modelId == node.modelId).visible = false;
+    }
+  } else {
+    let isPartLoad = false;
+    if (
+      !that.models.find((d) => d.modelId == node.modelId).visible &&
+      checked
+    ) {
+      isPartLoad = true;
+    }
+    let selFeatureIds = [];
+    if (node.leaf) {
+      selFeatureIds = [node.featureId];
+    } else {
+      if (!node.leafs) {
+        let leafs = await getNodeLeafs(that, node);
+        node.leafs = leafs;
+      }
+      selFeatureIds = node.leafs.map((f) => f.featureId);
+    }
+    let selitemsFeatureIds = that.selectItems.map((it) => it.featureId);
+    let tmps = selFeatureIds
+      .filter((it) => !that.hideFeatures.includes(it))
+      .filter((it) => !that.readlyParts.includes(it))
+      .filter((it) => !selitemsFeatureIds.includes(it));
+    if (!checked) {
+      setFeatueVisible(tmps, false);
+    } else {
+      if (isPartLoad) {
+        selitemsFeatureIds.forEach((it) => {
+          tmps.push(it);
+        });
+        if (tmps.length == 0) {
+          return;
+        }
+        let func = () => {
+          let tmpsIds2 = tmps.splice(0, maxLen);
+          api.Feature.showFeatures(tmpsIds2.join("#"));
+          setFeatueVisible(tmps, true);
+        };
+        if (!api.m_model.has(node.modelId)) {
+          that.addModel(node.modelId, func);
+        } else {
+          api.Model.setVisible(node.modelId, true);
+          that.models.find((d) => d.modelId == node.modelId).visible = true;
+          api.Model.original(node.modelId);
+          func();
+        }
+      } else {
+        setFeatueVisible(tmps, true);
+      }
+    }
+  }
+  setFeatueShowOrHide(that);
+}
+
+function setFeatueVisible(featureIds, show) {
+  let len = maxLen;
+  let api = bimSelectionDlgApi;
+  let cnt = featureIds.length;
+  if (cnt == 0) {
+    return;
+  }
+  for (let i = 0; i < cnt; i += len) {
+    api.Feature.setVisible(featureIds.slice(i, i + len).join("#"), show);
+  }
+}
+
+async function getNodeLeafs(that, node) {
+  const res = await getTreeAllLeafChild(node.modelId, node.glid);
+  return (res.data || []).map((f) => {
+    let o = convertFeatureInfo(f, node.modelId);
+    if (o.externalId != "0") {
+      if (!that.allParts.includes(o.featureId)) {
+        that.allParts.push(o.featureId);
+      }
+    }
+    that.allFeatures.push({
+      featureId: o.featureId,
+      info: o.info,
+    });
+    return o;
+  });
+}
+
+//处理构件的隐藏和显示
+function setFeatueShowOrHide(that) {
+  let api = bimSelectionDlgApi;
+  //隐藏构件
+  let hideFeatures = getHideFeatures(that);
+  api.Feature.setVisible(hideFeatures.join("#"), false);
+
+  //标注已选择的构件
+  that.selectItems.forEach((it) => {
+    api.Feature.setColor(it.featureId, "rgba(255,0,255,1)");
+    if (!that.showMode) {
+      api.Feature.setVisible(it, false);
+    }
+  });
+
+  api.Feature.setVisible(that.hideParts.join("#"), false);
+}
+
+//加载模型
+function loadModels(that) {
+  let api = bimSelectionDlgApi;
+  let modelIds = that.models.map((it) => it.lightweightName);
+  let cnt = 0;
+  that.loadedModelCount = 0;
+  modelIds.forEach((modelId) => {
+    if (!api.m_model.has(modelId)) {
+      cnt++;
+      that.addModel(modelId);
+      return;
+    }
+  });
+  return cnt;
+}
+
+//框选构件
+function boxSelection(that) {
+  let api = bimSelectionDlgApi;
+  api.Feature.getByEvent(false);
+  ElMessage.info("右键取消选择");
+  api.Public.event("RIGHT_CLICK", (res) => {
+    api.Feature.closeBoxSelect();
+    that.activeMenu = -1;
+  });
+  api.Feature.boxSelect(async (data) => {
+    await getServerFeatureInfos(that, data);
+    data.forEach((featureId) => {
+      selectFeature(that, featureId);
+    });
+  });
+}
+//隐藏构件选择
+function hideSelection(that) {
+  let api = bimSelectionDlgApi;
+  api.Public.clearHandler();
+  api.Feature.getByEvent(false);
+  api.Feature.getByEvent(true, async (n) => {
+    if (n && n["id"]) {
+      let featureId = n.id;
+      await getServerFeatureInfo(that, featureId);
+      that.hideParts.push(featureId);
+      api.Feature.setVisible(featureId, false);
+      that.hideEl++;
+    }
+  });
+}
+//异步加载树
+function loadNode(that, node, resolve) {
+  if (!that.show) {
+    return;
+  }
+  if (node.level == 0) {
+    let nd = [
+      {
+        title: "项目模型",
+        level: 0,
+        type: "root",
+        key: "root",
+        children: [],
+        hadLoad: true,
+      },
+    ];
+
+    resolve(nd);
+    setTimeout(() => {
+      document
+        .querySelectorAll(".bim-selection-dialog .model-tree .el-tree-node")[0]
+        .click();
+    }, 1000);
+  } else if (node.level == 1) {
+    let nd = [];
+    that.models.forEach((d) => {
+      let mnd = {
+        title: d.modelName,
+        level: 1,
+        type: "model",
+        hasLoad: false,
+        modelId: d.lightweightName,
+        key: d.lightweightName,
+        externalId: "0",
+        glid: "",
+        children: [],
+        data: d,
+      };
+      nd.push(mnd);
+    });
+    resolve(nd);
+  } else {
+    getTreeChildren(that, node, resolve);
+  }
+}
+
+function getTreeChildren(that, node, resolve) {
+  let data = node.data;
+  getModelTree(data.modelId, data.glid).then((d) => {
+    let tmps = (d.data || []).map((it) => {
+      let title = it.externalId == 0 ? it.name : it.externalId;
+      title = title
+        .replaceAll('"', "")
+        .replaceAll("'", "")
+        .replaceAll("\\", "");
+      it.title = title;
+      it.key = it.glid;
+      it.modelId = data.modelId;
+      it.type = "data";
+      it.leaf = +it.externalId != 0;
+      let o = convertFeatureInfo(it, data.modelId);
+      if (
+        that.allFeatures.filter((item) => item.featureId == it.featureId)
+          .length == 0
+      ) {
+        that.allFeatures.push({
+          featureId: it.featureId,
+          info: it.info,
+        });
+      }
+      if (o.externalId != "0") {
+        if (!that.allParts.includes(o.featureId)) {
+          that.allParts.push(o.featureId);
+        }
+      }
+
+      return o;
+    });
+    //addToAllFeatures(that, tmps);
+    resolve(tmps);
+  });
+}
+
+function addToAllFeatures(that, features) {
+  features.forEach((it) => {
+    if (!that.allFeatures.has(it.glid)) {
+      that.allFeatures.push(it);
+    }
+  });
+}
+
+async function selectTreeData(that) {
+  let api = bimSelectionDlgApi;
+  let nodes = that.$refs.tree.getCheckedNodes();
+  if (nodes.length == 0) {
+    return;
+  }
+  let obj = {};
+  nodes.forEach((d) => {
+    let modelId = d.modelId;
+    if (modelId) {
+      if (!obj[modelId]) {
+        obj[modelId] = [];
+      }
+      if (d.glid) {
+        obj[modelId].push(d.glid);
+      }
+    }
+  });
+  for (let modelId in obj) {
+    let glids = obj[modelId];
+    if (glids.length > 0) {
+      let res = await modelTreeAllLeafChildByGlids(modelId, glids);
+      (res.data || []).forEach((o) => {
+        o = convertFeatureInfo(o, modelId);
+        if (o.externalId != "0") {
+          if (!that.allParts.includes(o.featureId)) {
+            that.allParts.push(o.featureId);
+          }
+        }
+        that.allFeatures.push({
+          featureId: o.featureId,
+          info: o.info,
+        });
+        if (
+          !that.selectItems.find((it) => it.featureId == o.featureId) &&
+          !that.readlyParts.includes(o.featureId) &&
+          !that.hideParts.includes(o.featureId)
+        ) {
+          that.selectItems.push(o);
+          api.Feature.setColor(o.featureId, "rgba(255,0,255,1)");
+        }
+      });
+    }
+  }
+}
+
+//构建树数据
+function makePlanTree(that) {
+  let objs = [];
+  const func = (datas) => {
+    datas.forEach((data) => {
+      data.checked = false;
+      data.bim = that.$tryToJson(data.bimId || "[]", []);
+      data.hasBim = data.bim && data.bim.length > 0;
+      data.children = that.planList.filter((it) => it.parentId == data.taskId);
+      func(data.children);
+    });
+    return datas;
+  };
+  objs = func(that.planList.filter((it) => it.parentId == 0));
+  that.planTree = objs;
+  that.planTreeKey++;
+}
+
+//根据选择的计划显示构件
+function showPlanFeatchure(that) {
+  let api = bimSelectionDlgApi;
+  if (that.plan.hasBim) {
+    //已绑定BIM模型 显示已绑定的构件
+    let featureIds = that.plan.bim.map((it) => it.featureId);
+    if (featureIds.length > 0) {
+      let tmpsIds2 = featureIds.splice(0, 1000);
+      api.Feature.showFeatures(tmpsIds2.join("#"));
+      that.selectItems = that.plan.bim.map((it) => it);
+      featureIds = that.plan.bim.map((it) => it.featureId);
+      api.Feature.setColor(featureIds.join("#"), "rgba(255,0,255,1)");
+    }
+  } else {
+    //未绑定BIM模型 显示所有可以绑定的构件
+  }
+}
+
+export default {
+  selectSingle,
+  initBim,
+  clearAllSelection,
+  partLoadModel,
+  buildTreeData,
+  onCheckTree,
+  boxSelection,
+  hideSelection,
+  loadNode,
+  selectTreeData,
+  makePlanTree,
+  showPlanFeatchure,
+};

yanzhu-ui-vue3/src/views/manage/plan/bimSelectionDialog3.vue

@@ -1,5 +1,12 @@
 <template>
-  <el-dialog v-model="show" append-to-body :close-on-click-modal="false" :close-on-press-escape="false" :title="title" modal-class="bim-selection-dialog">
+  <el-dialog
+    v-model="show"
+    append-to-body
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    :title="title"
+    modal-class="bim-selection-dialog"
+  >
     <div id="bimSelectionDlg">
       <div id="bimSelectionDlgContainer" class="bimSelectionDlgContainer"></div>
     </div>
@@ -7,7 +14,7 @@
       <div class="div-left-title">
         <el-tabs v-model="activeTab">
           <el-tab-pane label="结构树" name="a1">
-            <div class="model-tree scroll">
+            <div class="model-tree scroll" :key="treeKey">
               <el-tree
                 :key="treeKey"
                 ref="tree"
@@ -15,16 +22,23 @@
                 :props="{
                   children: 'children',
                   label: 'title',
+                  isLeaf: 'leaf',
                 }"
                 node-key="key"
                 @check="onCheckTree"
-                :data="modelTrees"
+                :load="loadNode"
-                show-checkbox></el-tree>
+                lazy
+                show-checkbox
+              ></el-tree>
             </div>
           </el-tab-pane>
           <el-tab-pane label="已关联" name="a2">
             <div class="sel-list scroll" :key="selEl">
-              <div v-for="(it, idx) in getSelectItems(selectItems)" :key="idx" class="div-sel-item">
+              <div
+                v-for="(it, idx) in selectItems"
+                :key="idx"
+                class="div-sel-item"
+              >
                 <el-tooltip placement="bottom" :content="it.info">
                   <div class="sel-item-info">{{ it.info }}</div>
                 </el-tooltip>
@@ -37,7 +51,11 @@
               <el-button @click="delAllDelList">删除所有</el-button>
             </div>
             <div class="sel-list scroll hide-list" :key="hideEl">
-              <div v-for="(it, idx) in getSelectItems(hideParts)" :key="idx" class="div-sel-item">
+              <div
+                v-for="(it, idx) in getSelectItems(hideParts)"
+                :key="idx"
+                class="div-sel-item"
+              >
                 <el-tooltip placement="bottom" :content="it.info">
                   <div class="sel-item-info">{{ it.info }}</div>
                 </el-tooltip>
@@ -47,64 +65,155 @@
           </el-tab-pane>
         </el-tabs>
         <div class="div-icon">
-          <el-icon v-show="leftExpend" @click="leftExpend = false"><ArrowUpBold /></el-icon>
+          <el-icon v-show="leftExpend" @click="leftExpend = false">
-          <el-icon v-show="!leftExpend" @click="leftExpend = true"><ArrowDownBold /></el-icon>
+            <ArrowUpBold />
+          </el-icon>
+          <el-icon v-show="!leftExpend" @click="leftExpend = true">
+            <ArrowDownBold />
+          </el-icon>
         </div>
       </div>
     </div>
+    <div class="div-left plan-list" :class="{ 'plan-hide': !showPlan }">
+      <span class="plan-tree-icon" @click="showPlan = !showPlan">
+        <svg-icon icon-class="tree" />
+      </span>
+      <div v-if="!showPlan" class="plan-info">
+        <span v-if="plan" class="bind-bim" :class="{ 'has-bim': plan.hasBim }">
+          {{ plan.taskName }}[{{ plan.hasBim ? "已" : "未" }}绑定]
+        </span>
+        <span v-else>无选择数据</span>
+      </div>
+      <div class="plan-tree scroll" :key="planTreeKey" v-if="showPlan">
+        <el-tree
+          ref="planTree"
+          :data="planTree"
+          node-key="id"
+          :props="{
+            children: 'children',
+            label: 'taskName',
+            isLeaf: 'leaf',
+          }"
+          default-expand-all
+        >
+          <template #default="{ node, data }">
+            <span class="custom-tree-node" @click="nodeClick(node, data)">
+              <span>{{ node.label }}</span>
+              <span
+                v-if="node.isLeaf"
+                class="bind-bim"
+                :class="{ 'has-bim': data.hasBim }"
+              >
+                <svg-icon icon-class="position" style="cursor: pointer" />
+                [{{ data.hasBim ? "已" : "未" }}绑定]
+                <svg-icon
+                  v-if="data.checked"
+                  icon-class="checkbox"
+                  style="cursor: pointer"
+                />
+              </span>
+            </span>
+          </template>
+        </el-tree>
+      </div>
+    </div>
     <div v-show="bimLoaded">
       <div class="footer-box" v-if="models.length > 0">
         <el-tooltip placement="top" content="主视图">
-          <div class="footer-btn" @click="doMenu(0)" :class="activeMenu == 0 ? 'is-active' : ''">
+          <div
+            class="footer-btn"
+            @click="doMenu(0)"
+            :class="activeMenu == 0 ? 'is-active' : ''"
+          >
             <svg-icon icon-class="home" />
           </div>
         </el-tooltip>
         <el-tooltip placement="top" content="取消所有关联">
-          <div class="footer-btn" @click="doMenu(1)" :class="activeMenu == 1 ? 'is-active' : ''">
+          <div
+            class="footer-btn"
+            @click="doMenu(1)"
+            :class="activeMenu == 1 ? 'is-active' : ''"
+          >
             <svg-icon icon-class="cancel" />
           </div>
         </el-tooltip>
         <el-tooltip placement="top" content="点选">
-          <div class="footer-btn" @click="doMenu(2)" :class="activeMenu == 2 ? 'is-active' : ''">
+          <div
+            class="footer-btn"
+            @click="doMenu(2)"
+            :class="activeMenu == 2 ? 'is-active' : ''"
+          >
             <svg-icon icon-class="pointselect" />
           </div>
         </el-tooltip>
         <el-tooltip placement="top" content="框选">
-          <div class="footer-btn" @click="doMenu(3)" :class="activeMenu == 3 ? 'is-active' : ''">
+          <div
+            class="footer-btn"
+            @click="doMenu(3)"
+            :class="activeMenu == 3 ? 'is-active' : ''"
+          >
             <svg-icon icon-class="boundselect" />
           </div>
         </el-tooltip>
+        <el-tooltip placement="top" content="全选树上所有已选择构件">
+          <div
+            class="footer-btn"
+            @click="doMenu(5)"
+            :class="activeMenu == 5 ? 'is-active' : ''"
+          >
+            <svg-icon icon-class="skill" />
+          </div>
+        </el-tooltip>
         <el-tooltip placement="top" content="隐藏构件">
-          <div class="footer-btn" @click="doMenu(4)" :class="activeMenu == 4 ? 'is-active' : ''">
+          <div
+            class="footer-btn"
+            @click="doMenu(4)"
+            :class="activeMenu == 4 ? 'is-active' : ''"
+          >
             <svg-icon icon-class="hide" />
           </div>
         </el-tooltip>
+        <el-tooltip placement="top" content="保存绑定">
+          <div
+            class="footer-btn"
+            @click="doMenu(6)"
+            :class="activeMenu == 6 ? 'is-active' : ''"
+          >
+            <svg-icon icon-class="save" />
+          </div>
+        </el-tooltip>
       </div>
     </div>
 
     <div class="div-mode">
-      <el-switch v-model="showMode" class="ml-2" inline-prompt active-text="显示模式" inactive-text="隐藏模式" @change="doModeChange" style="--el-switch-off-color: #336699" />
+      <el-switch
+        v-model="showMode"
+        class="ml-2"
+        inline-prompt
+        active-text="显示模式"
+        inactive-text="隐藏模式"
+        @change="doModeChange"
+        style="--el-switch-off-color: #336699"
+      />
     </div>
-    <template #footer>
-      <div class="dialog-footer">
-        <el-button @click="show = false">取消</el-button>
-        <el-button type="primary" @click="doSave"> 保存构件 </el-button>
-      </div>
-    </template>
   </el-dialog>
 </template>
 <script>
 import useUserStore from "@/store/modules/user";
 import { listBimModel } from "@/api/bim/bimModel";
-import bimTools from "./bimSelectTools";
+import bimTools from "./bimSelectTools3";
-import { updateBimInfo, getPlanAllBimInfo } from "@/api/bim/bim";
+import {
-import { ElMessage, ElMessageBox } from "element-plus";
+  updateBimInfo,
+  getPlanAllBimInfo,
+  getDefaultViewPoint,
+} from "@/api/bim/bim";
+import { ElMessage, ElMessageBox, ElStep } from "element-plus";
 export default {
   data() {
     return {
       title: "任务计划绑定BIM",
       bimLoaded: false,
-      loadedModelCount:0,
+      loadedModelCount: 0,
       show: false,
       partLoad: false, //部分加载构件
       plan: null,
@@ -116,6 +225,7 @@ export default {
       initSuccess: false,
       leftExpend: true,
       activeMenu: 0,
+      treeKey: 0,
       elId: 0,
       selEl: 0,
       hideEl: 0,
@@ -123,12 +233,18 @@ export default {
       selectItems: [],
       allBimData: [],
       treeKey: 0,
+      planTreeKey: 0,
       modelTrees: [],
-      treeExpendedKeys: [],
+      planList: [],
+      planTree: [],
+      showPlan: true,
+      treeExpendedKeys: ["root"],
       allFeatures: [], //所有构件集合
       allParts: [], //所有构件ID集合
       showParts: [], //显示构件ID集合
-      readlyParts: [], //隐藏构件ID集合
+      hideParts: [], //隐藏构件ID集合(通过工具栏选中的)
+      hideFeatures: [], //隐藏构件集合(通过树型控制隐藏的)
+      readlyParts: [], //隐藏构件ID集合(其他的计划已选中的构件)
     };
   },
   beforeDestroy() {
@@ -140,6 +256,19 @@ export default {
     }
   },
   methods: {
+    nodeClick(node, data) {
+      if (!node.isLeaf) {
+        return;
+      }
+      this.planList.forEach((it) => {
+        it.checked = it == data;
+      });
+      this.plan = data;
+      bimTools.showPlanFeatchure(this);
+    },
+    loadNode(node, resolve) {
+      bimTools.loadNode(this, node, resolve);
+    },
     delAllDelList() {
       this.$modal.confirm("确定删除吗？").then(() => {
         let api = bimSelectionDlgApi;
@@ -157,7 +286,10 @@ export default {
     },
     doModeChange() {
       let api = bimSelectionDlgApi;
-      api.Feature.setVisible(this.selectItems.join("#"), this.showMode);
+      api.Feature.setVisible(
+        this.selectItems.map((f) => f.featureId).join("#"),
+        this.showMode
+      );
     },
     delSelectItem(idx) {
       this.$modal.confirm("确定删除吗？").then(() => {
@@ -179,7 +311,8 @@ export default {
     doSave() {
       updateBimInfo({
         id: this.plan.id,
-        text: this.selectItems.length > 0 ? JSON.stringify(this.selectItems) : "",
+        text:
+          this.selectItems.length > 0 ? JSON.stringify(this.selectItems) : "",
       }).then((res) => {
         if (res.success) {
           ElMessage.success("保存成功");
@@ -217,11 +350,15 @@ export default {
           this.activeMenu = 4;
           bimTools.hideSelection(this);
           break;
+        case 5:
+          bimTools.selectTreeData(this);
+          break;
       }
     },
-    showDialog(plan) {
+    showDialog(planList) {
       window.bimDlg = this;
-      this.plan = plan;
+      this.planList = planList;
+
       this.show = true;
       this.activeTab = "a1";
       this.userStore = useUserStore();
@@ -235,6 +372,7 @@ export default {
       this.treeExpendedKeys = [];
       this.allParts = [];
       this.hideParts = [];
+      this.hideFeatures = [];
       this.readlyParts = [];
       this.allFeatures = [];
       this.bimLoaded = false;
@@ -242,14 +380,10 @@ export default {
       this.elId = 0;
       this.hideEl = 0;
       this.showMode = true;
-      this.loadedModelCount=0
+      this.loadedModelCount = 0;
 
-      getPlanAllBimInfo(this.plan.projectId).then((res) => {
+      bimTools.makePlanTree(this);
-        this.allBimData = (res.data || []).map((it) => {
+      this.allBimData = this.planList.filter((d) => d.hasBim);
-          it.bim = this.$tryToJson(it.bimId || "[]", []);
-          return it;
-        });
-      });
       this.initEngine();
     },
     initEngine() {
@@ -281,12 +415,12 @@ export default {
           let mapOptions = {
             imgs: {
               // 六面图片
-              top: "./img/top.png",
+              top: "/cdn/bim/sapi/img/top.png",
-              bottom: "./img/under.png",
+              bottom: "/cdn/bim/sapi/img/under.png",
-              east: "./img/east.png",
+              east: "/cdn/bim/sapi/img/east.png",
-              south: "./img/south.png",
+              south: "/cdn/bim/sapi/img/south.png",
-              west: "./img/west.png",
+              west: "/cdn/bim/sapi/img/west.png",
-              north: "./img/north.png",
+              north: "/cdn/bim/sapi/img/north.png",
             },
             offset: {
               // 屏幕坐标偏移
@@ -312,6 +446,16 @@ export default {
     },
 
     initLoadModel() {
+      getDefaultViewPoint(this.currentPrjId, 1).then((d) => {
+        let pt = "";
+        if (d.data && d.data.length > 0) {
+          pt = d.data[0].viewPosition;
+          pt = this.$tryToJson(pt, null);
+        }
+        if (pt) {
+          this.viewPoint = pt;
+        }
+      });
       listBimModel({
         pageNum: 1,
         pageSize: 10,
@@ -320,20 +464,30 @@ export default {
       }).then((d) => {
         this.models = (d.rows || []).map((it) => {
           it.modelId = it.lightweightName;
+          it.visible = false;
+          it.checked = true;
           it.gis = this.$tryToJson(it.gisJson || "{}", {});
           return it;
         });
+
+        this.treeKey++;
         if (this.models.length == 0) {
           this.$modal.msgError("暂无模型，请先关联模型");
         } else {
-          bimTools.buildTreeData(this);
+          this.models.forEach((it) => {
-          bimTools.partLoadModel(this);
+            this.addModel(it.modelId, () => {
+              this.$refs.tree.setChecked(it.modelId, true);
+            });
+          });
+          this.$refs.tree.setChecked("root", true);
         }
       });
     },
     addModel(modelId, cb) {
       let url = `${window.config.modelUrl}/Tools/output/model/${modelId}/root.glt`;
-      bimSelectionDlgApi.Model.add(
+      this.models.find((d) => d.modelId == modelId).visible = true;
+      let api = bimSelectionDlgApi;
+      api.Model.add(
         url,
         modelId,
         () => {},
@@ -342,12 +496,16 @@ export default {
           console.log("加载模型成功");
           this.loadedModelCount++;
           setTimeout(() => {
-            bimSelectionDlgApi.Camera.getViewPort((p) => {
+            if (this.viewPoint) {
-              this.viewPoint = p;
+              api.Camera.setViewPort(this.viewPoint);
-              this.$message.info("模型加载完成");
+            } else {
-              this.bimLoaded = true;
+              api.Camera.getViewPort((p) => {
-              this.doMenu(2);
+                this.viewPoint = p;
-            });
+              });
+            }
+            this.$message.info("模型加载完成");
+            this.bimLoaded = true;
+            this.doMenu(2);
           }, 1000);
         }
       );
@@ -356,6 +514,7 @@ export default {
       let api = bimSelectionDlgApi;
       api.Camera.stopImmersiveRoam();
       api.Model.location(api.m_model.keys().toArray()[0]);
+      api.Feature.getByEvent(false);
       api.Plugin.deleteMiniMap();
       if (this.viewPoint) {
         api.Camera.setViewPort(this.viewPoint);
@@ -370,16 +529,20 @@ export default {
     min-width: 960px;
     width: 80%;
     height: 80vh;
+
     .el-dialog__body {
-      max-height: calc(100% - 80px) !important;
+      max-height: calc(100% - 40px) !important;
       overflow: hidden !important;
-      height: calc(100% - 80px);
+      height: calc(100% - 40px);
+
       #bimSelectionDlg {
         height: 100%;
+
         .bimSelectionDlgContainer {
           height: 100%;
         }
       }
+
       .div-left {
         position: absolute;
         left: 40px;
@@ -388,49 +551,97 @@ export default {
         background: rgba(0, 57, 64, 0.6);
         height: calc(100% - 180px);
         border-radius: 5px;
-        &.is-hide {
+
-          height: 45px;
+        &.plan-list {
+          left: unset;
+          right: 96px;
+          &.plan-hide {
+            height: 40px;
+            .plan-tree-icon {
+              right: 5px;
+              top: 5px;
+            }
+            .plan-info {
+              color: #fff;
+              line-height: 40px;
+              padding-left: 20px;
+              .bind-bim {
+                color: #2cff00;
+                &.has-bim {
+                  color: #edfd06;
+                  font-weight: bold;
+                }
+              }
+            }
+          }
+          .plan-tree-icon {
+            position: absolute;
+            right: 10px;
+            top: 10px;
+            z-index: 999;
+            cursor: pointer;
+            .svg-icon {
+              width: 30px;
+              height: 30px;
+              fill: #2cff00;
+            }
+          }
         }
+
+        &.is-hide {
+          height: 54px;
+        }
+
         .div-left-title {
           height: 100%;
+
           .el-tabs {
             height: 100%;
+
             .el-tabs__content {
               height: 100%;
+
               .el-tab-pane {
                 height: 100%;
                 padding-bottom: 10px;
               }
             }
           }
+
           .el-tabs__nav-wrap {
             .el-tabs__nav-prev,
             .el-tabs__nav-next {
               display: none;
             }
           }
+
           .el-tabs__nav {
             &::after {
               content: " ";
               display: block;
               width: 100px;
             }
+
             .el-tabs__active-bar {
               background-color: rgb(0, 255, 174);
             }
+
             .el-tabs__item {
               padding: 0px 15px;
               color: #fff;
+
               &.is-active {
                 color: rgb(0, 255, 174);
               }
             }
           }
+
           .div-icon {
             position: absolute;
             right: 10px;
             top: 8px;
             z-index: 9;
+
             .el-icon {
               font-size: 24px;
               color: #fff;
@@ -444,7 +655,7 @@ export default {
       position: absolute;
       bottom: 6vh;
       left: 50%;
-      margin-left: -75px;
+      margin-left: -120px;
       background: #274754;
       border-radius: 4px;
 
@@ -473,13 +684,16 @@ export default {
         }
       }
     }
+
     .sel-list {
       padding: 0px 10px 10px;
       height: 100%;
       overflow-y: auto;
+
       &.hide-list {
         height: calc(100% - 40px);
       }
+
       .div-sel-item {
         background-color: #f7f7f975;
         position: relative;
@@ -487,6 +701,7 @@ export default {
         line-height: 30px;
         padding: 0px 10px;
         margin-top: 5px;
+
         .sel-item-info {
           width: calc(100% - 40px);
           overflow: hidden;
@@ -494,6 +709,7 @@ export default {
           white-space: nowrap;
           cursor: pointer;
         }
+
         .el-button {
           position: absolute;
           right: 10px;
@@ -503,34 +719,65 @@ export default {
       }
     }
 
+    .plan-tree {
+      height: calc(100% - 0px);
+    }
     .model-tree {
       height: calc(100% - 36px);
+    }
+    .model-tree,
+    .plan-tree {
       overflow-y: auto;
+
       .el-tree {
         background: transparent;
         color: #eee;
+
         .el-checkbox {
           color: #45fdfe;
         }
+        .custom-tree-node {
+          cursor: pointer;
+        }
+        .bind-bim {
+          cursor: pointer;
+          font-size: 12px;
+          color: #2cff00;
+          &.has-bim {
+            color: #edfd06;
+            font-weight: bold;
+          }
+          .svg-icon {
+            color: #45fdfe;
+          }
+        }
+        .el-text {
+          color: #fff;
+        }
+
         .el-tree-node {
           &:focus {
             & > .el-tree-node__content {
               background: #3489d966;
+
               &:hover {
                 background: #3489d966;
               }
             }
           }
+
           .el-tree-node__content:hover {
             background: #3489d966;
           }
         }
       }
     }
+
     .div-mode {
       position: absolute;
       left: 360px;
       top: 75px;
+
       .el-switch__inner {
         margin: 0px 4px;
       }

yanzhu-ui-vue3/src/views/manage/plan/index.vue

@@ -1,13 +1,34 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+    <el-form
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="68px"
+    >
       <el-form-item label="项目" prop="projectId">
-        <el-select :disabled="data.projectId?true:false" v-model="queryParams.projectId" placeholder="请选择项目" style="width: 192px" clearable @change="handleQuery">
+        <el-select
-          <el-option v-for="prj in data.projects" :key="prj.id" :label="prj.projectName" :value="prj.id"> </el-option>
+          :disabled="data.projectId ? true : false"
+          v-model="queryParams.projectId"
+          placeholder="请选择项目"
+          style="width: 192px"
+          clearable
+          @change="handleQuery"
+        >
+          <el-option
+            v-for="prj in data.projects"
+            :key="prj.id"
+            :label="prj.projectName"
+            :value="prj.id"
+          >
+          </el-option>
         </el-select>
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        <el-button type="primary" icon="Search" @click="handleQuery"
+          >搜索</el-button
+        >
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -27,60 +48,150 @@
       </el-col>
       -->
       <el-col :span="1.5">
-        <el-upload ref="uploadRef" :limit="1" accept=".mpp" :headers="upload.headers" :action="upload.url + '?compId=' + data.compId + '&projectId=' + queryParams.projectId" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="true">
+        <el-upload
-          <el-button type="primary" v-loading="upload.isUploading">导入(Project)</el-button>
+          ref="uploadRef"
+          :limit="1"
+          accept=".mpp"
+          :headers="upload.headers"
+          :action="
+            upload.url +
+            '?compId=' +
+            data.compId +
+            '&projectId=' +
+            queryParams.projectId
+          "
+          :disabled="upload.isUploading"
+          :on-progress="handleFileUploadProgress"
+          :on-success="handleFileSuccess"
+          :auto-upload="true"
+        >
+          <el-button type="primary" v-loading="upload.isUploading"
+            >导入(Project)</el-button
+          >
         </el-upload>
       </el-col>
       <el-col :span="1.5" v-if="planList.length > 0">
-        <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['manage:plan:export']">导出(Project)</el-button>
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['manage:plan:export']"
+          >导出(Project)</el-button
+        >
+        <el-button @click="handleBindBim" v-if="planList.length > 0"
+          >关联Bim</el-button
+        >
       </el-col>
-      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList" v-if="1 == 2"></right-toolbar>
+      <right-toolbar
+        :showSearch="showSearch"
+        @queryTable="getList"
+        v-if="1 == 2"
+      ></right-toolbar>
     </el-row>
 
-    <el-table v-loading="loading" :data="planList" row-key="taskId" default-expand-all>
+    <el-table
+      v-loading="loading"
+      :data="planList"
+      row-key="taskId"
+      default-expand-all
+    >
       <el-table-column label="任务名称" align="left" prop="taskName" />
-      <el-table-column label="任务工期" align="center" prop="taskDuation" width="120">
+      <el-table-column
+        label="任务工期"
+        align="center"
+        prop="taskDuation"
+        width="120"
+      >
         <template #default="scope">{{ scope.row.taskDuation }}d</template>
       </el-table-column>
-      <el-table-column label="计划开始时间" align="center" prop="planStartDate" width="180">
+      <el-table-column
+        label="计划开始时间"
+        align="center"
+        prop="planStartDate"
+        width="180"
+      >
         <template #default="scope">
           <span>{{ parseTime(scope.row.planStartDate, "{y}-{m}-{d}") }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="计划结束时间" align="center" prop="planFinishDate" width="180">
+      <el-table-column
+        label="计划结束时间"
+        align="center"
+        prop="planFinishDate"
+        width="180"
+      >
         <template #default="scope">
           <span>{{ parseTime(scope.row.planFinishDate, "{y}-{m}-{d}") }}</span>
         </template>
       </el-table-column>
       <el-table-column label="BIM ID" align="center" prop="bimId" width="120">
         <template #default="scope">
-          <template v-if="!scope.row.children||scope.row.children.length==0">
+          <template
-          <span @click="handleBim(scope.row)" style="color: red" v-if="scope.row.bimId">已关联BIM</span>
+            v-if="!scope.row.children || scope.row.children.length == 0"
-          <span @click="handleBim(scope.row)" v-else style="color: #8e9aaf">未关联BIM</span>
+          >
-          <span @click="handleBim(scope.row)" style="margin-left: 8px; cursor: pointer">
+            <span
-            <el-tooltip append-to="" content="关联BIM模型" placement="top">
+              @click="handleBim(scope.row)"
-              <span>
+              style="color: red"
-              <svg-icon icon-class="position" style="cursor: pointer" class="icon-blue" @click="handleBim(scope.row)" />
+              v-if="scope.row.bimId"
-              </span>
+              >已关联BIM</span
-            </el-tooltip>
+            >
-          </span>
+            <span @click="handleBim(scope.row)" v-else style="color: #8e9aaf"
+              >未关联BIM</span
+            >
+            <span
+              @click="handleBim(scope.row)"
+              style="margin-left: 8px; cursor: pointer"
+            >
+              <el-tooltip append-to="" content="关联BIM模型" placement="top">
+                <span>
+                  <svg-icon
+                    icon-class="position"
+                    style="cursor: pointer"
+                    class="icon-blue"
+                    @click="handleBim(scope.row)"
+                  />
+                </span>
+              </el-tooltip>
+            </span>
           </template>
         </template>
       </el-table-column>
 
-      <el-table-column label="负责人" align="center" prop="operator" width="120" />
+      <el-table-column
-      <el-table-column label="班组名称" align="center" prop="groupName" width="120" />
+        label="负责人"
+        align="center"
+        prop="operator"
+        width="120"
+      />
+      <el-table-column
+        label="班组名称"
+        align="center"
+        prop="groupName"
+        width="120"
+      />
     </el-table>
-    <bim-selection-dialog ref="bimDlg" @success="doSelectSuccess"></bim-selection-dialog>
+    <bim-selection-dialog
+      ref="bimDlg"
+      @success="doSelectSuccess"
+    ></bim-selection-dialog>
+    <bim-selection-dialog3 ref="bimDlg3" @success="doSelectSuccess" />
   </div>
 </template>
 
 <script setup name="Plan">
 import { getToken } from "@/utils/auth";
-import { listPlan, getPlan, delPlan, addPlan, updatePlan } from "@/api/manage/plan";
+import {
+  listPlan,
+  getPlan,
+  delPlan,
+  addPlan,
+  updatePlan,
+} from "@/api/manage/plan";
 import useUserStore from "@/store/modules/user";
 import { findMyProjectList } from "@/api/publics";
 import bimSelectionDialog from "./bimSelectionDialog2.vue";
+import bimSelectionDialog3 from "./bimSelectionDialog3.vue";
 const { proxy } = getCurrentInstance();
 const userStore = useUserStore();
 const planList = ref([]);
@@ -94,6 +205,7 @@ const total = ref(0);
 const title = ref("");
 const uploadRef = ref();
 const bimDlg = ref();
+const bimDlg3 = ref();
 /*** 用户导入参数 */
 const upload = reactive({
   // 是否显示弹出层（用户导入）
@@ -139,11 +251,12 @@ const data = reactive({
   rules: {},
   compId: "",
   projectId: "",
+  planAll: [],
 });
 
 const { queryParams, form, rules } = toRefs(data);
 
-function doSelectSuccess(){
+function doSelectSuccess() {
   handleQuery();
 }
 function buildTree(all, id) {
@@ -168,6 +281,7 @@ function getList() {
   listPlan(queryParams.value).then((response) => {
     let tmps = response.data || [];
     let objs = buildTree(tmps, 0);
+    data.planAll = tmps;
     planList.value = objs;
     loading.value = false;
   });
@@ -177,6 +291,9 @@ function handleBim(row) {
   bimDlg.value.showDialog(row);
 }
 
+function handleBindBim() {
+  bimDlg3.value.showDialog(data.planAll);
+}
 /** 查询项目列表 */
 function getProjectList() {
   findMyProjectList({ pageNum: 1, pageSize: 100 }).then((response) => {