- 移除 Data、Scene 和 IodRelevant 组件中的 Drawer - 优化 Data、Scene 和 IodRelevant 组件的结构 - 添加 Header 组件用于展示标题和关闭按钮 - 使用 Main 组件替代原来的 ShowCard 组件 - 调整样式和布局,提高组件的可复用性和可维护性
42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
import React from "react"
|
|
import { Typography } from "antd"
|
|
import { ChevronRightIcon } from "@heroicons/react/24/outline"
|
|
|
|
const { Title } = Typography
|
|
|
|
type Props = {
|
|
Header: React.ReactNode
|
|
showButton?: boolean
|
|
onClick?: () => void
|
|
}
|
|
|
|
export const DataNavigation: React.FC<Props> = ({
|
|
Header,
|
|
showButton = true,
|
|
onClick
|
|
}) => {
|
|
return (
|
|
<div className="flex items-center justify-between bg-white dark:bg-gray-800 rounded-lg">
|
|
{/* 左侧部分 */}
|
|
<div className="flex items-center">
|
|
<Title
|
|
level={3}
|
|
className="flex items-center"
|
|
style={{ marginBottom: 0, color: "#1F2937", fontSize: "18px" }}>
|
|
{Header}
|
|
</Title>
|
|
</div>
|
|
|
|
{/* 右侧部分 */}
|
|
{showButton && (
|
|
<div
|
|
className="flex items-center text-[#3a3a3a] cursor-pointer space-x-0.5 hover:text-[#3581e3] transition-colors duration-200"
|
|
onClick={onClick}>
|
|
<span className="text-[12px]">更多</span>
|
|
<ChevronRightIcon className="w-4 h-4" />
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|