Files
admin_hura_8/old/template/article/form.html
2025-12-07 15:58:07 +07:00

502 lines
28 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<div class="global-breadcrumb-container">
<a href="/admin/article"> Bài viết </a>
<a href=""> Form cập nhật Bài viết </a>
</div>
<div class="max-w-[1141px] m-auto p-[0_15px]">
<div class="flex flex-wrap items-start m-[16px_0]">
<div
class="w-[100%] p-[11px_16px] bg-white m-[0_0_16px] rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] leading-[18px] flex flex-wrap items-center justify-between">
{% if global.url contains 'id=' %}
<p class="font-bold text-[20px]"> Sửa nội dung </p>
<p class="w-[100%] text-[#6B7280] order-[1]">
ROG FALCHION LOW PROFILE CHƠI GAME TRÊN MAC LÀ CHUYỆN NHỎ
</p>
{% else %}
<p class="font-bold text-[20px]"> Thêm mới </p>
{% endif %}
<div class="flex items-center">
<a href="/admin/article/form"
class="inline-flex items-center whitespace-nowrap border border-[#ECECEC] rounded-[4px] bg-[#fff] text-[#6B7280] leading-[35px] p-[0_12px] m-[0_10px_0_0] group hover:bg-[#0041E8] hover:text-[#fff]">
<span
class="border-[1px] border-[#6B7280] h-[13px] w-[13px] leading-[10.3px] text-center rounded-[50%] mr-1 group-hover:border-[#fff]">+</span>
<span>Thêm nội dung mới</span>
</a>
<a href=""
class="inline-flex items-center whitespace-nowrap border border-[#ECECEC] rounded-[4px] bg-[#fff] text-[#6B7280] leading-[35px] p-[0_12px] m-[0_10px_0_0] group hover:bg-[#0041E8] hover:text-[#fff]">
<span class="far fa-folder mr-2"></span>
<span>Quản lý danh mục</span>
</a>
<a href="/admin/article" title="Danh sách nội dung"
class="fas fa-ellipsis-h text-[18px] border border-[#ECECEC] rounded-[4px] bg-[#fff] text-[#6B7280] leading-[35px] text-center min-w-[36px] group hover:bg-[#0041E8] hover:text-[#fff]"></a>
</div>
</div>
<div class="w-[25%] mr-[16px]">
<div
class="bg-white rounded-[10px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] font-[500] leading-[24px] overflow-hidden">
<a href="javascript:void(0)" style="color: #Fff;background: #0041E8;"
class="block p-[6px_16px] text-[#919699] hover:text-[#fff] hover:bg-[#0041E8] transition"> Chỉnh sửa
</a>
{% if global.url contains 'id=' %}
<a href="/admin/article/tag?id=1"
class="block p-[6px_16px] text-[#919699] hover:text-[#fff] hover:bg-[#0041E8] transition"> Tag </a>
<a href="/admin/article/relation?id=1&related_item_type=product"
class="block p-[6px_16px] text-[#919699] hover:text-[#fff] hover:bg-[#0041E8] transition"> Liên
quan:
Sản phẩm </a>
<a href="/admin/article/relation?id=1&related_item_type=product-category"
class="block p-[6px_16px] text-[#919699] hover:text-[#fff] hover:bg-[#0041E8] transition"> Liên
quan:
Danh mục sản phẩm </a>
{% endif %}
</div>
</div>
<form method="post" enctype="multipart/form-data"
class="w-[calc(100%_-25%_-16px)] bg-white rounded-[15px] shadow-[0px_1px_1px_0px_rgba(0,0,0,0.10)] leading-[20px] block">
<div class="p-[16px] border-[#FAFAFB] border-b-[8px]">
<p class="font-bold text-[20px] leading-[20px] mb-[15px]"> Thông tin cơ bản </p>
<div class="mb-[15px] flex flex-wrap items-center">
<p class="mb-[7px] w-[100%] font-[600]">Ảnh đại diện </p>
<div class="inline-block">
<img src="https://via.placeholder.com/400x300" class="block max-h-[80px] mr-[20px]">
</div>
<label class="cursor-pointer">
<span class="font-[300] mr-[10px]"> Cập nhật ảnh </span>
<input type="file" name="file_thumbnail"
class="file-input h-[40px] rounded-[4px] file-input-bordered file-input-primary w-full max-w-xs">
</label>
</div>
<div class="mb-[15px] flex flex-wrap items-center">
<p class="mb-[7px] w-[100%] font-[600]"> Ảnh nền trong chi tiết </p>
<div class="inline-block">
<img src="https://via.placeholder.com/400x300" class="block max-h-[80px] mr-[20px]">
</div>
<label class="cursor-pointer">
<span class="font-[300] mr-[10px]"> Cập nhật ảnh </span>
<input type="file" name="file_thumbnail"
class="file-input h-[40px] rounded-[4px] file-input-bordered file-input-primary w-full max-w-xs">
</label>
</div>
<div
class="p-[12px_20px] m-[15px_0] border border-[#D8D8D8] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)] rounded-[4px]">
<p class="font-bold mb-2"> Danh mục <i class="font-[300] text-[#6B7280]"> * có thể chọn nhiều danh
mục  </i> </p>
<div class="overflow-auto max-h-[250px]">
<div class="mb-1">
<label class="inline-flex items-center mb-1 ml-1 cursor-pointer group">
<input type="checkbox" value="1" class="checkbox checkbox-success">
<b class="label-text ml-[5px]"> Danh mục cấp 1 </b>
</label>
</div>
<div class="mb-1">
<p class="font-bold mb-[5px]"> Danh mục cấp 1 </p>
<div class="pl-[25px]">
<!-- KHÔNG CÓ danh mục con -->
<label class="inline-flex items-center mb-1 ml-1 cursor-pointer group">
<input type="checkbox" value="2" class="checkbox checkbox-success">
<span class="label-text ml-[5px] text-[#6B7280]"> Danh mục
cấp 2 </span>
</label> <br>
<!-- CÓ danh mục con -->
<div>
<p class="font-bold mb-[5px]"> Danh mục cấp 2 </p>
<div class="pl-[25px]">
<label class="inline-flex items-center mb-1 ml-1 cursor-pointer group">
<input type="checkbox" value="2" class="checkbox checkbox-success">
<span class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 3 </span>
</label> <br>
</div>
</div>
<label class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 2 </span> </label>
<br>
<div>
<p class="font-bold mb-[5px]"> Danh mục cấp 2 </p>
<div class="pl-[25px]"> <label
class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 3 </span>
</label> <br></div>
</div><label class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 2 </span> </label>
<br><label class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 2 </span> </label>
<br><label class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 2 </span> </label>
<br><label class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 2 </span> </label>
<br>
</div>
</div>
<!-- clone -->
<div class="mb-1"> <label class="inline-flex items-center mb-1 ml-1 cursor-pointer group">
<input type="checkbox" value="1" class="checkbox checkbox-success">
<b class="label-text ml-[5px]"> Danh mục cấp 1</b>
</label> </div>
<div class="mb-1">
<p class="font-bold mb-[5px]"> Danh mục cấp 1 </p>
<div class="pl-[25px]"> <label
class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 2 </span> </label>
<br><label class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 2 </span> </label>
<br><label class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 2 </span> </label>
<br><label class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 2 </span> </label>
<br><label class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 2 </span> </label>
<br><label class="inline-flex items-center mb-1 ml-1 cursor-pointer group"> <input
type="checkbox" value="2" class="checkbox checkbox-success"> <span
class="text-[#6B7280] label-text ml-[5px]"> Danh mục cấp 2 </span> </label>
<br>
</div>
</div>
<!-- // -->
</div>
</div>
<div class="mb-[15px]">
<p class="mb-[7px] w-[100%] font-[600]"> Tiêu đề </p>
<input type="text" value=""
class="w-[100%] h-[36px] input input-md input-bordered rounded-[4px] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)]" />
</div>
<div class="mb-[15px]">
<p class="mb-[7px] w-[100%] font-[600]"> Link Index </p>
<input type="text" value=""
class="w-[100%] h-[36px] input input-md input-bordered rounded-[4px] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)]" />
</div>
<div class="mb-[15px]">
<p class="mb-[7px] w-[100%] font-[600]"> Link tham khảo (link web ngoài nếu có) </p>
<input type="text" value=""
class="w-[100%] h-[36px] input input-md input-bordered rounded-[4px] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)]" />
</div>
<div class="mb-[15px]">
<p class="mb-[7px] w-[100%] font-[600]"> Tóm tắt chính </p>
<textarea
class="w-[100%] min-h-[90px] max-h-[150px] textarea textarea-bordered rounded-[4px] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)]"></textarea>
</div>
<div>
<p class="mb-[7px] w-[100%] font-[600]"> Tags (Mỗi cụm từ 1 dòng) </p>
<textarea
class="w-[100%] min-h-[90px] max-h-[150px] rounded-[4px] textarea textarea-bordered shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)]"></textarea>
</div>
</div>
<div class="p-[16px] border-[#FAFAFB] border-b-[8px]">
<div class="flex flex-wrap items-center justify-between mb-3">
<p class="font-bold text-[20px] leading-[20px]"> Mô tả (nếu có) </p>
<div class="flex items-center font-[500] leading-[35px]">
<a href=""
class="group flex items-center whitespace-nowrap border border-[#0041E8] rounded-[4px] bg-[#F5F7FF] text-[#0041E8] p-[0_12px] m-[0_10px_0_0] group hover:bg-[#0041E8] hover:text-[#fff]">
<span class="icons icon-upload group-hover:filter-none"></span>
<span> Upload ảnh </span>
</a>
<a href=""
class="flex items-center whitespace-nowrap border border-[#0041E8] rounded-[4px] bg-[#F5F7FF] text-[#0041E8] p-[0_12px] m-[0_10px_0_0] group hover:bg-[#0041E8] hover:text-[#fff]">
<i class="far fa-folder mr-2"></i>
<span> Quản lý </span>
</a>
<a href=""
class="flex items-center whitespace-nowrap border border-[#0041E8] rounded-[4px] bg-[#F5F7FF] text-[#0041E8] p-[0_12px] group hover:bg-[#0041E8] hover:text-[#fff]">
<i class="fa fa-image mr-2"></i>
<span> Chọn ảnh trong kho ảnh </span>
</a>
</div>
<div class="flex overflow-auto pb-2 w-[100%]">
<a href="javascript:void(0)" class="min-w-[100px] m-[10px_10px_0_0]">
<img src="https://via.placeholder.com/2000x800" class="h-[40px] block" />
</a>
</div>
</div>
<div class="mb-[15px]">
<textarea id="js-desc"> </textarea>
</div>
<div>
<p class="mb-[7px] w-[100%] font-[600]"> Thứ tự <i class="font-[300] text-[13px]"> (* số cao xếp
trước)</i> </p>
<input type="text" value=""
class="w-[100%] h-[36px] input input-md input-bordered rounded-[4px] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)]" />
</div>
</div>
<div class="p-[16px] border-[#FAFAFB] border-b-[8px]">
<p class="font-bold text-[20px] leading-[20px] mb-[15px]"> Dùng cho SEO </p>
<div class="mb-[15px]">
<p class="mb-[7px] w-[100%] font-[600]">
Url canonical
<i class="text-[13px] font-[300]"> * để trống sẽ dùng link mặc định của hệ thống </i>
</p>
<input type="text" value=""
class="w-[100%] h-[36px] input input-md input-bordered rounded-[4px] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)]" />
</div>
<div class="mb-[15px]">
<p class="mb-[7px] w-[100%] font-[600]">
Meta Title
<i class="text-[13px] font-[300]">  0 ký tự , 0 từ </i>
</p>
<input type="text" value=""
class="w-[100%] h-[36px] input input-md input-bordered rounded-[4px] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)]" />
</div>
<div class="mb-[15px]">
<p class="mb-[7px] w-[100%] font-[600]">
Meta Keywords
<i class="text-[13px] font-[300]">  0 ký tự , 0 từ </i>
</p>
<input type="text" value=""
class="w-[100%] h-[36px] input input-md input-bordered rounded-[4px] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)]" />
</div>
<div class="mb-[15px]">
<p class="mb-[7px] w-[100%] font-[600]">
Meta Description
<i class="text-[13px] font-[300]"> 0 ký tự , 0 từ (Khuyến nghị: 160 ký tự) </i>
</p>
<textarea
class="w-[100%] min-h-[90px] max-h-[150px] rounded-[4px] textarea textarea-bordered shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)]"></textarea>
</div>
<div class="mb-[15px] flex items-start">
<p class="mb-[7px] w-[100%] font-[600] w-[220px]"> Cho phép Google Index </p>
<label class="inline-flex items-center cursor-pointer">
<input type="checkbox" class="checkbox checkbox-success">
<span class="label-text ml-[15px]"> Cho phép Google Index </span>
</label>
</div>
<div class="flex items-start">
<p class="mb-[7px] w-[100%] font-[600] w-[220px]"> Hiển thị Mục lục đầu bài viết </p>
<label class="inline-flex items-center cursor-pointer">
<input type="checkbox" class="checkbox checkbox-success">
<span class="label-text ml-[15px]"> Cho phép hiển thị </span>
</label>
</div>
</div>
<div class="p-[16px] border-[#FAFAFB] border-b-[8px]">
<p class="font-bold text-[20px] leading-[20px] mb-[15px]"> Quản trị hiển thị </p>
<div class="mb-[15px] flex flex-wrap">
<p class="w-[230px] font-bold">Thời gian của bài viết</p>
<div>
<label class="inline-flex items-center cursor-pointer relative pl-[30px] mr-[34px]">
<input type="radio" value="0" name="info[article_time_set]"
class="radio checked:bg-blue-500" checked="">
<span class="label-text ml-[10px]"> Thời gian tạo bài </span>
</label>
<label class="inline-flex items-center cursor-pointer relative pl-[30px] mr-[34px]">
<input type="radio" value="1" name="info[article_time_set]"
class="radio checked:bg-blue-500">
<span class="label-text ml-[10px]"> Chọn thời gian </span>
</label>
<div class="w-[100%] hidden" id="js-publish_time">
<div class="flex items-center m-[10px_0]">
<div class="relative mr-[20px]">
<i
class="far fa-calendar text-[#7E7E7E] m-[0_5px_0_0] absolute left-[10px] leading-[35px]"></i>
<input type="date" name="from_time_date" value="" placeholder="Từ ngày"
class="w-[135px] h-[36px] p-[0_10px_0_30px] rounded-[4px] border border-[#D8D8D8] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)]">
</div>
<p class="mr-[10px]"> Giờ </p>
<select name="info[from_time_minute]" id="from_time_minute" style="width: 85px;"
class="border border-[#d8d8d8] h-[36px] rounded-[4px] pl-[5px] shadow-[0px_2px_4px_0px_rgba(0,0,0,0.12)]">
<option value="00:00">00:00</option>
<option value="00:30">00:30</option>
<option value="01:00">01:00</option>
<option value="01:30">01:30</option>
<option value="02:00">02:00</option>
<option value="02:30">02:30</option>
<option value="03:00">03:00</option>
<option value="03:30">03:30</option>
<option value="04:00">04:00</option>
<option value="04:30">04:30</option>
<option value="05:00">05:00</option>
<option value="05:30">05:30</option>
<option value="06:00">06:00</option>
<option value="06:30">06:30</option>
<option value="07:00">07:00</option>
<option value="07:30">07:30</option>
<option value="08:00">08:00</option>
<option value="08:30">08:30</option>
<option value="09:00">09:00</option>
<option value="09:30">09:30</option>
<option value="10:00">10:00</option>
<option value="10:30">10:30</option>
<option value="11:00">11:00</option>
<option value="11:30">11:30</option>
<option value="12:00">12:00</option>
<option value="12:30">12:30</option>
<option value="13:00">13:00</option>
<option value="13:30">13:30</option>
<option value="14:00">14:00</option>
<option value="14:30">14:30</option>
<option value="15:00">15:00</option>
<option value="15:30">15:30</option>
<option value="16:00">16:00</option>
<option value="16:30">16:30</option>
<option value="17:00">17:00</option>
<option value="17:30">17:30</option>
<option value="18:00">18:00</option>
<option value="18:30">18:30</option>
<option value="19:00">19:00</option>
<option value="19:30">19:30</option>
<option value="20:00">20:00</option>
<option value="20:30">20:30</option>
<option value="21:00">21:00</option>
<option value="21:30">21:30</option>
<option value="22:00">22:00</option>
<option value="22:30">22:30</option>
<option value="23:00">23:00</option>
<option value="23:30">23:30</option>
</select>
</div>
</div>
</div>
<i class="w-[100%] font-[300] text-[#6B7280] mt-[5px]">(Hiển thị cho người xem thời gian thật của
bài thay vì thời gian cập nhật)</i>
</div>
<div class="mb-[15px] flex flex-wrap">
<p class="w-[230px] font-bold"> Trạng thái </p>
<div>
<label class="inline-flex items-center cursor-pointer relative pl-[30px] mr-[34px]">
<input type="radio" value="0" name="info[status]" class="radio checked:bg-blue-500"
checked="">
<span class="label-text ml-[10px]"> Bản nháp </span>
</label>
<label class="inline-flex items-center cursor-pointer relative pl-[30px] mr-[34px]">
<input type="radio" value="1" name="info[status]" class="radio checked:bg-blue-500">
<span class="label-text ml-[10px]"> Cho hiển thị </span>
</label>
<label class="inline-flex items-center cursor-pointer relative pl-[30px] mr-[34px]">
<input type="radio" value="-1" name="info[status]" class="radio checked:bg-blue-500">
<span class="label-text ml-[10px]"> Chờ duyệt </span>
</label>
</div>
</div>
<div class="flex flex-wrap items-center">
<p class="w-[230px] font-bold"> Xem thử </p>
<a href="" target="_blank"
class="inline-block font-[600] border border-[#0041E8] rounded-[4px] bg-[#F5F7FF] text-[#0041E8] leading-[30px] p-[0_12px] transition hover:bg-[#0041E8] hover:text-white">
Xem bài viết tại trang web
</a>
</div>
</div>
<input type="submit" value="Cập nhật"
class="inline-block m-[16px] cursor-pointer h-[32px] bg-[#0041E8] text-[#fff] rounded-[4px] font-[500] p-[0_11px]" />
</form>
</div>
</div>
<script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
<script>
tinymce.init({
selector: 'textarea#js-desc',
height: 350,
menubar: true,
plugins: [
'advlist autolink lists link image charmap print preview anchor',
'searchreplace visualblocks code fullscreen',
'insertdatetime media table paste code help wordcount'
],
toolbar: 'undo redo | formatselect | ' +
'bold italic backcolor | alignleft aligncenter ' +
'alignright alignjustify | bullist numlist outdent indent | ' +
'removeformat | help',
content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px }'
});
</script>
<script>
$(function () {
$("input[name='info[article_time_set]']").click(function () {
if ($(this).val() == 1) $("#js-publish_time").show();
else $("#js-publish_time").hide();
});
});
</script>