gas-injection/src/views/vent/monitorManager/nitrogen/nitrogen.threejs.ts

import * as THREE from 'three';
import { animateCamera, setModalCenter, updateAxisCenter } from '/@/utils/threejs/util';
import UseThree from '../../../../utils/threejs/useThree';
import useEvent from '../../../../utils/threejs/useEvent';
import Nitrogen from './nitrogen.dishang.threejs';

// 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,
  compressorObj: Nitrogen | undefined,
  modalType = 'compressor';

const { mouseDownFn, mousemoveFn, mouseUpFn } = useEvent();

// 鼠标点击、松开事件
const mouseEvent = (event) => {
  // 单道、 双道
  if (event.button == 0 && model && group) {
    model.canvasContainer?.addEventListener('mousemove', mousemove);
    mouseDownFn(model, group, event, (intersects) => {
      if (modalType === 'compressor') {
        compressorObj?.mousedownModel.call(compressorObj, intersects);
      }
    });
  }
};

const mouseUp = () => {
  if (!model) return;
  mouseUpFn(model);
  model.canvasContainer?.removeEventListener('mousemove', mousemove);
};

const mousemove = () => {
  mousemoveFn();
};

const render = () => {
  if (model && model.isRender) {
    model.animationId = requestAnimationFrame(render.bind(this));
    model.stats?.update();
    if (model.renderEnabled) {
      model.render();
    }
  }
};

/* 添加监控数据 */
export const addText = () => {
  if (!compressorObj) return;
  if (modalType === 'compressor') {
    return compressorObj.addCssText.call(compressorObj);
  }
};

export const play = () => {
  if (modalType === 'compressor' && compressorObj) {
    return compressorObj.play.call(compressorObj);
  }
};

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

  return new Promise((resolve) => {
    // 显示双道风窗
    if (modalType === 'compressor' && compressorObj && compressorObj.group) {
      group = compressorObj.group;

      const oldCameraPosition = { x: -1000, y: 100, z: 500 };
      const oldControlsPosition = { x: 0, y: 0, z: 0 };
      model?.scene?.add(compressorObj.group);

      let newCameraPosition = { x: 0, y: 0, z: 0 },
        newControlsPosition = { x: 0, y: 0, z: 0 };
      if (group.children.length == 6) {
        newCameraPosition = { x: -1.7434040517387115, y: 46.41089142470955, z: 114.33388865672832 };
        newControlsPosition = { x: -1.6994314417499141, y: -12.38981035037152, z: 10.110013648346193 };
      } else if (group.children.length == 5) {
        newCameraPosition = { x: -1.2741159124866441, y: 46.04318455197148, z: 95.25814325750986 };
        newControlsPosition = { x: -1.699431, y: -12.38981, z: -1.699431 };
      } else if (group.children.length == 4) {
        newCameraPosition = { x: -1.7434040517387115, y: 46.41089142470955, z: 114.33388865672832 };
        newControlsPosition = { x: -1.6994314417499141, y: -12.38981035037152, z: 10.110013648346193 };
      } else if (group.children.length == 3) {
        newCameraPosition = { x: -1.2741159124866441, y: 46.04318455197148, z: 70.25814325750986 };
        newControlsPosition = { x: -1.699431, y: -12.38981, z: -1.699431 };
      }

      setTimeout(async () => {
        resolve(null);
        await animateCamera(oldCameraPosition, oldControlsPosition, newCameraPosition, newControlsPosition, model, 0.8);
      }, 300);
    }
  });
};

export const mountedThree = (compressorNum) => {
  return new Promise(async (resolve) => {
    model = new UseThree('#compressor3D', '#compressorCss3D');
    model.setEnvMap('test1');
    model.renderer.toneMappingExposure = 1.0;
    model.canvasContainer?.addEventListener('mousedown', mouseEvent);
    model.canvasContainer?.addEventListener('pointerup', mouseUp);
    compressorObj = new Nitrogen(model);
    await compressorObj.mountedThree(compressorNum);
    setModelType('compressor');
    resolve(null);

    // 添加摄像机辅助

    // const helper = new THREE.CameraHelper(model.camera as THREE.Camera);
    // model?.scene?.add(helper);

    render();
  });
};

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