GitBucket
Newer
<!-- 对编号为XXX证书/报告的补充件 基本信息 -->
<script name="BusinessCertSupplementBasic" lang="ts" setup>
import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
import type { FormRules } from 'element-plus'
import dayjs from 'dayjs'
import type { IForm } from '../supplement-interface'
import type { dictType } from '@/global'
import { getDictByCode } from '@/api/system/dict'
import { SCHEDULE } from '@/utils/scheduleDict'
import { getCertList as getCertInfo } from '@/api/business/certManage/cert'
import { getCertificateList } from '@/api/business/taskMeasure/certificate'
import useUserStore from '@/store/modules/user'
import selectChangeApplyDialog from '@/views/business/certManage/supplement/dialog/selectChangeApplyDialog.vue'
import { addSupplement, failUpdateSupplement, getInfo, getSupplementDetail, submit, updateSupplement } from '@/api/business/certManage/supplement'
const props = defineProps({
pageType: { // 页面类型 add新建 edit编辑 detail详情
type: String,
requre: true,
default: 'detail',
},
id: { // id
type: String,
requre: true,
},
approvalStatusName: { // 审批状态名称
type: String,
requre: true,
},
processId: { // 流程实例id
type: String,
},
})
const emits = defineEmits(['addSuccess', 'submitSuccess'])
const $router = useRouter()
const user = useUserStore() // 用户信息
const form = ref<IForm>({
labCode: '', // 实验室
labCodeName: '', // 实验室名称
groupCode: '', // 部门
groupCodeName: '', // 部门名称
changeSupplyNo: '', // 文件编号
changeSupplyName: '', // 文件名称
createUserId: '', // 创建人id
createUserName: '', // 创建人名称
createTime: '', // 创建时间
changeApplyNo: '', // 证书/报告补充或更换申请单编号
changeApplyName: '', // 证书/报告补充或更换申请单名称
changeApplyId: '', // 证书/报告补充或更换申请单id
customerName: '', // 委托方
changeReportName: '', // 证书/报告名称
changeReportNo: '', // 证书/报告编号
sampleName: '', // 智能模型名称
model: '', // 规格型号
manufactureNo: '', // 出厂编号
sbsrrq: '', // 智能模型收入日期
traceDate: '', // 测试、校准检定日期
supplyReason: '', // 说明原因
supplyCause: '', // 导致问题
supplyContent: '', // 补充内容
})
const ruleFormRef = ref() // 表单ref
const loading = ref(false) // loading
const infoId = ref('') // id
const rules = ref<FormRules>({ // 校验规则
labCode: [{ required: true, message: '实验室不能为空', trigger: ['blur', 'change'] }],
groupCode: [{ required: true, message: '部门不能为空', trigger: ['blur', 'change'] }],
changeApplyNo: [{ required: true, message: '证书/报告补充或更换申请单编号不能为空', trigger: ['change', 'blur'] }],
supplyReason: [{ required: true, message: '此处不能为空', trigger: ['change', 'blur'] }],
supplyCause: [{ required: true, message: '此处不能为空', trigger: ['change', 'blur'] }],
supplyContent: [{ required: true, message: '补充内容不能为空', trigger: ['change', 'blur'] }],
sm: [{ required: true, message: '说明不能为空', trigger: ['change', 'blur'] }],
})
// ------------------------------------------字典----------------------------------------------
const labCodeList = ref<dictType[]>([]) // 实验室代码
const groupCodeList = ref<dictType[]>([]) // 组别代码
function getDict() {
// 实验室
getDictByCode('bizGroupCodeEquipment').then((response) => {
labCodeList.value = response.data
})
// 部门
getDictByCode('bizGroupCode').then((response) => {
groupCodeList.value = response.data
})
}
getDict()
// -----------------------------------------------选择证书/报告补充或更换申请单编号----------------------------------------------
const selectChangeApplyDialogRef = ref() // 选择证书/报告补充或更换申请单编号组件ref
// 点击选择证书/报告补充或更换申请单编号
const selectUpdateCertNo = () => {
selectChangeApplyDialogRef.value.initDialog()
}
// 通过证书编号获取证书相关的信息
const fetchCertInfo = async (changeReportNo = '') => {
const params = {
approvalStatus: '0', // 审批状态类型code，导出接口不用传
certificateReportNo: changeReportNo, // 证书报告编号
certificateReportName: '', // 证书报告名称
customerId: '', // 委托方id
customerName: '', // 委托方
deptName: '', // 使用部门
sampleNo: '', // 受检智能模型编号
sampleName: '', // 受检智能模型名称
model: '', // 规格型号
manufactureNo: '', // 出厂编号
measureCategory: '', // 检校类别(字典code)
traceDateStart: '', // 测试、校准或检定日期开始
traceDateEnd: '', // 测试、校准或检定日期结束
conclusion: '', // 结论(所检项目合格/不合格/除*外其余所检项目合格,用户手选)
measureValidDateStart: '', // 检定有效期开始
measureValidDateEnd: '', // 检定有效期结束
labCode: '', // 实验室代码(字典code)
groupCode: '', // 组别代码(字典code)
createUserName: '', // 检定员
formId: SCHEDULE.CERTIFICATE_PRINT_APPROVAL, // 表单id
printStatus: '', // 打印状态(未打印传1,其他状态不传)
offset: 1,
limit: 20,
}
let result = [] as any
const response = await getCertInfo(params)
if (response.data && response.data.rows && response.data.rows.length) {
result = response.data.rows
}
return result
}
// 根据证书报告编号调检定审批列表接口获取智能模型信息
const fetchEquipmentInfoByMeasureCert = (changeReportNo = '') => {
if (!changeReportNo) {
return false
}
// 查询条件
const listQuery = {
approvalStatus: '0', // 审批状态类型code，导出接口不用传
certificateName: '', // 证书名称
certificateNo: changeReportNo, // 证书编号
formId: SCHEDULE.CERTIFICATE_APPROVAL, // 表单id（流程定义对应的表单id，等价于业务id），导出接口不用传
groupCode: '', // 组别代码(字典code)
labCode: '', // 实验室代码(字典code)
manufactureNo: '', // 出厂编号
manufacturer: '', // 厂商
measureCategory: '', // 检校类别(字典code)
model: '', // 规格型号
sampleName: '', // 受检智能模型名称
sampleNo: '', // 被检智能模型统一编号
staffName: '', // 检定员名字
traceDateEnd: '', // 测试、校准或检定日期结束
traceDateStart: '', // 测试、校准或检定日期开始
measureValidDateStart: '', // 检定有效期开始
measureValidDateEnd: '', // 检定有效期结束
conclusion: '', // 检定结论
customerName: '', // 委托方
deptName: '', // 使用部门
measureDataNo: '', // 检定数据编号
limit: 999999,
offset: 1,
}
getCertificateList(listQuery).then((response) => {
if (response && response.data && response.data.rows && response.data.rows.length) {
form.value.customerName = response.data.rows[0].customerName // 委托方
form.value.sampleName = response.data.rows[0].sampleName // 智能模型名称
form.value.model = response.data.rows[0].model // 规格型号
form.value.manufactureNo = response.data.rows[0].manufactureNo // 出厂编号
form.value.sbsrrq = response.data.rows[0].sbsrrq // 智能模型收入日期
form.value.traceDate = response.data.rows[0].traceDate // 测试、校准检定日期
}
})
}
// 确认选择证书
const confirmSelect = (val: any) => {
if (val && val.length) {
form.value.changeApplyNo = val[0].changeApplyNo // 报告补充或更换申请单编号
form.value.changeApplyName = val[0].changeApplyName // 报告补充或更换申请单名称
form.value.changeApplyId = val[0].id // 报告补充或更换申请单编号id
form.value.changeReportName = val[0].changeReportName // 证书 / 报告名称
form.value.changeReportNo = val[0].changeReportNo // 证书编号
form.value.changeSupplyName = `对编号为${val[0].changeReportNo}证书/报告的补充件` // 申请单名称
fetchEquipmentInfoByMeasureCert(val[0].changeReportNo)
}
}
// -----------------------------------------------保存----------------------------------------------
/**
* 点击保存
* @param formEl 基本信息表单ref
*/
const saveForm = async () => {
await ruleFormRef.value.validate((valid: boolean) => {
if (valid) { // 基本信息表单通过校验
ElMessageBox.confirm(
'确认保存吗？',
'提示',
{
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
},
).then(() => {
const loading = ElLoading.service({
lock: true,
text: '加载中...',
background: 'rgba(255, 255, 255, 0.8)',
})
const params = {
...form.value,
id: infoId.value,
processId: props.processId,
}
if (props.pageType === 'add') { // 新建
addSupplement(params).then((res) => {
loading.close()
form.value.changeSupplyNo = res.data.changeSupplyNo // 文件编号
infoId.value = res.data.id // id
emits('addSuccess', infoId.value)
ElMessage.success('已保存')
}).catch(() => {
loading.close()
})
}
else if (props.pageType === 'edit') { // 编辑
console.log(props.approvalStatusName)
if (props.approvalStatusName === '草稿箱' || props.approvalStatusName === '全部') {
updateSupplement(params).then((res) => {
loading.close()
emits('addSuccess', infoId.value)
ElMessage.success('已保存')
}).catch(() => {
loading.close()
})
}
else { // '未通过' || '已取消'
failUpdateSupplement(params).then((res) => {
loading.close()
emits('submitSuccess')
// fetchInfo()
ElMessage.success('已保存')
}).catch(() => {
loading.close()
})
}
}
})
}
})
}
// ----------------------------------------------提交--------------------------------------------
// 提交
/**
*
* @param processId 流程实例id
* @param id
*/
const submitForm = (processId: string, id: string) => {
const loading = ElLoading.service({
lock: true,
text: '加载中...',
background: 'rgba(255, 255, 255, 0.6)',
})
submit({ id, formId: SCHEDULE.CERTIFICATE_SUPPLEMENT_APPROVAL }).then((res) => {
ElMessage.success('已提交')
emits('submitSuccess')
loading.close()
})
}
// -----------------------------------------------------------------------------------------
// 点击证书报告编号跳转证书页面
const clickReportNo = () => {
fetchCertInfo(form.value.changeReportNo).then((res) => {
if (Array.isArray(res) && res.length) {
const row = res[0]
$router.push({
path: `/cert/detail/${row.id}`,
query: {
...row,
approvalStatusName: '全部', // 审批状态名称
printFileName: row.certificateFile,
printStatusName: row.printStatusName, // 证书打印状态
processId: row.processId, // 流程实例
taskId: row.taskId, // 任务id，用于同意、驳回、拒绝审批
},
})
}
})
}
// 获取详情
const fetchSupplementDetail = () => {
getSupplementDetail({ id: infoId.value }).then((res) => {
form.value = res.data
})
}
// ---------------------------------------------钩子----------------------------------------------
watch(() => props.id, (newValue) => {
infoId.value = newValue!
}, { immediate: true })
const route = useRoute()
onMounted(async () => {
if (props.pageType === 'edit' || props.pageType === 'detail') {
// form.value.labCode = route.query.labCode as string // 实验室
// form.value.labCodeName = route.query.labCodeName as string // 实验室名称
// form.value.groupCode = route.query.groupCode as string // 部门
// form.value.groupCodeName = route.query.groupCodeName as string // 部门名称
// form.value.changeSupplyNo = route.query.changeSupplyNo as string // 文件编号
// form.value.changeSupplyName = route.query.changeSupplyName as string // 文件名称
// form.value.createUserId = route.query.createUserId as string // 创建人id
// form.value.createUserName = route.query.createUserName as string // 创建人名称
// form.value.createTime = route.query.createTime as string // 创建时间
// form.value.changeApplyNo = route.query.changeApplyNo as string // 证书/报告补充或更换申请单编号
// form.value.changeApplyName = route.query.changeApplyName as string // 证书/报告补充或更换申请单名称
// form.value.changeApplyId = route.query.changeApplyId as string // 证书/报告补充或更换申请单id
// form.value.customerName = route.query.customerName as string // 委托方
// form.value.changeReportName = route.query.changeReportName as string // 证书/报告名称
// form.value.changeReportNo = route.query.changeReportNo as string // 证书/报告编号
// form.value.sampleName = route.query.sampleName as string // 智能模型名称
// form.value.model = route.query.model as string // 规格型号
// form.value.manufactureNo = route.query.manufactureNo as string // 出厂编号
// form.value.sbsrrq = route.query.sbsrrq as string // 智能模型收入日期
// form.value.traceDate = route.query.traceDate as string // 测试、校准检定日期
// form.value.supplyReason = route.query.supplyReason as string // 说明原因
// form.value.supplyCause = route.query.supplyCause as string // 导致问题
// form.value.supplyContent = route.query.supplyContent as string // 补充内容
fetchSupplementDetail()
}
else { // 新建
form.value.createUserId = user.id// 创建人id
form.value.createUserName = user.name // 创建人
form.value.createTime = dayjs().format('YYYY-MM-DD HH-mm:ss')// 创建时间
form.value.changeSupplyName = '对编号为XXX证书/报告的补充件' // 申请单名称
form.value.labCode = user.bizLabCode // 实验室
form.value.groupCode = user.groupNo // 部门名称
}
})
defineExpose({ saveForm, submitForm })
</script>
<template>
<el-form
ref="ruleFormRef"
:model="form"
:label-width="134"
label-position="right"
:rules="rules"
>
<detail-block title="">
<el-row :gutter="24">
<el-col :span="6">
<el-form-item label="实验室" prop="labCode">
<el-select v-model="form.labCode" :placeholder="pageType === 'detail' ? ' ' : '请选择实验室'" :disabled="pageType === 'detail'" class="full-width-input">
<el-option v-for="item in labCodeList" :key="item.id" :label="item.name" :value="item.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="部门" prop="groupCode">
<el-select v-model="form.groupCode" :placeholder="pageType === 'detail' ? ' ' : '请选择部门'" :disabled="pageType === 'detail'" class="full-width-input">
<el-option v-for="item in groupCodeList" :key="item.id" :label="item.name" :value="item.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="文件编号:" prop="changeSupplyNo">
<el-input
v-model="form.changeSupplyNo"
:placeholder="pageType === 'detail' ? '' : '系统自动生成'"
:class="{ 'detail-input': pageType === 'detail' }"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="文件名称:" prop="changeSupplyName">
<el-input
v-model="form.changeSupplyName"
:class="{ 'detail-input': pageType === 'detail' }"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="创建人:">
<el-input v-model="form.createUserName" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="创建时间:">
<el-date-picker
v-if="pageType !== 'detail'"
v-model="form.createTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
disabled
class="full-width-input"
/>
<el-date-picker
v-if="pageType === 'detail'"
v-model="form.createTime"
type="datetime"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
disabled
class="full-width-input"
/>
</el-form-item>
</el-col>
</el-row>
</detail-block>
<detail-block title="">
<el-row :gutter="24">
<el-col :span="12">
<el-form-item label="证书/报告补充或更换申请单编号" label-width="280px" prop="changeApplyNo">
<el-input
v-model="form.changeApplyNo"
:placeholder="pageType === 'detail' ? '' : '请选择'"
:class="{ 'detail-input': pageType === 'detail' }"
disabled
>
<template v-if="pageType !== 'detail'" #append>
<el-button size="small" @click="selectUpdateCertNo">
选择
</el-button>
</template>
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="委托方:" prop="customerName">
<el-input
v-model="form.customerName"
:placeholder="pageType === 'detail' ? ' ' : '委托方'"
:class="{ 'detail-input': pageType === 'detail' }"
disabled
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="6">
<el-form-item label="证书/报告名称:" prop="changeReportName">
<el-input
v-model="form.changeReportName"
:placeholder="pageType === 'detail' ? ' ' : '证书/报告名称'"
:class="{ 'detail-input': pageType === 'detail' }"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="证书/报告编号:" prop="changeReportNo">
<span v-if="pageType === 'detail'" class="link" @click="clickReportNo">{{ form.changeReportNo }}</span>
<el-input
v-else
v-model="form.changeReportNo"
:placeholder="pageType === 'detail' ? ' ' : '证书/报告编号'"
:class="{ 'detail-input': pageType === 'detail' }"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="智能模型名称:">
<el-input
v-model="form.sampleName"
:class="{ 'detail-input': pageType === 'detail' }"
:placeholder="pageType === 'detail' ? ' ' : '智能模型名称'"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="规格型号:">
<el-input
v-model="form.model"
:class="{ 'detail-input': pageType === 'detail' }"
:placeholder="pageType === 'detail' ? ' ' : '规格型号'"
disabled
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="出厂编号:">
<el-input
v-model="form.manufactureNo"
:class="{ 'detail-input': pageType === 'detail' }"
:placeholder="pageType === 'detail' ? ' ' : '出厂编号'"
disabled
/>
</el-form-item>
</el-col>
<!-- <el-col :span="6">
<el-form-item label="智能模型收入日期:">
<el-input
v-model="form.sbsrrq"
:class="{ 'detail-input': pageType === 'detail' }"
:placeholder="pageType === 'detail' ? ' ' : '智能模型收入日期'"
disabled
/>
</el-form-item>
</el-col> -->
<el-col :span="6">
<el-form-item label="测试、校准检定日期:" label-width="180px">
<el-input
v-model="form.traceDate"
:class="{ 'detail-input': pageType === 'detail' }"
:placeholder="pageType === 'detail' ? ' ' : '测试、校准检定日期'"
disabled
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<!-- <el-form-item label="说明:" prop="sm">
<el-input
v-model="form.sm"
:rows="4"
type="textarea"
:autosize="{ minRows: 4, maxRows: 20 }"
max-length="500"
:placeholder="pageType === 'detail' ? '' : '说明'"
:class="{ 'detail-input': pageType === 'detail' }"
:disabled="pageType === 'detail'"
/>
</el-form-item> -->
<div class="desc">
<span>贵单位编号为 </span>
<el-form-item label-width="10px" style="margin-right: 10px;">
<el-input
v-model="form.changeReportNo"
:placeholder="pageType === 'detail' ? ' ' : '系统自动生成'"
:class="{ 'detail-input': pageType === 'detail' }"
disabled
style="width: 220px;"
/>
</el-form-item>
<span> 的 </span>
<el-form-item label-width="10px" style="margin-right: 10px;">
<el-input
v-model="form.changeReportName"
:placeholder="pageType === 'detail' ? ' ' : '系统自动生成'"
:class="{ 'detail-input': pageType === 'detail' }"
disabled
style="width: 220px;"
/>
</el-form-item>
<span> 证书/报告，因 </span>
<el-form-item label-width="10px" prop="supplyReason" style="margin-right: 10px;">
<el-input
v-model="form.supplyReason"
:placeholder="pageType === 'detail' ? ' ' : '请填写'"
:class="{ 'detail-input': pageType === 'detail' }"
:disabled="pageType === 'detail'"
style="width: 400px;"
type="textarea"
autosize
:maxlength="50"
show-word-limit
/>
</el-form-item>
<span> 原因， 导致</span>
<el-form-item label-width="10px" prop="supplyCause" style="margin-right: 10px;">
<el-input
v-model="form.supplyCause"
:placeholder="pageType === 'detail' ? ' ' : '请填写'"
:class="{ 'detail-input': pageType === 'detail' }"
:disabled="pageType === 'detail'"
style="width: 400px;"
type="textarea"
autosize
:maxlength="50"
show-word-limit
/>
</el-form-item>
<span> 内容不全面，现予补充。 </span>
<span> 补充件和原证书或报告一并使用，共同为有效文件。因我们工作疏忽，给贵单位造成不便，深表歉意，请予谅解。</span>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="补充内容:" prop="supplyContent">
<el-input
v-model="form.supplyContent"
:rows="4"
type="textarea"
:autosize="{ minRows: 4, maxRows: 20 }"
:placeholder="pageType === 'detail' ? '' : '补充内容'"
:class="{ 'detail-input': pageType === 'detail' }"
:disabled="pageType === 'detail'"
:maxlength="500"
show-word-limit
/>
</el-form-item>
</el-col>
</el-row>
</detail-block>
</el-form>
<select-change-apply-dialog ref="selectChangeApplyDialogRef" @confirm="confirmSelect" />
</template>
<style lang="scss" scoped>
.desc {
box-sizing: border-box;
padding: 5px 11px;
color: #606266;
border: 1px solid #dcdfe6;
border-radius: 4px;
box-shadow: 0 0 0 1px var(#dcdfe6, var(--el-border-color)) inset;
margin-left: 134px;
margin-bottom: 20px;
display: flex;
white-space: nowrap;
flex-wrap: wrap;
line-height: 30px;
}
.link {
color: #3d7eff;
text-decoration: underline;
cursor: pointer;
margin-right: 8px;
}
</style>