<!--
  Description: 综合大屏-信息窗体
  Author: 李亚光
  Date: 2024-07-18
 -->
<script lang="ts" setup name="infoWindow">
const dialogFormVisible = ref(false)
const overlay = ref()
const infoWindow = ref()
// 弹窗展示数据信息
const info = ref()
// 弹窗展示的内容
const flag = ref('')
// 初始化
const initDialog = (e: any) => {
  // console.log(e, '信息窗体接收的数据')
  overlay.value = e.overlay
  infoWindow.value = e.infoWindow
  info.value = e.info
  dialogFormVisible.value = true
  if (e.map) {
    e.map.setZoom(15)
  }
}

// 关闭
const close = () => {
  infoWindow.value?.close()
}

defineExpose({ initDialog, close })
</script>

<template>
  <div v-show="dialogFormVisible" class="container" @mouseleave="() => {}">
    <div class="header">
      <span @click="close">x</span>
    </div>
    <div>
      闸井详情数据
    </div>
  </div>
</template>

<style lang="scss" scoped>
.container {
  width: 360px;
  padding: 0 10px;
  background: rgba($color: #feffff, $alpha: 95%);
  border: 2px solid #79b5e6;
  position: relative;

  .header {
    float: right;
    color: #4875a0;
    font-size: 18px;
    font-weight: 700;

    &:hover {
      cursor: pointer;
      color: #658eb4;
    }
  }
}
</style>