| 
					
				 | 
			
			
				@@ -0,0 +1,115 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  <view class="oa-timeLine-item"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    <view class="oa-timeLine-item-header"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <view class="oa-timeLine-item-header-icon"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <u-icon name="info-circle-fill" :color="iconColor" size="18"></u-icon> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <view class="oa-timeLine-item-header-cont"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <view class="title"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          {{ titleValue }} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <!-- <view style="margin: auto"> </view> --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <view class="time"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          {{ timeValue }} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    </view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    <view class="oa-timeLine-item-content"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <view class="oa-timeLine-item-content-icon"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <view class="icon"></view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <view class="oa-timeLine-item-content-cont"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <slot class="content"></slot> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    </view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  </view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<script setup> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import { toRefs } from "vue"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const props = defineProps({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  titleValue: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    type: String, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    default: "", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  timeValue: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    type: String, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    default: "", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  iconColor: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    type: String, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    default: "#149eff", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+}); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+const { titleValue, timeValue, iconColor } = toRefs(props); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</script> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<style lang="scss" scoped> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+.oa-timeLine-item { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .oa-timeLine-item-header { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    height: 25px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    line-height: 25px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .oa-timeLine-item-header-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      margin: auto 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .oa-timeLine-item-header-cont { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      width: calc(100% - 18px - 15px); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      margin-left: 15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .title { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        font-size: 15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        color: #000000; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        overflow: hidden; //超出的文本隐藏 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        text-overflow: ellipsis; //溢出用省略号显示 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        white-space: nowrap; // 默认不换行; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .time { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        font-size: 14px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        color: #b5b5b5; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        margin-left: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .oa-timeLine-item-content { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .oa-timeLine-item-content-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      width: 18px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      .icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        width: 2px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        background-color: #e4e7ed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        margin: -5px auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .oa-timeLine-item-content-cont { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      margin: 15px 0px 15px 15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      padding: 15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background-color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      border-radius: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+// .oa-timeLine-item:last-child { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+//   .oa-timeLine-item-content { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+//     .oa-timeLine-item-content-icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+//       .icon { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+//         margin-bottom: 15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+//       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+//     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+//   } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+// } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</style> 
			 |