/* Admin.jsx — 관리자 화면: 대시보드, 주문승인, 포인트지급, 재고관리 */ const { useState: useAdmin } = React; /* ---- 관리자 대시보드 ---- */ function AdminDashboard({ setScreen }) { const store = useStore(); const pending = store.orders.filter(o=>o.status==='pending').length; const totalPtsUsed = store.employees.reduce((s,e)=>s+e.total_used, 0); const lowStock = store.products.filter(p=>Object.values(p.stock).reduce((a,b)=>a+b,0)<=5).length; return (
setScreen('admin-orders')}>
승인 대기
0?'var(--err)':'var(--fg-1)'}}>{pending}
클릭하여 처리
이번 달 지급
{fmtPts(totalPtsUsed)}P
setScreen('admin-inventory')}>
재고 부족 품목
0?'var(--warn)':'var(--fg-1)'}}>{lowStock}
재고 확인
활성 직원
{store.employees.length}
{/* 최근 주문 */}
최근 주문 현황
{store.orders.slice(0,5).map(o=>( ))}
주문번호직원부서상품포인트상태날짜
{o.id} {o.emp} {o.dept} {o.items} {fmtPts(o.pts)}P {o.date}
{/* 포인트 잔액 분포 */}
직원별 포인트 잔액
{store.employees.map(e=>{ const pct = Math.round((e.pts / 25000)*100); return (
{e.name}
{e.dept}
{fmtPts(e.pts)}P
); })}
); } /* ---- 주문 승인/반려 ---- */ function AdminOrders() { const store = useStore(); const [filter, setFilter] = useAdmin('pending'); function approve(id) { store.orders = store.orders.map(o=>o.id===id?{...o,status:'approved'}:o); store.pub(); } function reject(id) { store.orders = store.orders.map(o=>o.id===id?{...o,status:'rejected'}:o); store.pub(); } const filtered = filter==='전체' ? store.orders : store.orders.filter(o=>o.status===filter); const pending = store.orders.filter(o=>o.status==='pending').length; return (
{pending > 0 && (
{pending}건의 주문이 승인을 기다리고 있어요.
)}
{['pending','approved','shipped','delivered','rejected','전체'].map(f=>( ))}
{filtered.map(o=>( ))}
주문번호직원부서상품포인트상태날짜처리
{o.id} {o.emp} {o.dept} {o.items} {fmtPts(o.pts)}P {o.date} {o.status==='pending' ? (
) : —}
{filtered.length===0 &&

처리할 주문이 없어요

}
); } /* ---- 포인트 지급 ---- */ function AdminPoints() { const store = useStore(); const [sel, setSel] = useAdmin(null); const [amount, setAmount] = useAdmin(''); const [note, setNote] = useAdmin(''); const [done, setDone] = useAdmin(false); const employees = store.employees; function givePoints() { if (!sel || !amount) return; const amt = parseInt(amount); store.employees = store.employees.map(e=>e.id===sel ? {...e, pts: e.pts + amt} : e); store.pub(); setDone(true); setTimeout(()=>{setDone(false);setSel(null);setAmount('');setNote('');},1800); } return (
{/* 직원 목록 */}
직원 목록
{employees.map(e=>( setSel(e.id)} style={{cursor:'pointer', background: sel===e.id?'var(--accent-050)':''}}> ))}
직원부서현재 잔액누적 사용
{e.name} {e.position} {e.dept} {fmtPts(e.pts)}P {fmtPts(e.total_used)}P
{/* 지급 폼 */}
포인트 지급
{done ? (
포인트가 지급됐어요
) : (
{sel && (
현재 잔액: {fmtPts(employees.find(e=>e.id===sel)?.pts||0)}P
)}
setAmount(e.target.value)}/>
setNote(e.target.value)}/>
{sel && amount && (
지급 후 잔액: {fmtPts((employees.find(e=>e.id===sel)?.pts||0)+parseInt(amount||0))}P
)}
)}
); } /* ---- 재고 관리 ---- */ function AdminInventory() { const store = useStore(); const [search, setSearch] = useAdmin(''); const filtered = store.products.filter(p=>search===''||p.name.includes(search)); return (
setSearch(e.target.value)}/>
{filtered.map(p=>{ const total = Object.values(p.stock).reduce((a,b)=>a+b,0); const max = 50; const pct = Math.min(100, Math.round((total/max)*100)); const statusCls = total===0?'chip-err':total<=5?'chip-warn':'chip-ok'; const statusLabel = total===0?'품절':total<=5?'부족':'정상'; return ( ); })}
상품명분류단가(P)총 재고재고 현황상태
{p.thumb}
{p.name}
{p.tag&&{p.tag}}
 {p.cat} {fmtPts(p.pts)} {total}
{pct}%
{statusLabel}
); } Object.assign(window, { AdminDashboard, AdminOrders, AdminPoints, AdminInventory }); /* ================================================================ 배너 관리 ================================================================ */ function AdminBannerMgmt() { const store = useStore(); const [form, setForm] = React.useState(null); const [dragSrc, setDragSrc] = React.useState(null); const [imgOver, setImgOver] = React.useState(false); const fileRef = React.useRef(); const PF = "var(--font-sans)"; function startNew() { setForm({ id:Date.now(), tag:'NEW', title:'배너 제목\n두 번째 줄', sub:'서브 텍스트를 입력하세요', cta:'지금 보러가기', bg:'linear-gradient(130deg,#042C44 0%,#1B6EEA 100%)', thumb:'📦', active:true, startDate:'', endDate:'', imageUrl:null }); } function startEdit(b) { setForm({ ...b }); } function saveForm() { const isNew = !store.banners.find(b => b.id === form.id); store.banners = isNew ? [...store.banners, form] : store.banners.map(b => b.id === form.id ? form : b); store.pub(); setForm(null); } function deleteBanner(id) { store.banners = store.banners.filter(b => b.id !== id); store.pub(); } function toggleActive(id) { store.banners = store.banners.map(b => b.id === id ? { ...b, active: !b.active } : b); store.pub(); } function onDrop(e, toIdx) { e.preventDefault(); if (dragSrc === null || dragSrc === toIdx) { setDragSrc(null); return; } const arr = [...store.banners]; const [m] = arr.splice(dragSrc, 1); arr.splice(toIdx, 0, m); store.banners = arr; store.pub(); setDragSrc(null); } function handleImg(file) { if (!file) return; const r = new FileReader(); r.onload = e => setForm(f => ({ ...f, imageUrl: e.target.result, thumb: '' })); r.readAsDataURL(file); } const Toggle = ({ on, onChange }) => (
); if (form) return (
{form.id > 1e12 ? '배너 추가' : '배너 수정'}
{/* 이미지 업로드 */}
{ e.preventDefault(); setImgOver(true); }} onDragLeave={() => setImgOver(false)} onDrop={e => { e.preventDefault(); setImgOver(false); handleImg(e.dataTransfer.files[0]); }} onClick={() => fileRef.current.click()} style={{ height:110, border:`2px dashed ${imgOver ? 'var(--accent)' : 'var(--border-hairline)'}`, borderRadius:12, display:'flex', alignItems:'center', justifyContent:'center', flexDirection:'column', gap:8, cursor:'pointer', background: imgOver ? 'var(--accent-050)' : 'rgba(255,255,255,0.5)', overflow:'hidden', transition:'all 140ms' }}> {form.imageUrl ? : <>드래그 또는 클릭하여 업로드} handleImg(e.target.files[0])}/>
setForm(f => ({...f, thumb:e.target.value, imageUrl:null}))} placeholder="🧥" style={{ width:80, textAlign:'center', fontSize:22 }}/>
setForm(f => ({...f, tag:e.target.value}))} placeholder="2024 NEW"/>