人员登记兼容修改

ln_ry20250512
dshclm 4 days ago
parent 8f2ac2271e
commit c41190735a

@ -14,6 +14,7 @@ import org.springframework.web.multipart.MultipartFile;
import java.io.ByteArrayOutputStream;
import java.io.File;
import java.io.IOException;
import java.util.HashMap;
import java.util.Map;
@Service
@ -21,12 +22,32 @@ public class PdfService {
// 定义最大和最小字体大小,用于动态调整
private static final float MAX_FONT_SIZE = 12;
private static final float MIN_FONT_SIZE = 8;
// 预估的字段宽度根据实际PDF调整
private static final float ESTIMATED_FIELD_WIDTH = 100f;
private static final float MIN_FONT_SIZE = 10;
// 字段宽度映射表根据实际PDF字段宽度设置
private static final Map<String, Float> FIELD_WIDTHS = new HashMap<>();
static {
FIELD_WIDTHS.put("常住地址", 145.87099f);
FIELD_WIDTHS.put("户籍地址", 147.149f);
FIELD_WIDTHS.put("常住地公安机关", 91.56003f);
FIELD_WIDTHS.put("户籍地公安机关", 91.685f);
FIELD_WIDTHS.put("已(拟)任涉密岗位", 93.54599f);
FIELD_WIDTHS.put("涉密等级", 90.23602f);
FIELD_WIDTHS.put("联系方式", 88.69202f);
FIELD_WIDTHS.put("性别", 42.579987f);
FIELD_WIDTHS.put("单位及职务职称", 279.75403f);
FIELD_WIDTHS.put("姓名", 51.342987f);
FIELD_WIDTHS.put("曾用名", 50.871994f);
FIELD_WIDTHS.put("婚姻状况", 39.933014f);
FIELD_WIDTHS.put("民族", 42.359985f);
FIELD_WIDTHS.put("政治面貌", 50.276993f);
FIELD_WIDTHS.put("国籍", 39.713013f);
FIELD_WIDTHS.put("身份证号", 235.40901f);
}
// 需要特殊处理的字段列表
private static final String[] AUTO_WRAP_FIELDS = {
"常住地址", "户籍地址", "户籍地公安机关", "常住地公安机关","姓名","已(拟)任涉密岗位"
"常住地址", "户籍地址", "户籍地公安机关", "常住地公安机关", "姓名", "已(拟)任涉密岗位"
};
public ByteArrayOutputStream fillForm(Map<String, String> formData,
@ -66,21 +87,19 @@ public class PdfService {
if (field != null) {
// 设置表单域为不可编辑
field.setReadOnly(true);
// 设置表单域不高亮显示
// for (PDAnnotationWidget widget : field.getWidgets()) {
// widget.setHighlightMode(PDAnnotationWidget.HIGHLIGHT_MODE_NONE);
// }
if (fieldValue != null && !fieldValue.isEmpty()) {
field.setValue(fieldValue);
if (field instanceof PDTextField) {
PDTextField textField = (PDTextField) field;
if (isAutoWrapField(fieldName)) {
// 获取该字段的实际宽度
float fieldWidth = getFieldWidth(fieldName);
// 计算文本在最大字体下的宽度
float textWidth = calculateTextWidth(fieldValue, font, MAX_FONT_SIZE);
// 如果文本宽度超过预估字段宽度,启用自动换行并调整字体
if (textWidth > ESTIMATED_FIELD_WIDTH) {
// 如果文本宽度超过字段宽度,启用自动换行并调整字体
if (textWidth > fieldWidth) {
textField.setMultiline(true);
float fontSize = calculateFontSize(fieldValue, font);
float fontSize = calculateFontSize(fieldValue, font, fieldWidth);
textField.setDefaultAppearance("/" + font.getName() + " " + fontSize + " Tf 0 g");
} else {
// 文本未超出,使用默认字体和不换行
@ -175,6 +194,10 @@ public class PdfService {
}
return false;
}
// 获取字段宽度,如果没有配置则使用默认值
private float getFieldWidth(String fieldName) {
return FIELD_WIDTHS.getOrDefault(fieldName, 100f);
}
// 计算文本在指定字体和大小下的宽度
private float calculateTextWidth(String text, PDType0Font font, float fontSize) throws IOException {
@ -186,16 +209,15 @@ public class PdfService {
}
// 计算适应字段的字体大小
private float calculateFontSize(String fieldValue, PDType0Font font) throws IOException {
private float calculateFontSize(String fieldValue, PDType0Font font, float fieldWidth) throws IOException {
float fontSize = MAX_FONT_SIZE;
float textWidth = calculateTextWidth(fieldValue, font, fontSize);
// 循环降低字体大小直到文本适合预估宽度
while (textWidth > ESTIMATED_FIELD_WIDTH && fontSize > MIN_FONT_SIZE) {
// 循环降低字体大小直到文本适合字段宽度
while (textWidth > fieldWidth && fontSize > MIN_FONT_SIZE) {
fontSize -= 0.5f;
textWidth = calculateTextWidth(fieldValue, font, fontSize);
}
return fontSize;
}
}

@ -350,53 +350,54 @@
isLoadingLevels: false
},
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'];
var validFormats = ['image/jpeg', 'image/png'];
if (!validFormats.includes(fileType)) {
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 _this = 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({
_this.$message({
message: '请上传接近一寸照片尺寸的图片 (约295x413像素)',
type: 'warning'
})
}
this.selectedFile = file;
_this.selectedFile = file;
};
img.onerror = () => {
this.$message.error('无法加载图片,请重新选择')
img.onerror = function() {
_this.$message.error('无法加载图片,请重新选择')
};
var data = new FormData();
data.append("file", file);
let _that = this
var _that = this;
$.ajax({
type: "POST",
url: ctx + "common/upload",
@ -405,24 +406,24 @@
contentType: false,
processData: false,
dataType: 'json',
success: function (result) {
success: function(result) {
if (result.code == web_status.SUCCESS) {
_that.formData.photoUrl = result.url
_that.formData.photoUrl = result.url;
} else {
$.modal.alertError(result.msg);
}
},
error: function (error) {
error: function(error) {
$.modal.alertWarning("图片上传失败。");
}
});
}
},
clearFile() {
clearFile: function() {
this.selectedFile = null;
document.getElementById('photo').value = '';
},
submitForm() {
submitForm: function() {
// 简单验证
if (!this.formData.name || !this.formData.sex || !this.formData.nationa || !this.formData.nationality || !this.formData.maritalStatus || !this.formData.political || !this.formData.phone || !this.formData.cerno || !this.formData.address || !this.formData.registeredAuthority || !this.formData.permanentAddress || !this.formData.residentBureau || !this.formData.positionCapacity || !this.formData.smPost || !this.formData.smGrade) {
this.$message({
@ -459,7 +460,7 @@
}
// 准备表单数据
let formData = new FormData();
var formData = new FormData();
if (this.formData.name) formData.append("name", this.formData.name);
if (this.formData.sex) formData.append("sex", this.formData.sex);
if (this.formData.nationa) formData.append("nationa", this.formData.nationa);
@ -480,25 +481,26 @@
// 显示加载状态
this.isLoading = true;
// 发送请求
var _this = this;
axios.post('/api/pdf/fill', formData, {
responseType: 'blob'
})
.then(response => {
.then(function(response) {
// 创建下载URL
let blob = new Blob([response.data], { type: 'application/pdf' });
this.pdfUrl = window.URL.createObjectURL(blob);
var blob = new Blob([response.data], { type: 'application/pdf' });
_this.pdfUrl = window.URL.createObjectURL(blob);
// 隐藏加载状态,显示结果
this.isLoading = false;
this.showResult = true;
_this.isLoading = false;
_this.showResult = true;
})
.catch(error => {
.catch(function(error) {
console.error('Error:', error);
this.isLoading = false;
this.$message.error('生成PDF时出错请重试');
_this.isLoading = false;
_this.$message.error('生成PDF时出错请重试');
});
},
submitHandler() {
submitHandler: function() {
// 简单验证
if (!this.formData.name || !this.formData.sex || !this.formData.nationa || !this.formData.nationality || !this.formData.maritalStatus || !this.formData.political || !this.formData.phone || !this.formData.cerno || !this.formData.address || !this.formData.registeredAuthority || !this.formData.permanentAddress || !this.formData.residentBureau || !this.formData.positionCapacity || !this.formData.smPost || !this.formData.smGrade) {
this.$message({
@ -535,24 +537,25 @@
return;
}
var _this = this;
this.$confirm('确认保存吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
$.operate.saveTab(`${this.prefix}/add`,this.formData);
this.$message({
}).then(function() {
$.operate.saveTab(_this.prefix + "/add", _this.formData);
_this.$message({
type: 'success',
message: '保存成功!'
});
}).catch(() => {
this.$message({
}).catch(function() {
_this.$message({
type: 'info',
message: '已取消'
});
});
},
phoneCheck(phone){
phoneCheck: function(phone) {
// 验证联系方式(仅检查位数)
if (phone.length !== 11) {
this.$message({
@ -562,7 +565,7 @@
return;
}
},
cernoCheck(cerno){
cernoCheck: function(cerno) {
// 验证身份证号
if (!this.validateCerno(cerno)) {
this.$message({
@ -572,10 +575,9 @@
return;
}
},
// 身份证号验证函数
validateCerno(cerno) {
validateCerno: function(cerno) {
// 身份证号码正则表达式
const pattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
var pattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
// 基本格式验证
if (!pattern.test(cerno)) {
@ -584,16 +586,16 @@
// 18位身份证号码的验证包括校验位计算
if (cerno.length === 18) {
const idCardArray = cerno.split('');
const factor = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
const parity = ['1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2'];
let sum = 0;
var idCardArray = cerno.split('');
var factor = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
var parity = ['1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2'];
var sum = 0;
for (let i = 0; i < 17; i++) {
for (var i = 0; i < 17; i++) {
sum += parseInt(idCardArray[i]) * factor[i];
}
const lastChar = idCardArray[17].toUpperCase();
var lastChar = idCardArray[17].toUpperCase();
if (lastChar !== parity[sum % 11]) {
return false;
}
@ -602,36 +604,38 @@
return true;
},
// 新增获取下拉框数据的方法
fetchPostOptions() {
fetchPostOptions: function() {
this.isLoadingPosts = true;
var _this = this;
axios.post('/system/classifiedPost/getPostNames')
.then(response => {
.then(function(response) {
// 直接使用返回的字符串数组
this.postOptions = response.data.data || [];
this.isLoadingPosts = false;
_this.postOptions = response.data.data || [];
_this.isLoadingPosts = false;
})
.catch(error => {
.catch(function(error) {
console.error('获取涉密岗位数据失败:', error);
this.isLoadingPosts = false;
this.$message.error('获取涉密岗位数据失败,请刷新页面重试');
_this.isLoadingPosts = false;
_this.$message.error('获取涉密岗位数据失败,请刷新页面重试');
});
},
fetchLevelOptions() {
fetchLevelOptions: function() {
this.isLoadingLevels = true;
var _this = this;
axios.post('/system/classifiedPost/getClassifiedLevels')
.then(response => {
.then(function(response) {
// 直接使用返回的字符串数组
this.levelOptions = response.data.data || [];
this.isLoadingLevels = false;
_this.levelOptions = response.data.data || [];
_this.isLoadingLevels = false;
})
.catch(error => {
.catch(function(error) {
console.error('获取涉密等级数据失败:', error);
this.isLoadingLevels = false;
this.$message.error('获取涉密等级数据失败,请刷新页面重试');
_this.isLoadingLevels = false;
_this.$message.error('获取涉密等级数据失败,请刷新页面重试');
});
}
},
mounted() {
mounted: function() {
// 页面加载时获取下拉框数据
this.fetchPostOptions();
this.fetchLevelOptions();

@ -350,54 +350,55 @@
isLoadingLevels: false
},
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'
})
return
}
this.selectedFile = file;
self.selectedFile = file;
};
img.onerror = () => {
this.$message.error('无法加载图片,请重新选择')
img.onerror = function() {
self.$message.error('无法加载图片,请重新选择')
};
var data = new FormData();
data.append("file", file);
let _that = this
var _that = this
$.ajax({
type: "POST",
url: ctx + "common/upload",
@ -406,24 +407,24 @@
contentType: false,
processData: false,
dataType: 'json',
success: function (result) {
success: function(result) {
if (result.code == web_status.SUCCESS) {
_that.formData.photoUrl = result.url
} else {
$.modal.alertError(result.msg);
}
},
error: function (error) {
error: function(error) {
$.modal.alertWarning("图片上传失败。");
}
});
}
},
clearFile() {
clearFile: function() {
this.selectedFile = null;
document.getElementById('photo').value = '';
},
submitForm() {
submitForm: function() {
// 简单验证
if (!this.formData.name || !this.formData.sex || !this.formData.nationa || !this.formData.nationality || !this.formData.maritalStatus || !this.formData.political || !this.formData.phone || !this.formData.cerno || !this.formData.address || !this.formData.registeredAuthority || !this.formData.permanentAddress || !this.formData.residentBureau || !this.formData.positionCapacity || !this.formData.smPost || !this.formData.smGrade) {
this.$message({
@ -441,7 +442,7 @@
return;
}
// 准备表单数据
let formData = new FormData();
var formData = new FormData();
if (this.formData.name) formData.append("name", this.formData.name);
if (this.formData.sex) formData.append("sex", this.formData.sex);
if (this.formData.nationa) formData.append("nationa", this.formData.nationa);
@ -462,25 +463,26 @@
// 显示加载状态
this.isLoading = true;
// 发送请求
var _this = this;
axios.post('/api/pdf/fill', formData, {
responseType: 'blob'
})
.then(response => {
.then(function(response) {
// 创建下载URL
let blob = new Blob([response.data], { type: 'application/pdf' });
this.pdfUrl = window.URL.createObjectURL(blob);
var blob = new Blob([response.data], { type: 'application/pdf' });
_this.pdfUrl = window.URL.createObjectURL(blob);
// 隐藏加载状态,显示结果
this.isLoading = false;
this.showResult = true;
_this.isLoading = false;
_this.showResult = true;
})
.catch(error => {
.catch(function(error) {
console.error('Error:', error);
this.isLoading = false;
this.$message.error('生成PDF时出错请重试');
_this.isLoading = false;
_this.$message.error('生成PDF时出错请重试');
});
},
submitHandler() {
submitHandler: function() {
// 简单验证
if (!this.formData.name || !this.formData.sex || !this.formData.nationa || !this.formData.nationality || !this.formData.maritalStatus || !this.formData.political || !this.formData.phone || !this.formData.cerno || !this.formData.address || !this.formData.registeredAuthority || !this.formData.permanentAddress || !this.formData.residentBureau || !this.formData.positionCapacity || !this.formData.smPost || !this.formData.smGrade) {
this.$message({
@ -516,24 +518,25 @@
return;
}
var _this = this;
this.$confirm('确认保存吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
$.operate.saveTab(`${this.prefix}/edit`,this.formData);
this.$message({
}).then(function() {
$.operate.saveTab(_this.prefix + "/edit", _this.formData);
_this.$message({
type: 'success',
message: '保存成功!'
});
}).catch(() => {
this.$message({
}).catch(function() {
_this.$message({
type: 'info',
message: '已取消'
});
});
},
phoneCheck(phone){
phoneCheck: function(phone) {
// 验证联系方式(仅检查位数)
if (phone.length !== 11) {
this.$message({
@ -543,7 +546,7 @@
return;
}
},
cernoCheck(cerno){
cernoCheck: function(cerno) {
// 验证身份证号
if (!this.validateCerno(cerno)) {
this.$message({
@ -554,9 +557,9 @@
}
},
// 身份证号验证函数
validateCerno(cerno) {
validateCerno: function(cerno) {
// 身份证号码正则表达式
const pattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
var pattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
// 基本格式验证
if (!pattern.test(cerno)) {
@ -565,16 +568,16 @@
// 18位身份证号码的验证包括校验位计算
if (cerno.length === 18) {
const idCardArray = cerno.split('');
const factor = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
const parity = ['1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2'];
let sum = 0;
var idCardArray = cerno.split('');
var factor = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
var parity = ['1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2'];
var sum = 0;
for (let i = 0; i < 17; i++) {
for (var i = 0; i < 17; i++) {
sum += parseInt(idCardArray[i]) * factor[i];
}
const lastChar = idCardArray[17].toUpperCase();
var lastChar = idCardArray[17].toUpperCase();
if (lastChar !== parity[sum % 11]) {
return false;
}
@ -583,65 +586,68 @@
return true;
},
// 新增获取下拉框数据的方法
fetchPostOptions() {
fetchPostOptions: function() {
this.isLoadingPosts = true;
var _this = this;
axios.post('/system/classifiedPost/getPostNames')
.then(response => {
.then(function(response) {
// 直接使用返回的字符串数组
this.postOptions = response.data.data || [];
this.isLoadingPosts = false;
_this.postOptions = response.data.data || [];
_this.isLoadingPosts = false;
// 数据加载完成后,检查是否需要设置选中值
this.setSelectedValues();
_this.setSelectedValues();
})
.catch(error => {
.catch(function(error) {
console.error('获取涉密岗位数据失败:', error);
this.isLoadingPosts = false;
this.$message.error('获取涉密岗位数据失败,请刷新页面重试');
_this.isLoadingPosts = false;
_this.$message.error('获取涉密岗位数据失败,请刷新页面重试');
});
},
fetchLevelOptions() {
fetchLevelOptions: function() {
this.isLoadingLevels = true;
var _this = this;
axios.post('/system/classifiedPost/getClassifiedLevels')
.then(response => {
.then(function(response) {
// 直接使用返回的字符串数组
this.levelOptions = response.data.data || [];
this.isLoadingLevels = false;
_this.levelOptions = response.data.data || [];
_this.isLoadingLevels = false;
// 数据加载完成后,检查是否需要设置选中值
this.setSelectedValues();
_this.setSelectedValues();
})
.catch(error => {
.catch(function(error) {
console.error('获取涉密等级数据失败:', error);
this.isLoadingLevels = false;
this.$message.error('获取涉密等级数据失败,请刷新页面重试');
_this.isLoadingLevels = false;
_this.$message.error('获取涉密等级数据失败,请刷新页面重试');
});
},
// 设置下拉框的选中值
setSelectedValues() {
setSelectedValues: function() {
// 只有当两个下拉框的数据都加载完成后才设置选中值
if (this.postOptions.length > 0 && this.levelOptions.length > 0) {
// 如果从后端获取的数据中有 smPost 值,并且该值存在于选项中,则设置为选中
if (this.formData.smPost && this.postOptions.includes(this.formData.smPost)) {
if (this.formData.smPost && this.postOptions.indexOf(this.formData.smPost) !== -1) {
this.formData.smPost = this.formData.smPost;
}
// 如果从后端获取的数据中有 smGrade 值,并且该值存在于选项中,则设置为选中
if (this.formData.smGrade && this.levelOptions.includes(this.formData.smGrade)) {
if (this.formData.smGrade && this.levelOptions.indexOf(this.formData.smGrade) !== -1) {
this.formData.smGrade = this.formData.smGrade;
}
}
}
},
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); });
}
}
// 页面加载时获取下拉框数据
@ -649,8 +655,8 @@
this.fetchLevelOptions();
}
});
//图片上传
$('#applyUrlId').on('change.bs.fileinput ', function (e) {
// 图片上传
$('#applyUrlId').on('change.bs.fileinput ', function(e) {
// 处理自己的业务
var file = e.target.files[0];
var data = new FormData();
@ -663,14 +669,14 @@
contentType: false,
processData: false,
dataType: 'json',
success: function (result) {
success: function(result) {
if (result.code == web_status.SUCCESS) {
$("#photoUrl").val(result.url);
} else {
$.modal.alertError(result.msg);
}
},
error: function (error) {
error: function(error) {
$.modal.alertWarning("图片上传失败。");
}
});

@ -135,9 +135,9 @@
<!-- 预览区域(选中后显示) -->
<div v-else class="h-full flex flex-col items-center justify-center p-3">
<img :src="previewUrl" alt="预览图" class="max-h-full max-w-full object-cover rounded-lg mb-2" style="max-height: 200px;">
<!-- <button type="button" @click="clearFile" class="text-xs text-red-500 hover:text-red-700">-->
<!-- <i class="fa-solid fa-times-circle mr-1"></i> 移除-->
<!-- </button>-->
<!-- <button type="button" @click="clearFile" class="text-xs text-red-500 hover:text-red-700">-->
<!-- <i class="fa-solid fa-times-circle mr-1"></i> 移除-->
<!-- </button>-->
</div>
</div>
</div>
@ -287,19 +287,19 @@
<i class="fa-solid fa-download mr-2"></i> 下载PDF
</a>
<!-- 结果区域 -->
<!-- <div class="bg-white rounded-xl shadow-soft p-6 mb-8 transform hover:shadow-lg transition-all duration-300">-->
<!-- <div class="flex items-start">-->
<!-- <div class="ml-4">-->
<!-- <h3 class="text-lg font-medium text-gray-800">PDF生成成功</h3>-->
<!-- <div class="mt-4 flex flex-wrap gap-3">-->
<!-- -->
<!-- <button @click="showResult = false" class="inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md shadow-sm text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary transition-colors duration-200">-->
<!-- <i class="fa-solid fa-times mr-2"></i> 关闭-->
<!-- </button>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="bg-white rounded-xl shadow-soft p-6 mb-8 transform hover:shadow-lg transition-all duration-300">-->
<!-- <div class="flex items-start">-->
<!-- <div class="ml-4">-->
<!-- <h3 class="text-lg font-medium text-gray-800">PDF生成成功</h3>-->
<!-- <div class="mt-4 flex flex-wrap gap-3">-->
<!-- -->
<!-- <button @click="showResult = false" class="inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md shadow-sm text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary transition-colors duration-200">-->
<!-- <i class="fa-solid fa-times mr-2"></i> 关闭-->
<!-- </button>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
</div>
</form>
<h4 class="form-header h4">材料上传</h4>
@ -451,57 +451,59 @@
prefix: ctx + "system/applyList",
},
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 self = this;
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;
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 = '';
},
submitForm() {
submitForm: function() {
var self = this;
// 简单验证
if (!this.formData.name || !this.formData.sex || !this.formData.nationa || !this.formData.nationality || !this.formData.maritalStatus || !this.formData.political || !this.formData.phone || !this.formData.cerno || !this.formData.address || !this.formData.registeredAuthority || !this.formData.permanentAddress || !this.formData.residentBureau || !this.formData.positionCapacity || !this.formData.smPost || !this.formData.smGrade) {
this.$message({
@ -519,7 +521,7 @@
return;
}
// 准备表单数据
let formData = new FormData();
var formData = new FormData();
if (this.formData.name) formData.append("name", this.formData.name);
if (this.formData.sex) formData.append("sex", this.formData.sex);
if (this.formData.nationa) formData.append("nationa", this.formData.nationa);
@ -543,65 +545,66 @@
axios.post('/api/pdf/fill', formData, {
responseType: 'blob'
})
.then(response => {
.then(function(response) {
// 创建下载URL
let blob = new Blob([response.data], { type: 'application/pdf' });
this.pdfUrl = window.URL.createObjectURL(blob);
this.$message.success('生成pdf成功请点击下载');
var blob = new Blob([response.data], { type: 'application/pdf' });
self.pdfUrl = window.URL.createObjectURL(blob);
self.$message.success('生成pdf成功请点击下载');
// 隐藏加载状态,显示结果
this.isLoading = false;
this.showResult = true;
self.isLoading = false;
self.showResult = true;
})
.catch(error => {
.catch(function(error) {
console.error('Error:', error);
this.isLoading = false;
this.$message.error('生成PDF时出错请重试');
self.isLoading = false;
self.$message.error('生成PDF时出错请重试');
});
},
// 新增文件上传相关方法
handleFileSelection(event) {
handleFileSelection: function(event) {
this.selectedFiles = event.target.files;
if (this.selectedFiles && this.selectedFiles.length > 0) {
// 只处理第一个文件
let file = this.selectedFiles[0];
var file = this.selectedFiles[0];
// 检查文件类型
let fileExtension = file.name.split('.').pop().toLowerCase();
let validExtensions = ['pdf', 'doc', 'docx', 'jpg', 'jpeg', 'png', 'gif', 'bmp'];
if (!validExtensions.includes(fileExtension)) {
var fileExtension = file.name.split('.').pop().toLowerCase();
var validExtensions = ['pdf', 'doc', 'docx', 'jpg', 'jpeg', 'png', 'gif', 'bmp'];
if (validExtensions.indexOf(fileExtension) === -1) {
this.$message.error('请上传PDF、Word文档或图片文件');
return;
}
this.uploadFile(file);
}
},
uploadFile(file) {
uploadFile: function(file) {
var self = this;
this.currentFileName = file.name;
this.uploadProgress = 0;
let formData = new FormData();
var formData = new FormData();
formData.append('applyId', this.formData.applyId || '');
formData.append('filename', file.name);
formData.append('fileCode', 'bm_user_audit_001');
formData.append('file', file);
axios.post(ctx + 'system/file/upload', formData, {
onUploadProgress: (progressEvent) => {
this.uploadProgress = Math.round((progressEvent.loaded * 100) / progressEvent.total);
onUploadProgress: function(progressEvent) {
self.uploadProgress = 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,
@ -609,43 +612,45 @@
fileUrl: response.data.data.filePath,
uploadTime: new Date().toISOString()
};
this.uploadedFiles.push(fileInfo);
self.uploadedFiles.push(fileInfo);
// 重置选择框
document.getElementById('fileUpload').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) {
downloadFile: function(file) {
var self = this;
// 直接通过接口下载
axios.get(ctx + 'system/file/download',{
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('下载文件时出错');
});
},
submitHandler() {
submitHandler: function() {
var self = this;
if (this.uploadedFiles.length == 0) {
this.$message.warning('请上传所需材料');
return;
@ -655,53 +660,55 @@
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
$.operate.saveTab(`${this.prefix}/submit?applyId=${this.formData.applyId}`);
}).catch(() => {
this.$message({
}).then(function() {
$.operate.saveTab(self.prefix + '/submit?applyId=' + self.formData.applyId);
}).catch(function() {
self.$message({
type: 'info',
message: '已取消'
});
});
},
deleteFile(file, index) {
this.$confirm(`确定要删除文件 "${file.fileName}" 吗?`, '提示', {
deleteFile: function(file, index) {
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.splice(index, 1);
this.$message.success('文件已成功删除');
self.uploadedFiles.splice(index, 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: '已取消删除'
});
});
},
// 获取已上传文件
getUploadedFiles() {
getUploadedFiles: function() {
var self = this;
if (!this.formData.applyId) return;
axios.get(ctx + 'system/file/getFileInfo', {
params: {
applyId: this.formData.applyId,
fileCode:'bm_user_audit_001',
fileCode: 'bm_user_audit_001',
}
})
.then(response => {
.then(function(response) {
if (response.data.code === web_status.SUCCESS) {
this.uploadedFiles = response.data.data.map((file)=>{
self.uploadedFiles = response.data.data.map(function(file) {
return {
id: file.fileId,
fileName: file.fileName,
@ -709,47 +716,47 @@
fileType: file.fileType,
fileUrl: file.filePath,
uploadTime: file.createTime
}
})
};
});
}
})
.catch(error => {
.catch(function(error) {
console.error('获取文件列表错误:', error);
this.$message.error('获取已上传文件时出错');
self.$message.error('获取已上传文件时出错');
});
},
// 新增图片预览相关方法
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';
if (['doc', 'docx'].indexOf(extension) !== -1) return 'fa-solid fa-file-word text-blue-500';
if (['jpg', 'jpeg', 'png', 'gif', 'bmp'].indexOf(extension) !== -1) 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();
}
window.open(file.fileUrl, '_blank');
return
return;
}
this.previewingFile = file;
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;
@ -757,18 +764,23 @@
return '';
}
},
mounted() {
mounted: function() {
var self = this;
// 从后端获取转义后的 JSON 字符串
if ([[${applyInfoList}]]){
this.formData = {...[[${applyInfoList}]]}
if ([[${applyInfoList}]]) {
this.formData = JSON.parse(JSON.stringify([[${applyInfoList}]]));
// 获取图片并转换为 Blob
if (this.formData.photoUrl) {
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);
});
}
}
@ -776,33 +788,6 @@
this.getUploadedFiles();
}
});
//图片上传
$('#applyUrlId').on('change.bs.fileinput ', function (e) {
// 处理自己的业务
var file = e.target.files[0];
var data = new FormData();
data.append("file", file);
$.ajax({
type: "POST",
url: ctx + "common/upload",
data: data,
cache: false,
contentType: false,
processData: false,
dataType: 'json',
success: function (result) {
if (result.code == web_status.SUCCESS) {
$("#photoUrl").val(result.url);
} else {
$.modal.alertError(result.msg);
}
},
error: function (error) {
$.modal.alertWarning("图片上传失败。");
}
});
});
</script>
</body>

Loading…
Cancel
Save