factory_web/src/views/opm/clear.vue

890 lines
22 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<el-container>
<el-header>
<el-steps
:active="active"
style="width: 100%"
:align-center="true"
finish-status="success"
>
<el-step
v-for="(item, index) of stepTitle"
:key="index"
:title="item"
style="50%"
@click="handleStep(index)"
>
</el-step>
</el-steps>
</el-header>
<!--基本信息!-->
<el-main class="nopadding" v-show="active === 0">
<el-form
v-show="active === 0"
ref="dialogForm"
:model="form"
:rules="rules"
label-width="110px"
style="margin: 40px 40px 0px 40px"
>
<el-row>
<el-col :md="12" :sm="12" :xs="24">
<el-form-item label="关联作业">
<el-input
v-model="form.name"
type="text"
:disabled="true"
></el-input>
</el-form-item>
</el-col>
<el-col :md="12" :sm="12" :xs="24">
<el-form-item label="作业许可种类">
<el-input
v-model="pagtitle"
type="text"
:disabled="true"
></el-input>
</el-form-item>
</el-col>
<el-col :md="12" :sm="12" :xs="24">
<el-form-item label="作业开始时间" prop="start_time">
<el-date-picker
v-model="form.start_time"
type="datetime"
placeholder="选择开始时间"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="12" :xs="24">
<el-form-item label="作业结束时间" prop="end_time">
<el-date-picker
v-model="form.end_time"
type="datetime"
placeholder="选择开始时间"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="12" :xs="24" >
<el-form-item label="作业部门" prop="dept_do">
<el-cascader
placeholder="选择作业部门"
getCheckedNodes="true"
v-model="form.dept_do"
:options="deptoptions"
:props="{
expandTrigger: 'hover', // 次级菜单的展开方式
label: 'label', //
value: 'value', //
emitPath: false, // 在选中节点改变时,是否返回由该节点所在的各级菜单的值所组成的数组,若设置 false则只返回该节点的值
checkStrictly: true
}"
clearable
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="12" :xs="24">
<el-form-item label="作业负责人" prop="charger">
<el-input
v-model="form.charger_name"
style="width:200px"
disabled
></el-input>
<!-- <el-select v-model="form.charger_name" placeholder="选择作业负责人">
<el-option
v-for="item in useroptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select> -->
<ehsUserSelect :multiple="false" @submit="getCharger"/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="12" :xs="24">
<el-form-item label="作业监护人" prop="monitor">
<el-input
v-model="form.monitor_name"
style="width:200px"
disabled
></el-input>
<ehsUserSelect :multiple="false" @submit="getMonitor"/>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="风险选择" prop="risks_checked">
<el-checkbox-group v-model="form.risks_checked">
<el-checkbox
v-for="(item, index) in risklist"
:key="index"
:label="item.id"
>{{ item.name }}
</el-checkbox
>
</el-checkbox-group>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="其他风险">
<el-input
v-model="form.other_risk"
type="text"
clearable
></el-input>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="措施选择" prop="measures_checked">
<el-checkbox-group v-model="form.measures_checked">
<el-checkbox
v-for="(item, index) in measurelist"
:key="index"
:label="item.id"
>{{ item.name }}
</el-checkbox
>
</el-checkbox-group>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-card header="应急处置">
<div class="content">
<p>1、施救人员必须穿戴防护用品防毒面具、正压式空气呼吸器、长管式呼吸器和安全绳方可进入库、
仓内进行救援。</p>
<p>2、将受伤人员托起或使用三角架、绞盘和全身式安全带将伤者救出。</p>
<p>3、如伤者发生骨折不应随意移动伤者立即拨打120。</p>
<p>4、发生人员窒息、中毒将其转移到空气新鲜流通的场所插入氧气袋或进行心肺复苏术情况严重拨打120。</p>
<p>4、逃生通道</p>
</div>
</el-card>
<el-form-item label="其他应急处置">
<el-input
v-model="form.other_emr"
type="text"
clearable
></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div style="margin-bottom: 20px; text-align:center">
<el-button type="primary" plain @click="handleNextStep"
>下一步
</el-button>
</div>
</el-main>
<!--作业人员!-->
<el-main class="nopadding" v-show="active === 1">
<div class="left-panel" style="margin: 10px">
<el-button
type="primary"
icon="el-icon-plus"
@click="addworker"
></el-button>
</div>
<scTable
ref="workerTable"
:data="apiworkerObj"
row-key="id"
hidePagination
stripe
hideDo
style="height: 300px;"
>
<el-table-column
label="#"
fixed="left"
type="index"
width="50"
></el-table-column>
<el-table-column label="姓名" prop="name" width="150">
<template #default="scope">
{{ scope.row.worker_.name }}
</template>
</el-table-column>
<el-table-column label="工作职责" prop="duty" width="150">
</el-table-column>
<el-table-column label="证书" prop="certificates" width="150">
<template #default="scope">
<el-tag v-for="item in scope.row.certificates_"
:key="item.number"
:label="item.name"
:value="item.number">{{item.name}}
</el-tag>
</template>
</el-table-column>
<el-table-column
label="创建时间"
prop="create_time"
width="150"
></el-table-column>
<el-table-column label="操作" fixed="right" align="center" width="200">
<template #default="scope">
<el-popconfirm
title="确定删除该作业人员吗?"
@confirm="delWorker(scope.row)"
>
<template #reference>
<el-button text type="danger" size="small">删除</el-button>
</template>
</el-popconfirm>
</template>
</el-table-column>
</scTable>
<el-dialog v-model="workerdialog" draggable title="选择作业人员">
<el-form
ref="workerForm"
:model="formworker"
:rules="rules"
:disabled="mode == 'show'"
label-width="80px"
width="70%"
style="margin: 40px 40px 40px 40px"
>
<el-row>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="作业人员">
<el-input
v-model="formworker.worker_name"
style="width:200px"
disabled
></el-input>
<ehsUserSelect :multiple="false" @submit="getWorker"/>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="工作职责">
<el-select
v-model="formworker.duty"
filterable
allow-create
default-first-option
:reserve-keyword="false"
>
<el-option
v-for="item in dutyOptions"
:key="item.value"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="证书">
<el-select
v-model="formworker.certificates"
multiple
placeholder="选择证书"
>
<el-option
v-for="item in certificatesOptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<el-button @click="dialogcart = false">取 消</el-button>
<el-button type="primary" @click="submitWorker">确 定</el-button>
</template>
</el-dialog>
<div style="margin-top:20px;text-align:center">
<el-button style="margin-right: 4px" @click="handleLastStep"
>上一步
</el-button>
<el-button type="primary" plain @click="handleNextStep"
>下一步
</el-button>
</div>
</el-main>
<!--气体检测记录!-->
<el-main class="nopadding" v-show="active === 2">
<div class="left-panel" style="margin: 10px">
<el-button
type="primary"
icon="el-icon-plus"
@click="addgas"
></el-button>
</div>
<scTable
ref="gasTable"
:data="apigasObj"
row-key="id"
hidePagination
hideDo
stripe
style="height: 300px;"
>
<el-table-column
label="#"
fixed="left"
type="index"
width="50"
></el-table-column>
<el-table-column
label="检测时间"
prop="check_time"
width="150"
></el-table-column>
<el-table-column
label="检测部位"
prop="check_place"
width="150"
></el-table-column>
<el-table-column label="O2(%)" prop="o2" width="150"></el-table-column>
<el-table-column label="CO" prop="co" width="150"></el-table-column>
<el-table-column
label="h2s"
prop="h2s"
width="150"
></el-table-column>
<el-table-column
label="检验结论"
prop="is_ok"
width="150"
>
<template #default="scope">
{{ is_ok_[scope.row.is_ok] }}
</template>
</el-table-column>
<el-table-column
label="检测人"
prop="checker"
width="150"
>
<template #default="scope">
{{ scope.row.checker_.name }}
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" width="200">
<template #default="scope">
<el-popconfirm
title="确定删除该条气体检测记录吗?"
@confirm="delgas(scope.row)"
>
<template #reference>
<el-button text type="danger" size="small">删除</el-button>
</template>
</el-popconfirm>
</template>
</el-table-column>
</scTable>
<el-dialog v-model="gasdialog" draggable title="气体检测记录">
<el-form
ref="gasForm"
:model="formgas"
:rules="rules"
:disabled="mode == 'show'"
label-width="80px"
width="70%"
style="margin: 40px 40px 40px 40px"
>
<el-row>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="检测时间">
<el-date-picker
v-model="formgas.check_time"
type="datetime"
placeholder="选择检测时间"
/>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="检测部位">
<el-input
v-model="formgas.check_place"
type="text"
clearable
></el-input>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="O2(%)">
<el-input v-model.number="formgas.o2" type="text" clearable></el-input>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="CO">
<el-input
v-model.number="formgas.co"
type="text"
clearable
></el-input>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="H2S">
<el-input
v-model.number="formgas.h2s"
type="text"
clearable
></el-input>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="检验结论">
<el-radio-group v-model="formgas.is_ok">
<el-radio l :label="true">正常</el-radio>
<el-radio :label="false">不正常</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :md="24" :sm="12" :xs="24">
<el-form-item label="检测人">
<el-input
v-model="formgas.checker_name"
style="width:200px"
disabled
></el-input>
<ehsUserSelect :multiple="false" @submit="getChecker"/>
<!-- <el-select
v-model="formgas.checker"
placeholder="选择作业人员"
>
<el-option
v-for="item in useroptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select> -->
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<el-button @click="dialoggase = false">取 消</el-button>
<el-button type="primary" @click="submitgas">确 定</el-button>
</template>
</el-dialog>
<div style="margin-top:20px;text-align:center">
<el-button @click="handleLastStep" style="margin-right:4px">上一步</el-button>
<el-button
:loading="tLoading"
v-for=" item in initForm.transitions"
:key="item.id"
type="primary"
@click="submitTicketCreate(item.id)"
style="margin-right:4px"
>{{item.name}}
</el-button>
<el-button @click="submitOut" type="warning">退出</el-button>
</div>
</el-main>
</el-container>
</template>
<style scoped>
.clearfix {
font-size: 20px;
}
.box-card p {
line-height: 20px;
}
.content {
margin-top: 10px;
}
.stepSuc:hover {
cursor: pointer;
}
.stepErr:hover {
cursor: not-allowed;
}
</style>
<script>
import {genTree} from "@/utils/verificate";
const defaultformworker = {
id: "",
worker: null,
duty: "作业人员",
certificates: [],
opl: "",
};
const defaultformgas = {
id: "",
is_ok: true,
check_time: null,
opl: "",
};
export default {
name: "fire",
components: {},
data() {
return {
active: 0,
stepSuc: [0],
stepTitle: ["基本信息", "作业人员", "气体检测记录"],
query: {},
selection: [],
issave: false, //控制基本信息提交
search: {
keyword: null,
},
form: {
id: "",
start_time: null,
end_time: null,
operation: "",
cate: "",
risks_checked: [],
measures_checked: []
},
initForm: {},
operationId: "",
oplcateId: "",
oplcateCode: "",
oplId: "",
leveloptions: [
{id: 10, name: "特殊动火"},
{id: 20, name: "一级动火"},
{id: 30, name: "二级动火"},
],
deptoptions: [],
useroptions: [],
risklist: [],
measurelist: [],
pagtitle: "",
dutyOptions: [
{value: 10, label: "作业人员"},
{value: 20, label: "起重司机"},
{value: 30, label: "司索人员"},
{value: 40, label: "起重指挥"},
{value: 40, label: "电工"},
],
certificatesOptions: [],
formworker: defaultformworker,
apiworkerObj: [],
workerdialog: false,
gasdialog: false,
formgas: defaultformgas,
apigasObj: [],
is_ok_: {
true: "正常",
false: "不正常",
},
tLoading: false,
rules: {
start_time: [
{required: true, message: '请选择'}
],
end_time: [
{required: true, message: '请选择'}
],
level: [
{required: true, message: '请选择'}
],
dept_do: [
{required: true, message: '请选择'}
],
charger: [
{required: true, message: '请选择'}
],
monitor: [
{required: true, message: '请选择'}
],
risks_checked: [
{required: true, message: '请选择'}
],
measures_checked: [
{required: true, message: '请选择'}
],
}
};
},
mounted() {
this.operationId = this.$route.query.operationid; //作业ID
this.oplcateId = this.$route.query.oplcateId; //作业许可证种类ID
this.oplId = this.$route.query.oplId; //许可证ID
this.getoplData();
this.getInit();
this.getDept();
// this.getUser();
},
methods: {
getCharger(data) {
this.form.charger=data.id;
this.form.charger_name=data.name
},
getChecker(data){
this.formgas.checker=data.id;
this.formgas.checker_name=data.name
},
getMonitor(data) {
this.form.monitor=data.id;
this.form.monitor_name=data.name
},
getWorker(data) {
this.formworker.worker=data.id,
this.formworker.worker_name=data.name
this.selectWorker()
},
getoplData() {
if (this.oplId == "") {
this.getOperation();
this.getOplcates();
} else {
this.getData();
}
},
//根据oplId查许可证
getData() {
this.$API.opm.opl.read.req(this.oplId).then((res) => {
this.form = res;
this.oplId = res.id;
this.oplcateId = res.cate;
this.operationId = res.operation;
this.getOperation();
this.getOplcates();
});
},
//根据operationId查作业信息
getOperation() {
this.$API.opm.operation.read.req(this.operationId).then((res) => {
this.form.start_time = res.start_time; //作业开始时间
this.form.end_time = res.end_time; //作业结束时间
this.form.name = res.name; //作业结束时间
console.log(res);
});
},
//作业部门
getDept() {
this.$API.system.dept.list.req({page: 0}).then((res) => {
this.deptoptions = genTree(res);
});
},
//作业负责人、作业监护人
//作业
//根据作业许可证类别ID获取风险、措施===>作业许可证类别详情
getOplcates() {
this.$API.opm.oplcate.read.req(this.oplcateId).then((res) => {
console.log(res); //
this.pagtitle = res.name;
this.oplcateCode = res.code;
this.risklist = res.risk_options_; //风险缝隙
this.measurelist = res.measure_options_; //控制措施
});
},
handleStep(val) {
//点击步骤条
if (this.stepSuc.includes(val) === true) {
this.active = val;
}
},
//组件点击上一步
handleLastStep() {
if (--this.active === 0) {
this.active = 0;
}
},
//组件点击下一步
handleNextStep() {
if (this.active == 0) {
this.$refs.dialogForm.validate((valid) => {
if (valid) {
//如果是创建许可证书
if (this.oplId == "") {
//基本信息提交
debugger;
this.form.cate = this.oplcateId;
this.form.operation = this.operationId;
console.log(this.form);
this.$API.opm.opl.create
.req(this.form)
.then((res) => {
this.$emit("success", this.form);
this.$message.success("创建成功");
this.issave = true;
this.active = 1;
this.oplId = res.id;
this.getworkerList();
this.getgasList();
return res;
})
.catch((err) => {
return err;
});
} else if (this.oplId != "") {
this.$API.opm.opl.update.req(this.oplId, this.form).then(() => {
this.$message.success("基本修改成功!");
this.issave = true;
this.active = 1;
this.getgasList();
this.getworkerList();
});
} else {
this.active = 1;
}
}
})
} else {
if (this.active==1){
if(this.apiworkerObj.length==0){
this.$message.warning("请添加作业人员");
return
}
}
this.active = 2;
}
// this.stepSuc.push(++this.active)
},
//选择人员后,调出该人员的所有证书
selectWorker() {
this.$API.hrm.certificate.list
.req({employee__user: this.formworker.worker, page: 0})
.then((res) => {
this.certificatesOptions = res;
console.log(res);
});
},
//作业人员列表
getworkerList() {
this.$API.opm.worker.list.req({opl: this.oplId, page: 0}).then((res) => {
this.apiworkerObj = res;
console.log(res);
});
},
//创建作业人员显示Form
addworker() {
this.workerdialog = true;
this.formworker = Object.assign({}, defaultformworker);
},
//删除作业人员
delWorker(row) {
this.$API.opm.worker.delete
.req(row.id)
.then((res) => {
this.$message.success("作业人员删除成功");
this.getworkerList()
return res;
})
.catch((err) => {
return err;
});
},
//提交作业人员信息
submitWorker() {
this.formworker.opl = this.oplId;
this.$refs.workerForm.validate(async (valid) => {
this.$API.opm.worker.create
.req(this.formworker)
.then((res) => {
this.$message.success("创建作业人员成功");
this.getworkerList();
this.workerdialog = false;
})
.catch((err) => {
return err;
});
});
},
//气体检测记录列表
getgasList() {
this.$API.opm.gas.list.req({opl: this.oplId, page: 0}).then((res) => {
this.apigasObj = res;
console.log(res);
});
},
//创建气体检测记录显示Form
addgas() {
this.gasdialog = true;
this.formgas = Object.assign({}, defaultformgas);
},
//提交气体检测记录
submitgas() {
this.formgas.opl = this.oplId;
this.$refs.gasForm.validate(async (valid) => {
this.$API.opm.gas.create
.req(this.formgas)
.then((res) => {
this.$message.success("创建气体检测记录成功");
this.getgasList();
this.gasdialog = false;
})
.catch((err) => {
return err;
});
});
},
//删除气体检测记录
delgas(row) {
this.$API.opm.gas.delete
.req(row.id)
.then((res) => {
this.$message.success("气体检测记录删除成功");
this.getgasList()
return res;
})
.catch((err) => {
return err;
});
},
//渲染工单提交按钮
getInit() {
this.$API.wf.workflow.initkey.req('opl_clear').then((res) => {
this.initForm = res;
});
},
//提交,创建工单
submitTicketCreate(id) {
let ticket = {};
ticket.workflow = this.initForm.workflow;
ticket.ticket_data = {opl: this.oplId};
ticket.transition = id;
ticket.title = this.form.name + '-申请';
this.tLoading = true
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.tLoading = false
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
},
//退出界面
submitOut() {
this.$router.push({
name: "opl",
query: {
id: this.operationId,//作业ID
},
});
}
},
};
</script>