| | |
| | | <div class="tab-content"> |
| | | <el-row :gutter="20" class="mb-20"> |
| | | <el-col :span="6"> |
| | | <el-input v-model="sealSearchForm.keyword" placeholder="请输入申请标题或申请人" clearable /> |
| | | <el-input v-model="sealSearchForm.title" placeholder="请输入申请标题" clearable /> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-select v-model="sealSearchForm.status" placeholder="审批状态" clearable> |
| | |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <el-table :data="sealApplications" style="width: 100%"> |
| | | <el-table-column prop="id" label="申请编号" width="120" /> |
| | | <el-table :data="sealApplications" border v-loading="tableLoading" style="width: 100%"> |
| | | <el-table-column prop="applicationNum" label="申请编号" width="120" /> |
| | | <el-table-column prop="title" label="申请标题" min-width="200" /> |
| | | <el-table-column prop="applicant" label="申请人" width="120" /> |
| | | <el-table-column prop="createUserName" label="申请人" width="120" /> |
| | | <el-table-column prop="department" label="所属部门" width="150" /> |
| | | <el-table-column prop="sealType" label="用印类型" width="120" /> |
| | | <el-table-column prop="applyTime" label="申请时间" width="180" /> |
| | | <el-table-column prop="sealType" label="用印类型" width="120"> |
| | | <template #default="scope"> |
| | | {{ getSealTypeText(scope.row.sealType) }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="createTime" label="申请时间" width="180" /> |
| | | <el-table-column prop="status" label="状态" width="100"> |
| | | <template #default="scope"> |
| | | <el-tag :type="getStatusType(scope.row.status)"> |
| | |
| | | <div class="tab-content"> |
| | | <el-row :gutter="20" class="mb-20"> |
| | | <el-col :span="6"> |
| | | <el-input v-model="regulationSearchForm.keyword" placeholder="请输入制度标题或发布人" clearable /> |
| | | <el-input v-model="regulationSearchForm.title" placeholder="请输入制度标题" clearable /> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-select v-model="regulationSearchForm.category" placeholder="制度分类" clearable> |
| | |
| | | <el-col :span="8"> |
| | | <el-button type="primary" @click="searchRegulations">搜索</el-button> |
| | | <el-button @click="resetRegulationSearch">重置</el-button> |
| | | <el-button type="success" @click="showRegulationDialog = true"> |
| | | <el-button type="success" @click="handleAdd"> |
| | | 发布制度 |
| | | </el-button> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <el-table :data="regulations" style="width: 100%"> |
| | | <el-table-column prop="id" label="制度编号" width="120" /> |
| | | <el-table :data="regulations" border v-loading="tableLoading" style="width: 100%"> |
| | | <el-table-column prop="regulationNum" label="制度编号" width="120" /> |
| | | <el-table-column prop="title" label="制度标题" min-width="200" /> |
| | | <el-table-column prop="category" label="分类" width="120"> |
| | | <template #default="scope"> |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="version" label="版本" width="80" /> |
| | | <el-table-column prop="publisher" label="发布人" width="120" /> |
| | | <el-table-column prop="publishTime" label="发布时间" width="180" /> |
| | | <el-table-column prop="createUserName" label="发布人" width="120" /> |
| | | <el-table-column prop="createTime" label="发布时间" width="180" /> |
| | | <el-table-column prop="status" label="状态" width="100"> |
| | | <template #default="scope"> |
| | | <el-tag :type="scope.row.status === 'active' ? 'success' : 'info'"> |
| | |
| | | <el-table-column label="操作" width="250" fixed="right"> |
| | | <template #default="scope"> |
| | | <el-button link @click="viewRegulation(scope.row)">查看</el-button> |
| | | <el-button link type="primary" @click="editRegulation(scope.row)">编辑</el-button> |
| | | <el-button link type="primary" @click="handleEdit(scope.row)">编辑</el-button> |
| | | <el-button link type="danger" @click="repealEdit(scope.row)">废弃</el-button> |
| | | <el-button link type="success" @click="viewVersionHistory(scope.row)">版本历史</el-button> |
| | | <el-button link type="warning" @click="viewReadStatus(scope.row)">阅读状态</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <!-- 分页 --> |
| | | <pagination |
| | | v-show="total > 0" |
| | | :total="total" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :page="page.current" |
| | | :limit="page.size" |
| | | @pagination="paginationChange" |
| | | /> |
| | | </div> |
| | | </el-tab-pane> |
| | | </el-tabs> |
| | |
| | | <!-- 用印申请对话框 --> |
| | | <el-dialog v-model="showSealApplyDialog" title="申请用印" width="600px"> |
| | | <el-form :model="sealForm" :rules="sealRules" ref="sealFormRef" label-width="100px"> |
| | | <el-form-item label="申请编号" prop="applicationNum"> |
| | | <el-input v-model="sealForm.applicationNum" placeholder="请输入申请编号" /> |
| | | </el-form-item> |
| | | <el-form-item label="申请标题" prop="title"> |
| | | <el-input v-model="sealForm.title" placeholder="请输入申请标题" /> |
| | | </el-form-item> |
| | |
| | | </el-dialog> |
| | | |
| | | <!-- 规章制度发布对话框 --> |
| | | <el-dialog v-model="showRegulationDialog" title="发布规章制度" width="800px"> |
| | | <el-dialog v-model="showRegulationDialog" :title="operationType === 'add' ? '发布制度' : '编辑制度'" width="800px"> |
| | | <el-form :model="regulationForm" :rules="regulationRules" ref="regulationFormRef" label-width="100px"> |
| | | <el-form-item label="制度编号" prop="regulationNum"> |
| | | <el-input v-model="regulationForm.regulationNum" placeholder="请输入制度编号" /> |
| | | </el-form-item> |
| | | <el-form-item label="制度标题" prop="title"> |
| | | <el-input v-model="regulationForm.title" placeholder="请输入制度标题" /> |
| | | </el-form-item> |
| | |
| | | <el-form-item label="制度内容" prop="content"> |
| | | <el-input v-model="regulationForm.content" type="textarea" :rows="10" placeholder="请输入制度详细内容" /> |
| | | </el-form-item> |
| | | <el-form-item label="制度版本" prop="version"> |
| | | <el-input v-model="regulationForm.version" placeholder="请输入制度版本" /> |
| | | </el-form-item> |
| | | <el-form-item label="生效时间" prop="effectiveTime"> |
| | | <el-date-picker v-model="regulationForm.effectiveTime" type="datetime" placeholder="选择生效时间" style="width: 100%" /> |
| | | <el-date-picker v-model="regulationForm.effectiveTime" type="datetime" format="YYYY-MM-DD HH:mm:ss" |
| | | value-format="YYYY-MM-DD HH:mm:ss" placeholder="选择生效时间" style="width: 100%" /> |
| | | </el-form-item> |
| | | <el-form-item label="适用范围" prop="scope"> |
| | | <el-checkbox-group v-model="regulationForm.scope"> |
| | |
| | | <el-descriptions :column="2" border> |
| | | <el-descriptions-item label="申请编号">{{ currentSealDetail.id }}</el-descriptions-item> |
| | | <el-descriptions-item label="申请标题">{{ currentSealDetail.title }}</el-descriptions-item> |
| | | <el-descriptions-item label="申请人">{{ currentSealDetail.applicant }}</el-descriptions-item> |
| | | <el-descriptions-item label="申请人">{{ currentSealDetail.createUserName }}</el-descriptions-item> |
| | | <el-descriptions-item label="所属部门">{{ currentSealDetail.department }}</el-descriptions-item> |
| | | <el-descriptions-item label="用印类型">{{ currentSealDetail.sealType }}</el-descriptions-item> |
| | | <el-descriptions-item label="申请时间">{{ currentSealDetail.applyTime }}</el-descriptions-item> |
| | | <el-descriptions-item label="用印类型">{{ getSealTypeText(currentSealDetail.sealType) }}</el-descriptions-item> |
| | | <el-descriptions-item label="申请时间">{{ currentSealDetail.createTime }}</el-descriptions-item> |
| | | <el-descriptions-item label="状态"> |
| | | <el-tag :type="getStatusType(currentSealDetail.status)"> |
| | | {{ getStatusText(currentSealDetail.status) }} |
| | |
| | | <el-descriptions-item label="制度标题">{{ currentRegulationDetail.title }}</el-descriptions-item> |
| | | <el-descriptions-item label="分类">{{ getCategoryText(currentRegulationDetail.category) }}</el-descriptions-item> |
| | | <el-descriptions-item label="版本">{{ currentRegulationDetail.version }}</el-descriptions-item> |
| | | <el-descriptions-item label="发布人">{{ currentRegulationDetail.publisher }}</el-descriptions-item> |
| | | <el-descriptions-item label="发布时间">{{ currentRegulationDetail.publishTime }}</el-descriptions-item> |
| | | <el-descriptions-item label="发布人">{{ currentRegulationDetail.createUserName }}</el-descriptions-item> |
| | | <el-descriptions-item label="发布时间">{{ currentRegulationDetail.createTime }}</el-descriptions-item> |
| | | </el-descriptions> |
| | | <div class="mt-20"> |
| | | <h4>制度内容</h4> |
| | |
| | | import { ref, reactive, onMounted } from 'vue' |
| | | import { ElMessage, ElMessageBox } from 'element-plus' |
| | | import { Plus } from '@element-plus/icons-vue' |
| | | import { listSealApplication, addSealApplication, updateSealApplication,listRuleManagement,addRuleManagement,updateRuleManagement,delRuleManagement } from '@/api/collaborativeApproval/sealManagement.js' |
| | | import { el } from 'element-plus/es/locales.mjs' |
| | | |
| | | // 响应式数据 |
| | | const activeTab = ref('seal') |
| | | |
| | | const operationType = ref('add') |
| | | // 用印申请相关 |
| | | const showSealApplyDialog = ref(false) |
| | | const tableLoading = ref(false) |
| | | const showSealDetailDialog = ref(false) |
| | | const currentSealDetail = ref(null) |
| | | const sealFormRef = ref() |
| | | const sealForm = reactive({ |
| | | applicationNum: '', |
| | | title: '', |
| | | sealType: '', |
| | | reason: '', |
| | | urgency: 'normal' |
| | | urgency: 'normal', |
| | | status: 'pending' |
| | | }) |
| | | |
| | | const sealRules = { |
| | | applicationNum: [{ required: true, message: '请输入申请编号', trigger: 'blur' }], |
| | | title: [{ required: true, message: '请输入申请标题', trigger: 'blur' }], |
| | | sealType: [{ required: true, message: '请选择用印类型', trigger: 'change' }], |
| | | reason: [{ required: true, message: '请输入申请原因', trigger: 'blur' }] |
| | | } |
| | | |
| | | const sealSearchForm = reactive({ |
| | | keyword: '', |
| | | title: '', |
| | | status: '' |
| | | }) |
| | | |
| | | // 分页参数 |
| | | const page = reactive({ |
| | | current: 1, |
| | | size: 10, |
| | | total: 0 |
| | | }) |
| | | // 规章制度相关 |
| | | const showRegulationDialog = ref(false) |
| | | const showRegulationDetailDialog = ref(false) |
| | |
| | | const currentRegulationDetail = ref(null) |
| | | const regulationFormRef = ref() |
| | | const regulationForm = reactive({ |
| | | id: '', |
| | | regulationNum: '', |
| | | title: '', |
| | | category: '', |
| | | content: '', |
| | | version: '', |
| | | status: 'active', |
| | | readCount: 0, |
| | | effectiveTime: '', |
| | | scope: [], |
| | | requireConfirm: true |
| | | requireConfirm: false |
| | | }) |
| | | |
| | | const regulationRules = { |
| | |
| | | } |
| | | |
| | | const regulationSearchForm = reactive({ |
| | | keyword: '', |
| | | title: '', |
| | | category: '' |
| | | }) |
| | | |
| | | // 假数据 |
| | | const sealApplications = ref([ |
| | | { |
| | | id: 'SEAL001', |
| | | title: '合同用印申请', |
| | | applicant: '陈志强', |
| | | department: '销售部', |
| | | sealType: '合同专用章', |
| | | applyTime: '2025-01-15 10:30:00', |
| | | status: 'pending', |
| | | reason: '客户合同需要盖章' |
| | | }, |
| | | { |
| | | id: 'SEAL002', |
| | | title: '财务报告用印', |
| | | applicant: '王建国', |
| | | department: '财务部', |
| | | sealType: '财务专用章', |
| | | applyTime: '2025-01-14 14:20:00', |
| | | status: 'approved', |
| | | reason: '季度财务报告需要盖章' |
| | | }, |
| | | { |
| | | id: 'SEAL003', |
| | | title: '公司章程用印', |
| | | applicant: '孙明华', |
| | | department: '法务部', |
| | | sealType: '公章', |
| | | applyTime: '2025-01-13 09:15:00', |
| | | status: 'rejected', |
| | | reason: '公司章程修改需要盖章' |
| | | } |
| | | ]) |
| | | const sealApplications = ref([]) |
| | | |
| | | const regulations = ref([ |
| | | { |
| | | id: 'REG001', |
| | | title: '员工考勤管理制度', |
| | | category: 'hr', |
| | | version: 'v2.1', |
| | | publisher: '人事部', |
| | | publishTime: '2025-01-10 09:00:00', |
| | | status: 'active', |
| | | readCount: 45, |
| | | content: '为规范员工考勤管理,提高工作效率,特制定本制度...' |
| | | }, |
| | | { |
| | | id: 'REG002', |
| | | title: '财务报销制度', |
| | | category: 'finance', |
| | | version: 'v1.5', |
| | | publisher: '财务部', |
| | | publishTime: '2025-01-08 14:30:00', |
| | | status: 'active', |
| | | readCount: 38, |
| | | content: '为规范财务报销流程,加强财务管理,特制定本制度...' |
| | | }, |
| | | { |
| | | id: 'REG003', |
| | | title: '安全生产管理制度', |
| | | category: 'safety', |
| | | version: 'v3.0', |
| | | publisher: '安全部', |
| | | publishTime: '2025-01-05 16:00:00', |
| | | status: 'active', |
| | | readCount: 52, |
| | | content: '为确保员工人身安全,预防安全事故发生,特制定本制度...' |
| | | } |
| | | ]) |
| | | const regulations = ref([]) |
| | | |
| | | const versionHistory = ref([ |
| | | { version: 'v2.1', updateTime: '2025-01-10 09:00:00', updater: '人事部', changeLog: '更新考勤时间规定' }, |
| | |
| | | { employee: '王建国', department: '财务部', readTime: '2025-01-12 09:15:00', confirmTime: '2025-01-12 09:20:00', status: 'confirmed' } |
| | | ]) |
| | | |
| | | // 方法 |
| | | // 用印申请状态 |
| | | const getStatusType = (status) => { |
| | | const statusMap = { |
| | | pending: 'warning', |
| | |
| | | } |
| | | return statusMap[status] || 'info' |
| | | } |
| | | |
| | | // 制度状态 |
| | | const getStatusText = (status) => { |
| | | const statusMap = { |
| | | pending: '待审批', |
| | |
| | | } |
| | | return statusMap[status] || '未知' |
| | | } |
| | | |
| | | // 用印类型 |
| | | const getSealTypeText = (sealType) => { |
| | | const sealTypeMap = { |
| | | official: '公章', |
| | | contract: '合同专用章', |
| | | finance: '财务专用章', |
| | | tegal: '技术专用章' |
| | | } |
| | | return sealTypeMap[sealType] || '未知' |
| | | } |
| | | // 制度分类 |
| | | const getCategoryText = (category) => { |
| | | const categoryMap = { |
| | | hr: '人事制度', |
| | |
| | | } |
| | | return categoryMap[category] || '未知' |
| | | } |
| | | |
| | | // 搜索印章申请 |
| | | const searchSealApplications = () => { |
| | | ElMessage.success('搜索完成') |
| | | } |
| | | page.current=1 |
| | | getSealApplicationList() |
| | | |
| | | // ElMessage.success('搜索完成') |
| | | } |
| | | // 重置印章申请搜索 |
| | | const resetSealSearch = () => { |
| | | sealSearchForm.keyword = '' |
| | | sealSearchForm.title = '' |
| | | sealSearchForm.status = '' |
| | | searchSealApplications() |
| | | } |
| | | |
| | | // 搜索制度 |
| | | const searchRegulations = () => { |
| | | ElMessage.success('搜索完成') |
| | | page.current=1 |
| | | getRegulationList() |
| | | } |
| | | |
| | | // 重置制度搜索 |
| | | const resetRegulationSearch = () => { |
| | | regulationSearchForm.keyword = '' |
| | | regulationSearchForm.title = '' |
| | | regulationSearchForm.category = '' |
| | | searchRegulations() |
| | | } |
| | | |
| | | // 提交用印申请 |
| | | const submitSealApplication = async () => { |
| | | try { |
| | | await sealFormRef.value.validate() |
| | | addSealApplication(sealForm).then(res => { |
| | | if(res.code == 200){ |
| | | ElMessage.success('申请提交成功') |
| | | showSealApplyDialog.value = false |
| | | getSealApplicationList() |
| | | Object.assign(sealForm, { |
| | | applicationNum: '', |
| | | title: '', |
| | | sealType: '', |
| | | reason: '', |
| | | urgency: 'normal' |
| | | urgency: 'normal', |
| | | status: 'pending' |
| | | }) |
| | | } |
| | | }).catch(err => { |
| | | ElMessage.error(err.msg) |
| | | }) |
| | | |
| | | } catch (error) { |
| | | ElMessage.error('请完善申请信息') |
| | | } |
| | | } |
| | | // 新增 |
| | | const handleAdd = () => { |
| | | operationType.value = 'add' |
| | | resetRegulationForm() |
| | | showRegulationDialog.value = true |
| | | } |
| | | |
| | | // 编辑 |
| | | const handleEdit = (row) => { |
| | | operationType.value = 'edit' |
| | | Object.assign(regulationForm, row) |
| | | showRegulationDialog.value = true |
| | | } |
| | | // 废弃 |
| | | const repealEdit = (row) => { |
| | | operationType.value = 'edit' |
| | | Object.assign(regulationForm, row) |
| | | regulationForm.status = 'repealed' |
| | | ElMessageBox.confirm('确认废弃该制度?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | updateRuleManagement(regulationForm).then(res => { |
| | | if(res.code == 200){ |
| | | ElMessage.success('制度废弃成功') |
| | | // showRegulationDialog.value = false |
| | | getRegulationList() |
| | | resetRegulationForm() |
| | | } |
| | | }) |
| | | }).catch(() => { |
| | | ElMessage({ |
| | | type: 'info', |
| | | message: '已取消废弃' |
| | | }) |
| | | }) |
| | | } |
| | | // 发布制度 |
| | | const submitRegulation = async () => { |
| | | try { |
| | | await regulationFormRef.value.validate() |
| | | if(operationType.value == 'add'){ |
| | | addRuleManagement(regulationForm).then(res => { |
| | | if(res.code == 200){ |
| | | ElMessage.success('制度发布成功') |
| | | showRegulationDialog.value = false |
| | | getRegulationList() |
| | | resetRegulationForm() |
| | | } |
| | | }) |
| | | }else{ |
| | | updateRuleManagement(regulationForm).then(res => { |
| | | if(res.code == 200){ |
| | | ElMessage.success('制度编辑成功') |
| | | showRegulationDialog.value = false |
| | | resetRegulationForm() |
| | | getRegulationList() |
| | | }})} |
| | | }catch(err){ |
| | | ElMessage.error(err.msg) |
| | | } |
| | | } |
| | | //重置制度表单 |
| | | const resetRegulationForm = () => { |
| | | Object.assign(regulationForm, { |
| | | id: '', |
| | | regulationNum: '', |
| | | title: '', |
| | | category: '', |
| | | content: '', |
| | | version: '', |
| | | status: 'active', |
| | | readCount: 0, |
| | | effectiveTime: '', |
| | | scope: [], |
| | | requireConfirm: true |
| | | requireConfirm: false |
| | | }) |
| | | } catch (error) { |
| | | ElMessage.error('请完善制度信息') |
| | | } |
| | | } |
| | | |
| | | |
| | | // 查看用印申请详情 |
| | | const viewSealDetail = (row) => { |
| | | currentSealDetail.value = row |
| | | showSealDetailDialog.value = true |
| | | } |
| | | |
| | | // 审批用印申请 |
| | | const approveSeal = (row) => { |
| | | console.log(row) |
| | | ElMessageBox.confirm('确认通过该用印申请?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | row.status = 'approved' |
| | | updateSealApplication(row).then(res => { |
| | | if(res.code == 200){ |
| | | ElMessage.success('审批通过') |
| | | } |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | // 拒绝用印申请 |
| | | const rejectSeal = (row) => { |
| | | ElMessageBox.prompt('请输入拒绝原因', '提示', { |
| | | confirmButtonText: '确定', |
| | |
| | | inputErrorMessage: '拒绝原因不能为空' |
| | | }).then(({ value }) => { |
| | | row.status = 'rejected' |
| | | updateSealApplication(row).then(res => { |
| | | if(res.code == 200){ |
| | | ElMessage.success('审批拒绝') |
| | | } |
| | | }) |
| | | ElMessage.success('已拒绝申请') |
| | | }) |
| | | } |
| | | |
| | | // 查看制度详情 |
| | | const viewRegulation = (row) => { |
| | | currentRegulationDetail.value = row |
| | | showRegulationDetailDialog.value = true |
| | | } |
| | | |
| | | const editRegulation = (row) => { |
| | | ElMessage.info('编辑功能开发中...') |
| | | } |
| | | |
| | | // 查看制度版本历史 |
| | | const viewVersionHistory = (row) => { |
| | | showVersionHistoryDialog.value = true |
| | | } |
| | | |
| | | // 查看制度阅读状态 |
| | | const viewReadStatus = (row) => { |
| | | showReadStatusDialog.value = true |
| | | } |
| | | // 获取印章申请列表数据 |
| | | const getSealApplicationList = async () => { |
| | | tableLoading.value = true |
| | | listSealApplication(page,sealSearchForm) |
| | | .then(res => { |
| | | |
| | | sealApplications.value = res.data.records |
| | | page.value.total = res.data.total; |
| | | tableLoading.value = false; |
| | | |
| | | }).catch(err => { |
| | | tableLoading.value = false; |
| | | }) |
| | | } |
| | | // 获取规章制度列表数据 |
| | | const getRegulationList = async () => { |
| | | tableLoading.value = true |
| | | listRuleManagement(page,regulationSearchForm) |
| | | .then(res => { |
| | | |
| | | regulations.value = res.data.records |
| | | page.value.total = res.data.total; |
| | | tableLoading.value = false; |
| | | |
| | | }).catch(err => { |
| | | tableLoading.value = false; |
| | | }) |
| | | } |
| | | |
| | | onMounted(() => { |
| | | // 初始化 |
| | | getSealApplicationList() |
| | | getRegulationList() |
| | | }) |
| | | </script> |
| | | |