admin_hura_8/template/product/home.html

<div class="bg-white shadow p-3 rounded-sm">
    <h1 class="text-2xl font-bold mb-3">Danh sách sản phẩm ({{ page.total | format_number }})</h1>
    <div class="flex flex-wrap justify-between items-center">
        <div class="btn-left flex items-center mb-3 gap-3">
            <div class="form-control w-48">
                <div class="dropdown dropdown-bottom w-full">
                    <label tabindex="0" class="btn btn-view btn-sm btn-outline w-full flex justify-between">
                        Chọn danh mục
                        <i class="iconify lucide--chevron-down"></i>
                    </label>

                    <ul tabindex="0" class="dropdown-content menu bg-white shadow-xl rounded-box w-80 mt-1 p-2">
                        {% for cate in page.list_category %}
                        {% if cate.children.size > 0 %}
                        <li>
                            <details>
                                <summary><a href="{{cate.url}}">{{cate.title}}</a></summary>
                                {% for cate2 in cate.children %}
                                <ul>
                                    <li><a>{{cate2.title}}</a></li>
                                    {% if cate2.children.size > 0 %}
                                    <ul class="ml-4">
                                        {% for cate3 in cate2.children %}
                                        <li><a href="{{cate3.url}}">{{cate3.title}} ({{cate3.totalProduct}})</a></li>
                                        {% endfor %}
                                    </ul>
                                    {% endif %}
                                </ul>
                                {% endfor %}
                            </details>
                        </li>
                        {% else %}
                        <li><a href="{{cate.url}}">{{cate.title}}</a></li>
                        {% endif %}
                        {% endfor %}
                    </ul>
                </div>
            </div>
            <a href="javascript:void(0)" onclick="js_list_brand.showModal()" class="btn btn-outline btn-sm  btn-view">
                Chọn thương hiệu để xem
            </a>
        </div>
        <div class="btn-right flex items-center mb-3 gap-3">
            <a href="/admin/product/form" class="btn btn-sm btn-outline btn-view">
                <i class="iconify lucide--plus"></i>
                <span>Thêm sản phẩm mới</span>
            </a>
            <a href="" class="btn btn-outline btn-sm btn-view">
                <i class="iconify lucide--file-pdf"></i>
                <span class="ml-1">Danh sách cập nhật</span>
            </a>
            <a href="" class="btn btn-outline btn-sm btn-view">
                <i class="iconify lucide--file-x"></i>
                <span class="ml-1">Cập nhật Excel</span>
            </a>
        </div>
    </div>
    <div class="overflow-x-auto mt-5 border border-base-200 rounded-sm">
        <table class="table">
            <thead>
                <tr class="bg-base-200 text-black">
                    <th>STT</th>
                    <th>Ảnh</th>
                    <th>Sản phẩm (Tổng số: {{page.total}})</th>
                    <th>Thông tin bán hàng</th>
                    <th>
                        <select id="" class="select" onchange="location.href=this.value">
                            <option value="/admin/product?">Lọc sản phẩm</option>
                            <option value="/admin/product?hotType=new">Mới</option>
                            <option value="/admin/product?hotType=hot">HOT (hỏi nhiều)</option>
                            <option value="/admin/product?hotType=bestsale">Bán chạy</option>
                            <option value="/admin/product?hotType=saleoff">Xả hàng (sale-off)</option>
                            <option value="/admin/product?hotType=online-only">Chỉ bán online</option>
                        </select>
                    </th>
                    <th>Công cụ</th>
                </tr>
            </thead>
            <tbody>
                {% assign counter = 0 %}
                {% for item in page.item_list %}
                {% increment counter %}
                <tr>
                    <td>{{ counter }}</td>
                    <td>
                        <img class="block mx-auto my-0 w-[70px] h-[50px]" src="{{item.image.thumb}}" alt="">
                        <span class="text-center block whitespace-nowrap">{{item.image_count}} ảnh</span>
                    </td>
                    <td>
                        <a href="/admin/product/form?id={{item.id}}">[#{{item.id}}]
                            <span class="link-primary">-
                                {{item.title}}</span>
                        </a>
                        {% if item.config_count > 0 %}<p class="text-sm text-orange">[Có cấu hình]</p>{% endif %}
                        <div class="flex items-center my-1 gap-2">
                            <span>Danh mục:</span>
                            <b class="">Màn hình Máy tính</b>
                        </div>
                        <div class="flex items-center my-1 gap-2">
                            <span>Mã kho</span>
                            <b class="px-2">{{item.sku}}</b>
                            <span class="text-black font-[500]">|</span>
                            <span class="px-2">Hãng</span>
                            <p class="link-primary">{{item.model}}</p>
                        </div>

                        {% assign date_now = "now" | date: format %}
                        {% assign date_last = item.last_update %}
                        {% assign time_conlai = date_now | minus: date_last %}

                        <p class="mb-2">Cập nhật: {{item.last_update | date: "Y-m-d h:i" }} <span class="text-red">(
                                {{ time_conlai | divided_by: 86400 | round}}
                                ngày)</span></p>
                        <p>Người cập nhật : {{item.last_update_by}}</p>
                    </td>
                    <td>
                        <div class="flex flex-wrap items-center mb-1">
                            <span class="">Giá bán:</span>
                            <b class="text-[#E00000] ml-[3px] whitespace-nowrap">
                                {% if item.price > 0 %}
                                {{item.price | format_price }} vnd
                                {% else %}`
                                {{item.price }} vnd
                                {% endif %}
                            </b>
                        </div>
                        <div class="flex items-center mb-1">
                            <span class="whitespace-nowrap">Giá thị trường:</span>
                            <b class="text-[#E00000] ml-2 whitespace-nowrap">
                                {% if item.market_price > 0 %} {{item.market_price | format_price }} vnd {% else %}
                                0 vnd {% endif %}
                            </b>
                        </div>
                        <p>Bảo hành: {{item.warranty}}</p>
                        <p>Khuyến mại: {{item.special_offer}}</p>
                        <div class="flex items-center mb-1 gap-2">
                            <span>SL tổng:</span>
                            <b class="ml-2">{{item.quantity}}</b>
                        </div>
                    </td>
                    <td class="align-text-top">

                        <label class="cursor-pointer flex items-center mb-2 gap-2"
                            onclick="AdminFunction.update_product_hot('{{item.id}}')">
                            <input type="checkbox" name="new" {% if item.hot_type=="new" %}checked="checked" {% endif %}
                                class="checkbox checkbox-success checkbox-sm" />
                            <span class="label-text whitespace-nowrap">Mới Hot (Hỏi nhiều)</span>
                        </label>


                        <label class="cursor-pointer flex items-center mb-2 gap-2"
                            onclick="AdminFunction.update_product_hot('{{item.id}}')">
                            <input type="checkbox" name="hot" {% if item.hot_type=="hot" %}checked="checked" {% endif %}
                                class="checkbox checkbox-success checkbox-sm" />
                            <span class="label-text  whitespace-nowrap">Hot (Hỏi nhiều)</span>
                        </label>

                        <label class="cursor-pointer flex items-center mb-2 gap-2"
                            onclick="AdminFunction.update_product_hot('{{item.id}}')">
                            <input type="checkbox" name="bestsale" {% if item.hot_type=="bestsale" %}checked="checked"
                                {% endif %} class="checkbox checkbox-success checkbox-sm" />
                            <span class="label-text whitespace-nowrap">Bán
                                chạy</span>
                        </label>

                        <label class="cursor-pointer flex items-center mb-2 gap-2"
                            onclick="AdminFunction.update_product_hot('{{item.id}}')">
                            <input type="checkbox" name="saleoff" {% if item.hot_type=="saleoff" %}checked="checked" {%
                                endif %} class="checkbox checkbox-success checkbox-sm" />
                            <span class="label-text whitespace-nowrap">Xả
                                hàng (sale-off)</span>
                        </label>

                        <label class="cursor-pointer flex items-center mb-2 gap-2"
                            onclick="AdminFunction.update_product_hot('{{item.id}}')">
                            <input type="checkbox" name="online-only" {% if item.hot_type=="online-only"
                                %}checked="checked" {% endif %} class="checkbox checkbox-success checkbox-sm" />
                            <span class="label-text whitespace-nowrap">Chỉ bán online</span>
                        </label>

                        <div id="js-status-hottype-{{item.id}}" class="flex items-center mt-2"></div>
                    </td>
                    <td class="align-text-top">
                        <div class="list-btn flex items-center gap-3">
                            <a href="/admin/product/form?id={{item.id}}" title="Form sản phẩm"
                                class="btn btn-soft btn-xs btn-square btn-outline  btn-view">
                                <i class="iconify lucide--pencil"></i>
                            </a>
                            <a href="{{item.request_path}}" title="Xem tại web" target="_blank"
                                class="btn btn-soft btn-xs btn-square btn-outline  btn-view">
                                <i class="iconify lucide--globe"></i>
                            </a>
                            {% if item.status == 0 %}
                            <a href="" class="btn btn-soft btn-xs btn-square btn-outline  btn-view">
                                <i class="iconify lucide--eye-off"></i>
                            </a>
                            {% else %}
                            <a href="" class="btn btn-soft btn-xs btn-square btn-outline  btn-view">
                                <i class="iconify lucide--eye"></i>
                            </a>
                            {% endif %}
                            <a href="" class="btn btn-soft btn-xs btn-error btn-square">
                                <i class="iconify lucide--trash"></i>
                            </a>
                        </div>
                    </td>
                </tr>
                {% endfor %}

            </tbody>
        </table>
    </div>

    <div class="join mt-5 justify-center flex items-center">
        {% for paging in page.pagination.collection %}
        {% if paging.name == 'next' %}
        <a href="{{paging.url}}" class="btn btn-square btn-sm btn-outline border-base-300 join-item"
            aria-label="Pagination controls">
            <span class="iconify lucide--arrow-right"></span>
        </a>
        {% elsif paging.name == 'prev' %}
        <a href="{{paging.url}}" class="btn btn-square btn-sm btn-outline border-base-300 join-item"
            aria-label="Pagination controls">
            <span class="iconify lucide--arrow-left"></span>
        </a>
        {% else %}
        <a href="{{paging.url}}"
            class="btn btn-square btn-sm btn-outline border-base-300 join-item {% if paging.is_active == 1 %}btn-active{% endif %}">{{paging.name}}</a>
        {% endif %}
        {% endfor %}
    </div>

</div>




<dialog id="js_list_category" class="modal">
    <div class="modal-box w-11/12 max-w-5xl">
        <form method="dialog">
            <button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
        </form>
        <div class="flex items-center gap-2">
            <b class="text-lg">Tổng sản phẩm:</b>
            <p class="ml-2">{{page.total}} sản phẩm</p>
        </div>
        <div class="list-category mt-1 max-h-400 max-h-400p overflow-x-auto">
            {% for cate in page.list_category %}
            <a href="{{cate.url}}" class="item block mb-2 text-primary">
                {% if cate.children.size > 0 %}
                <b class="text-primary">+ (#{{cate.id}}){{cate.title}}</b>
                {% else %}
                + (#{{cate.id}}){{cate.title}}
                {% endif %}
            </a>
            {% if cate.children.size > 0 %}
            <div class="ml-2">
                {% for cate2 in cate.children %}
                <a href="{{cate2.url}}" class="item block mb-2 text-primary">
                    {% if cate2.children.size > 0 %}
                    <b class="text-primary">+ (#{{cate2.id}}){{cate2.title}}</b>
                    {% else %}
                    + (#{{cate2.id}}){{cate2.title}} ({{cate2.totalProduct}})
                    {% endif %}
                </a>
                {% if cate2.children.size > 0 %}
                <div class="ml-2">
                    {% for cate3 in cate2.children %}
                    <a href="{{cate3.url}}" class="item block mb-2 text-primary">+
                        (#{{cate3.id}}){{cate3.title}}
                        ({{cate3.totalProduct}})</a>
                    {% endfor %}
                </div>
                {% endif %}
                {% endfor %}
            </div>
            {% endif %}
            {% endfor %}
        </div>
    </div>
    <form method="dialog" class="modal-backdrop">
        <button>close</button>
    </form>
</dialog>


<dialog id="js_list_brand" class="modal">
    <div class="modal-box w-11/12 max-w-3xl">
        <form method="dialog">
            <button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
        </form>
        <div class="flex flex-wrap items-center">
            <b class="inline-block w-34">Tìm theo chữ cái</b>
            <div class="list-key inline-block ml-2 max-w-3xl">
                {% for key in page.brand_letters %}
                <a href="{{key.url}}">
                    <span class="text-primary underline">{{key.key}}</span> <span>({{key.total}})</span>
                </a>
                {% endfor %}
            </div>
            <div class="overflow-x-auto border border-base-200 rounded-sm mt-5 w-full mt-3">
                <table class="w-full table table-sm table-brand">
                    <thead>
                        <tr class="bg-base-200">
                            <th>STT</th>
                            <th>Thương hiệu</th>
                            <th class="whitespace-nowrap">Số lượng sản phẩm</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% assign stt = 0 %}
                        {% for item in page.list_brands %}
                        {% for item2 in item.1 %}
                        {% increment stt %}
                        <tr>
                            <td>{{stt}}</td>
                            <td>{{item2.name}}</td>
                            <td>
                                <span>{{item2.product}}</span>
                                <a href="{{item2.url}}" class="text-primary">(Xem sp)</a>
                            </td>
                        </tr>
                        {% endfor %}
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <form method="dialog" class="modal-backdrop">
        <button>close</button>
    </form>
</dialog>