<template>
|
<div class="home-container">
|
<el-form :model="form" label-width="180px" :rules="applyRules" ref="ruleFormRef">
|
<div class="homeCard">
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="作业申请单位" prop="workDetail.involvedDepIds">
|
<el-cascader style="width: 100%" v-model="form.workDetail.involvedDepIds" :options="departList" :props="depProps" :show-all-levels="false"/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="动火级别" prop="workLevel">
|
<el-select v-model="form.workLevel">
|
<el-option
|
v-for="item in workLevelList"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="作业内容" prop="workContent">
|
<el-input
|
v-model="form.workContent"
|
:autosize="{ minRows: 1 }"
|
type="textarea"
|
placeholder="请输入作业内容"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="作业地点及动火部位" prop="workLocation">
|
<el-input
|
v-model="form.workContent"
|
:autosize="{ minRows: 1 }"
|
type="textarea"
|
placeholder="请输入作业内容"
|
/>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="动火方式" prop="workDetail.hotMethod">
|
<el-input
|
v-model="form.workDetail.hotMethod"
|
:autosize="{ minRows: 1 }"
|
type="textarea"
|
placeholder="请输入动火方式"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="动火人级证书编号" prop="operatorUids">
|
<el-select v-model="form.operatorUids" multiple>
|
<el-option
|
v-for="item in workerList"
|
:key="item.uid"
|
:label="item.username"
|
:value="item.uid"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="作业单位" prop="workDetail.involvedDepIds">
|
<el-cascader style="width: 100%" v-model="form.workDetail.involvedDepIds" :props="depProps" :options="departList" :show-all-levels="false"/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="作业负责人" prop="operatorUids">
|
<el-select v-model="form.operatorUids" multiple>
|
<el-option
|
v-for="item in workerList"
|
:key="item.uid"
|
:label="item.username"
|
:value="item.uid"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="分析人" prop="operatorUids">
|
<el-select v-model="form.operatorUids" multiple>
|
<el-option
|
v-for="item in workerList"
|
:key="item.uid"
|
:label="item.username"
|
:value="item.uid"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="关联其他特殊作业" prop="workDetail.otherSpecialWork">
|
<el-select v-model="form.workDetail.otherSpecialWork" multiple>
|
<el-option
|
v-for="item in otherWorkList"
|
:key="item.value"
|
:label="item.label"
|
:value="item.label"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="分析人" prop="operatorUids">
|
<el-select v-model="form.operatorUids" multiple>
|
<el-option
|
v-for="item in workerList"
|
:key="item.uid"
|
:label="item.username"
|
:value="item.uid"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="绑定执法仪" prop="cameraIds">
|
<el-select v-model="form.cameraIds" multiple>
|
<el-option
|
v-for="item in deviceList"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="动火作业实施时间" prop="workTimeLine">
|
<el-date-picker
|
v-model="form.workTimeLine"
|
format="YYYY-MM-DD HH:mm"
|
value-format="YYYY-MM-DD HH:mm:00"
|
type="datetimerange"
|
range-separator="至"
|
start-placeholder="开始时间"
|
end-placeholder="结束时间"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="预计（整体）完成时间" prop="workTimeLine">
|
<el-date-picker
|
v-model="form.workTimeLine"
|
format="YYYY-MM-DD HH:mm"
|
value-format="YYYY-MM-DD HH:mm:00"
|
type="datetime"
|
style="width: 100%"
|
/>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="备注" prop="info">
|
<el-input
|
v-model="form.workContent"
|
:autosize="{ minRows: 1 }"
|
type="textarea"
|
placeholder="请输入作业备注"
|
/>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-table :data="safeData" style="width: 100%" border>
|
<el-table-column type="index" label="序号" width="80px"/>
|
<el-table-column prop="name" label="安全措施"/>
|
<el-table-column prop="address" label="确认人">
|
<template #default="scope">
|
|
</template>
|
</el-table-column>
|
<el-table-column prop="address" label="操作">
|
<template #default="scope">
|
<el-button link type="primary" size="small" :icon="Edit">修改确认人</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="其他安全措施填报人" prop="info">
|
<el-select v-model="form.operatorUids" multiple>
|
<el-option
|
v-for="item in workerList"
|
:key="item.uid"
|
:label="item.username"
|
:value="item.uid"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-table :data="form.reviewData" style="width: 100%" border>
|
<el-table-column prop="item" label="审批签字项目"/>
|
<el-table-column prop="isCheck" label="是否必签">
|
<template #default="scope">
|
<el-radio-group v-model="scope.row.isCheck">
|
<el-radio :label="1">所有必签</el-radio>
|
<el-radio :label="2">任一</el-radio>
|
<el-radio :label="3">非必签</el-radio>
|
</el-radio-group>
|
</template>
|
</el-table-column>
|
<el-table-column prop="names" label="审批人">
|
<template #default="scope">
|
|
</template>
|
</el-table-column>
|
<el-table-column prop="address" label="操作">
|
<template #default="scope">
|
<el-button link type="primary" size="small" :icon="Edit">选择审批人</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="完工验收" prop="info">
|
<el-select v-model="form.operatorUids">
|
<el-option
|
v-for="item in workerList"
|
:key="item.uid"
|
:label="item.username"
|
:value="item.uid"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="现场开始结束确认人" prop="info">
|
<el-select v-model="form.operatorUids" multiple>
|
<el-option
|
v-for="item in workerList"
|
:key="item.uid"
|
:label="item.username"
|
:value="item.uid"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</div>
|
</el-form>
|
<div class="applyBtn">
|
<el-button type="primary" size="large" plain @click="submitForm(ruleFormRef)">提交申报</el-button>
|
</div>
|
</div>
|
</template>
|
|
<script lang="ts">
|
import { toRefs, reactive, defineComponent, ref, defineAsyncComponent, onMounted } from 'vue';
|
import { storeToRefs } from 'pinia';
|
import { initBackEndControlRoutes } from '/@/router/backEnd';
|
import {useUserInfo} from "/@/stores/userInfo";
|
import { Session } from '/@/utils/storage';
|
import { Search, Edit } from '@element-plus/icons-vue'
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
import type { FormInstance, FormRules } from 'element-plus'
|
import { workApplyApi } from '/@/api/specialWorkSystem/workApply';
|
interface stateType {
|
form: Object,
|
workLevelList: Array<any>,
|
otherWorkList: Array<any>,
|
equipmentDialog: boolean,
|
depProps:{},
|
safeData: []
|
}
|
export default defineComponent({
|
name: 'fireForm',
|
components: {
|
|
},
|
props:['departList','workerList','deviceList'],
|
setup(props: any, context: any) {
|
const userInfo = useUserInfo()
|
const { userInfos } = storeToRefs(userInfo);
|
const state = reactive<stateType>({
|
equipmentDialog: false,
|
form: {
|
operatorUids: [],
|
workType: 1,
|
workLevel: null,
|
workContent: '',
|
workLocation: '',
|
maBaseId: null,
|
hazardIdentification: '',
|
cameraIds: [],
|
workDetail:{
|
hotMethod: '',
|
otherSpecialWork: []
|
},
|
receiveUids: [],
|
workTimeLine: [],
|
expStartTime: '',
|
expEndTime: '',
|
reviewData: [
|
{
|
item: '作业负责人意见',
|
isCheck: null,
|
names: []
|
},
|
{
|
item: '车间主任意见',
|
isCheck: null,
|
names: []
|
},
|
{
|
item: '运营安环科意见',
|
isCheck: null,
|
names: []
|
},
|
{
|
item: '运营单位负责人意见',
|
isCheck: null,
|
names: []
|
},
|
{
|
item: '事业部安环科意见',
|
isCheck: null,
|
names: []
|
},
|
{
|
item: '事业部负责人审批意见',
|
isCheck: null,
|
names: []
|
},
|
{
|
item: '公司主要负责人审批意见',
|
isCheck: null,
|
names: []
|
},
|
{
|
item: '岗位当班班长验票情况',
|
isCheck: null,
|
names: []
|
}
|
]
|
},
|
workLevelList: [
|
{
|
label: "一级动火作业",
|
value: 1
|
},
|
{
|
label: "二级动火作业",
|
value: 2
|
},
|
{
|
label: "特级动火作业",
|
value: 3
|
}
|
],
|
otherWorkList: [
|
{
|
label: "动火作业",
|
value: 1
|
},
|
{
|
label: "受限空间作业",
|
value: 2
|
},
|
{
|
label: "吊装作业",
|
value: 3
|
},
|
{
|
label: "动土作业",
|
value: 4
|
},
|
{
|
label: "断路作业",
|
value: 5
|
},
|
{
|
label: "高处作业",
|
value: 6
|
},
|
{
|
label: "临时用电作业",
|
value: 7
|
},
|
{
|
label: "盲板抽堵作业",
|
value: 8
|
}
|
],
|
depProps:{
|
expandTrigger: 'hover',
|
label: 'depName',
|
value: 'depId'
|
},
|
safeData: []
|
});
|
const ruleFormRef = ref<FormInstance>()
|
const applyRules = reactive<FormRules>({
|
operatorUids: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
|
workType: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
|
workLevel: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
|
workContent: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
|
workLocation: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
|
hazardIdentification: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
|
cameraIds: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
|
workTimeLine: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
|
"workDetail.hotMethod": [{ required: true, message: '该内容不能为空', trigger: 'blur' }]
|
});
|
|
// 页面载入时执行方法
|
onMounted(() => {
|
state.form.involvedDepIds = userInfos.value.depId
|
});
|
|
|
// 折线图
|
const renderMenu = async (value: string) => {
|
Session.set('projectId',value)
|
userInfos.value.projectId = value
|
await initBackEndControlRoutes();
|
};
|
return {
|
renderMenu,
|
Search,
|
ruleFormRef,
|
applyRules,
|
...toRefs(state),
|
};
|
},
|
});
|
</script>
|
|
<style scoped lang="scss">
|
.home-container {
|
width: 100%;
|
height: 100vh;
|
overflow: hidden;
|
position: relative;
|
overflow-y: scroll;
|
padding: 40px 0 100px;
|
.homeCard{
|
width: 100%;
|
padding: 20px;
|
box-sizing: border-box;
|
background: #fff;
|
border-radius: 4px;
|
margin-bottom: 20px;
|
}
|
.applyBtn{
|
position: absolute;
|
z-index: 999;
|
width: 100%;
|
background: #fff;
|
padding-top: 15px;
|
box-shadow: 0 -3px 8px rgba(150,150,150,.1);
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
.el-row{
|
margin-bottom: 20px;
|
}
|
.el-row:last-child {
|
margin-bottom: 0;
|
}
|
.el-input{
|
width: 100% !important;
|
}
|
.el-date-editor::v-deep{
|
width: 100%;
|
}
|
.el-select{
|
width: 100%;
|
}
|
.el-cascader{
|
width: 100% !important;
|
}
|
}
|
|
.tab-i{
|
margin-bottom: 15px;
|
|
&:last-of-type{
|
margin-bottom: 0;
|
}
|
::v-deep(.el-form-item){
|
.el-form-item__label{
|
margin-bottom: 4px;
|
}
|
}
|
}
|
</style>
|
