feat: 一些调整

global.types/components.d.ts

@@ -53,5 +53,6 @@ declare module 'vue' {
   }
   export interface GlobalDirectives {
     vInfiniteScroll: typeof import('element-plus/es')['ElInfiniteScroll']
+    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
   }
 }

src/views/engineering/config/index.vue

@@ -43,7 +43,12 @@
           <el-button v-if="activeStep > 0" @click="prevStep" :icon="ArrowLeft"
             >上一步</el-button
           >
-          <el-button v-if="activeStep < 2" type="primary" @click="nextStep">
+          <el-button
+            v-if="activeStep < 2"
+            type="primary"
+            @click="nextStep"
+            :loading="nextStepLoading"
+          >
             下一步<el-icon class="el-icon--right"><ArrowRight /></el-icon>
           </el-button>
           <el-button
@@ -52,14 +57,18 @@
             @click="handleFinish"
             :icon="Check"
             :loading="loading"
-            >完成</el-button
+            >保存配置</el-button
           >
         </div>
       </div>
     </div>
 
     <div class="flex-1 overflow-hidden flex flex-col">
-      <div class="flex-1 overflow-hidden p-6">
+      <div
+        class="flex-1 overflow-hidden p-6"
+        v-loading="pageLoading"
+        loading-text="加载中..."
+      >
         <transition name="fade" mode="out-in">
           <keep-alive>
             <component
@@ -199,7 +208,10 @@ const prevStep = async () => {
   }
 }
 
+const nextStepLoading = ref(false)
+
 const nextStep = async () => {
+  nextStepLoading.value = true
   const index = steps.indexOf(currentStep.value)
   if (currentStep.value === 'channel') {
     await saveChannelList()
@@ -207,12 +219,16 @@ const nextStep = async () => {
 
   if (currentComponentRef.value?.checkBeforeLeave) {
     const canLeave = await currentComponentRef.value.checkBeforeLeave()
-    if (!canLeave) return
+    if (!canLeave) {
+      nextStepLoading.value = false
+      return
+    }
   }
 
   if (index < steps.length - 1) {
     currentStep.value = steps[index + 1]
   }
+  nextStepLoading.value = false
 }
 
 /*
@@ -288,11 +304,13 @@ async function loadDeviceList() {
   if (isObject(res.data)) devices.value = res.data
 }
 
+const pageLoading = ref(true)
 onMounted(async () => {
   if (!isCreate.value) {
     await loadChannelList()
     await loadDeviceList()
     await loadCategoryList()
+    pageLoading.value = false
   }
 })
 </script>

src/views/engineering/index.vue

@@ -82,18 +82,43 @@ function enterEngineering(item: IEngineeringOV) {
   })
 }
 
-function handleDownload(item: IEngineeringOV) {
+// function handleDownload(item: IEngineeringOV) {
+//   if (!item.downloadPath) {
+//     ElMessage.warning('下载地址为空')
+//     return
+//   }
+//   const link = document.createElement('a')
+//   link.style.display = 'none'
+//   link.href = item.downloadPath
+//   link.setAttribute('download', item.name)
+//   document.body.appendChild(link)
+//   link.click()
+//   document.body.removeChild(link)
+// }
+
+async function handleDownload(item: IEngineeringOV) {
   if (!item.downloadPath) {
-    ElMessage.warning('下载地址为空')
+    ElMessage.warning('请完成工程配置!')
     return
   }
+  try {
+    const res = await fetch(item.downloadPath)
+    if (!res.ok) {
+      throw new Error('Network response was not ok')
+    }
+    const blob = await res.blob()
     const link = document.createElement('a')
     link.style.display = 'none'
-  link.href = item.downloadPath
-  link.setAttribute('download', item.name)
+    link.href = URL.createObjectURL(blob)
+    link.download = item.name
     document.body.appendChild(link)
     link.click()
     document.body.removeChild(link)
+    URL.revokeObjectURL(link.href)
+  } catch (error) {
+    ElMessage.error('下载失败，请检查网络或联系管理员')
+    console.error('Download failed:', error)
+  }
 }
 </script>