我的报告增加下载

src/components/reportPdf/index2.vue

@@ -8,6 +8,7 @@
                 </div>
             </div>
             <div class="c_footer adfac">
+                <el-button type="primary" @click="download">下载</el-button>
                 <el-button type="defalut" @click="cancel">关闭</el-button>
             </div>
         </div>
@@ -26,16 +27,64 @@
             type: Object,
             default: () => {}
         },
+        pdfFileUrl: {
+            type: String,
+            default: ''
+        },
+        pdfReportName: {
+            type: String,
+            default: ''
+        }
     })
 
-    import { ref, onMounted } from 'vue'
+    import { ref, getCurrentInstance, onMounted } from 'vue'
+    const { proxy } = getCurrentInstance();
     const reportData = ref(props.reportData);
     const isMajor = ref(props.isMajor)
 
-    const emit = defineEmits(['cancel']);
+    const emit = defineEmits(['cancel','download']);
     const cancel = () => {
         emit('cancel');
     }
+    const download = () => {
+        if(!props.pdfFileUrl) proxy.$message.error('该报告未在微信小程序端生成，请生成后再下载！');
+        downloadPdfWithBlob(props.pdfFileUrl)
+    }
+    const downloadPdfWithBlob = async (pdfUrl) => {
+        if(!pdfUrl) {
+            proxy.$message.error('该报告未在微信小程序端生成，请生成后再下载！');
+            return;
+        }
+        
+        const loadingInstance = proxy.$loading({ text: '正在准备下载，请稍候...' });
+        try {
+            const response = await fetch(pdfUrl);
+            if (!response.ok) {
+                throw new Error(`网络响应错误: ${response.statusText}`);
+            }
+            
+            const blob = await response.blob();
+            const blobUrl = window.URL.createObjectURL(blob);
+            
+            const fileName = props.pdfReportName || pdfUrl.split('/').pop() || '下载的报告';
+            const link = document.createElement('a');
+            link.href = blobUrl;
+            link.setAttribute('download', fileName);
+            document.body.appendChild(link);
+            link.click();
+            document.body.removeChild(link);
+            
+            // 5. 释放创建的临时 URL
+            window.URL.revokeObjectURL(blobUrl);
+
+        } catch (error) {
+            console.error('下载失败:', error);
+            window.open(pdfUrl); // 兜底方案，直接在浏览器中打开链接
+        } finally {
+            // 关闭加载提示
+            loadingInstance.close();
+        }
+    }
     onMounted(() => {
         
     });

src/components/reportPdf/pdfUser2-改版未确定版.vue

@@ -0,0 +1,324 @@
+<template>
+    <div>
+        <!-- 封面 -->
+        <div class="cd_box fm2 adffc" style="border: none;margin-top: 20px;height: 868px;">
+            <img class="fm2-logo" src="@/assets/images/versionTwo/fm_logo.png">
+            <img class="fm2-logo2" src="@/assets/images/versionTwo/fm_logo2.png">
+            <img class="fm2-perill" src="@/assets/images/versionTwo/fm_perill.png">
+            <div class="fm2-line"></div>
+            <div class="fm2-p">团队发展动态评估报告(个人版)</div>
+            <div class="fm2-texts adf">
+                <div class="fm2-texts-pre"><span style="letter-spacing: 6px;">客户公司：</span>{{ reportData?.teamInfo?.enterpriseName }}</div>
+                <div class="fm2-texts-pre"><span style="letter-spacing: 6px;">团队名称：</span>{{ reportData?.teamInfo?.teamName }}</div>
+                <div class="fm2-texts-pre"><span style="letter-spacing: 2.5px;">评估发起人：</span>{{ reportData?.teamInfo?.initiator }}</div>
+                <div class="fm2-texts-pre"><span>报告生成时间：</span>{{ reportData?.teamInfo?.reportDate }}</div>
+            </div>
+        </div>
+        <!-- 介绍 -->
+        <div class="cd_box" style="border: none;">
+            <div class="v2-top adfacjb" :style="{'background-image':'url('+require('@/assets/images/versionTwo/'+'intro'+'_title_bg.png')+')'}">
+                <div class="vt-left" style="color: #FFFFFF;">介绍<span>PERILL模型简介</span></div>
+                <div class="vt-right">PERILL团队发展动态评估报告(个人版)</div>
+            </div>
+            <div class="v2-box">
+                <img class="vb-img1" :src="require('@/assets/images/versionTwo/'+'intro'+'_box_img1.png')">
+                <img class="vb-img2" :src="require('@/assets/images/versionTwo/'+'intro'+'_box_img2.png')">
+                <div class="v2-p">PERILL团队发展动态评估源于团队教练辅导领域的先驱、管理思维与团队绩效领域的权威、全球顶尖团队教练David Clutterbuck教授及其团队通过深入研究，提炼出影响团队绩效的140多个基于实证的因素，整合而成的团队评估和提升工具-PERILL模型。</div>
+                <div class="v2-p" style="margin-top: 8px;">创衡国际基于10多年来在全球与200多家具有前瞻性的国际公司以及国内具有行业代表性公司的合作经验，结合CCMI的PERILL评估工具，在中国推出的团队发展动态评估系统，旨在帮助团队更全面、更有效地从六个维度评估团队的发展现状，为支持团队成为高价值团队提供全景式的客观评估。</div>
+                <div class="v2-p" style="margin-top: 8px;">PERILL团队发展动态评估的主体内容由<span>{{ reportData?.teamInfo?.questionCount }}</span>个关于团队的描述组成。</div>
+            </div>
+            <div class="v2-six">
+                <div class="vsix-title">PERILL六大纬度</div>
+                <div class="vsix-p">PERILL团队发展动态评估提供了一个复杂的团队系统概览，它并非针对孤立的问题，也不是简单的优缺点，而是着眼于团队系统的复杂性。它通过6个影响因素(如下所述)提出问题，以揭示团队系统各要素之间的联系，以及这些联系如何影响团队的高效运作能力。</div>
+                <div class="vsix-boxs">
+                    <div class="vsb adfac" v-for="(item,index) in sixWd" :key="index">
+                        <img class="vsb-img" :src="item.img"/>
+                        <div class="vsb-right">
+                            <div class="vsbr-top adfac">
+                                <div class="vsbrt-type" :style="{'background':item.color}">{{ item.type }}</div>
+                                <div class="vsbrt-title" :style="{'color':item.color}">{{ item.title }}</div>
+                            </div>
+                            <div class="vsbr-desc">{{ item.desc }}</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <!-- 总体评估分析 -->
+        <div class="cd_box adffc" style="border: none;">
+            <div class="v2-top adfacjb" :style="{'background-image':'url('+require('@/assets/images/versionTwo/'+'intro'+'_top_title_bg2.png')+')'}">
+                <div class="vt-left">总体评估分析</div>
+                <div class="vt-right">PERILL团队发展动态评估报告(个人版)</div>
+            </div>
+            <div class="v2-box">
+                <img class="vb-img1" :src="require('@/assets/images/versionTwo/'+'intro'+'_box_img1.png')">
+                <img class="vb-img2" :src="require('@/assets/images/versionTwo/'+'intro'+'_box_img2.png')">
+                <div class="v2-p2">报告的核心是PERILL评估分析下的整体团队表现。这包括团队在PERILL模型每个关键要素上的综合得分，通过结合得分和置信指数，我们能够展示出高功能领域和低功能域。</div>
+                <div class="v2-p2" style="margin-top: 16px;">下面的条形图上的位置标记显示了团队在各个维度上的总分。</div>
+                <div id="ztzdfxRef" style="width: 100%; height: 200px;" class="pdfEchart"></div>
+            </div>
+            <div class="v2-data" style="min-height: 200px;">
+                <div class="vd-title" :style="{'background-image':'url('+require('@/assets/images/versionTwo/'+'intro'+'_title_bg1.png')+')'}">评估结果</div>
+                <div class="v2-p" v-html="(reportData?.totalDiagnosticOutput||'').replaceAll('\n\n','<br>')"></div>
+            </div>
+            <div class="v2-data" style="flex: 1;margin-top: 20px;">
+                <div class="vd-title vt2" :style="{'background-image':'url('+require('@/assets/images/versionTwo/'+'intro'+'_title_bg2.png')+')'}">团队提升&教练建议</div>
+                <div class="v2-p" v-html="(reportData?.totalDiagnosisSuggest||'').replaceAll('\n\n','<br>')"></div>
+            </div>
+        </div>
+        <!-- 多维度 -->
+        <template v-if="reportData?.dimensionAnalysis?.length">
+            <div class="cd_box adffc" style="border: none;" v-for="(n,i) in [[0,2],[2,4],[4,6]]" :key="i">
+                <div class="v2-top" :style="{'background-image':'url('+require('@/assets/images/versionTwo/person_title_bg.png')+')'}"></div>
+                <div v-for="(item,index) in reportData?.dimensionAnalysis.slice(n[0],n[1])" :key="index">
+                    <div class="v2-title2">{{ item.title2||'' }}</div>
+                    <div class="v2-box" :style="{'border':'1px solid '+item.bcolor}">
+                        <div class="v2-p2">{{ item.desc }}</div>
+                        <div class="vb-table" :style="{'border':'1px solid '+item.bcolor,'margin-top':'11px'}">
+                            <div class="vbt-th adfac" :class="{'black':['人际关系','学习'].includes(item.title)}" :style="{'background':item.thcolor}">
+                                <div class="vbtt-w1">主题</div>
+                                <div class="vbtt-w2">同意度</div>
+                                <div class="vbtt-w2">重要性</div>
+                                <div class="vbtt-w2">影响力</div>
+                                <div class="vbtt-w3">问卷陈述 (影响力最低分 - 最高分)</div>
+                            </div>
+                            <div class="vbt-pre adfac" v-for="(ss,si) in item?.scoreSpreads" :key="si">
+                                <div class="vbtp-left vbtt-w1 adfacjc" :class="{'black':['人际关系','学习','内部流程及系统与架构'].includes(item.title)}" :style="{'background':item.titlecolor,'padding':'0 16px'}">{{ ss?.theme }}</div>
+                                <div class="vbtp-num vbtt-w2 vw1" :style="{'border-bottom':'1px solid '+item.bcolor}">{{ ss?.consentScore||0 }}</div>
+                                <div class="vbtp-num vbtt-w2 vw2" :style="{'border-bottom':'1px solid '+item.bcolor}">{{ ss?.importanceScore||0 }}</div>
+                                <div class="vbtp-num vbtt-w2 vw3" :style="{'border-bottom':'1px solid '+item.bcolor}">{{ ss?.impactScore||0 }}</div>
+                                <div class="vbtp-desc" :style="{'border-bottom':'1px solid '+item.bcolor}">
+                                    <div class="vbtpd-title">{{ ss?.question }}</div>
+                                    <div class="xr_tb adfac">
+                                        <div class="xt_pre p1"></div>
+                                        <div class="xt_pre p2"></div>
+                                        <div class="xt_pre p3"></div>
+                                        <div class="xt_score adfac" :style="{'left':ss.left,'width':(((ss.maxScore>25?25:ss.maxScore)-(ss.minScore>25?25:ss.minScore))*4)+'%'}">
+                                            <div class="xts_num adfacjc red">{{ ss.minScore>25?25:ss.minScore }}</div>
+                                            <div class="xts_box"></div>
+                                            <div class="xts_num adfacjc green">{{ ss.maxScore>25?25:ss.maxScore }}</div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </template>
+    </div>
+</template>
+
+<script setup name="">
+    const props = defineProps({
+        reportData:{
+            type: Object,
+            default: () => {}
+        }
+    })
+    import * as echarts from "echarts";
+    import { ref, onMounted, nextTick } from 'vue'
+    const reportData = ref(null);
+    const typeDict = {
+        '宗旨与动机':'zzdj',
+        '外部流程、系统与结构':'wbjg',
+        '人际关系':'rjgx',
+        '内部流程、系统与结构':'nbjg',
+        '学习':'xx',
+        '领导力':'ldl'
+    }
+    const sixWd = ref([
+        {
+            img:require('@/assets/images/versionTwo/intro_img_p.png'),
+            type:'P',
+            title:'宗旨与动机',
+            desc:'指团队共享的目的和存在的意义, 包含对共同的愿景，目标和优先级的清晰度。',
+            color:'#761E6A'
+        },
+        {
+            img:require('@/assets/images/versionTwo/intro_img_e.png'),
+            type:'E',
+            title:'外部流程、系统与结构',
+            desc:'指团队与其外部利益相关者 - 客户，供应商，股东，组织内的其他团队等的互动关联。',
+            color:'#009191'
+        },
+        {
+            img:require('@/assets/images/versionTwo/intro_img_r.png'),
+            type:'R',
+            title:'人际关系',
+            desc:'指团队成员如何共同工作–他们是否相互尊重对方的能力，足够心理安全以能够坦诚相对，真正关心彼此的幸福感。',
+            color:'#FFD750'
+        },
+        {
+            img:require('@/assets/images/versionTwo/intro_img_i.png'),
+            type:'I',
+            title:'内部流程、系统与结构',
+            desc:'指团队如何管理工作流程，互相支持和高质量的沟通和决策（包括工作任务和团队感情）。',
+            color:'#4EB2B2'
+        },
+        {
+            img:require('@/assets/images/versionTwo/intro_img_l.png'),
+            type:'L',
+            title:'学习',
+            desc:'指团队应对多变的环境和保持持续的进步和成长的能力。团队如何提高绩效（如何完成今天的任务）、能力（如何提高技能和资源以处理明天的任务）和容量（长期的愿景， 如何用更少的资源做更多的事情）',
+            color:'#AFCDF5'
+        },
+        {
+            img:require('@/assets/images/versionTwo/intro_img_l2.png'),
+            type:'L',
+            title:'领导力',
+            desc:'指团队认为需要怎样的领导行为能够让他们，作为个人或者团队做到最好。团队可以和他们的领导者讨论他们的责任，以帮助领导者成为他们需要的领导者。',
+            color:'#002846'
+        }
+    ]);
+
+    let chartInstance = null;
+    const initZtzdfxChart = async (reportData) => {
+        let xdata = reportData?.overall?.map(o=>o.dimension)?.reverse()||[];
+        let yvalue = reportData?.overall?.map(o=>o.weightedTotal)?.reverse()||[];
+        let ycolor = [['#771E6A','#771E6A'],['#009191','#009191'],['#FFD750','#FFD750'],['#4EB2B2','#4EB2B2'],['#AFCDF5','#AFCDF5'],['#002846','#002846']].reverse();
+        let yData = yvalue.map((v,i)=>{
+            return {
+                value: v,
+                itemStyle: {
+                    color: new echarts.graphic.LinearGradient(
+                        0, 0, 1, 0,
+                        [
+                            { offset: 0, color: ycolor[i][0] }, 
+                            { offset: 1, color: ycolor[i][1] }
+                        ]
+                    ),
+                    borderRadius: [0, 4, 4, 0]
+                }
+            }
+        })
+
+        chartInstance = echarts.init(document.getElementById(`ztzdfxRef`));
+        let option = {
+            tooltip: {
+                trigger: 'axis',
+                axisPointer: {
+                type: 'shadow'
+                }
+            },
+            legend: {},
+            grid: {
+                left: '2%',
+                right: '10%',
+                bottom: '0%',
+                top: '10%',
+                containLabel: true
+            },
+            xAxis: {
+                type: 'value',
+                boundaryGap: [0, 0.01],
+				splitLine: {
+					show: false
+				},
+                // 隐藏X轴轴线和标签，使图表更干净
+                axisLine: {
+                    show: false
+                },
+                axisLabel: {
+                    show: true,
+                    color: '#193D59',
+                    fontSize: 10 // X轴刻度值也不显示
+                }
+            },
+            yAxis: {
+                type: 'category',
+                data: xdata,
+				axisLine: {
+					show: true, // 设置为 true 来显示Y轴的轴线
+					lineStyle: {
+					  color: '#ECEEF5',
+					  width: 1
+					}
+				},
+				// 隐藏Y轴上的小刻度线（如果你想保留可以设为true）
+				axisTick: {
+					show: false
+				},
+                axisLabel: {
+                    color: '#193D59',
+                    fontSize: 10
+                }
+            },
+            series: [
+                {
+                    type: 'bar',
+                    barWidth: '8px',
+                    data: yData
+                }
+            ]
+        };
+        chartInstance.setOption(option);
+    }
+    const resizeChart = () => {
+        // dispose后重建，确保graphic元素能重新计算位置
+        chartInstance?.dispose();
+        initZtzdfxChart(reportData.value);
+    };
+
+    onMounted(() => {
+        reportData.value = props.reportData;
+        const tempDimensionAnalysis = [
+            {title:'宗旨与动机',bcolor:'#E4D2E1',titlecolor:'#BA8EB4',wddf:'linear-gradient( 90deg, #F5EFF5 0%, #FAF2F9 100%)',
+                pfztfb:'linear-gradient( 270deg, #BA8EB4 0%, #761E6A 100%)',
+                desc:`「宗旨与动机」维度，我们旨在探究是否存在一个清晰的存在理由和明确的方向，能够激发团队成员的动力并吸引他们的想象力，以及个人与集体的身份认同是否围绕共同的目标，并达成一致。`},
+            {title:'外部流程、系统与结构',bcolor:'#B3DEDE',titlecolor:'#80C8C8',wddf:'linear-gradient( 90deg, #E8F5F5 0%, #F0F8F8 100%)',
+                pfztfb:'linear-gradient( 90deg, #009191 0%, #80C8C8 100%)',
+                desc:`「外部流程、系统与结构」维度，我们旨在探究团队如何与各种利益相关者互动，他们与团队的利益相关方各自如何寻求了解对方，以及现有系统和流程的有效性，以帮助管理不同的期望和需求。`},
+            {title:'人际关系',bcolor:'#FFDF73',titlecolor:'#FFEBA8',wddf:'linear-gradient( 90deg, rgba(255,215,80,0.34) 0%, rgba(251,225,130,0.09) 100%)',
+                pfztfb:'linear-gradient( 90deg, #FFD750 0%, #FFEBA8 100%)',
+                desc:`「人际关系」维度，我们旨在探究团队成员如何相互交流、信任程度、尊重和关心的程度，以及团队成员之间的关系如何促进（或破坏）协作。`},
+            {title:'内部流程、系统与结构',bcolor:'#B3DEDE',titlecolor:'#CDE9EA',wddf:'linear-gradient( 90deg, #E8F5F5 0%, #F0F8F8 100%)',
+                pfztfb:'linear-gradient( 270deg, #CDE9EA 0%, #4EB2B2 100%)',
+                desc:`「内部流程、系统与结构」维度，我们旨在探究团队如何在平衡责任与自主权方面进行协作。我们关注团队的敏捷程度、沟通方式以及决策过程的有效性。`},
+            {title:'学习',bcolor:'#E6EAED',titlecolor:'#D7E5FA',wddf:'linear-gradient( 270deg, #F2F5F9 0%, #E3ECF8 100%)',
+                pfztfb:'linear-gradient( 270deg, #D7E5FA 0%, #AFCDF5 100%)',
+                desc:`「学习」维度，我们旨在探究团队如何提高其绩效、技能和资源以应对当前和未来的任务。我们还希望了解团队如何管理能力和提高效率。`},
+            {title:'领导力',bcolor:'#E6EAED',titlecolor:'#8093A3',wddf:'linear-gradient( 270deg, #F2F4F6 0%, #EDF0F2 100%)',
+                pfztfb:'linear-gradient( 270deg, #8093A3 0%, #002846 100%)',
+                desc:`「领导力」维度，我们旨在探究领导素质和行为如何对团队功能和其他因素产生调节影响，以及这是积极的还是消极的。`}
+        ];
+        const tempDimensionAnalysis2 = [
+            {title:'宗旨与动机',title2:'P-宗旨与动机',bcolor:'#E4D2E1',thcolor:'#761E6A',titlecolor:'#BA8EB4',wddf:'linear-gradient( 90deg, #F5EFF5 0%, #FAF2F9 100%)',
+                desc:`「宗旨与动机」维度，我们旨在探究是否存在一个清晰的存在理由和明确的方向，能够激发团队成员的动力并吸引他们的想象力，以及个人与集体的身份认同是否围绕共同的目标，并达成一致。`},
+            {title:'外部流程及系统与架构',title2:'E-外部流程、系统与结构',bcolor:'#B3DEDE',thcolor:'#009191',titlecolor:'#80C8C8',wddf:'linear-gradient( 90deg, #E8F5F5 0%, #F0F8F8 100%)',
+                desc:`「外部流程、系统与结构」维度，我们旨在探究团队如何与各种利益相关者互动，他们与团队的利益相关方各自如何寻求了解对方，以及现有系统和流程的有效性，以帮助管理不同的期望和需求。`},
+            {title:'人际关系',title2:'R-人际关系',bcolor:'#FFDF73',thcolor:'#FFD750',titlecolor:'#FFEBA8',wddf:'linear-gradient( 90deg, rgba(255,215,80,0.34) 0%, rgba(251,225,130,0.09) 100%)',
+                desc:`「人际关系」维度，我们旨在探究团队成员如何相互交流、信任程度、尊重和关心的程度，以及团队成员之间的关系如何促进（或破坏）协作。`},
+            {title:'内部流程及系统与架构',title2:'I-内部流程、系统与结构',bcolor:'#B3DEDE',thcolor:'#4EB2B2',titlecolor:'#CDE9EA',wddf:'linear-gradient( 90deg, #E8F5F5 0%, #F0F8F8 100%)',
+                desc:`「内部流程、系统与结构」维度，我们旨在探究团队如何在平衡责任与自主权方面进行协作。我们关注团队的敏捷程度、沟通方式以及决策过程的有效性。`},
+            {title:'学习',title2:'L-学习',bcolor:'#C7DCF8',thcolor:'#AFCDF5',titlecolor:'#D7E5FA',wddf:'linear-gradient( 270deg, #F2F5F9 0%, #E3ECF8 100%)',
+                desc:`「学习」维度，我们旨在探究团队如何提高其绩效、技能和资源以应对当前和未来的任务。我们还希望了解团队如何管理能力和提高效率。`},
+            {title:'领导力',title2:'L-领导力',bcolor:'#E6EAED',thcolor:'#002846',titlecolor:'#8093A3',wddf:'linear-gradient( 270deg, #F2F4F6 0%, #EDF0F2 100%)',
+                desc:`「领导力」维度，我们旨在探究领导素质和行为如何对团队功能和其他因素产生调节影响，以及这是积极的还是消极的。`}
+        ]
+        reportData.value.dimensionAnalysis.forEach((d,i)=>{
+            d.scoreSpreads.forEach(s=>{
+                s.theme = s.theme.replaceAll('，','').replaceAll(',','');
+                s.minScore = Math.floor(s.minScore)
+                s.maxScore = Math.floor(s.maxScore)
+            })
+            reportData.value.dimensionAnalysis[i] = {...d,...tempDimensionAnalysis[i],...tempDimensionAnalysis2[i]}
+
+        })
+
+        Promise.resolve().then(() => {
+            initZtzdfxChart(reportData.value);
+            window.addEventListener('resize', resizeChart);
+        });
+    })
+</script>
+
+<style scoped lang="scss">
+    @import url(./pdf2.scss);
+
+    .cd_box{
+        width: 100%;
+        min-height: 891px;
+        color: #A1A1A1;
+    }
+</style>

src/views/modules/wechatUser/reportRecord.vue

@@ -16,9 +16,10 @@
             <el-table-column label="发送人" prop="xx"></el-table-column> -->
             <el-table-column label="团队名称" prop="teamName"></el-table-column>
             <el-table-column label="创建时间" prop="createDate"></el-table-column>
-            <el-table-column label="操作" width="150">
+            <el-table-column label="操作" width="200">
                 <template #default="scope">
                     <el-button link type="text" size="mini" @click="handleReview(scope.row)">查看报告</el-button>
+                    <el-button link type="text" size="mini" @click="handleDownload(scope.row)">下载报告</el-button>
                 </template>
             </el-table-column>
         </el-table>
@@ -94,6 +95,48 @@
     const handleReview = (row) => {
         proxy.$emit('handleReview', row);
     }
+
+    const handleDownload = async (row) => {
+        if(!row.fileUrl) {
+            proxy.$message.error('该报告未在微信小程序端生成，请生成后再下载！');
+            return;
+        }
+        
+        // 添加加载提示，因为 fetch 可能需要时间
+        const loadingInstance = proxy.$loading({ text: '正在准备下载，请稍候...' });
+        try {
+            // 1. 使用 fetch 请求文件
+            const response = await fetch(row.fileUrl);
+            if (!response.ok) {
+                throw new Error(`网络响应错误: ${response.statusText}`);
+            }
+            
+            // 2. 将响应体转换为 Blob 对象
+            const blob = await response.blob();
+            
+            // 3. 创建一个指向 Blob 的临时 URL
+            const blobUrl = window.URL.createObjectURL(blob);
+            
+            // 4. 使用与方案一相同的技巧进行下载
+            const fileName = row.pdfReportName || pdfUrl.split('/').pop() || '下载的报告';
+            const link = document.createElement('a');
+            link.href = blobUrl;
+            link.setAttribute('download', fileName);
+            document.body.appendChild(link);
+            link.click();
+            document.body.removeChild(link);
+            
+            // 5. 释放创建的临时 URL
+            window.URL.revokeObjectURL(blobUrl);
+
+        } catch (error) {
+            console.error('下载失败:', error);
+            window.open(row.fileUrl); // 兜底方案，直接在浏览器中打开链接
+        } finally {
+            // 关闭加载提示
+            loadingInstance.close();
+        }
+    }
 </script>
 
 <style scoped lang="scss">

src/views/modules/wechatUserDetail.vue

@@ -87,7 +87,7 @@
             </div>
         </div>
         <template v-if="pdfShow">
-            <report-pdf2 :reportData="reportData" :isMajor="isMajor" @cancel="pdfCancel"></report-pdf2>
+            <report-pdf2 :reportData="reportData" :isMajor="isMajor" :pdfReportNam="pdfReportName" :pdfFileUrl="pdfFileUrl" @cancel="pdfCancel"></report-pdf2>
         </template>
     </div>
 </template>
@@ -123,6 +123,8 @@
     const reportData = ref({})
     const pdfShow = ref(false)
     const isMajor = ref(false)
+    const pdfFileUrl = ref('')
+    const pdfReportName = ref('')
     const tabList = ref(['团队管理','邀请记录','问卷管理','团队成员','交易记录','报告记录'])
 
     const handleBack = () => {
@@ -134,6 +136,8 @@
     }
 
     const handleReview = (row) => {
+        pdfFileUrl.value = row.fileUrl||'';
+        pdfReportName.value = row.reportName||'';
         previewReportByApp(row.reportId).then(res=>{
             if(res.code!==0) return proxy.$message.error(res.msg)
             reportData.value = res.data;