diff --git a/web/src/aggregator/Result.tsx b/web/src/aggregator/Result.tsx index f9193a6..5920895 100644 --- a/web/src/aggregator/Result.tsx +++ b/web/src/aggregator/Result.tsx @@ -1,9 +1,11 @@ import moment from "moment"; import { Accessor, Component, createResource, createSignal } from "solid-js"; -import { apiHost } from "../consts"; + +import { apiHost, ResultKeyVal, resultOrder, ResultOrderKeys } from "../consts"; import { CityChart } from "./CityChart"; import "../css/Result.css" +import { SelectOrder } from "./SelectOrder"; export const Result: Component<{ getCities: Accessor>, @@ -12,7 +14,8 @@ export const Result: Component<{ getField: Accessor, getKey: Accessor, }> = (props) => { - const cities = () => [...props.getCities()].join(",") + const cities = () => [...props.getCities()].join(","); + const citiesStr = () => [...props.getCities()].join(", "); const startStr = () => moment(props.getStart()).format("YYYY/MM/DD, HH:mm"); const endStr = () => moment(props.getEnd()).format("YYYY/MM/DD, HH:mm"); const queryStart = () => moment(props.getStart()).format("YYYYMMDD_HHmm"); @@ -28,16 +31,25 @@ export const Result: Component<{ } const [queryResource] = createResource(getTimestamp, fetchQuery); + const [getOrderKey, setOrderKey] = createSignal("A -> Z"); return (

Aggregate by:

- setTimestamp(Date.now())} /> -

cities: { cities() }

+ setTimestamp(Date.now())} + /> +

cities: { citiesStr() }

time range: { startStr() } - { endStr() }

weather field: { props.getField() }

aggregation field: { props.getKey() }

-

Result:

+
+

Result:

+ +
{ queryResource.loading && (
@@ -53,7 +65,8 @@ export const Result: Component<{ { queryResource() && (
{ Object.entries(queryResource()) - .sort((a, b) => (a[0] as string) > (b[0] as string) ? 1 : -1) + .map(keyVal => [...keyVal] as ResultKeyVal) + .sort((a, b) => resultOrder[getOrderKey()](a, b)) .map(cityData => ) }
)} diff --git a/web/src/aggregator/SelectAggregator.tsx b/web/src/aggregator/SelectAggregator.tsx index 9cdaea2..29e2be7 100644 --- a/web/src/aggregator/SelectAggregator.tsx +++ b/web/src/aggregator/SelectAggregator.tsx @@ -9,7 +9,7 @@ export const SelectAggregator: Component<{ }> = (props) => { return (
-

Select aggregator

+

Select field

+

Select aggregator

    { aggregateKey.map(key =>