extern/egroupware_official
1
0
Fork 0
mirror of https://github.com/EGroupware/egroupware.git synced 2024-11-08 00:54:15 +01:00
Code Issues Packages Projects Releases Wiki Activity

Et2Button properties hideOnReadonly, noValidation

Browse Source 
Added hideOnReadonly, default false.  Disabled/readonly buttons are now visible but disabled, unless you set hideOnReadonly="false" to get previous behaviour.

Added noValidation, default false.  It's just passed to etemplate2.submit() as before
This commit is contained in:
nathan 2022-04-04 16:24:01 -06:00
parent 76e76a9e18
commit a763b84be4
2 changed files with 39 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
api/js/etemplate/Et2Button/ButtonStyles.ts
View File

@ -14,7 +14,13 @@ export const buttonStyles = [
background-color: var(--gray_10, #e6e6e6);
border-radius: 3px;
}
:host(:hover) {
:host([disabled]) {
display: flex;
}
:host([disabled]) ::slotted(img) {
filter: grayscale(1) contrast(0.2);
}
:host(:hover):not([disabled]) {
box-shadow: 1px 1px 1px rgb(0 0 0 / 60%);
background-color: var(--bg_color_15_gray, #d9d9d9);
}
@ -25,7 +31,9 @@ export const buttonStyles = [
margin: 2px;
height:20px;
font-size: 9pt;
color: var(--btn-label-color);
text-shadow: 0 0;
}
:not([disabled]) div {
color: var(--btn-label-color);
}
`];

35
api/js/etemplate/Et2Button/Et2Button.ts
View File

@ -62,9 +62,6 @@ export class Et2Button extends Et2InputWidget(SlotMixin(LionButton))
max-width: 125px;
min-width: fit-content;
}
:host([readonly]) {
display: none;
}
/* Set size for icon */
::slotted(img.imageOnly) {
padding-right: 0px !important;
@ -93,11 +90,22 @@ export class Et2Button extends Et2InputWidget(SlotMixin(LionButton))
label: {type: String},
image: {type: String},
/**
* If button is set to readonly, do we want to hide it completely (old behaviour) or show it as disabled
* (default)
*/
hideOnReadonly: {type: Boolean},
/**
* Button should submit the etemplate
* Return false from the click handler to cancel the submit, or set doSubmit to false to skip submitting.
*/
doSubmit: {type: Boolean, reflect: false}
doSubmit: {type: Boolean, reflect: false},
/**
* When submitting, skip the validation step. Allows to submit etemplates directly to the server.
*/
noValidation: {type: Boolean}
}
}
@ -119,6 +127,8 @@ export class Et2Button extends Et2InputWidget(SlotMixin(LionButton))
// Property default values
this.__image = '';
this.doSubmit = true;
this.hideOnReadonly = false;
this.noValidation = false;
// Do not add icon here, no children can be added in constructor
@ -177,7 +187,7 @@ export class Et2Button extends Et2InputWidget(SlotMixin(LionButton))
// Submit the form
if(this.doSubmit)
{
return this.getInstanceManager().submit();
return this.getInstanceManager().submit(this, undefined, this.noValidation);
}
this.clicked = false;
this.getInstanceManager()?.skip_close_prompt(false);
@ -192,6 +202,19 @@ export class Et2Button extends Et2InputWidget(SlotMixin(LionButton))
{
super.requestUpdate(name, oldValue);
// "disabled" is the attribute from the spec
if(name == 'readonly')
{
if(this.readonly)
{
this.setAttribute('disabled', "");
}
else
{
this.removeAttribute("disabled");
}
}
// Default image & class are determined based on ID
if(name == "id" && this._widget_id)
{
@ -214,7 +237,7 @@ export class Et2Button extends Et2InputWidget(SlotMixin(LionButton))
render()
{
if(this.readonly)
if(this.readonly && this.hideOnReadonly)
{
return '';
}