mky-vent-5/src/views/vent/monitorManager/gasPumpMonitor/gasPump.threejs.over.ts

import * as THREE from 'three';

// import * as dat from 'dat.gui';
// const gui = new dat.GUI();
// gui.domElement.style = 'position:absolute;top:100px;left:10px;z-index:99999999999999';

class gasPumpBase {
  model;
  modelName = 'gasPump';
  group: THREE.Object3D | null = null;

  constructor(model) {
    this.model = model;
  }

  addLight() {
    const directionalLight = new THREE.DirectionalLight(0xffffff, 1);
    directionalLight.position.set(-217, 500, -347);
    this.group?.add(directionalLight);
    directionalLight.target = this.group as THREE.Object3D;

    // gui.add(directionalLight.position, 'x', -500, 800);
    // gui.add(directionalLight.position, 'y', -500, 800);
    // gui.add(directionalLight.position, 'z', -500, 800);

    // gui.add(pointLight2.position, 'x', -300, 300);
    // gui.add(pointLight2.position, 'y', -300, 300);
    // gui.add(pointLight2.position, 'z', -300, 300);
  }

  mountedThree() {
    return new Promise((resolve) => {
      this.model.setGLTFModel([this.modelName]).then((gltf) => {
        this.group = gltf[0];
        if (this.group) {
          // this.group?.scale.set(0.1, 0.1, 0.1);
          // this.group.position.y += 40;
          resolve(null);
          this.addLight();
        }
      });
    });
  }

  destroy() {
    this.model.clearGroup(this.group);
    this.model = null;
    this.group = null;
  }
}
export default gasPumpBase;