|
|
@@ -1 +1,654 @@
|
|
|
-<template> xxx </template>
|
|
|
+<template>
|
|
|
+ <div class="safety-platform-container">
|
|
|
+ <header class="safety-platform-container__header">
|
|
|
+ <div class="breadcrumb-title"><BreadcrumbBack /> 编辑危险作业申请</div>
|
|
|
+ </header>
|
|
|
+
|
|
|
+ <main class="safety-platform-container__main">
|
|
|
+ <el-form ref="formRef" :model="formValue" :rules="rules" label-width="160px" label-position="right">
|
|
|
+ <div class="section-title">基础信息</div>
|
|
|
+ <div class="form-grid">
|
|
|
+ <el-form-item label="审批流程" prop="templateId" class="span-full">
|
|
|
+ <el-select v-model="formValue.templateId" placeholder="请选择审批流程" size="large" clearable>
|
|
|
+ <el-option v-for="opt in approvalOptions" :key="opt.id" :label="opt.templateName" :value="opt.id" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="作业类型" prop="hazardOperationType">
|
|
|
+ <el-select disabled size="large" v-model="formValue.hazardOperationType" class="w-100">
|
|
|
+ <el-option :value="1" label="有限空间作业" />
|
|
|
+ <el-option :value="2" label="高处作业" />
|
|
|
+ <el-option :value="3" label="临时用电" />
|
|
|
+ <el-option :value="4" label="动火作业" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="申请单位" prop="applicationUnitName"
|
|
|
+ ><el-input size="large" v-model="formValue.applicationUnitName"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="申请人" prop="applicantName"
|
|
|
+ ><el-input size="large" v-model="formValue.applicantName"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="申请部门" prop="applicationDepartment"
|
|
|
+ ><el-cascader
|
|
|
+ v-model="formValue.applicationDepartmentId"
|
|
|
+ size="large"
|
|
|
+ ref="cascaderRef"
|
|
|
+ :options="firstLevelDepts"
|
|
|
+ :props="cascaderProp"
|
|
|
+ :show-all-levels="false"
|
|
|
+ placeholder="请选择部门名称"
|
|
|
+ filterable
|
|
|
+ @change="handleChangeDept"
|
|
|
+ style="width: 100%"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="联系电话" prop="applicantPhone"
|
|
|
+ ><el-input size="large" v-model="formValue.applicantPhone"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="备注信息" prop="remark" class="span-full">
|
|
|
+ <el-input size="large" v-model="formValue.remark" type="textarea" :rows="2" placeholder="备注信息..." />
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="form-line-divider"></div>
|
|
|
+
|
|
|
+ <template v-if="formValue.hazardOperationType === 1">
|
|
|
+ <div class="section-title">有限空间作业详情</div>
|
|
|
+ <div class="form-grid">
|
|
|
+ <el-form-item label="所属单位" prop="space.confinedSpaceUnit"
|
|
|
+ ><el-input size="large" v-model="formValue.space.confinedSpaceUnit"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="空间名称" prop="space.confinedSpaceName"
|
|
|
+ ><el-input size="large" v-model="formValue.space.confinedSpaceName"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="负责人" prop="space.unitResponsible"
|
|
|
+ ><el-input size="large" v-model="formValue.space.unitResponsible"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="监护人" prop="space.supervisor"
|
|
|
+ ><el-input size="large" v-model="formValue.space.supervisor"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="作业人" prop="space.operator"
|
|
|
+ ><el-input size="large" v-model="formValue.space.operator" placeholder="多人请用逗号分隔"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="其他作业" prop="space.otherSpecialOps"
|
|
|
+ ><el-input size="large" v-model="formValue.space.otherSpecialOps"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="开始时间" prop="space.operationStartTime"
|
|
|
+ ><el-date-picker
|
|
|
+ size="large"
|
|
|
+ v-model="formValue.space.operationStartTime"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ class="w-100"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="结束时间" prop="space.operationEndTime"
|
|
|
+ ><el-date-picker
|
|
|
+ size="large"
|
|
|
+ v-model="formValue.space.operationEndTime"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ class="w-100"
|
|
|
+ /></el-form-item>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="sub-group-box">
|
|
|
+ <div class="sub-label is-required-manual">环境当前浓度指标 (初始评估)</div>
|
|
|
+ <el-table :data="[formValue.space]" border class="density-table">
|
|
|
+ <el-table-column label="有毒有害物质 (toxicHazardous)">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-form-item prop="space.toxicHazardous" :rules="r" label-width="0" class="m-0"
|
|
|
+ ><el-input v-model="scope.row.toxicHazardous"
|
|
|
+ /></el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="可燃气 (flammable)">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-form-item prop="space.flammable" :rules="r" label-width="0" class="m-0"
|
|
|
+ ><el-input v-model="scope.row.flammable"
|
|
|
+ /></el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="氧含量 (oxygenContent)">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-form-item prop="space.oxygenContent" :rules="r" label-width="0" class="m-0"
|
|
|
+ ><el-input v-model="scope.row.oxygenContent"
|
|
|
+ /></el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="form-grid mt-20">
|
|
|
+ <el-form-item label="作业内容" prop="space.operationContent" class="span-full"
|
|
|
+ ><el-input size="large" v-model="formValue.space.operationContent" type="textarea"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="危害辨识" prop="space.hazardIdentification" class="span-full"
|
|
|
+ ><el-input size="large" v-model="formValue.space.hazardIdentification" type="textarea"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="作业附件" class="span-full"
|
|
|
+ ><UploadFiles
|
|
|
+ label="上传附件"
|
|
|
+ @upload-success="(l) => handleUpload('space', 'attachment', l)"
|
|
|
+ :fileList="listMap['space.attachment']"
|
|
|
+ /></el-form-item>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-else-if="formValue.hazardOperationType === 2">
|
|
|
+ <div class="section-title">高处作业详情</div>
|
|
|
+ <div class="form-grid">
|
|
|
+ <el-form-item label="作业地点" prop="highAltitude.operationLocation"
|
|
|
+ ><el-input size="large" v-model="formValue.highAltitude.operationLocation"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="作业单位" prop="highAltitude.operationUnit"
|
|
|
+ ><el-input size="large" v-model="formValue.highAltitude.operationUnit"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="作业高度(m)" prop="highAltitude.operationHeight"
|
|
|
+ ><el-input-number
|
|
|
+ size="large"
|
|
|
+ v-model="formValue.highAltitude.operationHeight"
|
|
|
+ class="w-100"
|
|
|
+ :controls="false"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="作业类别" prop="highAltitude.operationType"
|
|
|
+ ><el-input size="large" v-model="formValue.highAltitude.operationType" placeholder="如:悬挂作业"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="作业人姓名" prop="highAltitude.operatorName"
|
|
|
+ ><el-input size="large" v-model="formValue.highAltitude.operatorName"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="监护人" prop="highAltitude.supervisor"
|
|
|
+ ><el-input size="large" v-model="formValue.highAltitude.supervisor"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="开始时间" prop="highAltitude.operationStartTime"
|
|
|
+ ><el-date-picker
|
|
|
+ size="large"
|
|
|
+ v-model="formValue.highAltitude.operationStartTime"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ class="w-100"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="结束时间" prop="highAltitude.operationEndTime"
|
|
|
+ ><el-date-picker
|
|
|
+ size="large"
|
|
|
+ v-model="formValue.highAltitude.operationEndTime"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ class="w-100"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="作业内容" prop="highAltitude.operationContent" class="span-full"
|
|
|
+ ><el-input size="large" v-model="formValue.highAltitude.operationContent" type="textarea"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="危害辨识" prop="highAltitude.hazardIdentification" class="span-full"
|
|
|
+ ><el-input size="large" v-model="formValue.highAltitude.hazardIdentification" type="textarea"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="作业附件" class="span-full"
|
|
|
+ ><UploadFiles
|
|
|
+ label="上传附件"
|
|
|
+ @upload-success="(l) => handleUpload('highAltitude', 'attachment', l)"
|
|
|
+ :fileList="listMap['highAltitude.attachment']"
|
|
|
+ /></el-form-item>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-else-if="formValue.hazardOperationType === 3">
|
|
|
+ <div class="section-title">临时用电详情</div>
|
|
|
+ <div class="form-grid">
|
|
|
+ <el-form-item label="需求部门" prop="electricityList.requestDepartment"
|
|
|
+ ><el-input size="large" v-model="formValue.electricityList.requestDepartment"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="用电类型" prop="electricityList.electricityType">
|
|
|
+ <el-select v-model="formValue.electricityList.electricityType" class="w-100">
|
|
|
+ <el-option :value="1" label="长期" /><el-option :value="2" label="临时" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="责任人" prop="electricityList.contactPerson"
|
|
|
+ ><el-input size="large" v-model="formValue.electricityList.contactPerson"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="设备功率" prop="electricityList.equipmentPower"
|
|
|
+ ><el-input size="large" v-model="formValue.electricityList.equipmentPower"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="开始时间" prop="electricityList.operationStartTime"
|
|
|
+ ><el-date-picker
|
|
|
+ size="large"
|
|
|
+ v-model="formValue.electricityList.operationStartTime"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ class="w-100"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="结束时间" prop="electricityList.operationEndTime"
|
|
|
+ ><el-date-picker
|
|
|
+ size="large"
|
|
|
+ v-model="formValue.electricityList.operationEndTime"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ class="w-100"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="保护措施" prop="electricityList.safety" class="span-full"
|
|
|
+ ><el-input size="large" v-model="formValue.electricityList.safety"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="用电事由" prop="electricityList.reason" class="span-full"
|
|
|
+ ><el-input size="large" v-model="formValue.electricityList.reason" type="textarea"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="申请附件" class="span-full"
|
|
|
+ ><UploadFiles
|
|
|
+ label="上传附件"
|
|
|
+ @upload-success="(l) => handleUpload('electricityList', 'attachment', l)"
|
|
|
+ :fileList="listMap['electricityList.attachment']"
|
|
|
+ /></el-form-item>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-else-if="formValue.hazardOperationType === 4">
|
|
|
+ <div class="section-title">动火作业详情</div>
|
|
|
+ <div class="sub-label">A. 动火任务信息</div>
|
|
|
+ <div class="form-grid">
|
|
|
+ <el-form-item label="动火地点" prop="hot.hotWorkLocation"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.hotWorkLocation"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="动火级别" prop="hot.hotWorkLevel">
|
|
|
+ <el-select v-model="formValue.hot.hotWorkLevel" class="w-100">
|
|
|
+ <el-option :value="1" label="一级" /><el-option :value="2" label="二级" /><el-option
|
|
|
+ :value="3"
|
|
|
+ label="三级"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="特殊时段" prop="hot.isSpecialPeriod">
|
|
|
+ <el-radio-group v-model="formValue.hot.isSpecialPeriod">
|
|
|
+ <el-radio :label="1">是 (节假日/重大活动)</el-radio>
|
|
|
+ <el-radio :label="0">否</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="动火类型" prop="hot.hotWorkType"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.hotWorkType" placeholder="气焊/电焊/打磨等"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="开始时间" prop="hot.hotWorkStart"
|
|
|
+ ><el-date-picker
|
|
|
+ size="large"
|
|
|
+ v-model="formValue.hot.hotWorkStart"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ class="w-100"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="结束时间" prop="hot.hotWorkEnd"
|
|
|
+ ><el-date-picker size="large" v-model="formValue.hot.hotWorkEnd" value-format="YYYY-MM-DD" class="w-100"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="动火任务" prop="hot.hotWorkTask" class="span-full"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.hotWorkTask" type="textarea"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="危险性分析" prop="hot.hazardAnalysis" class="span-full"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.hazardAnalysis" type="textarea"
|
|
|
+ /></el-form-item>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="sub-label">B. 责任人信息</div>
|
|
|
+ <div class="form-grid">
|
|
|
+ <el-form-item label="动火作业人员" prop="hot.hotWorkman"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.hotWorkman"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="动火人电话" prop="hot.hotWorkContact"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.hotWorkContact"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="施工单位监护人" prop="hot.constructionSupervisor"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.constructionSupervisor"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="监护人电话" prop="hot.supervisorContact"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.supervisorContact"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="现场负责人" prop="hot.constructionSiteLeader"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.constructionSiteLeader"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="教育人" prop="hot.constructionEducator"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.constructionEducator"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="申请部门监护人" prop="hot.hotWorkSupervisor"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.hotWorkSupervisor"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="部门监护电话" prop="hot.supervisorNumber"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.supervisorNumber"
|
|
|
+ /></el-form-item>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="sub-label">C. 防护措施与附件</div>
|
|
|
+ <div class="form-grid">
|
|
|
+ <el-form-item label="安全防护措施" prop="hot.fireSafetyMeasures" class="span-full"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.fireSafetyMeasures" type="textarea"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="现场检查情况" prop="hot.supervisorMeasures" class="span-full"
|
|
|
+ ><el-input size="large" v-model="formValue.hot.supervisorMeasures" type="textarea"
|
|
|
+ /></el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="动火现场照片"
|
|
|
+ ><UploadFiles
|
|
|
+ label="上传附件"
|
|
|
+ @upload-success="(l) => handleUpload('hot', 'photos', l)"
|
|
|
+ :fileList="listMap['hot.photos']"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="身份证复印件"
|
|
|
+ ><UploadFiles
|
|
|
+ label="上传附件"
|
|
|
+ @upload-success="(l) => handleUpload('hot', 'idCard', l)"
|
|
|
+ :fileList="listMap['hot.idCard']"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="特种作业证"
|
|
|
+ ><UploadFiles
|
|
|
+ label="上传附件"
|
|
|
+ @upload-success="(l) => handleUpload('hot', 'optionCard', l)"
|
|
|
+ :fileList="listMap['hot.optionCard']"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="安全教育记录"
|
|
|
+ ><UploadFiles
|
|
|
+ label="上传附件"
|
|
|
+ @upload-success="(l) => handleUpload('hot', 'safetyEducationPlan', l)"
|
|
|
+ :fileList="listMap['hot.safetyEducationPlan']"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="施工方案"
|
|
|
+ ><UploadFiles
|
|
|
+ label="上传附件"
|
|
|
+ @upload-success="(l) => handleUpload('hot', 'constructionPlan', l)"
|
|
|
+ :fileList="listMap['hot.constructionPlan']"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="准备工作照片"
|
|
|
+ ><UploadFiles
|
|
|
+ label="上传附件"
|
|
|
+ @upload-success="(l) => handleUpload('hot', 'preparationPhotos', l)"
|
|
|
+ :fileList="listMap['hot.preparationPhotos']"
|
|
|
+ /></el-form-item>
|
|
|
+ <el-form-item label="管理协议"
|
|
|
+ ><UploadFiles
|
|
|
+ label="上传附件"
|
|
|
+ @upload-success="(l) => handleUpload('hot', 'safetyManagementAgreement', l)"
|
|
|
+ :fileList="listMap['hot.safetyManagementAgreement']"
|
|
|
+ /></el-form-item>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <div class="form-line-divider"></div>
|
|
|
+
|
|
|
+ <div class="section-title-flex">
|
|
|
+ <span class="is-required-manual">安全措施清单</span>
|
|
|
+ <el-button type="primary" @click="addRow('measure')">+ 新增措施</el-button>
|
|
|
+ </div>
|
|
|
+ <el-table :data="formValue.measure" border class="mb-20">
|
|
|
+ <el-table-column label="序号" prop="serialNumber" width="100" align="center" />
|
|
|
+ <el-table-column label="措施内容"
|
|
|
+ ><template #default="scope"><el-input v-model="scope.row.safetyMeasure" /></template
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column label="确认人" width="200"
|
|
|
+ ><template #default="scope"><el-input v-model="scope.row.confirmer" /></template
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column label="操作" width="80" align="center">
|
|
|
+ <template #default="scope"
|
|
|
+ ><el-button type="primary" link @click="removeRow('measure', scope.$index)">删除</el-button></template
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <div class="section-title-flex">
|
|
|
+ <span class="is-required-manual">危害分析记录</span>
|
|
|
+ <el-button type="primary" @click="addRow('analysis')">+ 新增记录</el-button>
|
|
|
+ </div>
|
|
|
+ <el-table :data="formValue.analysis" border>
|
|
|
+ <el-table-column label="检测部位"
|
|
|
+ ><template #default="scope"><el-input v-model="scope.row.analysisPosition" /></template
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column label="有毒物质及浓度"
|
|
|
+ ><template #default="scope"><el-input v-model="scope.row.toxicSubstance" /></template
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column label="可燃气及浓度"
|
|
|
+ ><template #default="scope"><el-input v-model="scope.row.flammableGas" /></template
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column label="氧含量"
|
|
|
+ ><template #default="scope"><el-input v-model="scope.row.oxygenContent" /></template
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column label="检测人" width="130"
|
|
|
+ ><template #default="scope"><el-input v-model="scope.row.analyst" /></template
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column label="检测时间" width="220"
|
|
|
+ ><template #default="scope">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="scope.row.analysisTime"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ style="width: 100%"
|
|
|
+ /> </template
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column label="操作" width="80" align="center">
|
|
|
+ <template #default="scope"
|
|
|
+ ><el-button type="primary" link @click="removeRow('analysis', scope.$index)">删除</el-button></template
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-form>
|
|
|
+ </main>
|
|
|
+
|
|
|
+ <footer class="safety-platform-container__footer">
|
|
|
+ <el-button size="large" @click="router.back()">取 消</el-button>
|
|
|
+ <el-button type="primary" size="large" :loading="loading" @click="handleSave">提交</el-button>
|
|
|
+ </footer>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script lang="ts" setup>
|
|
|
+ import { ref, reactive, onMounted, nextTick } from 'vue';
|
|
|
+ import { useRouter, useRoute } from 'vue-router';
|
|
|
+ import { ElMessage } from 'element-plus';
|
|
|
+ import UploadFiles from '@/components/UploadFiles/UploadFiles.vue';
|
|
|
+ import { getAllApproval } from '@/api/approval/approval';
|
|
|
+ import {
|
|
|
+ dangerWorkQueryDetail,
|
|
|
+ dangerWorkUpdateDangerWork,
|
|
|
+ } from '@/api/production-safety/responsibility-implementation';
|
|
|
+ import { formatDeptTree } from '@/views/disaster/utils/formatDeptTree';
|
|
|
+ import { getAllDepartments } from '@/api/auth/dept';
|
|
|
+ import { unformatAttachment, formatAttachmentList } from '@/components/UploadFiles/utils';
|
|
|
+
|
|
|
+ const router = useRouter();
|
|
|
+ const route = useRoute();
|
|
|
+ const formRef = ref<any>(null);
|
|
|
+ const loading = ref(false);
|
|
|
+ const detailId = route.query.id as string;
|
|
|
+
|
|
|
+ const approvalOptions = ref<any[]>([]);
|
|
|
+ const firstLevelDepts = ref<any[]>([]);
|
|
|
+ const cascaderRef = ref<any>(null);
|
|
|
+ const cascaderProp = { expandTrigger: 'click', checkStrictly: true, value: 'id', label: 'deptName' };
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 1. 附件显示映射 (仅用于组件内部回显显示)
|
|
|
+ */
|
|
|
+ const listMap = reactive<any>({
|
|
|
+ 'space.attachment': [],
|
|
|
+ 'highAltitude.attachment': [],
|
|
|
+ 'electricityList.attachment': [],
|
|
|
+ 'hot.photos': [],
|
|
|
+ 'hot.idCard': [],
|
|
|
+ 'hot.optionCard': [],
|
|
|
+ 'hot.safetyEducationPlan': [],
|
|
|
+ 'hot.constructionPlan': [],
|
|
|
+ 'hot.preparationPhotos': [],
|
|
|
+ 'hot.safetyManagementAgreement': [],
|
|
|
+ });
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 2. 初始化表单数据结构 (保持深度对象存在)
|
|
|
+ */
|
|
|
+ const formValue = reactive<any>({
|
|
|
+ id: detailId,
|
|
|
+ templateId: '',
|
|
|
+ applicationDepartment: '',
|
|
|
+ applicationDepartmentId: [],
|
|
|
+ applicationUnitName: '',
|
|
|
+ applicantName: '',
|
|
|
+ applicantPhone: '',
|
|
|
+ hazardOperationType: '',
|
|
|
+ remark: '',
|
|
|
+ // 必须预设这些对象,防止赋值时路径不存在
|
|
|
+ space: { attachment: '' },
|
|
|
+ highAltitude: { attachment: '' },
|
|
|
+ electricityList: { attachment: '' },
|
|
|
+ hot: {
|
|
|
+ photos: '',
|
|
|
+ idCard: '',
|
|
|
+ optionCard: '',
|
|
|
+ safetyEducationPlan: '',
|
|
|
+ constructionPlan: '',
|
|
|
+ preparationPhotos: '',
|
|
|
+ safetyManagementAgreement: '',
|
|
|
+ },
|
|
|
+ measure: [],
|
|
|
+ analysis: [],
|
|
|
+ });
|
|
|
+
|
|
|
+ const r = { required: true, message: '此项必填', trigger: ['blur', 'change'] };
|
|
|
+ const rules = reactive({
|
|
|
+ templateId: [r],
|
|
|
+ applicationUnitName: [r],
|
|
|
+ applicantName: [r],
|
|
|
+ applicationDepartmentId: [r],
|
|
|
+ applicantPhone: [r],
|
|
|
+ });
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 3. 关键:上传成功回调
|
|
|
+ * @param obj 对应的对象名 (如 'space')
|
|
|
+ * @param key 对应的字段名 (如 'attachment')
|
|
|
+ * @param list 组件返回的最新的 fileList 数组
|
|
|
+ */
|
|
|
+ const handleUpload = async (obj: string, key: string, list: any[]) => {
|
|
|
+ listMap[`${obj}.${key}`] = list;
|
|
|
+
|
|
|
+ if (formValue[obj]) {
|
|
|
+ const formatted = await formatAttachmentList(list);
|
|
|
+ formValue[obj][key] = formatted.length > 0 ? JSON.stringify(formatted) : '';
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 4. 详情回显
|
|
|
+ */
|
|
|
+ const getDetail = async () => {
|
|
|
+ if (!detailId) return;
|
|
|
+ try {
|
|
|
+ const res = await dangerWorkQueryDetail(detailId);
|
|
|
+
|
|
|
+ // 1. 基础属性拷贝
|
|
|
+ Object.assign(formValue, res);
|
|
|
+
|
|
|
+ // 2. 等待 DOM 和 v-if 完成渲染 (确保 Upload 控件已经挂载)
|
|
|
+ await nextTick();
|
|
|
+
|
|
|
+ const typeKeyMap: any = { 1: 'space', 2: 'highAltitude', 3: 'electricityList', 4: 'hot' };
|
|
|
+ const activeObjName = typeKeyMap[formValue.hazardOperationType];
|
|
|
+
|
|
|
+ if (!activeObjName) return;
|
|
|
+
|
|
|
+ // 3. 附件处理逻辑
|
|
|
+ Object.keys(listMap).forEach((path) => {
|
|
|
+ // 检查当前路径是否属于选中的作业类型 (例如 "space.attachment")
|
|
|
+ if (path.startsWith(activeObjName)) {
|
|
|
+ const [objName, fieldName] = path.split('.');
|
|
|
+
|
|
|
+ // 拿到后端返回的原始字段值 (通常是字符串)
|
|
|
+ const rawValue = formValue[objName]?.[fieldName];
|
|
|
+
|
|
|
+ if (rawValue) {
|
|
|
+ // 【核心修改】:调用你的解析函数,将字符串转为数组
|
|
|
+ // 确保 unformatAttachment 函数已在当前作用域可用
|
|
|
+ listMap[path] = unformatAttachment(rawValue);
|
|
|
+
|
|
|
+ console.log(`附件解析成功 [${path}]:`, listMap[path]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } catch (err) {
|
|
|
+ console.error('详情加载失败:', err);
|
|
|
+ ElMessage.error('详情回显失败');
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 5. 提交保存
|
|
|
+ */
|
|
|
+ const handleSave = async () => {
|
|
|
+ const valid = await formRef.value.validate().catch(() => false);
|
|
|
+ if (!valid) return ElMessage.error('请检查表单必填项');
|
|
|
+
|
|
|
+ loading.value = true;
|
|
|
+
|
|
|
+ // 深度克隆,避免操作原对象
|
|
|
+ const submitData = JSON.parse(JSON.stringify(formValue));
|
|
|
+
|
|
|
+ // 数据清洗:只发送当前选中的危险作业详情
|
|
|
+ const typeMap: any = { 1: 'space', 2: 'highAltitude', 3: 'electricityList', 4: 'hot' };
|
|
|
+ const currentKey = typeMap[formValue.hazardOperationType];
|
|
|
+
|
|
|
+ Object.values(typeMap).forEach((val) => {
|
|
|
+ if (val !== currentKey) {
|
|
|
+ delete submitData[val as string];
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ dangerWorkUpdateDangerWork(submitData)
|
|
|
+ .then(() => {
|
|
|
+ ElMessage.success('保存成功');
|
|
|
+ router.back();
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ loading.value = false;
|
|
|
+ });
|
|
|
+ };
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 辅助:表格行操作
|
|
|
+ */
|
|
|
+ const addRow = (type: 'measure' | 'analysis') => {
|
|
|
+ if (type === 'measure') {
|
|
|
+ formValue.measure.push({ serialNumber: formValue.measure.length + 1, safetyMeasure: '', confirmer: '' });
|
|
|
+ } else {
|
|
|
+ formValue.analysis.push({
|
|
|
+ toxicSubstance: '',
|
|
|
+ flammableGas: '',
|
|
|
+ oxygenContent: '',
|
|
|
+ analysisTime: '',
|
|
|
+ analysisPosition: '',
|
|
|
+ analyst: '',
|
|
|
+ });
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ const removeRow = (type: 'measure' | 'analysis', index: number) => {
|
|
|
+ formValue[type].splice(index, 1);
|
|
|
+ if (type === 'measure') {
|
|
|
+ formValue.measure.forEach((item: any, i: number) => (item.serialNumber = i + 1));
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ const handleChangeDept = () => {
|
|
|
+ const node = cascaderRef.value?.getCheckedNodes()?.[0];
|
|
|
+ if (node) {
|
|
|
+ formValue.applicationDepartment = node.label;
|
|
|
+ formValue.applicationDepartmentId = node.pathValues;
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ onMounted(async () => {
|
|
|
+ const [depts, approvals] = await Promise.all([getAllDepartments(), getAllApproval()]);
|
|
|
+ firstLevelDepts.value = formatDeptTree(depts);
|
|
|
+ approvalOptions.value = approvals || [];
|
|
|
+
|
|
|
+ getDetail();
|
|
|
+ });
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+ @use '@/styles/page-main-layout.scss' as *;
|
|
|
+ @use '@/styles/page-details-layout.scss' as *;
|
|
|
+ .safety-platform-container {
|
|
|
+ .section-title-flex {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin: 15px 0;
|
|
|
+ }
|
|
|
+ &__main {
|
|
|
+ padding: 24px;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+ :deep(.el-form-item) {
|
|
|
+ margin-right: 20px;
|
|
|
+ margin-bottom: 24px;
|
|
|
+ vertical-align: top;
|
|
|
+ .el-form-item__label {
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|