You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
193 lines
3.8 KiB
193 lines
3.8 KiB
<template>
|
|
<view>
|
|
<view class="card"
|
|
@click="toUrl(type, item)"
|
|
v-for="(item, index) in list" :key="index">
|
|
<view class="card-img">
|
|
<image :src="item.roleHead" mode="aspectFill"></image>
|
|
</view>
|
|
<view class="card-content">
|
|
<view style="display: flex; align-items: center;">
|
|
<view class="title text-ellipsis">{{ item.roleName }}</view>
|
|
<image
|
|
class="card-content-img"
|
|
v-if="showRoleLevel"
|
|
:src="`../../static/tell/goldMedal${item.roleLevel}.png`"></image>
|
|
</view>
|
|
<view class="card-content-tag"
|
|
v-if="item.adPre">
|
|
{{ item.adPre }}
|
|
</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 }}起
|
|
</view>
|
|
<view class="card-content-bottom-one"
|
|
@click.stop="toPayUrl(item)">
|
|
￥线上预约
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<uv-empty
|
|
v-if="total == 0"
|
|
text="空空如也"
|
|
textSize="30rpx"
|
|
iconSize="200rpx"
|
|
icon="list"></uv-empty>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props : {
|
|
type : {
|
|
default : ''
|
|
},
|
|
dict : {
|
|
default : {}
|
|
},
|
|
height : {
|
|
default : 'auto'
|
|
},
|
|
showRoleLevel : {
|
|
default : false,
|
|
},
|
|
result : {
|
|
default : []
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
queryParams: {
|
|
pageNo: 1,
|
|
pageSize: 10,
|
|
},
|
|
total : 0,
|
|
list : [],
|
|
}
|
|
},
|
|
methods: {
|
|
// 0-遗产讲述，1-达人同游，2-我要跟拍
|
|
getList(){
|
|
this.queryParams.pageNo = 1
|
|
|
|
let queryParams = {
|
|
...this.queryParams,
|
|
roleId : this.dict.roleId,
|
|
}
|
|
|
|
this.result.forEach(n => {
|
|
queryParams[n.name] = n.value
|
|
})
|
|
|
|
this.$api('queryRoleInfoList', queryParams, res => {
|
|
uni.stopPullDownRefresh()
|
|
if(res.code == 200){
|
|
this.list = res.result.records
|
|
this.total = res.result.total
|
|
}
|
|
})
|
|
},
|
|
loadMoreList(){
|
|
if(this.queryParams.pageSize < this.total){
|
|
this.queryParams.pageSize += 10
|
|
this.getList()
|
|
}
|
|
},
|
|
toUrl(type, item){
|
|
console.log(item.id);
|
|
let url = `/pages_order/service/reservationDetail?type=${type}&id=` + item.id
|
|
this.$utils.navigateTo(url)
|
|
},
|
|
toPayUrl(item){
|
|
uni.navigateTo({
|
|
url: `/pages_order/order/orderSubscribe?type=${this.type}&id=${item.id}`
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.card {
|
|
display: flex;
|
|
width: 94%;
|
|
margin: 40rpx 0 0 3%;
|
|
align-items: center;
|
|
|
|
.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>
|