From eb706c505406a6a38ca396ad73262f364badea7e Mon Sep 17 00:00:00 2001
From: Admin <978517621@qq.com>
Date: Thu, 07 Jul 2022 18:05:13 +0800
Subject: [PATCH] 添加页面组件
---
src/views/specialWorkSystem/workApplyManagement/workApplyForm/index.vue | 162 ++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 115 insertions(+), 47 deletions(-)
diff --git a/src/views/specialWorkSystem/workApplyManagement/workApply/index.vue b/src/views/specialWorkSystem/workApplyManagement/workApplyForm/index.vue
similarity index 72%
rename from src/views/specialWorkSystem/workApplyManagement/workApply/index.vue
rename to src/views/specialWorkSystem/workApplyManagement/workApplyForm/index.vue
index 09e11a7..42b3dff 100644
--- a/src/views/specialWorkSystem/workApplyManagement/workApply/index.vue
+++ b/src/views/specialWorkSystem/workApplyManagement/workApplyForm/index.vue
@@ -1,8 +1,9 @@
<template>
<div class="home-container">
<el-scrollbar height="100%">
- <div class="homeCard">
- <el-form :model="form" label-width="150px">
+ <el-form :model="form" label-width="150px" :rules="applyRules" ref="ruleFormRef2">
+<!-- <blind-panel-form></blind-panel-form>-->
+ <div class="homeCard">
<el-row>
<el-col :span="8">
<el-form-item label="申请部门">
@@ -54,13 +55,15 @@
</el-form-item>
</el-col>
</el-row>
+ </div>
+ <div class="homeCard">
<el-row>
<el-col :span="3"><el-button type="primary" size="default" @click="dialogAddWorker = true">添加作业人</el-button></el-col>
<el-col :span="21">
<el-table :data="form.workerList" style="width: 100%">
<el-table-column type="index" label="序号" width="100"/>
<el-table-column prop="worker" label="作业人"/>
- <el-table-column prop="role" label="作业人角色" width="180" />
+ <el-table-column prop="role" label="作业人角色" width="180"/>
<el-table-column prop="unit" label="所属单位" width="180" />
<el-table-column prop="certificate" label="证书名称" width="180" />
<el-table-column prop="certificateId" label="证书号" />
@@ -74,7 +77,7 @@
</el-row>
<el-row>
<el-col :span="12">
- <el-form-item label="作业地点">
+ <el-form-item label="作业地点" prop="workLocation">
<el-input
v-model="form.workLocation"
placeholder="请输入"
@@ -87,7 +90,7 @@
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="作业期限">
+ <el-form-item label="作业期限" prop="workTimeLine">
<el-date-picker
v-model="form.workTimeLine"
type="daterange"
@@ -102,7 +105,7 @@
</el-row>
<el-row>
<el-col :span="12">
- <el-form-item label="作业内容">
+ <el-form-item label="作业内容" prop="workContent">
<el-input
v-model="form.workContent"
placeholder="请输入"
@@ -115,7 +118,7 @@
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="作业单位">
+ <el-form-item label="作业单位" prop="workUnit">
<el-input
v-model="form.workUnit"
placeholder="请输入"
@@ -128,9 +131,9 @@
</el-row>
<el-row>
<el-col :span="6">
- <el-form-item label="作业负责人">
+ <el-form-item label="作业负责人" prop="responsor">
<el-input
- v-model="form.responser"
+ v-model="form.responsor"
placeholder="请输入"
class="input-with-select"
>
@@ -141,7 +144,7 @@
</el-form-item>
</el-col>
<el-col :span="6">
- <el-form-item label="监护人">
+ <el-form-item label="监护人" prop="monitor">
<el-input
v-model="form.monitor"
placeholder="请输入"
@@ -154,7 +157,7 @@
</el-form-item>
</el-col>
<el-col :span="6">
- <el-form-item label="监护人岗位">
+ <el-form-item label="监护人岗位" prop="monitorStation">
<el-input
v-model="form.monitorStation"
placeholder="请输入"
@@ -169,7 +172,7 @@
</el-row>
<el-row>
<el-col :span="12">
- <el-form-item label="生产车间负责人">
+ <el-form-item label="生产车间负责人" prop="workhouseLeader">
<el-input
v-model="form.workhouseLeader"
placeholder="请输入"
@@ -182,7 +185,7 @@
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="申请日期">
+ <el-form-item label="申请日期" prop="applyDate">
<el-date-picker
size="large"
v-model="form.applyDate"
@@ -193,10 +196,11 @@
</el-form-item>
</el-col>
</el-row>
- <el-divider />
+ </div>
+ <div class="homeCard">
<el-row>
<el-col :span="24">
- <el-form-item label="涉及的其他特殊作业">
+ <el-form-item label="涉及的其他特殊作业" prop="otherSpecialWorks">
<el-checkbox-group v-model="form.otherSpecialWorks">
<el-checkbox label="动火作业" />
<el-checkbox label="受限空间" />
@@ -213,7 +217,7 @@
</el-row>
<el-row>
<el-col>
- <el-form-item label="防护用品">
+ <el-form-item label="防护用品" prop="protections">
<el-cascader
v-model="form.protections"
:options="protectOption"
@@ -225,25 +229,25 @@
</el-form-item>
</el-col>
</el-row>
- <el-row>
- <el-col :span="6"><el-button type="primary" size="default" @click="dialogAddFile = true">点击添加安全交底和风险告知书</el-button></el-col>
+ <el-row style="justify-content: center">
+ <el-button type="primary" size="default" @click="dialogAddFile = true">点击添加安全交底和风险告知书</el-button>
</el-row>
<el-row>
<el-col :span="12">
- <el-form-item label="实施安全教育人">
+ <el-form-item label="实施安全教育人" prop="safetyMan">
<el-input
v-model="form.safetyMan"
placeholder="请输入"
class="input-with-select"
>
<template #append>
- <el-button :icon="Search" />
+ <el-button :icon="Search"/>
</template>
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
- <el-form-item label="被教育人">
+ <el-form-item label="被教育人" prop="educated">
<el-input
v-model="form.educated"
placeholder="请输入"
@@ -256,17 +260,18 @@
</el-form-item>
</el-col>
</el-row>
- <el-divider />
+ </div>
+ <div class="homeCard applyBtn">
<el-row>
<el-col :span="24" class="submitBtn">
- <el-button type="primary" size="large" plain>发起申请</el-button>
+ <el-button type="primary" size="large" plain @click="handleApply(ruleFormRef2)">发起申请</el-button>
</el-col>
</el-row>
+ </div>
</el-form>
- </div>
<el-dialog v-model="dialogAddWorker" title="添加作业人">
- <el-form :model="addWorkerForm" label-width="120px">
- <el-form-item label="作业人">
+ <el-form :model="addWorkerForm" label-width="120px" :rules="addWorkerRules" ref='ruleFormRef3'>
+ <el-form-item label="作业人" prop="worker">
<el-input
v-model="addWorkerForm.worker"
placeholder="请输入"
@@ -277,7 +282,7 @@
</template>
</el-input>
</el-form-item>
- <el-form-item label="作业人角色">
+ <el-form-item label="作业人角色" prop="role">
<el-input
v-model="addWorkerForm.role"
placeholder="请输入"
@@ -288,7 +293,7 @@
</template>
</el-input>
</el-form-item>
- <el-form-item label="作业人角色">
+ <el-form-item label="作业人角色" prop="unit">
<el-input
v-model="addWorkerForm.unit"
placeholder="请输入"
@@ -299,7 +304,7 @@
</template>
</el-input>
</el-form-item>
- <el-form-item label="证书名称">
+ <el-form-item label="证书名称" prop="certificate">
<el-input
v-model="addWorkerForm.certificate"
placeholder="请输入"
@@ -310,7 +315,7 @@
</template>
</el-input>
</el-form-item>
- <el-form-item label="证书号">
+ <el-form-item label="证书号" prop="certificateId">
<el-input
v-model="addWorkerForm.certificateId"
placeholder="请输入"
@@ -385,7 +390,7 @@
</template>
<script lang="ts">
- import { toRefs, reactive, defineComponent, ref } from 'vue';
+ import { toRefs, reactive, defineComponent, ref, defineAsyncComponent } from 'vue';
import { storeToRefs } from 'pinia';
import { initBackEndControlRoutes } from '/@/router/backEnd';
import {useUserInfo} from "/@/stores/userInfo";
@@ -406,7 +411,17 @@
}
export default defineComponent({
- name: 'workApply',
+ name: 'workApplyForm',
+ components: {
+ fireWorkForm: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workApplyManagement/workApplyForm/components/fireWorkForm.vue')),
+ limitedSpaceForm: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workApplyManagement/workApplyForm/components/limitedSpaceForm.vue')),
+ hangLoadForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManagement/workApplyForm/components/hangLoadForm.vue')),
+ dirtWorkForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManagement/workApplyForm/components/dirtWorkForm.vue')),
+ cutLineForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManagement/workApplyForm/components/cutLineForm.vue')),
+ highWorkForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManagement/workApplyForm/components/highWorkForm.vue')),
+ tempElectForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManagement/workApplyForm/components/tempElectForm.vue')),
+ blindPanelForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManagement/workApplyForm/components/blindPanelForm.vue'))
+ },
setup() {
const userInfo = useUserInfo()
const { userInfos } = storeToRefs(userInfo);
@@ -424,7 +439,7 @@
workTimeLine: '',
workContent: '',
workUnit: '',
- responser: '',
+ responsor: '',
monitor: '',
workMonitor: '',
monitorStation: '',
@@ -514,6 +529,31 @@
}
]
const ruleFormRef = ref<FormInstance>()
+ const ruleFormRef2 = ref<FormInstance>()
+ const ruleFormRef3 = ref<FormInstance>()
+ const applyRules = reactive<FormRules>({
+ workLocation: [{required: true,message: '此处不能为空'}],
+ workTimeLine: [{required: true,message: '此处不能为空'}],
+ workContent: [{required: true,message: '此处不能为空'}],
+ workUnit: [{required: true,message: '此处不能为空'}],
+ responsor: [{required: true,message: '此处不能为空'}],
+ monitor: [{required: true,message: '此处不能为空'}],
+ workMonitor: [{required: true,message: '此处不能为空'}],
+ monitorStation: [{required: true,message: '此处不能为空'}],
+ workhouseLeader: [{required: true,message: '此处不能为空'}],
+ applyDate: [{required: true,message: '此处不能为空'}],
+ otherSpecialWorks: [{required: true,message: '此处不能为空'}],
+ protections: [{required: true,message: '此处不能为空'}],
+ safetyMan: [{required: true,message: '此处不能为空'}],
+ educated: [{required: true,message: '此处不能为空'}]
+ })
+ const addWorkerRules = reactive<FormRules>({
+ worker: [{required: true,message: '此处不能为空'}],
+ role: [{required: true,message: '此处不能为空'}],
+ unit: [{required: true,message: '此处不能为空'}],
+ certificate: [{required: true,message: '此处不能为空'}],
+ certificateId: [{required: true,message: '此处不能为空'}]
+ })
const saftyFileRules = reactive<FormRules>({
surrounding: [{required: true,message: '该选项不能为空'}],
risk: [{required: true,message: '该选项不能为空'}],
@@ -524,16 +564,23 @@
console.log(value)
}
- const onSubmitAddForm = () => {
- form.workerList.push(addWorkerForm.value)
- addWorkerForm.value = {
- worker: '',
- role: '',
- unit: '',
- certificate: '',
- certificateId: ''
- }
- dialogAddWorker.value = false
+ const onSubmitAddForm = async (formEl: FormInstance | undefined) => {
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ form.workerList.push(addWorkerForm.value)
+ addWorkerForm.value = {
+ worker: '',
+ role: '',
+ unit: '',
+ certificate: '',
+ certificateId: ''
+ }
+ dialogAddWorker.value = false
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
}
const onSubmitAddFile = () =>{
@@ -554,6 +601,16 @@
const deleteRow = (index) =>{
form.workerList.splice( index,1)
}
+ const handleApply = async (formEl: FormInstance | undefined) =>{
+ if (!formEl) return
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ console.log('submit!')
+ } else {
+ console.log('error submit!', fields)
+ }
+ })
+ }
// 折线图
const renderMenu = async (value: string) => {
Session.set('projectId',value)
@@ -571,7 +628,12 @@
addWorkerForm,
saftyFileForm,
ruleFormRef,
+ ruleFormRef2,
+ ruleFormRef3,
+ addWorkerRules,
saftyFileRules,
+ applyRules,
+ handleApply,
cancleAddFile,
deleteRow,
cancleAdd,
@@ -589,21 +651,27 @@
height: 100%;
overflow: hidden;
padding: 20px;
+ position: relative;
.homeCard{
width: 100%;
padding: 20px;
background: #fff;
border-radius: 4px;
+ margin-bottom: 20px;
+ }
+ .applyBtn{
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ margin-bottom: 0;
+ border-radius: 0;
+ box-shadow: 0 -3px 8px rgba(150,150,150,.1);
}
.el-row{
margin-bottom: 20px;
}
.el-row:last-child {
margin-bottom: 0;
- }
- .el-col{
- align-items: center;
- margin-bottom: 10px;
}
.el-input{
width: 100% !important;
--
Gitblit v1.9.2