Clarify storage limits and unify file metadata displays

apps/web/src/AdminPanel.vue

@@ -13,6 +13,7 @@ import {
   X,
 } from '@lucide/vue';
 import { api, showError } from './client';
+import { formatSize as size, formatAdminDate as date } from './displayFormat';
 const emit = defineEmits(['devices']);
 const overview = ref(null),
   files = ref([]),
@@ -29,22 +30,6 @@ const maxConcurrent = ref(4),
   countries = ref(''),
   ips = ref('');
 const countryNames = new Intl.DisplayNames(['ko'], { type: 'region' });
-const size = (bytes) =>
-  bytes >= 1073741824
-    ? `${(bytes / 1073741824).toFixed(1)} GiB`
-    : bytes >= 1048576
-      ? `${(bytes / 1048576).toFixed(1)} MiB`
-      : `${Math.max(0, Math.round(bytes / 1024))} KiB`;
-const date = (value) =>
-  value
-    ? new Intl.DateTimeFormat('ko-KR', {
-        timeZone: 'Asia/Seoul',
-        month: 'numeric',
-        day: 'numeric',
-        hour: 'numeric',
-        minute: '2-digit',
-      }).format(new Date(value))
-    : '확인 불가';
 function region(location) {
   if (!location) return '확인 불가';
   return (
@@ -58,7 +43,7 @@ function region(location) {
 }
 function form(settings) {
   maxConcurrent.value = settings.maxConcurrentUploads;
-  capacity.value = settings.totalStorageLimitMb / 1024;
+  capacity.value = Number(((settings.totalStorageLimitMb * 1048576) / 1e9).toFixed(1));
   countries.value = settings.blockedCountries.join(', ');
   ips.value = settings.blockedIps.join('\n');
 }
@@ -120,7 +105,11 @@ async function save() {
     const settings = await api('/admin/settings', 'PATCH', {
       revision: overview.value.settings.revision,
       maxConcurrentUploads: Number(maxConcurrent.value),
-      totalStorageLimitMb: Math.round(Number(capacity.value) * 1024),
+      totalStorageLimitMb:
+        Number(capacity.value) ===
+        Number(((overview.value.settings.totalStorageLimitMb * 1048576) / 1e9).toFixed(1))
+          ? overview.value.settings.totalStorageLimitMb
+          : Math.round((Number(capacity.value) * 1e9) / 1048576),
       blockedCountries: split(countries.value),
       blockedIps: split(ips.value),
     });
@@ -277,18 +266,19 @@ onMounted(async () => {
             ><span>{{ size(file.size) }}</span>
           </div>
           <div class="admin-file-info">
-            <span>{{
-              file.uploader?.name ||
-              (file.uploader?.kind === 'user' ? '로그인 계정' : '비로그인 기기')
-            }}</span
+            <span
+              >[{{
+                file.uploader?.name ||
+                (file.uploader?.kind === 'user' ? '로그인 계정' : '비로그인 기기')
+              }}]</span
             ><code>{{ file.path.split('/')[0] }}</code>
           </div>
           <div class="admin-file-info">
-            <Globe :size="15" /><span>최근 접속 지역 · {{ region(file.lastLocation) }}</span
+            <Globe :size="15" /><span>접속 지역 · {{ region(file.lastLocation) }}</span
             ><code>{{ file.lastLocation?.ip || 'IP 확인 불가' }}</code>
           </div>
           <footer>
-            <small>보관 만료 · {{ date(file.expiresAt) }}까지</small
+            <small>[보관 만료] {{ date(file.expiresAt) }}{{ file.expiresAt ? ' 까지' : '' }}</small
             ><button class="text-button admin-delete" :disabled="busy" @click="confirm(file)">
               <Trash2 :size="16" />원본 삭제
             </button>
@@ -307,19 +297,48 @@ onMounted(async () => {
               required
               :disabled="busy" /></label
           ><label
-            >전체 파일 저장 한도 (GiB)<input
+            >전체 파일 저장 한도 (GB)<input
               v-model="capacity"
               type="number"
-              min="1"
-              max="1024"
+              min="1.1"
+              max="1099.5"
               step="any"
               required
               :disabled="busy"
           /></label>
         </div>
         <p class="admin-muted">
-          기기·개인별 한도와 디스크 최소 여유 공간도 함께 적용합니다. 한도를 줄여도 기존 파일은
-          삭제하지 않습니다.
+          전체 한도는 모든 사용자가 올린 원본 파일과 업로드 예약을 합친 용량입니다. 개인마다 이
+          용량을 배정하는 것은 아닙니다.
+        </p>
+        <dl class="admin-limit-details">
+          <div>
+            <dt>로그인 보관함</dt>
+            <dd>계정당 {{ size(overview.limits.accountBytes) }} · 임시 저장과 받은 파일 합산</dd>
+          </div>
+          <div>
+            <dt>기기 전송 업로드</dt>
+            <dd>
+              기기 세션당 {{ size(overview.limits.deviceBytes) }} · 로그인 여부와 관계없이 적용
+            </dd>
+          </div>
+          <div>
+            <dt>기기 전송 업로드 전체</dt>
+            <dd>모든 기기 세션 합계 {{ size(overview.limits.devicesTotalBytes) }}</dd>
+          </div>
+          <div>
+            <dt>파일 한 개</dt>
+            <dd>최대 {{ size(overview.limits.perFileBytes) }}</dd>
+          </div>
+          <div>
+            <dt>NAS 최소 여유 공간</dt>
+            <dd>업로드 예약을 반영해 {{ size(overview.limits.minDiskFreeBytes) }} 이상 확보</dd>
+          </div>
+        </dl>
+        <p class="admin-muted">
+          전체·기기 업로드 한도나 NAS 여유 공간이 부족하면 새 업로드를 거절합니다. 로그인 보관함이
+          가득 차면 수신·다운로드는 진행하고 받은 항목에 저장하지 않습니다. 한도를 줄여도 기존
+          파일은 삭제하지 않습니다.
         </p>
         <label
           >차단할 국가 코드<input