<template>
|
|
<view>
|
|
<navbar title="我的收藏" leftClick @leftClick="leftClick" />
|
|
|
|
<view style="background-color: #fff;">
|
|
<uv-tabs :list="tabs"
|
|
lineColor="#B12026"
|
|
lineHeight="8rpx"
|
|
lineWidth="50rpx"
|
|
@click="clickTabs"></uv-tabs>
|
|
</view>
|
|
|
|
<hList :list="list">
|
|
<template
|
|
v-slot="{item,index}"
|
|
>
|
|
<view class="card"
|
|
@click="toUrl(item, tabs)"
|
|
>
|
|
<view class="card-img">
|
|
<image :src="item.roleHead
|
|
|| item.amusementImage
|
|
|| item.experienceImage
|
|
|| item.waresImage" mode="aspectFill"></image>
|
|
</view>
|
|
|
|
<view class="iconx"
|
|
@click.stop="delModel(item)">
|
|
<uv-icon
|
|
name="close-circle-fill"
|
|
size="40rpx"
|
|
color="#B12026"></uv-icon>
|
|
</view>
|
|
|
|
<view class="card-content">
|
|
<view style="display: flex; align-items: center;">
|
|
<view class="title text-ellipsis">{{ item.roleName
|
|
|| item.amusementTitle
|
|
|| item.experienceTitle
|
|
|| item.waresTitle }}</view>
|
|
</view>
|
|
<view class="card-content-tag"
|
|
v-if="item.preTime || item.experienceOpentime">
|
|
{{ item.preTime
|
|
|| item.experienceOpentime
|
|
|| '提前一周预约' }}
|
|
</view>
|
|
<view class="tips text-ellipsis-2"
|
|
v-if="item.preInfo">
|
|
{{ item.preInfo}}
|
|
</view>
|
|
<view class="card-content-bottom">
|
|
<view style="color: #FF280C;">
|
|
¥{{ item.price
|
|
|| item.amusementPrice
|
|
|| item.experiencePrice
|
|
|| item.waresPrice}}起
|
|
</view>
|
|
<view class="card-content-bottom-one"
|
|
v-if="item.collectionType != 6 &&
|
|
item.collectionType != 2 || item.isPay == 1"
|
|
@click.stop="toPayUrl(item)">
|
|
¥线上预约
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</hList>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import mixinsList from '@/mixins/list.js'
|
|
import hList from '@/components/list/h-list.vue'
|
|
export default {
|
|
components : {
|
|
hList
|
|
},
|
|
mixins : [mixinsList],
|
|
data() {
|
|
return {
|
|
tabs: [
|
|
// {
|
|
// name: '文化遗产',
|
|
// },
|
|
{
|
|
name: '遗产讲述',
|
|
type : 'tell',
|
|
},
|
|
{
|
|
name: '达人同游',
|
|
type : 'travel',
|
|
},
|
|
{
|
|
name: '遗产路径',
|
|
type : 'path',
|
|
},
|
|
{
|
|
name: '我要跟拍',
|
|
type : 'follow',
|
|
},
|
|
{
|
|
name: '非遗体验',
|
|
type : 'experience',
|
|
},
|
|
{
|
|
name: '我要研学',
|
|
type : 'Study',
|
|
},
|
|
{
|
|
name: '文创好物',
|
|
},
|
|
],
|
|
type : [],
|
|
mixinsListApi : 'queryCollectionList',
|
|
options: [
|
|
{
|
|
text: '删除',
|
|
style: {
|
|
backgroundColor: '#FA5A0A'
|
|
}
|
|
},
|
|
],
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.queryParams.collectionType = 0
|
|
},
|
|
onShow() {
|
|
this.getData()
|
|
},
|
|
computed : {
|
|
|
|
},
|
|
methods: {
|
|
leftClick(){
|
|
uni.navigateBack(-1)
|
|
},
|
|
clickTabs({ index }){
|
|
this.queryParams.collectionType = index
|
|
this.getData()
|
|
},
|
|
toUrl(item){
|
|
let type = this.tabs[item.collectionType].type
|
|
if([0, 1, 3].includes(item.collectionType)){
|
|
// 遗产讲述、达人同游、我要跟拍
|
|
uni.navigateTo({
|
|
url: `/pages_order/service/reservationDetail?type=${type}&id=` + item.id
|
|
})
|
|
}else if([2, 5].includes(item.collectionType)){
|
|
// 遗产路径、我要研学
|
|
uni.navigateTo({
|
|
url: `/pages_order/service/StudyAndPathDetail?type=${type}&id=` + item.id
|
|
})
|
|
}else if([4].includes(item.collectionType)){
|
|
// 非遗体验
|
|
uni.navigateTo({
|
|
url: `/pages_order/service/articleDetail?type=${type}&id=` + item.id
|
|
})
|
|
}else if([6].includes(item.collectionType)){
|
|
// 文创好物
|
|
uni.navigateTo({
|
|
url: `/pages_order/product/productDetail?&id=` + item.id
|
|
})
|
|
}
|
|
},
|
|
delModel(item){
|
|
let self = this
|
|
uni.showModal({
|
|
title: '确认删除吗?',
|
|
success(r) {
|
|
if(!r.confirm){
|
|
return
|
|
}
|
|
self.$api('deleteCollection', {
|
|
collectionId : item.id,
|
|
collectionType : item.collectionType
|
|
}, res => {
|
|
self.getData()
|
|
})
|
|
}
|
|
})
|
|
},
|
|
getData(){
|
|
let queryParams = JSON.parse(JSON.stringify(this.queryParams))
|
|
this.$api(this.mixinsListApi, queryParams,
|
|
res => {
|
|
uni.stopPullDownRefresh()
|
|
if(res.code == 200){
|
|
|
|
res.result.forEach(n => {
|
|
n.collectionType = queryParams.collectionType
|
|
})
|
|
|
|
this.list = res.result
|
|
|
|
}
|
|
})
|
|
},
|
|
toPayUrl(item){
|
|
let type = this.tabs[item.collectionType].type
|
|
uni.navigateTo({
|
|
url: `/pages_order/order/orderSubscribe?type=${type}&id=` + item.id
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.card {
|
|
display: flex;
|
|
width: 710rpx;
|
|
margin: 40rpx 20rpx;
|
|
align-items: center;
|
|
position: relative;
|
|
|
|
.iconx{
|
|
position: absolute;
|
|
top: 0rpx;
|
|
right: 20rpx;
|
|
}
|
|
|
|
.card-img {
|
|
height: 270rpx;
|
|
width: 240rpx;
|
|
flex-shrink: 0;
|
|
image {
|
|
height: 100%;
|
|
width: 100%;
|
|
border-radius: 20rpx;
|
|
}
|
|
}
|
|
|
|
.card-content {
|
|
margin-left: 3%;
|
|
font-size: 28rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-around;
|
|
width: 97%;
|
|
|
|
.title{
|
|
max-width: 260rpx;
|
|
}
|
|
|
|
.card-content-img {
|
|
display: flex;
|
|
margin-left: 10rpx;
|
|
width: 130rpx;
|
|
height: 50rpx;
|
|
}
|
|
|
|
.card-content-tag {
|
|
display: inline-block;
|
|
font-size: 24rpx;
|
|
padding: 2rpx 20rpx;
|
|
border: 2rpx solid #FBA21E;
|
|
background-color: #FFF1D2;
|
|
color: #FBAF35;
|
|
border-radius: 20rpx;
|
|
width: fit-content;
|
|
}
|
|
|
|
.tips{
|
|
font-size: 24rpx;
|
|
color: #999;
|
|
}
|
|
|
|
.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: 12rpx 30rpx;
|
|
border-radius: 40rpx;
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
}
|
|
|
|
view {
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|