Commit 348528a4faca5c66d5f1f0aab528bdc7186c1ae5

Authored by 史婷婷
1 parent 190a9c1d

feat: 文件下载功能-安卓微信是赋值链接浏览器打开&其他是点击直接下载

1 import request from '@/utils/request' 1 import request from '@/utils/request'
2 -import { ContentTypeEnum } from '@/utils/httpEnum';  
3 import config from '@/config' 2 import config from '@/config'
4 import { getToken } from '@/utils/auth' 3 import { getToken } from '@/utils/auth'
5 4
@@ -32,6 +31,20 @@ export function uploadFileApi(data) { @@ -32,6 +31,20 @@ export function uploadFileApi(data) {
32 } 31 }
33 32
34 /** 33 /**
  34 + * 下载文件通用接口
  35 + * @param id
  36 + */
  37 +export function downloadFileApi(id) {
  38 + return request({
  39 + url: `/download/security/url`,
  40 + method: 'get',
  41 + params: {
  42 + id
  43 + },
  44 + })
  45 +}
  46 +
  47 +/**
35 * 回去城市接口 省市区 一次性返回 48 * 回去城市接口 省市区 一次性返回
36 */ 49 */
37 export function selectorCityApi() { 50 export function selectorCityApi() {
@@ -63,4 +76,4 @@ export function generateCodeApi(type) { @@ -63,4 +76,4 @@ export function generateCodeApi(type) {
63 type 76 type
64 }, 77 },
65 }) 78 })
66 -}  
  79 +}
@@ -32,9 +32,9 @@ @@ -32,9 +32,9 @@
32 <view class="row"><text class="label">经营年限</text><text class="value">{{ form.businessYears }}</text></view> 32 <view class="row"><text class="label">经营年限</text><text class="value">{{ form.businessYears }}</text></view>
33 <view class="row"><text class="label">单位地址</text><text class="value">{{ form.companyAddress }}</text></view> 33 <view class="row"><text class="label">单位地址</text><text class="value">{{ form.companyAddress }}</text></view>
34 <view class="row"><text class="label">经营范围</text><text class="value">{{ form.businessScope }}</text></view> 34 <view class="row"><text class="label">经营范围</text><text class="value">{{ form.businessScope }}</text></view>
35 - <view class="row"><text class="label">工商信息</text><text class="value act">{{ form.businessFileName }}</text> 35 + <view class="row"><text class="label">工商信息</text><text class="value act" style="color: #2979ff;" @click="downloadFile(form.businessFileId, form.businessFileName)">{{ form.businessFileName }}</text>
36 </view> 36 </view>
37 - <view class="row"><text class="label">股东信息</text><text class="value act">{{ form.shareholderFileName }}</text> 37 + <view class="row"><text class="label">股东信息</text><text class="value act" style="color: #2979ff;" @click="downloadFile(form.shareholderFileId, form.shareholderFileName)">{{ form.shareholderFileName }}</text>
38 </view> 38 </view>
39 </view> 39 </view>
40 40
@@ -174,6 +174,7 @@ @@ -174,6 +174,7 @@
174 <script> 174 <script>
175 import { getDetailApi, getByIdCreditHistoryList, cancelApi } from '@/api/credit_manage.js' 175 import { getDetailApi, getByIdCreditHistoryList, cancelApi } from '@/api/credit_manage.js'
176 import { getDicName } from '@/utils/dic.js' 176 import { getDicName } from '@/utils/dic.js'
  177 +import { downloadFile } from '@/utils/downloadFile.js'
177 import { getDicByCodeApi } from '@/api/base.js' 178 import { getDicByCodeApi } from '@/api/base.js'
178 import CorePersonnel from './corePersonnel.vue' 179 import CorePersonnel from './corePersonnel.vue'
179 import DetailButtons from '@/components/detail-buttons/index.vue' 180 import DetailButtons from '@/components/detail-buttons/index.vue'
@@ -294,6 +295,14 @@ export default { @@ -294,6 +295,14 @@ export default {
294 const query = '?id=' + encodeURIComponent(id) 295 const query = '?id=' + encodeURIComponent(id)
295 uni.navigateTo({ url: '/pages/credit_manage/history_detail' + query }) 296 uni.navigateTo({ url: '/pages/credit_manage/history_detail' + query })
296 }, 297 },
  298 + /**
  299 + * 下载文件通用方法
  300 + * @param id
  301 + * @param fileName
  302 + */
  303 + // async handleDownloadFile(id, fileName) {
  304 + // downloadFile(id, fileName)
  305 + // },
297 handleButtonClick(btn) { 306 handleButtonClick(btn) {
298 if (!btn || btn.disabled) return 307 if (!btn || btn.disabled) return
299 const map = { 308 const map = {
@@ -350,6 +359,7 @@ export default { @@ -350,6 +359,7 @@ export default {
350 }) 359 })
351 }, 360 },
352 getDicName, 361 getDicName,
  362 + downloadFile,
353 getCategoryClass(categoryName) { 363 getCategoryClass(categoryName) {
354 if (!categoryName) return '' 364 if (!categoryName) return ''
355 if (categoryName.includes('A') || categoryName.includes('a')) { 365 if (categoryName.includes('A') || categoryName.includes('a')) {
  1 +
  2 +import { downloadFileApi } from '@/api/base.js'
  3 +import { getToken } from '@/utils/auth.js'
  4 +
  5 +/**
  6 + * 下载文件通用方法
  7 + * @param id
  8 + * @param fileName
  9 + */
  10 +export async function downloadFile(id, fileName) {
  11 + if (!id) return
  12 + uni.showLoading({ title: '下载中' })
  13 + try {
  14 + const res = await downloadFileApi(id);
  15 + console.log('downloadFileApi__res', res)
  16 + let url = res.data
  17 + if (url) {
  18 + // #ifdef H5
  19 + // H5环境(包括微信、钉钉等)直接跳转可能不带header,需要把token拼接到url上
  20 + const token = getToken()
  21 + if (token) {
  22 + const separator = url.includes('?') ? '&' : '?'
  23 + url = `${url}${separator}X-Auth-Token=${token}`
  24 + }
  25 + // #endif
  26 +
  27 + // 统一使用 uni.downloadFile 下载,解决微信浏览器“在浏览器打开”的提示问题
  28 + uni.downloadFile({
  29 + url,
  30 + success: (res) => {
  31 + if (res.statusCode === 200) {
  32 + const filePath = res.tempFilePath
  33 +
  34 + // #ifdef H5
  35 + const ua = navigator.userAgent.toLowerCase()
  36 + const isAndroid = ua.indexOf('android') > -1 || ua.indexOf('adr') > -1
  37 + const isWeChat = ua.indexOf('micromessenger') !== -1
  38 +
  39 + if (isWeChat && isAndroid) {
  40 + // 安卓微信环境:提示用户去浏览器下载
  41 + // 注意:Blob URL在外部浏览器无法访问,所以这里必须使用原始的 url (带token)
  42 + // 重新构建带token的原始url
  43 + let downloadUrl = url
  44 + // 这里我们假设 url 变量在上面已经被处理过(拼接了token),如果没有,重新拼接
  45 + if (!downloadUrl.includes('X-Auth-Token')) {
  46 + const token = getToken()
  47 + if (token) {
  48 + const separator = downloadUrl.includes('?') ? '&' : '?'
  49 + downloadUrl = `${downloadUrl}${separator}X-Auth-Token=${token}`
  50 + }
  51 + }
  52 +
  53 + uni.showModal({
  54 + title: '提示',
  55 + content: '微信环境下不支持直接下载,请复制链接后在浏览器打开下载',
  56 + confirmText: '复制链接',
  57 + showCancel: false,
  58 + success: function (res) {
  59 + if (res.confirm) {
  60 + uni.setClipboardData({
  61 + data: downloadUrl,
  62 + success: function () {
  63 + uni.showToast({ title: '链接已复制', icon: 'success' })
  64 + }
  65 + })
  66 + }
  67 + }
  68 + })
  69 + } else {
  70 + // 其他环境(iOS微信、普通浏览器)使用a标签下载
  71 + const link = document.createElement('a')
  72 + link.href = filePath
  73 + link.download = fileName || 'download'
  74 + document.body.appendChild(link)
  75 + link.click()
  76 + document.body.removeChild(link)
  77 + }
  78 + // #endif
  79 +
  80 + // #ifndef H5
  81 + const fileType = fileName ? fileName.substring(fileName.lastIndexOf('.') + 1).toLowerCase() : ''
  82 + uni.openDocument({
  83 + filePath,
  84 + fileType: fileType || undefined,
  85 + showMenu: true,
  86 + success: function () {
  87 + console.log('打开文档成功')
  88 + },
  89 + fail: function (err) {
  90 + console.error('打开文档失败', err)
  91 + uni.showToast({ title: '无法打开此文件', icon: 'none' })
  92 + }
  93 + })
  94 + // #endif
  95 + } else {
  96 + uni.showToast({ title: '下载失败', icon: 'none' })
  97 + }
  98 + },
  99 + fail: (err) => {
  100 + console.error('下载失败', err)
  101 + uni.showToast({ title: '下载失败', icon: 'none' })
  102 + }
  103 + })
  104 + } else {
  105 + uni.showToast({ title: '文件地址无效', icon: 'none' })
  106 + }
  107 + } catch (e) {
  108 + console.error(e)
  109 + uni.showToast({ title: '下载出错', icon: 'none' })
  110 + } finally {
  111 + uni.hideLoading()
  112 + }
  113 +}