Default Changelist

Admin

2022-08-26 1229f3ec76bffe282d85b48daf0b32bc17022810

 src/views/specialWorkSystem/workApplyManage/workTicket/index.vue

@@ -1,659 +1,279 @@
<template>
   <div class="home-container">
      <div style="height: 100%">
      <el-form :model="form" label-width="150px" :rules="applyRules" ref="ruleFormRef2">
<!--         <blind-panel-form :bpForm="form.addForm" ref="additionalForm"></blind-panel-form>-->
<!--         <cut-line-form :clForm="form.addForm" ref="additionalForm"></cut-line-form>-->
<!--         <dirt-work-form :dwForm="form.addForm" ref="additionalForm"></dirt-work-form>-->
         <fire-work-form :fwForm="form.addForm" ref="additionalForm"></fire-work-form>
<!--         <hang-load-form :hlForm="form.addForm" ref="additionalForm"></hang-load-form>-->
<!--         <high-work-form :hwForm="form.addForm" ref="additionalForm"></high-work-form>-->
<!--         <limited-space-form :lsForm="form.addForm" ref="additionalForm"></limited-space-form>-->
<!--         <temp-elect-form :teForm="form.addForm" ref="additionalForm"></temp-elect-form>-->
         <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="unit" label="所属单位" width="180" />
                  <el-table-column prop="certificate" label="证书名称" width="180" />
                  <el-table-column prop="certificateId" label="证书号" />
                  <el-table-column fixed="right" label="操作" align="center" width="180">
                     <template #default="scope">
                        <el-button link type="danger" size="small" @click="deleteRow(scope.$index)">删除</el-button>
                     </template>
                  </el-table-column>
               </el-table>
            </el-col>
         </el-row>
         <el-row>
            <el-col :span="12">
               <el-form-item label="作业地点" prop="workLocation">
                  <el-input
                     v-model="form.workLocation"
                     placeholder="请输入"
                     class="input-with-select"
                  >
                     <template #append>
                        <el-button :icon="Search" />
                     </template>
                  </el-input>
               </el-form-item>
            </el-col>
            <el-col :span="12">
               <el-form-item label="作业期限" prop="workTimeLine">
                  <el-date-picker
                     v-model="form.workTimeLine"
                     type="daterange"
                     unlink-panels
                     range-separator="至"
                     start-placeholder="开始日期"
                     end-placeholder="结束日期"
                     :shortcuts="shortcuts"
                  />
               </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"
                     placeholder="请输入"
                     class="input-with-select"
                  >
                     <template #append>
                        <el-button :icon="Search" />
                     </template>
                  </el-input>
               </el-form-item>
            </el-col>
            <el-col :span="12">
               <el-form-item label="作业单位" prop="workUnit">
                  <el-input
                     v-model="form.workUnit"
                     placeholder="请输入"
                     class="input-with-select"
                  >
                     <template #append>选择作业单位</template>
                  </el-input>
               </el-form-item>
            </el-col>
         </el-row>
         <el-row>
            <el-col :span="8">
               <el-form-item label="作业负责人" prop="responsor">
                  <el-input
                     v-model="form.responsor"
                     placeholder="请输入"
                     class="input-with-select"
                  >
                     <template #append>
                        <el-button :icon="Search" />
                     </template>
                  </el-input>
               </el-form-item>
            </el-col>
            <el-col :span="8">
               <el-form-item label="监护人" prop="monitor">
                  <el-input
                     v-model="form.monitor"
                     placeholder="请输入"
                     class="input-with-select"
                  >
                     <template #append>
                        <el-button :icon="Search" />
                     </template>
                  </el-input>
               </el-form-item>
            </el-col>
            <el-col :span="8">
               <el-form-item label="监护人岗位" prop="monitorStation">
                  <el-input
                     v-model="form.monitorStation"
                     placeholder="请输入"
                     class="input-with-select"
                  >
                     <template #append>
                        <el-button :icon="Search" />
                     </template>
                  </el-input>
               </el-form-item>
            </el-col>
         </el-row>
         <el-row>
            <el-col :span="12">
               <el-form-item label="生产车间负责人" prop="workhouseLeader">
                  <el-input
                     v-model="form.workhouseLeader"
                     placeholder="请输入"
                     class="input-with-select"
                  >
                     <template #append>
                        <el-button :icon="Search" />
                     </template>
                  </el-input>
               </el-form-item>
            </el-col>
            <el-col :span="12">
               <el-form-item label="申请日期" prop="applyDate">
                  <el-date-picker
                     size="large"
                     v-model="form.applyDate"
                     type="date"
                     placeholder="请选择"
                     style="width: 100%"
                  ></el-date-picker>
               </el-form-item>
            </el-col>
         </el-row>
         </div>
         <div class="homeCard">
         <el-row>
            <el-col :span="24">
               <el-form-item label="涉及的其他特殊作业" prop="otherSpecialWorks">
                  <el-checkbox-group v-model="form.otherSpecialWorks">
                     <el-checkbox label="动火作业" />
                     <el-checkbox label="受限空间" />
                     <el-checkbox label="高处作业" />
                     <el-checkbox label="吊装作业" />
                     <el-checkbox label="临时用电" />
                     <el-checkbox label="设备检修" />
                     <el-checkbox label="盲板抽堵" />
                     <el-checkbox label="断路作业" />
                     <el-checkbox label="动土作业" />
                  </el-checkbox-group>
               </el-form-item>
            </el-col>
         </el-row>
         <el-row>
            <el-col>
               <el-form-item label="防护用品" prop="protections">
                  <el-cascader
                     v-model="form.protections"
                     :options="protectOption"
                     :props="{expandTrigger: 'hover'}"
                     @change="protectionsChange"
                     placeholder="请选择"
                     style="width: 100%"
                  />
               </el-form-item>
            </el-col>
         </el-row>
         <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="实施安全教育人" prop="safetyMan">
                  <el-input
                     v-model="form.safetyMan"
                     placeholder="请输入"
                     class="input-with-select"
                  >
                     <template #append>
                        <el-button :icon="Search"/>
                     </template>
                  </el-input>
               </el-form-item>
            </el-col>
            <el-col :span="12">
               <el-form-item label="被教育人" prop="educated">
                  <el-input
                     v-model="form.educated"
                     placeholder="请输入"
                     class="input-with-select"
                  >
                     <template #append>
                        <el-button :icon="Search" />
                     </template>
                  </el-input>
               </el-form-item>
            </el-col>
         </el-row>
         </div>
         </div>
      </el-form>
      <div class="applyBtn">
         <el-button type="primary" size="large" plain @click="handleApply(ruleFormRef2)">发起申请</el-button>
      </div>
      <el-dialog v-model="dialogAddWorker" title="添加作业人">
         <el-form :model="addWorkerForm" label-width="120px" :rules="addWorkerRules" ref='ruleFormRef3'>
            <el-form-item label="作业人" prop="worker">
               <el-input
                     v-model="addWorkerForm.worker"
                     placeholder="请输入"
                     class="input-with-select"
               >
                  <template #append>
                     <el-button :icon="Search" />
                  </template>
               </el-input>
            </el-form-item>
            <el-form-item label="作业人角色" prop="role">
               <el-input
                     v-model="addWorkerForm.role"
                     placeholder="请输入"
                     class="input-with-select"
               >
                  <template #append>
                     <el-button :icon="Search" />
                  </template>
               </el-input>
            </el-form-item>
            <el-form-item label="作业人角色" prop="unit">
               <el-input
                     v-model="addWorkerForm.unit"
                     placeholder="请输入"
                     class="input-with-select"
               >
                  <template #append>
                     <el-button :icon="Search" />
                  </template>
               </el-input>
            </el-form-item>
            <el-form-item label="证书名称" prop="certificate">
               <el-input
                     v-model="addWorkerForm.certificate"
                     placeholder="请输入"
                     class="input-with-select"
               >
                  <template #append>
                     <el-button :icon="Search" />
                  </template>
               </el-input>
            </el-form-item>
            <el-form-item label="证书号" prop="certificateId">
               <el-input
                     v-model="addWorkerForm.certificateId"
                     placeholder="请输入"
                     class="input-with-select"
               >
                  <template #append>
                     <el-button :icon="Search" />
                  </template>
               </el-input>
            </el-form-item>
            <el-form-item>
               <el-button type="primary" @click="onSubmitAddForm(ruleFormRef3)" size="default">确认</el-button>
               <el-button size="default" @click="cancleAdd">取消</el-button>
            </el-form-item>
         </el-form>
      </el-dialog>
      <el-dialog v-model="dialogAddFile" title="安全交底和风险告知">
         <el-form :model="saftyFileForm" label-width="0" ref="ruleFormRef" :rules="saftyFileRules">
            <el-form-item label="" prop="surrounding">
               <div>1.作业许可范围及作业环境：</div>
               <el-input
                     v-model="saftyFileForm.surrounding"
                     :rows="2"
                     type="textarea"
                     placeholder="请输入"
               />
            </el-form-item>
            <el-form-item label="" prop="risk">
               <div>2.作业风险：</div>
               <el-input
                     v-model="saftyFileForm.risk"
                     :rows="2"
                     type="textarea"
                     placeholder="请输入"
               />
            </el-form-item>
            <el-form-item label="" prop="protection">
               <div>3.防范措施（工艺、设备、个体防护等）:</div>
               <el-input
                     v-model="saftyFileForm.protection"
                     :rows="2"
                     type="textarea"
                     placeholder="请输入"
               />
            </el-form-item>
            <el-form-item label="" prop="emergency">
               <div>4.应急措施:</div>
               <el-input
                     v-model="saftyFileForm.emergency"
                     :rows="2"
                     type="textarea"
                     placeholder="请输入"
               />
            </el-form-item>
            <el-form-item label="" prop="otherStuff">
               <div>5.其他注意事项:</div>
               <el-input
                     v-model="saftyFileForm.otherStuff"
                     :rows="2"
                     type="textarea"
                     placeholder="请输入"
               />
            </el-form-item>
            <el-form-item>
               <el-button type="primary" @click="onSubmitAddFile(ruleFormRef)" size="default">确认</el-button>
               <el-button size="default" @click="cancleAddFile">取消</el-button>
            </el-form-item>
         </el-form>
      </el-dialog>
   </div>
   </div>
    <div class="home-container">
        <div style="height: 100%">
            <el-form :model="form" label-width="120px" :rules="applyRules" ref="ruleFormRef">
                <div class="homeCard">
                    <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.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="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-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-row>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="作业内容" prop="workContent">
                                <el-input v-model="form.workContent" autosize type="textarea" placeholder="请输入作业内容" />
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="作业地址" prop="workLocation">
                                <el-input v-model="form.workLocation" autosize 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 type="textarea" placeholder="请输入动火方式" />
                            </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.value" />
                                </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>
    </div>
</template>

<script lang="ts">
   import { toRefs, reactive, defineComponent, ref, defineAsyncComponent } from 'vue';
   import { storeToRefs } from 'pinia';
   import { initBackEndControlRoutes } from '/@/router/backEnd';
   import {useUserInfo} from "/@/stores/userInfo";
   import { Session } from '/@/utils/storage';
   import { Search } from '@element-plus/icons-vue'
   import { ElMessage } from 'element-plus'
   import type { FormInstance, FormRules } from 'element-plus'
   let global: any = {
      homeChartOne: null,
      homeChartTwo: null,
      homeCharThree: null,
      dispose: [null, '', undefined],
   };
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 } from '@element-plus/icons-vue';
import { ElMessage } from 'element-plus';
import type { FormInstance, FormRules } from 'element-plus';
import { workApplyApi } from '/@/api/specialWorkSystem/workApply';

   interface stateType {
      homeOne: Array <type>
   }
   interface type {
interface stateType {
    form: Object;
    workerList: Array<any>;
    workTypeList: Array<any>;
    workLevelList: Array<any>;
    otherWorkList: Array<any>;
}
export default defineComponent({
    name: 'workTicket',
    components: {},
    setup() {
        const userInfo = useUserInfo();
        const { userInfos } = storeToRefs(userInfo);
        const state = reactive<stateType>({
            form: {
                operatorUids: [],
                workType: 1,
                workLevel: null,
                workContent: '',
                workLocation: '',
                workDetail: {
                    hotMethod: '',
                    otherSpecialWork: []
                },
                workTimeLine: [],
                expStartTime: '',
                expEndTime: ''
            },
            workerList: [
                {
                    label: '张三',
                    value: 53
                },
                {
                    label: '李四',
                    value: 54
                },
                {
                    label: '测试一',
                    value: 55
                },
                {
                    label: '测试二',
                    value: 56
                }
            ],
            workTypeList: [
                {
                    label: '类型一',
                    value: 1
                },
                {
                    label: '类型二',
                    value: 2
                }
            ],
            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
                }
            ]
        });
        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' }],
            workTimeLine: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
            'workDetail.hotMethod': [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
            'workDetail.otherSpecialWork': [{ required: true, message: '该内容不能为空', trigger: 'blur' }]
        });
        const submitForm = async (formEl: FormInstance | undefined) => {
            if (!formEl) return;
            await formEl.validate(async (valid, fields) => {
                if (valid) {
                    state.form.expStartTime = JSON.parse(JSON.stringify(state.form.workTimeLine))[0];
                    state.form.expEndTime = JSON.parse(JSON.stringify(state.form.workTimeLine))[1];
                    let { workTimeLine, ...data } = JSON.parse(JSON.stringify(state.form));
                    data.workDetail.otherSpecialWork = data.workDetail.otherSpecialWork.join(',');
                    console.log(data, 'data');
                    const res = await workApplyApi().postFireApply(data);
                    if (res.data.code === '200') {
                        ElMessage({
                            type: 'success',
                            message: '提交成功！'
                        });
                        formEl.resetFields();
                    } else {
                        ElMessage({
                            type: 'warning',
                            message: res.data.msg
                        });
                    }
                } else {
                    console.log('error submit!', fields);
                }
            });
        };
        // 折线图
        const renderMenu = async (value: string) => {
            Session.set('projectId', value);
            userInfos.value.projectId = value;
            await initBackEndControlRoutes();
        };

   }
   export default defineComponent({
      name: 'workApplyForm',
      components: {
         fireWorkForm: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workApplyManage/workApplyForm/components/fireWorkForm.vue')),
         limitedSpaceForm: defineAsyncComponent(() => import('/@/views/specialWorkSystem/workApplyManage/workApplyForm/components/limitedSpaceForm.vue')),
         hangLoadForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManage/workApplyForm/components/hangLoadForm.vue')),
         dirtWorkForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManage/workApplyForm/components/dirtWorkForm.vue')),
         cutLineForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManage/workApplyForm/components/cutLineForm.vue')),
         highWorkForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManage/workApplyForm/components/highWorkForm.vue')),
         tempElectForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManage/workApplyForm/components/tempElectForm.vue')),
         blindPanelForm: defineAsyncComponent(()=> import('/@/views/specialWorkSystem/workApplyManage/workApplyForm/components/blindPanelForm.vue'))
      },
      setup() {
         const userInfo = useUserInfo()
         const { userInfos } = storeToRefs(userInfo);
         const state  = reactive<stateType>({
            homeOne:[{id:1,name:'安全基础信息系统'},{id:2,name:'双重预防系统'},{id:3,name:'系统2'},{id:4,name:'系统3'},{id:5,name:'系统4'}],
         });
         const form = reactive({
            addForm: {},
            workerList: [],
            workLocation: '',
            workTimeLine: '',
            workContent: '',
            workUnit: '',
            responsor: '',
            monitor: '',
            workMonitor: '',
            monitorStation: '',
            workhouseLeader: '',
            applyDate: '',
            otherSpecialWorks: [],
            protections: '',
            saftyFile: {},
            safetyMan: '',
            educated: ''
         })
         const dialogAddWorker = ref(false)
         const dialogAddFile = ref(false)
         const addWorkerForm = ref({
            worker: '',
            role: '',
            unit: '',
            certificate: '',
            certificateId: ''
         })
         const saftyFileForm = reactive({
            surrounding: '',
            risk: '',
            protection: '',
            emergency: '',
            otherStuff: ''
         })
         const shortcuts = [
            {
               text: 'Last week',
               value: () => {
                  const end = new Date()
                  const start = new Date()
                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
                  return [start, end]
               },
            },
            {
               text: 'Last month',
               value: () => {
                  const end = new Date()
                  const start = new Date()
                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
                  return [start, end]
               },
            },
            {
               text: 'Last 3 months',
               value: () => {
                  const end = new Date()
                  const start = new Date()
                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
                  return [start, end]
               },
            },
         ]
         const protectOption = [
            {
               value: 'guide',
               label: 'Guide',
               children: [
                  {
                     value: 'disciplines',
                     label: 'Disciplines',
                     children: [
                        {
                           value: 'consistency',
                           label: 'Consistency',
                        },
                        {
                           value: 'feedback',
                           label: 'Feedback',
                        }
                     ],
                  },
                  {
                     value: 'navigation',
                     label: 'Navigation',
                     children: [
                        {
                           value: 'side nav',
                           label: 'Side Navigation',
                        }
                     ],
                  },
               ],
            }
         ]
         const ruleFormRef = ref<FormInstance>()
         const ruleFormRef2 = ref<FormInstance>()
         const ruleFormRef3 = ref<FormInstance>()
         const applyRules = reactive<FormRules>({
            extraForm: [{type: 'object', required: true,message: '此处不能为空'}],
            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: [{type: 'array', 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: '该选项不能为空'}],
            protection: [{required: true,message: '该选项不能为空'} ],
            emergency: [{required: true,message: '该选项不能为空'} ]
         })
         const protectionsChange = (value) => {
            console.log(value)
         }

         const onSubmitAddForm = async (formEl: FormInstance | undefined) => {
            if (!formEl) return
            await formEl.validate((valid, fields) => {
               if (valid) {
                  form.workerList.unshift(addWorkerForm.value)
                  addWorkerForm.value = {
                     worker: '',
                     role: '',
                     unit: '',
                     certificate: '',
                     certificateId: ''
                  }
                  dialogAddWorker.value = false
               } else {
                  console.log('error submit!', fields)
               }
            })
         }
         const onSubmitAddFile = () =>{

         }
         const cancleAdd = ()=> {
            addWorkerForm.value = {
               worker: '',
               role: '',
               unit: '',
               certificate: '',
               certificateId: ''
            }
            dialogAddWorker.value = false
         }
         const cancleAddFile = ()=>{

         }
         const deleteRow = (index) =>{
            form.workerList.splice( index,1)
         }
         const isValid = ref(false)
         const additionalForm = ref(null)
         const handleApply = async (formEl: FormInstance | undefined) =>{
            if (!formEl) return
            const flag = additionalForm.value.validateForm()
            await flag.then((res)=>{
               isValid.value = res
            })
            await formEl.validate((valid, fields) => {
               console.log(valid,'and',isValid.value)
               if (valid && isValid.value) {
                  console.log('submit',form,fields)
                  ElMessage({
                     message: '提交成功！',
                     type: 'success',
                  })
               } else {
                  // console.log('error submit!',form,fields)
                  ElMessage({
                     message: '表单未填写完整',
                     type: 'error',
                  })
               }
            })

         }
         // 折线图
         const renderMenu = async (value: string) => {
            Session.set('projectId',value)
            userInfos.value.projectId = value
            await initBackEndControlRoutes();
         };
         return {
            renderMenu,
            form,
            Search,
            shortcuts,
            protectOption,
            dialogAddWorker,
            dialogAddFile,
            addWorkerForm,
            saftyFileForm,
            ruleFormRef,
            ruleFormRef2,
            ruleFormRef3,
            additionalForm,
            addWorkerRules,
            saftyFileRules,
            applyRules,
            isValid,
            handleApply,
            cancleAddFile,
            deleteRow,
            cancleAdd,
            onSubmitAddForm,
            onSubmitAddFile,
            protectionsChange,
            ...toRefs(state),
         };
      },
   });
        return {
            renderMenu,
            Search,
            ruleFormRef,
            applyRules,
            submitForm,
            ...toRefs(state)
        };
    }
});
</script>

<style scoped lang="scss">
   .home-container {
      height: 100%;
      overflow: hidden;
      position: relative;
      .homeCard{
         width: 100%;
         padding: 20px;
         box-sizing: border-box;
         background: #fff;
         border-radius: 4px;
         margin-bottom: 20px;
      }
      .applyBtn{
         width: 100%;
         background: #fff;
         height: 80px;
         z-index: 5;
         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;
      }
   }
.home-container {
    height: 100%;
    overflow: hidden;
    position: relative;
    .homeCard {
        width: 100%;
        padding: 20px;
        box-sizing: border-box;
        background: #fff;
        border-radius: 4px;
        margin-bottom: 20px;
    }
    .applyBtn {
        width: 100%;
        background: #fff;
        height: 80px;
        z-index: 5;
        box-shadow: 0 -3px 8px rgba(150, 150, 150, 0.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;
    }
}
</style>