Browse Source

feat: 审批相关 页面调整

lanceJiang 10 months ago
parent
commit
29781af441

+ 5 - 0
src/styles/lance-element-ui.scss

@@ -185,3 +185,8 @@
 	//max-width: 20%;
 	word-break: break-word;
 }
+/*@media (max-width: 750px) {
+	.el-drawer {
+		width: 90vw;
+	}
+}*/

+ 2 - 0
src/styles/project_normal.scss

@@ -80,6 +80,8 @@ body {
 	z-index: 1;
 	margin-right: 28px;
 	transition: all var(--bezier);
+	height: 100%;
+	//width: max-content;
 	&--collapsed {
 		// todo
 	}

+ 33 - 1
src/views/approve/components/approvalIndex.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="flex-column-page-wrap flex-wrap pageWrap">
+	<div class="flex-column-page-wrap approval-index-wrap pageWrap">
 		<ApprovedItem :current-task-type="currentTaskType" />
 
 		<ApprovedContent :current-task-type="currentTaskType" />
@@ -24,3 +24,35 @@ const props = defineProps({
 	}
 })
 </script>
+<style lang="scss" scoped>
+.approval-index-wrap {
+	flex-direction: row;
+	padding-bottom: 10px;
+	background: var(--el-bg-color-page);
+}
+@media (max-width: 750px) {
+	.approval-index-wrap {
+		flex-direction: column;
+		overflow-y: auto;
+		:deep(.aside-wrap) {
+			margin-bottom: 10px;
+			margin-right: 0;
+			height: 50%;
+			.flow-content {
+				width: 100%;
+			}
+			.trigger-bar {
+				display: none;
+			}
+		}
+		:deep(.flow-detail-content) {
+			//height: max-content;
+			overflow: unset;
+			width: 100%;
+			.scroll-wrap {
+				overflow: auto;
+			}
+		}
+	}
+}
+</style>

+ 2 - 1
src/views/approve/components/approvedContent.vue

@@ -64,7 +64,7 @@
 
 						<!--审批流-->
 						<el-timeline style="margin-left: 50px">
-							<el-timeline-item v-for="active in activeData" :key="active.id" hollow :timestamp="active.local_timestamp">
+							<el-timeline-item class="z-0" v-for="active in activeData" :key="active.id" hollow :timestamp="active.local_timestamp">
 								<template #dot>
 									<FlowTypeDot :status="active.id ? 0 : 1" :type="active.type" :name="active.createBy" />
 								</template>
@@ -704,6 +704,7 @@ watch(
 			overflow: hidden;
 			overflow-y: auto;
 			flex: 1;
+			padding-bottom: 10px;
 			.tags-desc {
 				position: absolute;
 				left: 6px;

+ 5 - 1
src/views/approve/components/approvedItem.vue

@@ -396,6 +396,8 @@ const disabledInfinite = computed(() => loading.value || noMore.value)
 	width: 330px;
 	min-width: 330px;
 	height: 100%;
+	display: flex;
+	flex-direction: column;
 	overflow: hidden;
 	background: var(--el-bg-color);
 	border-radius: 6px;
@@ -418,9 +420,11 @@ const disabledInfinite = computed(() => loading.value || noMore.value)
 	}
 
 	.flow-list-box {
+		flex: 1;
 		background-color: var(--el-bg-color);
 		padding: 0 12px;
-		height: calc(100vh - 192px);
+		//height: calc(100vh - 192px);
+		height: 100%;
 		overflow: hidden auto;
 		scroll-snap-type: y mandatory;
 		will-change: scroll-position;

+ 5 - 0
src/views/approve/launch/ItemDrawer.vue

@@ -372,6 +372,11 @@ Promise.all([
 		background: rgba(0, 0, 0, 0.05);
 	}
 }
+@media (max-width: 750px) {
+	.local-launch_drawer-wrap {
+		width: 90vw !important;
+	}
+}
 </style>
 <style scoped lang="scss">
 .info-wrap {