<template>
  <j-nav-bar/>
  <div ref="root" class="frame" style="height: calc(100vh - 50px - 	46px)">
    <iframe :src="iframeSrc" class="frame-iframe" ref="frameRef"></iframe>
  </div>
</template>

<script lang="ts" setup>
import {ref} from "vue";
import {getSetting} from "@/api";
import {onMounted} from "vue";

const iframeSrc = ref('')
// const iframeSrc = ref('https://chatlink.mstatik.com/widget/standalone.html?eid=329d34187acc7ebda66a12a0671e3d70')


const _getSetting = () => {
  getSetting().then(res => {
    iframeSrc.value = res.chatUrl
  })

}

onMounted(() => {
  _getSetting()
})
</script>

<style lang="scss" scoped>

.frame {
  position: relative;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;

  &-iframe {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border: 0;
    box-sizing: border-box;
  }
}
</style>