<script setup lang="ts">
// import { usePlatformType } from '@/utils/device'

// 获取设备类型
// const { isMobile } = usePlatformType()

// 跳转URL配置
const jumpUrls = {
  // 机构运营管理平台
  mechanism: {
    pc: 'https://icaring.cn/operation',
    mobile: 'https://icaring.cn/nurse',
    icon:"/images/mechanism.webp",
    type:'mechanism'
  },
  // 居家运营管理平台  
  home: {
    pc: 'https://ky.jinzejk.com/admin/login.php',
    mobile: 'https://icaring.cn/nurse',
    icon: "/images/home.webp",
    type:"home"
  }
}

// 处理图片点击事件
const handleImageClick = (type: 'mechanism' | 'home') => {
  const urls = jumpUrls[type]
  const targetUrl = urls.pc
  
  // 在新窗口打开链接
  window.open(targetUrl, '_blank')
}
</script>

<template>
  <div class="min-h-screen w-full bg-[url('/images/background.webp')] bg-cover bg-center bg-no-repeat font-sans flex flex-col relative overflow-auto">
    <!-- 顶部logo -->
    <div class="flex items-center shrink-0 mt-[2rem] px-10">
      <img src="/images/logo.webp" alt="Logo" class="md:h-[4rem] w-auto h-[8rem]" />
    </div>
    
    <!-- 底部图片区域 -->
    <div class="flex-1 flex items-center justify-center mt-16">
      <div class="w-full flex items-center justify-evenly flex-col md:flex-row overflow-hidden">
        <div v-for="val in jumpUrls" class="flex justify-center items-center cursor-pointer " @click="handleImageClick(val.type as any)">
          <img :src="val.icon" alt="Mechanism" class="w-full h-auto md:max-h-[28rem] object-contain transition-transform duration-300 ease-out overflow-hidden transition-transform duration-300 ease-out hover:scale-105" />
        </div>
      </div>
    </div>
  </div>
</template>
