Your Name
2022-07-05 39d90ac360f55f8835920c6e12e5cd1e4246bdcc
src/views/specialWorkSystem/approvalProcess/approveProcessSetting/index.vue
@@ -1,5 +1,8 @@
<template>
   <div class="home-container">
      <el-scrollbar height="100%">
      <div class="homeCard">
      <div>
      <div v-for="(item,index) in approveSteps" class="stepItem">
         <div class="stepNum">{{index+1}}</div>
         <div class="stepCard">
@@ -19,29 +22,31 @@
            </el-card>
         </div>
      </div>
      </div>
      <el-row>
         <el-button type="primary" @click="confirmEdit" size="default">确认</el-button>
         <el-button @click="cancelEdit" size="default">取消</el-button>
         <el-button type="primary" @click="confirmEdit" size="large">确认</el-button>
         <el-button @click="cancelEdit" size="large">取消</el-button>
      </el-row>
      <el-drawer v-model="showAdd" direction="rtl">
      </div>
      <el-drawer v-model="showAdd" direction="rtl" @close="colseDrawer">
         <template #title>
            <h4>新增审批流</h4>
         </template>
         <template #default>
            <el-form :model="addProgress" label-width="120px">
               <el-form-item label="审批部门">
            <el-form :model="addProgress" label-width="120px" ref="ruleFormRef" :rules="ProgressRules">
               <el-form-item label="审批部门" prop="department">
                  <el-select v-model="addProgress.department" placeholder="请选择审批部门">
                     <el-option label="动土" value="动土" />
                     <el-option label="动火" value="动火" />
                  </el-select>
               </el-form-item>
               <el-form-item label="审批人员">
               <el-form-item label="审批人员" prop="manager">
                  <el-select v-model="addProgress.manager" placeholder="请选择审批人员">
                     <el-option label="人员1" value="人员1" />
                     <el-option label="人员2" value="人员2" />
                  </el-select>
               </el-form-item>
               <el-form-item label="其他参数">
               <el-form-item label="其他参数" prop="others">
                  <el-input v-model="addProgress.others" />
               </el-form-item>
            </el-form>
@@ -62,6 +67,7 @@
           </span>
         </template>
      </el-dialog>
   </el-scrollbar>
   </div>
</template>
@@ -72,6 +78,7 @@
   import {useUserInfo} from "/@/stores/userInfo";
   import { Session } from '/@/utils/storage';
   import { ElMessage } from 'element-plus'
   import type { FormInstance, FormRules } from 'element-plus'
   let global: any = {
      homeChartOne: null,
      homeChartTwo: null,
@@ -115,13 +122,24 @@
            manager: '',
            others: ''
         })
         const confirmClick = () => {
            approveSteps.splice(chosenIndex.value+1,0,addProgress.value)
            addProgress.value = {
               department: '',
               manager: '',
               others: ''
            }
         const ruleFormRef = ref<FormInstance>()
         const ProgressRules = reactive<FormRules>({
            department: [{required:true,message: '该选项不能为空',trigger: 'blur'}],
            manager: [{required:true,message: '该选项不能为空',trigger: 'blur'}]
         })
         const confirmClick = async (formEl: FormInstance | undefined) => {
            if (!formEl) return
            await formEl.validate((valid, fields) => {
               if (valid) {
                  approveSteps.splice(chosenIndex.value+1,0,addProgress.value)
                  showAdd.value = false
               } else {
                  console.log('error submit!', fields)
               }
            })
         }
         const cancelClick=()=>{
            showAdd.value = false
         }
         const addFlow = (index) => {
@@ -144,6 +162,13 @@
            approveSteps.splice( i,1)
            deleteDialog.value = false
         }
         const colseDrawer = ()=>{
            addProgress.value = {
               department: '',
               manager: '',
               others: ''
            }
         }
         const cancelEdit = () => {
         }
@@ -162,9 +187,13 @@
            showAdd,
            approveSteps,
            addProgress,
            ruleFormRef,
            ProgressRules,
            chosenIndex,
            deleteDialog,
            colseDrawer,
            conFirmDelete,
            cancelClick,
            deleteFlow,
            addFlow,
            confirmClick,
@@ -179,14 +208,25 @@
<style scoped lang="scss">
   $homeNavLengh: 8;
   .home-container {
      height: 100%;
      overflow: hidden;
      padding: 80px;
      padding: 20px;
      .homeCard{
         width: 100%;
         padding: 20px;
         background: #fff;
         border-radius: 4px;
      }
      .stepItem{
         display: flex;
         align-items: flex-start;
         margin-bottom: 30px;
         margin-left: 30px;
         padding-bottom: 30px;
         border-left: 2px solid #ccc;
         &:first-of-type{
            margin-top: 30px;
         }
         &:last-of-type{
            margin-bottom: 0;
            border-left: none;