| 
					
				 | 
			
			
				@@ -0,0 +1,326 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	<!-- 物流详情 --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	<view class="card_logist"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		<view class="map_card"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<map style="width: 100%;" :style="{height:windowHeight * 2 + 'rpx'}" :latitude="latitude" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				:longitude="longitude" :enable-3D="true" :scale="scale" :polyline="polylineList" :markers="markers" :v-if="showmap"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			</map> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		</view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		<view class="card_logistics"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<view class="img_head" @click="clickImg"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				<image style="width: 80rpx;height: 40rpx;transform: rotate(0deg);" v-if="logisticsFlag" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					src="../../static/unfold.png"></image> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				<image style="width: 80rpx;height: 40rpx;transform: rotate(180deg);" v-else 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					src="../../static/unfold.png"></image> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			</view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<view class="card_wlxq" v-if="logisticsFlag"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				<text class="title_logistics_il">物流详情</text> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				<view class="card_steps" v-if="activitiesList.length > 0"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					<view class="steps"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						<view class="steps_item" v-for="(i, index) in activitiesList" :key="index"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							<view class="s_r"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								<text class="line" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									:style="{ backgroundColor: index != 0 ? '#EAEAEA' : 'rgba(0,0,0,0)' }"></text> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								<text class="index_title" :style="{ backgroundColor: i.backgroundColor, color: color }"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								</text> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								<text class="line1" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									:style="{ backgroundColor: index != activitiesList.length - 1 ? '#EAEAEA' : 'rgba(0,0,0,0)' }"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								</text> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							</view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							<view class="s_l"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								<text class="title_scacm_34">{{ i.text }} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									<text v-if="i.phone"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										联系电话:<text style="color: #f29100;margin-right: 15rpx;">{{i.phone}}</text> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									</text> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									{{ i.text1 }} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								</text> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								<text class="date_scacm">{{ i.createdAt || ''}}</text> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							</view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						</view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					</view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				</view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				<view class="not_card" v-else style="padding-bottom: 20rpx;"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					<image style="width: 280rpx;height: 220rpx;padding: 30rpx;" src="../../static/task/not.png"></image> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					<text class="not_title">暂无物流信息</text> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				</view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			</view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		</view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	</view> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<script> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	const ENV = require('../../.env.js') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		data() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			return { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				windowHeight: uni.getSystemInfoSync().windowHeight, //屏幕高度 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				orderList: {}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				trackList: [], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				map: null, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				longitude: 106.6282014, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				latitude: 26.64669, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				scale: 13, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				activitiesList: [], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				active: 0, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				statusList: [{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					id: 3, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					title: '待配送', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				}, { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					id: 4, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					title: '配送中', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				}, { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					id: 5, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					title: '已送达', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				}, { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					id: 6, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					title: '已拒收', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				}], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				polylineList: [], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				markers: [], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				logisticsFlag: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				showmap: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				color: '#fff', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		mounted() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			uni.setNavigationBarTitle({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				title: '物流详情', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			var orderList = uni.getStorageSync('orderDetails') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			this.orderList = orderList 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			this.$nextTick(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				setTimeout(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					this.getList() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		methods: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			getList() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				uni.request({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					url: ENV.APP_DEV_URL + '/api/waybill-logistics', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					method: 'GET', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					data: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						waybillNo: this.orderList.waybillNo, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					success: (res) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						if (res.data.code == 200) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							var arrList = res.data.data.list 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							arrList.forEach(async (item) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								item.backgroundColor = '#ffffff' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								item.text = '' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								let arr = '' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								this.statusList.forEach((item1) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									if (item.status == item1.id) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										arr = item1.title 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								}); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								let yonTitle = '' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								if (item.coolerBox.id) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									yonTitle = item.coolerBox.name 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								item.text = item.address + '【' + yonTitle + '】' + '  ' + '您的货物' + 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									arr 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							arrList[0].backgroundColor = '#2979ff' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							this.activitiesList = arrList.reverse() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							this.getTrack() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					fail: (err) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						// 处理请求失败情况 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				}); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			// 获取轨迹 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			getTrack() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				uni.request({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					url: ENV.APP_DEV_URL + '/api/waybill-task/locus', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					method: 'GET', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					data: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						waybillNo: this.orderList.waybillNo, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					success: (res) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						if (res.data.code == 200) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							let arr = res.data.data 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							let arrList = [] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							if (arr.length > 0) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								arr.forEach(item => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									if (item.T_site != '0,0' && item.T_site) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										const arr1 = item.T_site.split(',') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										const list = { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+											latitude: arr1[1], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+											longitude: arr1[0], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+										arrList.push(list) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								}) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								let polyline = [{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									points: arrList, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									color: '#3591FC', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									width: 15, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									arrowLine: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								}] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								this.polylineList = polyline 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								const markers0 = { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									latitude: arrList[0].latitude, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									longitude: arrList[0].longitude, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									id: 0, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									iconPath: '/static/task/startpoint.png', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									width: 35, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									height: 35, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								const markers1 = { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									latitude: arrList[arrList.length - 1].latitude, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									longitude: arrList[arrList.length - 1].longitude, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									id: 1, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									iconPath: '/static/task/endpoint.png', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									width: 35, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+									height: 35, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								let markers = [] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								markers.push(markers0) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								markers.push(markers1) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								this.markers = markers 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								this.latitude = arrList[arrList.length - 1].latitude 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								this.longitude = arrList[arrList.length - 1].longitude 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								this.$forceUpdate() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+								this.showmap = true; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+							} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					fail: (err) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+						// 处理请求失败情况 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				}); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			clickImg() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				if (this.logisticsFlag) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					this.logisticsFlag = false 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				} else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					this.logisticsFlag = true 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</script> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<style lang="scss" scoped> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.card_logist { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		position: fixed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		top: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		left: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		right: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		bottom: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.card_logistics { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		z-index: 2023; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		bottom: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		left: 20rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		right: 20rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		// width: calc(100% - 40rpx); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		// margin: 20rpx 20rpx 0rpx 20rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		background-color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		border-top-right-radius: 10rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		border-top-left-radius: 10rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.img_head { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		justify-content: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		padding: 10rpx 0rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.card_wlxq { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		flex: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.title_logistics_il { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		font-size: 30rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		font-weight: 600; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		padding: 0rpx 20rpx 0rpx 20rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.card_steps { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		padding: 20rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.overturn { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		transform: rotate(180deg); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.steps { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		flex-direction: column; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		flex: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.steps_item { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		flex-direction: row; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		flex: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.s_r { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		padding: 0 20rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		flex-direction: column; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		width: 50rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.line { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		width: 5rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		height: 20rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.line1 { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		width: 5rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		height: 90rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.index_title { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		width: 24rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		height: 24rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		border-radius: 50rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		border: 4rpx solid #e3eeff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.s_l { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		flex: 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		height: 120rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		flex-direction: column; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		padding-bottom: 20rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.date_scacm { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		font-size: 23rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		color: #afb4be; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.title_scacm_34 { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		font-size: 28rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		font-weight: 500; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		color: rgba(102, 102, 102, 1); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.not_card { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		justify-content: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		flex-direction: column; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	.not_title { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		font-size: 30rpx; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		color: #afb4be; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</style> 
			 |