lychiyu/bbgo_origin
1
0
Fork 0
mirror of https://github.com/c9s/bbgo.git synced 2024-09-20 08:11:08 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

add limit to the order table

Browse Source
This commit is contained in:
c9s 2022-06-27 18:17:46 +08:00
parent b97ec7bb1e
commit 2953518af9
No known key found for this signature in database
GPG Key ID: 7385E7E464CB0A54
2 changed files with 26 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
apps/backtest-report/components/OrderListTable.tsx
View File

@ -1,15 +1,18 @@
import {Checkbox, Group, Table} from "@mantine/core"; import {Button, Checkbox, Group, Table} from "@mantine/core";
import React, {useState} from "react"; import React, {useState} from "react";
import {Order} from "../types"; import {Order} from "../types";
interface OrderListTableProps { interface OrderListTableProps {
orders: Order[]; orders: Order[];
onClick?: (order: Order) => void; onClick?: (order: Order) => void;
limit?: number;
} }
const OrderListTable = (props: OrderListTableProps) => { const OrderListTable = (props: OrderListTableProps) => {
let orders = props.orders; let orders = props.orders;
const [showCanceledOrders, setShowCanceledOrders] = useState(false); const [showCanceledOrders, setShowCanceledOrders] = useState(false);
const [limit, setLimit] = useState(props.limit || 5);
if (!showCanceledOrders) { if (!showCanceledOrders) {
orders = orders.filter((order: Order) => { orders = orders.filter((order: Order) => {
@ -17,6 +20,10 @@ const OrderListTable = (props: OrderListTableProps) => {
}) })
} }
if (orders.length > limit) {
orders = orders.slice(0, limit)
}
const rows = orders.map((order: Order) => ( const rows = orders.map((order: Order) => (
<tr key={order.order_id} onClick={(e) => { <tr key={order.order_id} onClick={(e) => {
props.onClick ? props.onClick(order) : null; props.onClick ? props.onClick(order) : null;
@ -41,23 +48,25 @@ const OrderListTable = (props: OrderListTableProps) => {
<Group> <Group>
<Checkbox label="Show Canceled" checked={showCanceledOrders} <Checkbox label="Show Canceled" checked={showCanceledOrders}
onChange={(event) => setShowCanceledOrders(event.currentTarget.checked)}/> onChange={(event) => setShowCanceledOrders(event.currentTarget.checked)}/>
<Button onClick={() => {
setLimit(limit + 500)
}}>Load More</Button>
</Group> </Group>
<Table highlightOnHover striped> <Table highlightOnHover striped>
<thead> <thead>
<tr> <tr>
<th>Order ID</th> <th>Order ID</th>
<th>Symbol</th> <th>Symbol</th>
<th>Side</th> <th>Side</th>
<th>Order Type</th> <th>Order Type</th>
<th>Price</th> <th>Price</th>
<th>Quantity</th> <th>Quantity</th>
<th>Status</th> <th>Status</th>
<th>Creation Time</th> <th>Creation Time</th>
</tr> </tr>
</thead> </thead>
<tbody>{rows}</tbody> <tbody>{rows}</tbody>
</Table> </Table>
</div> </div>
} }

2
apps/backtest-report/components/TimeRangeSlider/index.scss
View File

@ -10,7 +10,7 @@ $react-time-range--track--disabled: repeating-linear-gradient( -45deg, transpare
.react_time_range__time_range_container { .react_time_range__time_range_container {
padding: 30px 52px 0 52px; padding: 30px 52px 0 52px;
height: 70px; height: 90px;
// width: 90%; // width: 90%;
box-sizing: border-box; box-sizing: border-box;
} }