fix: Show Document Status (docstatus) as a title on hovering the Status Indicator Pill

This commit is contained in:
shariquerik 2021-08-30 11:48:39 +05:30
parent 729ea3eafa
commit 4f31f9c501
4 changed files with 7 additions and 30 deletions

View file

@ -709,14 +709,4 @@
<symbol xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" id="icon-crop">
<path d="M14.88,11.63H4.33V1.12m7.34,10.51v3.25M6,4.37h5.64V10M1.13,4.37h3.2" stroke-linecap="round" stroke-linejoin="round"/>
</symbol>
<symbol viewBox="0 0 16 16" id="icon-dot">
<circle cx="8" cy="8" r="1.5" stroke-width="3"/>
</symbol>
<symbol viewBox="0 0 16 16" id="icon-submitted">
<path d="M3 9.037L6.03 12 13 4" stroke-width="2.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
</symbol>
<symbol viewBox="0 0 16 16" id="icon-cancelled">
<path d="M4 4l8 8M4 12l8-8" stroke-width="2.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
</symbol>
</svg>

Before

Width:  |  Height:  |  Size: 92 KiB

After

Width:  |  Height:  |  Size: 92 KiB

View file

@ -952,11 +952,11 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
get_indicator_html(doc) {
const indicator = frappe.get_indicator(doc, this.doctype);
const icon = doc.docstatus == 1 ? 'submitted' : doc.docstatus == 2 ? 'cancelled' : 'dot';
const title = doc.docstatus == 1 ? 'Document has been submitted' : doc.docstatus == 2 ?
'Document has been cancelled' : 'Document is in draft state';
if (indicator) {
return `<span class="list-indicator-pill indicator-pill ${indicator[1]} filterable ellipsis"
data-filter='${indicator[2]}'>
<span class="indicator-pill-icon">${frappe.utils.icon(icon, 'xs', '', indicator[1])}</span>
return `<span class="indicator-pill ${indicator[1]} filterable ellipsis"
data-filter='${indicator[2]}' title='${__(title)}'>
<span class="ellipsis"> ${__(indicator[0])}</span>
<span>`;
}

View file

@ -1114,17 +1114,14 @@ Object.assign(frappe.utils, {
}
},
icon(icon_name, size="sm", icon_class="", stroke_color="") {
icon(icon_name, size="sm", icon_class="") {
let size_class = "";
let icon_style = "";
if (typeof size == "object") {
icon_style = `width: ${size.width}; height: ${size.height};`;
icon_style = `width: ${size.width}; height: ${size.height}`;
} else {
size_class = `icon-${size}`;
}
if (stroke_color) {
icon_style += `stroke: ${stroke_color};`;
}
return `<svg class="icon ${size_class}" style="${icon_style}">
<use class="${icon_class}" href="#icon-${icon_name}"></use>
</svg>`;

View file

@ -175,14 +175,4 @@
@keyframes blink {
50% { opacity: 0.5; }
}
.indicator-pill-icon {
margin-right: 3px;
}
.list-indicator-pill::before {
content: '';
width: unset;
margin-right: unset;
}
}