mirror of
https://github.com/espocrm/espocrm.git
synced 2026-06-27 14:36:05 +00:00
Record menu icons
This commit is contained in:
@@ -9,7 +9,8 @@
|
||||
"label": "Close",
|
||||
"handler": "crm:handlers/case/detail-actions",
|
||||
"actionFunction": "close",
|
||||
"checkVisibilityFunction": "isCloseAvailable"
|
||||
"checkVisibilityFunction": "isCloseAvailable",
|
||||
"iconClass": "fas fa-check"
|
||||
},
|
||||
{
|
||||
"name": "reject",
|
||||
|
||||
@@ -40,7 +40,8 @@
|
||||
"acl": "edit",
|
||||
"handler": "modules/crm/handlers/task/detail-actions",
|
||||
"actionFunction": "complete",
|
||||
"checkVisibilityFunction": "isCompleteAvailable"
|
||||
"checkVisibilityFunction": "isCompleteAvailable",
|
||||
"iconClass": "fas fa-check"
|
||||
}
|
||||
],
|
||||
"filterList": [
|
||||
|
||||
@@ -23,7 +23,8 @@
|
||||
"handler": "handlers/record/lock-action",
|
||||
"checkVisibilityFunction": "canBeLocked",
|
||||
"actionFunction": "actionLock",
|
||||
"groupIndex": 9
|
||||
"groupIndex": 9,
|
||||
"iconClass": "fas fa-lock"
|
||||
},
|
||||
{
|
||||
"name": "unlock",
|
||||
@@ -32,7 +33,8 @@
|
||||
"handler": "handlers/record/lock-action",
|
||||
"checkVisibilityFunction": "canBeUnlocked",
|
||||
"actionFunction": "actionUnlock",
|
||||
"groupIndex": 9
|
||||
"groupIndex": 9,
|
||||
"iconClass": "fas fa-unlock"
|
||||
}
|
||||
],
|
||||
"massActionList": [
|
||||
|
||||
@@ -52,6 +52,7 @@ export default class extends DetailRecordView {
|
||||
'label': 'Set Held',
|
||||
'name': 'setHeld',
|
||||
onClick: () => this.actionSetHeld(),
|
||||
iconClass: 'fas fa-check',
|
||||
});
|
||||
|
||||
this.dropdownItemList.push({
|
||||
|
||||
@@ -72,6 +72,7 @@ class MeetingModalDetailView extends DetailModalView {
|
||||
name: 'setHeld',
|
||||
text: this.translate('Set Held', 'labels', this.model.entityType),
|
||||
hidden: true,
|
||||
iconClass: 'fas fa-check',
|
||||
});
|
||||
|
||||
this.addDropdownItem({
|
||||
@@ -86,6 +87,8 @@ class MeetingModalDetailView extends DetailModalView {
|
||||
text: this.translate('Send Invitations', 'labels', 'Meeting'),
|
||||
hidden: !this.isSendInvitationsToBeDisplayed(),
|
||||
onClick: () => this.actionSendInvitations(),
|
||||
groupIndex: 10,
|
||||
iconClass: 'far fa-paper-plane',
|
||||
});
|
||||
|
||||
this.initAcceptanceStatus();
|
||||
|
||||
@@ -59,6 +59,7 @@ class MeetingDetailRecordView extends DetailRecordView {
|
||||
'label': 'Set Held',
|
||||
'name': 'setHeld',
|
||||
onClick: () => this.actionSetHeld(),
|
||||
iconClass: 'fas fa-check',
|
||||
});
|
||||
|
||||
this.dropdownItemList.push({
|
||||
|
||||
@@ -38,6 +38,7 @@ export default class TaskDetailRecordView extends DetailRecordView {
|
||||
label: 'Complete',
|
||||
name: 'setCompleted',
|
||||
onClick: () => this.actionSetCompleted(),
|
||||
iconClass: 'fas fa-check',
|
||||
});
|
||||
|
||||
const historyStatusList = [
|
||||
|
||||
@@ -253,7 +253,7 @@ function prepareItemContent(
|
||||
|
||||
icon = div.firstElementChild ? toVNode(div.firstElementChild) : null;
|
||||
} else if (options.iconClass) {
|
||||
icon = h('span', {props: {className: options.iconClass}});
|
||||
icon = h('span', {props: {className: options.iconClass + ' item-icon'}});
|
||||
}
|
||||
|
||||
if (isDropdownItem) {
|
||||
|
||||
@@ -82,6 +82,7 @@ export interface DialogButton {
|
||||
className?: string;
|
||||
title?: string;
|
||||
groupIndex?: number;
|
||||
iconClass?: string;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -797,6 +798,7 @@ class FooterComponent {
|
||||
disabled: it.disabled,
|
||||
text: it.text,
|
||||
html: it.html,
|
||||
iconClass: it.iconClass,
|
||||
onClick: event => {
|
||||
if (it.onClick) {
|
||||
it.onClick(this.dialog, event);
|
||||
@@ -831,6 +833,7 @@ class FooterComponent {
|
||||
disabled: it.disabled,
|
||||
text: it.text,
|
||||
html: it.html,
|
||||
iconClass: it.iconClass,
|
||||
onClick: event => {
|
||||
if (it.onClick) {
|
||||
it.onClick(this.dialog, event);
|
||||
|
||||
@@ -124,6 +124,7 @@ class EmailDetailRecordView extends DetailRecordView {
|
||||
name: 'markAsImportant',
|
||||
hidden: this.model.get('isImportant'),
|
||||
groupIndex: 1,
|
||||
iconClass: 'far fa-star',
|
||||
});
|
||||
|
||||
this.addDropdownItem({
|
||||
@@ -138,6 +139,7 @@ class EmailDetailRecordView extends DetailRecordView {
|
||||
name: 'moveToTrash',
|
||||
hidden: this.isInTrash(),
|
||||
groupIndex: 2,
|
||||
iconClass: 'far fa-trash-can',
|
||||
});
|
||||
|
||||
this.addDropdownItem({
|
||||
@@ -153,12 +155,14 @@ class EmailDetailRecordView extends DetailRecordView {
|
||||
groupIndex: 2,
|
||||
hidden: this.isInArchive(),
|
||||
onClick: () => this.actionMoveToArchive(),
|
||||
iconClass: 'far fa-caret-square-down',
|
||||
});
|
||||
|
||||
this.addDropdownItem({
|
||||
label: 'Move to Folder',
|
||||
name: 'moveToFolder',
|
||||
groupIndex: 2,
|
||||
iconClass: 'far fa-folder',
|
||||
});
|
||||
} else if (this.model.attributes.groupFolderId) {
|
||||
this.addDropdownItem({
|
||||
@@ -166,6 +170,7 @@ class EmailDetailRecordView extends DetailRecordView {
|
||||
name: 'moveToTrash',
|
||||
hidden: this.isInTrash(),
|
||||
groupIndex: 2,
|
||||
iconClass: 'far fa-trash-can',
|
||||
});
|
||||
|
||||
this.addDropdownItem({
|
||||
@@ -181,6 +186,7 @@ class EmailDetailRecordView extends DetailRecordView {
|
||||
groupIndex: 2,
|
||||
hidden: this.isInArchive() || this.isInTrash(),
|
||||
onClick: () => this.actionMoveToArchive(),
|
||||
iconClass: 'far fa-caret-square-down',
|
||||
});
|
||||
|
||||
this.addDropdownItem({
|
||||
@@ -188,12 +194,14 @@ class EmailDetailRecordView extends DetailRecordView {
|
||||
name: 'moveToFolder',
|
||||
groupIndex: 2,
|
||||
hidden: this.isInTrash(),
|
||||
iconClass: 'far fa-folder',
|
||||
});
|
||||
} else {
|
||||
this.addDropdownItem({
|
||||
label: 'Move to Folder',
|
||||
name: 'moveToFolder',
|
||||
groupIndex: 2,
|
||||
iconClass: 'far fa-folder',
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@@ -557,6 +557,8 @@ class ModalView<S extends ViewSchema = ViewSchema> extends View<S> {
|
||||
}
|
||||
}
|
||||
|
||||
o.iconCLass = item.iconClass;
|
||||
|
||||
o.onClick = o.onClick ?? ((_d, e: any) => {
|
||||
// noinspection ES6ConvertLetToConst
|
||||
let handler = o.handler || (o.data || {}).handler;
|
||||
|
||||
@@ -255,6 +255,7 @@ class DetailModalView extends ModalView {
|
||||
name: 'duplicate',
|
||||
label: 'Duplicate',
|
||||
groupIndex: 0,
|
||||
iconClass: 'far fa-copy',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@@ -169,6 +169,12 @@ export interface DropdownItem {
|
||||
* A group index.
|
||||
*/
|
||||
groupIndex?: number;
|
||||
/**
|
||||
* An icon class.
|
||||
*
|
||||
* @since 10.0.0
|
||||
*/
|
||||
iconClass?: string;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -493,6 +499,7 @@ class DetailRecordView<S extends DetailRecordViewSchema = DetailRecordViewSchema
|
||||
name: 'delete',
|
||||
label: 'Remove',
|
||||
groupIndex: 0,
|
||||
iconClass: 'fas fa-times',
|
||||
},
|
||||
]
|
||||
|
||||
@@ -966,6 +973,7 @@ class DetailRecordView<S extends DetailRecordViewSchema = DetailRecordViewSchema
|
||||
label: 'Duplicate',
|
||||
name: 'duplicate',
|
||||
groupIndex: 0,
|
||||
iconClass: 'far fa-copy',
|
||||
});
|
||||
}
|
||||
|
||||
@@ -1007,6 +1015,7 @@ class DetailRecordView<S extends DetailRecordViewSchema = DetailRecordViewSchema
|
||||
label: 'Print to PDF',
|
||||
name: 'printPdf',
|
||||
groupIndex: 6,
|
||||
iconClass: 'far fa-file-pdf',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@@ -123,6 +123,7 @@ export default class DetailRecordButtonsView extends View<{
|
||||
hidden: it.hidden,
|
||||
disabled: it.disabled || data.allDisabled,
|
||||
html: it.html,
|
||||
iconClass: it.iconClass,
|
||||
}).node()
|
||||
);
|
||||
});
|
||||
|
||||
@@ -243,9 +243,12 @@ td.cell[data-name="buttons"] > .btn-group {
|
||||
left: -10px;
|
||||
}
|
||||
|
||||
.dropdown-menu-with-icons li .item-text {
|
||||
padding-left: 0;
|
||||
padding-right: 8px;
|
||||
ul {
|
||||
&.dropdown-menu-with-icons,
|
||||
&:has( > li > a > .icon-item) {
|
||||
padding-left: 0;
|
||||
padding-right: var(--8px);
|
||||
}
|
||||
}
|
||||
|
||||
.panel {
|
||||
|
||||
@@ -148,22 +148,38 @@ ul.dropdown-menu {
|
||||
}
|
||||
}
|
||||
|
||||
ul.dropdown-menu-with-icons {
|
||||
> li {
|
||||
a {
|
||||
padding-left: var(--10px);
|
||||
}
|
||||
ul {
|
||||
&.dropdown-menu-with-icons,
|
||||
&:has(> li > a > .item-icon) {
|
||||
> li {
|
||||
a {
|
||||
padding-left: var(--10px);
|
||||
}
|
||||
|
||||
.fas, .far, .glyphicon, .empty-icon {
|
||||
width: var(--16px);
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
color: var(--gray-soft);
|
||||
}
|
||||
.fas,
|
||||
.far,
|
||||
.glyphicon,
|
||||
.empty-icon {
|
||||
width: var(--16px);
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
color: var(--gray-soft);
|
||||
}
|
||||
|
||||
.item-text {
|
||||
padding-left: var(--8px);
|
||||
position: static;
|
||||
.item-icon {
|
||||
font-size: var(--12px);
|
||||
}
|
||||
|
||||
.item-text {
|
||||
padding-left: var(--8px);
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:has(> li > a > .item-icon) {
|
||||
> li > a:not(:has(> .item-icon)) {
|
||||
padding-left: var(--26px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user