site-menu.component.ts
3.41 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
import { Component, AfterViewInit, Input, OnInit } from '@angular/core';
import {ApplicationService} from '../services/application.service';
declare var jQuery: any;
@Component({
selector: 'site-menu',
template: `
<div class="ui attached stackable menu">
<div class="ui container" *ngIf="application.appSettings != null">
<a class="item" *ngFor="let menuItem of application.getMenuItemsWithNoChildren(application.appSettings.menu.menuItems)" [routerLink]="menuItem.slug"><i class="{{menuItem.icon}} icon"></i>{{menuItem.name}}</a>
<div class="ui simple dropdown item" *ngFor="let menuItem of application.getMenuItemsWithChildren(application.appSettings.menu.menuItems)">
{{menuItem.name}}
<i class="dropdown icon"></i>
<div class="menu">
<a class="item" *ngFor="let childMenuItem of application.getMenuItemsWithNoChildren(menuItem.menuItems)" [routerLink]="childMenuItem.slug"><i class="{{childMenuItem.icon}} icon"></i> {{childMenuItem.name}}</a>
<div class="ui simple dropdown item" *ngFor="let childMenuItem of application.getMenuItemsWithChildren(menuItem.menuItems)">
<i class="{{childMenuItem.icon}} icon"></i>
{{childMenuItem.name}}
<div class="menu">
<a class="item" *ngFor="let nestedChildMenuItem of application.getMenuItemsWithNoChildren(childMenuItem.menuItems)" [routerLink]="nestedChildMenuItem.slug"><i class="{{nestedChildMenuItem.icon}} icon"></i> {{nestedChildMenuItem.name}}</a>
</div>
</div>
</div>
</div>
<div class="item">
<div class="ui search">
<div class="ui icon input">
<input class="prompt" placeholder="Customer Mobile or Email..." type="text">
<i class="search icon"></i>
</div>
<div class="results"></div>
</div>
</div>
<div class="right item" *ngIf="application.currentUser != null">
<i class="sign out icon"></i> <a (click)="application.logout()">Sign Out</a>
</div>
</div>
</div>
`
})
export class SiteMenuComponent implements AfterViewInit {
@Input('type')
type: string = 'fixed';
@Input('hidden')
hidden: boolean = true;
constructor(public application: ApplicationService) { }
hiddenClass(): string {
if (this.hidden)
return "hidden";
else
"";
}
ngAfterViewInit(): void {
setTimeout(() => this.attachSideBar(), 2000);
}
getMenuIconOrText(menuItem: any): string {
if (menuItem.icon == null)
return menuItem.name;
else
return "<i class='large " + menuItem.icon + " icon'></i>";
}
makeActive(index: number): string {
if (index == 0)
return "active";
else
return "";
}
attachSideBar(): void {
if (jQuery != null) {
jQuery('.ui.sidebar')
.sidebar('attach events', '.toc.item');
jQuery('.ui.dropdown')
.dropdown();
}
}
}