From 07429e42647c5991b26f2581911a373408062eab Mon Sep 17 00:00:00 2001
From: dshclm <3321914460@qq.com>
Date: Wed, 4 Jun 2025 09:29:39 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=85=BC=E5=AE=B9=E4=BD=8E?=
=?UTF-8?q?=E7=89=88=E6=9C=AC=E6=B5=8F=E8=A7=88=E5=99=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../system/newdev/abroad/editAbroad.html | 190 ++++++++++--------
.../system/newdev/onduty/editDuty.html | 6 +-
2 files changed, 104 insertions(+), 92 deletions(-)
diff --git a/ruoyi-admin/src/main/resources/templates/system/newdev/abroad/editAbroad.html b/ruoyi-admin/src/main/resources/templates/system/newdev/abroad/editAbroad.html
index 3bfff693..21985bf9 100644
--- a/ruoyi-admin/src/main/resources/templates/system/newdev/abroad/editAbroad.html
+++ b/ruoyi-admin/src/main/resources/templates/system/newdev/abroad/editAbroad.html
@@ -135,9 +135,9 @@
![预览图]()
-
-
-
+
+
+
@@ -461,7 +461,7 @@
selectedFiles: Array(6).fill(null),
currentFileName: Array(6).fill(''),
uploadProgress: Array(6).fill(0),
- uploadedFiles: Array(6).fill([]).map(() => []),
+ uploadedFiles: Array(6).fill([]).map(function() { return []; }),
previewModalVisible: false,
previewingFile: {},
uploadSuccess: false,
@@ -469,69 +469,72 @@
prefix: ctx + "system/abroadList",
},
computed: {
- previewUrl() {
+ previewUrl: function() {
return this.selectedFile ? window.URL.createObjectURL(this.selectedFile) : '';
}
},
methods: {
- handleFileUpload(event) {
- let file = event.target.files[0];
+ handleFileUpload: function(event) {
+ var file = event.target.files[0];
if (file) {
// 检查文件类型和大小
- let fileSize = file.size / 1024 / 1024; // MB
+ var fileSize = file.size / 1024 / 1024; // MB
if (fileSize > 2) {
this.$message.error('文件大小不能超过2MB');
return;
}
- let fileType = file.type;
+ var fileType = file.type;
if (!fileType.startsWith('image/')) {
this.$message.error('请上传图片文件');
return;
}
// 验证图片格式
- let validFormats = ['image/jpeg', 'image/png'];
- if (!validFormats.includes(fileType)) {
+ var validFormats = ['image/jpeg', 'image/png'];
+ if (validFormats.indexOf(fileType) === -1) {
this.$message.error('请上传JPG或PNG格式的图片');
return;
}
// 验证图片尺寸是否接近一寸照片 (2.5cm x 3.5cm, 约295x413像素)
- let img = new Image();
+ var img = new Image();
img.src = window.URL.createObjectURL(file);
- img.onload = () => {
- let width = img.naturalWidth;
- let height = img.naturalHeight;
- let ratio = width / height;
+ var self = this;
+ img.onload = function() {
+ var width = img.naturalWidth;
+ var height = img.naturalHeight;
+ var ratio = width / height;
// 检查宽高比是否接近一寸照片的比例 (约0.714)
if (Math.abs(ratio - 0.714) > 0.1) {
- this.$message({
+ self.$message({
message: '建议上传一寸照片尺寸 (约295x413像素)',
type: 'warning'
});
}
- this.selectedFile = file;
+ self.selectedFile = file;
};
- img.onerror = () => {
- this.$message.error('无法加载图片，请重新选择');
+ img.onerror = function() {
+ self.$message.error('无法加载图片，请重新选择');
};
}
},
- clearFile() {
+ clearFile: function() {
this.selectedFile = null;
document.getElementById('photo').value = '';
},
// 文件上传处理
- handleFileSelection(index) {
+ handleFileSelection: function(index) {
this.selectedFiles[index] = event.target.files[0];
if (this.selectedFiles[index]) {
- let file = this.selectedFiles[index];
- let fileExtension = file.name.split('.').pop().toLowerCase();
+ var file = this.selectedFiles[index];
+ var fileExtension = file.name.split('.').pop().toLowerCase();
// 根据材料类型验证文件格式
- let validExtensions = this.materials[index].accept.split(',').map(ext => ext.trim().replace('.', ''));
+ var validExtensions = this.materials[index].accept.split(',').map(function(ext) {
+ return ext.trim().replace('.', '');
+ });
- if (!validExtensions.includes(fileExtension)) {
- this.$message.error(`请上传${this.materials[index].description.split('：')[1]}`);
- document.getElementById(`fileUpload${index}`).value = ''; // 清空选择
+ if (validExtensions.indexOf(fileExtension) === -1) {
+ this.$message.error('请上传' + this.materials[index].description.split('：')[1]);
+ document.getElementById('fileUpload' + index).value = ''; // 清空选择
return;
}
@@ -539,34 +542,35 @@
}
},
- uploadFile(file, index) {
+ uploadFile: function(file, index) {
this.currentFileName[index] = file.name;
this.uploadProgress[index] = 0;
- let formData = new FormData();
+ var formData = new FormData();
formData.append('applyId', this.formData.applyId || '');
formData.append('filename', file.name);
formData.append('fileCode', this.materials[index].code);
formData.append('file', file);
+ var self = this;
axios.post(ctx + 'system/file/upload', formData, {
- onUploadProgress: (progressEvent) => {
- this.uploadProgress[index] = Math.round((progressEvent.loaded * 100) / progressEvent.total);
+ onUploadProgress: function(progressEvent) {
+ self.uploadProgress[index] = Math.round((progressEvent.loaded * 100) / progressEvent.total);
}
})
- .then(response => {
+ .then(function(response) {
if (response.data.code === web_status.SUCCESS) {
// 显示上传成功提示
- this.uploadSuccess = true;
- this.uploadSuccessMessage = `文件 "${file.name}" 上传成功`;
+ self.uploadSuccess = true;
+ self.uploadSuccessMessage = '文件 "' + file.name + '" 上传成功';
// 3秒后隐藏提示
- setTimeout(() => {
- this.uploadSuccess = false;
+ setTimeout(function() {
+ self.uploadSuccess = false;
}, 3000);
// 更新文件列表
- let fileInfo = {
+ var fileInfo = {
id: response.data.data.fileId,
fileName: file.name,
fileSize: file.size,
@@ -574,66 +578,68 @@
fileUrl: response.data.data.filePath,
uploadTime: new Date().toISOString()
};
- this.$set(this.uploadedFiles, index, [...this.uploadedFiles[index], fileInfo]);
+ self.$set(self.uploadedFiles, index, self.uploadedFiles[index].concat(fileInfo));
// 重置选择框
- document.getElementById(`fileUpload${index}`).value = '';
+ document.getElementById('fileUpload' + index).value = '';
} else {
- this.$message.error(`上传失败: ${response.data.msg}`);
+ self.$message.error('上传失败: ' + response.data.msg);
}
})
- .catch(error => {
+ .catch(function(error) {
console.error('上传错误:', error);
- this.$message.error('上传过程中发生错误');
+ self.$message.error('上传过程中发生错误');
});
},
- downloadFile(file, index) {
+ downloadFile: function(file, index) {
// 直接通过接口下载
- axios.get(ctx + 'system/file/download',{
+ var self = this;
+ axios.get(ctx + 'system/file/download', {
params: { fileId: file.id },
responseType: 'blob', // 重要：指定响应类型为blob
headers: {
'Content-Type': 'application/json',
}
})
- .then(response => {
- let url = window.URL.createObjectURL(new Blob([response.data]));
- let link = document.createElement('a');
+ .then(function(response) {
+ var url = window.URL.createObjectURL(new Blob([response.data]));
+ var link = document.createElement('a');
link.href = url;
link.setAttribute('download', file.fileName);
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
})
- .catch(error => {
+ .catch(function(error) {
console.error('下载错误:', error);
- this.$message.error('下载文件时出错');
+ self.$message.error('下载文件时出错');
});
},
- deleteFile(file, materialIndex, fileIndex) {
- this.$confirm(`确定要删除文件 "${file.fileName}" 吗？`, '提示', {
+ deleteFile: function(file, materialIndex, fileIndex) {
+ var self = this;
+ this.$confirm('确定要删除文件 "' + file.fileName + '" 吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
- }).then(() => {
+ }).then(function() {
axios.get(ctx + 'system/file/delFile/' + file.id)
- .then(response => {
+ .then(function(response) {
if (response.data.code === web_status.SUCCESS) {
- this.uploadedFiles[materialIndex].splice(fileIndex, 1);
- this.$message.success('文件已成功删除');
+ self.uploadedFiles[materialIndex].splice(fileIndex, 1);
+ self.$message.success('文件已成功删除');
} else {
- this.$message.error(`删除失败: ${response.data.msg}`);
+ self.$message.error('删除失败: ' + response.data.msg);
}
})
- .catch(error => {
+ .catch(function(error) {
console.error('删除错误:', error);
- this.$message.error('删除文件时出错');
+ self.$message.error('删除文件时出错');
});
- }).catch(() => {
- this.$message({
+ }).catch(function() {
+ self.$message({
type: 'info',
message: '已取消删除'
});
@@ -641,21 +647,22 @@
},
// 获取已上传文件
- getUploadedFiles() {
+ getUploadedFiles: function() {
if (!this.formData.applyId) return;
// 使用forEach确保每个请求有自己的作用域
- this.materials.forEach((material, index) => {
+ var self = this;
+ this.materials.forEach(function(material, index) {
axios.get(ctx + 'system/file/getFileInfo', {
params: {
- applyId: this.formData.applyId,
+ applyId: self.formData.applyId,
fileCode: material.code,
}
})
- .then(response => {
+ .then(function(response) {
if (response.data.code === web_status.SUCCESS) {
// 使用Vue.set确保响应式更新
- this.$set(this.uploadedFiles, index, response.data.data.map((file) => {
+ self.$set(self.uploadedFiles, index, response.data.data.map(function(file) {
return {
id: file.fileId,
fileName: file.fileName,
@@ -666,37 +673,37 @@
}
}));
} else {
- console.error(`获取${material.name}文件列表失败:`, response.data.msg);
- this.$message.error(`获取${material.name}已上传文件失败: ${response.data.msg}`);
+ console.error('获取' + material.name + '文件列表失败:', response.data.msg);
+ self.$message.error('获取' + material.name + '已上传文件失败: ' + response.data.msg);
}
})
- .catch(error => {
- console.error(`获取${material.name}文件列表错误:`, error);
- this.$message.error(`获取${material.name}已上传文件时出错`);
+ .catch(function(error) {
+ console.error('获取' + material.name + '文件列表错误:', error);
+ self.$message.error('获取' + material.name + '已上传文件时出错');
});
});
},
// 图片预览相关方法
- isImageFile(fileName) {
- const imageExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp','pdf'];
- const extension = fileName.split('.').pop().toLowerCase();
- return imageExtensions.includes(extension);
+ isImageFile: function(fileName) {
+ var imageExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'pdf'];
+ var extension = fileName.split('.').pop().toLowerCase();
+ return imageExtensions.indexOf(extension) !== -1;
},
- getFileIcon(fileName) {
- const extension = fileName.split('.').pop().toLowerCase();
+ getFileIcon: function(fileName) {
+ var extension = fileName.split('.').pop().toLowerCase();
if (extension === 'pdf') return 'fa-solid fa-file-pdf text-red-500';
if (['doc', 'docx'].includes(extension)) return 'fa-solid fa-file-word text-blue-500';
if (['jpg', 'jpeg', 'png', 'gif', 'bmp'].includes(extension)) return 'fa-solid fa-file-image text-green-500';
return 'fa-solid fa-file text-gray-500';
},
- previewFile(file) {
- let extension = file.fileName.split('.').pop().toLowerCase();
+ previewFile: function(file) {
+ var extension = file.fileName.split('.').pop().toLowerCase();
if (extension === 'pdf') {
// 使用preventDefault阻止默认行为，避免影响当前页面状态
- let event = window.event;
+ var event = window.event;
if (event) {
event.preventDefault();
}
@@ -707,12 +714,12 @@
this.previewModalVisible = true;
},
- closePreviewModal() {
+ closePreviewModal: function() {
this.previewModalVisible = false;
this.previewingFile = {};
},
- getPreviewUrl(file) {
+ getPreviewUrl: function(file) {
// 如果是图片，直接返回URL
if (this.isImageFile(file.fileName)) {
return ctx + 'system/file/download?fileId=' + file.id;
@@ -720,18 +727,23 @@
return '';
}
},
- mounted() {
+ mounted: function() {
// 从后端获取转义后的 JSON 字符串
- if ([[${applyInfoList}]]){
- this.formData = {...[[${applyInfoList}]]}
+ if ([[${applyInfoList}]]) {
+ this.formData = JSON.parse(JSON.stringify([[${applyInfoList}]]));
// 获取图片并转换为 Blob
if (this.formData.photoUrl) {
+ var self = this;
fetch(this.formData.photoUrl)
- .then(response => response.blob())
- .then(blob => {
- this.selectedFile = blob;
+ .then(function(response) {
+ return response.blob();
+ })
+ .then(function(blob) {
+ self.selectedFile = blob;
})
- .catch(error => console.error('处理图片时出错:', error));
+ .catch(function(error) {
+ console.error('处理图片时出错:', error);
+ });
}
}
diff --git a/ruoyi-admin/src/main/resources/templates/system/newdev/onduty/editDuty.html b/ruoyi-admin/src/main/resources/templates/system/newdev/onduty/editDuty.html
index 964d9e9e..a71bf1ab 100644
--- a/ruoyi-admin/src/main/resources/templates/system/newdev/onduty/editDuty.html
+++ b/ruoyi-admin/src/main/resources/templates/system/newdev/onduty/editDuty.html
@@ -139,9 +139,9 @@
![预览图]()
-
+
+
+