dashboard

This commit is contained in:
backuppc
2025-07-10 17:40:31 +09:00
parent 26cb328f8f
commit ed0db28b1f
4 changed files with 189 additions and 5 deletions

View File

@@ -105,7 +105,8 @@
</div>
<!-- 통계 카드 -->
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-6 mb-8">
<!-- 출근 카드 -->
<div class="glass-effect rounded-2xl p-6 card-hover animate-slide-up">
<div class="flex items-center justify-between">
@@ -151,12 +152,12 @@
</div>
</div>
<!-- 구매요청 카드 -->
<!-- 구매요청 카드(NR) -->
<div class="glass-effect rounded-2xl p-6 card-hover animate-slide-up">
<div class="flex items-center justify-between">
<div>
<p class="text-white/70 text-sm font-medium">구매요청</p>
<p class="text-3xl font-bold text-white" id="purchaseCount">0</p>
<p class="text-white/70 text-sm font-medium">구매요청(NR)</p>
<p class="text-3xl font-bold text-white" id="purchaseCountNR">0</p>
</div>
<div class="w-12 h-12 bg-danger-500/20 rounded-full flex items-center justify-center">
<svg class="w-6 h-6 text-danger-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -165,6 +166,23 @@
</div>
</div>
</div>
<!-- 구매요청 카드(CR) -->
<div class="glass-effect rounded-2xl p-6 card-hover animate-slide-up">
<div class="flex items-center justify-between">
<div>
<p class="text-white/70 text-sm font-medium">구매요청(CR)</p>
<p class="text-3xl font-bold text-white" id="purchaseCountCR">0</p>
</div>
<div class="w-12 h-12 bg-danger-500/20 rounded-full flex items-center justify-center">
<svg class="w-6 h-6 text-danger-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 11V7a4 4 0 00-8 0v4M5 9h14l1 12H4L5 9z"></path>
</svg>
</div>
</div>
</div>
</div>
<!-- 휴가자 현황 테이블 -->
@@ -270,6 +288,52 @@
});
}
// 구매요청 데이터 Ajax 업데이트
function updatePurchaseCount() {
showLoading();
fetch('http://127.0.0.1:9000/DashBoard/GetPurchaseWaitCount')
.then(response => response.json())
.then(data => {
if (data) {
// NR 구매요청 카운트 업데이트
if (data.NR !== undefined) {
animateNumberChange('purchaseCountNR', data.NR);
}
// CR 구매요청 카운트 업데이트
if (data.CR !== undefined) {
animateNumberChange('purchaseCountCR', data.CR);
}
}
hideLoading();
})
.catch(error => {
console.error('구매요청 데이터 업데이트 중 오류 발생:', error);
hideLoading();
});
}
// 휴가요청 데이터 Ajax 업데이트
function updateHolydayRequestCount() {
showLoading();
fetch('http://127.0.0.1:9000/DashBoard/GetHolydayRequestCount')
.then(response => response.json())
.then(data => {
if (data) {
// NR 구매요청 카운트 업데이트
if (data.HOLY !== undefined) {
animateNumberChange('leaveRequestCount', data.HOLY);
}
}
hideLoading();
})
.catch(error => {
console.error('휴가요청 데이터 업데이트 중 오류 발생:', error);
hideLoading();
});
}
// 숫자 애니메이션
function animateNumberChange(elementId, newValue) {
const element = document.getElementById(elementId);
@@ -300,11 +364,14 @@
// 페이지 로드 시 데이터 업데이트
updateLeaveCount();
updateHolidayList();
updatePurchaseCount();
updateHolydayRequestCount();
// 30초마다 데이터 새로고침
setInterval(() => {
updateLeaveCount();
updateHolidayList();
updatePurchaseCount();
updateHolydayRequestCount();
}, 30000);
</script>
</body>