mirror of
https://github.com/blakeblackshear/frigate.git
synced 2026-02-02 17:25:22 +03:00
Add sub label selector to events UI
This commit is contained in:
parent
ba5fc7583a
commit
191de73126
@ -44,6 +44,7 @@ export default function Events({ path, ...props }) {
|
|||||||
camera: props.camera ?? 'all',
|
camera: props.camera ?? 'all',
|
||||||
label: props.label ?? 'all',
|
label: props.label ?? 'all',
|
||||||
zone: props.zone ?? 'all',
|
zone: props.zone ?? 'all',
|
||||||
|
sub_label: props.sub_label ?? 'all',
|
||||||
});
|
});
|
||||||
const [state, setState] = useState({
|
const [state, setState] = useState({
|
||||||
showDownloadMenu: false,
|
showDownloadMenu: false,
|
||||||
@ -82,6 +83,8 @@ export default function Events({ path, ...props }) {
|
|||||||
|
|
||||||
const { data: config } = useSWR('config');
|
const { data: config } = useSWR('config');
|
||||||
|
|
||||||
|
const { data: allSubLabels } = useSWR('sub_labels')
|
||||||
|
|
||||||
const filterValues = useMemo(
|
const filterValues = useMemo(
|
||||||
() => ({
|
() => ({
|
||||||
cameras: Object.keys(config?.cameras || {}),
|
cameras: Object.keys(config?.cameras || {}),
|
||||||
@ -97,9 +100,9 @@ export default function Events({ path, ...props }) {
|
|||||||
return memo;
|
return memo;
|
||||||
}, config?.objects?.track || [])
|
}, config?.objects?.track || [])
|
||||||
.filter((value, i, self) => self.indexOf(value) === i),
|
.filter((value, i, self) => self.indexOf(value) === i),
|
||||||
sub_labels: Object.values(),
|
sub_labels: Object.values(allSubLabels || []),
|
||||||
}),
|
}),
|
||||||
[config]
|
[config, allSubLabels]
|
||||||
);
|
);
|
||||||
|
|
||||||
const onSave = async (e, eventId, save) => {
|
const onSave = async (e, eventId, save) => {
|
||||||
@ -267,6 +270,18 @@ export default function Events({ path, ...props }) {
|
|||||||
</option>
|
</option>
|
||||||
))}
|
))}
|
||||||
</select>
|
</select>
|
||||||
|
<select
|
||||||
|
className="basis-1/4 cursor-pointer rounded dark:bg-slate-800"
|
||||||
|
value={searchParams.sub_label}
|
||||||
|
onChange={(e) => onFilter('sub_label', e.target.value)}
|
||||||
|
>
|
||||||
|
<option value="all">all sub labels</option>
|
||||||
|
{filterValues.sub_labels.map((item) => (
|
||||||
|
<option key={item} value={item}>
|
||||||
|
{item}
|
||||||
|
</option>
|
||||||
|
))}
|
||||||
|
</select>
|
||||||
<div ref={datePicker} className="ml-auto">
|
<div ref={datePicker} className="ml-auto">
|
||||||
<CalendarIcon
|
<CalendarIcon
|
||||||
className="h-8 w-8 cursor-pointer"
|
className="h-8 w-8 cursor-pointer"
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user