11import {
2- ColumnTypeCompBuilder ,
3- ColumnTypeViewFn ,
4- } from "comps/comps/tableComp/column/columnTypeCompBuilder" ;
5- import { ColumnValueTooltip } from "comps/comps/tableComp/column/simpleColumnTypeComps" ;
6- import { StringControl } from "comps/controls/codeControl" ;
7- import { withDefault } from "comps/generators" ;
8- import { formatPropertyView } from "comps/utils/propertyUtils" ;
9- import { trans } from "i18n" ;
10- import {
11- TIME_FORMAT ,
12- formatTimestamp ,
13- timestampToHumanReadable ,
14- } from "util/dateTimeUtils" ;
15- import { DateEdit } from "./columnDateComp" ;
16-
17- const childrenMap = {
18- text :StringControl ,
19- format :withDefault ( StringControl , TIME_FORMAT ) ,
20- inputFormat :withDefault ( StringControl , TIME_FORMAT ) ,
21- } ;
22-
23- let inputFormat = TIME_FORMAT ;
24-
25- const getBaseValue :ColumnTypeViewFn < typeof childrenMap , string , string > = ( props ) =>
26- props . text ;
27-
28- export const TimeComp = ( function ( ) {
29- return new ColumnTypeCompBuilder (
30- childrenMap ,
31- ( props , dispatch ) => {
32- inputFormat = props . inputFormat ;
33- const value = props . changeValue ?? getBaseValue ( props , dispatch ) ;
34-
35- // Convert value to a number if it's a valid timestamp
36- const timestamp = Number ( value ) ;
37- if ( ! isNaN ( timestamp ) ) {
38- return formatTimestamp ( timestamp ) ;
39- }
40-
41- return timestampToHumanReadable ( timestamp ) ?? value ; // Returns readable time
42- } ,
43- ( nodeValue ) => {
44- const timestamp = Number ( nodeValue . text . value ) ;
45- return ! isNaN ( timestamp )
46- ?timestampToHumanReadable ( timestamp ) // Convert to readable format if valid timestamp
47- :nodeValue . text . value ; // Otherwise, return original value
48- } ,
49- getBaseValue
50- )
51- . setEditViewFn ( ( props ) => (
52- < DateEdit
53- value = { props . value }
54- onChange = { props . onChange }
55- onChangeEnd = { props . onChangeEnd }
56- showTime = { true } // Ensures only time is shown
57- inputFormat = { inputFormat }
58- />
59- ) )
60- . setPropertyViewFn ( ( children ) => (
2+ ColumnTypeCompBuilder ,
3+ ColumnTypeViewFn ,
4+ } from "comps/comps/tableComp/column/columnTypeCompBuilder" ;
5+ import { ColumnValueTooltip } from "comps/comps/tableComp/column/simpleColumnTypeComps" ;
6+ import { StringControl } from "comps/controls/codeControl" ;
7+ import { withDefault } from "comps/generators" ;
8+ import { formatPropertyView } from "comps/utils/propertyUtils" ;
9+ import { trans } from "i18n" ;
10+ import {
11+ TIME_FORMAT ,
12+ formatTimestamp ,
13+ timestampToHumanReadable ,
14+ } from "util/dateTimeUtils" ;
15+ import { DateEdit } from "./columnDateComp" ;
16+ import { IconControl } from "comps/controls/iconControl" ;
17+ import { hasIcon } from "comps/utils" ;
18+
19+ const childrenMap = {
20+ text :StringControl ,
21+ format :withDefault ( StringControl , TIME_FORMAT ) ,
22+ inputFormat :withDefault ( StringControl , TIME_FORMAT ) ,
23+ prefixIcon :IconControl ,
24+ suffixIcon :IconControl ,
25+ } ;
26+
27+ let inputFormat = TIME_FORMAT ;
28+
29+ const getBaseValue :ColumnTypeViewFn < typeof childrenMap , string , string > = ( props ) =>
30+ props . text ;
31+
32+ export const TimeComp = ( function ( ) {
33+ return new ColumnTypeCompBuilder (
34+ childrenMap ,
35+ ( props , dispatch ) => {
36+ inputFormat = props . inputFormat ;
37+ const value = props . changeValue ?? getBaseValue ( props , dispatch ) ;
38+
39+ // Convert value to a number if it's a valid timestamp
40+ const timestamp = Number ( value ) ;
41+ const formattedValue = ! isNaN ( timestamp )
42+ ?formatTimestamp ( timestamp )
43+ :timestampToHumanReadable ( timestamp ) ?? value ;
44+
45+ return (
6146< >
62- { children . text . propertyView ( {
63- label :trans ( "table.columnValue" ) ,
64- tooltip :ColumnValueTooltip ,
65- } ) }
66- { formatPropertyView ( { children, placeholder :TIME_FORMAT } ) }
47+ { hasIcon ( props . prefixIcon ) && < span > { props . prefixIcon } </ span > }
48+ < span > { formattedValue } </ span >
49+ { hasIcon ( props . suffixIcon ) && < span > { props . suffixIcon } </ span > }
6750</ >
68- ) )
69- . build ( ) ;
70- } ) ( ) ;
71-
51+ ) ;
52+ } ,
53+ ( nodeValue ) => {
54+ const timestamp = Number ( nodeValue . text . value ) ;
55+ return ! isNaN ( timestamp )
56+ ?timestampToHumanReadable ( timestamp )
57+ :nodeValue . text . value ;
58+ } ,
59+ getBaseValue
60+ )
61+ . setEditViewFn ( ( props ) => (
62+ < DateEdit
63+ value = { props . value }
64+ onChange = { props . onChange }
65+ onChangeEnd = { props . onChangeEnd }
66+ showTime = { true } // Ensures only time is shown
67+ inputFormat = { inputFormat }
68+ />
69+ ) )
70+ . setPropertyViewFn ( ( children ) => (
71+ < >
72+ { children . text . propertyView ( {
73+ label :trans ( "table.columnValue" ) ,
74+ tooltip :ColumnValueTooltip ,
75+ } ) }
76+ { children . prefixIcon . propertyView ( {
77+ label :trans ( "button.prefixIcon" ) ,
78+ } ) }
79+ { children . suffixIcon . propertyView ( {
80+ label :trans ( "button.suffixIcon" ) ,
81+ } ) }
82+ { formatPropertyView ( { children, placeholder :TIME_FORMAT } ) }
83+ </ >
84+ ) )
85+ . build ( ) ;
86+ } ) ( ) ;