公司管理添加在职证明pdf名称

src/views/autonym/autonym.vue

@@ -116,23 +116,26 @@
 					</div>
 				</template>
 			</el-table-column>
-			<el-table-column prop="employmentVerification" label="在职证明" width="150">
+			<el-table-column prop="employmentVerification" label="在职证明" width="200">
 				<template slot-scope="scope">
-					<!-- 字段为空时显示空 -->
+					<!-- 字段为空时显示"无" -->
 					<div v-if="!scope.row.employmentVerification">
 					<span style="color: #999;">无</span>
 					</div>
 					
-					<!-- 字段有值时展示单个PDF下载按钮 -->
+					<!-- 有PDF链接时显示下载按钮 -->
 					<div v-else>
-					<!-- PDF下载按钮 -->
 					<el-button 
 						type="text" 
-						icon="el-icon-download" 
 						@click="handlePdfDownload(scope.row.employmentVerification)"
 						style="color: #409EFF; padding: 0;"
 					>
-						下载在职证明
+							<div style="display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;max-height:80px;" >
+							<el-popover placement="top-start" title="" trigger="hover">
+								<div slot="reference">{{scope.row.employmentVerificationName || '在职证明.pdf'}}</div>
+								<div style="width: 400px;">{{scope.row.employmentVerificationName || '在职证明.pdf'}}</div>
+							</el-popover>
+							</div>
 					</el-button>
 					</div>
 				</template>
@@ -362,24 +365,30 @@
 				</div>
 				</div>
 			</div>
-			<div style="margin-bottom: 10px;display:flex;align-items: center;">
-				<span style="width: 200px;display: inline-block;text-align: right;">在职证明：</span>
-				<div style="display: flex;flex-wrap: wrap;">
+			<div style="margin-bottom: 10px;display:flex;align-items: flex-start;">
+				<span style="width: 200px;display: inline-block;text-align: right; margin-top: 8px;">在职证明：</span>
+				<div style="display: flex;flex-direction: column;align-items: flex-start;">
 					<!-- 已上传的PDF文件展示 -->
-					<div class="pdf-item" v-if="employmentVerification" style="margin-right: 20px; display: flex; align-items: center;">
-						<!-- PDF文件图标/预览区域 -->
-						<div class="pdf-preview" style="width: 100px; height: 100px; border: 1px solid #e6e6e6; display: flex; align-items: center; justify-content: center; flex-direction: column;">
-							<i class="el-icon-file-text" style="font-size: 30px; color: #409EFF;"></i>
-							<span style="font-size: 12px; margin-top: 5px; color: #666;">在职证明.pdf</span>
+					<div class="pdf-item" v-if="employmentVerification" style="margin-bottom: 10px; display: flex; align-items: center;">
+						<!-- PDF文件信息 -->
+						<div class="pdf-info" style="padding: 8px 12px; border: 1px solid #e6e6e6; border-radius: 4px; background: #f9f9f9;">
+							<i class="el-icon-file-text" style="font-size: 16px; color: #409EFF; margin-right: 6px;"></i>
+							<span style="font-size: 14px; color: #333;">{{ employmentVerificationName || '在职证明.pdf' }}</span>
 						</div>
 						<!-- 删除按钮 -->
-						<span class="dels" style="margin-left: 10px; cursor: pointer; color: #F56C6C;">
-							<i class="el-icon-delete" @click="clearin()"></i>
+						<span class="del-btn" 
+							style="margin: 0 10px; cursor: pointer; color: #F56C6C; font-size: 14px;"
+							@click="clearin()">
+							<i class="el-icon-delete" style="margin-right: 4px;"></i>删除
+						</span>
+						<!-- 替换提示 -->
+						<span style="font-size: 12px; color: #409EFF;">
+							（可点击下方按钮替换文件）
 						</span>
 					</div>
 					
-					<!-- 上传按钮 - 只有当没有上传PDF时才显示 -->
-					<div class="upload-btn" v-if="!employmentVerification">
+					<!-- 上传按钮 - 固定在下方，不会被挤走 -->
+					<div class="upload-btn">
 						<el-upload 
 							:action="$http.adornUrl('alioss/upload')"
 							list-type="picture-card" 
@@ -388,10 +397,13 @@
 							:on-progress="onprogressin"
 							:before-upload="beforeUploadin"
 							accept=".pdf" 
+							:disabled="percentagein > 0 && percentagein < 100"  
 						>
-							<el-progress v-if="percentagein>0 && percentagein<100" type="circle" :percentage="percentagein">
+							<el-progress v-if="percentagein>0 && percentagein<100" type="circle" :percentage="percentagein" size="50">
 							</el-progress>
-							<i v-else class="el-icon-plus"></i>
+							<div v-else style="width: 100%; height: 100%; border: 1px dashed #409EFF; border-radius: 6px; display: flex; align-items: center; justify-content: center; cursor: pointer; flex-direction: column; background: #f5f7fa;">
+								<span style="font-size: 12px; color: #409EFF; margin-top: 5px;">上传/替换PDF</span>
+							</div>
 						</el-upload>
 					</div>
 				</div>
@@ -418,10 +430,10 @@
 				<span style="width: 200px;display: inline-block;text-align: right;">企业税号：</span>
 				<el-input v-model="companyDutyParagraph" style="width:45%;" min="0" placeholder="请输入企业税号"></el-input>
 			</div> -->
-			<div style="margin-bottom: 10px;">
+			<!-- <div style="margin-bottom: 10px;">
 				<span style="width: 200px;display: inline-block;text-align: right;">企业地址：</span>
 				<el-input v-model="companyAddress" style="width:45%;" min="0" placeholder="请输入企业地址"></el-input>
-			</div>
+			</div> -->
 			<div style="margin-bottom: 10px;">
 				<span style="width: 200px;display: inline-block;text-align: right;">经营范围：</span>
         <el-button style='margin-left:15px;' plain size="mini" type="primary" icon="document" @click="qungkong">
@@ -677,9 +689,10 @@
 				companyCertification: [],
 				companyVerification: [],
 				employmentVerification: '',
+				employmentVerificationName: '在职证明', // 上传的PDF文件名
 				companyCertificate: [],
 				companyDutyParagraph: '',
-				companyAddress: '',
+				// companyAddress: '',
 				companyRegisteredFund: '',
 				email:'',
 				// companyDetails: '',
@@ -690,6 +703,7 @@
 				percentage1: 0,
 				percentageQ: 0,
 				percentagezz: 0,
+				percentagein: 0,
 				userIds: {},
 				nickName2: '',
 				phone1: '',
@@ -713,9 +727,9 @@
 				},
 				startTime: '',
 				endTime: '',
-        dialogFormVisibleImg:false,
-        imgUrl:'',
-        hangyeData: [],
+				dialogFormVisibleImg:false,
+				imgUrl:'',
+				hangyeData: [],
 			}
 		},
 		methods: {
@@ -733,59 +747,31 @@
 				// 仅保留默认的加载失败样式，不替换图片
 				e.target.alt = "图片加载失败";
 			},
-			// 处理单个PDF文件的下载逻辑
-			async handlePdfDownload(pdfUrl) {
-				// 空值防御（双重保险）
+			// 极简版PDF下载方法（直接使用可下载的URL）
+			handlePdfDownload(pdfUrl) {
+				// 空值防御
 				if (!pdfUrl) {
 					this.$message.warning('暂无PDF文件可下载');
 					return;
 				}
 
 				try {
-					// 发起GET请求获取PDF文件（处理跨域）
-					const response = await fetch(pdfUrl, {
-					method: 'GET',
-					mode: 'cors', // 跨域配置
-					headers: {
-						'Content-Type': 'application/pdf',
-						'Access-Control-Allow-Origin': '*'
-					}
-					});
-
-					// 检查请求是否成功（状态码200-299为成功）
-					if (!response.ok) {
-					throw new Error(`服务器返回错误：${response.status}`);
-					}
-
-					// 转换为Blob对象（二进制文件）
-					const blob = await response.blob();
-					
-					// 验证文件类型是否为PDF
-					if (blob.type !== 'application/pdf' && !pdfUrl.endsWith('.pdf')) {
-					throw new Error('文件格式不是PDF，请确认文件链接');
-					}
-
-					// 创建下载链接并触发下载
-					const downloadLink = window.URL.createObjectURL(blob);
-					const aTag = document.createElement('a');
-					aTag.href = downloadLink;
-					// 提取文件名（无则用默认名）
-					aTag.download = pdfUrl.split('/').pop() || `在职证明_${new Date().getTime()}.pdf`;
-					
+					// 创建下载链接并直接触发下载
+					const link = document.createElement('a');
+					link.href = pdfUrl;
+					// 自动提取文件名，无则用默认名
+					link.download = pdfUrl.split('/').pop() || `在职证明_${new Date().getTime()}.pdf`;
 					// 触发下载
-					document.body.appendChild(aTag);
-					aTag.click();
-					
-					// 清理临时资源（避免内存泄漏）
-					document.body.removeChild(aTag);
-					window.URL.revokeObjectURL(downloadLink);
-
-					// 下载成功提示
-					this.$message.success('在职证明PDF下载成功！');
+					document.body.appendChild(link);
+					link.click();
+					// 清理临时元素
+					document.body.removeChild(link);
 
+					// 下载触发成功提示（注：无法判断文件是否真的下载成功，仅提示触发下载）
+					this.$message.success('已触发PDF下载，请查收！');
 				} catch (error) {
-					// 下载失败提示（明确错误原因）
-					this.$message.error(`下载失败：${error.message || '未知错误'}`);
+					// 捕获触发下载过程中的异常
+					this.$message.error(`下载失败：${error.message || '触发下载时出错'}`);
 					console.error('PDF下载异常：', error);
 				}
 			},
@@ -1113,8 +1099,9 @@
 						this.companyCertificate = row.companyCertificate.split(',')
 					}
 					this.employmentVerification = row.employmentVerification
+					this.employmentVerificationName = row.employmentVerificationName
 					this.companyDutyParagraph = row.companyDutyParagraph
-					this.companyAddress = row.companyAddress
+					// this.companyAddress = row.companyAddress
 					this.companyRegisteredFund = row.companyRegisteredFund
 					this.email = row.email
 					// this.companyDetails = row.companyDetails
@@ -1138,9 +1125,10 @@
 					this.companyCertification = []
 					this.companyVerification = []
 					this.employmentVerification = ''
+					this.employmentVerificationName = ''
 					this.companyCertificate = []
 					this.companyDutyParagraph = ''
-					this.companyAddress = ''
+					// this.companyAddress = ''
 					this.companyRegisteredFund = ''
 					this.email = ''
 					// this.companyDetails = ''
@@ -1301,18 +1289,28 @@
 			// 上传成功回调
 			handleUploadSuccessin(response, file, fileList) {
 				this.percentagein = 0;
-				// 假设接口返回的文件链接在response.data.url中
-				if (response && response.data && response.data.url) {
-					this.employmentVerification = response.data.url;
+				// 假设接口返回的文件链接在response.data中
+				if (response && response.data) {
+					this.employmentVerification = response.data;
+					this.employmentVerificationName = file.name || '在职证明.pdf';
 					this.$message.success('PDF上传成功');
 				} else {
 					this.$message.error('PDF上传失败，请重试');
 				}
 			},
 			// 删除PDF文件
-			clearzz() {
-				this.employmentVerification = null;
-				this.$message.success('已删除上传的PDF文件');
+			clearin() {
+				this.$confirm('确定要删除该在职证明PDF吗？', '提示', {
+					confirmButtonText: '确定',
+					cancelButtonText: '取消',
+					type: 'warning'
+				}).then(() => {
+					this.employmentVerification = null; // 清空PDF链接
+					this.pdfFileName = ''; // 清空文件名
+					this.$message.success('PDF文件已删除');
+				}).catch(() => {
+					this.$message.info('已取消删除');
+				});
 			},
 			// 确定添加
 			addmissionNoticeTo() {
@@ -1393,15 +1391,15 @@
 						});
 						return
 					}
-					if (this.companyAddress == '') {
-						this.$notify({
-							title: '提示',
-							duration: 1800,
-							message: '请输入企业地址',
-							type: 'warning'
-						});
-						return
-					}
+					// if (this.companyAddress == '') {
+					// 	this.$notify({
+					// 		title: '提示',
+					// 		duration: 1800,
+					// 		message: '请输入企业地址',
+					// 		type: 'warning'
+					// 	});
+					// 	return
+					// }
 					if (this.companyRegisteredFund == '') {
 						this.$notify({
 							title: '提示',
@@ -1446,6 +1444,7 @@
 							'companyCertification': that.companyCertification.toString(),
 							'companyVerification': that.companyVerification.toString(),
 							'employmentVerification': that.employmentVerification.toString(),
+							'employmentVerificationName': that.employmentVerificationName,
 							'companyCertificate': that.companyCertificate.toString(),
 							// 'phone': that.companyPhone,
 							'companyAllName': that.companyAllName,
@@ -1454,7 +1453,7 @@
 							'companyPeople':that.companyPeople,
 							'companyLogo': that.companyLogo,
 							'companyDutyParagraph': that.companyDutyParagraph,
-							'companyAddress': that.companyAddress,
+							// 'companyAddress': that.companyAddress,
 							'companyRegisteredFund': that.companyRegisteredFund,
 							// 'companyDetails': that.companyDetails,
 							'companyScope': that.companyScope.toString(),
@@ -1502,9 +1501,10 @@
 				this.companyCertification = []
 				this.companyVerification = []
 				this.employmentVerification = ''
+				this.employmentVerificationName = ''
 				this.companyCertificate = []
 				this.companyDutyParagraph = ''
-				this.companyAddress = ''
+				// this.companyAddress = ''
 				this.companyRegisteredFund = ''
 				this.email = ''
 				// this.companyDetails = ''