wangchengming/voltage_Safety_Vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

我的资质对接重新申请、删除、查看详情

Browse Source
This commit is contained in:
wangchengming 2025-07-03 16:35:30 +08:00
parent a4bc7160ab
commit 3cf13d755f
12 changed files with 3183 additions and 349 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/api/qualification/myQualifications.js
View File

@ -112,3 +112,12 @@ export function deleteBusUserQualification(busQualificationId) {
method: 'post'
})
}
// 重新申请资质
export function reApplyBusUserQualification(query) {
return request({
url: '/admin/busUserQualification/reApply',
method: 'post',
data: query
})
}

35
src/router/index.js
View File

@ -120,6 +120,20 @@ export const dynamicRoutes = [
meta: { title: '标签申请', activeMenu: '/qualification/escTask' }
}
]
},
{
path: '/qualification/myQualifications/viewDetail',
component: Layout,
hidden: true,
permissions: ['qualification:escApproval:approvalDetail'],
children: [
{
path: ':Id(\\d+)?',
component: () => import('@/views/qualification/myQualifications/components/QualificationDetailForm'),
name: 'myApprovalDetail',
meta: { title: '我的资质查看详情' }
}
]
},
{
path: '/qualification/approvalForm',
@ -150,16 +164,31 @@ export const dynamicRoutes = [
]
},
{
path: '/qualification/trainApproval/approvalDetail',
path: '/qualification/trainApprovalForm',
component: Layout,
hidden: true,
permissions: ['qualification:trainApproval:approvalDetail'],
children: [
{
path: '',
path: ':Id(\\d+)?',
component: () => import('@/views/qualification/trainApproval/approvalForm'),
name: 'trainApprovalForm',
meta: { title: '培训中心审批', activeMenu: '/qualification/trainApproval' }
}
]
},
{
path: '/qualification/trainApprovalDetail',
component: Layout,
hidden: true,
permissions: ['qualification:trainApproval:approvalDetail'],
children: [
{
path: ':Id(\\d+)?',
component: () => import('@/views/qualification/trainApproval/approvalDetail'),
name: 'trainApprovalDetail',
meta: { title: '培训中心审批', activeMenu: '/qualification/trainApproval' }
meta: { title: '培训中心审批详情', activeMenu: '/qualification/trainApproval' }
}
]
},

4
src/views/qualification/escApproval/index.vue
View File

@ -71,7 +71,7 @@
<el-table-column prop="qualificationName" label="目标资质" width="130" />
<el-table-column prop="state" label="状态" width="160">
<template #default="scope">
<el-text v-if="scope.row.state == 1 && scope.row.node == 0" type="info"
<el-text v-if="scope.row.state == 1 && scope.row.node == 1" type="info"
class="infoinfoText">待审核</el-text>
<el-text v-if="scope.row.state == 1 && scope.row.node == 2" type="info"
class="infoinfoText">待培训中心审核</el-text>
@ -81,7 +81,7 @@
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" width="100">
<template #default="scope">
<el-button type="primary" v-if="scope.row.state == 1 && scope.row.node == 0" text
<el-button type="primary" v-if="scope.row.state == 1 && scope.row.node == 1" text
class="replayTextBtn" @click="handleApproval(scope.row)">审批</el-button>
<el-button type="primary" text class="replayTextBtn" v-else
@click="handleView(scope.row)">查看</el-button>

53
src/views/qualification/myQualifications/components/QualificationApply.vue
View File

@ -1,5 +1,5 @@
<template>
<div v-if="!isShowForm">
<div v-if="!isShowForm && !isShowReForm">
<div class="optionBtn">
<el-button type="primary" class="qualificationApplyBtn" @click="handleOpenApplyForm">
<img :src="applyIcon" class="custom-icon" />
@ -24,33 +24,47 @@
<el-text v-if="scope.row.state == 9" type="danger" class="dangerText">驳回</el-text>
</template>
</el-table-column>
<el-table-column label="操作" width="150">
<el-table-column label="操作" width="180">
<template #default="scope">
<el-button type="primary" text class="replayTextBtn" v-if="scope.row.state != 1">重新申请</el-button>
<el-divider direction="vertical" class="verticalLine" v-if="scope.row.state != 1" />
<el-button type="primary" text class="deleteTextBtn">删除</el-button>
<el-button type="primary" text class="replayTextBtn" v-if="scope.row.state == 9"
@click="handleReplay(scope.row)">重新申请</el-button>
<el-divider direction="vertical" class="verticalLine" v-if="scope.row.state == 9" />
<router-link :to="'/qualification/myQualifications/viewDetail/' + scope.row.id" custom
v-slot="{ href }">
<a class="replayTextBtn" :href="href" target="_blank">查看</a>
</router-link>
<el-divider direction="vertical" class="verticalLine" v-if="scope.row.state == 1" />
<el-button type="primary" text class="deleteTextBtn" v-if="scope.row.state == 1"
@click="handleDetele(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageIndex"
v-model:limit="queryParams.pageSize" @pagination="getBusUserQualificationPageList" />
v-model:limit="queryParams.pageSize" @pagination="getCurUserQualificationPageList" />
</div>
<QualificationApplyForm v-else ref="qualificationApplyFormRef" @refresh="reloadList" />
<QualificationApplyForm v-if="isShowForm" ref="qualificationApplyFormRef" @refresh="reloadList" />
<QualificationReApplyForm v-if="isShowReForm" ref="reApplyFormRef" @refresh="reloadList" />
</template>
<script setup>
import { onMounted, ref } from 'vue'
import { onMounted, ref, nextTick } from 'vue'
import applyIcon from '@/assets/images/applyIcon.png'
import QualificationApplyForm from './QualificationApplyForm.vue'
import { getCurUserQualification } from "@/api/qualification/myQualifications"
import QualificationReApplyForm from './QualificationReApplyForm.vue'
import { getCurUserQualification, deleteBusUserQualification } from "@/api/qualification/myQualifications"
const { proxy } = getCurrentInstance()
const isShowForm = ref(false)
const isShowReForm = ref(false)
const reApplyFormRef = ref(null)
const queryParams = ref({
pageIndex: 1,
pageSize: 10,
node: 0
})
const loading = ref(true)
const total = ref("")
const total = ref(0)
const tableData = ref([])
// 初始化
onMounted(() => {
@ -77,8 +91,27 @@ const handleOpenApplyForm = () => {
// 表单操作回调
const reloadList = () => {
isShowForm.value = false
isShowReForm.value = false
getCurUserQualificationPageList();
}
// 重新申请
const handleReplay = (record) => {
isShowReForm.value = true
nextTick(() => {
reApplyFormRef.value.getQualificationInfo(record.id, record.node);
});
}
// 删除
const handleDetele = (record) => {
const rowId = record.id
proxy.$modal.confirm('是否确认删除该项数据项？').then(function () {
return deleteBusUserQualification(rowId)
}).then(() => {
getCurUserQualificationPageList();
proxy.$modal.msgSuccess("删除成功")
}).catch(() => { })
}
</script>
<style lang='scss'>
.optionBtn {

5
src/views/qualification/myQualifications/components/QualificationApplyForm.vue
View File

@ -373,9 +373,8 @@ const handleSetQualificationForm = (filePath) => {
}
// 设置实操经验表单
const handleSetExperienceFile = (filePath) => {
console.log('接收资质表单照片', filePath)
ruleForm.value.beforeCondition.qualificationForm = filePath
const handleSetExperienceFile = (filePath) => {
ruleForm.value.beforeCondition.experienceFile = filePath
}
// 设置健康证明
const handleSetHealthCertificate = (filePath) => {

843
src/views/qualification/myQualifications/components/QualificationDetailForm.vue Normal file
View File

@ -0,0 +1,843 @@
<template>
<div class="app-page-container">
<el-breadcrumb class="app-breadcrumb" separator=">">
<transition-group name="breadcrumb">
<el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
<span v-if="index == levelList.length - 1" class="link-redirect">{{
item.title }}</span>
<span v-else class="no-redirect">{{ item.title }}</span>
</el-breadcrumb-item>
</transition-group>
</el-breadcrumb>
<div class="rootContainer clearBoth">
<el-card>
<template #header>
<div class="card-header">
<span>目标资质：{{ detailForm.qualificationName }}</span>
</div>
</template>
<el-form ref="detailFormRef" :model="detailForm" label-position="left">
<!-- <div class="headerTitle">基本信息</div> -->
<div class="applyFormContainer">
<el-row class="myRow" :gutter="20">
<el-col :span="20">
<el-row class="myRow" :gutter="20">
<el-col :span="8">
<el-form-item label="当前资质:">
{{ detailForm.sourceQualificationName ? detailForm.sourceQualificationName :
'-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="部门:">
{{ detailForm.deptName ? detailForm.deptName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="科室:">
{{ detailForm.sectionName ? detailForm.sectionName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工工号:">
{{ detailForm.workNo ? detailForm.workNo : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工姓名(中文):">
{{ detailForm.userName ? detailForm.userName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工姓名(英文):">
{{ detailForm.englishName ? detailForm.englishName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="属地:">
{{ detailForm.dependencyName ? detailForm.dependencyName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="属地ESC:">
{{ detailForm.escUserName ? detailForm.escUserName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="创建时间:">
{{ detailForm.createTime ? detailForm.createTime : '-' }}
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col :span="4">
<el-form-item label="审批状态" label-position="top" class="myFormItemLable">
<template v-if="detailForm.state">
<el-text v-if="detailForm.state == 1 && detailForm.node == 0" type="info"
class="infoinfoText">待审核</el-text>
<el-text v-if="detailForm.state == 1 && detailForm.node == 2" type="info"
class="infoinfoText">待培训中心审核</el-text>
<el-text v-if="detailForm.state == 2" type="success"
class="successText">通过</el-text>
<el-text v-if="detailForm.state == 9" type="danger"
class="dangerText">驳回</el-text>
</template>
<template v-else>-</template>
</el-form-item>
</el-col>
</el-row>
</div>
</el-form>
<el-form ref="beforeConditionInfoRef" :model="beforeConditionInfo" label-position="top">
<div class="headerTitle">前置条件</div>
<div class="applyFormContainer" v-if="detailForm.qualificationId">
<div v-if="detailForm.qualificationId == 'SH'">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="电工证初领日期">
<el-date-picker v-model="beforeConditionInfo.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证复审日期">
<el-date-picker v-model="beforeConditionInfo.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证状态">
<template v-if="isAfterToday()">
<div class="hightSatusNomar"></div>
<div class="statusLabel">正常</div>
</template>
<template v-else>
<div class="hightSatusDanger"> </div>
<div class="statusLabel">过期</div>
</template>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="培训紧迫程度">
<el-radio-group v-model="beforeConditionInfo.urgency" disabled>
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片">
<img :src="beforeConditionInfo.certificatePhoto.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.certificatePhoto"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.certificatePhoto)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="detailForm.qualificationId == 'ES'">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="电工证初领日期">
<el-date-picker v-model="beforeConditionInfo.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证复审日期">
<el-date-picker v-model="beforeConditionInfo.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证状态">
<template v-if="isAfterToday()">
<div class="hightSatusNomar"></div>
<div class="statusLabel">正常</div>
</template>
<template v-else>
<div class="hightSatusDanger"> </div>
<div class="statusLabel">过期</div>
</template>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="培训紧迫程度">
<el-radio-group v-model="beforeConditionInfo.urgency" disabled>
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片">
<img :src="beforeConditionInfo.certificatePhoto.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.certificatePhoto"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.certificatePhoto)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="SH资质上传">
<img :src="beforeConditionInfo.shFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.shFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.shFile)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="6个月实操经验">
<el-radio-group v-model="beforeConditionInfo.practicalExperience" disabled>
<el-radio value="0">无</el-radio>
<el-radio value="1">有</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8" v-if="beforeConditionInfo.practicalExperience == '1'">
<el-form-item label="实操经验表单">
<img :src="beforeConditionInfo.experienceFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.experienceFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.experienceFile)" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="detailForm.qualificationId == 'ESC' || ruleForm.qualificationId == 'CESC'">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="电工证初领日期">
<el-date-picker v-model="beforeConditionInfo.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证复审日期">
<el-date-picker v-model="beforeConditionInfo.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证状态">
<template v-if="isAfterToday()">
<div class="hightSatusNomar"></div>
<div class="statusLabel">正常</div>
</template>
<template v-else>
<div class="hightSatusDanger"> </div>
<div class="statusLabel">过期</div>
</template>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="培训紧迫程度">
<el-radio-group v-model="beforeConditionInfo.urgency" disabled>
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片">
<img :src="beforeConditionInfo.certificatePhoto.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.certificatePhoto"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.certificatePhoto)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="ES资质上传" prop="beforeConditionInfo.esFile">
<img :src="beforeConditionInfo.esFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.esFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.esFile)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="detailForm.qualificationId == 'LLP'">
<el-row class="myRow" :gutter="20">
<el-col :span="12">
<el-form-item label="非电池生产线员工/电池生产线员工">
<el-radio-group v-model="beforeConditionInfo.batteryLine">
<el-radio value="0">非电池生产线员工</el-radio>
<el-radio value="1">电池生产线员工</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="具备资质">
<el-checkbox-group v-model="beforeConditionInfo.hasQualified" disabled>
<el-checkbox v-if="beforeConditionInfo.batteryLine == 1" label="SH"
value="SH" />
<el-checkbox label="ES" value="ES" />
<el-checkbox label="ESC" value="ESC" />
<el-checkbox label="CESC" value="CESC" />
</el-checkbox-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="急救证发证日期">
<el-date-picker v-model="beforeConditionInfo.firstCollectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择急救证发证日期"
style="width: 60%;" disabled />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="急救证到期日期">
<el-date-picker v-model="beforeConditionInfo.firstCollectionExpireDate"
type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
placeholder="请选择急救证到期日期" style="width: 60%;" disabled />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="健康证明" prop="beforeConditionInfo.healthCertificate">
<img :src="beforeConditionInfo.healthCertificate.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.healthCertificate"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.healthCertificate)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="急救证" prop="beforeConditionInfo.firstCertificateFile">
<img :src="beforeConditionInfo.firstCertificateFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.firstCertificateFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.firstCertificateFile)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
</el-row>
</div>
</div>
</el-form>
<div class="headerTitle">审批记录</div>
<div class="applyFormContainer">
<el-table :data="tableData" style="width: 100%;margin-bottom: 20px;">
<el-table-column label="序号" width="160">
<template #default="scope">
{{ scope.$index + 1 }}
</template>
</el-table-column>
<el-table-column prop="checkNode" label="节点名称" width="260">
<template #default="scope">
<span v-if="scope.row.checkNode == 0 && scope.row.checkStatus == 1">提交申请</span>
<span v-if="scope.row.checkNode == 1 && scope.row.checkStatus == 2">ESC审核通过</span>
<span v-if="scope.row.checkNode == 1 && scope.row.checkStatus == 9">ESC驳回</span>
<span v-if="scope.row.checkNode == 2 && scope.row.checkStatus == 2">培训中心审核通过</span>
<span v-if="scope.row.checkNode == 2 && scope.row.checkStatus == 9">培训中心驳回</span>
<span v-if="scope.row.checkNode == 0 && scope.row.checkStatus == 3">用户重新申请</span>
<span v-if="scope.row.checkNode == 1 && scope.row.checkStatus == 3">ESC代替用户重新申请</span>
</template>
</el-table-column>
<el-table-column prop="remark" label="审批意见" min-width="100" align="left" />
<el-table-column prop="createTime" label="审批时间" width="230">
<template #default="scope">
<span v-if="scope.row.createTime"> {{ scope.row.createTime }}</span>
<span v-else>-</span>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
</div>
<!-- 图片预览 -->
<el-dialog v-model="dialogVisible" title="图片预览">
<img v-if="isImageFile(dialogImageUrl)" :src="dialogImageUrl" class="preview-image" alt="Preview Image" />
<div v-else class="unsupported-file">
<pdf-preview :pdf-url="dialogImageUrl" />
</div>
</el-dialog>
</div>
</template>
<script setup>
import { onMounted, reactive } from 'vue'
import { getBusUserQualificationDetail, getBusUserQualificationRecord } from "@/api/qualification/myQualifications"
import { useRouter } from 'vue-router'
import pdfIcon from '@/assets/images/pdfIcon.png'
import PdfPreview from './PdfPreview.vue'
const route = useRoute()
const baseUrl = import.meta.env.VITE_APP_BASE_API
const dialogImageUrl = ref('')
const dialogVisible = ref(false)
const suffix = ref('')
const router = useRouter()
const levelList = ref([
{ title: '资质管理', path: '/qualification' },
{ title: '我的资质', path: '/qualification/escApproval' },
{ title: '审批详情', path: '/qualification/escApproval/approvalDetail' }
])
const { proxy } = getCurrentInstance()
const data = reactive({
detailForm: {
qualificationName: '',
sourceQualificationName: '',
deptName: '',
sectionName: '',
workNo: '',
userName: '',
englishName: '',
dependencyName: '',
escUserName: '',
createTime: '',
state: null,
node: null,
qualificationId: ''
},
beforeConditionInfo: {
collectionDate: null,
reviewDate: null,
urgency: '',
certificatePhoto: '',
qualificationForm: '',
shFile: '',
esFile: '',
batteryLine: '',
hasQualified: [],
firstCollectionDate: null,
firstCollectionExpireDate: null,
healthCertificate: '',
firstCertificateFile: '',
practicalExperience: '',
experienceFile: ''
},
ruleForm: {
state: '',
remark: ''
},
rules: {
state: [{ required: true, message: "请选择审批结果", trigger: "change" }],
remark: [{ required: true, message: "审批意见不能为空", trigger: "blur" }]
},
})
// 审批记录
const tableData = ref([])
// 获取审批记录
const getQualificationApprovalRecord = (_id) => {
var queryParamsRecord = {
pageIndex: 1,
pageSize: 50,
userQualificationId: _id
}
getBusUserQualificationRecord(queryParamsRecord).then(res => {
if (res.code == 200) tableData.value = res.data.list
})
}
const { ruleForm, detailForm, beforeConditionInfo, rules } = toRefs(data)
// 初始化
onMounted(() => {
const id = route.params && route.params.Id
if (id) {
console.log('接收id', id)
ruleForm.value.id = id
getDetailInfo(id)
getQualificationApprovalRecord(id)
} else {
ruleForm.value.id = null
}
});
// 判断是否为图片文件
const isImageFile = (filePath) => {
// 处理无后缀名情况
if (!filePath || filePath.indexOf('.') === -1) return '';
suffix.value = filePath.split('.').pop();
console.log('后缀', filePath.split('.').pop())
return ['jpeg', 'jpg', 'png'].includes(suffix.value?.toLowerCase())
}
// 预览
const handleCardPreview = (filePath) => {
// 处理无后缀名情况
if (!filePath || filePath.indexOf('.') === -1) return '';
suffix.value = filePath.split('.').pop();
dialogImageUrl.value = baseUrl + filePath
dialogVisible.value = true
}
// 获取详情
const getDetailInfo = (_id) => {
var _queryParams = {
id: _id,
node: 1
}
getBusUserQualificationDetail(_queryParams).then(res => {
if (res.code == 200) {
detailForm.value = res.data
detailForm.value = {
qualificationName: res.data.qualificationName,
sourceQualificationName: res.data.sourceQualificationName,
deptName: res.data.deptName,
sectionName: res.data.sectionName,
workNo: res.data.workNo,
userName: res.data.userName,
englishName: res.data.englishName,
dependencyName: res.data.dependencyName,
escUserName: res.data.escUserName,
createTime: res.data.createTime,
state: res.data.state,
node: res.data.node,
qualificationId: res.data.qualificationId,
}
beforeConditionInfo.value = JSON.parse(res.data.beforeCondition)
console.log('资质详情', detailForm.value, beforeConditionInfo.value)
}
})
}
// 对比日期是否在今天之后
const isAfterToday = () => {
const today = new Date();
today.setHours(0, 0, 0, 0); // 清除时间部分
const dateToCompare = new Date(beforeConditionInfo.value.reviewDate);
return dateToCompare > today;
};
const handleCancel = () => {
router.push({
path: '/qualification/escApproval'
})
}
</script>
<style lang='scss'>
.app-main {
height: 100vh;
width: 100%;
position: relative;
overflow: hidden;
background-color: #F8F8F8;
}
.app-breadcrumb.el-breadcrumb {
width: 1200px;
margin: 0 auto;
height: 44px;
line-height: 44px;
font-size: 18px;
background: #f8f8f8;
.el-breadcrumb__item {
.el-breadcrumb__separator {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #000000 !important;
margin: 0 9px;
}
}
.no-redirect {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #000000;
cursor: text;
}
.link-redirect {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #0090FF;
cursor: text;
text-decoration: underline;
text-underline-offset: 4px;
}
}
.clearBoth {
clear: both;
}
.rootContainer {
width: 1200px;
margin: 0 auto;
height: calc(100vh - 134px);
overflow-y: auto;
overflow-x: hidden;
background: #ffffff;
}
.el-card {
border: none;
}
.el-card__header {
min-height: 50px;
font-family: Microsoft YaHei;
font-weight: 700;
font-size: 20px;
text-align: left;
color: #000000;
border-bottom: 1px solid #DCDCDC;
box-sizing: border-box;
padding: 10px 20px 17px 20px;
}
.el-card__body {
padding: 0px 20px 0 20px !important;
}
.el-card.is-always-shadow {
box-shadow: none;
}
.headerTitle {
font-family: Microsoft YaHei;
font-weight: 700;
font-size: 18px;
text-align: left;
color: #000000;
background: #e9e9e9;
padding: 6px 14px;
}
.infoinfoText {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #DD9200;
}
.successText {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #00B32A;
}
.dangerText {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #E13434;
}
.hightSatusNomar {
display: inline-block;
width: 16px;
height: 16px;
border-radius: 8px;
background: #00B32A;
}
.hightSatusDanger {
display: inline-block;
width: 16px;
height: 16px;
border-radius: 8px;
background: #E13434;
}
.statusLabel {
display: inline-block;
padding-left: 10px;
}
.applyFormContainer {
padding-top: 20px;
overflow: hidden;
}
.submitTool {
width: 100%;
height: 76px;
position: absolute;
top: calc(100% - 76px);
background: #ffffff;
box-shadow: 1px 2px 10px 0 #93939333;
text-align: center;
line-height: 76px;
}
.cancelApplyBtn {
width: 100px;
height: 36px;
border-radius: 4px 4px 4px 4px;
background: #ea9f0e;
font-family: Microsoft YaHei;
font-weight: 700;
font-size: 16px;
text-align: center;
color: #FFFFFF;
}
.cancelApplyBtn:hover {
background: #ea9f0e;
color: #FFFFFF;
}
.submitApplyBtn {
width: 100px;
height: 36px;
border-radius: 4px 4px 4px 4px;
background: #4276d1;
font-family: Microsoft YaHei;
font-weight: 700;
font-size: 16px;
text-align: center;
color: #FFFFFF;
}
.submitApplyBtn:hover {
background: #4276d1;
color: #FFFFFF;
}
.myRow {
margin-left: 0 !important;
margin-right: 0 !important;
}
.el-form-item--default {
margin-bottom: 20px !important;
}
.el-form-item--label-left .el-form-item__label {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 16px;
text-align: left;
color: #787878;
padding: 0 10px 0 0;
}
.myFormItemLable {
padding-top: 22px;
}
.myFormItemLable .el-form-item__label {
font-family: Microsoft YaHei !important;
font-weight: 400 !important;
font-size: 16px !important;
text-align: left !important;
color: #787878 !important;
padding: 0 10px 0 44px;
}
.myFormItemLable .el-form-item__content {
font-family: Arial !important;
font-weight: 400 !important;
font-size: 18px !important;
text-align: left !important;
color: #000000 !important;
padding-left: 44px;
}
.el-form-item--label-left .el-form-item__content {
font-family: Arial;
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-form-item--label-top .el-form-item__label {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
text-align: left;
color: #666666;
}
.el-form-item--label-top .el-form-item__content {
font-family: Arial;
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-form-item--label-top .el-textarea__inner {
font-family: Arial;
font-weight: 400;
font-size: 18px;
color: #000000;
}
.el-input__inner {
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-select__wrapper {
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-form-item__error {
font-size: 16px;
}
.el-radio__inner {
width: 16px !important;
height: 16px !important;
}
.el-radio__label {
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-radio__input.is-disabled.is-checked .el-radio__inner {
background-color: var(--el-color-primary);
border-color: var(--el-color-primary);
}
.el-radio__input.is-disabled.is-checked .el-radio__inner:after {
background-color: var(--el-color-white);
}
.preview-image {
width: 100%;
max-height: 70vh;
object-fit: contain;
}
.unsupported-file {
padding: 0px;
text-align: center;
color: #999;
height: 70vh;
}
.viewFile {
width: 148px;
height: 148px;
border: 1px solid #dedede;
border-radius: 6px;
}
</style>

654
src/views/qualification/myQualifications/components/QualificationReApplyForm.vue Normal file
View File

@ -0,0 +1,654 @@
<template>
<div class="qualification-rootContainer">
<div class="borderLine"></div>
<el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="top">
<div class="headerTitle">基本信息</div>
<div class="applyFormContainer">
<el-row class="myRow" :gutter="20">
<el-col :span="8">
<el-form-item label="目标资质" prop="qualificationId">
<el-select v-model="ruleForm.qualificationId" placeholder="请选择目标资质" clearable>
<el-option v-for="dict in target_qualification" :key="dict.value" :label="dict.label"
:value="dict.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工工号" prop="workNo">
<el-input v-model="ruleForm.workNo" placeholder="请输入员工工号" disabled />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工姓名(中文)" prop="nickName">
<el-input v-model="ruleForm.nickName" placeholder="请输入员工姓名(中文)" disabled />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工姓名(英文)" prop="englishName">
<el-input v-model="ruleForm.englishName" placeholder="请输入员工姓名(英文)" disabled />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="部门" prop="deptId">
<el-tree-select v-model="ruleForm.deptId" :data="enabledDeptOptions" disabled
:props="{ value: 'id', label: 'label', children: 'children' }" value-key="id"
placeholder="请选择部门" check-strictly />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="科室" prop="sectionId">
<el-select v-model="ruleForm.sectionId" placeholder="请选择科室" disabled>
<el-option v-for="item in sectionData" :key="item.sectionId" :label="item.sectionName"
:value="item.sectionId" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="属地" prop="dependencyId">
<el-select v-model="ruleForm.dependencyId" placeholder="请选择属地" disabled>
<el-option v-for="item in busDependencyData" :key="item.id" :label="item.dependencyName"
:value="item.id" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="属地ESC" prop="escUserName">
<el-input v-model="ruleForm.escUserName" disabled />
</el-form-item>
</el-col>
</el-row>
</div>
<div class="headerTitle" v-if="ruleForm.qualificationId">前置条件</div>
<div class="applyFormContainer" v-if="ruleForm.qualificationId">
<div v-if="ruleForm.qualificationId == 'SH'">
<el-row class="myRow" :gutter="20">
<el-col :span="8">
<el-form-item label="电工证初领日期" prop="beforeCondition.collectionDate">
<el-date-picker v-model="ruleForm.beforeCondition.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" @change="handleCollectionDateChange" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证复审日期" prop="beforeCondition.reviewDate">
<el-date-picker v-model="ruleForm.beforeCondition.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="培训紧迫程度" prop="beforeCondition.urgency">
<el-radio-group v-model="ruleForm.beforeCondition.urgency">
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片" prop="beforeCondition.certificatePhoto">
<myFileUpload ref="certificatePhotoRef" @set-form-file="handleSetCertificatePhoto" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单" prop="beforeCondition.qualificationForm">
<myFileUpload ref="qualificationFormRef" @set-form-file="handleSetQualificationForm" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="ruleForm.qualificationId == 'ES'">
<el-row class="myRow" :gutter="20">
<el-col :span="8">
<el-form-item label="电工证初领日期" prop="beforeCondition.collectionDate">
<el-date-picker v-model="ruleForm.beforeCondition.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" @change="handleCollectionDateChange" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证复审日期" prop="beforeCondition.reviewDate">
<el-date-picker v-model="ruleForm.beforeCondition.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="培训紧迫程度" prop="beforeCondition.urgency">
<el-radio-group v-model="ruleForm.beforeCondition.urgency">
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片" prop="beforeCondition.certificatePhoto">
<myFileUpload ref="certificatePhotoRef" @set-form-file="handleSetCertificatePhoto" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="SH资质上传" prop="beforeCondition.shFile">
<myFileUpload ref="shFileRef" @set-form-file="handleSetShFile" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单" prop="beforeCondition.qualificationForm">
<myFileUpload ref="qualificationFormRef" @set-form-file="handleSetQualificationForm" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="6个月实操经验" prop="beforeCondition.practicalExperience">
<el-radio-group v-model="ruleForm.beforeCondition.practicalExperience">
<el-radio value="0">无</el-radio>
<el-radio value="1">有</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8" v-if="ruleForm.beforeCondition.practicalExperience == '1'">
<el-form-item label="实操经验表单" prop="beforeCondition.experienceFile">
<myFileUpload ref="experienceFileRef" @set-form-file="handleSetExperienceFile" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="ruleForm.qualificationId == 'ESC' || ruleForm.qualificationId == 'CESC'">
<el-row class="myRow" :gutter="20">
<el-col :span="8">
<el-form-item label="电工证初领日期" prop="beforeCondition.collectionDate">
<el-date-picker v-model="ruleForm.beforeCondition.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" @change="handleCollectionDateChange" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证复审日期" prop="beforeCondition.reviewDate">
<el-date-picker v-model="ruleForm.beforeCondition.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="培训紧迫程度" prop="beforeCondition.urgency">
<el-radio-group v-model="ruleForm.beforeCondition.urgency">
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片" prop="beforeCondition.certificatePhoto">
<myFileUpload ref="certificatePhotoRef" @set-form-file="handleSetCertificatePhoto" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="ES资质上传" prop="beforeCondition.esFile">
<myFileUpload ref="esFileRef" @set-form-file="handleSetESFile" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单" prop="beforeCondition.qualificationForm">
<myFileUpload ref="qualificationFormRef" @set-form-file="handleSetQualificationForm" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="ruleForm.qualificationId == 'LLP'">
<el-row class="myRow" :gutter="20">
<el-col :span="12">
<el-form-item label="非电池生产线员工/电池生产线员工" prop="beforeCondition.batteryLine">
<el-radio-group v-model="ruleForm.beforeCondition.batteryLine">
<el-radio value="0">非电池生产线员工</el-radio>
<el-radio value="1">电池生产线员工</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="具备资质" prop="beforeCondition.hasQualified">
<el-checkbox-group v-model="ruleForm.beforeCondition.hasQualified">
<el-checkbox v-if="ruleForm.beforeCondition.batteryLine == '1'" label="SH"
value="SH" />
<el-checkbox label="ES" value="ES" />
<el-checkbox label="ESC" value="ESC" />
<el-checkbox label="CESC" value="CESC" />
</el-checkbox-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="急救证发证日期" prop="beforeCondition.firstCollectionDate">
<el-date-picker v-model="ruleForm.beforeCondition.firstCollectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择急救证发证日期"
style="width: 100%;" @change="handleFirstCollectionDateChange" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="急救证到期日期" prop="beforeCondition.firstCollectionExpireDate">
<el-date-picker v-model="ruleForm.beforeCondition.firstCollectionExpireDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择急救证到期日期"
style="width: 100%;" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="健康证明" prop="beforeCondition.healthCertificate">
<myFileUpload ref="healthCertificateRef" @set-form-file="handleSetHealthCertificate" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="急救证" prop="beforeCondition.firstCertificateFile">
<myFileUpload ref="firstCertificateFileRef"
@set-form-file="handleSetFirstCertificateFile" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单" prop="beforeCondition.qualificationForm">
<myFileUpload ref="qualificationFormRef" @set-form-file="handleSetQualificationForm" />
</el-form-item>
</el-col>
</el-row>
</div>
</div>
</el-form>
</div>
<div class="qualification-submitTool">
<el-button class="cancelApplyBtn" @click="handleCancel">取消</el-button>
<el-button class="submitApplyBtn" @click="handleSubmit">提交</el-button>
</div>
</template>
<script setup>
import { onMounted, reactive, defineEmits, defineExpose, ref, nextTick } from 'vue'
import { deptTreeSelect } from "@/api/system/user"
import { getBusDependencyPage } from "@/api/system/dependency"
import { getSysSectionPage } from "@/api/system/section"
import { reApplyBusUserQualification, getBusUserQualificationDetail } from "@/api/qualification/myQualifications"
import myFileUpload from './myFileUpload.vue'
import moment from 'moment'
const certificatePhotoRef = ref(null)
const qualificationFormRef = ref(null)
const shFileRef = ref(null)
const experienceFileRef = ref(null)
const esFileRef = ref(null)
const healthCertificateRef = ref(null)
const firstCertificateFileRef = ref(null)
const emit = defineEmits(['refresh'])
const { proxy } = getCurrentInstance()
const { target_qualification } = proxy.useDict("target_qualification")
console.log('目标资质', target_qualification)
const data = reactive({
ruleForm: {
qualificationId: undefined,
workNo: undefined,
nickName: undefined,
englishName: undefined,
deptId: undefined,
sectionId: undefined,
dependencyId: undefined,
escUserName: undefined,
beforeCondition: {
collectionDate: undefined,
reviewDate: undefined,
urgency: undefined,
certificatePhoto: undefined,
esFile: undefined,
shFile: undefined,
practicalExperience: undefined,
experienceFile: undefined,
batteryLine: '0',
hasQualified: [],
qualificationForm: undefined,
firstCollectionDate: undefined,
firstCollectionExpireDate: undefined,
healthCertificate: undefined,
firstCertificateFile: undefined
}
},
rules: {
qualificationId: [{ required: true, message: "目标资质不能为空", trigger: "change" }],
workNo: [{ required: true, message: "员工工号不能为空", trigger: "blur" }],
nickName: [{ required: true, message: "员工姓名(中文)不能为空", trigger: "blur" }],
englishName: [{ required: true, message: "员工姓名(英文)", trigger: "blur" }],
deptId: [{ required: true, message: "部门不能为空", trigger: "change" }],
sectionId: [{ required: true, message: "科室不能为空", trigger: "change" }],
dependencyId: [{ required: true, message: "属地不能为空", trigger: "change" }],
escUserName: [{ required: true, message: "属地ESC不能为空", trigger: "blur" }],
beforeCondition: {
collectionDate: [
{ required: true, message: '电工证初领日期不能为空', trigger: 'change' }
],
reviewDate: [
{ required: true, message: '电工证复审日期不能为空', trigger: 'change' }
],
urgency: [
{ required: true, message: '培训紧迫程度不能为空', trigger: 'change' }
],
certificatePhoto: [
{ required: true, message: '电工证照片不能为空', trigger: 'change' }
],
esFile: [
{ required: true, message: 'ES资质不能为空', trigger: 'change' }
],
shFile: [
{ required: true, message: 'SH资质不能为空', trigger: 'change' }
],
practicalExperience: [
{ required: true, message: '是否有实操经验不能为空', trigger: 'change' }
],
batteryLine: [
{ required: true, message: '请选择', trigger: 'change' }
],
experienceFile: [
{ required: true, message: '实操经验表单不能为空', trigger: 'change' }
],
hasQualified: [
{ required: true, message: '请选择具备资质', trigger: 'change' }
],
qualificationForm: [
{ required: true, message: '资质申请表单不能为空', trigger: 'change' }
],
firstCollectionDate: [
{ required: true, message: '急救证发证日期不能为空', trigger: 'change' }
],
firstCollectionExpireDate: [
{ required: true, message: '急救证到期日期不能为空', trigger: 'change' }
],
healthCertificate: [
{ required: true, message: '健康证明不能为空', trigger: 'change' }
],
firstCertificateFile: [
{ required: true, message: '急救证不能为空', trigger: 'change' }
],
}
},
})
// 设置电工证照片
const handleSetCertificatePhoto = (filePath) => {
console.log('接收电工证照片', filePath)
ruleForm.value.beforeCondition.certificatePhoto = filePath
}
// 设置SH资质
const handleSetShFile = (filePath) => {
ruleForm.value.beforeCondition.shFile = filePath
}
// 设置ES资质
const handleSetESFile = (filePath) => {
ruleForm.value.beforeCondition.esFile = filePath
}
// 设置资质表单路径
const handleSetQualificationForm = (filePath) => {
console.log('接收资质表单照片', filePath)
ruleForm.value.beforeCondition.qualificationForm = filePath
}
// 设置实操经验表单
const handleSetExperienceFile = (filePath) => {
ruleForm.value.beforeCondition.experienceFile = filePath
}
// 设置健康证明
const handleSetHealthCertificate = (filePath) => {
ruleForm.value.beforeCondition.healthCertificate = filePath
}
// 设置急救证
const handleSetFirstCertificateFile = (filePath) => {
ruleForm.value.beforeCondition.firstCertificateFile = filePath
}
// 电工证初领日期选择
const handleCollectionDateChange = (val) => {
ruleForm.value.beforeCondition.reviewDate = moment(val).add(3, 'years').format('YYYY-MM-DD')
}
// 急救证发证日期选择
const handleFirstCollectionDateChange = (val) => {
ruleForm.value.beforeCondition.firstCollectionExpireDate = moment(val).add(3, 'years').format('YYYY-MM-DD')
}
// 初始化
onMounted(() => {
getBusDependencyData()
getDeptTree()
getSysSectionData()
});
const getQualificationInfo = (detailId, _node) => {
console.log('接收参数', detailId)
var _queryParams = {
id: detailId,
node: _node
}
getBusUserQualificationDetail(_queryParams).then(res => {
console.log('详情', res)
if (res.code == 200) {
// ruleForm.value = res.data
ruleForm.value = {
id: res.data.id,
qualificationName: res.data.qualificationName,
sourceQualificationName: res.data.sourceQualificationName,
deptId: res.data.deptId,
deptName: res.data.deptName,
sectionId: res.data.sectionId,
sectionName: res.data.sectionName,
workNo: res.data.workNo,
nickName: res.data.userName,
englishName: res.data.englishName,
dependencyId: res.data.dependencyId,
dependencyName: res.data.dependencyName,
escUserName: res.data.escUserName,
createTime: res.data.createTime,
state: res.data.state,
node: res.data.node,
qualificationId: res.data.qualificationId,
}
ruleForm.value.beforeCondition = JSON.parse(res.data.beforeCondition)
nextTick(() => {
if (ruleForm.value.beforeCondition.certificatePhoto) certificatePhotoRef.value.setFileInfo(ruleForm.value.beforeCondition.certificatePhoto)
if (ruleForm.value.beforeCondition.qualificationForm) qualificationFormRef.value.setFileInfo(ruleForm.value.beforeCondition.qualificationForm)
if (ruleForm.value.beforeCondition.shFile) shFileRef.value.setFileInfo(ruleForm.value.beforeCondition.shFile)
if (ruleForm.value.beforeCondition.experienceFile) experienceFileRef.value.setFileInfo(ruleForm.value.beforeCondition.experienceFile)
if (ruleForm.value.beforeCondition.esFile) esFileRef.value.setFileInfo(ruleForm.value.beforeCondition.esFile)
if (ruleForm.value.beforeCondition.healthCertificate) healthCertificateRef.value.setFileInfo(ruleForm.value.beforeCondition.healthCertificate)
if (ruleForm.value.beforeCondition.firstCertificateFile) firstCertificateFileRef.value.setFileInfo(ruleForm.value.beforeCondition.firstCertificateFile)
});
console.log('资质详情', ruleForm.value)
}
})
}
// 属地数据
const busDependencyData = ref([])
// 获取属地数据
const getBusDependencyData = () => {
getBusDependencyPage({
pageIndex: 1,
pageSize: 100,
}).then(response => {
if (response.code == 200) {
busDependencyData.value = response.data.list
}
})
}
// 部门数据
const enabledDeptOptions = ref(undefined)
// 获取部门数据
const getDeptTree = () => {
deptTreeSelect().then(res => {
enabledDeptOptions.value = filterDisabledDept(JSON.parse(JSON.stringify(res.data)))
})
}
/** 过滤禁用的部门 */
const filterDisabledDept = (deptList) => {
return deptList.filter(dept => {
if (dept.disabled) {
return false
}
if (dept.children && dept.children.length) {
dept.children = filterDisabledDept(dept.children)
}
return true
})
}
// 科室数据
const sectionData = ref([])
// 获取科室数据
const getSysSectionData = () => {
getSysSectionPage({
pageIndex: 1,
pageSize: 100,
}).then(res => {
if (res.code == 200) {
sectionData.value = res.data.list
}
})
}
const { ruleForm, rules } = toRefs(data)
const handleCancel = () => {
proxy.resetForm("ruleFormRef")
emit('refresh')
}
const handleSubmit = () => {
proxy.$refs["ruleFormRef"].validate(valid => {
if (valid) {
console.log('bioa', ruleForm.value)
const submitForm = ruleForm.value
submitForm.beforeCondition = JSON.stringify(ruleForm.value.beforeCondition)
submitForm.node = 0
reApplyBusUserQualification(submitForm).then(res => {
if (res.code == 200) {
proxy.$modal.msgSuccess("提交成功")
emit('refresh')
} else {
proxy.$modal.msgSuccess(res.msg)
}
})
}
})
}
// 暴露方法给父组件
defineExpose({
getQualificationInfo
});
</script>
<style lang='scss'>
.qualification-rootContainer {
width: 100%;
height: calc(100vh - 320px);
overflow-y: auto;
overflow-x: hidden;
}
.headerTitle {
font-family: Microsoft YaHei;
font-weight: 700;
font-size: 18px;
text-align: left;
color: #000000;
background: #e9e9e9;
padding: 6px 14px;
}
.applyFormContainer {
padding-top: 20px;
overflow: hidden;
}
.qualification-submitTool {
width: 100%;
height: 76px;
position: absolute;
top: calc(100vh - 320px);
background: #ffffff;
text-align: center;
line-height: 76px;
box-shadow: none;
}
.cancelApplyBtn {
width: 100px;
height: 36px;
border-radius: 4px 4px 4px 4px;
background: #ea9f0e;
font-family: Microsoft YaHei;
font-weight: 700;
font-size: 16px;
text-align: center;
color: #FFFFFF;
}
.cancelApplyBtn:hover {
background: #ea9f0e;
color: #FFFFFF;
}
.submitApplyBtn {
width: 100px;
height: 36px;
border-radius: 4px 4px 4px 4px;
background: #4276d1;
font-family: Microsoft YaHei;
font-weight: 700;
font-size: 16px;
text-align: center;
color: #FFFFFF;
}
.submitApplyBtn:hover {
background: #4276d1;
color: #FFFFFF;
}
.myRow {
margin-left: 0 !important;
margin-right: 0 !important;
}
.el-form-item--default {
margin-bottom: 20px !important;
}
.el-form-item--label-top .el-form-item__label {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
text-align: left;
color: #666666;
}
.el-input__inner {
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-select__wrapper {
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-checkbox__label {
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-form-item__error {
font-size: 16px;
}
.el-radio__inner {
width: 16px !important;
height: 16px !important;
}
.el-radio__label {
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
</style>

18
src/views/qualification/myQualifications/components/myFileUpload.vue
View File

@ -31,7 +31,7 @@
</template>
<script setup>
import { ref } from 'vue'
import { defineExpose, ref } from 'vue'
import { Plus, Delete } from '@element-plus/icons-vue'
import { uploadFile } from "@/api/qualification/myQualifications"
import pdfIcon from '@/assets/images/pdfIcon.png'
@ -47,6 +47,18 @@ const dialogImageUrl = ref('')
const dialogVisible = ref(false)
const suffix = ref('')
const setFileInfo = (filePath) => {
// 处理无后缀名情况
if (!filePath || filePath.indexOf('.') === -1) return '';
var suffix = filePath.split('.').pop();
fileList.value = [{
name: filePath,
url: baseUrl + filePath,
suffix: suffix
}]
}
// 判断是否为图片文件
const isImageFile = (suffix) => {
return ['jpeg', 'jpg', 'png'].includes(suffix?.toLowerCase())
@ -122,6 +134,10 @@ const handleChange = (file, files) => {
// 不需要清空 fileList，因为上传逻辑会处理
fileList.value = []
}
// 暴露方法给父组件
defineExpose({
setFileInfo
});
</script>
<style lang="scss" scoped>

72
src/views/qualification/trainApproval/PdfPreview.vue Normal file
View File

@ -0,0 +1,72 @@
<template>
<div class="pdf-viewer">
<vue-pdf-embed :source="pdfUrl" :page="currentPage" :style="`transform: scale(${scale})`"
class="pdf-document" />
<div class="pdf-controls">
<el-button @click="prevPage" :disabled="currentPage <= 1">上一页</el-button>
<span>第 {{ currentPage }} 页 / 共 {{ pageCount }} 页</span>
<el-button @click="nextPage" :disabled="currentPage >= pageCount">下一页</el-button>
<!-- <el-button @click="zoomIn">放大</el-button>
<el-button @click="zoomOut">缩小</el-button> -->
</div>
</div>
</template>
<script setup>
import { ref } from 'vue'
import VuePdfEmbed from 'vue-pdf-embed'
const props = defineProps({
pdfUrl: {
type: String,
required: true
},
pageCount: {
type: Number,
default: 1
}
})
const currentPage = ref(1)
const scale = ref(1)
const prevPage = () => {
if (currentPage.value > 1) currentPage.value--
}
const nextPage = () => {
if (currentPage.value < props.pageCount) currentPage.value++
}
const zoomIn = () => {
scale.value += 0.1
}
const zoomOut = () => {
if (scale.value > 0.5) scale.value -= 0.1
}
</script>
<style scoped>
.pdf-viewer {
display: flex;
flex-direction: column;
height: 100%;
}
.pdf-document {
flex: 1;
overflow: auto;
transform-origin: top left;
}
.pdf-controls {
display: flex;
align-items: center;
gap: 10px;
padding: 10px;
background: #f5f5f5;
border-top: 1px solid #ddd;
}
</style>

668
src/views/qualification/trainApproval/approvalDetail.vue
View File

@ -13,142 +13,328 @@
<el-card>
<template #header>
<div class="card-header">
<span>目标资质：ESC</span>
<span>目标资质：{{ detailForm.qualificationName }}</span>
</div>
</template>
<el-form ref="ruleFormRef" :model="ruleForm" label-position="left">
<el-form ref="detailFormRef" :model="detailForm" label-position="left">
<!-- <div class="headerTitle">基本信息</div> -->
<div class="applyFormContainer">
<el-row class="myRow" :gutter="20">
<el-col :span="20">
<el-row class="myRow" :gutter="20">
<el-col :span="8">
<el-form-item label="当前资质:" prop="targetQualification">
ES
<el-form-item label="当前资质:">
{{ detailForm.sourceQualificationName ? detailForm.sourceQualificationName :
'-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="部门:" prop="departmentName">
XXXX部门
<el-form-item label="部门:">
{{ detailForm.deptName ? detailForm.deptName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="科室:" prop="officeName">
XXX科室
<el-form-item label="科室:">
{{ detailForm.sectionName ? detailForm.sectionName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工工号:" prop="employeeNumber">
NO.43242342
<el-form-item label="员工工号:">
{{ detailForm.workNo ? detailForm.workNo : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工姓名(中文):" prop="employeeChineseName">
管思成
<el-form-item label="员工姓名(中文):">
{{ detailForm.userName ? detailForm.userName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工姓名(英文):" prop="employeeEnglishName">
GuangSiCheng
<el-form-item label="员工姓名(英文):">
{{ detailForm.englishName ? detailForm.englishName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="属地:" prop="localityName">
XXX属地
<el-form-item label="属地:">
{{ detailForm.dependencyName ? detailForm.dependencyName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="属地ESC:" prop="localityName">
赵文杰
<el-form-item label="属地ESC:">
{{ detailForm.escUserName ? detailForm.escUserName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="创建时间:" prop="employeeEnglishName">
2024-12-24 14:23
<el-form-item label="创建时间:">
{{ detailForm.createTime ? detailForm.createTime : '-' }}
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col :span="4">
<el-form-item label="审批状态" label-position="top" class="myFormItemLable">
待审批
<template v-if="detailForm.state">
<el-text v-if="detailForm.state == 1 && detailForm.node == 0" type="info"
class="infoinfoText">待审核</el-text>
<el-text v-if="detailForm.state == 1 && detailForm.node == 2" type="info"
class="infoinfoText">待培训中心审核</el-text>
<el-text v-if="detailForm.state == 2" type="success"
class="successText">通过</el-text>
<el-text v-if="detailForm.state == 9" type="danger"
class="dangerText">驳回</el-text>
</template>
<template v-else>-</template>
</el-form-item>
</el-col>
</el-row>
</div>
</el-form>
<el-form ref="ruleFormRef" :model="ruleForm" label-position="top">
<el-form ref="beforeConditionInfoRef" :model="beforeConditionInfo" label-position="top">
<div class="headerTitle">前置条件</div>
<div class="applyFormContainer">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="电工证初领日期" prop="collectionDate">
2023-12-06
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证复审日期" prop="reviewDate">
2027-12-06
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证状态">
正常
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="培训紧迫程度" prop="urgency">
<el-radio-group v-model="ruleForm.urgency">
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证照片" prop="urgency">
<el-image style="width: 176px; height: 107px;line-height: 50px;"
:src="'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'"
fit="fill" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="SH资质上传" prop="urgency">
<el-image style="width: 176px; height: 107px;line-height: 50px;"
:src="'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'"
fit="fill" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="ES资质上传" prop="urgency">
<el-image style="width: 176px; height: 107px;line-height: 50px;"
:src="'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'"
fit="fill" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="资质申请表单" prop="urgency">
<el-image style="width: 176px; height: 107px;line-height: 50px;"
:src="'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'"
fit="fill" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="6个月实操经验" prop="urgency">
<el-radio-group v-model="ruleForm.urgency">
<el-radio value="1">有</el-radio>
<el-radio value="2">无</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="实操经验表单" prop="urgency">
<el-image style="width: 176px; height: 107px;line-height: 50px;"
:src="'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'"
fit="fill" />
</el-form-item>
</el-col>
<div class="applyFormContainer" v-if="detailForm.qualificationId">
<div v-if="detailForm.qualificationId == 'SH'">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="电工证初领日期">
<el-date-picker v-model="beforeConditionInfo.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证复审日期">
<el-date-picker v-model="beforeConditionInfo.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证状态">
<template v-if="isAfterToday()">
<div class="hightSatusNomar"></div>
<div class="statusLabel">正常</div>
</template>
<template v-else>
<div class="hightSatusDanger"> </div>
<div class="statusLabel">过期</div>
</template>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="培训紧迫程度">
<el-radio-group v-model="beforeConditionInfo.urgency" disabled>
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片">
<img :src="beforeConditionInfo.certificatePhoto.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.certificatePhoto"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.certificatePhoto)" />
</el-row>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="detailForm.qualificationId == 'ES'">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="电工证初领日期">
<el-date-picker v-model="beforeConditionInfo.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证复审日期">
<el-date-picker v-model="beforeConditionInfo.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证状态">
<template v-if="isAfterToday()">
<div class="hightSatusNomar"></div>
<div class="statusLabel">正常</div>
</template>
<template v-else>
<div class="hightSatusDanger"> </div>
<div class="statusLabel">过期</div>
</template>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="培训紧迫程度">
<el-radio-group v-model="beforeConditionInfo.urgency" disabled>
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片">
<img :src="beforeConditionInfo.certificatePhoto.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.certificatePhoto"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.certificatePhoto)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="SH资质上传">
<img :src="beforeConditionInfo.shFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.shFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.shFile)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="6个月实操经验">
<el-radio-group v-model="beforeConditionInfo.practicalExperience" disabled>
<el-radio value="0">无</el-radio>
<el-radio value="1">有</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8" v-if="beforeConditionInfo.practicalExperience == '1'">
<el-form-item label="实操经验表单">
<img :src="beforeConditionInfo.experienceFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.experienceFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.experienceFile)" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="detailForm.qualificationId == 'ESC' || ruleForm.qualificationId == 'CESC'">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="电工证初领日期">
<el-date-picker v-model="beforeConditionInfo.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证复审日期">
<el-date-picker v-model="beforeConditionInfo.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证状态">
<template v-if="isAfterToday()">
<div class="hightSatusNomar"></div>
<div class="statusLabel">正常</div>
</template>
<template v-else>
<div class="hightSatusDanger"> </div>
<div class="statusLabel">过期</div>
</template>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="培训紧迫程度">
<el-radio-group v-model="beforeConditionInfo.urgency" disabled>
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片">
<img :src="beforeConditionInfo.certificatePhoto.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.certificatePhoto"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.certificatePhoto)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="ES资质上传" prop="beforeConditionInfo.esFile">
<img :src="beforeConditionInfo.esFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.esFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.esFile)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="detailForm.qualificationId == 'LLP'">
<el-row class="myRow" :gutter="20">
<el-col :span="12">
<el-form-item label="非电池生产线员工/电池生产线员工">
<el-radio-group v-model="beforeConditionInfo.batteryLine">
<el-radio value="0">非电池生产线员工</el-radio>
<el-radio value="1">电池生产线员工</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="具备资质">
<el-checkbox-group v-model="beforeConditionInfo.hasQualified" disabled>
<el-checkbox v-if="beforeConditionInfo.batteryLine == 1" label="SH"
value="SH" />
<el-checkbox label="ES" value="ES" />
<el-checkbox label="ESC" value="ESC" />
<el-checkbox label="CESC" value="CESC" />
</el-checkbox-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="急救证发证日期">
<el-date-picker v-model="beforeConditionInfo.firstCollectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择急救证发证日期"
style="width: 60%;" disabled />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="急救证到期日期">
<el-date-picker v-model="beforeConditionInfo.firstCollectionExpireDate"
type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
placeholder="请选择急救证到期日期" style="width: 60%;" disabled />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="健康证明" prop="beforeConditionInfo.healthCertificate">
<img :src="beforeConditionInfo.healthCertificate.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.healthCertificate"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.healthCertificate)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="急救证" prop="beforeConditionInfo.firstCertificateFile">
<img :src="beforeConditionInfo.firstCertificateFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.firstCertificateFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.firstCertificateFile)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
</el-row>
</div>
</div>
</el-form>
<div class="headerTitle">审批记录</div>
@ -159,116 +345,191 @@
{{ scope.$index + 1 }}
</template>
</el-table-column>
<el-table-column prop="name" label="节点名称" width="260" />
<el-table-column prop="approvalResult" label="审批意见" min-width="100" align="left" />
<el-table-column prop="approvalTime" label="审批时间" width="150">
<el-table-column prop="checkNode" label="节点名称" width="260">
<template #default="scope">
<span v-if="scope.row.approvalTime && scope.row.approvalTime"> {{ scope.row.approvalTime
}}</span>
<span v-if="scope.row.checkNode == 0 && scope.row.checkStatus == 1">提交申请</span>
<span v-if="scope.row.checkNode == 1 && scope.row.checkStatus == 2">ESC审核通过</span>
<span v-if="scope.row.checkNode == 1 && scope.row.checkStatus == 9">ESC驳回</span>
<span v-if="scope.row.checkNode == 2 && scope.row.checkStatus == 2">培训中心审核通过</span>
<span v-if="scope.row.checkNode == 2 && scope.row.checkStatus == 9">培训中心驳回</span>
<span v-if="scope.row.checkNode == 0 && scope.row.checkStatus == 3">用户重新申请</span>
<span v-if="scope.row.checkNode == 1 && scope.row.checkStatus == 3">ESC代替用户重新申请</span>
</template>
</el-table-column>
<el-table-column prop="remark" label="审批意见" min-width="100" align="left" />
<el-table-column prop="createTime" label="审批时间" width="230">
<template #default="scope">
<span v-if="scope.row.createTime"> {{ scope.row.createTime }}</span>
<span v-else>-</span>
</template>
</el-table-column>
</el-table>
</div>
<el-form ref="ruleFormRef" :model="ruleForm" label-position="top">
<div class="headerTitle">审批信息</div>
<div class="applyFormContainer">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="审批结果" prop="urgency">
<el-radio-group v-model="ruleForm.urgency">
<el-radio value="2">驳回</el-radio>
<el-radio value="1">通过</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="18">
<el-form-item label="审批意见" prop="urgency">
<el-input v-model="textarea" style="width: 100%" :rows="5" type="textarea"
placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
</div>
</el-form>
</div>
</el-card>
</div>
<div class="submitTool">
<el-button class="cancelApplyBtn" @click="handleCancel">取消</el-button>
<el-button class="submitApplyBtn" @click="handleSubmit">提交</el-button>
<el-button class="cancelApplyBtn" @click="handleCancel">返回</el-button>
<!-- <el-button class="submitApplyBtn" @click="handleSubmit">提交</el-button> -->
</div>
</div>
<!-- 图片预览 -->
<el-dialog v-model="dialogVisible" title="图片预览">
<img v-if="isImageFile(dialogImageUrl)" :src="dialogImageUrl" class="preview-image" alt="Preview Image" />
<div v-else class="unsupported-file">
<pdf-preview :pdf-url="dialogImageUrl" />
</div>
</el-dialog>
</div>
</template>
<script setup>
import { reactive } from 'vue'
import { Plus } from '@element-plus/icons-vue'
import { onMounted, reactive } from 'vue'
import { getBusUserQualificationDetail, getBusUserQualificationRecord } from "@/api/qualification/myQualifications"
import { useRouter } from 'vue-router'
import pdfIcon from '@/assets/images/pdfIcon.png'
import PdfPreview from './PdfPreview.vue'
const route = useRoute()
const baseUrl = import.meta.env.VITE_APP_BASE_API
const dialogImageUrl = ref('')
const dialogVisible = ref(false)
const suffix = ref('')
const router = useRouter()
const levelList = ref([
{ title: '资质管理', path: '/qualification' },
{ title: '培训中心审批', path: '/qualification/trainApproval' },
{ title: '审批', path: '/qualification/trainApproval/approvalDetail' }
{ title: 'ESC审批', path: '/qualification/escApproval' },
{ title: '审批', path: '/qualification/escApproval/approvalDetail' }
])
const { proxy } = getCurrentInstance()
const data = reactive({
ruleForm: {},
detailForm: {
qualificationName: '',
sourceQualificationName: '',
deptName: '',
sectionName: '',
workNo: '',
userName: '',
englishName: '',
dependencyName: '',
escUserName: '',
createTime: '',
state: null,
node: null,
qualificationId: ''
},
beforeConditionInfo: {
collectionDate: null,
reviewDate: null,
urgency: '',
certificatePhoto: '',
qualificationForm: '',
shFile: '',
esFile: '',
batteryLine: '',
hasQualified: [],
firstCollectionDate: null,
firstCollectionExpireDate: null,
healthCertificate: '',
firstCertificateFile: '',
practicalExperience: '',
experienceFile: ''
},
ruleForm: {
state: '',
remark: ''
},
rules: {
targetQualification: [{ required: true, message: "目标资质不能为空", trigger: "change" }],
employeeNumber: [{ required: true, message: "员工工号不能为空", trigger: "blur" }],
employeeChineseName: [{ required: true, message: "员工姓名(中文)不能为空", trigger: "blur" }],
employeeEnglishName: [{ required: true, message: "员工姓名(英文)", trigger: "blur" }],
departmentName: [{ required: true, message: "部门不能为空", trigger: "change" }],
officeName: [{ required: true, message: "科室不能为空", trigger: "change" }],
localityName: [{ required: true, message: "属地不能为空", trigger: "change" }],
localityManager: [{ required: true, message: "属地ESC不能为空", trigger: "blur" }],
state: [{ required: true, message: "请选择审批结果", trigger: "change" }],
remark: [{ required: true, message: "审批意见不能为空", trigger: "blur" }]
},
})
const tableData = [
{
name: '提交申请',
approvalResult: '-',
approvalTime: '2016-05-03'
},
{
name: 'ESC审批',
approvalResult: '通过',
approvalTime: '2016-05-07'
},
]
const { ruleForm, rules } = toRefs(data)
const handleCancel = () => {
proxy.resetForm("ruleFormRef")
// 审批记录
const tableData = ref([])
// 获取审批记录
const getQualificationApprovalRecord = (_id) => {
var queryParamsRecord = {
pageIndex: 1,
pageSize: 50,
userQualificationId: _id
}
getBusUserQualificationRecord(queryParamsRecord).then(res => {
if (res.code == 200) tableData.value = res.data.list
})
}
const { ruleForm, detailForm, beforeConditionInfo, rules } = toRefs(data)
// 初始化
onMounted(() => {
const id = route.params && route.params.Id
if (id) {
console.log('接收id', id)
ruleForm.value.id = id
getDetailInfo(id)
getQualificationApprovalRecord(id)
} else {
ruleForm.value.id = null
}
});
// 判断是否为图片文件
const isImageFile = (filePath) => {
// 处理无后缀名情况
if (!filePath || filePath.indexOf('.') === -1) return '';
suffix.value = filePath.split('.').pop();
console.log('后缀', filePath.split('.').pop())
return ['jpeg', 'jpg', 'png'].includes(suffix.value?.toLowerCase())
}
// 预览
const handleCardPreview = (filePath) => {
// 处理无后缀名情况
if (!filePath || filePath.indexOf('.') === -1) return '';
suffix.value = filePath.split('.').pop();
dialogImageUrl.value = baseUrl + filePath
dialogVisible.value = true
}
// 获取详情
const getDetailInfo = (_id) => {
var _queryParams = {
id: _id,
node: 1
}
getBusUserQualificationDetail(_queryParams).then(res => {
if (res.code == 200) {
detailForm.value = res.data
detailForm.value = {
qualificationName: res.data.qualificationName,
sourceQualificationName: res.data.sourceQualificationName,
deptName: res.data.deptName,
sectionName: res.data.sectionName,
workNo: res.data.workNo,
userName: res.data.userName,
englishName: res.data.englishName,
dependencyName: res.data.dependencyName,
escUserName: res.data.escUserName,
createTime: res.data.createTime,
state: res.data.state,
node: res.data.node,
qualificationId: res.data.qualificationId,
}
beforeConditionInfo.value = JSON.parse(res.data.beforeCondition)
console.log('资质详情', detailForm.value, beforeConditionInfo.value)
}
})
}
// 对比日期是否在今天之后
const isAfterToday = () => {
const today = new Date();
today.setHours(0, 0, 0, 0); // 清除时间部分
const dateToCompare = new Date(beforeConditionInfo.value.reviewDate);
return dateToCompare > today;
};
const handleCancel = () => {
router.push({
path: '/qualification/trainApproval'
})
}
const handleSubmit = () => {
proxy.$refs["ruleFormRef"].validate(valid => {
if (valid) {
router.push({
path: '/qualification/trainApproval'
})
// if (form.value.roleId != undefined) {
// form.value.menuIds = getMenuAllCheckedKeys()
// updateRole(form.value).then(response => {
// proxy.$modal.msgSuccess("修改成功")
// open.value = false
// getList()
// })
// } else {
// form.value.menuIds = getMenuAllCheckedKeys()
// addRole(form.value).then(response => {
// proxy.$modal.msgSuccess("新增成功")
// open.value = false
// getList()
// })
// }
}
})
}
</script>
<style lang='scss'>
.app-main {
@ -363,6 +624,13 @@ const handleSubmit = () => {
padding: 6px 14px;
}
.infoinfoText {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #DD9200;
}
.successText {
font-family: Microsoft YaHei;
font-weight: 400;
@ -377,6 +645,27 @@ const handleSubmit = () => {
color: #E13434;
}
.hightSatusNomar {
display: inline-block;
width: 16px;
height: 16px;
border-radius: 8px;
background: #00B32A;
}
.hightSatusDanger {
display: inline-block;
width: 16px;
height: 16px;
border-radius: 8px;
background: #E13434;
}
.statusLabel {
display: inline-block;
padding-left: 10px;
}
.applyFormContainer {
padding-top: 20px;
overflow: hidden;
@ -455,7 +744,7 @@ const handleSubmit = () => {
font-size: 16px !important;
text-align: left !important;
color: #787878 !important;
padding: 0 10px 0 60px;
padding: 0 10px 0 44px;
}
.myFormItemLable .el-form-item__content {
@ -464,7 +753,7 @@ const handleSubmit = () => {
font-size: 18px !important;
text-align: left !important;
color: #000000 !important;
padding-left: 60px;
padding-left: 44px;
}
.el-form-item--label-left .el-form-item__content {
@ -527,4 +816,33 @@ const handleSubmit = () => {
text-align: left;
color: #000000;
}
.el-radio__input.is-disabled.is-checked .el-radio__inner {
background-color: var(--el-color-primary);
border-color: var(--el-color-primary);
}
.el-radio__input.is-disabled.is-checked .el-radio__inner:after {
background-color: var(--el-color-white);
}
.preview-image {
width: 100%;
max-height: 70vh;
object-fit: contain;
}
.unsupported-file {
padding: 0px;
text-align: center;
color: #999;
height: 70vh;
}
.viewFile {
width: 148px;
height: 148px;
border: 1px solid #dedede;
border-radius: 6px;
}
</style>

885
src/views/qualification/trainApproval/approvalForm.vue Normal file
View File

@ -0,0 +1,885 @@
<template>
<div class="app-page-container">
<el-breadcrumb class="app-breadcrumb" separator=">">
<transition-group name="breadcrumb">
<el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
<span v-if="index == levelList.length - 1" class="link-redirect">{{
item.title }}</span>
<span v-else class="no-redirect">{{ item.title }}</span>
</el-breadcrumb-item>
</transition-group>
</el-breadcrumb>
<div class="rootContainer clearBoth">
<el-card>
<template #header>
<div class="card-header">
<span>目标资质：{{ detailForm.qualificationName }}</span>
</div>
</template>
<el-form ref="detailFormRef" :model="detailForm" label-position="left">
<!-- <div class="headerTitle">基本信息</div> -->
<div class="applyFormContainer">
<el-row class="myRow" :gutter="20">
<el-col :span="20">
<el-row class="myRow" :gutter="20">
<el-col :span="8">
<el-form-item label="当前资质:">
{{ detailForm.sourceQualificationName ? detailForm.sourceQualificationName :
'-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="部门:">
{{ detailForm.deptName ? detailForm.deptName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="科室:">
{{ detailForm.sectionName ? detailForm.sectionName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工工号:">
{{ detailForm.workNo ? detailForm.workNo : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工姓名(中文):">
{{ detailForm.userName ? detailForm.userName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="员工姓名(英文):">
{{ detailForm.englishName ? detailForm.englishName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="属地:">
{{ detailForm.dependencyName ? detailForm.dependencyName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="属地ESC:">
{{ detailForm.escUserName ? detailForm.escUserName : '-' }}
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="创建时间:">
{{ detailForm.createTime ? detailForm.createTime : '-' }}
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col :span="4">
<el-form-item label="审批状态" label-position="top" class="myFormItemLable">
<template v-if="detailForm.state">
<el-text v-if="detailForm.state == 1 && detailForm.node == 0" type="info"
class="infoinfoText">待审核</el-text>
<el-text v-if="detailForm.state == 1 && detailForm.node == 2" type="info"
class="infoinfoText">待培训中心审核</el-text>
<el-text v-if="detailForm.state == 2" type="success"
class="successText">通过</el-text>
<el-text v-if="detailForm.state == 9" type="danger"
class="dangerText">驳回</el-text>
</template>
<template v-else>-</template>
</el-form-item>
</el-col>
</el-row>
</div>
</el-form>
<el-form ref="beforeConditionInfoRef" :model="beforeConditionInfo" label-position="top">
<div class="headerTitle">前置条件</div>
<div class="applyFormContainer" v-if="detailForm.qualificationId">
<div v-if="detailForm.qualificationId == 'SH'">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="电工证初领日期">
<el-date-picker v-model="beforeConditionInfo.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证复审日期">
<el-date-picker v-model="beforeConditionInfo.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证状态">
<template v-if="isAfterToday()">
<div class="hightSatusNomar"></div>
<div class="statusLabel">正常</div>
</template>
<template v-else>
<div class="hightSatusDanger"> </div>
<div class="statusLabel">过期</div>
</template>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="培训紧迫程度">
<el-radio-group v-model="beforeConditionInfo.urgency" disabled>
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片">
<img :src="beforeConditionInfo.certificatePhoto.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.certificatePhoto"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.certificatePhoto)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="detailForm.qualificationId == 'ES'">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="电工证初领日期">
<el-date-picker v-model="beforeConditionInfo.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证复审日期">
<el-date-picker v-model="beforeConditionInfo.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证状态">
<template v-if="isAfterToday()">
<div class="hightSatusNomar"></div>
<div class="statusLabel">正常</div>
</template>
<template v-else>
<div class="hightSatusDanger"> </div>
<div class="statusLabel">过期</div>
</template>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="培训紧迫程度">
<el-radio-group v-model="beforeConditionInfo.urgency" disabled>
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片">
<img :src="beforeConditionInfo.certificatePhoto.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.certificatePhoto"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.certificatePhoto)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="SH资质上传">
<img :src="beforeConditionInfo.shFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.shFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.shFile)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="6个月实操经验">
<el-radio-group v-model="beforeConditionInfo.practicalExperience" disabled>
<el-radio value="0">无</el-radio>
<el-radio value="1">有</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8" v-if="beforeConditionInfo.practicalExperience == '1'">
<el-form-item label="实操经验表单">
<img :src="beforeConditionInfo.experienceFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.experienceFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.experienceFile)" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="detailForm.qualificationId == 'ESC' || ruleForm.qualificationId == 'CESC'">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="电工证初领日期">
<el-date-picker v-model="beforeConditionInfo.collectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证初领日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证复审日期">
<el-date-picker v-model="beforeConditionInfo.reviewDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择电工证复审日期"
style="width: 100%;" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电工证状态">
<template v-if="isAfterToday()">
<div class="hightSatusNomar"></div>
<div class="statusLabel">正常</div>
</template>
<template v-else>
<div class="hightSatusDanger"> </div>
<div class="statusLabel">过期</div>
</template>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="培训紧迫程度">
<el-radio-group v-model="beforeConditionInfo.urgency" disabled>
<el-radio value="1">紧急</el-radio>
<el-radio value="2">一般</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="电工证照片">
<img :src="beforeConditionInfo.certificatePhoto.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.certificatePhoto"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.certificatePhoto)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="ES资质上传" prop="beforeConditionInfo.esFile">
<img :src="beforeConditionInfo.esFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.esFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.esFile)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
</el-row>
</div>
<div v-if="detailForm.qualificationId == 'LLP'">
<el-row class="myRow" :gutter="20">
<el-col :span="12">
<el-form-item label="非电池生产线员工/电池生产线员工">
<el-radio-group v-model="beforeConditionInfo.batteryLine">
<el-radio value="0">非电池生产线员工</el-radio>
<el-radio value="1">电池生产线员工</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="具备资质">
<el-checkbox-group v-model="beforeConditionInfo.hasQualified" disabled>
<el-checkbox v-if="beforeConditionInfo.batteryLine == 1" label="SH"
value="SH" />
<el-checkbox label="ES" value="ES" />
<el-checkbox label="ESC" value="ESC" />
<el-checkbox label="CESC" value="CESC" />
</el-checkbox-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="急救证发证日期">
<el-date-picker v-model="beforeConditionInfo.firstCollectionDate" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" placeholder="请选择急救证发证日期"
style="width: 60%;" disabled />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="急救证到期日期">
<el-date-picker v-model="beforeConditionInfo.firstCollectionExpireDate"
type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
placeholder="请选择急救证到期日期" style="width: 60%;" disabled />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="健康证明" prop="beforeConditionInfo.healthCertificate">
<img :src="beforeConditionInfo.healthCertificate.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.healthCertificate"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.healthCertificate)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="急救证" prop="beforeConditionInfo.firstCertificateFile">
<img :src="beforeConditionInfo.firstCertificateFile.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.firstCertificateFile"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.firstCertificateFile)" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="资质申请表单">
<img :src="beforeConditionInfo.qualificationForm.split('.').pop() == 'pdf' ? pdfIcon : baseUrl + beforeConditionInfo.qualificationForm"
class="avatar viewFile"
@click.stop="handleCardPreview(beforeConditionInfo.qualificationForm)" />
</el-form-item>
</el-col>
</el-row>
</div>
</div>
</el-form>
<div class="headerTitle">审批记录</div>
<div class="applyFormContainer">
<el-table :data="tableData" style="width: 100%;margin-bottom: 20px;">
<el-table-column label="序号" width="160">
<template #default="scope">
{{ scope.$index + 1 }}
</template>
</el-table-column>
<el-table-column prop="checkNode" label="节点名称" width="260">
<template #default="scope">
<span v-if="scope.row.checkNode == 0 && scope.row.checkStatus == 1">提交申请</span>
<span v-if="scope.row.checkNode == 1 && scope.row.checkStatus == 2">ESC审核通过</span>
<span v-if="scope.row.checkNode == 1 && scope.row.checkStatus == 9">ESC驳回</span>
<span v-if="scope.row.checkNode == 2 && scope.row.checkStatus == 2">培训中心审核通过</span>
<span v-if="scope.row.checkNode == 2 && scope.row.checkStatus == 9">培训中心驳回</span>
<span v-if="scope.row.checkNode == 0 && scope.row.checkStatus == 3">用户重新申请</span>
<span v-if="scope.row.checkNode == 1 && scope.row.checkStatus == 3">ESC代替用户重新申请</span>
</template>
</el-table-column>
<el-table-column prop="remark" label="审批意见" min-width="100" align="left" />
<el-table-column prop="createTime" label="审批时间" width="230">
<template #default="scope">
<span v-if="scope.row.createTime"> {{ scope.row.createTime }}</span>
<span v-else>-</span>
</template>
</el-table-column>
</el-table>
</div>
<el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="top">
<div class="headerTitle">审批信息</div>
<div class="applyFormContainer">
<el-row class="myRow" :gutter="20">
<el-col :span="6">
<el-form-item label="审批结果" prop="state">
<el-radio-group v-model="ruleForm.state">
<el-radio value="9">驳回</el-radio>
<el-radio value="2">通过</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="18">
<el-form-item label="审批意见" prop="remark">
<el-input v-model="ruleForm.remark" style="width: 100%" :rows="5" type="textarea"
placeholder="请输入" />
</el-form-item>
</el-col>
</el-row>
</div>
</el-form>
</el-card>
</div>
<div class="submitTool">
<el-button class="cancelApplyBtn" @click="handleCancel">取消</el-button>
<el-button class="submitApplyBtn" @click="handleSubmit">提交</el-button>
</div>
<!-- 图片预览 -->
<el-dialog v-model="dialogVisible" title="图片预览">
<img v-if="isImageFile(dialogImageUrl)" :src="dialogImageUrl" class="preview-image" alt="Preview Image" />
<div v-else class="unsupported-file">
<pdf-preview :pdf-url="dialogImageUrl" />
</div>
</el-dialog>
</div>
</template>
<script setup>
import { onMounted, reactive } from 'vue'
import { getBusUserQualificationDetail, getBusUserQualificationRecord, updateStatusBusUserQualification } from "@/api/qualification/myQualifications"
import { useRouter } from 'vue-router'
import pdfIcon from '@/assets/images/pdfIcon.png'
import PdfPreview from './PdfPreview.vue'
const route = useRoute()
const baseUrl = import.meta.env.VITE_APP_BASE_API
const dialogImageUrl = ref('')
const dialogVisible = ref(false)
const suffix = ref('')
const router = useRouter()
const levelList = ref([
{ title: '资质管理', path: '/qualification' },
{ title: 'ESC审批', path: '/qualification/escApproval' },
{ title: '审批', path: '/qualification/escApproval/approvalDetail' }
])
const { proxy } = getCurrentInstance()
const data = reactive({
detailForm: {
qualificationName: '',
sourceQualificationName: '',
deptName: '',
sectionName: '',
workNo: '',
userName: '',
englishName: '',
dependencyName: '',
escUserName: '',
createTime: '',
state: null,
node: null,
qualificationId: ''
},
beforeConditionInfo: {
collectionDate: null,
reviewDate: null,
urgency: '',
certificatePhoto: '',
qualificationForm: '',
shFile: '',
esFile: '',
batteryLine: '',
hasQualified: [],
firstCollectionDate: null,
firstCollectionExpireDate: null,
healthCertificate: '',
firstCertificateFile: '',
practicalExperience: '',
experienceFile: ''
},
ruleForm: {
state: '',
remark: ''
},
rules: {
state: [{ required: true, message: "请选择审批结果", trigger: "change" }],
remark: [{ required: true, message: "审批意见不能为空", trigger: "blur" }]
},
})
// 审批记录
const tableData = ref([])
// 获取审批记录
const getQualificationApprovalRecord = (_id) => {
var queryParamsRecord = {
pageIndex: 1,
pageSize: 50,
userQualificationId: _id
}
getBusUserQualificationRecord(queryParamsRecord).then(res => {
if (res.code == 200) tableData.value = res.data.list
})
}
const { ruleForm, detailForm, beforeConditionInfo, rules } = toRefs(data)
// 初始化
onMounted(() => {
const id = route.params && route.params.Id
if (id) {
console.log('接收id', id)
ruleForm.value.id = id
getDetailInfo(id)
getQualificationApprovalRecord(id)
} else {
ruleForm.value.id = null
}
});
// 判断是否为图片文件
const isImageFile = (filePath) => {
// 处理无后缀名情况
if (!filePath || filePath.indexOf('.') === -1) return '';
suffix.value = filePath.split('.').pop();
console.log('后缀', filePath.split('.').pop())
return ['jpeg', 'jpg', 'png'].includes(suffix.value?.toLowerCase())
}
// 预览
const handleCardPreview = (filePath) => {
// 处理无后缀名情况
if (!filePath || filePath.indexOf('.') === -1) return '';
suffix.value = filePath.split('.').pop();
dialogImageUrl.value = baseUrl + filePath
dialogVisible.value = true
}
// 获取详情
const getDetailInfo = (_id) => {
var _queryParams = {
id: _id,
node: 1
}
getBusUserQualificationDetail(_queryParams).then(res => {
if (res.code == 200) {
detailForm.value = res.data
detailForm.value = {
qualificationName: res.data.qualificationName,
sourceQualificationName: res.data.sourceQualificationName,
deptName: res.data.deptName,
sectionName: res.data.sectionName,
workNo: res.data.workNo,
userName: res.data.userName,
englishName: res.data.englishName,
dependencyName: res.data.dependencyName,
escUserName: res.data.escUserName,
createTime: res.data.createTime,
state: res.data.state,
node: res.data.node,
qualificationId: res.data.qualificationId,
}
beforeConditionInfo.value = JSON.parse(res.data.beforeCondition)
console.log('资质详情', detailForm.value, beforeConditionInfo.value)
}
})
}
// 对比日期是否在今天之后
const isAfterToday = () => {
const today = new Date();
today.setHours(0, 0, 0, 0); // 清除时间部分
const dateToCompare = new Date(beforeConditionInfo.value.reviewDate);
return dateToCompare > today;
};
const handleCancel = () => {
proxy.resetForm("ruleFormRef")
router.push({
path: '/qualification/trainApproval'
})
}
const handleSubmit = () => {
proxy.$refs["ruleFormRef"].validate(valid => {
if (valid) {
ruleForm.value.node = 2
updateStatusBusUserQualification(ruleForm.value).then(res => {
if (res.code == 200) {
router.push({
path: '/qualification/trainApproval'
})
} else {
proxy.$modal.msgSuccess(res.msg)
}
})
}
})
}
</script>
<style lang='scss'>
.app-main {
height: 100vh;
width: 100%;
position: relative;
overflow: hidden;
background-color: #F8F8F8;
}
.app-breadcrumb.el-breadcrumb {
width: 1200px;
margin: 0 auto;
height: 44px;
line-height: 44px;
font-size: 18px;
background: #f8f8f8;
.el-breadcrumb__item {
.el-breadcrumb__separator {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #000000 !important;
margin: 0 9px;
}
}
.no-redirect {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #000000;
cursor: text;
}
.link-redirect {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #0090FF;
cursor: text;
text-decoration: underline;
text-underline-offset: 4px;
}
}
.clearBoth {
clear: both;
}
.rootContainer {
width: 1200px;
margin: 0 auto;
height: calc(100vh - 216px);
overflow-y: auto;
overflow-x: hidden;
background: #ffffff;
}
.el-card {
border: none;
}
.el-card__header {
min-height: 50px;
font-family: Microsoft YaHei;
font-weight: 700;
font-size: 20px;
text-align: left;
color: #000000;
border-bottom: 1px solid #DCDCDC;
box-sizing: border-box;
padding: 10px 20px 17px 20px;
}
.el-card__body {
padding: 0px 20px 0 20px !important;
}
.el-card.is-always-shadow {
box-shadow: none;
}
.headerTitle {
font-family: Microsoft YaHei;
font-weight: 700;
font-size: 18px;
text-align: left;
color: #000000;
background: #e9e9e9;
padding: 6px 14px;
}
.infoinfoText {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #DD9200;
}
.successText {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #00B32A;
}
.dangerText {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
color: #E13434;
}
.hightSatusNomar {
display: inline-block;
width: 16px;
height: 16px;
border-radius: 8px;
background: #00B32A;
}
.hightSatusDanger {
display: inline-block;
width: 16px;
height: 16px;
border-radius: 8px;
background: #E13434;
}
.statusLabel {
display: inline-block;
padding-left: 10px;
}
.applyFormContainer {
padding-top: 20px;
overflow: hidden;
}
.submitTool {
width: 100%;
height: 76px;
position: absolute;
top: calc(100% - 76px);
background: #ffffff;
box-shadow: 1px 2px 10px 0 #93939333;
text-align: center;
line-height: 76px;
}
.cancelApplyBtn {
width: 100px;
height: 36px;
border-radius: 4px 4px 4px 4px;
background: #ea9f0e;
font-family: Microsoft YaHei;
font-weight: 700;
font-size: 16px;
text-align: center;
color: #FFFFFF;
}
.cancelApplyBtn:hover {
background: #ea9f0e;
color: #FFFFFF;
}
.submitApplyBtn {
width: 100px;
height: 36px;
border-radius: 4px 4px 4px 4px;
background: #4276d1;
font-family: Microsoft YaHei;
font-weight: 700;
font-size: 16px;
text-align: center;
color: #FFFFFF;
}
.submitApplyBtn:hover {
background: #4276d1;
color: #FFFFFF;
}
.myRow {
margin-left: 0 !important;
margin-right: 0 !important;
}
.el-form-item--default {
margin-bottom: 20px !important;
}
.el-form-item--label-left .el-form-item__label {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 16px;
text-align: left;
color: #787878;
padding: 0 10px 0 0;
}
.myFormItemLable {
padding-top: 22px;
}
.myFormItemLable .el-form-item__label {
font-family: Microsoft YaHei !important;
font-weight: 400 !important;
font-size: 16px !important;
text-align: left !important;
color: #787878 !important;
padding: 0 10px 0 60px;
}
.myFormItemLable .el-form-item__content {
font-family: Arial !important;
font-weight: 400 !important;
font-size: 18px !important;
text-align: left !important;
color: #000000 !important;
padding-left: 60px;
}
.el-form-item--label-left .el-form-item__content {
font-family: Arial;
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-form-item--label-top .el-form-item__label {
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
text-align: left;
color: #666666;
}
.el-form-item--label-top .el-form-item__content {
font-family: Arial;
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-form-item--label-top .el-textarea__inner {
font-family: Arial;
font-weight: 400;
font-size: 18px;
color: #000000;
}
.el-input__inner {
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-select__wrapper {
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-form-item__error {
font-size: 16px;
}
.el-radio__inner {
width: 16px !important;
height: 16px !important;
}
.el-radio__label {
font-weight: 400;
font-size: 18px;
text-align: left;
color: #000000;
}
.el-radio__input.is-disabled.is-checked .el-radio__inner {
background-color: var(--el-color-primary);
border-color: var(--el-color-primary);
}
.el-radio__input.is-disabled.is-checked .el-radio__inner:after {
background-color: var(--el-color-white);
}
.preview-image {
width: 100%;
max-height: 70vh;
object-fit: contain;
}
.unsupported-file {
padding: 0px;
text-align: center;
color: #999;
height: 70vh;
}
.viewFile {
width: 148px;
height: 148px;
border: 1px solid #dedede;
border-radius: 6px;
}
</style>

286
src/views/qualification/trainApproval/index.vue
View File

@ -2,28 +2,33 @@
<div class="app-page-container">
<breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
<div class="app-container clearBoth">
<el-form :model="queryParams" ref="queryRef" :inline="true" >
<el-form :model="queryParams" ref="queryRef" :inline="true">
<el-row class="myRow">
<el-col :span="20">
<el-form-item label="申请日期" prop="userName">
<el-date-picker v-model="rangeTime" type="daterange" range-separator="~" :clearable="false"
style="width: 250px" start-placeholder="开始日期" end-placeholder="结束日期" />
<el-form-item label="申请日期">
<el-date-picker v-model="dateRange" type="daterange" range-separator="~" :clearable="false"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" style="width: 250px"
@change="handleDateChange" start-placeholder="开始日期" end-placeholder="结束日期" />
</el-form-item>
<el-form-item label="申请状态" prop="deptId">
<el-select v-model="queryParams.deptId" placeholder="请选择" clearable style="width: 160px">
<el-option label="Zone one" value="shanghai" />
<el-option label="Zone two" value="beijing" />
<el-form-item label="申请状态" prop="state">
<el-select v-model="queryParams.state" placeholder="请选择" clearable style="width: 160px">
<el-option label="待审核" value="1" />
<el-option label="通过" value="2" />
<el-option label="驳回" value="9" />
</el-select>
</el-form-item>
<el-form-item label="员工姓名" prop="userName">
<el-input v-model="queryParams.userName" placeholder="请输入员工姓名" clearable
style="width: 160px" @keyup.enter="handleQuery" />
<el-select v-model="queryParams.userId" filterable placeholder="请选择员工" style="width: 160px"
clearable>
<el-option v-for="item in allUsers" :key="item.userId" :label="item.nickName"
:value="item.userId" />
</el-select>
</el-form-item>
<el-form-item style="margin-right: 10px;">
<el-button v-if="!unfoldFlag" type="text" class="foladText" @click="handleFlod">展开
<el-button v-if="!unfoldFlag" text class="foladText" @click="handleFlod">展开
<svg-icon icon-class="unfold" />
</el-button>
<el-button v-else type="text" class="foladText" @click="handleFlod">折叠
<el-button v-else text class="foladText" @click="handleFlod">折叠
<svg-icon icon-class="packUp" />
</el-button>
</el-form-item>
@ -35,12 +40,10 @@
</el-row>
<el-row class="myRow" v-show="unfoldFlag">
<el-col :span="20">
<el-form-item label="部门" prop="qualification">
<el-select v-model="queryParams.qualification" placeholder="请选择部门" clearable
style="width: 160px">
<el-option label="Zone one" value="shanghai" />
<el-option label="Zone two" value="beijing" />
</el-select>
<el-form-item label="部门" prop="deptId">
<el-tree-select v-model="queryParams.deptId" :data="enabledDeptOptions" clearable
:props="{ value: 'id', label: 'label', children: 'children' }" value-key="id"
placeholder="请选择部门" check-strictly style="width: 160px" />
</el-form-item>
</el-col>
</el-row>
@ -53,187 +56,160 @@
</el-button>
</div>
<div class="borderLine"></div>
<el-table :data="tableData" height="calc(100% - 220px)" style="width: 100%">
<el-table v-loading="loading" :data="tableData" height="calc(100% - 220px)" style="width: 100%">
<el-table-column label="序号" width="60">
<template #default="scope">
{{ scope.$index + 1 }}
</template>
</el-table-column>
<el-table-column prop="localityName" label="属地" />
<el-table-column prop="departmentName" label="部门" />
<el-table-column prop="officeName" label="科室" />
<el-table-column prop="jobNumber" label="工号" />
<el-table-column prop="name" label="员工姓名" />
<el-table-column prop="curQualification" label="当前资质" />
<el-table-column prop="objectiveQualification" label="目标资质" />
<el-table-column prop="status" label="状态" width="120">
<el-table-column prop="dependencyName" label="属地" width="180" :show-overflow-tooltip="true" />
<el-table-column prop="deptName" label="部门" width="180" :show-overflow-tooltip="true" />
<el-table-column prop="sectionName" label="科室" width="180" :show-overflow-tooltip="true" />
<el-table-column prop="workNo" label="工号" width="130" />
<el-table-column prop="userName" label="员工姓名" width="130" />
<el-table-column prop="sourceQualificationName" label="当前资质" width="130" />
<el-table-column prop="qualificationName" label="目标资质" width="130" />
<el-table-column prop="state" label="状态" width="160">
<template #default="scope">
<el-text v-if="scope.row.status == 0" type="info" class="infoinfoText">待审核</el-text>
<el-text v-if="scope.row.status == 1" type="success" class="successText">通过</el-text>
<el-text v-if="scope.row.status == 2" type="danger" class="dangerText">驳回</el-text>
<el-text v-if="scope.row.state == 1 && scope.row.node == 0" type="info"
class="infoinfoText">待审核</el-text>
<el-text v-if="scope.row.state == 1 && scope.row.node == 2" type="info"
class="infoinfoText">待培训中心审核</el-text>
<el-text v-if="scope.row.state == 2" type="success" class="successText">通过</el-text>
<el-text v-if="scope.row.state == 9" type="danger" class="dangerText">驳回</el-text>
</template>
</el-table-column>
<el-table-column label="操作" width="150">
<el-table-column label="操作" fixed="right" align="center" width="100">
<template #default="scope">
<el-button type="primary" text class="replayTextBtn" v-if="scope.row.status != 0"
@click="handleView">查看</el-button>
<el-button type="primary" v-if="scope.row.status == 0" text class="replayTextBtn"
@click="handleApproval">审批</el-button>
<el-button type="primary" v-if="scope.row.state == 1 && scope.row.node == 2" text
class="replayTextBtn" @click="handleApproval(scope.row)">审批</el-button>
<el-button type="primary" text class="replayTextBtn" v-else
@click="handleView(scope.row)">查看</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize" @pagination="getList" />
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageIndex"
v-model:limit="queryParams.pageSize" @pagination="getBusUserQualificationPageList" />
</div>
</div>
</template>
<script setup>
import { ref } from 'vue'
import { onMounted, ref } from 'vue'
import { useRouter } from 'vue-router'
import Breadcrumb from '@/components/Breadcrumb'
import exprotIcon from '@/assets/images/exprotIcon.png'
import { deptTreeSelect, listUser } from "@/api/system/user"
import { getBusUserQualification } from "@/api/qualification/myQualifications"
const { proxy } = getCurrentInstance()
const router = useRouter()
const total = ref(16)
const unfoldFlag = ref(false)
const rangeTime = ref([])
const dateRange = ref([])
const queryParams = ref({
pageNum: 1,
pageIndex: 1,
pageSize: 10,
userName: undefined,
node: 2,
userId: undefined,
deptId: undefined,
qualification: undefined
state: undefined,
startTime: undefined,
endTime: undefined
})
const tableData = [
{
localityName: 'XXX属地',
departmentName: 'XXX部门',
officeName: 'XXX科室',
jobNumber: '3523213',
name: '赵丽娟',
curQualification: '-',
objectiveQualification: 'SH',
status: 0
},
{
localityName: 'XXX属地',
departmentName: 'XXX部门',
officeName: 'XXX科室',
jobNumber: '3523213',
name: '赵丽娟',
curQualification: '-',
objectiveQualification: 'SH',
status: 1
},
{
localityName: 'XXX属地',
departmentName: 'XXX部门',
officeName: 'XXX科室',
jobNumber: '3523213',
name: '赵丽娟',
curQualification: '-',
objectiveQualification: 'SH',
status: 2
},
{
localityName: 'XXX属地',
departmentName: 'XXX部门',
officeName: 'XXX科室',
jobNumber: '3523213',
name: '赵丽娟',
curQualification: '-',
objectiveQualification: 'SH',
status: 0
},
{
localityName: 'XXX属地',
departmentName: 'XXX部门',
officeName: 'XXX科室',
jobNumber: '3523213',
name: '赵丽娟',
curQualification: '-',
objectiveQualification: 'SH',
status: 0
},
{
localityName: 'XXX属地',
departmentName: 'XXX部门',
officeName: 'XXX科室',
jobNumber: '3523213',
name: '赵丽娟',
curQualification: '-',
objectiveQualification: 'SH',
status: 0
},
{
localityName: 'XXX属地',
departmentName: 'XXX部门',
officeName: 'XXX科室',
jobNumber: '3523213',
name: '赵丽娟',
curQualification: '-',
objectiveQualification: 'SH',
status: 0
},
{
localityName: 'XXX属地',
departmentName: 'XXX部门',
officeName: 'XXX科室',
jobNumber: '3523213',
name: '赵丽娟',
curQualification: '-',
objectiveQualification: 'SH',
status: 0
},
{
localityName: 'XXX属地',
departmentName: 'XXX部门',
officeName: 'XXX科室',
jobNumber: '3523213',
name: '赵丽娟',
curQualification: '-',
objectiveQualification: 'SH',
status: 0
},
{
localityName: 'XXX属地',
departmentName: 'XXX部门',
officeName: 'XXX科室',
jobNumber: '3523213',
name: '赵丽娟',
curQualification: '-',
objectiveQualification: 'SH',
status: 0
},
]
const loading = ref(true)
const total = ref(0)
const tableData = ref([])
const handleFlod = () => {
unfoldFlag.value = !unfoldFlag.value
}
// 初始化
onMounted(() => {
getAllUser();
getDeptTree();
getBusUserQualificationPageList();
});
// 用户数据
const allUsers = ref([])
// 获取所有用户
const getAllUser = () => {
listUser({
pageNum: 1,
pageSize: 5000
}).then(res => {
allUsers.value = res.rows
})
}
// 部门数据
const enabledDeptOptions = ref(undefined)
// 获取部门数据
const getDeptTree = () => {
deptTreeSelect().then(res => {
enabledDeptOptions.value = filterDisabledDept(JSON.parse(JSON.stringify(res.data)))
})
}
/** 过滤禁用的部门 */
const filterDisabledDept = (deptList) => {
return deptList.filter(dept => {
if (dept.disabled) {
return false
}
if (dept.children && dept.children.length) {
dept.children = filterDisabledDept(dept.children)
}
return true
})
}
const getBusUserQualificationPageList = () => {
loading.value = true
console.log('queryParams.value', queryParams.value)
getBusUserQualification(queryParams.value).then(res => {
console.log('资质申请结论', res)
if (res.code == 200) {
tableData.value = res.data.list
total.value = res.data.total
}
loading.value = false
}).catch(() => {
loading.value = false
})
}
// 查询日期切换
const handleDateChange = (val) => {
console.log('选择的日期范围:', val);
dateRange.value = val
if (val.length > 0) {
queryParams.value.startTime = val[0]
queryParams.value.endTime = val[1]
}
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1
getList()
queryParams.value.pageIndex = 1
getBusUserQualificationPageList()
}
/** 重置按钮操作 */
const resetQuery = () => {
dateRange.value = []
proxy.resetForm("queryRef")
queryParams.value.userId = undefined
queryParams.value.deptId = undefined
proxy.$refs.deptTreeRef.setCurrentKey(null)
queryParams.value.state = undefined
queryParams.value.startTime = undefined
queryParams.value.endTime = undefined
proxy.resetForm("queryRef")
handleQuery()
}
const getList = () => {
}
// 导出
const handleOpenApplyForm = () => {
}
const handleView = () => {
router.push('/qualification/trainApproval/approvalDetail')
const handleView = (record) => {
router.push('/qualification/trainApprovalDetail/' + record.id)
}
const handleApproval = () => {
router.push('/qualification/trainApproval/approvalDetail')
const handleApproval = (record) => {
console.log('主键', record)
router.push('/qualification/trainApprovalForm/' + record.id)
}
</script>
<style lang='scss'>