This commit is contained in:
antv
2026-07-17 00:11:23 +07:00
parent ad5465198e
commit c4e652e64c
5 changed files with 129 additions and 30 deletions
+69 -2
View File
@@ -137,6 +137,18 @@ $tpls = [
</div>
</div>
<!-- Cards Info Summary -->
<div class="flex flex-col sm:flex-row gap-4 mb-5">
<div id="cardInfoBox1" class="flex-1 bg-white p-4 rounded-2xl border border-[#e8edf4] shadow-[0_4px_12px_rgba(0,0,0,0.02)] flex items-center justify-between transition-all hover:shadow-md">
<span class="text-[12px] font-bold text-gray-500 uppercase">Số thẻ đang </span>
<span class="text-xl font-black transition-colors duration-300" id="currentUserCardsCount" style="color:#3462f7;">{{ Auth::user()->card }}</span>
</div>
<div id="cardInfoBox2" class="flex-1 bg-white p-4 rounded-2xl border border-[#e8edf4] shadow-[0_4px_12px_rgba(0,0,0,0.02)] flex items-center justify-between transition-all hover:shadow-md">
<span class="text-[12px] font-bold text-gray-500 uppercase">Đã gửi cho người hiện tại</span>
<span class="text-xl font-black transition-colors duration-300" id="sentToUserCountContainer" style="color:#3462f7;"><span id="sentToUserCount">0</span> <span class="text-sm font-medium text-gray-400">/ {{ App\Models\Administration::MAX_SEND_CARD_PER_MONTH }}</span></span>
</div>
</div>
<!-- General Error notification block -->
<div id="formGeneralError" class="p-4 bg-red-50 border border-red-100 text-red-800 rounded-2xl text-xs font-semibold leading-relaxed flex items-start gap-2 shadow-sm mb-5 whitespace-pre-line hidden">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="w-5 h-5 shrink-0 text-red-600">
@@ -269,6 +281,17 @@ document.addEventListener('DOMContentLoaded', function() {
if ($noteHeader) {
$noteHeader.style.color = t.accent;
}
// sync stats colors
const $stat1 = document.getElementById('currentUserCardsCount');
if ($stat1) $stat1.style.color = t.accent;
const $stat2 = document.getElementById('sentToUserCountContainer');
if ($stat2) $stat2.style.color = t.accent;
const $box1 = document.getElementById('cardInfoBox1');
if ($box1) $box1.style.borderColor = t.accent;
const $box2 = document.getElementById('cardInfoBox2');
if ($box2) $box2.style.borderColor = t.accent;
// store current template for modal sync
currentTpl = id;
}
@@ -299,10 +322,45 @@ document.addEventListener('DOMContentLoaded', function() {
const savedAmount = localStorage.getItem('selectedAmount');
if (savedAmount) document.getElementById('amount').value = savedAmount;
// Listen for changes to persist them
document.getElementById('receiver').addEventListener('change', function(){
localStorage.setItem('selectedReceiver', this.value);
const val = this.value;
localStorage.setItem('selectedReceiver', val);
if (val) {
$.ajax({
url: '{{ route("user.recipient_stats") }}?receiver=' + val,
method: 'GET',
success: function(res) {
if(res.success) {
document.getElementById('sentToUserCount').textContent = res.sent_count;
const maxLimit = {{ App\Models\Administration::MAX_SEND_CARD_PER_MONTH }};
const isLimitReached = res.sent_count >= maxLimit;
document.getElementById('amount').disabled = isLimitReached;
document.getElementById('confirm_written').disabled = isLimitReached;
document.getElementById('btnSubmitSend').disabled = isLimitReached;
if (isLimitReached) {
document.getElementById('btnSubmitSend').classList.add('opacity-50', 'cursor-not-allowed');
} else {
document.getElementById('btnSubmitSend').classList.remove('opacity-50', 'cursor-not-allowed');
}
}
}
});
} else {
document.getElementById('sentToUserCount').textContent = '0';
document.getElementById('amount').disabled = false;
document.getElementById('confirm_written').disabled = false;
document.getElementById('btnSubmitSend').disabled = false;
document.getElementById('btnSubmitSend').classList.remove('opacity-50', 'cursor-not-allowed');
}
});
// Initial fetch if receiver is already selected
if (document.getElementById('receiver').value) {
document.getElementById('receiver').dispatchEvent(new Event('change'));
}
document.getElementById('amount').addEventListener('change', function(){
localStorage.setItem('selectedAmount', this.value);
});
@@ -454,8 +512,10 @@ document.addEventListener('DOMContentLoaded', function() {
// User state for client-side validation
let userCard = {{ (int) auth()->user()->card }};
let userFlagSend = {{ (int) auth()->user()->flag_send }};
let isSubmittingApi = false;
$submitBtn.addEventListener('click', function(){
if (isSubmittingApi) return;
if (!validateForm()) { return; }
const msnv = document.getElementById('receiver').value;
@@ -471,6 +531,9 @@ document.addEventListener('DOMContentLoaded', function() {
showModal('Xác nhận gửi Thank Card',
'Đừng quên hoàn thành Thank Card của bạn nhé!\n Chúng mình sẽ gửi thông báo đến người nhận\nđể họ đến khu vực nhận thư.',
true, () => {
if (isSubmittingApi) return;
isSubmittingApi = true;
window.closeModal('customModal');
setButtonLoading(true);
clearErrors();
@@ -494,6 +557,7 @@ document.addEventListener('DOMContentLoaded', function() {
userCard = 0;
userFlagSend = 0;
}
document.getElementById('currentUserCardsCount').textContent = userCard;
// Clear local storage for inputs (but not template)
localStorage.removeItem('selectedReceiver');
@@ -537,6 +601,9 @@ document.addEventListener('DOMContentLoaded', function() {
const errMsg = res?.message || 'Không thể kết nối đến máy chủ.';
document.getElementById('generalErrorMessage').textContent = errMsg;
document.getElementById('formGeneralError').classList.remove('hidden');
},
complete: function() {
isSubmittingApi = false;
}
});
}