mky-vent-base/src/views/vent/monitorManager/compressor/nitrogen.threejs.ts

import * as THREE from 'three';
import { animateCamera, setModalCenter, updateAxisCenter } from '/@/utils/threejs/util';
import UseThree from '../../../../utils/threejs/useThree';
import NitrogenOverground from './nitrogen.dishang.threejs';
import NitrogenUnderground from './nitrogen.dixia.threejs';
import NitrogenFlex from './nitrogen.flex.threejs';
import useEvent from '../../../../utils/threejs/useEvent';
// import * as dat from 'dat.gui';
// const gui = new dat.GUI();
// gui.domElement.style = 'position:absolute;top:100px;left:10px;z-index:99999999999999';

// 模型对象、 文字对象
let model: UseThree | undefined, //
  group: THREE.Object3D | undefined,
  nitrogenObj: NitrogenOverground | undefined,
  nitrogenUndergroundObj: NitrogenUnderground | undefined,
  nitrogenFlexObj: NitrogenFlex | undefined,
  modalType = 'nitrogen';

const { mouseDownFn } = useEvent();

// 鼠标点击、松开事件
const mouseEvent = (event) => {
  if (event.button == 0) {
    mouseDownFn(model as UseThree, group as THREE.Object3D, event, (intersects) => {
      if (modalType === 'nitrogen') {
        nitrogenObj?.mousedownModel.call(nitrogenObj, intersects);
      }
      console.log('摄像头控制信息', model?.orbitControls, model?.camera);
    });
  }
};

/* 添加监控数据 */
export const attachMonitorCards = () => {
  nitrogenUndergroundObj?.addCssText?.call(nitrogenUndergroundObj);
};

export const addText = () => {
  if (modalType === 'nitrogen') {
    return nitrogenObj?.addCssText?.call(nitrogenObj);
  }
};

export const play = () => {
  if (modalType === 'nitrogen') {
    return nitrogenObj?.play.call(nitrogenObj);
  }
};

// 切换风窗类型
export const setModelType = (type, nitrogenNum?) => {
  modalType = type;
  model?.camera?.position.set(-1000, 100, 500);

  return new Promise((resolve) => {
    // 地上模型、地下模型切换
    if (modalType === 'nitrogen' && nitrogenObj && nitrogenObj.group) {
      if (model?.scene?.getObjectByName('nitrogenUnderground') && nitrogenUndergroundObj && nitrogenUndergroundObj.group) {
        model.scene.remove(nitrogenUndergroundObj.group);
        nitrogenUndergroundObj.clearCssText();
      }
      if (nitrogenNum) {
        nitrogenObj.nitrogenNum = nitrogenNum;
        const flag = nitrogenNum % 2 == 0 ? 0 : 1;
        const currentNitrogenNum = nitrogenObj.group.children.length - 2;
        // 判断地上注氮机的机数
        if (currentNitrogenNum < nitrogenNum) {
          for (let i = 0; i < nitrogenNum; i++) {
            let nitrogenModal = nitrogenObj.group.getObjectByName('nitrogenModal' + i) as THREE.Object3D;
            if (!nitrogenModal) {
              nitrogenModal = nitrogenObj.nitrogenGroup[i];
              nitrogenObj.group.add(nitrogenModal);
            }
            const c = Math.floor(nitrogenNum / 2);
            if (flag) {
              nitrogenModal.position.set(0, 0, 1.355 * (c - i));
            } else {
              nitrogenModal.position.set(0, 0, (c - i - 0.5) * 1.355);
            }
          }
        } else if (currentNitrogenNum > nitrogenNum) {
          for (let i = nitrogenNum - 1; i < nitrogenNum; i++) {
            const nitrogenModal = nitrogenObj.group.getObjectByName('nitrogenModal' + i) as THREE.Object3D;
            nitrogenObj.group.remove(nitrogenModal);
          }
        } else {
        }
        setModalCenter(nitrogenObj.group);
        nitrogenObj.addCssText();
        nitrogenObj.setModalPosition();
      }
      group = nitrogenObj.group;
      const oldCameraPosition = { x: -1000, y: 100, z: 500 };
      const oldControlsPosition = { x: -10, y: 10, z: 10 };
      model?.scene?.add(nitrogenObj.group);
      let newCameraPosition = { x: 0, y: 0, z: 0 },
        newControlsPosition = { x: 0, y: 0, z: 0 };
      debugger;
      if (group.children.length == 5) {
        newCameraPosition = { x: 3.4434042980363104, y: 34.06459454762187, z: 106.31900957493957 };
        newControlsPosition = { x: 3.060603700582905, y: -10.818677071155214, z: 6.036159227572685 };
      } else if (group.children.length == 4) {
        newCameraPosition = { x: 3.90030651836962, y: 38.026892031369755, z: 87.12943006242206 };
        newControlsPosition = { x: 3.584174940307743, y: -6.858117412269035, z: 4.311833565101436 };
      } else if (group.children.length == 3) {
        newCameraPosition = { x: 4.033864762820565, y: 46.68282110004381, z: 82.43762902763777 };
        newControlsPosition = { x: 3.7177327628205648, y: 1.7978121000437965, z: -0.37996697236224625 };
      } else if (group.children.length == 6) {
        newCameraPosition = { x: -112.9018092843876, y: 27.56046920110982, z: 1.512031119343565 };
        newControlsPosition = { x: -3.4116337023356875, y: -25.657219350386075, z: 1.0940848922982402 };
      }
      setTimeout(async () => {
        model?.scene?.add(group);
        resolve(null);
        await animateCamera(oldCameraPosition, oldControlsPosition, newCameraPosition, newControlsPosition, model, 0.8);
      }, 300);
    } else if (modalType === 'nitrogenUnderground' && nitrogenUndergroundObj && nitrogenUndergroundObj.group) {
      if (model?.scene?.getObjectByName('nitrogen') && nitrogenObj && nitrogenObj.group) {
        model.scene.remove(nitrogenObj.group);
        nitrogenObj.clearCssText();
      }
      nitrogenUndergroundObj.nitrogenNum = nitrogenNum;
      group = nitrogenUndergroundObj.group;
      nitrogenUndergroundObj.addCssText();
      const oldCameraPosition = { x: -1000, y: 100, z: 500 };
      const oldControlsPosition = { x: -10, y: 10, z: 10 };
      const fitted = nitrogenUndergroundObj.getCameraConfig?.();
      const newCameraPosition = fitted?.camera || { x: 21.7662617168586, y: 65.76772405405443, z: 106.19314654690366 },
        newControlsPosition = fitted?.target || { x: -13.223797639205223, y: 13.119121404116392, z: 0.7650646324543227 };

      setTimeout(async () => {
        model?.scene?.add(group);
        resolve(null);
        await animateCamera(oldCameraPosition, oldControlsPosition, newCameraPosition, newControlsPosition, model, 0.8);
      }, 300);
    } else if (modalType === 'nitrogenFlex' && nitrogenFlexObj && nitrogenFlexObj.group) {
      // 地下管路模型（基底 + 注氮机），与地上模型、地下管网模型三者共存，互不影响
      if (model?.scene?.getObjectByName('nitrogen') && nitrogenObj && nitrogenObj.group) {
        model.scene.remove(nitrogenObj.group);
        nitrogenObj.clearCssText();
      }
      if (model?.scene?.getObjectByName('nitrogenUnderground') && nitrogenUndergroundObj && nitrogenUndergroundObj.group) {
        model.scene.remove(nitrogenUndergroundObj.group);
        nitrogenUndergroundObj.clearCssText();
      }

      // 机数由后端决定（1~3 台），动态增减
      nitrogenFlexObj.setUnitCount(nitrogenNum ?? 3);

      group = nitrogenFlexObj.group;
      const oldCameraPosition = { x: -1000, y: 100, z: 500 };
      const oldControlsPosition = { x: -10, y: 10, z: 10 };
      const { camera, target } = nitrogenFlexObj.getCameraConfig();

      setTimeout(async () => {
        model?.scene?.add(group as THREE.Object3D);
        resolve(null);
        await animateCamera(oldCameraPosition, oldControlsPosition, camera, target, model, 0.8);
      }, 300);
    }
  });
};

/**
 * @param undergroundModelName 地下三维模型名称，默认 nitrogenUnderground
 */
export const mountedThree = (undergroundModelName = 'nitrogenUnderground') => {
  return new Promise(async (resolve) => {
    model = new UseThree('#nitrogen3D', '#nitrogenCss3D');
    model.setEnvMap('test1.hdr');
    model.renderer.toneMappingExposure = 1.0;
    model.canvasContainer?.addEventListener('mousedown', mouseEvent.bind(null));

    nitrogenObj = new NitrogenOverground(model);
    await nitrogenObj.mountedThree(4);

    nitrogenUndergroundObj = new NitrogenUnderground(model, undergroundModelName);
    await nitrogenUndergroundObj.mountedThree();

    // 先展示地下主模型，避免柔性模型资源缺失/缓存异常阻塞整个监控界面
    setModelType('nitrogenUnderground');
    resolve(null);
    model.animate();

    // 地下管路模型（基底 + 注氮机）按需后台加载，失败不影响主界面
    nitrogenFlexObj = new NitrogenFlex(model);
    nitrogenFlexObj.mountedThree().catch((error) => {
      console.warn('[nitrogen] 柔性模型加载失败，已跳过', error);
    });
  });
};

export const destroy = () => {
  if (model) {
    model.isRender = false;
    console.log('场景销毁前信息----------->', model.renderer?.info);
    nitrogenObj?.destroy();
    nitrogenObj = undefined;
    nitrogenUndergroundObj?.destroy();
    nitrogenUndergroundObj = undefined;
    nitrogenFlexObj?.destroy();
    nitrogenFlexObj = undefined;
    group = undefined;
    model.destroy();
    model = undefined;
  }
};