完成系统备份功能测试阶段

src/stores/modules/backup.ts

@@ -15,10 +15,14 @@ export const useBackupStore = defineStore('backup', {
         progress: 0
       },
       reductionBackup: {
+        // 上传状态
         status: false,
+        // 还原状态
         reductionStatus: false,
+        // 上传进度
         progress: 0,
-        reductionProgress: 0
+        // 还原进度
+        reductionProgress: undefined
       } as any
     }
   },
@@ -39,12 +43,14 @@ export const useBackupStore = defineStore('backup', {
       this.backup.progress = parseFloat(progress.toFixed(2))
     },
     async setReductionProgress(tenantId: string) {
-      const progress: any = await reductionProgress({ tenantId })
-      if (progress == 100) {
+      let progress: any = await reductionProgress({ tenantId })
+      if (progress == 0) progress = undefined
+      if (progress < 100 && progress != undefined) {
         this.reductionBackup.reductionStatus = true
       } else {
         this.reductionBackup.reductionStatus = false
       }
+      if (progress != undefined)
         this.reductionBackup.reductionProgress = parseFloat(progress.toFixed(2))
     },
     setDownloadBackupProgress(progress: number) {
@@ -54,10 +60,12 @@ export const useBackupStore = defineStore('backup', {
       this.downloadBackup.status = status
     },
     setReductionBackupProgress(progress: any, type: number = 1) {
+      // type 0 上传 1 还原
       if (type) this.reductionBackup.progress = progress
       else this.reductionBackup.reductionProgress = progress
     },
     setReductionBackupStatus(status: boolean, type: number = 1) {
+      // type 0 上传 1 还原
       if (type) this.reductionBackup.status = status
       else this.reductionBackup.reductionStatus = status
     }

src/views/systemBackup/index.vue

@@ -18,7 +18,7 @@
         <el-button type="primary" size="small" :disabled="backup.status" @click="handleBackup"
           >系统备份</el-button
         >
-        <div v-if="backup.status" style="margin-top: 20px">
+        <div v-show="backup.status" style="margin-top: 20px">
           <el-link type="primary" :underline="false" style="margin-bottom: 10px">备份进度</el-link>
           <el-progress :percentage="backup.progress" striped striped-flow :duration="10" />
         </div>
@@ -150,7 +150,7 @@ const handleBackup = () => {
       backupStore.backup.progress = undefined
       axios
         .get(`/admin/api/docker/backSystem?tenantId=${tenantId.value}`, { timeout: 5000 })
-        .catch((err) => {
+        .catch(() => {
           backupStore.setDownloadProgress(tenantId.value)
           startPolling(3000)
         })
@@ -184,23 +184,17 @@ const handleDownBackup = () => {
 
 const startPolling = (interval: number) => {
   const checkProgress = () => {
-    if (backup.value.progress === 100) {
-      //   ElMessage({
-      //     type: 'success',
-      //     message: '备份成功'
-      //   })
+    if (backup.value.progress == 100 || backup.value.progress == 0) {
       stopPolling()
       return true // 表示已完成
-    } else if (backup.value.progress === 0) {
-      stopPolling()
-      return true // 表示未开始
     }
+    stopPolling()
     return false // 表示尚未完成
   }
 
   const poll = () => {
     backupStore.setDownloadProgress(tenantId.value)
-    console.log('🚀 ~ startPolling ~ backup.value.progress:', backup.value.progress)
+    // console.log('🚀 ~ startPolling ~ backup.value.progress:', backup.value.progress)
     if (!checkProgress()) {
       polling.value = setTimeout(poll, interval)
     }
@@ -216,26 +210,19 @@ const stopPolling = () => {
 
 const startReductionPolling = (interval: number) => {
   const checkProgress = () => {
-    if (reductionBackup.value.reductionProgress === 100) {
-      //   ElMessage({
-      //     type: 'success',
-      //     message: '还原成功'
-      //   })
+    if (
+      reductionBackup.value.reductionProgress >= 100 ||
+      reductionBackup.value.reductionProgress == undefined
+    ) {
       stopReductionPolling()
       return true // 表示已完成
-    } else if (reductionBackup.value.reductionProgress === 0) {
-      stopReductionPolling()
-      return true // 表示未开始
     }
+
     return false // 表示尚未完成
   }
 
   const poll = () => {
     backupStore.setReductionProgress(tenantId.value)
-    console.log(
-      '🚀 ~ startPolling ~ backup.value.progress:',
-      reductionBackup.value.reductionProgress
-    )
     if (!checkProgress()) {
       polling.value = setTimeout(poll, interval)
     }
@@ -244,6 +231,13 @@ const startReductionPolling = (interval: number) => {
 }
 
 const stopReductionPolling = () => {
+  console.log('停止还原系统')
+  // 已经上传完成了,更新上传进度
+  backupStore.setReductionBackupProgress(0, 1)
+  backupStore.setReductionBackupStatus(false, 1)
+  // 开始还原进度
+  backupStore.setReductionBackupProgress(0, 0)
+  backupStore.setReductionBackupStatus(false, 0)
   clearTimeout(reductionPolling.value)
 }
 
@@ -289,10 +283,24 @@ const handleSelectFile = async () => {
   const { data } = await axios.get(
     `/admin/api/docker/revertSystemCheck?tenantId=${tenantStore.getTenantId}`
   )
-  if (data.code === 200) return handleReductionPolling()
+  if (data.code === 200)
+    ElMessageBox.confirm('确认还原此系统？', '提示', {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning'
+    }).then(() => {
+      axios
+        .get(`/admin/api/docker/revertSystem?tenantId=${tenantId.value}`, { timeout: 5000 })
+        .catch(() => {
+          backupStore.setReductionProgress(tenantId.value)
+          setTimeout(() => {
+            handleReductionPolling()
+          }, 3000)
+        })
+    })
   else if (data.code === 201) uploadRef.value.click()
   else if (data.code === 202)
-    return ElMessage.warning('当前环境已经部署，如果要还原，请先清空当前环境docker的容器与镜像！')
+    ElMessage.warning('当前环境已经部署，如果要还原，请先清空当前环境docker的容器与镜像！')
 }
 
 const handleFileChange = (event: any) => {
@@ -377,7 +385,14 @@ const mergeChunks = async () => {
       params: { tenantId: tenantStore.getTenantId }
     })
     if (response.data.code == 200) {
+      axios
+        .get(`/admin/api/docker/revertSystem?tenantId=${tenantId.value}`, { timeout: 5000 })
+        .catch((err) => {
+          backupStore.setReductionProgress(tenantId.value)
+          setTimeout(() => {
             handleReductionPolling()
+          }, 3000)
+        })
       ElMessage.success('文件上传成功')
     }
     console.log('Merge response:', response.data)
@@ -387,15 +402,18 @@ const mergeChunks = async () => {
 }
 
 const handleReductionPolling = () => {
-  backupStore.setReductionBackupProgress(100)
+  if (
+    reductionBackup.value.reductionProgress == undefined ||
+    reductionBackup.value.reductionProgress >= 100
+  )
+    return
+  // 已经上传完成了,更新上传进度
+  backupStore.setReductionBackupProgress(100, 1)
   backupStore.setReductionBackupStatus(true, 1)
-  backupStore.setReductionBackupStatus(true, 0)
+  // 开始还原进度
   backupStore.setReductionBackupProgress(0, 0)
-  axios
-    .get(`/admin/api/docker/revertSystem?tenantId=${tenantId.value}`, { timeout: 3000 })
-    .catch((err) => {
+  backupStore.setReductionBackupStatus(true, 0)
   startReductionPolling(5000)
-    })
 }
 
 const delay = (ms: number) => {
@@ -403,19 +421,22 @@ const delay = (ms: number) => {
 }
 
 onBeforeRouteLeave(() => {
+  console.log('切换离开页面了')
   if (backup.value.status) stopPolling()
-  stopReductionPolling()
+  if (reductionBackup.value.reductionStatus) stopReductionPolling()
 })
 
-const init = () => {
+// onBeforeUnmount(() => {
+//   console.log('卸载了当前页面')
+//   if (backup.value.status) stopPolling()
+//   if (reductionBackup.value.reductionStatus) stopReductionPolling()
+// })
+
+const init = async () => {
   backupStore.setDownloadProgress(tenantId.value)
   if (backup.value.progress != 100 && backup.value.progress != 0) startPolling(3000)
   backupStore.setReductionProgress(tenantId.value)
-  if (
-    reductionBackup.value.reductionProgress != 100 &&
-    reductionBackup.value.reductionProgress != 0
-  )
-    handleReductionPolling()
+  if (reductionBackup.value.reductionProgress <= 100) handleReductionPolling()
   loading.value = false
 }