tieptk/admin_hura_8
2
1
Fork 0
Code Issues 1 Pull Requests Projects Releases Wiki Activity

search

Browse Source
This commit is contained in:
Tieptk
2024-01-31 11:59:25 +07:00
parent 6dd13c49ff
commit 37e4278d53
6 changed files with 213 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
assets/script/pc_style.css
View File

@@ -794,13 +794,13 @@ input[type=radio]:focus:before {
.order-page-table .icons {
width: 30px;
height: 30px;
border: 1px solid #ECECEC;
background-color: #F9F9F9;
border: 1px solid #ececec;
background-color: #f9f9f9;
border-radius: 5px;
}
.order-page-table .icon-edit {
border: 1px solid #0041E8;
background-color: #F5F7FF;
border: 1px solid #0041e8;
background-color: #f5f7ff;
background-position: -108px -82px;
margin-right: 6px;
}
@@ -867,4 +867,28 @@ input[type=radio]:focus:before {
.table-brand td {
padding: 7px 6px;
border: 1px solid #ececec;
}
.autocomplete-suggestions .item {
padding: 12px 0;
border-bottom: 1px solid #ededed;
}
.autocomplete-suggestions .item .info {
width: calc(100% - 108px);
margin-right: 48px;
}
.autocomplete-suggestions .item img {
width: 60px;
display: block;
}
.autocomplete-suggestions .item .name {
font-weight: 600;
line-height: 20px;
}
.autocomplete-suggestions .item .price {
font-weight: 600;
color: #fb4e4e;
line-height: 20px;
display: block;
margin-top: 5px;
}/*# sourceMappingURL=pc_style.css.map */

6
assets/script/pc_style.css.map
View File

File diff suppressed because one or more lines are too long

37
assets/script/pc_style.scss
View File

@@ -304,7 +304,8 @@ a {
align-items: center;
transition: 0.3s all;
position: relative;
&:hover, &.current{
&:hover,
&.current {
background: #81b5e4;
.icons {
filter: brightness(100);
@@ -812,13 +813,13 @@ input[type="radio"] {
.icons {
width: 30px;
height: 30px;
border: 1px solid #ECECEC;
background-color: #F9F9F9;
border: 1px solid #ececec;
background-color: #f9f9f9;
border-radius: 5px;
}
.icon-edit {
border: 1px solid #0041E8;
background-color: #F5F7FF;
border: 1px solid #0041e8;
background-color: #f5f7ff;
background-position: -108px -82px;
margin-right: 6px;
}
@@ -888,3 +889,29 @@ input[type="radio"] {
border: 1px solid #ececec;
}
}
.autocomplete-suggestions {
.item {
padding: 12px 0;
border-bottom: 1px solid #ededed;
.info {
width: calc(100% - 108px);
margin-right: 48px;
}
img {
width: 60px;
display: block;
}
.name {
font-weight: 600;
line-height: 20px;
}
.price {
font-weight: 600;
color: #fb4e4e;
line-height: 20px;
display: block;
margin-top: 5px;
}
}
}

8
template/javascript/global.html
View File

@@ -33,4 +33,12 @@
localStorage.setItem(hideMenuBig ? 'menu_big' : 'menu_small', 'hidden');
localStorage.removeItem(hideMenuBig ? 'menu_small' : 'menu_big');
}
function formatCurrency(a) {
var b = parseFloat(a).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1.").toString();
var len = b.length;
b = b.substring(0, len - 3);
return b;
}
</script>

194
template/javascript/product_list.html
View File

@@ -1,69 +1,139 @@
<script>
function _get_list_category() {
return {
"list_category": [
"list_product": [
{
'id': 1,
'title': 'Màn hình máy tính',
'url': '/?category=9&opt=product&parent=1',
'parentId': 0,
'isParent': 1,
'children': [
{
'id': 10,
'title': 'Màn hình theo khoảng giá',
'url': '/?category=148&opt=product',
'parentId': 1,
'isParent': 0,
'totalProduct': 0,
'children': []
},
{
'id': 11,
'title': 'Màn Hình Theo Kích Thước',
'url': '/?category=54&opt=product&parent=1',
'parentId': 1,
'isParent': 0,
'totalProduct': 0,
'children': [
{
'id': 148,
'title': '17 inch - 21.5 inch',
'url': '/?category=148&opt=product',
'parentId': 11,
'isParent': 0,
'totalProduct': 5,
},
{
'id': 66,
'title': '22 inch - 24 inch',
'url': '?category=66&opt=product',
'parentId': 11,
'isParent': 0,
'totalProduct': 41,
},
{
'id': 67,
'title': '25 inch - 27 inch',
'url': '/?category=67&opt=product',
'parentId': 11,
'isParent': 0,
'totalProduct': 42,
},
{
'id': 68,
'title': '28 inch - 32 inch',
'url': '/?category=68&opt=product',
'parentId': 11,
'isParent': 0,
'totalProduct': 11,
}
]
}
]
}
]
};
'id': 2105,
'title': 'Máy in mã vạch MH241',
'request_path': '/may-in-ma-vach-mh241',
'price': 0,
'market_price': 0,
'quantity': 1,
'image': {
'thumb': 'http://hura8.hurasoft.com/media/product/t-2105-2105_10_1.jpg',
'small': 'http://hura8.hurasoft.com/media/product/s-2105-2105_10_1.jpg',
'large': 'http://hura8.hurasoft.com/media/product/l-2105-2105_10_1.jpg',
'original': 'http://hura8.hurasoft.com/media/product/2105-2105_10_1.jpg',
}
},
{
'id': 2104,
'title': '[Mới 100%] Dell Gaming G16 7620 (Intel core i7-12700H, 16GB, 1TB, RTX 3060 6GB, 16″ QHD+ 165Hz IPS)',
'request_path': '/acer-gaming-predator-helios-neo-16-2023',
'price': 28500000,
'market_price': 0,
'quantity': 1,
'image':
{
'thumb': 'http://hura8.hurasoft.com/media/product/t-2104-2104_predator_16_2023_laptop_tcc_1_2.jpg',
'small': 'http://hura8.hurasoft.com/media/product/s-2104-2104_predator_16_2023_laptop_tcc_1_2.jpg',
'large': 'http://hura8.hurasoft.com/media/product/l-2104-2104_predator_16_2023_laptop_tcc_1_2.jpg',
'original': 'http://hura8.hurasoft.com/media/product/2104-2104_predator_16_2023_laptop_tcc_1_2.jpg',
}
},
{
'id': 2100,
'title': 'Chăn hè đũi xơ đậu nành mã 32 Gấu xanh',
'request_path': '/chan-he-dui-xo-dau-nanh-ma-32-gau-xanh',
'price': 220000,
'market_price': 340000,
'quantity': 1,
'image':
{
'thumb': 'http://hura8.hurasoft.com/media/product/t-2100-2100_8640_m32___g___u_xanh.jpg',
'small': 'http://hura8.hurasoft.com/media/product/s-2100-2100_8640_m32___g___u_xanh.jpg',
'large': 'http://hura8.hurasoft.com/media/product/l-2100-2100_8640_m32___g___u_xanh.jpg',
'original': 'http://hura8.hurasoft.com/media/product/2100-2100_8640_m32___g___u_xanh.jpg',
}
},
{
'id': 2098,
'title': 'Chăn hè đũi xơ đậu nành mã 35 Tròn chấm pi',
'request_path': '/bo-ga-goi-chun-chan-xo-dau-nanh-ma-36-tho-cherry-1',
'price': 225000,
'market_price': 350000,
'quantity': 1,
'image':
{
'thumb': 'http://hura8.hurasoft.com/media/product/t-2098-2098_8666_chan_he_dui_xo_dau_nanh_ma_35_tron_cham_.jpg',
'small': 'http://hura8.hurasoft.com/media/product/s-2098-2098_8666_chan_he_dui_xo_dau_nanh_ma_35_tron_cham_.jpg',
'large': 'http://hura8.hurasoft.com/media/product/l-2098-2098_8666_chan_he_dui_xo_dau_nanh_ma_35_tron_cham_.jpg',
'original': 'http://hura8.hurasoft.com/media/product/2098-2098_8666_chan_he_dui_xo_dau_nanh_ma_35_tron_cham_.jpg',
}
},
{
'id': 2097,
'title': 'Bộ ga gối chun chần xơ đậu nành mã 36 Thỏ Cherry',
'request_path': '/bo-ga-goi-chun-chan-xo-dau-nanh-ma-36-tho-cherry',
'price': 280000,
'market_price': 350000,
'quantity': 1,
'image':
{
'thumb': 'http://hura8.hurasoft.com/media/product/t-2097-2097_8695_m36___th____cherry.jpg',
'small': 'http://hura8.hurasoft.com/media/product/s-2097-2097_8695_m36___th____cherry.jpg',
'large': 'http://hura8.hurasoft.com/media/product/l-2097-2097_8695_m36___th____cherry.jpg',
'original': ' http://hura8.hurasoft.com/media/product/2097-2097_8695_m36___th____cherry.jpg',
}
}
]
}
}
function displayProductList(products) {
var productListElement = $("#js-show-search");
var html = '';
$.each(products, function (index, product) {
var price = product.price
if (price > 0) {
price = `<span class="price">` + formatCurrency(price) + ` đ</span>`;
} else {
price = '<span class="price">0</span>';
}
html += `
<a href="`+ product.request_path + `" class="flex items-center justify-between item">
<span class="info">
<span class="name">`+ product.title + `</span>
`+ price + `
</span>
<img src="`+ product.image.thumb + `" alt="` + product.title + `">
</a>
`;
});
productListElement.html(html);
}
function searchProduct() {
var searchTerm = $("#js-input-search").val().toLowerCase();
var allProducts = _get_list_category().list_product;
// Filter products based on the search term
var filteredProducts = $.grep(allProducts, function (product) {
return product.title.toLowerCase().includes(searchTerm);
});
// Display the filtered products
displayProductList(filteredProducts);
if (filteredProducts.length > 0 && searchTerm !== "") {
$("#js-show-search").show();
displayProductList(filteredProducts);
} else {
$("#js-show-search").hide();
}
}
$(document).ready(function () {
$("#js-input-search").on("input", searchProduct);
})
</script>

12
template/theme.html
View File

@@ -220,11 +220,19 @@
<!-- 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">
<div class="content w-[100%] flex items-center border rounded-[5px]">
<div class="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">
<input type="search" class="block h-[36px] rounded w-full" id="js-input-search"
placeholder="Tìm kiếm">
</div>
<div class="autocomplete-suggestions absolute bg-white p-[5px] w-[100%] shadow-[0_2px_7px_0_rgb(177_177_177)] hidden"
id="js-show-search">
</div>
</form>
<div class="admin-header-right flex items-center justify-end">