fix: Add plus icon in sidebar items to settings create page (#2141)

* [Issue-#1965] Add changes

* Added newLink prop with default value true to show the new icon

* Fix button alignment

Co-authored-by: Nithin David Thomas <webofnithin@gmail.com>
This commit is contained in:
Suraj Rajput 2021-05-08 19:06:41 +05:30 committed by GitHub
parent 055008cf03
commit 7f6abdc987
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 43 additions and 13 deletions

View file

@ -144,6 +144,7 @@ export default {
cssClass: 'menu-title align-justify',
toState: frontendURL(`accounts/${this.accountId}/settings/inboxes`),
toStateName: 'settings_inbox_list',
newLinkRouteName: 'settings_inbox_new',
children: this.inboxes.map(inbox => ({
id: inbox.id,
label: inbox.name,
@ -158,10 +159,13 @@ export default {
icon: 'ion-pound',
label: 'LABELS',
hasSubMenu: true,
newLink: true,
key: 'label',
cssClass: 'menu-title align-justify',
toState: frontendURL(`accounts/${this.accountId}/settings/labels`),
toStateName: 'labels_list',
showModalForNewItem: true,
modalName: 'AddLabel',
children: this.accountLabels.map(label => ({
id: label.id,
label: label.title,
@ -178,10 +182,12 @@ export default {
icon: 'ion-ios-people',
label: 'TEAMS',
hasSubMenu: true,
newLink: true,
key: 'team',
cssClass: 'menu-title align-justify teams-sidebar-menu',
toState: frontendURL(`accounts/${this.accountId}/settings/teams`),
toStateName: 'teams_list',
newLinkRouteName: 'settings_teams_new',
children: this.teams.map(team => ({
id: team.id,
label: team.name,

View file

@ -19,7 +19,7 @@
<span
v-if="showItem(menuItem)"
class="child-icon ion-android-add-circle"
@click.prevent="newLinkClick"
@click.prevent="newLinkClick(menuItem)"
/>
</a>
<ul v-if="menuItem.hasSubMenu" class="nested vertical menu">
@ -52,6 +52,11 @@
</a>
</router-link>
</ul>
<add-label-modal
v-if="showAddLabel"
:show.sync="showAddLabel"
:on-close="hideAddLabelPopup"
/>
</router-link>
</template>
@ -61,8 +66,17 @@ import { mapGetters } from 'vuex';
import router from '../../routes';
import adminMixin from '../../mixins/isAdmin';
import { getInboxClassByType } from 'dashboard/helper/inbox';
import AddLabelModal from '../../routes/dashboard/settings/labels/AddLabel';
export default {
components: {
AddLabelModal,
},
mixins: [adminMixin],
data() {
return {
showAddLabel: false,
};
},
props: {
menuItem: {
type: Object,
@ -108,12 +122,24 @@ export default {
if (!child.truncateLabel) return false;
return child.label;
},
newLinkClick() {
router.push({ name: 'settings_inbox_new', params: { page: 'new' } });
newLinkClick(item) {
if (item.newLinkRouteName) {
router.push({ name: item.newLinkRouteName, params: { page: 'new' } });
} else if (item.showModalForNewItem) {
if (item.modalName === 'AddLabel') {
this.showAddLabelPopup();
}
}
},
showItem(item) {
return this.isAdmin && item.newLink !== undefined;
},
showAddLabelPopup() {
this.showAddLabel = true;
},
hideAddLabelPopup() {
this.showAddLabel = false;
},
},
};
</script>