Fix setting Et2DateDuration.value programmatically did not update UI

This commit is contained in:
nathan 2024-09-11 10:57:32 -06:00
parent e156ea8f64
commit 66093ae038
2 changed files with 19 additions and 2 deletions

View File

@ -17,6 +17,7 @@ import {dateStyles} from "./DateStyles";
import shoelace from "../Styles/shoelace";
import {customElement} from "lit/decorators/custom-element.js";
import {property} from "lit/decorators/property.js";
import {live} from "lit/directives/live.js";
export interface formatOptions
{
@ -363,6 +364,18 @@ export class Et2DateDuration extends Et2InputWidget(LitElement)
set value(_value)
{
this._display = this._convert_to_display(this.emptyNot0 && ""+_value === "" ? '' : parseFloat(_value));
// Update values
(typeof this._display.value == "string" ? this._display.value.split(":") : [this._display.value])
.forEach((v, index) =>
{
if(!this._durationNode[index])
{
return;
}
const old = this._durationNode[index]?.value;
this._durationNode[index].value = v;
this._durationNode[index].requestUpdate("value", old);
});
this.requestUpdate();
}
@ -578,7 +591,7 @@ export class Et2DateDuration extends Et2InputWidget(LitElement)
step=${this.step}
precision=${typeof input.precision === "number" ? input.precision : nothing}
title=${input.title || nothing}
value=${input.value}
value=${live(input.value)}
@sl-change=${this.handleInputChange}
></et2-number>`
)}

View File

@ -218,6 +218,7 @@ export class Et2Number extends Et2Textbox
@property({type: String})
set value(val)
{
const old = this.value;
if("" + val !== "")
{
// Remove separator so parseFloat works
@ -238,6 +239,7 @@ export class Et2Number extends Et2Textbox
if(isNaN(val))
{
super.value = val;
this.requestUpdate("value", old);
return;
}
if(this.max && val > this.max)
@ -249,6 +251,8 @@ export class Et2Number extends Et2Textbox
val = this.min;
}
super.value = formatNumber(val, this.decimalSeparator, this.thousandsSeparator, this.precision);
this.requestUpdate("value", old);
}
get value() : string
@ -337,7 +341,7 @@ export class Et2Number extends Et2Textbox
// The initial options need to match an actual number
radix: this.decimalSeparator,
thousandsSeparator: this.thousandsSeparator,
mask: this.mask ?? Number,
// mask: this.mask ?? Number,
lazy: false,
padFractionalZeros: (typeof this.precision !== "undefined"),
definitions: {