tieptk/agent_test
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

u

Browse Source
This commit is contained in:
tieptk
2026-03-07 10:26:20 +07:00
commit aa223ce3bb
1128 changed files with 118856 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

187
template/product/form_components/image.html Normal file
View File

@@ -0,0 +1,187 @@
<!-- hinh anh -->
<div class="w-full" role="tabpanel">
<div class="bg-white rounded-md shadow p-3">
<b class="block text-[20px] font-[700] mb-[10px]">Cập nhật ảnh sản phẩm</b>
<div class="overflow-y-scroll max-h-[500px]">
<div class="item grid grid-cols-6 rounded-md shadow p-3 mt-3 gap-3">
<div class="image">
<img src="{{ 'image-big.png' | asset_url }}" alt="">
</div>
<div class="right-image col-span-5">
<div class="flex justify-between gap-3">
<div class="flex items-center gap-3">
<b class="text-center block">Hình sản phẩm</b>
<p class="text-center block text-gray">(Ảnh chính)</p>
</div>
<div class="grid grid-cols-2 gap-3">
<div class="item flex items-center gap-2">
<p class="whitespace-nowrap">STT</p>
<input type="text" class="input shadow">
</div>
<div class="item flex items-center gap-2">
<p class="whitespace-nowrap">ALT</p>
<input type="text" class="input shadow">
</div>
</div>
</div>
<div class="mt-3">
<a href="" class="btn btn-sm btn-outline">
<i class="iconify lucide--trash-2"></i>
<p class="">Xoá</p>
</a>
</div>
</div>
</div>
<div class="item grid grid-cols-6 rounded-md shadow p-3 mt-3 gap-3">
<div class="image">
<img src="{{ 'image-big.png' | asset_url }}" alt="">
</div>
<div class="right-image col-span-5">
<div class="flex justify-between gap-3">
<div class="flex items-center gap-3">
<b class="text-center block">Hình sản phẩm</b>
<p class="text-center block text-gray">(Ảnh chính)</p>
</div>
<div class="grid grid-cols-2 gap-3">
<div class="item flex items-center gap-2">
<p class="whitespace-nowrap">STT</p>
<input type="text" class="input shadow">
</div>
<div class="item flex items-center gap-2">
<p class="whitespace-nowrap">ALT</p>
<input type="text" class="input shadow">
</div>
</div>
</div>
<div class="mt-3">
<a href="" class="btn btn-sm btn-outline">
<i class="iconify lucide--trash-2"></i>
<p class="">Xoá</p>
</a>
</div>
</div>
</div>
<div class="item grid grid-cols-6 rounded-md shadow p-3 mt-3 gap-3">
<div class="image">
<img src="{{ 'image-big.png' | asset_url }}" alt="">
</div>
<div class="right-image col-span-5">
<div class="flex justify-between gap-3">
<div class="flex items-center gap-3">
<b class="text-center block">Hình sản phẩm</b>
<p class="text-center block text-gray">(Ảnh chính)</p>
</div>
<div class="grid grid-cols-2 gap-3">
<div class="item flex items-center gap-2">
<p class="whitespace-nowrap">STT</p>
<input type="text" class="input shadow">
</div>
<div class="item flex items-center gap-2">
<p class="whitespace-nowrap">ALT</p>
<input type="text" class="input shadow">
</div>
</div>
</div>
<div class="mt-3">
<a href="" class="btn btn-sm btn-outline">
<i class="iconify lucide--trash-2"></i>
<p class="">Xoá</p>
</a>
</div>
</div>
</div>
<div class="item grid grid-cols-6 rounded-md shadow p-3 mt-3 gap-3">
<div class="image">
<img src="{{ 'image-big.png' | asset_url }}" alt="">
</div>
<div class="right-image col-span-5">
<div class="flex justify-between gap-3">
<div class="flex items-center gap-3">
<b class="text-center block">Hình sản phẩm</b>
<p class="text-center block text-gray">(Ảnh chính)</p>
</div>
<div class="grid grid-cols-2 gap-3">
<div class="item flex items-center gap-2">
<p class="whitespace-nowrap">STT</p>
<input type="text" class="input shadow">
</div>
<div class="item flex items-center gap-2">
<p class="whitespace-nowrap">ALT</p>
<input type="text" class="input shadow">
</div>
</div>
</div>
<div class="mt-3">
<a href="" class="btn btn-sm btn-outline">
<i class="iconify lucide--trash-2"></i>
<p class="">Xoá</p>
</a>
</div>
</div>
</div>
<div class="item grid grid-cols-6 rounded-md shadow p-3 mt-3 gap-3">
<div class="image">
<img src="{{ 'image-big.png' | asset_url }}" alt="">
</div>
<div class="right-image col-span-5">
<div class="flex justify-between gap-3">
<div class="flex items-center gap-3">
<b class="text-center block">Hình sản phẩm</b>
<p class="text-center block text-gray">(Ảnh chính)</p>
</div>
<div class="grid grid-cols-2 gap-3">
<div class="item flex items-center gap-2">
<p class="whitespace-nowrap">STT</p>
<input type="text" class="input shadow">
</div>
<div class="item flex items-center gap-2">
<p class="whitespace-nowrap">ALT</p>
<input type="text" class="input shadow">
</div>
</div>
</div>
<div class="mt-3">
<a href="" class="btn btn-sm btn-outline">
<i class="iconify lucide--trash-2"></i>
<p class="">Xoá</p>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="bg-white rounded-md shadow p-3 mt-5">
<b class="text-xl block">Thêm ảnh cho sản phẩm</b>
<p class="text-gray">Bạn có thể: Chọn ảnh có sẵn trong kho ảnh, hoặc upload ảnh từ máy tính:</p>
<div id="image-preview-filepond" class="mt-5"></div>
<p class="text-gray italic mt-3"><b>Chú ý:</b> Bạn có thể chọn nhiều ảnh cùng 1
lúc:
Chấp nhận các file ảnh: jpg,gif</p>
<input class="btn btn-active mt-3" name="commit" type="submit" value="Cập nhật">
</div>
<div class="bg-white p-3 rounded-sm shadow mt-5">
<b class="block">Chú ý:</b>
<ul class="text-sm">
<li>- Ảnh Sản phẩm kích thước lớn sẽ được tự động co lại thành các ảnh
nhỏ hơn cho những vị trí liên quan. Tùy giao
diện website của bạn mà kích thước ảnh Sản phẩm khác nhau. <a href="/system/setup"
class="text-primary underline">Click
vào đây</a> để
quy định kích thước ảnh Sản phẩm.</li>
<li>
- Chỉ dùng file ảnh đuôi .jpg và .gif.
</li>
<li>
- Cập nhật hình ảnh cho Sản phẩm ở nhiều góc cạnh, màu sắc để người dùng xem
rõ nhất. Nên cập nhật ảnh có kích thước lớn
và độ phân giải cao.
</li>
</ul>
</div>
</div>