chore: 以本地为准,上传全部并替换 GitHub

This commit is contained in:
卡若
2026-02-03 11:36:53 +08:00
parent 1219166526
commit b404bf546e
131 changed files with 37618 additions and 3930 deletions

View File

@@ -7,104 +7,54 @@ import {
YAxis,
CartesianGrid,
Tooltip,
Legend,
ResponsiveContainer,
BarChart as RechartsBarChart,
Bar,
PieChart as RechartsPieChart,
Pie,
Cell,
} from "recharts"
import { BarChart as RechartsBarChart, Bar } from "recharts"
interface ChartProps {
data: any
height?: number
}
const lineData = [
{ name: "周一", 新增微信号: 12 },
{ name: "周二", 新增微信号: 19 },
{ name: "周三", 新增微信号: 3 },
{ name: "周四", 新增微信号: 5 },
{ name: "周五", 新增微信号: 2 },
{ name: "周六", 新增微信号: 3 },
{ name: "周日", 新增微信号: 10 },
]
export function LineChart({ data, height = 300 }: ChartProps) {
const barData = [
{ name: "周一", 新增好友: 120 },
{ name: "周二", 新增好友: 190 },
{ name: "周三", 新增好友: 30 },
{ name: "周四", 新增好友: 50 },
{ name: "周五", 新增好友: 20 },
{ name: "周六", 新增好友: 30 },
{ name: "周日", 新增好友: 100 },
]
export function LineChart() {
return (
<ResponsiveContainer width="100%" height={height}>
<RechartsLineChart
data={data.labels.map((label, i) => {
const dataPoint = { name: label }
data.datasets.forEach((dataset, j) => {
dataPoint[dataset.label] = dataset.data[i]
})
return dataPoint
})}
>
<ResponsiveContainer width="100%" height={180}>
<RechartsLineChart data={lineData}>
<CartesianGrid strokeDasharray="3 3" />
<XAxis dataKey="name" />
<YAxis />
<Tooltip />
<Legend />
{data.datasets.map((dataset, i) => (
<Line
key={i}
type="monotone"
dataKey={dataset.label}
stroke={dataset.borderColor}
fill={dataset.backgroundColor}
activeDot={{ r: 8 }}
/>
))}
<Line type="monotone" dataKey="新增微信号" stroke="#8884d8" />
</RechartsLineChart>
</ResponsiveContainer>
)
}
export function BarChart({ data, height = 300 }: ChartProps) {
export function BarChart() {
return (
<ResponsiveContainer width="100%" height={height}>
<RechartsBarChart
data={data.labels.map((label, i) => {
const dataPoint = { name: label }
data.datasets.forEach((dataset, j) => {
dataPoint[dataset.label] = dataset.data[i]
})
return dataPoint
})}
>
<ResponsiveContainer width="100%" height={180}>
<RechartsBarChart data={barData}>
<CartesianGrid strokeDasharray="3 3" />
<XAxis dataKey="name" />
<YAxis />
<Tooltip />
<Legend />
{data.datasets.map((dataset, i) => (
<Bar key={i} dataKey={dataset.label} fill={dataset.backgroundColor || "#8884d8"} />
))}
<Bar dataKey="新增好友" fill="#82ca9d" />
</RechartsBarChart>
</ResponsiveContainer>
)
}
export function PieChart({ data, height = 300 }: ChartProps) {
return (
<ResponsiveContainer width="100%" height={height}>
<RechartsPieChart>
<Pie
data={data.labels.map((label, i) => ({
name: label,
value: data.datasets[0].data[i],
}))}
cx="50%"
cy="50%"
labelLine={false}
outerRadius={80}
fill="#8884d8"
dataKey="value"
label={({ name, percent }) => `${name}: ${(percent * 100).toFixed(0)}%`}
>
{data.labels.map((entry, index) => (
<Cell
key={`cell-${index}`}
fill={data.datasets[0].backgroundColor[index] || `#${Math.floor(Math.random() * 16777215).toString(16)}`}
/>
))}
</Pie>
<Tooltip />
<Legend />
</RechartsPieChart>
</ResponsiveContainer>
)
}