admin menu

TIAMSharedUI/Shared/AdminLayout.razor

@@ -29,9 +29,10 @@
 
 <div class="page">
     <TiamErrorBoundaryComponent LoggerCategory="AdminLayout" OnError="HandleError">
-    <div class="my-sidebar">
         <AdminNavMenu />
-    </div>
+    @* <div class="my-sidebar">
+        <AdminNavMenu />
+    </div> *@
 
     <main>
         <article class="content">

TIAMSharedUI/Shared/Users/AdminNavMenu.razor

@@ -2,11 +2,39 @@
 @using AyCode.Interfaces.StorageHandlers;
 @inject ISecureStorageHandler SecureStorageHandler
 
-<div class="top-row ps-3 navbar navbar-light">
+
-    <div class="container-fluid">
+    <div class="w-100" style="height:40px; position:fixed;">
-        <button title="Back button" class="my-back-button" style="display:none" @onclick="NavigateBack">
+        <DxMenu Title="Tour I Am" ItemsPosition="ItemPosition.End" CollapseItemsToHamburgerMenu="true"
-            <img src="_content/TIAMSharedUI/images/navbar-toggler.png" width="40" />
+                Orientation="Orientation"
-        </button>
+                DisplayMode="DisplayMode">
+            <Items>
+                <DxMenuItem NavigateUrl="/" Text="Home" IconCssClass="menu-icon-home menu-icon" />
+                                   
+                <DxMenuItem Text="SysAdmin" IconCssClass="menu-icon-products menu-icon">
+                    <Items>
+                        <DxMenuItem NavigateUrl="user/sysadmin" Text="Dashboard" />
+                        <DxMenuItem NavigateUrl="user/transfers" Text="Transfers" />
+                        <DxMenuItem NavigateUrl="user/companies" Text="Companies" />
+                        <DxMenuItem NavigateUrl="user/users" Text="Users" />
+                        <DxMenuItem NavigateUrl="user/destinations" Text="Destinations" />
+                    </Items>
+                </DxMenuItem>
+                <DxMenuItem Text="HotelAdmin" IconCssClass="menu-icon-support menu-icon">
+                    <Items>
+                        <DxMenuItem NavigateUrl="user/hoteladmin" Text="Dashboard" />
+                        <DxMenuItem NavigateUrl="user/createAndManageTransfer" Text="Transfers" />
+                        <DxMenuItem NavigateUrl="user/serviceprovider/5453-a87f77787d-khj899" Text="Manage hotel" />                     
+                    </Items>
+                </DxMenuItem>
+            </Items>
+        </DxMenu>
+    </div>
+
+
+
+
+@* <div class="top-row ps-3 navbar navbar-light">
+    <div class="container-fluid">       
         <a class="navbar-brand my-navbar-brand" href=""></a>
         <button title="Navigation menu" class="navbar-toggler my-navbar-toggler" @onclick="ToggleNavMenu">
             <img src="_content/TIAMSharedUI/images/navbar-toggler.png" width="40" />
@@ -138,7 +166,7 @@
             </NavLink>
         </div>
     </nav>
-</div>
+</div> *@
 
 @code {
     private bool collapseNavMenu = true;
@@ -146,6 +174,9 @@
     private bool expandHotelAdminNav = false;
     private string? NavMenuCssClass => collapseNavMenu ? "collapse" : null;
 
+    MenuDisplayMode DisplayMode { get; set; } = MenuDisplayMode.Auto;
+    Orientation Orientation { get; set; } = Orientation.Horizontal;
+
     private void ToggleNavMenu()
     {
         collapseNavMenu = !collapseNavMenu;

TIAMSharedUI/wwwroot/css/TourIAm.css

@@ -168,6 +168,29 @@ select {
 
 /*my DX blazor overrides*/
 
+.menu-icon {
+    width: 1rem;
+    height: 1rem;
+    min-width: 1rem;
+    min-height: 1rem;
+    background-size: contain;
+    mask-repeat: no-repeat;
+    -webkit-mask-repeat: no-repeat;
+    background-position: center center;
+    background-color: currentColor;
+    opacity: 0.7;
+}
+
+.menu-icon-home {
+    mask-image: url("_content/TIAMSharedUI/images/icons/home.svg");
+    -webkit-mask-image: url("_content/TIAMSharedUI/images/icons/home.svg");
+}
+
+.menu-icon-support {
+    mask-image: url("_content/TIAMSharedUI/images/icons/support.svg");
+    -webkit-mask-image: url("_content/TIAMSharedUI/images/icons/support.svg");
+}
+
 .dxbl-text-edit.dxbl-disabled {
     --dxbl-text-edit-disabled-root-bg: transparent;
     background-color: transparent !important;