import {ReactNode} from 'react'
import Header from './header'
import Footer from './footer'
import Script from 'next/script'
import {MessageCircleMoreIcon} from 'lucide-react'
export type HomeLayoutProps = {
  children: ReactNode
}

export default function HomeLayout(props: HomeLayoutProps) {
  return (
    <div className="overflow-auto bg-blue-50 flex flex-col items-stretch relative">
      {/* 页头 */}
      <Header/>

      {/* 正文 */}
      {props.children}

      {/* 页脚 */}
      <Footer/>

      {/* <Script id="qd2852138148beb7882a4a6a3e5ff5b569436003e7dc" src="https://wp.qiye.qq.com/qidian/2852138148/beb7882a4a6a3e5ff5b569436003e7dc" async defer></Script> */}
      <a
        href="https://wpa1.qq.com/K0s0cvwf?_type=wpa&qidian=true"
        target="_blank"
        rel="noopener noreferrer"
        className="fixed bottom-6 right-6 z-50 w-14 h-14 rounded-full bg-blue-600 hover:bg-blue-700 shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-110 flex items-center justify-center group"
        aria-label="在线客服"
      >
        <span className="text-white font-bold text-lg">客</span>
        <span className="text-white font-bold text-lg">服</span>

        <span className="absolute -top-2 -right-2 flex items-center justify-center w-6 h-6 bg-red-500 rounded-full text-white shadow-md">
          <MessageCircleMoreIcon size={14}/>
        </span>
      </a>
    </div>
  )
}