导出添加等待效果

src/views/mediaLibrary/exportDialog.vue

@@ -74,6 +74,7 @@
 import { onMounted, ref } from 'vue';
 import { mediaExcelBaseField, mediaExcelPriceField, exportMediaExcel } from "@/api/mediaLibrary"
 
+const { proxy } = getCurrentInstance()
 const activeIndex = ref(0)
 const ToolOptions = ref(['优势报价', '门禁', '候车厅', '道闸', '地铁', '高铁', '写字楼', '车库灯箱'])
 const exportTitle = ref('导出')
@@ -1359,17 +1360,17 @@ const handleCheckedBaseFieldChange = (value) => {
     baseFieldIsIndeterminate.value = checkedCount > 0 && checkedCount < baseFields.value.length
 }
 // 报价字段全选操作
-const handleCheckAllPriceFieldChange = (val) => { 
+const handleCheckAllPriceFieldChange = (val) => {
     checkedPriceFields.value = []
     if (val) {
         priceFields.value.forEach(element => {
             checkedPriceFields.value.push(element.propertyPath)
         });
 
-        if (ToolOptions.value.length == 8) { 
+        if (ToolOptions.value.length == 8) {
             // 查找指定类型的报价字段
             let curPriceFields = exportForm.value.mediaTypeExport.filter(item => item.type == activeIndex.value);
-            if (curPriceFields.length > 0) { 
+            if (curPriceFields.length > 0) {
                 curPriceFields[0].exportPriceFields = [...checkedPriceFields.value] // 使用数组索引
             }
         }
@@ -1380,13 +1381,13 @@ const handleCheckAllPriceFieldChange = (val) => {
                 curPriceFields[0].exportPriceFields = [...checkedPriceFields.value] // 使用数组索引
             }
         }
-        if (ToolOptions.value.length == 0) { 
+        if (ToolOptions.value.length == 0) {
             // 查找指定类型的报价字段
             let curPriceFields = exportForm.value.mediaTypeExport.filter(item => item.type == 0);
-            if (curPriceFields.length > 0) { 
+            if (curPriceFields.length > 0) {
                 curPriceFields[0].exportPriceFields = [...checkedPriceFields.value] // 使用数组索引
             }
-        } 
+        }
     } else {
         if (ToolOptions.value.length == 8) {
             // 查找指定类型的报价字段
@@ -1407,14 +1408,14 @@ const handleCheckAllPriceFieldChange = (val) => {
             if (curPriceFields.length > 0) {
                 curPriceFields[0].exportPriceFields = []
             }
-        } 
+        }
     }
     priceFieldIsIndeterminate.value = false
     // 更新选择状态
     checkPriceFieldSelectStatus()
 }
 // 单个选择报价字段
-const handleCheckedPriceFieldChange = (value) => { 
+const handleCheckedPriceFieldChange = (value) => {
     const checkedCount = value.length
     priceFieldCheckAll.value = checkedCount === priceFields.value.length
     priceFieldIsIndeterminate.value = checkedCount > 0 && checkedCount < priceFields.value.length
@@ -1457,7 +1458,11 @@ const handleClick = (tab, event) => {
 const handleSubmitExport = () => {
     exportForm.value.exportBaseFields = checkedBaseFields
     exportForm.value.mediaTypeExport = exportForm.value.mediaTypeExport.filter(item => item.exportPriceFields.length > 0)
-    exportMediaExcel(exportForm.value).then(res => {
+
+    proxy.$modal.loading(`正在执行导出，请耐心等待...`)
+
+    exportMediaExcel(exportForm.value).then(res => { 
+        proxy.$modal.closeLoading()
         const downLoadName = '媒体信息_' + getCurrentTime() + '.xlsx'
         // 通过a标签打开新页面下载文件
         const a = document.createElement('a')
@@ -1524,9 +1529,9 @@ const handleCheckPriceField = (_mediaType) => {
     // 获取当前的所有要导出的报价字段
     const currentMediaTypeExport = [...exportForm.value.mediaTypeExport]; // 创建副本以避免直接修改原数组  
     // 过滤掉指定类型的旧数据
-    const filteredFields = currentMediaTypeExport.filter(item => item.type !== _mediaType); 
+    const filteredFields = currentMediaTypeExport.filter(item => item.type !== _mediaType);
     // 判断是否有指定类型数据
-    const _mediaTypeArr = currentMediaTypeExport.filter(item => item.type == _mediaType); 
+    const _mediaTypeArr = currentMediaTypeExport.filter(item => item.type == _mediaType);
     // 如果数据不存在
     if (_mediaTypeArr.length == 0) {
         filteredFields.push({ type: _mediaType, exportPriceFields: [] }); // 使用 push 追加新文件
@@ -1553,7 +1558,7 @@ const handleChangeType = (_type) => {
         if (curPriceFields.length > 0) {
             currentCheckedFields = [...curPriceFields[0].exportPriceFields]
         }
-    } 
+    }
 
     if (ToolOptions.value.length == 8) {
         switch (_type) {
@@ -1623,7 +1628,7 @@ const handleChangeType = (_type) => {
                 checkedPriceFields.value = currentCheckedFields
                 break;
         }
-        let wlType = _type + 1 
+        let wlType = _type + 1
         handleCheckPriceField(wlType)
     }
 

src/views/mediaLibrary/exportPPTDialog.vue

@@ -40,6 +40,7 @@
 import { onMounted, ref } from 'vue';
 import { mediaPPTField, exportMediaPPT } from "@/api/mediaLibrary"
 
+const { proxy } = getCurrentInstance()
 const exportTitle = ref('导出PPT')
 const exportOpen = ref(false)
 // 已选媒体
@@ -154,7 +155,7 @@ const pptFields = ref([
     {
         displayName: "作废原因",
         propertyPath: "invalidReason"
-    } 
+    }
 ])
 
 
@@ -190,7 +191,10 @@ const handleCheckedPPTFieldChange = (value) => {
 // 导出ppt实现代码
 const handleSubmitExportPPT = () => {
     exportForm.value.exportFields = checkedPPTFields
+
+    proxy.$modal.loading(`正在执行导出，请耐心等待...`)
     exportMediaPPT(exportForm.value).then(res => {
+        proxy.$modal.closeLoading()
         const downLoadName = '媒体信息_' + getCurrentTime() + '.pptx'
         // 通过a标签打开新页面下载文件
         const a = document.createElement('a')

src/views/mediaLibrary/mediaForm.vue

@@ -1032,7 +1032,8 @@ const getSupplierInfo = () => {
 const getMediaInfo = () => {
     mediaDetail({ mediaId: ruleForm.value.id }).then(res => {
         ruleForm.value = res.data
-        mediaFile.value = ruleForm.value.mediaFile
+        mediaFile.value = res.data.mediaFile
+        mediaPrice.value = res.data.mediaPrices
         ruleForm.value.mediaCity = ruleForm.value.provinceName + '/' + ruleForm.value.cityName + '/' + ruleForm.value.areaName + '/' + ruleForm.value.townName
         if (ruleForm.value.mapY && ruleForm.value.mapX) latVal.value = ruleForm.value.mapY + ',' + ruleForm.value.mapX
         if (ruleForm.value.belongSupplierId) getSupplierInfo()