marketing

assets/script/pc_style.css

@@ -57,6 +57,10 @@ img {
   height: auto;
 }
 
+table {
+  width: 100%;
+}
+
 a {
   text-decoration: none;
 }
@@ -320,10 +324,10 @@ a {
   transition: 0.3s all;
   position: relative;
 }
-.admin-menu .item:hover {
+.admin-menu .item:hover, .admin-menu .item.current {
   background: #81b5e4;
 }
-.admin-menu .item:hover .icons {
+.admin-menu .item:hover .icons, .admin-menu .item.current .icons {
   filter: brightness(100);
 }
 .admin-menu .item:hover .sub-menu {
@@ -733,22 +737,6 @@ input[type=radio]:focus:before {
 .order-page .order-page-table td:nth-child(4), .order-page .order-page-table td:nth-child(10) {
   text-align: left;
 }
-.order-page .order-page-table .icons {
-  width: 30px;
-  height: 30px;
-  border: 1px solid #ececec;
-  background-color: #f9f9f9;
-  border-radius: 5px;
-}
-.order-page .order-page-table .icon-edit {
-  border: 1px solid #0041e8;
-  background-color: #f5f7ff;
-  background-position: -108px -82px;
-  margin-right: 6px;
-}
-.order-page .order-page-table .icon-delete {
-  background-position: -145px -82px;
-}
 
 .order-page-table {
   line-height: 20px;
@@ -787,6 +775,22 @@ input[type=radio]:focus:before {
   width: 100%;
   padding: 0 0 0 5px;
 }
+.order-page-table .icons {
+  width: 30px;
+  height: 30px;
+  border: 1px solid #ECECEC;
+  background-color: #F9F9F9;
+  border-radius: 5px;
+}
+.order-page-table .icon-edit {
+  border: 1px solid #0041E8;
+  background-color: #F5F7FF;
+  background-position: -108px -82px;
+  margin-right: 6px;
+}
+.order-page-table .icon-delete {
+  background-position: -145px -82px;
+}
 
 .is-close-btn {
   background: #ececec !important;

assets/script/pc_style.scss

@@ -48,6 +48,9 @@ img {
     max-width: 100%;
     height: auto;
 }
+table{
+    width: 100%;
+}
 a {
     text-decoration: none;
 }
@@ -301,11 +304,13 @@ a {
         align-items: center;
         transition: 0.3s all;
         position: relative;
-        &:hover {
+        &:hover, &.current{
             background: #81b5e4;
             .icons {
                 filter: brightness(100);
             }
+        }
+        &:hover {            
             .sub-menu {
                 left: calc(100% + 8px);
                 opacity: 1;
@@ -749,23 +754,7 @@ input[type="radio"] {
             &:nth-child(10) {
                 text-align: left;
             }
-        }
+        }        
-        .icons {
-            width: 30px;
-            height: 30px;
-            border: 1px solid #ececec;
-            background-color: #f9f9f9;
-            border-radius: 5px;
-        }
-        .icon-edit {
-            border: 1px solid #0041e8;
-            background-color: #f5f7ff;
-            background-position: -108px -82px;
-            margin-right: 6px;
-        }
-        .icon-delete {
-            background-position: -145px -82px;
-        }
     }
 }
 .order-page-table {
@@ -804,6 +793,22 @@ input[type="radio"] {
         width: 100%;
         padding: 0 0 0 5px;
     }
+    .icons {
+        width: 30px;
+        height: 30px;
+        border: 1px solid #ECECEC;
+        background-color: #F9F9F9;
+        border-radius: 5px;
+    }
+    .icon-edit {
+        border: 1px solid #0041E8;
+        background-color: #F5F7FF;
+        background-position: -108px -82px;
+        margin-right: 6px;
+    }
+    .icon-delete {
+        background-position: -145px -82px;
+    }
 }
 .is-close-btn {
     background: #ececec !important;

data/menu_item/marketing.php

@@ -6,7 +6,7 @@ return array(
     "url" => "",
     "menu" => array(
         array(
-            'enable' => false ,
+            'enable' => true ,
             'module' => 'marketing',
             'view' => 'promotion',
             'id' => 'marketing/promotion',
@@ -15,7 +15,7 @@ return array(
         ),
 
         array(
-            'enable' => false ,
+            'enable' => true ,
             'module' => 'marketing',
             'view' => 'coupon',
             'id' => 'marketing/coupon',

template/marketing/coupon-add.html

@@ -0,0 +1 @@
+template/marketing/coupon-add.html

template/marketing/coupon.html

@@ -0,0 +1,92 @@
+<div class="bg-white m-[16px_0_16px_16px] p-[20px_16px] rounded-[15px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] leading-[20px]">
+    <p class="leading-[30px] mb-[13px] font-[600] text-[24px]"> Coupon khuyến mại </p>
+
+    <div class="flex justify-between items-start m-[13px_0]">
+        <p class="max-w-[1024px]">Danh sách phiếu giảm giá/ quà tặng dùng cho khách hàng khi đặt mua hàng từ website. Trước khi gửi đơn hàng, nếu khách hàng có mã số phiếu còn hiệu lực thì sẽ nhập vào đơn hàng để nhận được ưu đãi ghi trên phiếu</p>
+
+        <a href="/admin/marketing/coupon-add" class="flex items-center whitespace-nowrap border border-[#0041E8] rounded-[4px] bg-[#F5F7FF] text-[#0041E8] font-[500] leading-[35px] p-[0_12px]" >
+            <span class="border-[1px] border-[#0041E8] h-[13px] w-[13px]  leading-[10px] text-center rounded-[50%] mr-1">+</span>
+            <span>Thêm phiếu mới</span>
+        </a>
+    </div>
+
+    <div class="order-page-table">
+        <table>
+            <thead>
+                <tr>
+                    <td width="50"> STT </td>
+                    <td> Mã số </td>
+                    <td> Khuyến mại </td>
+                    <td> Phân loại </td>
+                    <td> Thời gian </td>
+                    <td> Trạng thái </td>
+                    <td> Thông tin khác </td>
+                    <td> Lựa chọn </td>
+                </tr>
+            </thead>
+
+            <tbody>
+                <tr>
+                    <td> 1 </td>
+
+                    <td class="whitespace-nowrap"> CP231020233 </td>
+
+                    <td>
+                        <p class="font-bold"> Test phiếu giảm giá </p>
+                        <div> Test phiếu giảm giá </div>
+                    </td>
+
+                    <td>
+                        <p class="font-bold"> Tặng sản phẩm </p>
+                        <p> Balo thời trang </p>
+                    </td>
+
+                    <td>
+
+                        <div style="display: block;">
+                            <p class="inline-block m-[0_6px_6px_0]"> - Bắt đầu: 23-10-2023, 12:00 am </p>
+
+                            <span class="inline-block m-[0_0_6px_0] bg-[#F7F5FF] font-[500] p-[0_7px] leading-[20px] rounded-[50px] text-[12px] text-[#0041E8] shadow-[0_0_0_1px_#0041E8]"> 
+                                Đã chạy 
+                            </span>
+                        </div>
+
+                        <div>
+                            <p class="inline-block m-[0_6px_6px_0]"> - Kết thúc: 28-10-2023, 12:00 am </p>
+
+                            <span class="inline-block m-[0_0_6px_0] bg-[#F9F2F2] font-[500] p-[0_7px] leading-[20px] rounded-[50px] text-[12px] text-[#E00000] shadow-[0_0_0_1px_#E00000]">
+                                Đã dừng 
+                            </span>
+                        </div>
+
+                        <p>- Giá trị đơn hàng tối thiểu: <b class="text-[#E00000] font-bold">2.000.000 đ</b> </p>
+                    </td>
+                    
+                    <td>
+                        <p> 0 đã dùng </p>
+                        <p> Tổng số: 20 </p>
+                    </td>
+                    
+                    <td>
+                        <p> - Tạo bởi: Đức (05-09-2022, 9:48 am) </p>
+                        <p> - Cập nhật cuối: hongvt@hurasoft.com<br>(03-10-2023, 8:31 am) </p>                        
+                    </td>
+
+                    <td>
+                        <div class="items-center" style="display: flex;">
+                            <a href="/admin/marketing/detail/id=8" class="icons icon-edit" title="Sửa lại"></a>
+
+                            <!-- <a href="javascript:setStatus('8','off')" title="Hạ xuống" class="far fa-eye-slash bg-[#F9F9F9] leading-[30px] rounded-[5px] text-[#9E9E9E_!important] text-center w-[30px] border border-[#ECECEC] mr-[6px]"></a> -->
+                            
+                            <a href="javascript:setStatus('8','on')" title="Cho Hiển thị" class="far fa-eye bg-[#F5F7FF] leading-[30px] rounded-[5px] text-[#0041E8_!important] text-center w-[30px] border border-[#0041E8] mr-[6px]"> </a>
+
+                            <a href="javascript:delete_coupon('8')" class="icons icon-delete" title="Xóa"></a>
+                        </div>
+                    </td>
+                </tr>
+
+                <tr> <td> 2 </td><td class="whitespace-nowrap"> CP231020233 </td><td> <p class="font-bold"> Test phiếu giảm giá </p><div> Test phiếu giảm giá </div></td><td> <p class="font-bold"> Tặng sản phẩm </p><p> Balo thời trang </p></td><td> <div style="display: block;"> <p class="inline-block m-[0_6px_6px_0]"> - Bắt đầu: 23-10-2023, 12:00 am </p><span class="inline-block m-[0_0_6px_0] bg-[#F7F5FF] font-[500] p-[0_7px] leading-[20px] rounded-[50px] text-[12px] text-[#0041E8] shadow-[0_0_0_1px_#0041E8]"> Đã chạy </span> </div><div> <p class="inline-block m-[0_6px_6px_0]"> - Kết thúc: 28-10-2023, 12:00 am </p><span class="inline-block m-[0_0_6px_0] bg-[#F9F2F2] font-[500] p-[0_7px] leading-[20px] rounded-[50px] text-[12px] text-[#E00000] shadow-[0_0_0_1px_#E00000]"> Đã dừng </span> </div><p>- Giá trị đơn hàng tối thiểu: <b class="text-[#E00000] font-bold">2.000.000 đ</b> </p></td><td> <p> 0 đã dùng </p><p> Tổng số: 20 </p></td><td> <p> - Tạo bởi: Đức (05-09-2022, 9:48 am) </p><p> - Cập nhật cuối: hongvt@hurasoft.com<br>(03-10-2023, 8:31 am) </p></td><td> <div class="items-center" style="display: flex;"> <a href="/admin/marketing/detail/id=8" class="icons icon-edit" title="Sửa lại"></a> <a href="javascript:setStatus('8','off')" title="Hạ xuống" class="far fa-eye-slash bg-[#F9F9F9] leading-[30px] rounded-[5px] text-[#9E9E9E_!important] text-center w-[30px] border border-[#ECECEC] mr-[6px]"></a> <a href="javascript:delete_coupon('8')" class="icons icon-delete" title="Xóa"></a> </div></td></tr>
+            </tbody>
+        </table>
+    </div>
+</div>

template/marketing/detail.html

@@ -0,0 +1 @@
+template/marketing/detail.html

template/marketing/detail8.html

@@ -0,0 +1 @@
+template/marketing/detail8.html

template/marketing/home.html

@@ -0,0 +1 @@
+template/marketing/home.html

template/marketing/promotion.html

@@ -0,0 +1 @@
+template/marketing/promotion.html

template/order/detail.html

@@ -1,5 +1,5 @@
 <div class="global-breadcrumb-container">
-    <a href="?module=order&view=home">Danh sách đơn hàng</a>
+    <a href="/admin/order/home">Danh sách đơn hàng</a>
     <a href="">Chi tiết đơn hàng</a>
 </div>
 

template/order/home.html

@@ -123,7 +123,7 @@
                 <tr>
                     <td> 1 </td>
                     <td>
-                        <a href="?module=order&view=detail-new&o=369&b=1584&popup=1"> 000-369 </a>
+                        <a href="/admin/order/detail?id=369"> 000-369 </a>
                     </td>
                     <td> 16-11-2023, 9:59 am </td>
                     <td>
@@ -138,7 +138,7 @@
                         <a href=""> Nguyen Duc Quan </a>
                     </td>
                     <td>
-                        <a href="?module=order&view=detail-new&o=369&b=1584&popup=1" class="icons icon-edit" title="Chi tiết"></a>
+                        <a href="/admin/order/detail?id=369" class="icons icon-edit" title="Chi tiết"></a>
                         <a href="" class="icons icon-delete" title="Xóa"></a>
                     </td>
                 </tr>
@@ -146,7 +146,7 @@
                 <tr>
                     <td> 2 </td>
                     <td>
-                        <a href="?module=order&view=detail-new&o=369&b=1584&popup=1"> 000-369 </a>
+                        <a href="/admin/order/detail?id=369"> 000-369 </a>
                     </td>
                     <td> 16-11-2023, 9:59 am </td>
                     <td>
@@ -161,7 +161,7 @@
                         <a href=""> test hura </a>
                     </td>
                     <td>
-                        <a href="?module=order&view=detail-new&o=369&b=1584&popup=1" class="icons icon-edit" title="Chi tiết"></a>
+                        <a href="/admin/order/detail?id=369" class="icons icon-edit" title="Chi tiết"></a>
                         <a href="" class="icons icon-delete" title="Xóa"></a>
                     </td>
                 </tr>

template/order/wait-order.html

@@ -0,0 +1 @@
+template/order/wait-order.html

template/theme.html

@@ -25,264 +25,266 @@
 
 <body>
 
+{{ global | show_var }}
 
-    <div class="admin-global-container">
+{{ page | show_var }}
 
-        <!-- Menu full  -->
+<div class="admin-global-container">
-        <div class="admin-menu-container box-menu sticky top-0 bottom-0 h-[100vh] hidden" id="js-menu-big">
+
-            <a href="javascript:void(0)" class="icon-close" title="Thu gọn menu" id="js-hide-menu">
+    <!-- Menu full  -->
-                <i class="fa-solid fa-outdent"></i>
+    <div class="admin-menu-container box-menu sticky top-0 bottom-0 h-[100vh] hidden" id="js-menu-big">
+        <a href="javascript:void(0)" class="icon-close" title="Thu gọn menu" id="js-hide-menu">
+            <i class="fa-solid fa-outdent"></i>
+        </a>
+
+        <a href="" class="menu-logo">
+            <img src="{{ 'logo.png' | asset_url }}" />
+        </a>
+
+        <div class="menu-list">
+            <a href="/" class="item">
+                <i class="icons icon-home"></i>
+                <span class="title"> Dashboard </span>
             </a>
 
-            <a href="" class="menu-logo">
+            {% for _category in global.main_menu %}
-                <img src="{{ 'logo.png' | asset_url }}" />
+            {% assign _type = _category[0] %}
-            </a>
+            {% assign _menuArray = _category[1].menu %}
+            {% if _category[1].enable == 1 %}
+            <details {% if _type==global.module %} open {% endif %}>
+                <summary class="item">
+                    <div class="flex items-center">
 
-            <div class="menu-list">
+                        {% if _type == 'order' %} <i class="icons icon-order"></i>
-                <a href="/" class="item">
+                        {% elsif _type == 'product' %} <i class="icons icon-product"></i>
-                    <i class="icons icon-home"></i>
+                        {% elsif _type == 'customer' %}<i class="icons icon-customer"></i>
-                    <span class="title"> Dashboard </span>
+                        {% elsif _type == 'marketing' %}<i class="icons icon-marketing"></i>
-                </a>
+                        {% elsif _type == 'investor_relation' %} <i class="icons icon-investor_relation"></i>
+                        {% elsif _type == 'article' %} <i class="icons icon-content"></i>
+                        {% elsif _type == 'job' %} <i class="icons icon-job"></i>
+                        {% elsif _type == 'pcbuilder' %} <i class="icons icon-pcbuilder"></i>
+                        {% elsif _type == 'payinstall' %} <i class="icons icon-payinstall"></i>
+                        {% elsif _type == 'distributor' %} <i class="icons icon-distributor"></i>
+                        {% elsif _type == 'report' %}<i class="icons icon-stats"></i>
+                        {% elsif _type == 'system' %}<i class="icons icon-system"></i>
+                        {% endif %}
 
-                {% for _category in global.main_menu %}
+                        <span class="title"> {{ _category[1].name }} </span>
-                {% assign _type = _category[0] %}
-                {% assign _menuArray = _category[1].menu %}
-                {% if _category[1].enable == 1 %}
-                <details {% if _type==global.module %} open {% endif %}>
-                    <summary class="item">
-                        <div class="flex items-center">
-
-                            {% if _type == 'order' %} <i class="icons icon-order"></i>
-                            {% elsif _type == 'product' %} <i class="icons icon-product"></i>
-                            {% elsif _type == 'customer' %}<i class="icons icon-customer"></i>
-                            {% elsif _type == 'marketing' %}<i class="icons icon-marketing"></i>
-                            {% elsif _type == 'investor_relation' %} <i class="icons icon-investor_relation"></i>
-                            {% elsif _type == 'article' %} <i class="icons icon-content"></i>
-                            {% elsif _type == 'job' %} <i class="icons icon-job"></i>
-                            {% elsif _type == 'pcbuilder' %} <i class="icons icon-pcbuilder"></i>
-                            {% elsif _type == 'payinstall' %} <i class="icons icon-payinstall"></i>
-                            {% elsif _type == 'distributor' %} <i class="icons icon-distributor"></i>
-                            {% elsif _type == 'report' %}<i class="icons icon-stats"></i>
-                            {% elsif _type == 'system' %}<i class="icons icon-system"></i>
-                            {% endif %}
-
-                            <span class="title"> {{ _category[1].name }} </span>
-                        </div>
-
-                        <i class="fa-solid fa-angle-right"></i>
-                    </summary>
-
-                    <div class="sub-menu">
-                        {% for _item in _menuArray %}
-                        <a href="{{_item.url }}" {% if _item.view==global.view and _type==global.module %}
-                            class="current" {% endif %}> {{ _item.name }} </a>
-                        {% endfor %}
                     </div>
-                </details>
-                {% endif %}
-                {% endfor %}
-            </div>
 
-            <div class="menu-list">
+                    <i class="fa-solid fa-angle-right"></i>
-                <p style="color: #81B5E4;margin: 0 0 10px;font-weight: 700;padding: 0 16px;">TÀI KHOẢN</p>
+                </summary>
 
-                <a href="" class="item">
+                <div class="sub-menu">
-                    <i class="icons icon-settings"></i>
+                    {% for _item in _menuArray %}
-                    <span class="title"> Cài đặt </span>
+                    <a href="{{_item.url }}" {% if _item.view==global.view and _type==global.module %}
-                </a>
+                        class="current" {% endif %}> {{ _item.name }} </a>
+                    {% endfor %}
+                </div>
+            </details>
+            {% endif %}
+            {% endfor %}
+        </div>
 
-                <a href="" class="item">
+        <div class="menu-list">
-                    <i class="icons icon-support"></i>
+            <p style="color: #81B5E4;margin: 0 0 10px;font-weight: 700;padding: 0 16px;">TÀI KHOẢN</p>
-                    <span class="title"> Hỗ trợ </span>
-                </a>
-
-                <a href="" class="item">
-                    <i class="icons icon-account"></i>
-                    <span class="title"> Quản lý tài khoản </span>
-                </a>
-            </div>
 
             <a href="" class="item">
-                <i class="icons icon-logout"></i>
+                <i class="icons icon-settings"></i>
-                <span class="title"> Thoát quản trị </span>
+                <span class="title"> Cài đặt </span>
+            </a>
+
+            <a href="" class="item">
+                <i class="icons icon-support"></i>
+                <span class="title"> Hỗ trợ </span>
+            </a>
+
+            <a href="" class="item">
+                <i class="icons icon-account"></i>
+                <span class="title"> Quản lý tài khoản </span>
             </a>
         </div>
 
-        <!-- Menu collapse -->
+        <a href="" class="item">
-        <div class="admin-menu box-menu sticky top-0 bg-[#004E99] flex flex-col justify-between pb-[20px] min-h-[100vh]"
+            <i class="icons icon-logout"></i>
-            id="js-menu-small">
+            <span class="title"> Thoát quản trị </span>
-            <div>
+        </a>
-                <div
+    </div>
-                    class="logo item items-center justify-center border-[rgba(255,255,255,0.15)] border-b p-[20px_0_38px_!important]">
-                    <a href="/" class="">
-                        <img src="../assets/images/logo_small.png" alt="">
-                    </a>
-                    <a href="javascript:void(0)" title="Mở menu" class="icon-close" id="js-show-menu">
-                        <i class="fa-solid fa-indent"></i>
-                    </a>
-                </div>
 
-                <div class="item">
+    <!-- Menu collapse -->
-                    <a href="/" class="icons icon-home"> </a>
+    <div class="admin-menu box-menu sticky top-0 bg-[#004E99] flex flex-col justify-between pb-[20px] min-h-[100vh]" id="js-menu-small">
-
+        <div>
-                    <div class="sub-menu">
+            <div class="logo item items-center justify-center border-[rgba(255,255,255,0.15)] border-b p-[20px_0_38px_!important]">
-                        <p class="font-bold"> Dashboard </p>
+                <a href="/" class="">
-                    </div>
+                    <img src="../assets/images/logo_small.png" alt="">
-                </div>
+                </a>
-
+                
-                {% for _category in global.main_menu %}
+                <a href="javascript:void(0)" title="Mở menu" class="icon-close" id="js-show-menu">
-                {% assign _type = _category[0] %}
+                    <i class="fa-solid fa-indent"></i>
-                {% assign _menuArray = _category[1].menu %}
+                </a>
-
-                {% if _category[1].enable == 1 %}
-                <div class="item {% if _type == 'system' %} border-[rgba(255,255,255,0.15)] border-b{% endif %}">
-                    {% if _type == 'order' %} <a href="" class="icons icon-sell"> </a>
-                    {% elsif _type == 'product' %} <a href="" class="icons icon-product"> </a>
-                    {% elsif _type == 'customer' %}<a href="" class="icons icon-user"> </a>
-                    {% elsif _type == 'marketing' %} <a href="" class="icons icon-marketing"> </a>
-                    {% elsif _type == 'investor_relation' %} <a href="" class="icons icon-investor_relation"> </a>
-                    {% elsif _type == 'article' %} <a href="" class="icons icon-content"> </a>
-                    {% elsif _type == 'job' %} <a href="" class="icons icon-job"> </a>
-                    {% elsif _type == 'pcbuilder' %} <a href="" class="icons icon-pcbuilder"> </a>
-                    {% elsif _type == 'payinstall' %} <a href="" class="icons icon-payinstall"> </a>
-                    {% elsif _type == 'distributor' %} <a href="" class="icons icon-distributor"> </a>
-                    {% elsif _type == 'report' %}<i class="icons icon-stats"></i>
-                    {% elsif _type == 'system' %}<i class="icons icon-system"></i>
-                    {% endif %}
-
-                    <div class="sub-menu">
-                        <p class="font-bold"> {{ _category[1].name }} </p>
-
-                        <div class="menu-list">
-                            {% for _item in _menuArray %}
-                            <a href="{{ _item.url }}" {% if _item.view==global.view and _type==global.module %}
-                                class="current" {% endif %}> {{ _item.name }} </a>
-                            {% endfor %}
-                        </div>
-                    </div>
-                </div>
-                {% endif %}
-                {% endfor %}
-            </div>
-
-            <div>
-                <div class="item bottom">
-                    <a href="" class="icons icon-settings"> </a>
-
-                    <div class="sub-menu">
-                        <p class="font-bold"> Cài đặt </p>
-
-                        <div class="menu-list">
-                            {% for _item in global.main_menu.system.menu %}
-                            <a href="{{_item.url }}"> {{_item.name }} </a>
-                            {% endfor %}
-                        </div>
-                    </div>
-                </div>
-
-                <div class="item bottom">
-                    <a href="" class="icons icon-support"> </a>
-
-                    <div class="sub-menu">
-                        <p class="font-bold"> Hỗ trợ </p>
-
-                        <div class="menu-list">
-                            <a href=""> Menu title </a>
-                            <a href=""> Menu title </a>
-                            <a href=""> Menu title </a>
-                            <a href=""> Menu title </a>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="item bottom">
-                    <a href="" class="icons icon-account"> </a>
-
-                    <div class="sub-menu">
-                        <p class="font-bold"> Quản lý tài khoản </p>
-
-                        <div class="menu-list">
-                            <a href=""> Menu title </a>
-                            <a href=""> Menu title </a>
-                            <a href=""> Menu title </a>
-                            <a href=""> Menu title </a>
-                        </div>
-                    </div>
-                </div>
             </div>
 
             <div class="item">
-                <a href="" class="icons icon-logout"> </a>
+                <a href="/" class="icons icon-home"> </a>
 
                 <div class="sub-menu">
-                    <p class="font-bold"> Thoát quản trị </p>
+                    <p class="font-bold"> Dashboard </p>
+                </div>
+            </div>
+
+            {% for _category in global.main_menu %}
+            {% assign _type = _category[0] %}
+            {% assign _menuArray = _category[1].menu %}
+
+            {% if _category[1].enable == 1 %}
+            <div class="item {% if _type == 'system' %} border-[rgba(255,255,255,0.15)] border-b{% endif %}">
+                {% if _type == 'order' %} <i class="icons icon-sell"> </i>
+                {% elsif _type == 'product' %} <i class="icons icon-product"> </i>
+                {% elsif _type == 'customer' %}<a href="" class="icons icon-user"> </a>
+                {% elsif _type == 'marketing' %} <i class="icons icon-marketing"> </i>
+                {% elsif _type == 'investor_relation' %} <i class="icons icon-investor_relation"> </i>
+                {% elsif _type == 'article' %} <i class="icons icon-content"> </i>
+                {% elsif _type == 'job' %} <i class="icons icon-job"> </i>
+                {% elsif _type == 'pcbuilder' %} <i class="icons icon-pcbuilder"> </i>
+                {% elsif _type == 'payinstall' %} <i class="icons icon-payinstall"> </i>
+                {% elsif _type == 'distributor' %} <i class="icons icon-distributor"> </i>
+                {% elsif _type == 'report' %}<i class="icons icon-stats"></i>
+                {% elsif _type == 'system' %}<i class="icons icon-system"></i>
+                {% endif %}
+
+                <div class="sub-menu">
+                    <p class="font-bold"> {{ _category[1].name }} </p>
+
+                    <div class="menu-list">
+                        {% for _item in _menuArray %}
+                        <a href="{{ _item.url }}" {% if _item.view == global.view and _type == global.module %} class="current" {% endif %}>
+                            {{ _item.name }}
+                        </a>
+                        {% endfor %}
+                    </div>
+                </div>
+            </div>
+            {% endif %}
+            {% endfor %}
+        </div>
+
+        <div>
+            <div class="item bottom">
+                <a href="" class="icons icon-settings"> </a>
+
+                <div class="sub-menu">
+                    <p class="font-bold"> Cài đặt </p>
+
+                    <div class="menu-list">
+                        {% for _item in global.main_menu.system.menu %}
+                        <a href="{{_item.url }}"> {{_item.name }} </a>
+                        {% endfor %}
+                    </div>
+                </div>
+            </div>
+
+            <div class="item bottom">
+                <a href="" class="icons icon-support"> </a>
+
+                <div class="sub-menu">
+                    <p class="font-bold"> Hỗ trợ </p>
+
+                    <div class="menu-list">
+                        <a href=""> Menu title </a>
+                        <a href=""> Menu title </a>
+                        <a href=""> Menu title </a>
+                        <a href=""> Menu title </a>
+                    </div>
+                </div>
+            </div>
+
+            <div class="item bottom">
+                <a href="" class="icons icon-account"> </a>
+
+                <div class="sub-menu">
+                    <p class="font-bold"> Quản lý tài khoản </p>
+
+                    <div class="menu-list">
+                        <a href=""> Menu title </a>
+                        <a href=""> Menu title </a>
+                        <a href=""> Menu title </a>
+                        <a href=""> Menu title </a>
+                    </div>
                 </div>
             </div>
         </div>
 
-        <div class="admin-content-container" id="js-admin-content-container">
+        <div class="item">
-            <!-- Header -->
+            <a href="" class="icons icon-logout"> </a>
-            <div class="admin-header-container flex items-center justify-between bg-white px-4 py-3">
-                <form class="max-w-[420px] relative w-[100%] menu-hide" id="js-form-search">
-                    <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
-                        <i class="icons icon-search"></i>
-                    </div>
 
-                    <input type="search" class="block border h-[36px] ps-10 rounded w-full" placeholder="Tìm kiếm">
+            <div class="sub-menu">
-                </form>
+                <p class="font-bold"> Thoát quản trị </p>
-
-                <div class="admin-header-right flex items-center justify-end">
-                    <a href="" title="Truy cập trung tâm hỗ trợ của Hurasoft">
-                        <i class="icons header-support"></i>
-                    </a>
-
-                    <div
-                        class="group relative cursor-pointer ml-[20px] mr-[35px] group [&_summary::-webkit-details-marker]:hidden">
-                        <div class="relative flex">
-                            <i class="icons icon-notification"></i>
-
-                            <span
-                                class="absolute bg-[#E00000] font-[500] h-[17px] leading-[17px] note right-[-5px] rounded-lg text-[#fff] text-[13px] text-center top-[-3px] w-[17px]">
-                                0
-                            </span>
-                        </div>
-
-                        <div
-                            class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-[-10px]">
-                            <a href=""> Menu title </a>
-                            <a href=""> Menu title </a>
-                            <a href=""> Menu title </a>
-                            <a href=""> Menu title </a>
-                        </div>
-                    </div>
-
-                    <div class="group relative cursor-pointer group [&_summary::-webkit-details-marker]:hidden">
-                        <div class="flex items-center">
-                            <p class="m-0 mr-[10px]"> ducdt@hurasoft.com </p>
-
-                            <img src="https://via.placeholder.com/72x72"
-                                class="block rounded-[50%] w-[36px] h-[36px] mr-[8px]" />
-
-                            <i class="fa-solid fa-sort-down text-[#C9C9C9] mb-[3px]"></i>
-                        </div>
-
-                        <div
-                            class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-0">
-                            <a href="">Đổi mật khẩu</a>
-                            <a href="">Thoát quản trị</a>
-                        </div>
-                    </div>
-                </div>
             </div>
-
-            <!-- Content -->
-            {{ page_content }}
         </div>
     </div>
 
+    <div class="admin-content-container" id="js-admin-content-container">
+        <!-- Header -->
+        <div class="admin-header-container flex items-center justify-between bg-white px-4 py-3">
+            <form class="max-w-[420px] relative w-[100%] menu-hide" id="js-form-search">
+                <div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
+                    <i class="icons icon-search"></i>
+                </div>
 
-    {% include javascript/index %}
+                <input type="search" class="block border h-[36px] ps-10 rounded w-full" placeholder="Tìm kiếm">
+            </form>
+
+            <div class="admin-header-right flex items-center justify-end">
+                <a href="" title="Truy cập trung tâm hỗ trợ của Hurasoft">
+                    <i class="icons header-support"></i>
+                </a>
+
+                <div
+                    class="group relative cursor-pointer ml-[20px] mr-[35px] group [&_summary::-webkit-details-marker]:hidden">
+                    <div class="relative flex">
+                        <i class="icons icon-notification"></i>
+
+                        <span
+                            class="absolute bg-[#E00000] font-[500] h-[17px] leading-[17px] note right-[-5px] rounded-lg text-[#fff] text-[13px] text-center top-[-3px] w-[17px]">
+                            0
+                        </span>
+                    </div>
+
+                    <div
+                        class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-[-10px]">
+                        <a href=""> Menu title </a>
+                        <a href=""> Menu title </a>
+                        <a href=""> Menu title </a>
+                        <a href=""> Menu title </a>
+                    </div>
+                </div>
+
+                <div class="group relative cursor-pointer group [&_summary::-webkit-details-marker]:hidden">
+                    <div class="flex items-center">
+                        <p class="m-0 mr-[10px]"> ducdt@hurasoft.com </p>
+
+                        <img src="https://via.placeholder.com/72x72"
+                            class="block rounded-[50%] w-[36px] h-[36px] mr-[8px]" />
+
+                        <i class="fa-solid fa-sort-down text-[#C9C9C9] mb-[3px]"></i>
+                    </div>
+
+                    <div
+                        class="group-hover:opacity-[1] group-hover:z-[1] opacity-0 absolute bg-white leading-[30px] note-list shadow whitespace-nowrap z-[-1] rounded-[4px] right-0">
+                        <a href="">Đổi mật khẩu</a>
+                        <a href="">Thoát quản trị</a>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Content -->
+        {{ page_content }}
+    </div>
+</div>
+
+
+{% include javascript/index %}
 
 </body>
-
 </html>