luoluo
/
ry_zhky
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改

Browse Source
ln_ry20250512
dshclm 3 weeks ago
parent 557a1dd4dd
commit da321ee8ae
6 changed files with 880 additions and 180 deletions
Show Stats Download Patch File Download Diff File

2
ruoyi-admin/src/main/java/com/ruoyi/web/controller/system/apply/PromiseInfoListController.java
Unescape View File

@ -59,7 +59,7 @@ public class PromiseInfoListController extends BaseController {
public String editPromise(@PathVariable("applyId") String applyId, ModelMap mmap) { public String editPromise(@PathVariable("applyId") String applyId, ModelMap mmap) {
TdApplyInfoListDTO applyInfoList = applyInfoListManager.getTdApplyInfoList(applyId); TdApplyInfoListDTO applyInfoList = applyInfoListManager.getTdApplyInfoList(applyId);
mmap.put("applyInfoList", applyInfoList); mmap.put("applyInfoList", applyInfoList);
return prefix + "/editAudit"; return prefix + "/editPromise";
} }
/** /**

2
ruoyi-admin/src/main/resources/templates/system/newdev/apply/editFile.html
Unescape View File

@ -358,7 +358,7 @@
<h3 class="text-lg font-medium text-gray-800">PDF生成成功</h3> <h3 class="text-lg font-medium text-gray-800">PDF生成成功</h3>
<p class="mt-1 text-sm text-gray-600">您的PDF表单已成功填写，可以点击下方按钮下载。</p> <p class="mt-1 text-sm text-gray-600">您的PDF表单已成功填写，可以点击下方按钮下载。</p>
<div class="mt-4 flex flex-wrap gap-3"> <div class="mt-4 flex flex-wrap gap-3">
<a :href="pdfUrl" download="smryscb.pdf" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-primary hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary transition-colors duration-200"> <a :href="pdfUrl" download="涉密人员审查表.pdf" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-primary hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary transition-colors duration-200">
<i class="fa-solid fa-download mr-2"></i> 下载PDF <i class="fa-solid fa-download mr-2"></i> 下载PDF
</a> </a>
<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"> <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">

633
ruoyi-admin/src/main/resources/templates/system/newdev/person/detail.html
Unescape View File

@ -1,188 +1,487 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" > <html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head> <head>
<th:block th:include="include :: header('人员')" /> <th:block th:include="include :: header('材料上传')"/>
<th:block th:include="include :: select2-css" /> <th:block th:include="include :: select2-css"/>
<th:block th:include="include :: jasny-bootstrap-css" /> <th:block th:include="include :: jasny-bootstrap-css"/>
<th:block th:include="include :: element-css"/>
<link href="/file/pdf/test.css" rel="stylesheet">
<script src="/file/pdf/tailwindcss.js"></script>
<!-- Tailwind配置 -->
<script>
tailwind.config = {
theme: {
extend: {
colors: {
primary: '#3b82f6',
secondary: '#64748b',
accent: '#0ea5e9',
neutral: '#f1f5f9',
'neutral-dark': '#334155',
},
fontFamily: {
sans: ['Inter', 'system-ui', 'sans-serif'],
},
}
}
}
</script>
<style type="text/tailwindcss">
@layer utilities {
.content-auto {
content-visibility: auto;
}
.shadow-soft {
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}
.transition-custom {
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
}
.text-sm {
font-size: 1.4rem;
}
.text-base {
font-size: 1.4rem;
}
.text-xs {
font-size: 0.85rem;
}
.py-2 {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
}
.space-y-3{
margin-bottom: 1.5rem;
}
</style>
</head> </head>
<body> <body class="bg-gray-50 font-sans">
<div class="main-content"> <div class="main-content min-h-screen flex flex-col" id="app">
<form class="form-horizontal" id="form-apply-edit" th:object="${applyInfoList}"> <main class="flex-grow container mx-auto px-4 py-8" style="max-width: 100%;">
<input name="applyId" type="hidden" th:field="*{applyId}" /> <div class="max-w-10xl mx-auto" style="width: 100%;">
<h4 class="form-header h4">基本信息</h4> <div class="bg-white rounded-xl shadow-soft p-6 mb-8 scale-hover">
<div class="row"> <form class="form-horizontal space-y-6" id="form-apply-edit" th:object="${applyInfoList}" @submit.prevent="submitForm">
<div class="col-sm-6"> <input name="applyId" type="hidden" th:field="*{applyId}"/>
<div class="form-group"> <h4 class="form-header h4">基本信息</h4>
<label class="col-sm-4 control-label is-required">姓名：</label> <!-- 文本字段 -->
<div class="col-sm-8"> <div class="grid md:grid-cols-3 gap-6">
<input name="name" id="name" placeholder="请输入姓名" readonly th:field="*{name}" class="form-control" type="text" maxlength="30" required> <!-- 第一行前两列：姓名、性别 -->
</div> <div class="md:col-span-1 space-y-3">
</div> <!-- 姓名 -->
</div> <div class="space-y-3">
<div class="col-sm-6"> <label for="name" class="block text-sm font-medium text-gray-700">姓名</label>
<div class="form-group"> <div class="relative">
<label class="col-sm-4 control-label is-required">性别：</label> <span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<div class="col-sm-8"> <i class="fa-solid fa-user"></i>
<input name="sex" id="sex" placeholder="请输入性别" th:field="*{sex}" readonly class="form-control" type="text" maxlength="30" required> </span>
</div> <input disabled type="text" id="name" v-model="formData.name" class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg" placeholder="请输入姓名">
</div> </div>
</div> </div>
</div>
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">国籍：</label>
<div class="col-sm-8">
<input id="nationa" name="nationa" placeholder="请输入国籍" readonly th:field="*{nationa}" class="form-control" type="text" maxlength="30" required>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">曾用名：</label>
<div class="col-sm-8">
<input id="formerName" name="formerName" placeholder="请输入曾用名" readonly th:field="*{formerName}" class="form-control" type="text" maxlength="30" required>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">民族：</label>
<div class="col-sm-8">
<input name="nationality" placeholder="请输入民族" class="form-control" readonly th:field="*{nationality}" type="text" maxlength="30" required>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">婚姻状况：</label>
<div class="col-sm-8">
<input name="maritalStatus" placeholder="请输入婚姻状况" readonly th:field="*{maritalStatus}" class="form-control" type="text" maxlength="30" required>
</div>
</div>
</div>
</div> <!-- 性别 -->
<div class="row"> <div class="space-y-3">
<div class="col-sm-6"> <label for="sex" class="block text-sm font-medium text-gray-700">性别</label>
<div class="form-group"> <div class="relative">
<label class="col-sm-4 control-label is-required">政治面貌：</label> <span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<div class="col-sm-8"> <i class="fa-solid fa-venus-mars"></i>
<input name="political" required class="form-control" readonly th:field="*{political}" placeholder="请输入政治面貌" type="text"> </span>
</div> <input disabled type="text" id="sex" v-model="formData.sex" class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg" placeholder="请输入性别">
</div> </div>
</div> </div>
<div class="col-sm-6"> </div>
<div class="form-group"> <!-- 第二行前两列：国籍、曾用名 -->
<label class="col-sm-4 control-label is-required">联系方式：</label> <div class="md:col-span-1 space-y-3">
<div class="col-sm-8"> <!-- 国籍 -->
<input name="phone" required class="form-control" readonly th:field="*{phone}" placeholder="请输入联系方式" type="text"> <div class="space-y-3">
</div> <label for="nationa" class="block text-sm font-medium text-gray-700">国籍</label>
</div> <div class="relative">
</div> <span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
</div> <i class="fa-solid fa-globe"></i>
<div class="row"> </span>
<div class="col-sm-6"> <input disabled type="text" id="nationa" v-model="formData.nationa" class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg" placeholder="请输入国籍">
<div class="form-group"> </div>
<label class="col-sm-4 control-label is-required">身份证号：</label> </div>
<div class="col-sm-8">
<input name="cerno" required class="form-control" readonly th:field="*{cerno}" placeholder="请输入身份证号" type="text"> <!-- 曾用名 -->
</div> <div class="space-y-3">
</div> <label for="formerName" class="block text-sm font-medium text-gray-700">曾用名</label>
</div> <div class="relative">
<div class="col-sm-6"> <span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<div class="form-group"> <i class="fa-solid fa-user-tag"></i>
<label class="col-sm-4 control-label is-required">户籍地址：</label> </span>
<div class="col-sm-8"> <input disabled type="text" id="formerName" v-model="formData.formerName" class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg" placeholder="请输入曾用名">
<input name="address" required class="form-control" readonly th:field="*{address}" placeholder="请输入户籍地址" type="text"> </div>
</div> </div>
</div> </div>
</div> <!-- 第一行第三列：图片上传区域（固定位置，跨两行） -->
</div> <div class="md:col-span-1 md:row-span-2 space-y-3 relative">
<div class="row"> <label class="block text-sm font-medium text-gray-700">一寸照片</label>
<div class="col-sm-6"> <div class="mt-1 h-64 border-2 border-gray-300 rounded-lg shadow-soft transition-all duration-200" style="width: 141px;height: 195px">
<div class="form-group"> <!-- 上传区域（未选中时显示） -->
<label class="col-sm-4 control-label is-required">户籍地公安机关：</label> <div v-if="!selectedFile" class="h-full flex justify-center items-center border-dashed cursor-pointer hover:border-primary">
<div class="col-sm-8"> <div class="text-center">
<input name="registeredAuthority" required class="form-control" readonly th:field="*{registeredAuthority}" placeholder="请输入户籍地公安机关" type="text"> <i class="fa-solid fa-cloud-upload text-4xl text-gray-400 mb-2"></i>
</div> <label for="photo" class="cursor-pointer bg-white rounded-md font-medium text-primary hover:text-primary/80">
</div> <span>上传照片</span>
</div> <input disabled id="photo" name="photo" type="file" accept="image/jpeg,image/png" class="sr-only">
<div class="col-sm-6"> </label>
<div class="form-group"> <p class="text-xs text-gray-500">
<label class="col-sm-4 control-label is-required">常住地址：</label> JPG, PNG (最大 2MB)
<div class="col-sm-8"> </p>
<input name="permanentAddress" required class="form-control" readonly th:field="*{permanentAddress}" placeholder="请输入常住地址" type="text"> </div>
</div>
<!-- 预览区域（选中后显示） -->
<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;">
</div>
</div>
</div>
<div class="space-y-3">
<label for="nationality" class="block text-sm font-medium text-gray-700">民族</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-people-group"></i>
</span>
<input disabled type="text" id="nationality" v-model="formData.nationality"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入民族">
</div>
</div>
<div class="space-y-3">
<label for="maritalStatus" class="block text-sm font-medium text-gray-700">婚姻状况</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-ring"></i>
</span>
<input disabled type="text" id="maritalStatus" v-model="formData.maritalStatus"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入婚姻状况">
</div>
</div>
<div class="space-y-3">
<label for="political" class="block text-sm font-medium text-gray-700">政治面貌</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-user-tie"></i>
</span>
<input disabled type="text" id="political" v-model="formData.political"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入政治面貌">
</div>
</div>
<div class="space-y-3">
<label for="phone" class="block text-sm font-medium text-gray-700">联系方式</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-phone"></i>
</span>
<input disabled type="text" id="phone" v-model="formData.phone"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入联系方式">
</div>
</div>
<div class="space-y-3">
<label for="cerno" class="block text-sm font-medium text-gray-700">身份证号</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-id-card"></i>
</span>
<input disabled type="text" id="cerno" v-model="formData.cerno"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入身份证号">
</div>
</div>
<div class="space-y-3">
<label for="address" class="block text-sm font-medium text-gray-700">户籍地址</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-house-chimney"></i>
</span>
<input disabled type="text" id="address" v-model="formData.address"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入户籍地址">
</div>
</div>
<div class="space-y-3">
<label for="registeredAuthority" class="block text-sm font-medium text-gray-700">户籍地公安机关</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-badge-shield"></i>
</span>
<input disabled type="text" id="registeredAuthority" v-model="formData.registeredAuthority"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入户籍地公安机关">
</div>
</div>
<div class="space-y-3">
<label for="permanentAddress" class="block text-sm font-medium text-gray-700">常住地址</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-house"></i>
</span>
<input disabled type="text" id="permanentAddress" v-model="formData.permanentAddress"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入常住地址">
</div>
</div>
<div class="space-y-3">
<label for="residentBureau" class="block text-sm font-medium text-gray-700">常住地公安机关</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-badge-shield"></i>
</span>
<input disabled type="text" id="residentBureau" v-model="formData.residentBureau"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入常住地公安机关">
</div>
</div>
<div class="space-y-3">
<label for="positionCapacity" class="block text-sm font-medium text-gray-700">单位及职务职称</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-building-user"></i>
</span>
<input disabled type="text" id="positionCapacity" v-model="formData.positionCapacity"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入单位及职务职称">
</div>
</div>
<div class="space-y-3">
<label for="smPost" class="block text-sm font-medium text-gray-700">已（拟）任涉密岗位</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-shield-halved"></i>
</span>
<input disabled type="text" id="smPost" v-model="formData.smPost"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入已（拟）任涉密岗位">
</div>
</div>
<div class="space-y-3">
<label for="smGrade" class="block text-sm font-medium text-gray-700">涉密等级</label>
<div class="relative">
<span class="absolute inset-y-0 left-0 flex items-center pl-3 text-gray-500">
<i class="fa-solid fa-lock"></i>
</span>
<input disabled type="text" id="smGrade" v-model="formData.smGrade"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary/50 focus:border-primary transition-colors duration-200"
placeholder="请输入涉密等级">
</div>
</div>
</div> </div>
</div> </form>
</div> <h4 class="form-header h4">已上传材料列表</h4>
</div>
<div class="row"> <!-- 新增文件上传区域 -->
<div class="col-sm-6"> <div class="mt-6">
<div class="form-group"> <!-- 文件列表 -->
<label class="col-sm-4 control-label is-required">常住地公安机关：</label> <div class="mt-4">
<div class="col-sm-8"> <div v-if="uploadedFiles.length === 0" class="py-10 text-center border-2 border-dashed border-gray-300 rounded-lg">
<input name="residentBureau" required class="form-control" readonly th:field="*{residentBureau}" placeholder="请输入常住地公安机关" type="text"> <i class="fa-solid fa-cloud-upload-alt text-4xl text-gray-400 mb-3"></i>
<p class="text-gray-500">暂无上传文件</p>
</div>
<div v-else class="space-y-3">
<div v-for="(file, index) in uploadedFiles" :key="index" class="flex items-center p-3 bg-gray-50 rounded-lg hover:bg-gray-100 transition-colors duration-200">
<div class="flex-shrink-0 mr-4">
<i :class="getFileIcon(file.fileName)" class="text-2xl"></i>
</div>
<div class="flex-grow min-w-0" style="height: 20px">
<p style="height: 100%;line-height: 20px" class="text-sm font-medium text-gray-900 truncate">{{ file.fileName }}</p>
</div>
<div class="flex-shrink-0 ml-4">
<button v-if="isImageFile(file.fileName)" @click="previewFile(file)" class="text-primary hover:text-primary/80 mr-3">
<i class="fa-solid fa-eye"></i>
</button>
<button @click="downloadFile(file)" class="text-primary hover:text-primary/80 mr-3">
<i class="fa-solid fa-download"></i>
</button>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div>
<div class="col-sm-6"> <div class="row mt-6">
<div class="form-group"> <div class="col-sm-offset-5 col-sm-10" style="display: flex;">
<label class="col-sm-4 control-label is-required">单位及职务职称：</label> <button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>关 闭
<div class="col-sm-8"> </button>
<input name="positionCapacity" required class="form-control" readonly th:field="*{positionCapacity}" placeholder="请输入单位及职务职称" type="text">
</div> </div>
</div> </div>
</div> </div>
</div> <!-- 图片预览模态框 -->
<div class="row"> <div v-if="previewModalVisible" class="fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50">
<div class="col-sm-6"> <div class="bg-white rounded-lg max-w-4xl w-full max-h-[90vh] overflow-auto">
<div class="form-group"> <div class="p-4 flex justify-between items-center border-b">
<label class="col-sm-4 control-label is-required">已（拟）任涉密岗位：</label> <h3 class="text-lg font-medium text-gray-900">{{ previewingFile.fileName }}</h3>
<div class="col-sm-8"> <button @click="closePreviewModal" class="text-gray-500 hover:text-gray-700">
<input name="smPost" required class="form-control" readonly th:field="*{smPost}" placeholder="请输入已（拟）任涉密岗位" type="text"> <i class="fa-solid fa-times"></i>
</button>
</div> </div>
</div> <div class="p-4 flex justify-center">
</div> <img :src="getPreviewUrl(previewingFile)" alt="预览图" class="max-w-full max-h-[70vh] object-contain">
<div class="col-sm-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">涉密等级：</label>
<div class="col-sm-8">
<input name="smGrade" required class="form-control" readonly th:field="*{smGrade}" placeholder="请输入涉密等级" type="text">
</div> </div>
</div> <div class="p-4 border-t flex justify-end">
</div> <button @click="closePreviewModal" 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">
</div> <i class="fa-solid fa-times mr-2"></i> 关闭
<div class="row"> </button>
<div class="form-group">
<label class="col-sm-2 control-label is-required">照片：</label>
<br/>
<div class="fileinput fileinput-new" data-provides="fileinput">
<div class="fileinput-new thumbnail" style="width: 140px; height: 140px;">
<img th:src="*{photoUrl}">
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</main>
</form>
</div> </div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: select2-js"/>
<th:block th:include="include :: jasny-bootstrap-js"/>
<th:block th:include="include :: element-js"/>
<script type="text/javascript" th:inline="javascript">
var prefix = ctx + "system/auditList";
new Vue({
el: '#app',
data: {
formData: {
name: '',
sex: '',
nationa: '',
formerName: '',
nationality: '',
maritalStatus: '',
political: '',
phone: '',
cerno: '',
address: '',
registeredAuthority: '',
permanentAddress: '',
residentBureau: '',
positionCapacity: '',
smPost: '',
smGrade: '',
photoUrl: '',
applyId: '',
},
selectedFile: null,
// 新增文件上传相关数据
uploadedFiles: [],
previewModalVisible: false,
previewingFile: {},
prefix: ctx + "system/auditList",
// 退回相关数据
rejectDialogVisible: false,
rejectReason: '',
},
computed: {
previewUrl() {
return this.selectedFile ? window.URL.createObjectURL(this.selectedFile) : '';
}
},
methods: {
downloadFile(file) {
// 直接通过接口下载
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');
link.href = url;
link.setAttribute('download', file.fileName);
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
})
.catch(error => {
console.error('下载错误:', error);
alert('下载文件时出错');
});
},
// 获取已上传文件
getUploadedFiles() {
if (!this.formData.applyId) return;
axios.get(ctx + 'system/file/getFileInfo', {
params: {
applyId: this.formData.applyId,
}
})
.then(response => {
if (response.data.code === web_status.SUCCESS) {
this.uploadedFiles = response.data.data.map((file)=>{
return {
id: file.fileId,
fileName: file.fileName,
fileSize: file.fileSize,
fileType: file.fileType,
fileUrl: file.filePath,
uploadTime: file.createTime
}
})
}
})
.catch(error => {
console.error('获取文件列表错误:', error);
alert('获取已上传文件时出错');
});
},
// 新增图片预览相关方法
isImageFile(fileName) {
const imageExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp','pdf'];
const extension = fileName.split('.').pop().toLowerCase();
return imageExtensions.includes(extension);
},
getFileIcon(fileName) {
const 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();
if (extension === 'pdf') {
window.open(file.fileUrl);
return
}
this.previewingFile = file;
this.previewModalVisible = true;
},
closePreviewModal() {
this.previewModalVisible = false;
this.previewingFile = {};
},
getPreviewUrl(file) {
// 如果是图片，直接返回URL
if (this.isImageFile(file.fileName)) {
return ctx + 'system/file/download?fileId=' + file.id;
}
return '';
}
},
mounted() {
// 从后端获取转义后的 JSON 字符串
if ([[${applyInfoList}]]){
this.formData = {...[[${applyInfoList}]]}
// 获取图片并转换为 Blob
if (this.formData.photoUrl) {
fetch(this.formData.photoUrl)
.then(response => response.blob())
.then(blob => {
this.selectedFile = blob;
})
.catch(error => console.error('处理图片时出错:', error));
}
}
<div class="row"> // 获取已上传文件
<div class="col-sm-offset-5 col-sm-10"> this.getUploadedFiles();
<button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>关 闭 </button> }
</div> });
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: select2-js" />
<th:block th:include="include :: jasny-bootstrap-js" />
<script>
var prefix = ctx + "system/applyList";
</script> </script>
</body> </body>
</html> </html>

410
ruoyi-admin/src/main/resources/templates/system/newdev/promise/editPromise.html
Unescape View File

@ -0,0 +1,410 @@
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
<th:block th:include="include :: header('保密承诺书')"/>
<th:block th:include="include :: select2-css"/>
<th:block th:include="include :: datetimepicker-css"/>
<th:block th:include="include :: jasny-bootstrap-css"/>
<th:block th:include="include :: element-css"/>
<link href="/file/pdf/test.css" rel="stylesheet">
<script src="/file/pdf/tailwindcss.js"></script>
<!-- Tailwind配置 -->
<script>
tailwind.config = {
theme: {
extend: {
colors: {
primary: '#3b82f6',
secondary: '#64748b',
accent: '#0ea5e9',
neutral: '#f1f5f9',
'neutral-dark': '#334155',
},
fontFamily: {
sans: ['Inter', 'system-ui', 'sans-serif'],
},
}
}
}
</script>
<style type="text/tailwindcss">
@layer utilities {
.content-auto {
content-visibility: auto;
}
.shadow-soft {
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}
.transition-custom {
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
}
.text-sm {
font-size: 1.4rem;
}
.text-base {
font-size: 1.4rem;
}
.text-xs {
font-size: 0.85rem;
}
.py-2 {
padding-top: 0.8rem;
padding-bottom: 0.8rem;
}
.space-y-3{
margin-bottom: 1.5rem;
}
.form-horizontal .control-label {
text-align: left;
}
.el-date-editor{
width: 100% !important;
}
</style>
</head>
<body class="bg-gray-50 font-sans">
<div class="main-content min-h-screen flex flex-col" id="app">
<main class="flex-grow container mx-auto px-4 py-8" style="max-width: 100%;">
<div class="max-w-10xl mx-auto" style="width: 100%;">
<div class="bg-white rounded-xl shadow-soft p-6 mb-8 scale-hover">
<!-- 模版下载按钮 -->
<div class="row mt-6">
<a :href="pdfUrl" download="保密承诺书.pdf" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-primary hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary transition-colors duration-200">
<i class="fa-solid fa-download mr-2"></i> 下载保密承诺书
</a>
</div>
<!-- 材料上传区域 -->
<h4 class="form-header h4 mt-8">材料上传</h4>
<div class="mt-6">
<div class="flex items-center justify-between mb-4">
<div class="relative">
<label for="fileUpload" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-primary hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary cursor-pointer transition-colors duration-200">
<i class="fa-solid fa-upload mr-2"></i> 选择文件
<input id="fileUpload" type="file" class="sr-only" accept=".pdf,.doc,.docx,.jpg,.jpeg,.png,.gif,.bmp" @change="handleFileSelection">
</label>
</div>
</div>
<!-- 上传进度条 -->
<div v-if="uploadProgress > 0 && uploadProgress < 100" class="mb-4">
<div class="flex justify-between text-sm mb-1">
<span class="text-gray-700">上传中: {{ currentFileName }}</span>
<span class="text-gray-500">{{ uploadProgress }}%</span>
</div>
<div class="w-full bg-gray-200 rounded-full h-2">
<div class="bg-primary h-2 rounded-full" :style="{ width: uploadProgress + '%' }"></div>
</div>
</div>
<!-- 文件列表 -->
<div class="mt-4">
<div v-if="uploadedFiles.length === 0" class="py-10 text-center border-2 border-dashed border-gray-300 rounded-lg">
<i class="fa-solid fa-cloud-upload-alt text-4xl text-gray-400 mb-3"></i>
<p class="text-gray-500">暂无上传文件</p>
</div>
<div v-else class="space-y-3">
<div v-for="(file, index) in uploadedFiles" :key="index" class="flex items-center p-3 bg-gray-50 rounded-lg hover:bg-gray-100 transition-colors duration-200">
<div class="flex-shrink-0 mr-4">
<i :class="getFileIcon(file.fileName)" class="text-2xl"></i>
</div>
<div class="flex-grow min-w-0" style="height: 20px">
<p style="height: 100%;line-height: 20px" class="text-sm font-medium text-gray-900 truncate">{{ file.fileName }}</p>
</div>
<div class="flex-shrink-0 ml-4">
<button v-if="isImageFile(file.fileName)" @click="previewFile(file)" class="text-primary hover:text-primary/80 mr-3">
<i class="fa-solid fa-eye"></i>
</button>
<button @click="downloadFile(file)" class="text-primary hover:text-primary/80 mr-3">
<i class="fa-solid fa-download"></i>
</button>
<button @click="deleteFile(file, index)" class="text-red-500 hover:text-red-700">
<i class="fa-solid fa-trash"></i>
</button>
</div>
</div>
</div>
</div>
</div>
<div class="row mt-6">
<div class="col-sm-offset-5 col-sm-10" style="display: flex;">
<button type="button" class="btn btn-sm btn-primary" @click="submitHandler"><i class="fa fa-check"></i>提 交</button>&nbsp;
<button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>关 闭</button>
</div>
</div>
</div>
<!-- 上传成功提示 -->
<div v-if="uploadSuccess" class="fixed bottom-4 right-4 bg-green-500 text-white px-6 py-3 rounded-lg shadow-lg transform transition-all duration-500 translate-y-0 opacity-100">
<div class="flex items-center">
<i class="fa-solid fa-check-circle mr-2"></i>
<span>{{ uploadSuccessMessage }}</span>
</div>
</div>
<!-- 图片预览模态框 -->
<div v-if="previewModalVisible" class="fixed inset-0 bg-black bg-opacity-90 flex items-center justify-center z-50">
<div class="bg-white rounded-lg max-w-4xl w-full max-h-[90vh] overflow-auto">
<div class="p-4 flex justify-between items-center border-b">
<h3 class="text-lg font-medium text-gray-900">{{ previewingFile.fileName }}</h3>
<button @click="closePreviewModal" class="text-gray-500 hover:text-gray-700">
<i class="fa-solid fa-times"></i>
</button>
</div>
<div class="p-4 flex justify-center">
<img :src="getPreviewUrl(previewingFile)" alt="预览图" class="max-w-full max-h-[70vh] object-contain">
</div>
<div class="p-4 border-t flex justify-end">
<button @click="closePreviewModal" 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>
</main>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: select2-js"/>
<th:block th:include="include :: datetimepicker-js"/>
<th:block th:include="include :: jasny-bootstrap-js"/>
<th:block th:include="include :: element-js"/>
<script type="text/javascript" th:inline="javascript">
var prefix = ctx + "system/promiseList";
new Vue({
el: '#app',
data: {
formData: {
name: '',
deptName: '',
trainPost: '',
trainTime: '',
trainAddress: '',
organizeDept: '',
eductTime: '',
organizeMsg: '',
eductContent: '',
remark: '',
applyId: '',
},
// 新增文件上传相关数据
selectedFiles: null,
currentFileName: '',
uploadProgress: 0,
uploadedFiles: [],
previewModalVisible: false,
previewingFile: {},
uploadSuccess: false,
uploadSuccessMessage: '',
prefix: ctx + "system/promiseList",
pdfUrl:'/file/pdfFiles/保密承诺书.pdf',
},
methods: {
// 新增文件上传相关方法
handleFileSelection(event) {
this.selectedFiles = event.target.files;
if (this.selectedFiles && this.selectedFiles.length > 0) {
// 只处理第一个文件
let 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)) {
this.$message.error('请上传PDF、Word文档或图片文件');
return;
}
this.uploadFile(file);
}
},
uploadFile(file) {
this.currentFileName = file.name;
this.uploadProgress = 0;
let formData = new FormData();
formData.append('applyId', this.formData.applyId || '');
formData.append('filename', file.name);
formData.append('fileCode', 'bm_user_cls_003');
formData.append('file', file);
axios.post(ctx + 'system/file/upload', formData, {
onUploadProgress: (progressEvent) => {
this.uploadProgress = Math.round((progressEvent.loaded * 100) / progressEvent.total);
}
})
.then(response => {
if (response.data.code === web_status.SUCCESS) {
// 显示上传成功提示
this.uploadSuccess = true;
this.uploadSuccessMessage = `文件 "${file.name}" 上传成功`;
// 3秒后隐藏提示
setTimeout(() => {
this.uploadSuccess = false;
}, 3000);
// 更新文件列表
let fileInfo = {
id: response.data.data.fileId,
fileName: file.name,
fileSize: file.size,
fileType: file.type,
fileUrl: file.filePath,
uploadTime: new Date().toISOString()
};
this.uploadedFiles.push(fileInfo);
// 重置选择框
document.getElementById('fileUpload').value = '';
} else {
this.$message.error(`上传失败: ${response.data.msg}`);
}
})
.catch(error => {
console.error('上传错误:', error);
this.$message.error('上传过程中发生错误');
});
},
downloadFile(file) {
// 直接通过接口下载
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');
link.href = url;
link.setAttribute('download', file.fileName);
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
})
.catch(error => {
console.error('下载错误:', error);
this.$message.error('下载文件时出错');
});
},
submitHandler() {
if (this.uploadedFiles.length == 0) {
this.$message.warning('请上传保密承诺书');
return;
}
this.$confirm('确认提交吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
$.operate.saveTab(`${this.prefix}/submitPromise`,{applyId:this.formData.applyId});
}).catch(() => {
this.$message({
type: 'info',
message: '已取消'
});
});
},
deleteFile(file, index) {
this.$confirm(`确定要删除文件 "${file.fileName}" 吗？`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
axios.get(ctx + 'system/file/delFile/' + file.id)
.then(response => {
if (response.data.code === web_status.SUCCESS) {
this.uploadedFiles.splice(index, 1);
this.$message.success('文件已成功删除');
} else {
this.$message.error(`删除失败: ${response.data.msg}`);
}
})
.catch(error => {
console.error('删除错误:', error);
this.$message.error('删除文件时出错');
});
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
// 获取已上传文件
getUploadedFiles() {
if (!this.formData.applyId) return;
axios.get(ctx + 'system/file/getFileInfo', {
params: {
applyId: this.formData.applyId,
fileCode: 'bm_user_cls_003',
}
})
.then(response => {
if (response.data.code === web_status.SUCCESS) {
this.uploadedFiles = response.data.data.map((file)=>{
return {
id: file.fileId,
fileName: file.fileName,
fileSize: file.fileSize,
fileType: file.fileType,
fileUrl: file.filePath,
uploadTime: file.createTime
}
})
}
})
.catch(error => {
console.error('获取文件列表错误:', error);
this.$message.error('获取已上传文件时出错');
});
},
// 新增图片预览相关方法
isImageFile(fileName) {
const imageExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp','pdf'];
const extension = fileName.split('.').pop().toLowerCase();
return imageExtensions.includes(extension);
},
getFileIcon(fileName) {
const 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();
if (extension === 'pdf') {
window.open(file.fileUrl);
return
}
this.previewingFile = file;
this.previewModalVisible = true;
},
closePreviewModal() {
this.previewModalVisible = false;
this.previewingFile = {};
},
getPreviewUrl(file) {
// 如果是图片，直接返回URL
if (this.isImageFile(file.fileName)) {
return ctx + 'system/file/download?fileId=' + file.id;
}
return '';
},
},
mounted() {
// 从后端获取数据
if ([[${applyInfoList}]]){
this.formData = {...[[${applyInfoList}]]}
}
// 获取已上传文件
this.getUploadedFiles();
}
});
</script>
</body>
</html>

3
ruoyi-admin/src/main/resources/templates/system/newdev/promise/promiseList.html
Unescape View File

@ -49,7 +49,8 @@
$(function() { $(function() {
var options = { var options = {
url: prefix + "/list", url: prefix + "/list",
modalName: "人员承诺书提交", modalName: "保密承诺书提交",
detailUrl:prefix + "/editPromise/{id}",
type: 0, type: 0,
columns: [ columns: [
{ {

10
ruoyi-admin/src/main/resources/templates/system/newdev/train/training.html
Unescape View File

@ -199,12 +199,6 @@
<a :href="pdfUrl" download="保密教育培训登记表.pdf" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-primary hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary transition-colors duration-200"> <a :href="pdfUrl" download="保密教育培训登记表.pdf" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-primary hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary transition-colors duration-200">
<i class="fa-solid fa-download mr-2"></i> 下载培训登记表模板 <i class="fa-solid fa-download mr-2"></i> 下载培训登记表模板
</a> </a>
<!-- <button type="button" class="group relative w-full max-w-xs flex justify-center py-3 px-6 border border-transparent text-base font-medium rounded-lg text-white bg-primary hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary transition-all duration-300" @click="downloadTemplate">-->
<!-- <span class="absolute left-0 inset-y-0 flex items-center pl-3" style="margin-right: 5px;">-->
<!-- <i class="fa-solid fa-file-pdf text-white transform group-hover:translate-x-0.5 transition-transform duration-200"></i>-->
<!-- </span>-->
<!-- 下载培训登记表模板-->
<!-- </button>-->
</div> </div>
</form> </form>
@ -537,10 +531,6 @@
} }
return ''; return '';
}, },
downloadTemplate() {
// 从本地下载PDF模板
window.open(ctx + 'system/file/downloadTemplate?templateCode=train_record', '_blank');
},
}, },
mounted() { mounted() {
// 从后端获取数据 // 从后端获取数据

Write Preview
Loading…
Cancel
Save