From f9f816c97653a5e04e2afb51f70a3fc7d40d8003 Mon Sep 17 00:00:00 2001 From: wulibaibao <13366578180@163.com> Date: Mon, 8 Aug 2022 11:39:29 +0800 Subject: [PATCH] fix: rm pagination & pre-table expanded all columns --- .../Plan/Report/components/Devices/index.tsx | 22 ++++++++++-------- .../TestResult/FuncPassRate.chart.tsx | 8 ++++--- .../TestResult/FuncResult.table.tsx | 12 ++++++---- .../TestResult/PerfExpandedTable.tsx | 11 ++++----- .../components/TestResult/PerfTable.tsx | 23 +++++++++++-------- .../Report/components/TestResult/index.tsx | 3 ++- .../Report/components/TestTask/Task.table.tsx | 5 ++-- .../Plan/Report/components/TestTask/index.tsx | 2 +- 8 files changed, 48 insertions(+), 38 deletions(-) diff --git a/src/pages/Plan/Report/components/Devices/index.tsx b/src/pages/Plan/Report/components/Devices/index.tsx index 79eda3a..c7ab15b 100644 --- a/src/pages/Plan/Report/components/Devices/index.tsx +++ b/src/pages/Plan/Report/components/Devices/index.tsx @@ -1,5 +1,6 @@ import React from "react" -import { Table, TableColumnProps, Typography, Tag } from "antd" +import { Table, Typography, Tag } from "antd" +import type { TableColumnProps } from "antd" import { WhiteContent, FullSpace } from "../../styled" import OverflowList from "@/components/OverflowList" @@ -30,7 +31,7 @@ const Devices: React.FC = ({ dataSource = [] }) => { title: "标签", ellipsis: true, render(row) { - return {i.name})} /> + return {i.name})} /> } }, { @@ -48,14 +49,15 @@ const Devices: React.FC = ({ dataSource = [] }) => { rowKey={"id"} columns={columns} dataSource={dataSource} - pagination={{ - hideOnSinglePage: true, - showSizeChanger: true, - showQuickJumper: true, - showTotal(total, range) { - return `共 ${total} 条 ` - }, - }} + pagination={false} + /* pagination={{ + hideOnSinglePage: true, + showSizeChanger: true, + showQuickJumper: true, + showTotal(total) { + return `共 ${total} 条 ` + }, + }} */ /> diff --git a/src/pages/Plan/Report/components/TestResult/FuncPassRate.chart.tsx b/src/pages/Plan/Report/components/TestResult/FuncPassRate.chart.tsx index cbc076f..7734bb9 100644 --- a/src/pages/Plan/Report/components/TestResult/FuncPassRate.chart.tsx +++ b/src/pages/Plan/Report/components/TestResult/FuncPassRate.chart.tsx @@ -16,7 +16,7 @@ const stateColorMap = (i: string) => new Map([ ["invalid", "rgba(108,117,127,1)"], ]).get(i) || "" -const FuncPassRate: React.FC<{ [k: string]: any }> = ({ dataSource }) => { +const FuncPassRate: React.FC> = ({ dataSource }) => { const chart = React.useRef(null) as any React.useEffect(() => { @@ -24,6 +24,7 @@ const FuncPassRate: React.FC<{ [k: string]: any }> = ({ dataSource }) => { const nameList = Object.keys(dataSource) const count = nameList.reduce((pre, cur) => { + // eslint-disable-next-line no-param-reassign return pre += dataSource[cur] }, 0) @@ -40,7 +41,7 @@ const FuncPassRate: React.FC<{ [k: string]: any }> = ({ dataSource }) => { textAlign: "center" }, left: "center", - top: "30%", + top: "36%", }, legend: { icon: "circle", @@ -71,8 +72,9 @@ const FuncPassRate: React.FC<{ [k: string]: any }> = ({ dataSource }) => { labelLine: { show: true, }, + top: 20, hoverOffset: 1, - height: '80%', + height: '75%', label: { position: 'outside', formatter: "{d}%" diff --git a/src/pages/Plan/Report/components/TestResult/FuncResult.table.tsx b/src/pages/Plan/Report/components/TestResult/FuncResult.table.tsx index 367a829..853ae33 100644 --- a/src/pages/Plan/Report/components/TestResult/FuncResult.table.tsx +++ b/src/pages/Plan/Report/components/TestResult/FuncResult.table.tsx @@ -1,11 +1,12 @@ import { runMethodMap } from "@/pages/Suite/utils"; -import { Table, TableColumnProps, Typography } from "antd"; +import { Table, Typography } from "antd"; +import type { TableColumnProps } from "antd" import React from "react"; import { FullSpace } from "../../styled"; import { StateIcon } from "../utils" import { PriorityTag } from "@/components/Public/PriorityTag" -const FuncPassRate: React.FC<{ [k: string]: any }> = ({ dataSource }) => { +const FuncPassRate: React.FC> = ({ dataSource }) => { const columns: TableColumnProps[] = [{ width: 40, align: "center", @@ -45,14 +46,15 @@ const FuncPassRate: React.FC<{ [k: string]: any }> = ({ dataSource }) => { dataSource={dataSource} size="small" rowKey={"id"} - pagination={{ + pagination={false} + /* pagination={{ hideOnSinglePage: true, showSizeChanger: true, showQuickJumper: true, - showTotal(total, range) { + showTotal(total) { return `共 ${total} 条 ` }, - }} + }} */ /> ) diff --git a/src/pages/Plan/Report/components/TestResult/PerfExpandedTable.tsx b/src/pages/Plan/Report/components/TestResult/PerfExpandedTable.tsx index 2c7494f..7845296 100644 --- a/src/pages/Plan/Report/components/TestResult/PerfExpandedTable.tsx +++ b/src/pages/Plan/Report/components/TestResult/PerfExpandedTable.tsx @@ -1,10 +1,9 @@ import React from "react" -import { Table, Space, Row, Divider, TableColumnProps } from "antd" +import { Table, Space, Row, Divider } from "antd" +import type { TableColumnProps } from "antd" import styled from "styled-components" -type IProps = { - [k: string]: any -} +type IProps = Record const ExpandedLine = styled.div` padding: 8px 0; @@ -23,7 +22,7 @@ const CustomTable = styled(Table)` } ` -const ExpandedCaseTable: React.FC = ({ dataSource = [], id }) => { +const ExpandedCaseTable: React.FC = ({ dataSource = [] }) => { const columns: TableColumnProps[] = [{ title: "指标名称", dataIndex: "metric", @@ -66,7 +65,7 @@ const ExpandedCaseTable: React.FC = ({ dataSource = [], id }) => { { - dataSource.map((i: any, idx: number) => ( + dataSource.map((i: any) => ( diff --git a/src/pages/Plan/Report/components/TestResult/PerfTable.tsx b/src/pages/Plan/Report/components/TestResult/PerfTable.tsx index fc9ae1a..e869a9a 100644 --- a/src/pages/Plan/Report/components/TestResult/PerfTable.tsx +++ b/src/pages/Plan/Report/components/TestResult/PerfTable.tsx @@ -1,6 +1,6 @@ import React from "react" -import { Table, Space, Typography, Row, TableColumnProps, Tooltip } from "antd" -import moment from "moment" +import { Table, Space, Typography, Row } from "antd" +import type { TableColumnProps } from "antd" import ExpandedCaseTable from "./PerfExpandedTable" import styled from "styled-components" import { runMethodMap } from "@/pages/Suite/utils" @@ -25,8 +25,12 @@ type IProps = { dataSource?: any[] } -const PerfTable: React.FC = ({ dataSource }) => { - const [expanedKeys, setExpandedKeys] = React.useState([]) +const PerfTable: React.FC = ({ dataSource = [] }) => { + const [expanedKeys, setExpandedKeys] = React.useState([]) + + React.useEffect(() => { + setExpandedKeys(dataSource?.map((i: any) => i.id)) + }, [dataSource]) const columns: TableColumnProps[] = [{ title: "测试用例", @@ -78,19 +82,18 @@ const PerfTable: React.FC = ({ dataSource }) => { }, columnWidth: 32, onExpand(expaded: boolean, record: any) { - expaded ? - setExpandedKeys(l => l.concat(record.id)) : - setExpandedKeys(l => l.filter((i: any) => i !== record.id)) + setExpandedKeys(l => expaded ? l.concat(record.id) : l.filter((i: any) => i !== record.id)) } }} - pagination={{ + pagination={false} + /* pagination={{ showSizeChanger: true, showQuickJumper: true, hideOnSinglePage: true, - showTotal(total, range) { + showTotal(total) { return `共 ${total} 条 ` }, - }} + }} */ /> ) diff --git a/src/pages/Plan/Report/components/TestResult/index.tsx b/src/pages/Plan/Report/components/TestResult/index.tsx index b6f9d80..9624b91 100644 --- a/src/pages/Plan/Report/components/TestResult/index.tsx +++ b/src/pages/Plan/Report/components/TestResult/index.tsx @@ -6,8 +6,9 @@ import FuncPassRate from "./FuncPassRate.chart" import FuncResultTable from "./FuncResult.table" import PerfTable from "./PerfTable" -const TestResult: React.FC<{ [k: string]: any }> = ({ dataSource }) => { +const TestResult: React.FC> = ({ dataSource }) => { const { func_test, perf_test } = dataSource + return ( diff --git a/src/pages/Plan/Report/components/TestTask/Task.table.tsx b/src/pages/Plan/Report/components/TestTask/Task.table.tsx index f9a5fe1..ad46d8e 100644 --- a/src/pages/Plan/Report/components/TestTask/Task.table.tsx +++ b/src/pages/Plan/Report/components/TestTask/Task.table.tsx @@ -1,9 +1,10 @@ -import { Table, TableColumnProps, Typography } from "antd"; +import { Table, Typography } from "antd"; +import type { TableColumnProps } from "antd" import React from "react"; import { FullSpace } from "../../styled"; import { StateIcon } from "../utils" -const FuncPassRate: React.FC<{ [k: string]: any }> = ({ dataSource, title }) => { +const FuncPassRate: React.FC> = ({ dataSource, title }) => { const columns: TableColumnProps[] = [{ width: 40, align: "center", diff --git a/src/pages/Plan/Report/components/TestTask/index.tsx b/src/pages/Plan/Report/components/TestTask/index.tsx index c5c24f0..2054d5f 100644 --- a/src/pages/Plan/Report/components/TestTask/index.tsx +++ b/src/pages/Plan/Report/components/TestTask/index.tsx @@ -5,7 +5,7 @@ import { Typography } from "antd" import TaskTable from "./Task.table" -const TestResult: React.FC<{ [k: string]: any }> = ({ dataSource }) => { +const TestResult: React.FC> = ({ dataSource }) => { const { auto_task, manual_task } = dataSource return ( -- Gitee