Jingde-town-wechat-uniapp/pages_order/service/articleDetail.vue

<template>
	<!-- 0文化遗产详情、1申遗历程详情、2非遗体验详情 三合一 -->
	<view class="page">
		<navbar :title="titles[type]" leftClick @leftClick="$utils.navigateBack" />
		<uv-parse :content="detail.articleContent || detail.experienceDetail"></uv-parse>
		
		
		<StudyAndPathDetailSubmit
		article
		submiitTitle="线上预约"
		v-if="type == 2"
		:detail="detail" 
		@getData="queryArticleById"
		@submit="toPayUrl(detail, payType[type])"
		:collectType="collectType[type]"
		/>
	</view>
</template>

<script>
	import StudyAndPathDetailSubmit from '../components/submit/StudyAndPathDetailSubmit.vue'
	export default {
		components : {
			StudyAndPathDetailSubmit,
		},
		data() {
			return {
				titles: ['文化遗产', '申遗历程', '非遗体验'],
				collectType: [0, 0, 4],
				payType : [0, 0, 4],
				detail : {},
				id : 0,
				type : 0,
				apis : ['queryArticleById', 'queryArticleById', 'queryExperienceById'],
			}
		},
		onLoad(args) {
			this.id = args.id
			this.type = args.type
		},
		onShow() {
			this.queryArticleById()
		},
		onPullDownRefresh(){
			this.queryArticleById()
		},
		methods: {
			queryArticleById(){
				this.$api(this.apis[this.type], {
					articleId : this.id,
					experienceId : this.id,
				}, res => {
					uni.stopPullDownRefresh()
					if(res.code == 200){
						this.detail = res.result
					}
				})
			},
			toPayUrl(item, payType){
				uni.navigateTo({
					url: `/pages_order/order/orderSubscribe?payType=${payType}&id=${item.id}`
				})
			},
		}
	}
</script>

<style scoped lang="scss">
.page{
	
}
</style>