update menu

This commit is contained in:
2024-01-24 11:26:10 +07:00
parent 0c85c7a6f1
commit 16d4c7cc31
3 changed files with 87 additions and 46 deletions

View File

@@ -373,18 +373,31 @@
$(id).show(); $(id).show();
}) })
$('#js-show-menu').click(function () { // $('#js-show-menu').click(function () {
$('#menu-big').removeClass('hidden'); // $('#menu-big').removeClass('hidden');
$('#menu-small').addClass('hidden'); // $('#menu-small').addClass('hidden');
$('#js-form-search').removeClass('menu-hide') // $('#js-form-search').removeClass('menu-hide')
}) // localStorage.setItem('menu_big', 'hidden');
// localStorage.removeItem("menu_small");
// })
$('#js-hide-menu').click(function () { // $('#js-hide-menu').click(function () {
$('#menu-big').addClass('hidden'); // $('#menu-big').addClass('hidden');
$('#menu-small').removeClass('hidden'); // $('#menu-small').removeClass('hidden');
$('#js-form-search').addClass('menu-hide') // $('#js-form-search').addClass('menu-hide')
}) // localStorage.setItem('menu_small', 'hidden');
// localStorage.removeItem("menu_big");
// })
// if (localStorage.getItem('menu_big') == 'hidden') {
// $('#menu-big').removeClass('hidden');
// $('#menu-small').addClass('hidden');
// $('#js-form-search').removeClass('menu-hide')
// } else {
// $('#menu-big').addClass('hidden');
// $('#menu-small').removeClass('hidden');
// $('#js-form-search').addClass('menu-hide')
// }
}) })
@@ -709,4 +722,34 @@
} }
} }
// Hàm để cập nhật trạng thái hiển thị menu và localStorage
function capNhatTrangThaiMenu(hideMenuBig) {
$('#menu-big').toggleClass('hidden', hideMenuBig);
$('#menu-small').toggleClass('hidden', !hideMenuBig);
$('#js-form-search').toggleClass('menu-hide', hideMenuBig);
localStorage.setItem(hideMenuBig ? 'menu_big' : 'menu_small', 'hidden');
localStorage.removeItem(hideMenuBig ? 'menu_small' : 'menu_big');
}
$(document).ready(function () {
// Sự kiện click để hiển thị menu
$('#js-show-menu').click(function () {
capNhatTrangThaiMenu(false);
});
// Sự kiện click để ẩn menu
$('#js-hide-menu').click(function () {
capNhatTrangThaiMenu(true);
});
// Kiểm tra localStorage và thiết lập trạng thái ban đầu của menu
const hideMenuBig = localStorage.getItem('menu_big') === 'hidden';
capNhatTrangThaiMenu(hideMenuBig);
})
</script> </script>

View File

@@ -1,5 +1,4 @@
<div class="w-[100%] mb-[50px]">
<div class="w-[100%]">
<div class="text-sm breadcrumbs ml-[10px]"> <div class="text-sm breadcrumbs ml-[10px]">
<ul> <ul>
@@ -9,7 +8,7 @@
</div> </div>
<div class="w-[1141px] m-auto"> <div class="w-[1141px] m-auto">
<div <div
class="title py-[15px] bg-white rounded-[10px] text-center mt-[40px] mb-[15px] font-bold text-[18px] shadow-[0_1px_1px_0_rgba(0,0,0,0.1)]"> class="title py-[15px] bg-white rounded-[10px] text-center mt-[40px] mb-[15px] font-bold text-[18px] shadow-[0_1px_1px_0_rgba(0,0,0,0.1)]">
Cập nhật: {{ page.product_info.title }} (ID: {{ page.product_info.id }})</div> Cập nhật: {{ page.product_info.title }} (ID: {{ page.product_info.id }})</div>
<div class="flex"> <div class="flex">
@@ -17,13 +16,10 @@
<div class="bg-white rounded-[10px] shadow-[0_1px_1px_0_rgba(0,0,0,0.1)]"> <div class="bg-white rounded-[10px] shadow-[0_1px_1px_0_rgba(0,0,0,0.1)]">
{% for _menu in page.product_menu %} {% for _menu in page.product_menu %}
<a role="tab" href="/?module=product&view=form&part={{ _menu.id }}" <a role="tab" href="/?module=product&view=form&part={{ _menu.id }}"
class="py-[7px] px-[15px] text-[#919699] block border-b-[1px] border-[#fafafb]"> class="py-[7px] px-[15px] text-[#919699] block border-b-[1px] border-[#fafafb] {% if _menu.is_current == 1 %}bg-[#0041E8] text-[#fff]{% endif %}">
{{ _menu.name }} {{ _menu.name }}
{% if _menu.is_current == 1 %} </a>
- (current)
{% endif %}
</a>
{% endfor %} {% endfor %}
</div> </div>
@@ -31,65 +27,65 @@
<div class="right w-[852px]"> <div class="right w-[852px]">
{% if page.view_part == "store" %} {% if page.view_part == "store" %}
{% include 'product/form_components/store' %} {% include 'product/form_components/store' %}
{% elsif page.view_part == "category" %} {% elsif page.view_part == "category" %}
{% include 'product/form_components/category' %} {% include 'product/form_components/category' %}
{% elsif page.view_part == "seo" %} {% elsif page.view_part == "seo" %}
{% include 'product/form_components/seo' %} {% include 'product/form_components/seo' %}
{% elsif page.view_part == "description" %} {% elsif page.view_part == "description" %}
{% include 'product/form_components/description' %} {% include 'product/form_components/description' %}
{% elsif page.view_part == "spec-group" %} {% elsif page.view_part == "spec-group" %}
{% include 'product/form_components/spec_group' %} {% include 'product/form_components/spec_group' %}
{% elsif page.view_part == "instruction" %} {% elsif page.view_part == "instruction" %}
{% include 'product/form_components/instruction' %} {% include 'product/form_components/instruction' %}
{% elsif page.view_part == "image" %} {% elsif page.view_part == "image" %}
{% include 'product/form_components/image' %} {% include 'product/form_components/image' %}
{% elsif page.view_part == "variant" %} {% elsif page.view_part == "variant" %}
{% include 'product/form_components/variant' %} {% include 'product/form_components/variant' %}
{% elsif page.view_part == "accessory" %} {% elsif page.view_part == "accessory" %}
{% include 'product/form_components/accessory' %} {% include 'product/form_components/accessory' %}
{% elsif page.view_part == "addon" %} {% elsif page.view_part == "addon" %}
{% include 'product/form_components/addon' %} {% include 'product/form_components/addon' %}
{% elsif page.view_part == "video" %} {% elsif page.view_part == "video" %}
{% include 'product/form_components/video' %} {% include 'product/form_components/video' %}
{% elsif page.view_part == "tag" %} {% elsif page.view_part == "tag" %}
{% include 'product/form_components/tag' %} {% include 'product/form_components/tag' %}
{% elsif page.view_part == "relation" %} {% elsif page.view_part == "relation" %}
{% include 'product/form_components/relation' %} {% include 'product/form_components/relation' %}
{% elsif page.view_part == "customer-group" %} {% elsif page.view_part == "customer-group" %}
{% include 'product/form_components/customer_group' %} {% include 'product/form_components/customer_group' %}
{% elsif page.view_part == "component" %} {% elsif page.view_part == "component" %}
{% include 'product/form_components/component' %} {% include 'product/form_components/component' %}
{% elsif page.view_part == "configurable" %} {% elsif page.view_part == "configurable" %}
{% include 'product/form_components/configurable' %} {% include 'product/form_components/configurable' %}
{% elsif page.view_part == "compatible" %} {% elsif page.view_part == "compatible" %}
{% include 'product/form_components/compatible' %} {% include 'product/form_components/compatible' %}
{% elsif page.view_part == "similar" %} {% elsif page.view_part == "similar" %}
{% include 'product/form_components/similar' %} {% include 'product/form_components/similar' %}
{% elsif page.view_part == "combo-set" %} {% elsif page.view_part == "combo-set" %}
{% include 'product/form_components/combo_set' %} {% include 'product/form_components/combo_set' %}
{% else %} {% else %}
<!--//default--> <!--//default-->
{% include 'product/form_components/basic' %} {% include 'product/form_components/basic' %}
{% endif %} {% endif %}
</div> </div>

View File

@@ -12,12 +12,12 @@
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap" <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap"
rel="stylesheet"> rel="stylesheet">
<link rel="stylesheet" media="screen" href="{{ 'pc_style.css' | asset_url }}?v=1.99.21" />
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.6.0/dist/full.min.css" rel="stylesheet" type="text/css" /> <link href="https://cdn.jsdelivr.net/npm/daisyui@4.6.0/dist/full.min.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" />
<link rel="stylesheet" media="screen" href="{{ 'pc_style.css' | asset_url }}?v=1.99.21" />
<script src="{{ 'tailwindcss.js' | asset_url }}"></script> <script src="{{ 'tailwindcss.js' | asset_url }}"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js"></script>
@@ -27,11 +27,12 @@
<body> <body>
{{global|show_var}} {{global|show_var}}
{{page|show_var}}
<div class="admin-global-container"> <div class="admin-global-container">
<!-- Menu cũ --> <!-- Menu cũ -->
<div class="admin-menu-container sticky top-0 bottom-0 h-[100vh] hidden" id="menu-big"> <div class="admin-menu-container box-menu sticky top-0 bottom-0 h-[100vh] hidden" id="menu-big">
<a href="javascript:void(0)" class="icon-close" id="js-hide-menu"> <a href="javascript:void(0)" class="icon-close" id="js-hide-menu">
<i class="fa-solid fa-outdent"></i> <i class="fa-solid fa-outdent"></i>
</a> </a>
@@ -202,7 +203,8 @@
</div> </div>
<!-- Menu mới --> <!-- Menu mới -->
<div class="admin-menu sticky top-0 bottom-0 h-[100vh] bg-[#004E99] flex flex-col justify-between" id="menu-small"> <div class="admin-menu box-menu sticky top-0 bottom-0 h-[100vh] bg-[#004E99] flex flex-col justify-between"
id="menu-small">
<div> <div>
<div <div
class="logo item items-center justify-center border-[rgba(255,255,255,0.15)] border-b p-[20px_0_38px_!important]"> class="logo item items-center justify-center border-[rgba(255,255,255,0.15)] border-b p-[20px_0_38px_!important]">