<template>
  <!-- 关于我们对话框 -->
  <el-dialog v-model="visible" width="500" alignCenter draggable showClose destroyOnClose closeOnClickModal closeOnPressEscape>
    <template #header>
      <h3>关于我们</h3>
    </template>
    <div class="about-dialog-content">
      <div class="app-info">
        <img src="@/assets/images/logo/logo.png" alt="" style="width: 82px; margin-bottom: 15px" />
        <h3>智评会议</h3>
        <p>版本: {{ currentVersion }}</p>
      </div>
      <div class="company-info">
        <p>© 2025 群悦智慧. 保留所有权利.</p>
      </div>
    </div>
    <template #footer>
      <el-button type="primary" @click="hide"> 确定 </el-button>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
  import { ref } from 'vue';

  const visible = ref(false);
  const currentVersion = ref('0.0.0'); // 默认版本号

  onMounted(() => {
    // 待使用Tauri API重新实现版本获取
    currentVersion.value = '1.0.0'; // 临时版本号
  });

  /** 显示 */
  function show() {
    visible.value = true;
  }

  /** 隐藏 */
  function hide() {
    visible.value = false;
  }

  defineExpose({
    show,
    hide,
  });
</script>

<style scoped lang="scss">
  .about-dialog-content {
    padding: 15px;
    text-align: center;

    .app-info {
      margin-bottom: 20px;

      h3 {
        margin-bottom: 10px;
      }

      .description {
        margin-top: 10px;
        color: #666666;
      }
    }

    .company-info {
      padding-top: 15px;
      color: #999999;
      border-top: 1px solid #eeeeee;
    }
  }
</style>
