From 39d90ac360f55f8835920c6e12e5cd1e4246bdcc Mon Sep 17 00:00:00 2001
From: Your Name <123456>
Date: 星期二, 05 七月 2022 19:18:34 +0800
Subject: [PATCH] '风险'

---
 src/views/specialWorkSystem/approvalProcess/approveProcessSetting/index.vue |   70 +++++++++++++++++++++++++++-------
 1 files changed, 55 insertions(+), 15 deletions(-)

diff --git a/src/views/specialWorkSystem/approvalProcess/approveProcessSetting/index.vue b/src/views/specialWorkSystem/approvalProcess/approveProcessSetting/index.vue
index 5d7eae9..33de449 100644
--- a/src/views/specialWorkSystem/approvalProcess/approveProcessSetting/index.vue
+++ b/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;

--
Gitblit v1.9.2