게시물 Export ZIP 생성 연결 v1.5.22

pages/admin/settings/index.vue

@@ -180,6 +180,24 @@ const hasActivePostExportJobs = computed(() => normalizedPostExportJobs.value.so
   job.status === 'queued' || job.status === 'processing'
 )))
 
+/**
+ * 게시물 export 요청 버튼 활성 가능 여부
+ * @returns {boolean} 활성 가능 여부
+ */
+const canRequestPostExport = computed(() => !requestingPostExport.value && !hasActivePostExportJobs.value)
+
+/**
+ * 게시물 export 요청 버튼 안내 문구
+ * @returns {string} 안내 문구
+ */
+const postExportRequestTitle = computed(() => {
+  if (hasActivePostExportJobs.value) {
+    return '진행 중인 Export 작업이 끝난 뒤 새 요청을 만들 수 있습니다.'
+  }
+
+  return '게시물 Export 작업을 요청합니다.'
+})
+
 /**
  * export 상태 라벨 조회
  * @param {string} status - export 상태
@@ -273,7 +291,7 @@ const getPostExportProgressDescription = (job) => {
   }
 
   if (job.status === 'queued') {
-    return '작업 대기열에 등록되었습니다. 생성 워커가 시작되면 진행 숫자가 갱신됩니다.'
+    return '작업 대기열에 등록되었습니다. 곧 파일 생성이 시작됩니다.'
   }
 
   if (job.status === 'processing') {
@@ -461,7 +479,7 @@ const showToast = (type, message) => {
  * @returns {Promise<void>}
  */
 const requestPostExport = async () => {
-  if (requestingPostExport.value) {
+  if (!canRequestPostExport.value) {
     return
   }
 
@@ -487,6 +505,13 @@ const requestPostExport = async () => {
   }
 }
 
+/**
+ * Export 파일 다운로드 URL을 만든다.
+ * @param {Object} file - Export 파일
+ * @returns {string} 다운로드 URL
+ */
+const getPostExportDownloadUrl = (file) => `/admin/api/posts/export-jobs/${file.id}/download`
+
 /**
  * 로고 파일 선택창을 연다.
  * @returns {void}
@@ -1813,10 +1838,11 @@ onBeforeUnmount(() => {
               <button
                 class="admin-settings-screen__export-request inline-flex h-10 shrink-0 cursor-pointer items-center justify-center rounded-md bg-[#15171a] px-4 text-sm font-semibold text-white transition hover:bg-black disabled:cursor-not-allowed disabled:bg-[#c7cdd4]"
                 type="button"
-                :disabled="requestingPostExport"
+                :disabled="!canRequestPostExport"
+                :title="postExportRequestTitle"
                 @click="requestPostExport"
               >
-                {{ requestingPostExport ? '요청 중...' : 'Export 요청' }}
+                {{ requestingPostExport ? '요청 중...' : hasActivePostExportJobs ? 'Export 진행 중' : 'Export 요청' }}
               </button>
             </div>
 
@@ -1909,12 +1935,20 @@ onBeforeUnmount(() => {
                           {{ file.postStart }}-{{ file.postEnd }} · {{ formatExportFileSize(file.fileSizeBytes) }}
                         </p>
                       </div>
+                      <a
+                        v-if="file.status === 'ready' && file.filePath"
+                        class="inline-flex h-8 cursor-pointer items-center justify-center rounded border border-[#15171a] bg-[#15171a] px-3 text-xs font-semibold text-white transition hover:bg-black"
+                        :href="getPostExportDownloadUrl(file)"
+                      >
+                        다운로드
+                      </a>
                       <button
+                        v-else
                         class="inline-flex h-8 cursor-not-allowed items-center justify-center rounded border border-[#e1e5ea] px-3 text-xs font-semibold text-[#a6b0bb]"
                         type="button"
                         disabled
                       >
-                        다운로드 대기
+                        {{ file.status === 'processing' ? '생성 중' : file.status === 'failed' ? '실패' : '다운로드 대기' }}
                       </button>
                     </div>
                   </div>