import { Button } from "../../components/ui/Button"
import { Panel } from "../../components/ui/Panel"

export function KnowledgeView() {
  return (
    <div className="page-stack knowledge-page-stack">
      <Panel className="knowledge-panel" bodyClassName="knowledge-panel-body">
        <div className="knowledge-header">
          <h1 className="knowledge-title">企业知识库</h1>
          <p className="knowledge-subtitle">上传和管理您的企业知识文档</p>
        </div>

        <div className="knowledge-upload-section">
          <div className="upload-card">
            <div className="upload-icon">
              <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor">
                <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M17 8l-5-5-5 5M12 3v12" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
              </svg>
            </div>
            <h3 className="upload-title">上传文档</h3>
            <p className="upload-desc">支持 PDF、Word、Excel、TXT 等格式</p>
            <Button type="button" className="upload-button btn-primary">
              选择文件上传
            </Button>
            <p className="upload-hint">或拖拽文件到此处</p>
          </div>
        </div>

        <div className="knowledge-list-section">
          <h2 className="section-title">最近文档</h2>
          <div className="document-grid">
            <div className="document-card">
              <div className="document-icon">DOC</div>
              <div className="document-info">
                <h4>产品手册.pdf</h4>
                <p>更新于 2 小时前 · 2.4 MB</p>
              </div>
            </div>
          </div>
        </div>
      </Panel>
    </div>
  )
}
