fix(workload): display

This commit is contained in:
zhangheng
2026-05-14 17:15:09 +08:00
parent 5c3b45b247
commit 39dc96320c
2 changed files with 37 additions and 9 deletions

View File

@@ -43,6 +43,7 @@ import { VirtualTreeSelect } from "@/components/tree-select/tree"
import { DateInput } from "@mantine/dates" import { DateInput } from "@mantine/dates"
import dayjs from "dayjs" import dayjs from "dayjs"
import "dayjs/locale/zh-cn" import "dayjs/locale/zh-cn"
import duration from "dayjs/plugin/duration"
import { DataTableColumn, DataTableSortStatus } from "mantine-datatable" import { DataTableColumn, DataTableSortStatus } from "mantine-datatable"
import { useCallback, useEffect, useMemo, useState } from "react" import { useCallback, useEffect, useMemo, useState } from "react"
import DailyReportModal from "./components/DailyReportModal" import DailyReportModal from "./components/DailyReportModal"
@@ -57,6 +58,7 @@ import {
workTypeOpts, workTypeOpts,
} from "./config" } from "./config"
import classes from "./page.module.css" import classes from "./page.module.css"
dayjs.extend(duration)
function weekDayText(day: number) { function weekDayText(day: number) {
const list = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"] const list = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"]
@@ -276,6 +278,10 @@ export default function PersonReportPage() {
return accumulator + (Number.isFinite(value) ? value : 0) return accumulator + (Number.isFinite(value) ? value : 0)
}, 0) }, 0)
const getTime = (time: number) => {
return dayjs.duration(time, "seconds").format("HH:mm:ss")
}
const columns = useMemo(() => { const columns = useMemo(() => {
const cols: DataTableColumn<Daily.DailyWorkList>[] = [ const cols: DataTableColumn<Daily.DailyWorkList>[] = [
{ {
@@ -366,7 +372,8 @@ export default function PersonReportPage() {
title: "工时", title: "工时",
width: 90, width: 90,
sortable: true, sortable: true,
footer: sum(records.map((r) => r.work_time ?? 0)).toLocaleString(), render: (record) => (record.work_time ? getTime(record.work_time) : 0),
footer: getTime(sum(records.map((r) => r.work_time ?? 0))),
}, },
{ accessor: "rate", title: "额定倍率", width: 90 }, { accessor: "rate", title: "额定倍率", width: 90 },
{ {

View File

@@ -23,10 +23,12 @@ import {
} from "@tabler/icons-react" } from "@tabler/icons-react"
import dayjs from "dayjs" import dayjs from "dayjs"
import "dayjs/locale/zh-cn" import "dayjs/locale/zh-cn"
import duration from "dayjs/plugin/duration"
import { DataTableColumn, DataTableSortStatus } from "mantine-datatable" import { DataTableColumn, DataTableSortStatus } from "mantine-datatable"
import { useEffect, useMemo, useState } from "react" import { useEffect, useMemo, useState } from "react"
import * as XLSX from "xlsx-js-style" import * as XLSX from "xlsx-js-style"
import { DimensionType, GroupedData, MetricColumn } from "./config" import { DimensionType, GroupedData, MetricColumn } from "./config"
dayjs.extend(duration)
function emptyGroupedData(): GroupedData { function emptyGroupedData(): GroupedData {
return { return {
@@ -159,6 +161,10 @@ export default function WorkloadMetricsTable(props: {
return list return list
}, [filteredRecords, sortStatus.columnAccessor, sortStatus.direction]) }, [filteredRecords, sortStatus.columnAccessor, sortStatus.direction])
const getTime = (time: number) => {
return dayjs.duration(time, "seconds").format("HH:mm:ss")
}
const baseColumns = useMemo(() => { const baseColumns = useMemo(() => {
const allCols: Record<DimensionType, DataTableColumn<any>[]> = { const allCols: Record<DimensionType, DataTableColumn<any>[]> = {
all: [ all: [
@@ -190,11 +196,25 @@ export default function WorkloadMetricsTable(props: {
const value = Number(item?.[metric.key] ?? 0) const value = Number(item?.[metric.key] ?? 0)
return acc + (Number.isFinite(value) ? value : 0) return acc + (Number.isFinite(value) ? value : 0)
}, 0) }, 0)
if (["work_time"].includes(metric.key)) {
return [metric.key, getTime(sum ?? 0)]
} else {
return [metric.key, sum] return [metric.key, sum]
}
}) })
) as Record<string, number> ) as Record<string, number>
const metricCols = metrics.map((metric) => { const metricCols = metrics.map((metric) => {
if (["work_time"].includes(metric.key)) {
return {
accessor: metric.key,
title: metric.title,
width: 140,
sortable: true,
footer: totalsByKey[metric.key] ?? 0,
render: (record) => getTime(record[metric.key] ?? 0),
} as DataTableColumn<any>
} else {
return { return {
accessor: metric.key, accessor: metric.key,
title: metric.title, title: metric.title,
@@ -202,6 +222,7 @@ export default function WorkloadMetricsTable(props: {
sortable: true, sortable: true,
footer: totalsByKey[metric.key] ?? 0, footer: totalsByKey[metric.key] ?? 0,
} as DataTableColumn<any> } as DataTableColumn<any>
}
}) })
return [ return [
{ {