Implement readonly for date widget

This commit is contained in:
nathan 2021-11-01 10:21:08 -06:00
parent 76d7447dab
commit 312bf62adc
2 changed files with 43 additions and 0 deletions

View File

@ -186,6 +186,11 @@ export class Et2Date extends Et2InputWidget(LionInputDatepicker)
getValue()
{
if(this.readOnly)
{
return null;
}
// The supplied value was not understandable, return null
if(this.modelValue instanceof Unparseable || !this.modelValue)
{
@ -236,12 +241,35 @@ export class Et2Date extends Et2InputWidget(LionInputDatepicker)
return new Date(modelValue.getTime() + offset);
}
/**
* Overriding from parent for read-only
*
* @return {TemplateResult}
* @protected
*/
// eslint-disable-next-line class-methods-use-this
_inputGroupInputTemplate()
{
if(this.readOnly)
{
return this.formattedValue;
}
else
{
return super._inputGroupInputTemplate();
}
}
/**
* Overriding parent to add class to button, and use an image instead of unicode emoji
*/
// eslint-disable-next-line class-methods-use-this
_invokerTemplate()
{
if(this.readOnly)
{
return '';
}
let img = this.egw() ? this.egw().image("calendar") || '' : '';
return html`
<button

View File

@ -47,6 +47,21 @@ describe("Date widget", () =>
assert.equal(element.querySelector("[slot='label']").textContent, "Label set");
})
it('Readonly does not return a value', () =>
{
element.readOnly = true;
let test_time_string = '2008-09-22T12:00:00.000Z';
element.set_value(test_time_string);
// Use a Promise to wait for asychronous changes to the DOM
return Promise.resolve().then(() =>
{
// Read-only widget returns null
assert.equal(element.getValue(), null);
});
});
const tz_list = [
{name: "America/Edmonton", offset: 600},
{name: "UTC", offset: 0},