<template>
  <div class="app-container">
    <div id="container" class="container"></div>
  </div>
</template>

<script>

const isAMRT = () => {
  return new Promise((resolve, reject) => {
    const fun = () => {
      if (typeof AMRT !== "undefined" && AMRT) {
        resolve(true)
      } else {
        setTimeout(fun, 100)
      }
    }
    fun()
  })
}

export default {
  name: "Model",
  data() {
    return {
      viewer: null
    }
  },
  async mounted() {
    await isAMRT()
    const param = {
      appkey: 'aveMPyNWzDJm',
      appsecret: 'rXmhoLAiOPNKzbl7g2qxCV8tFwRdYuZM'
    }
    const viewer = new AMRT.Viewer('container', param)
    console.log(AMRT)
    let num = 0
    let modelArr = [
      '1720315475507941376',
      '1720315479907766272',
      '1720315484513112064',
      '1720315500866703360',
      '1720315558030872576',
      '1720315596551360512',
      '1720315644550975488',
      '1720315648946606080',
      '1720315687114772480',
      '1720315691422322688',
      '1720315722275622912',
      '1720315729129115648',
      '1720315768454909952',
      '1720316275214913536',
      '1720316297822212096',
    ]
    modelArr.forEach(e => {
      let model = viewer.loadModel(e, {
        background: false,
        focus: false,
        id: e,
        onLoad: function (m) {
          num += 1
          if (num === modelArr.length) {
            alert('加载完成');
          }
          m.on('click', function () {
            // console.log(this)
            // console.log(m)
            // let clickModel = model.getObjectById(this)
            // console.log(clickModel)
            // alert(`${e}`)
            // viewer.operator.restore()
            // viewer.operator.translucenceOthers(this.viewer)
          })
        }
      })
    })
    viewer.controls.setTarget(26.3, -19.8, -82)
    viewer.controls.setPosition(31, 1721, 584)
    viewer.operator.enabled = true

    // viewer.controls.startAutoRotate(1)
  },
  methods: {}
};
</script>
<style scoped>
* {
  margin: 0;
  padding: 0
}

.container {
  width: 100vw;
  height: 100vh
}

</style>
