| | |
| | | <div class="app-container"> |
| | | <h2 class="title-border">添加案卷详细记录</h2> |
| | | <el-form ref="form" :model="form" :rules="rules" label-width="100px"> |
| | | |
| | | <el-row> |
| | | <el-col :span="8"> |
| | | <el-form-item label="文件编号" prop="documentNumber"> |
| | | <el-input ref="documentNumberInput" v-model="form.documentNumber" placeholder="请输入文件编号" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <el-row> |
| | | <el-col :span="8"> |
| | | <el-col :span="16"> |
| | | <el-form-item label="责任者" prop="creator"> |
| | | <el-input v-model="form.creator" placeholder="请输入责任者" /> |
| | | <div class="title-search-wrapper"> |
| | | <el-input |
| | | v-model="form.creator" |
| | | placeholder="请输入责任者" |
| | | @input="handleCreatorInput" |
| | | @focus="showCreatorSuggestions = true" |
| | | @blur="handleCreatorBlur" |
| | | /> |
| | | <!-- 下拉建议框 --> |
| | | <div |
| | | v-if="showCreatorSuggestions && creatorSuggestions.length > 0" |
| | | class="title-suggestions" |
| | | > |
| | | <div |
| | | v-for="(item, index) in creatorSuggestions" |
| | | :key="index" |
| | | class="suggestion-item" |
| | | @mousedown="selectCreatorSuggestion(item)" |
| | | > |
| | | {{ item }} |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | |
| | | <el-col :span="8"> |
| | | <el-col :span="16"> |
| | | <el-form-item label="文件题名" prop="title"> |
| | | <el-input v-model="form.title" placeholder="请输入文件题名" /> |
| | | <div class="title-search-wrapper"> |
| | | <el-input |
| | | v-model="form.title" |
| | | placeholder="请输入文件题名" |
| | | @input="handleTitleInput" |
| | | @focus="showTitleSuggestions = true" |
| | | @blur="handleTitleBlur" |
| | | /> |
| | | <!-- 下拉建议框 --> |
| | | <div |
| | | v-if="showTitleSuggestions && titleSuggestions.length > 0" |
| | | class="title-suggestions" |
| | | > |
| | | <div |
| | | v-for="(item, index) in titleSuggestions" |
| | | :key="index" |
| | | class="suggestion-item" |
| | | @mousedown="selectTitleSuggestion(item)" |
| | | > |
| | | {{ item }} |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | value-format="yyyy-MM-dd" |
| | | placeholder="请选择日期"> |
| | | </el-date-picker> --> |
| | | <el-col :span="8"> |
| | | <el-input v-model="form.date" placeholder="请输入日期" /> |
| | | </el-col> |
| | | <el-input v-model="form.date" placeholder="请输入日期 (格式:yyyy-mm-dd)" style="width: 450px;" /> |
| | | <!-- <div style="color: #999; font-size: 12px; margin-top: 4px;">请输入正确的日期格式:yyyy-mm-dd</div> --> |
| | | </el-form-item> |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | <!-- <el-form-item label="页次" prop="pageOrder"> |
| | | <el-input v-model="form.pageOrder" placeholder="请输入页次" /> |
| | | </el-form-item> --> |
| | |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | |
| | | |
| | | </el-form-item> |
| | | <el-form-item |
| | | label="页号" |
| | | prop="pageNumber" |
| | | v-if=" form.fileStyle !== '其他材料'" |
| | | > |
| | | <el-form-item label="页号" |
| | | prop="pageNumber" |
| | | v-if=" form.fileStyle !== '其他材料'"> |
| | | <el-col :span="8"> |
| | | <el-input |
| | | v-model="form.pageNumber" |
| | | placeholder="请输入页号" |
| | | <el-input |
| | | v-model.number="form.pageNumber" |
| | | placeholder="请输入页号(数字类型)" |
| | | type="number" |
| | | min="1" |
| | | oninput="value=value.replace(/[^\d]/g,'')" style="width: 450px;" |
| | | /></el-col> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="备注" prop="remarks"> |
| | | <el-col :span="8"> |
| | | <el-input v-model="form.remarks" placeholder="请输入备注" /> |
| | | </el-col> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="公开属性" prop="publicity"> |
| | | <el-select |
| | | v-model="form.publicity" |
| | | placeholder="请选择公开属性" |
| | | clearable |
| | | > |
| | | <el-option |
| | | v-for="item in publicityOptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="是否为附件" prop="isAttachment"> |
| | | <el-select |
| | | v-model="form.isAttachment" |
| | | placeholder="请选择是否为附件" |
| | | > |
| | | <el-option |
| | | v-for="item in isAttachmentOptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | |
| | | <el-form-item label="所处阶段" prop="stage"> |
| | | <el-select |
| | | v-model="form.stage" |
| | |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="公开属性" prop="publicity"> |
| | | |
| | | <el-form-item label="密级" prop="securityLevel"> |
| | | <el-select |
| | | v-model="form.publicity" |
| | | placeholder="请选择公开属性" |
| | | v-model="form.securityLevel" |
| | | placeholder="请选择密级" |
| | | > |
| | | <el-option |
| | | v-for="item in publicityOptions" |
| | | v-for="item in securityLevelOptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="是否为附件" prop="isAttachment"> |
| | | <el-select |
| | | v-model="form.isAttachment" |
| | | placeholder="请选择是否为附件" |
| | | > |
| | | <el-option |
| | | v-for="item in isAttachmentOptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="保管期限" prop="retentionPeriod"> |
| | | <el-select |
| | |
| | | </el-form-item> |
| | | |
| | | <!-- 对话框表单中的密级 --> |
| | | <el-form-item label="密级" prop="securityLevel"> |
| | | <el-select |
| | | v-model="form.securityLevel" |
| | | placeholder="请选择密级" |
| | | > |
| | | <el-option |
| | | v-for="item in securityLevelOptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | |
| | | |
| | | |
| | |
| | | <el-button type="primary" @click="resetForms">重置</el-button> |
| | | |
| | | <el-button @click="cancel">取 消</el-button> |
| | | |
| | | |
| | | <el-button type="warning" @click="cancelAuthUser">退回管理员</el-button> |
| | | |
| | | </div> |
| | | |
| | | |
| | |
| | | |
| | | |
| | | |
| | | <el-row :gutter="10" class="mb8"> |
| | | <el-row :gutter="12" class="mb8 fixed-row"> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="primary" |
| | |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="warning" |
| | | plain |
| | | icon="el-icon-download" |
| | | size="mini" |
| | | @click="handleExport" |
| | | v-hasPermi="['system:materials:list']" |
| | | |
| | | >导出</el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="danger" |
| | | plain |
| | | icon="el-icon-delete" |
| | |
| | | v-hasPermi="['system:materials:remove']" |
| | | >删除</el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="warning" |
| | | plain |
| | | icon="el-icon-download" |
| | | size="mini" |
| | | @click="handleExport" |
| | | v-hasPermi="['system:materials:export']" |
| | | >导出</el-button> |
| | | |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="success" |
| | |
| | | @click="handleImport" |
| | | v-hasPermi="['system:materials:edit']" |
| | | >全部附件导入</el-button> |
| | | |
| | | |
| | | <!-- 在按钮下方添加导入对话框 --> |
| | | <el-dialog title="批量导入附件" :visible.sync="importDialogVisible" width="50%"> |
| | | <el-upload |
| | | class="upload-demo" |
| | | ref="upload" |
| | | :action="uploadUrl" |
| | | :headers="headers" |
| | | :data="uploadParams" |
| | | :headers="headers" |
| | | :data="uploadParams" |
| | | :on-success="handleSuccess" |
| | | :on-error="handleError" |
| | | :on-preview="handlePreview" |
| | | :on-remove="handleRemove" |
| | | :file-list="fileList" |
| | | :on-change="handleFileChange" |
| | | :auto-upload="false" |
| | | multiple |
| | | accept=".jpg,.png" |
| | | > |
| | | <el-button slot="trigger" size="small" type="primary">选择文件</el-button> |
| | | <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">上传到服务器</el-button> |
| | | <div slot="tip" class="el-upload__tip">可上传PDF/DOC/XLS/JPG等格式文件,单个文件不超过50MB</div> |
| | | <el-button style="margin-left: 10px;" size="small" type="danger" @click="clearFileList">清空列表</el-button> |
| | | <div slot="tip" class="el-upload__tip">可上传JPG等格式文件,单个文件不超过50MB</div> |
| | | </el-upload> |
| | | </el-dialog> |
| | | </el-col> |
| | | |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="warning" |
| | | plain |
| | | icon="el-icon-download" |
| | | size="mini" |
| | | @click="handleExportTemplate" |
| | | v-hasPermi="['system:materials:edit']" |
| | | >导入模板下载</el-button> |
| | | </el-col> |
| | | |
| | | <el-col :span="1.5"> |
| | | |
| | | <el-upload |
| | | action="" |
| | | |
| | | class="upload-demo" |
| | | :show-file-list="false" |
| | | :http-request="handleImportData" |
| | | accept=".xlsx,.xls" |
| | | |
| | | > |
| | | <el-button size="mini" type="primary" |
| | | plain |
| | | icon="el-icon-top">导入</el-button> |
| | | |
| | | </el-upload> |
| | | </el-col> |
| | | <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> |
| | | </el-row> |
| | | |
| | | <el-table v-loading="loading" :data="materialsList" @selection-change="handleSelectionChange"> |
| | | <el-table-column type="selection" width="55" align="center" /> |
| | | <el-table-column label="操作" align="center" width="160" class-name="small-padding "> |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-edit" |
| | | @click="handleUpdate(scope.row)" |
| | | v-hasPermi="['system:materials:edit']" |
| | | >修改</el-button> |
| | | <!-- <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-edit" |
| | | @click="handleUpdate(scope.row)" |
| | | v-hasPermi="['system:materials:edit']" |
| | | >导入附件</el-button> --> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-delete" |
| | | @click="handleDelete(scope.row)" |
| | | v-hasPermi="['system:materials:remove']" |
| | | >删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="文件材料序号" align="center" prop="fileNumber" /> |
| | | <el-table-column label="文件编号" align="center" prop="documentNumber" /> |
| | | |
| | | <el-table-column label="责任者" align="center" prop="creator" /> |
| | | <el-table-column label="文件题名" align="center" prop="title" /> |
| | |
| | | <span>{{ parseTime(scope.row.date, '{y}-{m}-{d}') }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="页号" sortable align="center" prop="pageNumber" /> |
| | | <el-table-column label="页次" sortable align="center" prop="pageOrder" /> |
| | | <el-table-column label="页号" sortable align="center" prop="pageNumber" /> |
| | | <el-table-column label="备注" align="center" prop="remarks" /> |
| | | <el-table-column label="页次" sortable align="center" prop="pageOrder" /> |
| | | |
| | | <el-table-column label="所处阶段" sortable align="center" prop="stage" /> |
| | | <el-table-column label="公开属性" sortable align="center" prop="publicity" /> |
| | | <el-table-column label="所处阶段" sortable align="center" width="180" prop="stage" /> |
| | | <el-table-column label="公开属性" sortable align="center" width="180" prop="publicity" /> |
| | | <el-table-column label="是否为附图及附件" align="center" prop="isAttachment" /> |
| | | |
| | | <el-table-column label="保管期限" align="center" prop="retentionPeriod" /> |
| | | <el-table-column label="密级" align="center" prop="securityLevel" /> |
| | | <el-table-column label="材料类型" align="fileStyle" prop="fileStyle" /> |
| | | |
| | | <el-table-column label="是否涉密及敏感信息" align="center" prop="isSensitive" /> |
| | | <el-table-column label="是否注销" align="center" prop="isCanceled" /> |
| | | <el-table-column label="格式" align="center" prop="format" /> |
| | |
| | | <el-table-column label="宽度" align="center" prop="width" /> |
| | | <el-table-column label="高度" align="center" prop="height" /> |
| | | <el-table-column label="大小" align="center" prop="fileSize" /> |
| | | <el-table-column label="附件及历史发问号" align="center" prop="attachmentHistoryNumbers" /> |
| | | <el-table-column label="附件及历史发文号" align="center" prop="attachmentHistoryNumbers" /> |
| | | |
| | | <el-table-column label="操作" align="center" width="160" class-name="small-padding "> |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-edit" |
| | | @click="handleUpdate(scope.row)" |
| | | v-hasPermi="['system:materials:edit']" |
| | | >修改</el-button> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-edit" |
| | | @click="handleUpdate(scope.row)" |
| | | v-hasPermi="['system:materials:edit']" |
| | | >导入附件</el-button> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-delete" |
| | | @click="handleDelete(scope.row)" |
| | | v-hasPermi="['system:materials:remove']" |
| | | >删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | |
| | | |
| | | </el-table> |
| | | |
| | | <pagination |
| | |
| | | :limit.sync="queryParams.pageSize" |
| | | @pagination="getList" |
| | | /> |
| | | |
| | | |
| | | |
| | | <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body> |
| | | |
| | | <el-form ref="forms" :model="forms" :rules="rules" label-width="100px"> |
| | | |
| | | |
| | | <el-form-item label="文件编号" prop="documentNumber"> |
| | | <el-input v-model="forms.documentNumber" placeholder="请输入文件编号" /> |
| | | </el-form-item> |
| | | <el-row> |
| | | <el-col :span="8"> |
| | | 8<el-form-item label="责任者" prop="creator"> |
| | | <el-col :span="16"> |
| | | <el-form-item label="责任者" prop="creator"> |
| | | <el-input v-model="forms.creator" placeholder="请输入责任者" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item label="文件题名" prop="title"> |
| | | <el-input v-model="forms.title" placeholder="请输入文件题名" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | |
| | | </el-row> |
| | | <el-form-item label="文件题名" prop="title"> |
| | | <el-input v-model="forms.title" placeholder="请输入文件题名" /> |
| | | </el-form-item> |
| | | <el-form-item label="日期" prop="date"> |
| | | <el-input v-model="forms.date" placeholder="请输入日期 (格式:yyyy-mm-dd)" style="width: 200px;" /> |
| | | <!-- <el-date-picker clearable |
| | | v-model="forms.date" |
| | | type="date" |
| | | type="date" |
| | | value-format="yyyy-MM-dd" |
| | | placeholder="请选择日期"> |
| | | </el-date-picker> --> |
| | | |
| | | <el-input v-model="forms.date" placeholder="请输入日期" prop="date"/> |
| | | |
| | | </el-form-item> |
| | | <!-- <el-form-item label="页次" prop="pageOrder"> |
| | | <el-input v-model="forms.pageOrder" placeholder="请输入页次" /> |
| | | </el-form-item> --> |
| | | <el-form-item label="文字材料" prop="fileStyle"> |
| | | <el-form-item label="材料类型" prop="fileStyle"> |
| | | <el-select |
| | | v-model="forms.fileStyle" |
| | | |
| | | placeholder="请选择文字材料" |
| | | placeholder="请选择材料类型" |
| | | clearable |
| | | > |
| | | <el-option |
| | |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | |
| | | <el-form-item label="页号" prop="pageNumber"> |
| | | <el-col :span="8"> |
| | | <el-input |
| | | v-model.number="forms.pageNumber" |
| | | placeholder="请输入页号(数字类型)" |
| | | clearable |
| | | type="number" |
| | | min="1" |
| | | oninput="value=value.replace(/[^\d]/g,'')" |
| | | @keyup.enter.native="handleQuery" |
| | | /> |
| | | </el-col> |
| | | </el-form-item> |
| | | <el-form-item label="备注" prop="remarks"> |
| | | <el-input v-model="forms.remarks" placeholder="请输入备注" /> |
| | | </el-form-item> |
| | | <el-form-item label="所处阶段" prop="stage"> |
| | | <el-select |
| | | v-model="forms.stage" |
| | |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="日期" prop="date"> |
| | | <el-date-picker clearable |
| | | <el-input v-model="queryParams.date" placeholder="请输入日期 (格式:yyyy-mm-dd)" /> |
| | | <div style="color: #999; font-size: 12px; margin-top: 4px;">请输入正确的日期格式:yyyy-mm-dd</div> |
| | | <!-- <el-date-picker clearable |
| | | v-model="queryParams.date" |
| | | type="date" |
| | | value-format="yyyy-MM-dd" |
| | | placeholder="请选择日期"> |
| | | </el-date-picker> |
| | | </el-date-picker> --> |
| | | </el-form-item> |
| | | <el-form-item label="页号" prop="pageNumber"> |
| | | <el-input |
| | | v-model="queryParams.pageNumber" |
| | | placeholder="请输入页号" |
| | | clearable |
| | | @keyup.enter.native="handleQuery" |
| | | /> |
| | | <!-- <el-form-item label="页号" prop="pageNumber"> |
| | | <el-col :span="8"> |
| | | <el-input |
| | | v-model.number="queryParams.pageNumber" |
| | | placeholder="请输入页号(数字类型)" |
| | | clearable |
| | | type="number" |
| | | min="1" |
| | | oninput="value=value.replace(/[^\d]/g,'')" |
| | | @keyup.enter.native="handleQuery" |
| | | /> |
| | | </el-col> |
| | | </el-form-item> |
| | | <el-form-item label="页次" prop="pageOrder"> |
| | | <el-input |
| | |
| | | clearable |
| | | @keyup.enter.native="handleQuery" |
| | | /> |
| | | </el-form-item> |
| | | </el-form-item> --> |
| | | <el-form-item label="文字材料" prop="fileStyle"> |
| | | <el-select |
| | | v-model="queryParams.fileStyle" |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { listMaterials, getMaterials, delMaterials, addMaterials, updateMaterials } from "@/api/system/materials" |
| | | import { islegal, listMaterials, enload, getMaterials, delMaterials, addMaterials, updateMaterials } from "@/api/system/materials" |
| | | import { getToken } from '@/utils/auth' |
| | | import store from '@/store' |
| | | import { updateStatusById } from "@/api/system/records" |
| | | |
| | | import {delArchiverecordstouserByReIdAndUid} from "@/api/system/archiverecordstouser" |
| | | export default { |
| | | name: "Materials", |
| | | data() { |
| | | return { |
| | | // 记录元素初始位置和状态 |
| | | originalOffsetLeft: 0, |
| | | originalWidth: 0, |
| | | placeholderEl: null, |
| | | |
| | | importDialogVisible: false, |
| | | fileList: [], |
| | | uploadUrl: process.env.VUE_APP_BASE_API +'/system/materials/upload', // 替换为实际的上传接口 |
| | | uploadUrl: process.env.VUE_APP_BASE_API +'/system/materials/upload/'+this.recordId, // 替换为实际的上传接口 |
| | | headers: { |
| | | Authorization: 'Bearer ' + getToken() |
| | | }, |
| | | }, |
| | | uploadParams: { |
| | | type: 'material' // 自定义上传类型 |
| | | }, |
| | |
| | | // 添加密级选项 |
| | | securityLevelOptions: [ |
| | | { value: '秘密', label: '秘密' }, |
| | | { value: '普通', label: '普通' } |
| | | { value: '普通', label: '普通' }, |
| | | { value: '该页另存', label: '该页另存' }, |
| | | { value: '内部用途', label: '内部用途' }, |
| | | { value: '内部用图', label: '内部用图' }, |
| | | ], |
| | | // 添加保管期限选项 |
| | | retentionPeriodOptions: [ |
| | |
| | | materialsList: [], |
| | | // 弹出层标题 |
| | | title: "", |
| | | // 文件题名搜索相关 |
| | | titleSuggestions: [], // 匹配的文件题名建议列表 |
| | | showTitleSuggestions: false, // 是否显示建议框 |
| | | titleSearchTimer: null, // 防抖定时器 |
| | | creatorSuggestions: [], // 匹配的责任人建议列表 |
| | | showCreatorSuggestions: false, // 是否显示责任人建议框 |
| | | creatorSearchTimer: null, // 责任人查询防抖定时器 |
| | | // 是否显示弹出层 |
| | | open: false, |
| | | titles: "", |
| | |
| | | // 表单校验 |
| | | rules: { |
| | | creator: [ |
| | | { required: true, message: "创建者不能为空", trigger: "blur" } |
| | | // { required: true, message: "创建者不能为空", trigger: "blur" } |
| | | ], |
| | | title: [ |
| | | { required: true, message: "案卷题名不能为空", trigger: "blur" } |
| | | ], |
| | | date: [ |
| | | { required: true, message: "日期不能为空", trigger: "blur" } |
| | | // { required: true, message: "日期不能为空", trigger: "blur" }, |
| | | { pattern: /^\d{4}-\d{2}-\d{2}$/, message: "日期格式必须为yyyy-mm-dd", trigger: "blur" } |
| | | ], |
| | | pageNumber: [ |
| | | { required: true, message: "页号不能为空", trigger: "blur" }, |
| | | { type: 'number', message: '页号必须为数字类型', trigger: ['blur', 'change'] }, |
| | | { pattern: /^\d+$/, message: '请输入正整数', trigger: 'blur' } |
| | | ], |
| | | stage: [ |
| | | { required: true, message: "所处阶段不能为空", trigger: "change" } |
| | | ] |
| | | } |
| | | } |
| | | }, |
| | | |
| | | |
| | | |
| | | mounted() { |
| | | // 添加滚动事件监听 |
| | | window.addEventListener('scroll', this.handleScroll); |
| | | // 改为监听keydown事件 |
| | | document.addEventListener('keydown', this.handleKeyDown) |
| | | }, |
| | | beforeDestroy() { |
| | | // 移除滚动事件监听 |
| | | |
| | | document.removeEventListener('keydown', this.handleKeyDown) |
| | | // 移除滚动事件监听 |
| | | window.removeEventListener('scroll', this.handleScroll); |
| | | // 清理占位符 |
| | | if (this.placeholderEl && this.placeholderEl.parentNode) { |
| | | this.placeholderEl.parentNode.removeChild(this.placeholderEl); |
| | | } |
| | | }, |
| | | created() { |
| | | //const roleId = this.$route.params && this.$route.params.roleId |
| | | const recordId = this.$route.params && this.$route.params.recordId |
| | | //alert(recordId) |
| | | this.recordId = recordId; |
| | | |
| | | this.uploadUrl = process.env.VUE_APP_BASE_API +'/system/materials/upload/'+this.recordId |
| | | // alert('Bearer ' + getToken()) |
| | | this.reset() |
| | | this.form.securityLevel = '普通' // 设置对话框表单默认值 |
| | |
| | | this.$refs.upload.clearFiles(); |
| | | // 关闭上传对话框 |
| | | this.importDialogVisible = false; |
| | | // 刷新列表数据 |
| | | this.getList(); // 这里可以调用接口关联上传的文件和当前记录 |
| | | // 刷新列表数据 |
| | | this.getList(); // 这里可以调用接口关联上传的文件和当前记录 |
| | | //更新档案的状态 |
| | | |
| | | } else { |
| | | // alert(234) |
| | | console.log(response) |
| | |
| | | handlePreview(file) { |
| | | console.log(file) |
| | | }, |
| | | handleFileChange(file, fileList) { |
| | | console.log('当前文件列表:', fileList); |
| | | this.fileList = fileList; |
| | | }, |
| | | // 提交上传 |
| | | submitUpload() { |
| | | this.$refs.upload.submit() |
| | | // 获取当前选择的文件数量 |
| | | const fileCount = this.fileList.length |
| | | if (fileCount === 0) { |
| | | this.$modal.msgWarning('请先选择文件再上传') |
| | | return |
| | | } |
| | | if(fileCount!==this.total) |
| | | { |
| | | this.$modal.msgWarning('请选择与记录数一致的文件') |
| | | return |
| | | } |
| | | //判断页号与上传上传的文件的页号是不是一一对应的 |
| | | islegal(this.recordId).then(response => { |
| | | console.log(response.data) |
| | | var res = response.data |
| | | if(res) |
| | | { |
| | | // 执行上传 |
| | | this.$refs.upload.submit() |
| | | this.getList() |
| | | } |
| | | else |
| | | { |
| | | this.$modal.msgError("页号不连续,请修改为连续正确的页号!") |
| | | } |
| | | }) |
| | | |
| | | }, |
| | | clearFileList() { |
| | | this.fileList = []; |
| | | this.$modal.msgSuccess('已清空上传列表'); |
| | | }, |
| | | handleKeyDown(e) { |
| | | // 在keydown事件中更早地阻止默认行为 |
| | |
| | | if ((e.ctrlKey || e.metaKey) && e.key === 'd') { |
| | | e.preventDefault(); |
| | | this.resetForms(); |
| | | } |
| | | if ((e.ctrlKey || e.metaKey) && e.key === 'w') { |
| | | e.preventDefault(); |
| | | this.closeCurrentTab(); |
| | | } |
| | | }, |
| | | /** 查询【请填写功能名称】列表 */ |
| | |
| | | } |
| | | this.resetForm("forms") |
| | | }, |
| | | // 处理文件题名输入事件 |
| | | handleTitleInput() { |
| | | // 清除之前的定时器(防抖) |
| | | if (this.titleSearchTimer) { |
| | | clearTimeout(this.titleSearchTimer); |
| | | } |
| | | |
| | | // 当输入框为空时,清空建议列表 |
| | | if (!this.form.title.trim()) { |
| | | this.titleSuggestions = []; |
| | | return; |
| | | } |
| | | |
| | | // 设置新的定时器,延迟执行查询 |
| | | this.titleSearchTimer = setTimeout(() => { |
| | | this.searchTitleSuggestions(); |
| | | }, 300); |
| | | }, |
| | | |
| | | // 搜索文件题名建议 |
| | | searchTitleSuggestions() { |
| | | // 使用现有的listMaterials API,传入title作为查询参数 |
| | | listMaterials( |
| | | { |
| | | title: this.form.title, |
| | | pageSize: 10 // 限制返回数量 |
| | | }).then(response => { |
| | | console.log(response.data.data) |
| | | // alert(23) |
| | | // 提取并去重title字段 |
| | | const titles = response.data.data.map(item => item.title); |
| | | // 去重处理 |
| | | this.titleSuggestions = [...new Set(titles)]; |
| | | // 显示建议框 |
| | | this.showTitleSuggestions = true; |
| | | }).catch(() => { |
| | | // 错误处理 |
| | | this.titleSuggestions = []; |
| | | }); |
| | | }, |
| | | |
| | | // 处理失焦事件 |
| | | handleTitleBlur() { |
| | | // 延迟隐藏,以便可以点击选择建议项 |
| | | setTimeout(() => { |
| | | this.showTitleSuggestions = false; |
| | | }, 200); |
| | | }, |
| | | |
| | | // 选择建议项 |
| | | selectTitleSuggestion(title) { |
| | | this.form.title = title; |
| | | this.showTitleSuggestions = false; |
| | | }, |
| | | |
| | | // 处理责任人输入事件 |
| | | handleCreatorInput() { |
| | | // 清除之前的定时器(防抖) |
| | | if (this.creatorSearchTimer) { |
| | | clearTimeout(this.creatorSearchTimer); |
| | | } |
| | | |
| | | // 当输入框为空时,清空建议列表 |
| | | if (!this.form.creator.trim()) { |
| | | this.creatorSuggestions = []; |
| | | return; |
| | | } |
| | | |
| | | // 设置新的定时器,延迟执行查询 |
| | | this.creatorSearchTimer = setTimeout(() => { |
| | | this.searchCreatorSuggestions(); |
| | | }, 300); |
| | | }, |
| | | |
| | | // 搜索责任人建议 |
| | | searchCreatorSuggestions() { |
| | | // 使用现有的listMaterials API,传入creator作为查询参数 |
| | | listMaterials( |
| | | { |
| | | creator: this.form.creator, |
| | | pageSize: 10 // 限制返回数量 |
| | | }).then(response => { |
| | | // 提取并去重creator字段 |
| | | const creators = response.data.data.map(item => item.creator).filter(Boolean); |
| | | // 去重处理 |
| | | this.creatorSuggestions = [...new Set(creators)]; |
| | | // 显示建议框 |
| | | this.showCreatorSuggestions = true; |
| | | }).catch(() => { |
| | | // 错误处理 |
| | | this.creatorSuggestions = []; |
| | | }); |
| | | }, |
| | | |
| | | // 处理责任人输入框失焦事件 |
| | | handleCreatorBlur() { |
| | | // 延迟隐藏,以便可以点击选择建议项 |
| | | setTimeout(() => { |
| | | this.showCreatorSuggestions = false; |
| | | }, 200); |
| | | }, |
| | | |
| | | // 选择责任人建议项 |
| | | selectCreatorSuggestion(creator) { |
| | | this.form.creator = creator; |
| | | this.showCreatorSuggestions = false; |
| | | }, |
| | | |
| | | // 表单重置 |
| | | reset() { |
| | | this.form = { |
| | |
| | | }) |
| | | }, |
| | | resetForms() |
| | | { |
| | | { |
| | | this.reset() |
| | | this.form.securityLevel = '普通' // 设置对话框表单默认值 |
| | | this.form.isSensitive = '否' // 设置对话框表单默认值 |
| | | this.form.isCanceled = '否' // 设置对话框表单默认值 |
| | | this.form.isAttachment = '否' // 设置对话框表单默认值 |
| | | this.form.isDiagram = '否' // 设置对话框表单默认值 |
| | | this.form.retentionPeriod = '永久' // 设置对话框表单默认值 |
| | | }, |
| | | this.form.securityLevel = '普通' |
| | | this.form.isSensitive = '否' |
| | | this.form.isCanceled = '否' |
| | | this.form.isAttachment = '否' |
| | | this.form.isDiagram = '否' |
| | | this.form.retentionPeriod = '永久' |
| | | }, |
| | | closeCurrentTab() { |
| | | this.$store.dispatch('tagsView/delView', this.$route) |
| | | this.$router.push('/archiveManager/infoManager') |
| | | }, |
| | | submitForm() |
| | | { |
| | | console.log(this.form) |
| | | this.form.recordId = this.recordId |
| | | console.log("==============+++++++++++++++============") |
| | | |
| | | // 保存当前表单中需要保留的字段值 |
| | | const preservedValues = { |
| | | documentNumber: this.form.documentNumber, |
| | | creator: this.form.creator, |
| | | title: this.form.title, |
| | | date: this.form.date, |
| | | pageNumber: this.form.pageNumber, |
| | | remarks: this.form.remarks, |
| | | stage: this.form.stage // 所处阶段保持跟上一条一致 |
| | | }; |
| | | this.$refs.form.validate(valid => { |
| | | if (valid) { |
| | | addMaterials(this.form).then(response => { |
| | | this.$modal.msgSuccess("新增成功") |
| | | // this.opens = false |
| | | |
| | | |
| | | // 创建新表单,保留特定字段,重置其他字段 |
| | | this.form = { |
| | | materialId: null, |
| | | recordId: this.recordId, |
| | | // 保留的字段 |
| | | documentNumber: preservedValues.documentNumber, |
| | | creator: preservedValues.creator, |
| | | title: preservedValues.title, |
| | | date: preservedValues.date, |
| | | pageNumber: preservedValues.pageNumber, |
| | | remarks: preservedValues.remarks, |
| | | stage: preservedValues.stage, |
| | | // 重置为空的字段 |
| | | publicity: null, |
| | | // 重置为默认值的字段 |
| | | fileStyle: '文字材料', // 材料类型默认为文字材料 |
| | | securityLevel: '普通', // 密级默认为普通 |
| | | isAttachment: '否', // 是否为附件默认为否 |
| | | isSensitive: '否', // 是否敏感默认为否 |
| | | isCanceled: '否', // 是否注销默认为否 |
| | | // 其他需要重置的字段 |
| | | isDiagram: '否', |
| | | retentionPeriod: '永久', |
| | | format: null, |
| | | sizeType: null, |
| | | horizontalResolution: null, |
| | | verticalResolution: null, |
| | | width: null, |
| | | height: null, |
| | | fileSize: null, |
| | | attachmentHistoryNumbers: null, |
| | | createdAt: null, |
| | | updatedAt: null |
| | | }; |
| | | |
| | | // 保存成功后,光标跳回文件编号输入框 |
| | | this.$nextTick(() => { |
| | | this.$refs.documentNumberInput.focus(); |
| | | }); |
| | | this.getList() |
| | | }) |
| | | } |
| | | else |
| | | { |
| | | this.$message.error('请填写所有必填字段'); |
| | | |
| | | } |
| | | }) |
| | | }, |
| | | /** 提交按钮 */ |
| | |
| | | if (this.forms.materialId != null) { |
| | | updateMaterials(this.forms).then(response => { |
| | | this.$modal.msgSuccess("修改成功") |
| | | // 修改成功后,光标跳回文件编号输入框 |
| | | this.$nextTick(() => { |
| | | this.$refs.documentNumberInput.focus(); |
| | | }); |
| | | this.open = false |
| | | this.getList() |
| | | }) |
| | |
| | | this.$modal.msgSuccess("删除成功") |
| | | }).catch(() => {}) |
| | | }, |
| | | /** 导出按钮操作 */ |
| | | /** 导出按钮操作 - 支持导出选中行或全部数据 */ |
| | | handleExport() { |
| | | this.download('system/materials/export', { |
| | | ...this.queryParams |
| | | }, `materials_${new Date().getTime()}.xlsx`) |
| | | } |
| | | // 判断是否有选中的行 |
| | | if (this.ids && this.ids.length > 0) { |
| | | // 显示导出选中行的提示 |
| | | this.$message.info(`正在导出${this.ids.length}条选中的数据...`); |
| | | // 导出选中的行数据 |
| | | this.download('system/materials/export', { |
| | | ids: this.ids.join(','), |
| | | // exportType: 'selected' |
| | | }, `materials_selected_${new Date().getTime()}.xlsx`) |
| | | } else { |
| | | // 显示导出全部数据的提示 |
| | | this.$message.info('正在导出符合当前查询条件的所有数据...'); |
| | | // 没有选中行时,导出当前查询条件的数据 |
| | | this.download('system/materials/export', { |
| | | ...this.queryParams |
| | | }, `materials_${new Date().getTime()}.xlsx`) |
| | | } |
| | | }, |
| | | |
| | | /** 导入模板下载操作*/ |
| | | handleExportTemplate() |
| | | { |
| | | this.download('/system/materials/model', { |
| | | |
| | | }, `materials_${new Date().getTime()}.xlsx`) |
| | | }, |
| | | /** 导入操作*/ |
| | | async handleImportData({file}){ |
| | | // 检查文件类型是否为xlsx |
| | | // if (!params.file.name.endsWith('.xlsx')) { |
| | | // this.$message.error('请上传.xlsx格式的文件'); |
| | | // return; |
| | | // } |
| | | const formData = new FormData(); |
| | | formData.append('file', file); |
| | | // formData.append('recordId', this.recordId) |
| | | // alert(this.recordId) |
| | | console.log(file) |
| | | |
| | | // 显示加载中状态 |
| | | const loading = this.$loading({ |
| | | lock: true, |
| | | text: '上传中...', |
| | | spinner: 'el-icon-loading', |
| | | background: 'rgba(0, 0, 0, 0.7)' |
| | | }); |
| | | |
| | | enload(formData, { |
| | | headers: { |
| | | 'Content-Type': 'multipart/form-data' |
| | | } |
| | | }).then(response => { |
| | | loading.close(); |
| | | this.$message.success('导入成功'); |
| | | this.getList(); |
| | | }).catch(error => { |
| | | loading.close(); |
| | | this.$message.error('导入失败: ' + (error.message || '未知错误')); |
| | | }); |
| | | |
| | | }, |
| | | /** 取消授权按钮操作 */ |
| | | cancelAuthUser(row) { |
| | | const recordId = this.recordId |
| | | var userId = store.state.user.id |
| | | var _this = this |
| | | // alert(userId) |
| | | // alert(userId) |
| | | // alert(this.queryParams.archiveRecordsId) |
| | | // alert(row.sysUser.userName) |
| | | this.$modal.confirm('确认要取消该用户的"' + '' + '"授权吗?').then(function() { |
| | | return delArchiverecordstouserByReIdAndUid({ recordId: recordId, userId: userId }) |
| | | }).then(() => { |
| | | // this.getList() |
| | | //修改案卷的状态 |
| | | // var id = row.id |
| | | var status = '未上传附件' |
| | | updateStatusById(status, recordId).then(response=>{ |
| | | // this.$modal.msgSuccess("提交成功") |
| | | // this.getList() |
| | | _this.$store.dispatch('tagsView/delView', this.$route); |
| | | _this.$router.push('/archiveManager/infoManager') |
| | | _this.$modal.msgSuccess("取消授权成功") |
| | | }) |
| | | |
| | | }).catch(() => {}) |
| | | }, |
| | | |
| | | // 滚动事件处理 |
| | | handleScroll() { |
| | | const fixedRow = document.querySelector('.fixed-row'); |
| | | if (!fixedRow) return; |
| | | |
| | | // 获取元素当前位置信息 |
| | | const rect = fixedRow.getBoundingClientRect(); |
| | | const parentRect = fixedRow.parentNode.getBoundingClientRect(); |
| | | |
| | | // 检查元素是否应该进入悬浮状态 |
| | | if (rect.top <= 0) { |
| | | // 只在不在floating状态时添加,避免重复操作 |
| | | if (!fixedRow.classList.contains('floating')) { |
| | | // 记录元素原始的左偏移量(相对于父容器) |
| | | this.originalOffsetLeft = rect.left - parentRect.left; |
| | | // 记录元素的原始宽度 |
| | | this.originalWidth = rect.width; |
| | | |
| | | // 添加floating类,使元素固定在顶部 |
| | | fixedRow.classList.add('floating'); |
| | | // 设置固定位置时的样式,保持与原始布局一致 |
| | | fixedRow.style.left = this.originalOffsetLeft + 'px'; |
| | | fixedRow.style.width = this.originalWidth + 'px'; |
| | | |
| | | // 添加临时占位符,防止页面布局跳动 |
| | | if (!this.placeholderEl) { |
| | | this.placeholderEl = document.createElement('div'); |
| | | this.placeholderEl.style.height = rect.height + 'px'; |
| | | this.placeholderEl.style.marginBottom = '10px'; |
| | | this.placeholderEl.style.boxSizing = 'border-box'; |
| | | fixedRow.parentNode.insertBefore(this.placeholderEl, fixedRow.nextSibling); |
| | | } |
| | | } |
| | | } else { |
| | | // 当元素回到视口顶部以上时,移除悬浮状态,恢复到文档流中 |
| | | if (fixedRow.classList.contains('floating')) { |
| | | // 移除floating类 |
| | | fixedRow.classList.remove('floating'); |
| | | // 重置样式,让浏览器使用原始样式 |
| | | fixedRow.style.left = ''; |
| | | fixedRow.style.width = ''; |
| | | // 移除占位符,让元素回到原始位置 |
| | | if (this.placeholderEl && this.placeholderEl.parentNode) { |
| | | this.placeholderEl.parentNode.removeChild(this.placeholderEl); |
| | | this.placeholderEl = null; |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | |
| | | } |
| | | } |
| | | </script> |
| | | </script> |
| | | <style scoped> |
| | | .title-search-wrapper { |
| | | position: relative; |
| | | width: 100%; |
| | | } |
| | | |
| | | .title-suggestions { |
| | | position: absolute; |
| | | top: 100%; |
| | | left: 0; |
| | | right: 0; |
| | | z-index: 1000; |
| | | background-color: #fff; |
| | | border: 1px solid #dcdfe6; |
| | | border-radius: 4px; |
| | | box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); |
| | | max-height: 200px; |
| | | overflow-y: auto; |
| | | margin-top: 4px; |
| | | } |
| | | |
| | | .suggestion-item { |
| | | padding: 10px 15px; |
| | | cursor: pointer; |
| | | transition: background-color 0.2s; |
| | | } |
| | | |
| | | .suggestion-item:hover { |
| | | background-color: #f5f7fa; |
| | | } |
| | | |
| | | .title-border { |
| | | border-bottom: 1px solid #dcdfe6; |
| | | padding-bottom: 10px; |
| | | margin-bottom: 20px; |
| | | } |
| | | .fixed-row { |
| | | position: static; |
| | | z-index: 1000; |
| | | background-color: #fff; |
| | | padding: 10px; |
| | | box-shadow: 0 2px 4px rgba(0,0,0,0.1); |
| | | margin-bottom: 10px; |
| | | box-sizing: border-box; |
| | | } |
| | | .fixed-row.floating { |
| | | position: fixed; |
| | | top: 0; |
| | | z-index: 2000; |
| | | padding: 10px; |
| | | margin-bottom: 0; |
| | | box-shadow: 0 2px 8px rgba(0,0,0,0.15); |
| | | background-color: #fff; |
| | | } |
| | | </style> |