Compare commits

..

No commits in common. "30e7aa2cf95b35fac45f95c4be64fa2074575b33" and "33e7cf43dc272fb1a132bfebf651e8cb76f10620" have entirely different histories.

4 changed files with 40 additions and 128 deletions

View File

@ -1106,16 +1106,3 @@ span.ant-skeleton-input.ant-skeleton-input-sm.text-skeleton {
margin-inline-start: 0;
margin-top: 4px;
}
.simple-date-time-property-filter {
margin-top: 3px;
}
.simple-date-time-property-filter.ant-tree .ant-tree-treenode {
margin-bottom: 0;
height: 40px;
}
.ant-tree-list-holder-inner > .ant-tree-treenode:last-child {
margin-bottom: 0;
}

View File

@ -1,11 +1,9 @@
import { useState, useEffect, useContext, useMemo, useCallback } from 'react'
import { Spin, Tree, Flex, Checkbox, Typography } from 'antd'
import { Spin, Tree } from 'antd'
import PropTypes from 'prop-types'
import dayjs from 'dayjs'
import { ApiServerContext } from '../context/ApiServerContext'
import { LoadingOutlined, CaretDownOutlined } from '@ant-design/icons'
const { Text } = Typography
import { LoadingOutlined } from '@ant-design/icons'
const MONTH_NAMES = Array.from({ length: 12 }, (_, i) =>
dayjs().month(i).format('MMMM')
@ -147,7 +145,13 @@ const buildTreeData = (hierarchy) => {
day,
hour,
minute,
expression: toMinuteExpression(year, month, day, hour, minute),
expression: toMinuteExpression(
year,
month,
day,
hour,
minute
),
children: secondNodes
}
})
@ -415,7 +419,10 @@ const SimpleDateTimePropertyFilter = ({
const allKeys = useMemo(() => collectAllKeys(treeData), [treeData])
const allLeafKeys = useMemo(() => collectLeafKeys(treeData), [treeData])
const valueKey = useMemo(() => JSON.stringify(value || []), [value])
const valueKey = useMemo(
() => JSON.stringify(value || []),
[value]
)
useEffect(() => {
if (treeData.length === 0) return
@ -464,83 +471,31 @@ const SimpleDateTimePropertyFilter = ({
[allLeafKeys, onChange, treeData]
)
const checkedSet = useMemo(() => new Set(checkedKeys), [checkedKeys])
const rebuildCheckedKeys = useCallback(
(selectedLeaves) => {
const leafSet = new Set(selectedLeaves)
const next = []
const walk = (nodes) => {
for (const node of nodes) {
const leaves = collectLeafKeys([node])
if (leaves.length > 0 && leaves.every((key) => leafSet.has(key))) {
next.push(...collectAllKeys([node]))
} else if (node.children?.length) {
walk(node.children)
} else if (leafSet.has(node.key)) {
next.push(node.key)
}
}
}
walk(treeData)
return [...new Set(next)]
},
[treeData]
)
const handleNodeCheck = (node, wantChecked) => {
const leavesUnderNode = new Set(collectLeafKeys([node]))
const currentLeaves = checkedKeys.filter((key) => {
const n = nodeByKey.get(key)
return n && !n.children?.length
})
let nextLeaves
if (wantChecked) {
nextLeaves = [...new Set([...currentLeaves, ...leavesUnderNode])]
} else {
nextLeaves = currentLeaves.filter((key) => !leavesUnderNode.has(key))
}
const handleCheck = (checked) => {
const next = Array.isArray(checked) ? checked : checked.checked
const query = search.trim().toLowerCase()
if (!query) {
emitChange(rebuildCheckedKeys(nextLeaves))
emitChange(next)
return
}
// Preserve checked leaves that are hidden by the search filter
const visibleLeafKeys = new Set(collectLeafKeys(filteredTreeData))
const hiddenSelectedLeaves = currentLeaves.filter(
(key) => !visibleLeafKeys.has(key)
)
const visibleSelectedLeaves = nextLeaves.filter((key) =>
visibleLeafKeys.has(key)
)
const hiddenSelectedLeaves = checkedKeys.filter((key) => {
const node = nodeByKey.get(key)
return node && !node.children?.length && !visibleLeafKeys.has(key)
})
const visibleSelectedLeaves = next.filter((key) => {
const node = nodeByKey.get(key)
return node && !node.children?.length
})
emitChange(
rebuildCheckedKeys([...hiddenSelectedLeaves, ...visibleSelectedLeaves])
)
}
const titleRender = (node) => {
const leafKeys = collectLeafKeys([node])
const checkedCount = leafKeys.filter((key) => checkedSet.has(key)).length
const checked = leafKeys.length > 0 && checkedCount === leafKeys.length
const indeterminate = checkedCount > 0 && checkedCount < leafKeys.length
return (
<Flex align='center' style={{ marginLeft: '-3.5px', marginTop: '1px' }}>
<Checkbox
checked={checked}
indeterminate={indeterminate}
onChange={(e) => handleNodeCheck(node, e.target.checked)}
onClick={(e) => e.stopPropagation()}
style={{ minWidth: 0 }}
/>
<Text style={{ minWidth: 0 }}>{node.title}</Text>
</Flex>
expandKeysForChecked(
[...hiddenSelectedLeaves, ...visibleSelectedLeaves],
nodeByKey
)
)
}
@ -548,12 +503,11 @@ const SimpleDateTimePropertyFilter = ({
<Spin spinning={loading} indicator={<LoadingOutlined spin />}>
{treeData.length > 0 ? (
<Tree
checkable
selectable={false}
treeData={filteredTreeData}
titleRender={titleRender}
showLine={true}
switcherIcon={<CaretDownOutlined />}
className='simple-date-time-property-filter'
checkedKeys={checkedKeys}
onCheck={handleCheck}
defaultExpandAll={false}
style={{ minWidth: 0 }}
/>

View File

@ -102,36 +102,17 @@ export const Job = {
content: () => createElement(JobInfo)
}
],
columns: [
'_reference',
'quantity',
'state',
'gcodeFile',
'startedAt',
'finishedAt',
'createdAt',
'updatedAt'
],
columns: ['_reference', 'quantity', 'state', 'gcodeFile', 'createdAt'],
filters: [
'state',
'gcodeFile',
'gcodeFile._id',
'quantity',
'_id',
'_reference',
'createdAt',
'updatedAt',
'startedAt',
'finishedAt'
],
sorters: [
'createdAt',
'state',
'quantity',
'gcodeFile',
'updatedAt',
'startedAt',
'finishedAt'
'updatedAt'
],
sorters: ['createdAt', 'state', 'quantity', 'gcodeFile', 'updatedAt'],
properties: [
{
name: '_id',

View File

@ -54,24 +54,14 @@ export const SubJob = {
],
filters: [
'_id',
'job',
'printer',
'job._id',
'printer._id',
'_reference',
'state',
'createdAt',
'updatedAt',
'startedAt',
'finishedAt'
],
sorters: [
'createdAt',
'state',
'updatedAt',
'startedAt',
'finishedAt',
'job',
'printer'
'updatedAt'
],
sorters: ['createdAt', 'state', 'updatedAt'],
group: ['job'],
properties: [
{