freedakgmail
41 lines
1.5 KiB
TypeScript
41 lines
1.5 KiB
TypeScript
import { useQuery } from '@tanstack/react-query'
|
|
import api from '@/lib/api'
|
|
import { FilterableTable } from '@/components/FilterableTable'
|
|
|
|
export function IndicatorsPage() {
|
|
const { data } = useQuery({
|
|
queryKey: ['indicators'],
|
|
queryFn: () => api.get('/tasks/indicators'),
|
|
})
|
|
|
|
const indicators = (data as any)?.data || []
|
|
|
|
return (
|
|
<div className="space-y-4">
|
|
<h1 className="text-xl font-bold">指标字典</h1>
|
|
<FilterableTable
|
|
data={indicators}
|
|
sortOptions={[
|
|
{ key: 'indicator_name', label: '指标名称' },
|
|
{ key: 'update_frequency', label: '更新频率' },
|
|
{ key: 'owner', label: '负责人' },
|
|
]}
|
|
defaultSort="indicator_name"
|
|
defaultOrder="asc"
|
|
filterKey="update_frequency"
|
|
filterLabel="全部频率"
|
|
columns={[
|
|
{ key: 'indicator_name', label: '指标名称' },
|
|
{ key: 'business_definition', label: '业务定义', render: (r) => <span className="text-xs">{r.business_definition}</span> },
|
|
{ key: 'formula', label: '计算公式', render: (r) => <code className="text-xs">{r.formula}</code> },
|
|
{ key: 'update_frequency', label: '更新频率', align: 'center' },
|
|
{ key: 'owner', label: '负责人' },
|
|
{ key: 'yellow_threshold', label: '黄线', align: 'right' },
|
|
{ key: 'red_threshold', label: '红线', align: 'right' },
|
|
{ key: 'version_date', label: '版本日期', render: (r) => r.version_date?.substring(0, 10) },
|
|
]}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|