import React from 'react'
import { View, Text } from '@tarojs/components'
import { Button } from '@nutui/nutui-react-taro'
import { Link, ArrowRight } from '@nutui/icons-react-taro'
import Taro from '@tarojs/taro'

const PC_ADMIN_URL = 'https://nnlzdmc.websoft.top'

const AdminRedirect: React.FC = () => {
  const handleCopyUrl = () => {
    Taro.setClipboardData({
      data: PC_ADMIN_URL,
      success: () => {
        Taro.showToast({
          title: '链接已复制',
          icon: 'success',
          duration: 2000
        })
      }
    })
  }

  return (
    <View className="min-h-screen bg-gray-100 flex flex-col items-center justify-center px-8">
      {/* 图标区域 */}
      <View
        className="w-20 h-20 rounded-full flex items-center justify-center mb-8"
        style={{
          background: 'linear-gradient(135deg, #fef3c7, #fde68a)'
        }}
      >
        <Link color="#f97316" size={40} />
      </View>

      {/* 标题 */}
      <Text className="text-xl font-bold text-gray-800 mb-3">
        请在电脑端打开后台管理
      </Text>

      {/* 说明文字 */}
      <Text className="text-15 text-gray-500 text-center mb-8 leading-relaxed">
        后台管理功能需要在电脑浏览器中操作，请复制以下链接并在 PC 端浏览器中打开
      </Text>

      {/* URL 显示卡片 */}
      <View className="w-full bg-white rounded-xl p-5 mb-6 border border-gray-100">
        <View className="flex items-center mb-3">
          <Link color="#3b82f6" size={16} />
          <Text className="text-sm text-gray-400 ml-2">管理后台地址</Text>
        </View>
        <Text
          className="text-17 font-medium text-blue-600"
          style={{ wordBreak: 'break-all' }}
        >
          {PC_ADMIN_URL}
        </Text>
      </View>

      {/* 复制按钮 */}
      <Button
        type="primary"
        block
        size="large"
        onClick={handleCopyUrl}
        style={{
          background: 'linear-gradient(135deg, #f97316, #ea580c)',
          border: 'none',
          borderRadius: '12px',
          height: '48px',
          fontSize: '16px'
        }}
      >
        复制链接并在电脑浏览器打开
      </Button>

      {/* 底部提示 */}
      <Text className="text-sm text-gray-400 mt-6 text-center">
        请使用 Chrome、Edge 等浏览器打开以获得最佳体验
      </Text>
    </View>
  )
}

export default AdminRedirect
