From 7fc325910b74e0426ffa2bad7f2daddf5eea114b Mon Sep 17 00:00:00 2001
From: luoyb <412940104@qq.com>
Date: 星期二, 23 九月 2025 10:57:00 +0800
Subject: [PATCH] 合同到期提醒模块
---
src/views/remind/contract.vue | 553 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 553 insertions(+), 0 deletions(-)
diff --git a/src/views/remind/contract.vue b/src/views/remind/contract.vue
new file mode 100644
index 0000000..c05541b
--- /dev/null
+++ b/src/views/remind/contract.vue
@@ -0,0 +1,553 @@
+<template>
+ <div style="background-color: #fff;height: 100%;">
+ <el-container>
+ <el-header :height="headerHeight">
+ <el-row style="margin-bottom: 10px;">
+ <el-col :span="15">
+ <h3 class="bu-tian-jia-title">合同到期提醒</h3>
+ </el-col>
+ </el-row>
+ </el-header>
+ <el-main style="height: 85%;">
+ <el-row style="margin: 10px 0 10px 0;">
+ <el-col :span="24">
+ <el-button type="primary" class="hr-but-all" @click="showDcyg(0)">导出EXCEL</el-button>
+ </el-col>
+ </el-row>
+ <el-table
+ ref="multipleTable"
+ :data="contractList"
+ :cell-style="{padding:'7px 0','text-align':'center'}"
+ :header-cell-style="{'height':'5.3vh','background-color':'#e6e6e6','text-align':'center'}"
+ stripe
+ border
+ style="width: 100%;color: #000;"
+ @sort-change="changeSort"
+ >
+ <el-table-column show-overflow-tooltip fixed="left" label="操作" width="120">
+ <template v-slot="scope">
+ <span
+ style="color: #a00515;display: inline-block;width: 40%;cursor: pointer"
+ @click="goOn(scope.row)"
+ >续签</span>
+ <span
+ style="color: #a00515;display: inline-block;width: 40%;cursor: pointer"
+ @click="discontinue(scope.row)"
+ >不续签</span>
+ </template>
+ </el-table-column>
+ <el-table-column show-overflow-tooltip prop="empNumb" label="员工编号" />
+ <el-table-column show-overflow-tooltip prop="allDeptName" label="部门（护卫点）" width="300" />
+ <el-table-column show-overflow-tooltip prop="jobName" label="岗位" width="80" />
+ <el-table-column show-overflow-tooltip prop="empName" label="姓名" width="100" />
+ <el-table-column show-overflow-tooltip prop="certificateNumb" label="身份证号码" width="160" />
+ <el-table-column show-overflow-tooltip prop="signingDate" label="合同签订日期" width="110" />
+ <el-table-column show-overflow-tooltip prop="endDate" label="合同结束日期" width="110" />
+ <el-table-column show-overflow-tooltip prop="contractPeriod" label="合同期限(年)" width="110" />
+ <el-table-column show-overflow-tooltip prop="diffDay" label="到期提醒" width="120">
+ <template v-slot="scope">
+ <span v-if="scope.row.diffDay===0">到期</span>
+ <span v-else>{{ scope.row.diffDay }}天后到期</span>
+ </template>
+ </el-table-column>
+ <el-table-column show-overflow-tooltip prop="transactor" label="合同办理人" width="100" />
+ <el-table-column show-overflow-tooltip prop="remark" label="备注" width="160" />
+ </el-table>
+ <pagination
+ v-show="total>0"
+ style="text-align: right;width: 98%;"
+ :total="total"
+ :page.sync="pagination.num"
+ :limit.sync="pagination.size"
+ @pagination="search"
+ />
+ </el-main>
+ </el-container>
+ <el-dialog title="合同信息" :visible.sync="dialogShowContract" width="50%">
+ <el-form
+ ref="contractForm"
+ :model="contractForm"
+ :rules="contractRules"
+ label-position="right"
+ label-width="120px"
+ >
+ <el-row>
+ <el-col :span="12">
+ <el-form-item label="姓名" prop="empName">
+ <el-input v-model="contractForm.empName" />
+ </el-form-item>
+ <el-form-item label="身份证号码" prop="certificateNumb">
+ <el-input
+ v-model="contractForm.certificateNumb"
+ />
+ </el-form-item>
+ <el-form-item label="性别" this-emp-base-info-form="sex">
+ <el-select v-model="contractForm.sex" placeholder="请选择性别">
+ <el-option
+ v-for="dict in sexOptions"
+ :key="dict.dicItemCode"
+ :label="dict.dicItemName"
+ :value="dict.dicItemCode"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="合同签订日期" prop="signingDate">
+ <el-date-picker
+ v-model="contractForm.signingDate"
+ value-format="yyyy-MM-dd"
+ type="date"
+ placeholder="选择日期"
+ />
+ </el-form-item>
+ <el-form-item label="合同状态" prop="contractStatus">
+ <el-select
+ v-model="contractForm.contractStatus"
+ placeholder="请选择合同状态"
+ >
+ <el-option
+ v-for="dict in contractStatusOptions"
+ :key="dict.dicItemCode"
+ :label="dict.dicItemName"
+ :value="dict.dicItemCode"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="合同办理人" prop="transactor">
+ <el-input v-model="contractForm.transactor" />
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="员工编号" prop="empNumb">
+ <el-input v-model="contractForm.empNumb" />
+ </el-form-item>
+ <el-form-item label="部门(护卫点)" prop="allDeptName">
+ <el-input v-model="contractForm.allDeptName" />
+ </el-form-item>
+ <el-form-item label="岗位" prop="jobName">
+ <el-input v-model="contractForm.jobName" />
+ </el-form-item>
+ <el-form-item label="合同结束日期" prop="endDate">
+ <el-date-picker
+ v-model="contractForm.endDate"
+ value-format="yyyy-MM-dd"
+ type="date"
+ placeholder="选择日期"
+ />
+ </el-form-item>
+ <el-form-item label="合同期限（年）" prop="contractPeriod">
+ <el-input v-model="contractForm.contractPeriod" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="24">
+ <el-form-item label="备注" prop="remark">
+ <el-input v-model="contractForm.remark" type="textarea" />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ <div slot="footer" class="dialog-footer">
+ <el-button type="primary" @click="putContractInfo('contractForm')">保 存</el-button>
+ <el-button @click="dialogIsShow()">取 消</el-button>
+ </div>
+ </el-dialog>
+ </div>
+</template>
+<script>
+import Pagination from '@/components/Pagination'
+import '@riophae/vue-treeselect/dist/vue-treeselect.css'
+import { dateDifference } from '@/utils/myUtil'
+
+export default {
+ components: {
+ Pagination
+ },
+ data() {
+ return {
+ dialog: {
+ isVisible: false,
+ title: '',
+ type: ''
+ },
+ sort: {},
+ // 总数量
+ total: 0,
+ // 查询参数
+ queryParams: {
+ baseKey: ''
+ },
+ // 分页参数
+ pagination: {
+ size: 15,
+ num: 1
+ },
+ headerHeight: '30px',
+ // 合同列表
+ contractList: [],
+ // 合同信息
+ contractForm: {
+ contractId: '',
+ empId: '',
+ empNumb: '',
+ empName: '',
+ certificateNumb: '',
+ sex: '',
+ sexName: '',
+ deptId: '',
+ deptName: '',
+ allDeptName: '',
+ JobId: '',
+ jobName: '',
+ beginDate: '',
+ endDate: '',
+ contractStatus: '',
+ contractPeriod: '',
+ transactor: '',
+ signingDate: '',
+ remark: '',
+ createTime: '',
+ creator: '',
+ modifyTime: '',
+ modifier: '',
+ delFlag: '',
+ empStatus: 0,
+ version: '',
+ diffDay: 0
+ },
+ sexOptions: [],
+ contractStatusOptions: [],
+ dialogShowContract: false,
+ contractRules: {
+ empName: [{ required: true, message: '请选择员工', trigger: 'change' }],
+ signingDate: [{ required: true, validator: this.startDate }],
+ contractStatus: [{ required: true, message: '请选择合同状态', trigger: 'change' }],
+ transactor: [{ max: 40, message: '长度不超过40个字符', trigger: 'blur' }],
+ beginDate: [{ required: true, message: '请选择合同开始日期', trigger: 'change' }],
+ endDate: [{ required: true, validator: this.endDate }],
+ remark: [{ max: 512, message: '长度不超过512个字符', trigger: 'blur' }]
+ }
+ }
+ },
+ mounted() {
+ this.fetch()
+ this.getDicts('sex').then(response => {
+ this.sexOptions = response.data
+ })
+ this.getDicts('CONTRACTSTATUS').then(response => {
+ this.contractStatusOptions = response.data
+ })
+ },
+ methods: {
+ search() {
+ this.queryParams.baseKey = ''
+ this.fetch({
+ ...this.queryParams,
+ ...this.sort
+ })
+ },
+ fetch(params = {}) {
+ const that = this
+ params.pageSize = this.pagination.size
+ params.pageNum = this.pagination.num
+ params.delFlag = 0
+ params.empStatus = 0
+
+ this.$get('hr/empContractInfo/remind/list', {
+ ...params
+ }).then((r) => {
+ const data = r.data.data
+ that.total = data.total
+ that.contractList = data.rows
+ })
+ },
+ changeSort(val) {
+ this.sort.field = val.prop
+ this.sort.order = val.order
+ this.fetch()
+ },
+ // 续签合同
+ goOn(row) {
+ this.initContractData(row)
+ this.dialogShowContract = true
+ },
+ dialogIsShow() {
+ this.dialogShowContract = false
+ },
+ // 不续签合同
+ discontinue(val) {
+ this.initContractData(val)
+ this.$post('hr/empContractInfo/remind/not', { ...this.contractForm }).then(() => {
+ this.buttonLoading = false
+ this.$message({
+ message: this.$t('tips.updateSuccess'),
+ type: 'success'
+ })
+ this.cleanContractData()
+ this.fetch()
+ })
+ },
+ // 初始化续签合同信息
+ initContractData(val) {
+ this.cleanContractData()
+ this.contractForm.contractId = val.contractId
+ this.contractForm.empId = val.empId
+ this.contractForm.empNumb = val.empNumb
+ this.contractForm.empName = val.empName
+ this.contractForm.certificateNumb = val.certificateNumb
+ this.contractForm.sex = val.sex
+ this.contractForm.deptId = val.deptId
+ this.contractForm.deptName = val.deptName
+ this.contractForm.allDeptName = val.allDeptName
+ this.contractForm.JobId = val.JobId
+ this.contractForm.jobName = val.jobName
+ this.contractForm.contractStatus = '2'
+ },
+ // 清除续签合同信息
+ cleanContractData() {
+ this.contractForm.contractId = ''
+ this.contractForm.empId = ''
+ this.contractForm.empNumb = ''
+ this.contractForm.empName = ''
+ this.contractForm.certificateNumb = ''
+ this.contractForm.sex = ''
+ this.contractForm.deptId = ''
+ this.contractForm.deptName = ''
+ this.contractForm.allDeptName = ''
+ this.contractForm.JobId = ''
+ this.contractForm.jobName = ''
+ this.contractForm.contractStatus = ''
+ this.contractForm.beginDate = ''
+ this.contractForm.endDate = ''
+ this.contractForm.contractPeriod = 0
+ this.contractForm.remark = ''
+ this.contractForm.transactor = ''
+ },
+ // 验证合同签订日期
+ startDate(rule, value, callback) {
+ // 如果结束日期没选，cb
+ if (!this.contractForm.endDate) {
+ callback()
+ } else {
+ // 结束日期有，进行判断
+ if (this.compareDate(value, this.contractForm.endDate)) {
+ // 如果起始在结束之前
+ callback()
+ } else {
+ callback(new Error('开始日期不能在结束日期之后，请重新选择'))
+ }
+ }
+ },
+ // 验证合同结束日期
+ endDate(rule, value, callback) {
+ // 如果起始日期没选，cb
+ if (!this.contractForm.signingDate) {
+ callback()
+ } else {
+ // 起始日期有，进行判断
+ if (this.compareDate(this.contractForm.signingDate, value)) {
+ // 如果起始在结束之前
+ this.contractForm.contractPeriod = dateDifference(this.contractForm.signingDate, this.contractForm.endDate, 'o')
+ callback()
+ } else {
+ callback(new Error('结束日期不能在开始始日期之前，请重新选择'))
+ }
+ }
+ },
+ compareDate(start, end) {
+ return new Date(end).getTime() > new Date(start).getTime()
+ },
+ // 续签合同提交
+ putContractInfo(formName) {
+ this.$refs[formName].validate((valid) => {
+ if (valid) {
+ this.$post('hr/empContractInfo/remind/continue', { ...this.contractForm }).then(() => {
+ this.buttonLoading = false
+ this.$message({
+ message: this.$t('tips.createSuccess'),
+ type: 'success'
+ })
+
+ this.cleanContractData()
+ this.fetch()
+ this.dialogIsShow()
+ })
+ }
+ })
+ }
+ }
+}
+
+</script>
+<style lang="scss">
+.zzyg-table {
+ .el-table th, .el-table td {
+ padding: 7px 0;
+ }
+}
+
+.fj-checkbox {
+ .el-checkbox__input.is-checked .el-checkbox__inner {
+ border-color: #a32c30;;
+ background: #a32c30;;
+ }
+
+ .el-checkbox__label {
+ color: #000 !important;
+ }
+}
+</style>
+<style lang="scss" scoped>
+.baseinfo .el-container {
+ .el-aside {
+ background-color: #fff;
+ }
+
+ .el-main {
+ background-color: #fff;
+ }
+
+}
+
+.el-main {
+ height: 600px;
+}
+
+.el-autocomplete {
+ width: 100%;
+}
+
+.el-select {
+ width: 100%;
+}
+
+.el-aside {
+ padding: 20px;
+ background: #f3f5f8;
+ height: 600px;
+
+ .el-tree {
+ height: 100%;
+ }
+}
+
+.searchTable {
+ margin-top: 10px;
+ border-collapse: collapse;
+ width: 100%;
+
+ tr {
+ border-bottom: 1px dashed #d9dadb;
+ }
+
+ .td {
+ width: 90px;
+ text-align: right;
+ }
+
+ .td-group {
+ padding-left: 20px;
+ }
+}
+
+.searchTable td,
+.searchTable th {
+ color: #000;
+ height: 50px;
+ background-color: #fff;
+}
+
+#ygxq table {
+ border-collapse: collapse;
+ margin: 0 auto;
+ text-align: center;
+ width: 100%;
+ margin-top: 20px;
+}
+
+#ygxq table td,
+#ygxq table th {
+ border: 1px solid #DDDCDC;
+ color: #666;
+ height: 30px;
+}
+
+#ygxq table thead th {
+ background-color: #CCE8EB;
+ width: 100px;
+}
+
+#ygxq table tr:nth-child(odd) {
+ background: #fff;
+}
+
+#ygxq table tr:nth-child(even) {
+ background: #F5FAFA;
+}
+
+.tdTitle {
+ font-size: 14px;
+ font-weight: 700;
+ text-align: left;
+}
+
+.link_button {
+ color: #169BD5;
+}
+
+.del_button {
+ color: #D9001B;
+}
+
+#dcygTable {
+ border-collapse: collapse;
+
+ tr {
+ width: 100%;
+ border-bottom: 1px dashed #ccc;
+
+ > td:nth-child(even) {
+ width: 100px;
+ text-align: left;
+ }
+ }
+
+}
+
+#dcygTable td {
+ width: 160px;
+ text-align: center;
+ height: 35px;
+ line-height: 35px;
+ font-size: 15px;
+ font-weight: 400;
+}
+
+.search-btn {
+ display: inline-block;
+ width: 3.64vw;
+ height: 3.2vh;
+ line-height: 3.2vh;
+ text-align: center;
+ background-color: #a00515;
+ color: #fff;
+ margin-left: 1vw;
+ box-sizing: border-box;
+ cursor: pointer;
+ vertical-align: middle;
+}
+
+.sup-search-btn {
+ display: inline-block;
+ width: 5.2vw;
+ height: 3.2vh;
+ line-height: 3.2vh;
+ text-align: center;
+ margin-left: 1vw;
+ color: #a00515;
+ border: 1px solid #a00515;
+ box-sizing: border-box;
+ cursor: pointer;
+ vertical-align: middle;
+}
+</style>
--
Gitblit v1.8.0