From b5069cc8ebdb8bc51f1b45f0c49a7e385490a32a Mon Sep 17 00:00:00 2001
From: Your Name <123456>
Date: 星期一, 04 七月 2022 11:17:28 +0800
Subject: [PATCH] Merge branch 'master' of https://sinanoaq.cn:8888/r/gtqt

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

diff --git a/src/views/specialWorkSystem/approvalProcess/approveProcessSetting/index.vue b/src/views/specialWorkSystem/approvalProcess/approveProcessSetting/index.vue
new file mode 100644
index 0000000..5d7eae9
--- /dev/null
+++ b/src/views/specialWorkSystem/approvalProcess/approveProcessSetting/index.vue
@@ -0,0 +1,246 @@
+<template>
+	<div class="home-container">
+		<div v-for="(item,index) in approveSteps" class="stepItem">
+			<div class="stepNum">{{index+1}}</div>
+			<div class="stepCard">
+				<el-card class="box-card" shadow="hover">
+					<template #header>
+						<div class="card-header">
+							<div>步骤<span>{{index+1}}</span></div>
+							<div>
+								<el-button type="primary" size="default" @click="addFlow(index)">新增</el-button>
+								<el-button type="danger" size="default" @click="deleteFlow(index)">删除</el-button>
+							</div>
+						</div>
+					</template>
+					<div class="text item">审批部门:<span>{{item.department}}</span></div>
+					<div class="text item">审批人员:<span>{{item.manager}}</span></div>
+					<div class="text item">其他参数:<span>{{item.others}}</span></div>
+				</el-card>
+			</div>
+		</div>
+		<el-row>
+			<el-button type="primary" @click="confirmEdit" size="default">确认</el-button>
+			<el-button @click="cancelEdit" size="default">取消</el-button>
+		</el-row>
+		<el-drawer v-model="showAdd" direction="rtl">
+			<template #title>
+				<h4>新增审批流</h4>
+			</template>
+			<template #default>
+				<el-form :model="addProgress" label-width="120px">
+					<el-form-item label="审批部门">
+						<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-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-input v-model="addProgress.others" />
+					</el-form-item>
+				</el-form>
+			</template>
+			<template #footer>
+				<div style="flex: auto">
+					<el-button type="primary" @click="confirmClick(ruleFormRef)" size="default">确认</el-button>
+					<el-button @click="cancelClick" size="default">取消</el-button>
+				</div>
+			</template>
+		</el-drawer>
+		<el-dialog v-model="deleteDialog" title="提示" width="30%" center>
+    		<span>您确定要删除该审批流吗?</span>
+			<template #footer>
+			  <span class="dialog-footer">
+				<el-button type="primary" @click="conFirmDelete" size="default">确认</el-button>
+			  	<el-button @click="deleteDialog = false" size="default">取消</el-button>
+			  </span>
+			</template>
+		</el-dialog>
+	</div>
+</template>
+
+<script lang="ts">
+	import { toRefs, reactive, defineComponent, ref } from 'vue';
+	import { storeToRefs } from 'pinia';
+	import { initBackEndControlRoutes } from '/@/router/backEnd';
+	import {useUserInfo} from "/@/stores/userInfo";
+	import { Session } from '/@/utils/storage';
+	import { ElMessage } from 'element-plus'
+	let global: any = {
+		homeChartOne: null,
+		homeChartTwo: null,
+		homeCharThree: null,
+		dispose: [null, '', undefined],
+	};
+
+	interface stateType {
+		homeOne: Array <type>
+	}
+	interface type {
+
+	}
+	export default defineComponent({
+		name: 'approveProcessSetting',
+		setup() {
+			const userInfo = useUserInfo()
+			const { userInfos } = storeToRefs(userInfo);
+			const approveSteps = [
+				{
+					department: '动土',
+					manager: '',
+					others: ''
+				},
+				{
+					department: '动土',
+					manager: '',
+					others: ''
+				},
+				{
+					department: '动土',
+					manager: '',
+					others: ''
+				}
+			];
+			const showAdd = ref(false)
+			const deleteDialog = ref(false)
+			const chosenIndex = ref('')
+			const addProgress = ref({
+				department: '',
+				manager: '',
+				others: ''
+			})
+			const confirmClick = () => {
+				approveSteps.splice(chosenIndex.value+1,0,addProgress.value)
+				addProgress.value = {
+					department: '',
+					manager: '',
+					others: ''
+				}
+				showAdd.value = false
+			}
+			const addFlow = (index) => {
+				showAdd.value = true
+				chosenIndex.value = index
+			}
+			const deleteFlow = (index) => {
+				if(approveSteps.length>1){
+					deleteDialog.value = true
+					chosenIndex.value = index
+				}else{
+					ElMessage({
+						message: '抱歉最后一条无法删除',
+						type: 'warning',
+					})
+				}
+			}
+			const conFirmDelete = () => {
+				const i = chosenIndex.value
+				approveSteps.splice( i,1)
+				deleteDialog.value = false
+			}
+			const cancelEdit = () => {
+
+			}
+			const confirmEdit = () =>{
+
+			}
+			const state  = reactive<stateType>({});
+			// 折线图
+			const renderMenu = async (value: string) => {
+				Session.set('projectId',value)
+				userInfos.value.projectId = value
+				await initBackEndControlRoutes();
+			};
+			return {
+				renderMenu,
+				showAdd,
+				approveSteps,
+				addProgress,
+				chosenIndex,
+				deleteDialog,
+				conFirmDelete,
+				deleteFlow,
+				addFlow,
+				confirmClick,
+				cancelEdit,
+				confirmEdit,
+				...toRefs(state),
+			};
+		},
+	});
+</script>
+
+<style scoped lang="scss">
+	$homeNavLengh: 8;
+	.home-container {
+		overflow: hidden;
+		padding: 80px;
+		.stepItem{
+			display: flex;
+			align-items: flex-start;
+			margin-bottom: 30px;
+			padding-bottom: 30px;
+			border-left: 2px solid #ccc;
+			&:last-of-type{
+				margin-bottom: 0;
+				border-left: none;
+			}
+			.stepNum {
+				width: 30px;
+				height: 30px;
+				border-radius: 15px;
+				box-sizing: border-box;
+				color: #333;
+				border: 2px solid #999;
+				line-height: 26px;
+				text-align: center;
+				margin-right: 40px;
+				margin-left: -16px;
+				margin-top: -30px;
+			}
+			.stepCard {
+				margin-top: -30px;
+
+				.box-card {
+					width: 480px;
+
+					.card-header {
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+
+						span{
+							font-weight: bold;
+							margin-left: 10px;
+						}
+					}
+
+					.text {
+						font-size: 14px;
+					}
+
+					.item {
+						margin-bottom: 18px;
+					}
+				}
+			}
+			&:hover .card-header{
+				color: #0098F5;
+			}
+			&:hover .stepNum{
+				border: 2px solid #0098F5;
+				color: #0098F5;
+			}
+		}
+
+		.el-form{
+			padding: 40px 20px;
+		}
+	}
+</style>

--
Gitblit v1.9.2