对接我的资质 标签重新申请

This commit is contained in:
wangchengming 2025-07-09 10:25:30 +08:00
parent 3849536ba5
commit fa831a794e
2 changed files with 435 additions and 6 deletions

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" />
@ -44,17 +44,21 @@
</el-table-column>
</el-table>
</div>
<lable-apply-form v-else ref="lableApplyFormRef" @refresh="reloadList" />
<lable-apply-form v-if="isShowForm" ref="lableApplyFormRef" @refresh="reloadList" />
<lable-re-apply-form v-if="isShowReForm" ref="lableReApplyFormRef" @refresh="reloadList" />
</template>
<script setup>
import { onMounted, ref, nextTick } from 'vue'
import applyIcon from '@/assets/images/applyIcon.png'
import LableApplyForm from './LableApplyForm.vue';
import LableReApplyForm from './LableReApplyForm.vue';
import { getcurrentUserPageList, deleteBusUserLabel } from "@/api/labelManage/labelManage"
const { proxy } = getCurrentInstance()
const isShowForm = ref(false)
const isShowReForm = ref(false)
const lableReApplyFormRef = ref(null)
const queryParams = ref({
pageIndex: 1,
pageSize: 10,
@ -89,17 +93,17 @@ const handleOpenApplyForm = () => {
//
const reloadList = () => {
isShowForm.value = false
isShowReForm.value = false
getCurUserLablePageList()
}
//
const handleReplay = (record) => {
// isShowReForm.value = true
isShowReForm.value = true
nextTick(() => {
// reApplyFormRef.value.getQualificationInfo(record.id, record.node);
});
lableReApplyFormRef.value.getLableDetailInfo(record.id);
});
}
//
const handleDetele = (record) => {

View File

@ -0,0 +1,425 @@
<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="labelId">
<el-select v-model="ruleForm.labelId" placeholder="请选择申请标签" clearable
@change="handleChoseLabl">
<el-option v-for="dict in bus_label" :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="userName">
<el-input v-model="ruleForm.userName" 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.labelId">申请信息</div>
<div class="applyFormContainer" v-if="ruleForm.labelId">
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="qualificationName" label="资质名称" width="100" />
<el-table-column prop="certificateUrl" label="资质证书" align="center">
<template #default="scope">
<el-image v-if="scope.row.certificateUrl"
style="width: 70px; height: 44px;line-height: 50px;"
:src="baseUrl + scope.row.certificateUrl" fit="fill" />
<span v-else>请在"高压资质培训信息"上传资质证书</span>
</template>
</el-table-column>
<el-table-column prop="status" label="是否过期" width="120">
<template #default="scope">
<el-text v-if="scope.row.status == 1 && scope.row.certificateUrl" type="success"
class="successText">正常</el-text>
<el-text v-else-if="scope.row.status == 2 && scope.row.certificateUrl" type="danger"
class="dangerText">过期</el-text>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column prop="startTime" label="有效开始日期" width="150">
<template #default="scope">
<span v-if="scope.row.startTime"> {{ moment(scope.row.startTime).format('YYYY-MM-DD')
}}</span>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column prop="expireTime" label="到期日期" width="130">
<template #default="scope">
<span v-if="scope.row.expireFlag == 0">长期</span>
<template v-else>
<span v-if="scope.row.expireTime"> {{ moment(scope.row.expireTime).format('YYYY-MM-DD')
}}</span>
<span v-else>-</span>
</template>
</template>
</el-table-column>
</el-table>
</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 } from 'vue'
import { deptTreeSelect } from "@/api/system/user"
import { getBusDependencyPage } from "@/api/system/dependency"
import { getSysSectionPage } from "@/api/system/section"
import { getBusUserLabelDetail, reApplyBusUserLabel } from "@/api/labelManage/labelManage"
import { getCurrentUserList } from "@/api/qualification/myQualifications"
import moment from 'moment'
const emit = defineEmits(['refresh'])
const { proxy } = getCurrentInstance()
const { bus_label } = proxy.useDict("bus_label")
const data = reactive({
ruleForm: {},
rules: {
labelId: [{ required: true, message: "申请标签不能为空", trigger: "change" }],
workNo: [{ required: true, message: "员工工号不能为空", trigger: "blur" }],
userName: [{ 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" }],
},
})
const { ruleForm, rules } = toRefs(data)
const queryParams = ref({
pageIndex: 1,
pageSize: 10,
})
const requiredQualifications = ref([])
const loading = ref(true)
const tableData = ref([])
const baseUrl = import.meta.env.VITE_APP_BASE_API
//
onMounted(() => {
getBusDependencyData()
getDeptTree()
getSysSectionData()
});
//
const getLableDetailInfo = (_id) => {
getBusUserLabelDetail(_id).then(res => {
if (res.code == 200) {
ruleForm.value = res.data
ruleForm.value.node = 0
tableData.value = res.data.userQualificationCertificateList
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 handleChoseLabl = async (val) => {
loading.value = true;
try {
const res = await getCurUserQualification();
console.log('获取接口完毕', res);
// Define the qualifications mapping
const qualificationsMap = {
'SH': ['电工证', 'SH'],
'ES': ['电工证', 'ES'],
'ESC': ['电工证', 'ESC'],
'CESC': ['电工证', 'CESC'],
'SH+LLP': ['电工证', 'SH', 'LLP', '急救证'],
'ES+LLP': ['电工证', 'ES', 'LLP', '急救证'],
'ESC+LLP': ['电工证', 'ESC', 'LLP', '急救证'],
'CESC+LLP': ['电工证', 'CESC', 'LLP', '急救证']
};
// Get the required qualifications or default to empty array
requiredQualifications.value = qualificationsMap[val] || [];
console.log('rwerwe', requiredQualifications)
// Filter the data
tableData.value = res.filter(item =>
requiredQualifications.value.some(qualification =>
item.qualificationName === qualification
))
} catch (error) {
console.error('获取失败', error);
} finally {
loading.value = false;
}
};
//
const getCurUserQualification = async () => {
try {
const res = await getCurrentUserList(queryParams.value);
console.log('diao');
return res.code === 200 ? res.data : [];
} catch (error) {
console.error('获取用户证书失败', error);
return [];
}
};
const handleCancel = () => {
proxy.resetForm("ruleFormRef")
emit('refresh')
}
const handleSubmit = () => {
proxy.$refs["ruleFormRef"].validate(valid => {
if (valid) {
const qualificArr = tableData.value.filter(item=> item.certificateUrl)
console.log('是否有资质证书', qualificArr)
if(qualificArr.length < requiredQualifications.value.length) {
proxy.$modal.msgError(`资质证书不全,请在"高压资质培训信息"上传资质证书!`)
return false;
}
const qualificStateArr = tableData.value.filter(item=> item.status == 2)
console.log('是否有资质证书', qualificStateArr)
if(qualificStateArr.length > 0) {
proxy.$modal.msgError(`资质过期,请更新资质证书后再申请!`)
return false;
}
ruleForm.value.qualificationCertificateIds = tableData.value.map(item=> item.id)
console.log('sdafasdfas', ruleForm.value)
reApplyBusUserLabel(ruleForm.value).then(res => {
if (res.code == 200) {
proxy.$modal.msgSuccess("提交成功")
emit('refresh')
} else {
proxy.$modal.msgSuccess(res.msg)
}
})
}
})
}
//
defineExpose({
getLableDetailInfo
});
</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;
}
.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;
}
.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-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>