jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-18 06:46:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add value column prop to ha data table (#9824)

Browse Source
This commit is contained in:
Bram Kragten 2021-08-25 11:20:35 +02:00 committed by GitHub
parent 271120999c
commit 32777b4259
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/data-table/ha-data-table.ts
View File

@ -62,6 +62,7 @@ export interface DataTableSortColumnData {
sortable?: boolean; sortable?: boolean;
filterable?: boolean; filterable?: boolean;
filterKey?: string; filterKey?: string;
valueColumn?: string;
direction?: SortingDirection; direction?: SortingDirection;
} }
@ -76,7 +77,7 @@ export interface DataTableColumnData extends DataTableSortColumnData {
hidden?: boolean; hidden?: boolean;
} }
type ClonedDataTableColumnData = Omit<DataTableColumnData, "title"> & { export type ClonedDataTableColumnData = Omit<DataTableColumnData, "title"> & {
title?: TemplateResult | string; title?: TemplateResult | string;
}; };
@ -455,7 +456,7 @@ export class HaDataTable extends LitElement {
const prom = this._sortColumn const prom = this._sortColumn
? sortData( ? sortData(
filteredData, filteredData,
this._sortColumns, this._sortColumns[this._sortColumn],
this._sortDirection, this._sortDirection,
this._sortColumn this._sortColumn
) )

18
src/components/data-table/sort_filter_worker.ts
View File

@ -2,8 +2,8 @@
import { expose } from "comlink"; import { expose } from "comlink";
import "proxy-polyfill"; import "proxy-polyfill";
import type { import type {
ClonedDataTableColumnData,
DataTableRowData, DataTableRowData,
DataTableSortColumnData,
SortableColumnContainer, SortableColumnContainer,
SortingDirection, SortingDirection,
} from "./ha-data-table"; } from "./ha-data-table";
@ -19,7 +19,11 @@ const filterData = (
const [key, column] = columnEntry; const [key, column] = columnEntry;
if (column.filterable) { if (column.filterable) {
if ( if (
String(column.filterKey ? row[key][column.filterKey] : row[key]) String(
column.filterKey
? row[column.valueColumn || key][column.filterKey]
: row[column.valueColumn || key]
)
.toUpperCase() .toUpperCase()
.includes(filter) .includes(filter)
) { ) {
@ -33,7 +37,7 @@ const filterData = (
const sortData = ( const sortData = (
data: DataTableRowData[], data: DataTableRowData[],
column: DataTableSortColumnData, column: ClonedDataTableColumnData,
direction: SortingDirection, direction: SortingDirection,
sortColumn: string sortColumn: string
) => ) =>
@ -44,12 +48,12 @@ const sortData = (
} }
let valA = column.filterKey let valA = column.filterKey
? a[sortColumn][column.filterKey] ? a[column.valueColumn || sortColumn][column.filterKey]
: a[sortColumn]; : a[column.valueColumn || sortColumn];
let valB = column.filterKey let valB = column.filterKey
? b[sortColumn][column.filterKey] ? b[column.valueColumn || sortColumn][column.filterKey]
: b[sortColumn]; : b[column.valueColumn || sortColumn];
if (typeof valA === "string") { if (typeof valA === "string") {
valA = valA.toUpperCase(); valA = valA.toUpperCase();

6
src/panels/config/devices/ha-config-devices-dashboard.ts
View File

@ -212,6 +212,10 @@ export class HaConfigDeviceDashboard extends LitElement {
this._batteryEntity(device.id, deviceEntityLookup), this._batteryEntity(device.id, deviceEntityLookup),
this._batteryChargingEntity(device.id, deviceEntityLookup), this._batteryChargingEntity(device.id, deviceEntityLookup),
], ],
battery_level:
this.hass.states[
this._batteryEntity(device.id, deviceEntityLookup) || ""
]?.state,
})); }));
this._numHiddenDevices = startLength - outputDevices.length; this._numHiddenDevices = startLength - outputDevices.length;
@ -286,9 +290,11 @@ export class HaConfigDeviceDashboard extends LitElement {
columns.battery_entity = { columns.battery_entity = {
title: this.hass.localize("ui.panel.config.devices.data_table.battery"), title: this.hass.localize("ui.panel.config.devices.data_table.battery"),
sortable: true, sortable: true,
filterable: true,
type: "numeric", type: "numeric",
width: narrow ? "95px" : "15%", width: narrow ? "95px" : "15%",
maxWidth: "95px", maxWidth: "95px",
valueColumn: "battery_level",
template: (batteryEntityPair: DeviceRowData["battery_entity"]) => { template: (batteryEntityPair: DeviceRowData["battery_entity"]) => {
const battery = const battery =
batteryEntityPair && batteryEntityPair[0] batteryEntityPair && batteryEntityPair[0]