新增达人同游和申遗讲述以及卡片列表

pages.json

@@ -12,10 +12,9 @@
 			}
 		},
 		{
-			"path" : "pages/index/tourGuide",
-			"style" : 
-			{
-				"navigationBarTitleText" : ""
+			"path": "pages/index/tourGuide",
+			"style": {
+				"navigationBarTitleText": ""
 			}
 		}
 	],
@@ -66,6 +65,15 @@
 			{
 				"path": "service/applyRelic"
 			},
+			{
+				"path": "service/tell"
+			},
+			{
+				"path": "service/experience"
+			},
+			{
+				"path": "service/following"
+			},
 			{
 				"path": "mine/subscribe"
 			},

pages/index/index.vue

@@ -80,12 +80,12 @@
 					{
 						icon : '/static/image/home/g3.png',
 						title : '遗产讲述',
-						path : '',
+						path : '/pages_order/service/tell?type=0',
 					},
 					{
 						icon : '/static/image/home/g4.png',
 						title : '达人同游',
-						path : '',
+						path : '/pages_order/service/tell?type=1',
 					},
 					{
 						icon : '/static/image/home/g5.png',
@@ -95,12 +95,12 @@
 					{
 						icon : '/static/image/home/g6.png',
 						title : '我要跟拍',
-						path : '',
+						path : '/pages_order/service/following' ,
 					},
 					{
 						icon : '/static/image/home/g7.png',
 						title : '非遗体验',
-						path : '',
+						path : '/pages_order/service/experience',
 					},
 					{
 						icon : '/static/image/home/g8.png',

pages_order/components/list/cardList.vue

@@ -0,0 +1,104 @@
+<template>
+	<view>
+		<view class="card" v-for="(item,index) in 10" :key="index">
+			<view class="card-img">
+				<image src="../../static/applyRelic/jdz.png" mode="aspectFill"></image>
+			</view>
+			<view class="card-content">
+				<view style="display: flex; align-items: center;">
+					<text>刘申林</text>
+					<image class="card-content-img" src="../../static/tell/goldMedal.png"></image>
+				</view>
+				<view class="card-content-tag">
+					提前一周预约
+				</view>
+				<view style="font-size: 12px; color: #999;">
+					御窑厂、刘家弄、观音阁、陶瓷博物馆御窑博物馆...
+				</view>
+				<view class="card-content-bottom">
+					<view style="color: #FF280C;">
+						￥300起
+					</view>
+					<view class="card-content-bottom-one">
+						￥线上预约
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.card {
+		display: flex;
+		height: 300rpx;
+		width: 94%;
+		margin: 40rpx 0 0 3%;
+		align-items: center;
+
+		.card-img {
+			height: 240rpx;
+			width: 420rpx;
+
+			image {
+				height: 100%;
+				width: 100%;
+			}
+		}
+
+		.card-content {
+			margin-left: 3%;
+			font-size: 28rpx;
+
+			.card-content-img {
+				display: flex;
+				margin-left: 10rpx;
+				width: 100rpx;
+				height: 40rpx;
+			}
+
+			.card-content-tag {
+				display: inline-block;
+				font-size: 24rpx;
+				padding: 2rpx 20rpx;
+				border: 2rpx solid #FBA21E;
+				background-color: #FFF1D2;
+				color: #FBAF35;
+				border-radius: 20rpx;
+			}
+
+			.card-content-bottom {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+
+				.card-content-bottom-one {
+					display: inline-block;
+					color: #FFFDF6;
+					background-color: #C83741;
+					margin-right: 4%;
+					padding: 8rpx 20rpx;
+					border-radius: 40rpx;
+				}
+
+			}
+
+			view {
+				margin-top: 10rpx;
+			}
+		}
+	}
+</style>

pages_order/service/experience.vue

@@ -0,0 +1,21 @@
+<template>
+	<view class="experience">
+		<navbar title="非遗体验" leftClick @leftClick="$utils.navigateBack" />
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style>
+</style>

pages_order/service/following.vue

@@ -0,0 +1,11 @@
+<template>
+	<view class="following">
+		
+	</view>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>

pages_order/service/tell.vue

@@ -0,0 +1,139 @@
+<template>
+	<view class="tell">
+		<navbar :title="titles[type]" leftClick @leftClick="$utils.navigateBack" />
+
+		<view class="tell-top" v-if="type == 0 ">
+			<view>级别</view>
+			<view>遗产点</view>
+		</view>
+
+		<!-- <view class="card" v-for="(item,index) in 10">
+			<view class="card-img">
+				<image src="../static/applyRelic/jdz.png" mode="aspectFill"></image>
+			</view>
+			<view class="card-content">
+				<view style="display: flex; align-items: center;">
+					<text>刘申林</text>
+					<image class="card-content-img" src="../static/tell/goldMedal.png"></image>
+				</view>
+				<view class="card-content-tag">
+					提前一周预约
+				</view>
+				<view style="font-size: 12px; color: #999;">
+					御窑厂、刘家弄、观音阁、陶瓷博物馆御窑博物馆...
+				</view>
+				<view class="card-content-bottom">
+					<view style="color: #FF280C;">
+						￥300起
+					</view>
+					<view class="card-content-bottom-one">
+						￥线上预约
+					</view>
+				</view>
+			</view>
+		</view> -->
+		<cardList />
+		<tabber/>
+	</view>
+</template>
+
+<script>
+	import cardList from '../components/list/cardList.vue'
+	export default {
+		components: {
+			cardList
+		},
+		data() {
+			return {
+				titles: ['遗产讲述', '达人同游'],
+				type: 0,
+			}
+		},
+		onLoad(args) {
+			this.type = args.type || 0
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+
+<style scoped lang="scss">
+	.tell {
+		.tell-top {
+			display: flex;
+			justify-content: left;
+			align-items: center;
+			height: 80rpx;
+			background-color: #fff;
+			border-top: 2rpx solid #D0D0D0;
+			border-bottom: 2rpx solid #D0D0D0;
+
+			view {
+				flex: 1;
+				margin-left: 5%;
+			}
+		}
+
+		// .card {
+		// 	display: flex;
+		// 	height: 300rpx;
+		// 	width: 94%;
+		// 	margin: 40rpx 0 0 3%;
+		// 	align-items: center;
+
+		// 	.card-img {
+		// 		height: 240rpx;
+		// 		width: 420rpx;
+
+		// 		image {
+		// 			height: 100%;
+		// 			width: 100%;
+		// 		}
+		// 	}
+
+		// 	.card-content {
+		// 		margin-left: 3%;
+		// 		font-size: 28rpx;
+
+		// 		.card-content-img {
+		// 			display: flex;
+		// 			margin-left: 10rpx;
+		// 			width: 100rpx;
+		// 			height: 40rpx;
+		// 		}
+
+		// 		.card-content-tag {
+		// 			display: inline-block;
+		// 			font-size: 24rpx;
+		// 			padding: 2rpx 20rpx;
+		// 			border: 2rpx solid #FBA21E;
+		// 			background-color: #FFF1D2;
+		// 			color: #FBAF35;
+		// 			border-radius: 20rpx;
+		// 		}
+
+		// 		.card-content-bottom {
+		// 			display: flex;
+		// 			justify-content: space-between;
+		// 			align-items: center;
+
+		// 			.card-content-bottom-one {
+		// 				display: inline-block;
+		// 				color: #FFFDF6;
+		// 				background-color: #C83741;
+		// 				margin-right: 4%;
+		// 				padding: 8rpx 20rpx;
+		// 				border-radius: 40rpx;
+		// 			}
+
+		// 		}
+
+		// 		view {
+		// 			margin-top: 10rpx;
+		// 		}
+		// 	}
+		// }
+	}
+</style>