fix: show restricted button to indicate permission restrictions

This commit is contained in:
prssanna 2020-05-07 14:00:32 +05:30
parent 2c12af2319
commit fff07548fd
7 changed files with 50 additions and 19 deletions

View file

@ -0,0 +1,5 @@
.restricted-button {
cursor: default;
position: relative;
right: -5px;
}

View file

@ -26,6 +26,13 @@ class Dashboard {
</div>`).appendTo(this.wrapper.find(".page-content").empty());
this.container = this.wrapper.find(".dashboard-graph");
this.page = wrapper.page;
this.page.set_title_sub(
$(`<button class="restricted-button">
<span class="octicon octicon-lock"></span>
<span>${__('Restricted')}</span>
</button>`)
)
}
show() {

View file

@ -139,7 +139,7 @@ frappe.views.ListView = class ListView extends frappe.views.BaseList {
show_restricted_list_indicator_if_applicable() {
const match_rules_list = frappe.perm.get_match_rules(this.doctype);
if (match_rules_list.length) {
this.restricted_list = $(`<button class="restricted-list form-group">${__('Restricted')}</button>`)
this.restricted_list = $(`<button class="restricted-button">${__('Restricted')}</button>`)
.prepend('<span class="octicon octicon-lock"></span>')
.click(() => this.show_restrictions(match_rules_list))
.appendTo(this.page.page_form);

View file

@ -41,7 +41,13 @@ frappe.views.DashboardView = class DashboardView extends frappe.views.ListView {
this.$dashboard_page = this.$page.find('.layout-main-section-wrapper').addClass('dashboard-page');
this.$page.find('.page-form').empty().html(
`<div class="dashboard-header">
<div class="text-muted uppercase">${dashboard_name}</div>
<div class="text-muted">
<span class="uppercase header-title"> ${dashboard_name} </span>
</div>
<button class="restricted-button">
<span class="octicon octicon-lock"></span>
<span>${__('Restricted')}</span>
</button>
<div class="text-muted customize-dashboard" data-action="customize">${__('Customize')}</div>
<div class="small text-muted customize-options small-bounce">
<span class="reset-customization customize-option" data-action="reset_dashboard_customization">${__('Reset')}</span>

View file

@ -28,6 +28,18 @@
display: flex;
justify-content: space-between;
width: 100%;
.header-title {
line-height: 1.5em;
vertical-align: text-bottom;
}
.restricted-button {
cursor: default;
position: relative;
right: 5px;
top: -3px;
}
}
.customize-dashboard {

View file

@ -316,6 +316,23 @@ li.user-progress {
}
}
.restricted-button {
padding: 0px 10px;
border: 1px solid @yellow;
height: 25px;
font-weight: 600;
border-radius: 5px;
background: lightyellow;
color: @text-light;
margin: auto 5px auto auto;
font-size: @text-small;
outline: 0;
.octicon {
padding-right: 5px;
font-size: 12px;
}
}
/* on small screens, show only icons on top */
@media (max-width: 767px) {
.module-view-layout .nav-stacked > li {

View file

@ -298,26 +298,10 @@ input.list-check-all, input.list-row-checkbox {
.awesomplete > ul {
min-width: 300px;
}
.restricted-list {
padding: 0px 10px;
border: 1px solid @yellow;
height: 25px;
font-weight: 600;
border-radius: 5px;
background: lightyellow;
color: @text-light;
margin: auto 5px auto auto;
font-size: @text-small;
outline: 0;
.octicon {
padding-right: 5px;
font-size: 12px;
}
}
}
.frappe-rtl {
.restricted-list {
.restricted-button {
margin: auto auto auto 5px;
direction: ltr;
}