// 第三方库导入
import React, {
  useState,
  useRef,
  useEffect,
  useMemo,
  useCallback,
  Fragment,
  RefObject,
} from "react";
import {
  useGlobalStore,
} from "../../store";
import jing from "../../icons/jing.png";
import { Button } from "antd";

export function Chat() {
  const globalStore = useGlobalStore();

  useEffect(() => {
    globalStore.setShowMenu(true);
  }, []);

  const styles = {
    page: {
      minHeight: 'calc(100vh - 80px)',
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'center',
      padding: '32px',
      background: 'linear-gradient(180deg, #f7fbff 0%, #ffffff 100%)',
    } as React.CSSProperties,
    card: {
      background: '#fff',
      padding: '28px',
      borderRadius: 12,
      boxShadow: '0 8px 30px rgba(20,30,60,0.06)',
      maxWidth: 720,
      width: '100%',
      textAlign: 'center' as const,
    },
    avatar: {
      width: 96,
      height: 96,
      borderRadius: '50%',
      objectFit: 'cover' as const,
      margin: '0 auto 12px',
      boxShadow: '0 6px 18px rgba(37,70,150,0.08)'
    },
    title: {
      margin: '8px 0 6px',
      fontSize: 20,
      fontWeight: 700,
      color: '#0f1724'
    },
    desc: {
      margin: 0,
      color: '#475569',
      lineHeight: 1.6
    },
    actions: {
      marginTop: 18,
      display: 'flex',
      justifyContent: 'center',
      gap: 12
    } as React.CSSProperties,
    primaryBtn: {
      background: '#2563eb',
      color: '#fff',
      border: 'none',
      padding: '10px 16px',
      borderRadius: 8,
      cursor: 'pointer'
    },
    ghostBtn: {
      background: 'transparent',
      color: '#2563eb',
      border: '1px solid rgba(37,99,235,0.15)',
      padding: '10px 16px',
      borderRadius: 8,
      cursor: 'pointer'
    }
  };

  return (
    <div style={styles.page}>
      <div style={styles.card}>
        <img src={jing.src} alt="avatar" style={styles.avatar} />
        {/* <p> 链接无效 </p>
        <p style={styles.desc}>
          我可以帮助你快速查询作业指导书、规范条文、公司信息等内容。请从点击下方按钮选择应用
        </p>
        <p className="mt-2">
          <Button type="primary"> 选择应用 </Button>
        </p> */}
        {/* <p>
          无效的链接地址：http://10.1.14.17:3900/
          请前往【应用广场】选择可用应用，或联系管理员处理。
        </p> */}
            <p>
          无效的链接地址：{window.location.href}<br/>
          请前往 <span className='text-primary' style={{color:'#1890ff'}} onClick={()=>{
            window.location.replace('http://10.1.14.17:3200/appCenter')
          }}>【应用广场】</span>选择可用应用，或联系管理员处理。
        </p>

        <div style={styles.actions}>
          {/* <button style={styles.primaryBtn} onClick={() => globalStore.setShowMenu(true)}>打开导航</button> */}
          {/* <button style={styles.ghostBtn} onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })}>返回顶部</button> */}
        </div>
      </div>
    </div>
  );
}