需求的列表和弹窗，基本完成

src/assets/scss/dataBoard/popup-info.scss

@@ -63,4 +63,82 @@
             }
         }
     }
+	/deep/.timeline {
+		margin-top: 15px;
+		.sucess {
+			.el-timeline-item__node {
+				width: 16px;
+				height: 16px;
+				background-color: #0c81fe;
+				border: solid 3px #fff;
+				box-shadow: 0px 0px 10px 5px #0c81fe;
+			}
+		}
+		.el-timeline-item__node {
+			width: 16px;
+			height: 16px;
+			background: #09176c;
+			border: 1px solid #007ae7;
+			border-radius: 50%;
+		}
+		.el-timeline-item__tail {
+			left: 6px;
+			border-left: 1px solid #6398d1;
+		}
+		.status-box {
+			display: flex;
+	
+			.status2 {
+				width: 66px;
+				height: 24px;
+				background: #0c81fe;
+				border-radius: 10px 0px 10px 0px;
+				color: #fefefe;
+				text-align: center;
+				line-height: 24px;
+			}
+			.status1 {
+				width: 66px;
+				height: 24px;
+				font-size: 16px;
+				font-family: Microsoft YaHei;
+				font-weight: 400;
+				color: #3d86ff;
+				line-height: 24px;
+			}
+			.timestamp {
+				width: 121px;
+	
+				font-size: 12px;
+				font-family: Microsoft YaHei;
+				font-weight: 300;
+				color: #b5d9ff;
+				line-height: 32px;
+				opacity: 0.46;
+				margin-left: 11px;
+			}
+		}
+		.content {
+			display: flex;
+			.field {
+				width: 80px;
+				font-size: 16px;
+				font-family: Microsoft YaHei;
+				font-weight: 400;
+				color: #b5d9ff;
+				line-height: 32px;
+				opacity: 0.76;
+				text-align: right;
+			}
+			.value {
+				flex: 1;
+			
+				font-size: 16px;
+				font-family: Microsoft YaHei;
+				font-weight: 400;
+				color: #ffffff;
+				line-height: 32px;
+			}
+		}
+	}
 }

src/views/dataBoard/cpts/need-details.vue

@@ -38,39 +38,81 @@
 				</div>
 			</div>
 			<div class="m-info" v-if="detailType == '政府支撑'">
-				<div style="width: 50%;">
+				<el-row>
+					<el-col :span="12">
+						<div class="subtitle">
+							<i class="i-chunk"></i>
+							事件详情
+							<i class="i-line"></i>
+						</div>
 						<div class="row">
 							<div class="item">
 								<div class="field">项目标题：</div>
 								<div class="value">{{ info.title }}</div>
 							</div>
+						</div>
+						<div class="row">
 							<div class="item">
 								<div class="field">项目方案：</div>
 								<div class="value">{{ info.content }}</div>
 							</div>
+						</div>
+						<div class="row">
 							<div class="item">
 								<div class="field">内部备注：</div>
 								<div class="value">{{ info.remark }}</div>
 							</div>
+						</div>
+						<div class="row">
 							<div class="item">
 								<div class="field">当前处理部门：</div>
 								<div class="value">{{ info.department }}</div>
 							</div>
+						</div>
+						<div class="row">
 							<div class="item">
 								<div class="field">分类：</div>
 								<div class="value">{{ info.class }}{{ info.sub_class }}</div>
 							</div>
+						</div>
+						<div class="row">
 							<div class="item">
 								<div class="field">标签：</div>
 								<div class="value">{{ info.label }}</div>
 							</div>
+						</div>
+						<div class="row">
 							<div class="item">
 								<div class="field">操作：</div>
 								<!-- <div class="value">{{ info.report_user_mobile }}</div> -->
 							</div>
 						</div>
+					</el-col>
+					<el-col :span="12">
+						<div class="subtitle">
+							<i class="i-chunk"></i>
+							处理进展
+							<i class="i-line"></i>
+						</div>
+						<el-timeline class="timeline">
+							<el-timeline-item v-for="(item, index) in progress" :key="index" :class="index == progress.length - 1 ? 'sucess' : ''">
+								<div class="status-box">
+									<div class="status2" v-if="index == progress.length - 1">{{ item.type }}</div>
+									<div class="status1" v-else>{{ item.type }}</div>
+									<div class="timestamp">{{ item.date }}</div>
+								</div>
+								<div class="content">
+									<div class="field">处理部门：</div>
+									<div class="value">{{ item.department }}</div>
 								</div>
-				<div style="width: 50%;"></div>
+								<div class="content">
+									<div class="field">说明：</div>
+									<div class="value">{{ item.remark }}</div>
+								</div>
+							</el-timeline-item>
+						</el-timeline>
+					</el-col>
+				</el-row>
 			</div>
 			<div class="m-info" v-else>
 				<div class="row">
@@ -159,22 +201,23 @@ export default {
 	created() {},
 	data() {
 		return {
+			progress: [],
 			info: {
-				grid: '--',
+				// grid: '--',
-				parent_category: '--',
+				// parent_category: '--',
-				category: '--',
+				// category: '--',
-				report_type: '--',
+				// report_type: '--',
-				report_user_name: '--',
+				// report_user_name: '--',
-				report_time: '--',
+				// report_time: '--',
-				report_user_mobile: '--',
+				// report_user_mobile: '--',
-				demand_user_name: '--',
+				// demand_user_name: '--',
-				want_service_time: '--',
+				// want_service_time: '--',
-				content: '--',
+				// content: '--',
-				server_name: '--',
+				// server_name: '--',
-				service_start_time: '--',
+				// service_start_time: '--',
-				service_end_time: '--',
+				// service_end_time: '--',
-				finish_result: '--',
+				// finish_result: '--',
-				score: '--'
+				// score: '--'
 			}
 		};
 	},
@@ -217,8 +260,37 @@ export default {
 				}
 			);
 			if (code === 0) {
-				
 				this.info = { ...this.info, ...data[0] };
+				if (this.detailType == '政府支撑') {
+					this.progress = this.info.progress;
+
+					this.progress = [
+						{
+							type: '适',
+							date: '2023-03-08 16:08:45',
+							department: '节',
+							remark: '非片实先只生音或话还种却处也长九整。'
+						},
+						{
+							type: '取',
+							date: '2023-03-08 16:08:45',
+							department: '战',
+							remark: '给查段义上影再圆认军律矿最影。'
+						},
+						{
+							type: '处',
+							date: '2023-03-08 16:08:45',
+							department: '才',
+							remark: '才除证线志路对这分收飞气建龙最说。'
+						},
+						{
+							type: '调',
+							date: '2023-03-08 16:08:45',
+							department: '造',
+							remark: '便以群群数全进更几采许定结前带。'
+						}
+					];
+				}
 				console.log(this.info);
 			} else {
 				this.$message.error(msg);
@@ -228,6 +300,8 @@ export default {
 };
 </script>
 <style scoped>
-	.m-info .row .item .field{width: 120px!important;}
+.m-info .row .item .field {
+	width: 120px !important;
+}
 </style>
 <style lang="scss" src="@/assets/scss/dataBoard/popup-info.scss" scoped></style>