Angular 18 migration

This commit is contained in:
Igor Kulikov 2024-10-02 20:18:00 +03:00
parent 8273c3fafd
commit aabc029800
3 changed files with 13 additions and 4 deletions

View File

@ -60,6 +60,11 @@ class ThingsboardDate extends React.Component<JsonFormFieldProps, ThingsboardDat
<LocalizationProvider dateAdapter={AdapterMoment}> <LocalizationProvider dateAdapter={AdapterMoment}>
<div style={{width: '100%', display: 'block'}}> <div style={{width: '100%', display: 'block'}}>
<DatePicker <DatePicker
slotProps={{
textField: {
variant: 'standard'
}
}}
format='MM/DD/YYYY' format='MM/DD/YYYY'
className={fieldClass} className={fieldClass}
label={this.props.form.title} label={this.props.form.title}

View File

@ -31,6 +31,8 @@ interface ThingsboardIconState extends JsonFormFieldState {
class ThingsboardIcon extends React.Component<JsonFormFieldProps, ThingsboardIconState> { class ThingsboardIcon extends React.Component<JsonFormFieldProps, ThingsboardIconState> {
containerRef = React.createRef<HTMLDivElement>();
constructor(props) { constructor(props) {
super(props); super(props);
this.onBlur = this.onBlur.bind(this); this.onBlur = this.onBlur.bind(this);
@ -54,7 +56,7 @@ class ThingsboardIcon extends React.Component<JsonFormFieldProps, ThingsboardIco
} }
componentDidMount() { componentDidMount() {
const node = ReactDOM.findDOMNode(this); const node = this.containerRef.current;
const iconContainer = $(node).children('#icon-container'); const iconContainer = $(node).children('#icon-container');
iconContainer.click((event) => { iconContainer.click((event) => {
if (!this.props.form.readonly) { if (!this.props.form.readonly) {
@ -64,7 +66,7 @@ class ThingsboardIcon extends React.Component<JsonFormFieldProps, ThingsboardIco
} }
componentWillUnmount() { componentWillUnmount() {
const node = ReactDOM.findDOMNode(this); const node = this.containerRef.current;
const iconContainer = $(node).children('#icon-container'); const iconContainer = $(node).children('#icon-container');
iconContainer.off( 'click' ); iconContainer.off( 'click' );
} }
@ -102,6 +104,7 @@ class ThingsboardIcon extends React.Component<JsonFormFieldProps, ThingsboardIco
alignItems: 'center' alignItems: 'center'
}, },
icon: { icon: {
padding: '12px',
marginRight: '10px', marginRight: '10px',
marginBottom: 'auto', marginBottom: 'auto',
cursor: 'pointer', cursor: 'pointer',
@ -134,12 +137,13 @@ class ThingsboardIcon extends React.Component<JsonFormFieldProps, ThingsboardIco
} }
return ( return (
<div style={ styles.container }> <div ref={this.containerRef} style={ styles.container }>
<div id='icon-container' style={ styles.iconContainer }> <div id='icon-container' style={ styles.iconContainer }>
<IconButton style={ styles.icon }> <IconButton style={ styles.icon }>
<Icon>{pickedIcon}</Icon> <Icon>{pickedIcon}</Icon>
</IconButton> </IconButton>
<TextField <TextField
variant={'standard'}
className={fieldClass} className={fieldClass}
label={this.props.form.title} label={this.props.form.title}
error={!this.props.valid} error={!this.props.valid}

View File

@ -24,7 +24,7 @@ class ThingsboardRadios extends React.Component<JsonFormFieldProps, JsonFormFiel
render() { render() {
const items = this.props.form.titleMap.map((item, index) => { const items = this.props.form.titleMap.map((item, index) => {
return ( return (
<FormControlLabel value={item.value} control={<Radio />} label={item.name} key={index} /> <FormControlLabel value={item.value} control={<Radio color={'secondary'} />} label={item.name} key={index} />
); );
}); });