34 lines
1.0 KiB
TypeScript
34 lines
1.0 KiB
TypeScript
import { CommonModule } from "@angular/common";
|
|
import { Component, ElementRef, EventEmitter, Output, ViewChild } from "@angular/core";
|
|
|
|
@Component({
|
|
selector: "app-header",
|
|
templateUrl: "./header.component.html",
|
|
styleUrls: ["./header.component.less"],
|
|
standalone: true,
|
|
imports: [CommonModule],
|
|
})
|
|
export class HeaderComponent {
|
|
@Output() searchEvent: EventEmitter<string> = new EventEmitter();
|
|
@ViewChild("searchInput") searchInput: ElementRef<HTMLInputElement> | null = null;
|
|
menuOpened = false;
|
|
changeMenu() {
|
|
this.menuOpened = !this.menuOpened;
|
|
}
|
|
|
|
get menuBtnClass(): string {
|
|
return `lni ${this.menuOpened ? "lni-close" : "lni-menu"} text-white`;
|
|
}
|
|
|
|
get searchBarClass(): string {
|
|
return `search-bar bg-slate-300 md:w-[50%] w-full md:m-0 ms-2 me-2 max-h-6 md:flex justify-start flex-row items-center rounded-md ${this.menuOpened ? "flex" : "hidden"}`;
|
|
}
|
|
|
|
search() {
|
|
if (this.searchInput) {
|
|
const text = this.searchInput.nativeElement.value;
|
|
this.searchEvent.emit(text);
|
|
}
|
|
}
|
|
}
|