myReservation.vue 2.04 KB
<template>
	<view>
		<view class="list">
				<view class="kcitem" v-for="n in list" :key="n.courseId">
					<image :src="config.baseUrl_api+n.activityPic" mode="aspectFill" @click="goDetail(n)"></image>
					<view class="info">
						<view class="tt esp_2" @click="goDetail(n)">{{n.activityName}}</view>
						<!-- <view class="pp"><uni-icons type="chatboxes" size="12" />209w 学习</view> -->
						<view class="pp">开始时间:{{n.startTime}}</view>
						<view class="pp">结束时间:{{n.endTime}}</view>
						
						<view class="text-warning" style="float: right;" v-if="n.unState==0" @click="unSub(n)">退订</view>
					</view>
				</view>
		</view>
		<view class="nodata" v-if="list.length==0">
			<image mode="aspectFit" src="/static/nodata.png"></image>
		</view>
	</view>
</template>

<script setup>
	import {
		onLoad,
		onShow
	} from '@dcloudio/uni-app';
	import config from '@/config.js';
	import {
		ref,
		getCurrentInstance
	} from 'vue';
	import * as api from '@/common/api.js';
	const list = ref([])
	
	onShow((option) => {
		getList()
	})
	function getList(){
		api.getMyActivitys().then(res=>{
			list.value = res.rows
		})
	}
	function goDetail(item) {
		let path = `/course/activeDetail?id=${item.activityId}`;
		uni.navigateTo({
			url: path
		});
	
	}
	function unSub(item){
		uni.showModal({
			content:`确定退订${item.activityName}吗?`,
			success:function(respon){
				if(respon.confirm){
					api.unSubscribe({orderId:item.orderId}).then(res=>{
							if(res.data==-100){
								uni.showToast({
									title:'非活动订单不支持退订',
									icon:'none'
								})
								return
							}
							if(res.data==-200){
								uni.showToast({
									title:'活动已开始不支持退订',
									icon:'none'
								})
								return
							}
							if(res.data==0){
								uni.showToast({
									title:'退订成功',
									icon:'none'
								})
							}
							getList()
						})
					
				}
			}
		})
	}
</script>

<style scoped lang="scss">
	.list {
		padding: 24rpx 0 0 24rpx;
		overflow: hidden;
	}
</style>