mabao/pages/common_tools/me_order/me_order.vue

<template style="background: #F6F6F6;">
	<view style="height: 100%;width: 100%;padding: 20rpx 28rpx;">
		<view v-for="item,index in orderList" :key="index" class="list" @click="list" :data-index="index">
			<!-- 左边 -->
			<view class="left">
				<view style="font-size: 30rpx;font-weight: bold;margin-bottom: 20rpx;">{{item.title}}</view>
				<view style="font-size: 26rpx;color: #999999;">{{item.describe}}</view>
			</view>
			<!-- 右边 -->
			<view class="ringht">
				<u-icon name="arrow-right" color="#C0C0C0"></u-icon>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				orderList: [{
					title: '保单名称保单名称保单名称保单名称套餐一',
					describe: '套餐一'
				}, {
					title: '保单名称保单名称套餐二',
					describe: '套餐二'
				}, {
					title: '保单名称保单名称保单名称套餐三',
					describe: '套餐三'
				}, {
					title: '保单名称保单名称套餐四',
					describe: '套餐四'
				}, {
					title: '保单名称保单名称保单名称保单名称套餐五',
					describe: '套餐五'
				}]
			}
		},
		methods: {
			//关注
			list(e) {
				console.log(this.orderList[e.currentTarget.dataset.index])
				uni.navigateTo({
					url: '/pages/common_tools/me_order/order_details?title=' + this.orderList[e.currentTarget.dataset.index].title
					// url: '/pages/customer/customer-datails?n=' + n
				})
			}
		}
	}
</script>

<style>
	.list {
		box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.04);
		border-radius: 12px;
		background: #FFFFFF;
		margin-bottom: 20rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 48rpx 28rpx;
	}

	.left {
		width: 95%;
		display: initial;
	}

	.ringht {
		width: 5%;
	}
</style>