From 37446a46b11fcf43b3d117301f521968701d1164 Mon Sep 17 00:00:00 2001
From: Admin <978517621@qq.com>
Date: 星期五, 19 八月 2022 16:40:46 +0800
Subject: [PATCH] Default Changelist

---
 src/views/specialWorkSystem/workApplyManage/myJobApply/index.vue |  753 ++++++++++++++++++++++++++++++++++++++++++++++-----------
 1 files changed, 599 insertions(+), 154 deletions(-)

diff --git a/src/views/specialWorkSystem/workApplyManage/myJobApply/index.vue b/src/views/specialWorkSystem/workApplyManage/myJobApply/index.vue
index 390f236..7a1a175 100644
--- a/src/views/specialWorkSystem/workApplyManage/myJobApply/index.vue
+++ b/src/views/specialWorkSystem/workApplyManage/myJobApply/index.vue
@@ -1,7 +1,7 @@
 <template>
 	<div class="home-container">
 		<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
-			<el-tab-pane label="申请中" name="Applying">
+			<el-tab-pane label="申请中" name="1">
 				<div style="height: 100%">
 					<el-row class="homeCard">
 							<el-col :span="8">
@@ -16,11 +16,11 @@
 						<div class="main-card">
 							<el-row class="cardTop">
 								<el-col :span="12" class="mainCardBtn">
-									<el-button type="primary" :icon="Plus" size="default">申请</el-button>
+									<el-button type="primary" :icon="Plus" size="default" @click="toApply()">申请</el-button>
 <!--									<el-button type="danger" :icon="Delete" size="default">删除</el-button>-->
 <!--									<el-button type="success" size="default">设置分类</el-button>-->
 								</el-col>
-								<el-button type="primary" :icon="Refresh" size="default"/>
+								<el-button type="primary" :icon="Refresh" size="default" @click="reLoadData()"/>
 							</el-row>
 							<el-table
 									ref="multipleTableRef"
@@ -28,71 +28,121 @@
 									style="width: 100%"
 									height="calc(100% - 100px)"
 									:header-cell-style="{background: '#fafafa'}"
-									@selection-change="handleSelectionChange"
 							>
-								<el-table-column type="selection" width="55" />
-								<el-table-column type="index" label="作业证编号" width="200"/>
-								<el-table-column property="level" label="作业证等级" width="180" sortable />
-								<el-table-column property="applyDate" label="申请日期" sortable />
-								<el-table-column property="name" label="申请人" width="180"/>
-								<el-table-column property="department" label="申请部门" width="180" />
+								<el-table-column property="workPermitNo" label="作业申请单号" width="180"/>
+								<el-table-column property="applyUname" label="申请人"/>
+								<el-table-column property="depName" label="部门名称"/>
+								<el-table-column property="operators" label="作业人"/>
+								<el-table-column property="workTypeDesc" label="作业类型"/>
+								<el-table-column property="workLevelDesc" label="作业等级"/>
+								<el-table-column property="applyTime" label="申请时间" width="180"/>
 								<el-table-column label="申请状态" width="180">
 									<template #default="scope">
-										<el-tag type="success">{{ scope.row.status }}</el-tag>
+										<el-tag type="success">{{ scope.row.statusDesc}}</el-tag>
 									</template>
 								</el-table-column>
 								<el-table-column fixed="right" label="操作" align="center" width="250">
 									<template #default="scope">
 										<el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button>
-										<el-button link type="danger" size="small" :icon="Delete" @click="deleteRecord(scope.$index)">删除</el-button>
+										<el-button link type="success" size="small" :icon="Finished" @click="viewStatus(scope.row)">进度</el-button>
+										<el-button link type="warning" size="small" :icon="Delete" @click="deleteRecordBtn(scope.row)">取消</el-button>
 									</template>
 								</el-table-column>
 							</el-table>
 							<div class="pageBtn">
-								<el-pagination
-										v-model:currentPage="currentPage"
-										v-model:page-size="pageSize"
-										:page-sizes="[10, 15]"
-										small=false
-										background
-										layout="total, sizes, prev, pager, next, jumper"
-										:total="100"
-										@size-change="handleSizeChange"
-										@current-change="handleCurrentChange"
-								/>
+								<el-pagination v-model:currentPage="pageIndex1" v-model:page-size="pageSize1" :page-sizes="[10, 15]" small="false" background layout="total, sizes, prev, pager, next, jumper" :total="totalSize1" @size-change="handleSizeChange1" @current-change="handleCurrentChange1" />
 							</div>
 						</div>
 					</div>
 				</div>
-				<el-dialog v-model="dialogDetails" title="作业票查看">
+				<el-dialog v-model="dialogDetails" title="作业申请详情">
 					<el-form :model="details" label-width="120px">
-						<el-form-item label="作业证等级">
+						<el-form-item label="作业申请单号">
 							<el-input
-									v-model="details.level"
-									readonly
-							/>
-						</el-form-item>
-						<el-form-item label="申请日期">
-							<el-input
-									v-model="details.applyDate"
+									v-model="details.workPermitNo"
 									readonly
 							/>
 						</el-form-item>
 						<el-form-item label="申请人">
 							<el-input
-									v-model="details.name"
+									v-model="details.applyUname"
 									readonly
 							/>
 						</el-form-item>
-						<el-form-item label="申请部门">
+						<el-form-item label="部门名称">
 							<el-input
-									v-model="details.department"
+									v-model="details.depName"
 									readonly
 							/>
 						</el-form-item>
-						<el-form-item label="状态">
+						<el-form-item label="作业人">
 							<el-input
-									v-model="details.status"
+									v-model="details.operators"
+									readonly
+									type="textarea"
+							/>
+						</el-form-item>
+						<el-form-item label="作业类型">
+							<el-input
+									v-model="details.workTypeDesc"
+									readonly
+							/>
+						</el-form-item>
+						<el-form-item label="作业等级">
+							<el-input
+									v-model="details.workLevelDesc"
+									readonly
+							/>
+						</el-form-item>
+						<el-form-item label="作业内容">
+							<el-input
+									v-model="details.workContent"
+									readonly
+									type="textarea"
+							/>
+						</el-form-item>
+						<el-form-item label="作业地址">
+							<el-input
+									v-model="details.workLocation"
+									readonly
+									type="textarea"
+							/>
+						</el-form-item>
+						<el-form-item label="作业方式">
+							<el-input
+									v-model="details.workDetail.hotMethod"
+									readonly
+									type="textarea"
+							/>
+						</el-form-item>
+						<el-form-item label="关联其他作业">
+							<el-input
+									v-model="details.workDetail.otherSpecialWork"
+									readonly
+									type="textarea"
+							/>
+						</el-form-item>
+						<el-form-item label="期望开始时间">
+							<el-input
+									v-model="details.expStartTime"
+									readonly
+							/>
+						</el-form-item>
+						<el-form-item label="期望结束时间">
+							<el-input
+									v-model="details.expEndTime"
+									readonly
+							/>
+						</el-form-item>
+						<el-form-item label="申请时间">
+							<el-input
+									v-model="details.applyTime"
+									readonly
+							/>
+						</el-form-item>
+						<el-form-item label="当前状态">
+							<el-input
+									v-model="details.statusDesc"
 									readonly
 							/>
 						</el-form-item>
@@ -101,17 +151,59 @@
 						</el-form-item>
 					</el-form>
 				</el-dialog>
+				<el-dialog v-model="dialogStatus" title="作业申请进度">
+					<el-form v-if="approveInfo.operators.length>0" style="margin-bottom: 40px">
+						<el-form-item label="申请作业人">
+							<el-input
+									v-model="approveInfo.operators"
+									readonly
+									type="textarea"
+							/>
+						</el-form-item>
+					</el-form>
+					<div style="display: flex;flex-direction: column-reverse">
+						<div v-for="(item,index) in approveInfo.approvalSteps" class="stepItem">
+							<div class="stepNum">{{item.stepSerial}}</div>
+							<div class="stepCard">
+								<el-card class="box-card" shadow="always">
+									<div class="text">审批结果:<span>{{item.approvalResultDesc}}</span></div>
+									<div class="text">审批类型:<span>{{item.typeDesc}}</span></div>
+									<div class="text" v-show="item.startApprovalTime !=null">开始时间:<span>{{item.startApprovalTime}}</span></div>
+									<div class="approveUnit">
+										<div class="item-tit"><span>审批人</span><span>审批状态</span></div>
+										<div class="item-cont" v-for="i in item.stepUnits"><span>{{i.approvalUname}}</span><span>{{i.resultDesc}}</span></div>
+									</div>
+									<div class="approveItem">
+										<div class="item-tit"><span>审批项目</span><span>类型</span><div>措施标准</div></div>
+										<div class="item-cont" v-for="i in item.stepItems"><span>{{i.itemName}}</span><span>{{i.typeDesc}}</span>
+											<div v-if="i.measure !== null">
+												<div><span>作业类型:</span><span>{{i.measure.workTypeDesc}}</span></div>
+												<div><span>措施内容:</span><span>{{i.measure.context}}</span></div>
+											</div>
+											<div v-if="i.stand !== null">
+												<div><span>标题名称:</span><span>{{i.stand.title}}</span></div>
+												<div><span>标准内容:</span><span>{{i.stand.typeDesc}}</span></div>
+											</div>
+										</div>
+									</div>
+									<div class="text" v-show="item.expFinishApprovalTime !=null">期望结束时间:<span>{{item.expFinishApprovalTime}}</span></div>
+									<div class="text" v-show="item.finishApprovalTime !=null">结束时间:<span>{{item.finishApprovalTime}}</span></div>
+								</el-card>
+							</div>
+						</div>
+					</div>
+				</el-dialog>
 				<el-dialog v-model="deleteDialog" title="提示" width="30%" center @close="indexClear">
-					<span>您确定要删除该条记录吗?</span>
+					<span>您确定要取消该条申请吗?</span>
 					<template #footer>
-						  <span class="dialog-footer">
-							  <el-button @click="deleteDialog = false" size="default">取消</el-button>
-							<el-button type="primary" @click="conFirmDelete" size="default" v-throttle>确认</el-button>
-						  </span>
+                <span class="dialog-footer">
+                    <el-button @click="deleteDialog = false" size="default">取消</el-button>
+                    <el-button type="primary" @click="conFirmDelete" size="default">确认</el-button>
+                </span>
 					</template>
 				</el-dialog>
 			</el-tab-pane>
-			<el-tab-pane label="已通过" name="passed">
+			<el-tab-pane label="已通过" name="2">
 				<div style="height: 100%">
 					<el-row class="homeCard">
 						<el-col :span="8">
@@ -124,14 +216,6 @@
 					</el-row>
 					<div class="homeCard">
 						<div class="main-card">
-<!--							<el-row class="cardTop">-->
-<!--								<el-col :span="12" class="mainCardBtn">-->
-<!--									<el-button type="primary" :icon="Plus" size="default">申请</el-button>-->
-<!--									<el-button type="danger" :icon="Delete" size="default">删除</el-button>-->
-<!--									<el-button type="success" size="default">设置分类</el-button>-->
-<!--								</el-col>-->
-<!--								<el-button type="primary" size="default" :icon="Refresh" />-->
-<!--							</el-row>-->
 							<el-table
 									ref="multipleTableRef"
 									:data="passedData"
@@ -153,17 +237,7 @@
 								</el-table-column>
 							</el-table>
 							<div class="pageBtn">
-								<el-pagination
-										v-model:currentPage="currentPage"
-										v-model:page-size="pageSize"
-										:page-sizes="[10, 15]"
-										small=false
-										background
-										layout="total, sizes, prev, pager, next, jumper"
-										:total="100"
-										@size-change="handleSizeChange"
-										@current-change="handleCurrentChange"
-								/>
+								<el-pagination v-model:currentPage="pageIndex2" v-model:page-size="pageSize2" :page-sizes="[10, 15]" small="false" background layout="total, sizes, prev, pager, next, jumper" :total="totalSize2" @size-change="handleSizeChange2" @current-change="handleCurrentChange2" />
 							</div>
 						</div>
 					</div>
@@ -173,110 +247,284 @@
 	</div>
 </template>
 
-<script lang="ts" setup>
-	import { toRefs, reactive, defineComponent, ref } from 'vue';
+<script lang="ts">
+	import { toRefs, reactive, defineComponent, ref, onMounted } from 'vue';
 	import { storeToRefs } from 'pinia';
 	import { initBackEndControlRoutes } from '/@/router/backEnd';
-	import {useUserInfo} from "/@/stores/userInfo";
+	import { useUserInfo } from '/@/stores/userInfo';
 	import { Session } from '/@/utils/storage';
-	import { Plus, Delete, Refresh } from '@element-plus/icons-vue'
-	import { ElTable } from 'element-plus'
+	import { useRouter } from 'vue-router';
+	import { Edit, View, Plus, Delete, Refresh, Search, Finished } from '@element-plus/icons-vue';
+	import { ElTable } from 'element-plus';
+	import { FormInstance, FormRules, ElMessage } from 'element-plus';
+	import { workApplyApi } from '/@/api/specialWorkSystem/workApply';
 	import type { TabsPaneContext } from 'element-plus'
-	let global: any = {
-		homeChartOne: null,
-		homeChartTwo: null,
-		homeCharThree: null,
-		dispose: [null, '', undefined],
-	};
 
+	// 定义接口来定义对象的类型
 	interface stateType {
-		homeOne: Array <type>
+		applyData: Array<string>;
+		workTimeList: Array<string>;
+		multipleSelection: Array<any>;
+		deleteArr: Array<any>;
+		approveInfo: Object;
+		dialogDetails: boolean;
+		dialogStatus: boolean;
+		deleteDialog: boolean;
+		pageIndex1: number;
+		pageSize1: number;
+		chosenIndex: null | number;
+		deleteId: null | number;
+		searchWord: string;
+		totalSize1: number;
+		activeName:string;
+		addRecord: {};
+		details: {};
+		statusInfo:{}
 	}
-	interface type {
 
-	}
-	interface User {
-		num: string
-		level: string
-		applyDate: string
-		name: string
-		department: string
-		status: string
-	}
-	const userInfo = useUserInfo()
-	const { userInfos } = storeToRefs(userInfo);
-	const activeName = ref('Applying')
-	const handleClick = (tab: TabsPaneContext, event: Event) => {
-		console.log(tab, event)
-	}
-	const multipleTableRef = ref<InstanceType<typeof ElTable>>()
-	const multipleSelection = ref<User[]>([])
-	const handleSelectionChange = (val: User[]) => {
-		multipleSelection.value = val
-	}
-	const currentPage = ref(1)
-	const pageSize = ref(10)
-	const handleSizeChange = (val: number) => {
-		console.log(`${val} items per page`)
-	}
-	const handleCurrentChange = (val: number) => {
-		console.log(`current page: ${val}`)
-	}
-	const applyData = reactive([
-		{
-			level: '等级一',
-			applyDate: '2022-07-27 14:19:33',
-			name: '张三',
-			department: '部门一',
-			status: '审核中'
+	export default defineComponent({
+		name: 'myApply',
+		components: {},
+		setup() {
+			const userInfo = useUserInfo();
+			const { userInfos } = storeToRefs(userInfo);
+			const router = useRouter();
+			const state = reactive<stateType>({
+				pageIndex1: 1,
+				pageSize1: 10,
+				totalSize1: 0,
+				activeName: '1',
+				chosenIndex: null,
+				searchWord: '',
+				applyData: [],
+				workTimeList: [],
+				multipleSelection: [],
+				approveInfo: {
+					approvalSteps:[],
+					operators: []
+				},
+				dialogDetails: false,
+				dialogStatus: false,
+				deleteDialog: false,
+				addRecord: {},
+				details: {},
+				statusInfo:{},
+				deleteId: null,
+				deleteArr: []
+			});
+			interface User {
+				name: string;
+				list: [];
+				info: string;
+			}
 
-		},
-		{
-			level: '等级一',
-			applyDate: '2022-07-27 14:19:33',
-			name: '张三',
-			department: '部门一',
-			status: '审核中'
+			// 刷新
+			const reLoadData = async () => {
+				getListByPage();
+			};
 
-		},
-		{
-			level: '等级一',
-			applyDate: '2022-07-27 14:19:33',
-			name: '张三',
-			department: '部门一',
-			status: '审核中'
+			// 填写表单
+			const toApply =()=>{
+				router.push({
+					path: 'workTicket',
+				});
+			}
 
+			const handleClick = (tab: TabsPaneContext, event: Event) => {
+				console.log(tab, event)
+			}
+
+			// 分页获取工作时间组列表
+			const getListByPage = async () => {
+				const data = { pageSize: state.pageSize1, pageIndex: state.pageIndex1, searchParams: { name: state.searchWord } };
+				let res = await workApplyApi().getApplyListtPage(data);
+				if (res.data.code === '200') {
+					state.applyData = JSON.parse(JSON.stringify(res.data.data))
+					state.applyData = state.applyData.map((item) => {
+						if (item.operators == null || item.operators == []){
+							item.operators = [];
+						} else {
+							item.operators = Array.from(item.operators, ({ operatorUname }) => operatorUname);
+						}
+						return item;
+					});
+					state.totalSize1 = res.data.total
+					console.log('0212121')
+				} else {
+					ElMessage({
+						type: 'warning',
+						message: res.data.msg
+					});
+				}
+			};
+
+			// 表格数据格式化
+			const toNames = (row, column, cellValue, index) => {
+				if (row.list == []) {
+					return [];
+				} else {
+					const nameList = [];
+					for (let i = 0; i < row.list.length; i++) {
+						for (let t = 0; t < state.workTimeList.length; t++) {
+							if (row.list[i] == state.workTimeList[t].id) {
+								nameList.push(state.workTimeList[t].name);
+							}
+						}
+					}
+					return nameList.join();
+				}
+			};
+
+			// 关键词查询记录
+			const searchRecord = async () => {
+				if (state.searchWord == '') {
+					ElMessage({
+						type: 'warning',
+						message: '请输入查询关键词'
+					});
+				} else {
+					getListByPage();
+				}
+			};
+
+			const clearSearch = async () => {
+				state.searchWord = '';
+				getListByPage();
+			};
+
+			// 查看进度
+			const viewStatus = (row)=>{
+				getStatus({ workApplyId: row.workApplyId });
+				state.dialogStatus = true
+			};
+
+			// 查询进度方法
+			const getStatus = async (data: any) => {
+				let res = await workApplyApi().getStatus(data);
+				if (res.data.code === '200') {
+					state.approveInfo = JSON.parse(JSON.stringify(res.data.data))
+					state.approveInfo.operators = Array.from(state.approveInfo.operators, ({ operatorUname }) => operatorUname);
+					console.log(state.approveInfo,'steps')
+				} else {
+					ElMessage({
+						type: 'warning',
+						message: res.data.msg
+					});
+				}
+			};
+
+			const deleteRecordBtn = (row) => {
+				state.deleteId = row.workApplyId;
+				state.deleteDialog = true;
+			};
+
+			// 取消申请方法
+			const deleteRecord = async (data: any) => {
+				let res = await workApplyApi().cancelApply(data);
+				if (res.data.code === '200') {
+					ElMessage({
+						type: 'success',
+						message: res.data.msg
+					});
+					getListByPage();
+				} else {
+					ElMessage({
+						type: 'warning',
+						message: res.data.msg
+					});
+				}
+			};
+
+			const conFirmDelete = () => {
+				deleteRecord({ workApplyId: state.deleteId });
+				state.deleteDialog = false;
+			};
+
+			const handleSizeChange1 = (val: number) => {
+				state.pageSize1 = val;
+				getListByPage();
+			};
+			const handleCurrentChange1 = (val: number) => {
+				state.pageIndex1 = val;
+				getListByPage();
+			};
+
+			// 查看记录
+			const viewRecord = (row) => {
+				state.details = JSON.parse(JSON.stringify(row));
+				state.details.workDetail.otherSpecialWork = state.details.workDetail.otherSpecialWork.split(',')
+				if(state.details.workDetail.otherSpecialWork == null || state.details.workDetail.otherSpecialWork == []){state.details.workDetail.otherSpecialWork = []}
+				else{
+					state.details.workDetail.otherSpecialWork.map(item =>{
+						console.log(item,'item')
+						if(item == '1'){
+							item = '动火作业'
+							return item
+						} else if(item == '2'){
+							item = '受限空间作业'
+							return item
+						} else if(item == '3'){
+							item = '吊装作业'
+							return item
+						} else if(item == '4'){
+							item = '动土作业'
+							return item
+						} else if(item == '5'){
+							item = '断路作业'
+							return item
+						} else if(item == '6'){
+							item = '高处作业'
+							return item
+						} else if(item == '7'){
+							item = '临时用电作业'
+							return item
+						} else {
+							item = '盲板抽堵作业'
+							return item
+						}
+					})
+				}
+				console.log(state.details.workDetail.otherSpecialWork,'666666')
+				state.dialogDetails = true;
+			};
+
+
+			// 折线图
+			const renderMenu = async (value: string) => {
+				Session.set('projectId', value);
+				userInfos.value.projectId = value;
+				await initBackEndControlRoutes();
+			};
+
+			// 页面载入时执行方法
+			onMounted(() => {
+				getListByPage();
+			});
+
+			return {
+				View,
+				Edit,
+				Delete,
+				Refresh,
+				Plus,
+				Finished,
+				reLoadData,
+				toApply,
+				handleClick,
+				toNames,
+				searchRecord,
+				clearSearch,
+				viewRecord,
+				viewStatus,
+				deleteRecordBtn,
+				conFirmDelete,
+				getListByPage,
+				handleSizeChange1,
+				handleCurrentChange1,
+				...toRefs(state)
+			};
 		}
-	])
-	const chosenIndex = ref(-1)
-	const passedData: User[] = []
-	const dialogDetails = ref(false)
-	const details = ref({})
-	const deleteDialog = ref(false)
-
-	// 查看记录
-	const viewRecord = (row) =>{
-		details.value = JSON.parse(JSON.stringify(row))
-		dialogDetails.value = true
-	}
-
-	// 删除记录
-	const deleteRecord = (index) =>{
-		chosenIndex.value = index
-		deleteDialog.value = true
-	}
-
-	// 弹窗确认删除记录
-	const conFirmDelete = ()=> {
-		applyData.splice(chosenIndex.value,1)
-		deleteDialog.value = false
-	}
-	// 折线图
-	const renderMenu = async (value: string) => {
-		Session.set('projectId',value)
-		userInfos.value.projectId = value
-		await initBackEndControlRoutes();
-	};
+	});
 </script>
 
 <style scoped lang="scss">
@@ -334,6 +582,200 @@
 				height: calc(100% - 100px);
 			}
 		}
+		.stepItem{
+			display: flex;
+			align-items: flex-start;
+			margin-top: 30px;
+			margin-left: 30px;
+			padding-bottom: 30px;
+			padding-left: 40px;
+			border-left: 1px solid #a0cfff;
+			position: relative;
+			&:first-of-type{
+				margin-top: 30px;
+			}
+			&:first-of-type{
+				margin-bottom: 0;
+				border-left: none;
+			}
+			.stepNum {
+				position: absolute;
+				width: 40px;
+				height: 40px;
+				border-radius: 20px;
+				box-sizing: border-box;
+				font-size: 18px;
+				color: #333;
+				border: 1px solid #a0cfff;
+				line-height: 38px;
+				text-align: center;
+				left: -20px;
+				top: -30px;
+				background: #d9ecff;
+			}
+			.stepCard {
+				width: 100%;
+				margin-top: -30px;
+
+				.box-card {
+					width: 100%;
+
+					.card-header {
+						display: flex;
+						justify-content: space-between;
+						align-items: center;
+
+						span{
+							font-weight: bold;
+							margin-left: 10px;
+						}
+					}
+
+					.text {
+						width: 100%;
+						font-size: 14px;
+						margin-bottom: 10px;
+						padding-left: 10px;
+
+						span{
+							font-weight: bolder;
+							color: #409EFF;
+						}
+
+						&:last-of-type{
+							margin-bottom: 0;
+						}
+					}
+					.approveUnit{
+						width: 100%;
+						font-size: 14px;
+						margin-bottom: 20px;
+						padding: 10px 15px;
+						border: 1px solid #fff;
+						background: #ECF8FF;
+						border-radius: 6px;
+						.item-tit{
+							width: 100%;
+							display: flex;
+							color: #409EFF;
+							align-items: flex-start;
+							justify-content: space-between;
+							padding-bottom: 10px;
+							border-bottom: 1px solid #a0cfff;
+
+							&>span{
+								flex: 1;
+							}
+							&>div{
+								flex: 2;
+								text-align: center;
+							}
+						}
+						.item-cont{
+							width: 100%;
+							display: flex;
+							align-items: center;
+							justify-content: space-between;
+							padding: 10px 0;
+							border-bottom: 1px solid  #c6e2ff;
+
+							&>span{
+								flex: 1;
+							}
+							&>div{
+								flex: 2;
+								text-align: center;
+
+								&>div{
+									text-align: left;
+									width: 100%;
+									display: flex;
+									justify-content: center;
+									align-items: center;
+									span{
+										width: 45%;
+										&:first-of-type{
+											width: 30%;
+										}
+									}
+								}
+							}
+							&:last-of-type{
+								border-bottom: 0;
+							}
+						}
+					}
+					.approveItem{
+						width: 100%;
+						font-size: 14px;
+						margin-bottom: 20px;
+						padding: 10px 15px;
+						background: #ECF8FF;
+						border: 1px solid #fff;
+						border-radius: 6px;
+						.item-tit{
+							width: 100%;
+							display: flex;
+							color: #409EFF;
+							align-items: flex-start;
+							justify-content: space-between;
+							padding-bottom: 10px;
+							border-bottom: 1px solid #a0cfff;
+
+							&>span{
+								flex: 1;
+							}
+							&>div{
+								flex: 2;
+								text-align: center;
+
+
+							}
+						}
+						.item-cont{
+							width: 100%;
+							display: flex;
+							align-items: center;
+							justify-content: space-between;
+							padding: 10px 0;
+							border-bottom: 1px solid  #c6e2ff;
+
+							&>span{
+								flex: 1;
+							}
+							&>div{
+								flex: 2;
+								text-align: center;
+
+								&>div{
+									text-align: left;
+									width: 100%;
+									display: flex;
+									justify-content: center;
+									align-items: center;
+									span{
+										width: 45%;
+										&:first-of-type{
+											width: 30%;
+										}
+									}
+								}
+							}
+							&:last-of-type{
+								border-bottom: 0;
+							}
+						}
+					}
+				}
+			}
+			&:hover .card-header{
+				color: #0098F5;
+			}
+			&:hover .stepNum{
+				border: 2px solid #0098F5;
+				color: #0098F5;
+			}
+		}
 		.el-row{
 			display: flex;
 			align-items: center;
@@ -358,5 +800,8 @@
 				}
 			}
 		}
+		.el-card{
+			border: 0;
+		}
 	}
 </style>

--
Gitblit v1.9.2