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.
130 lines
2.5 KiB
130 lines
2.5 KiB
3 years ago
|
<template>
|
||
|
|
<view class="body">
|
||
|
|
<view class="content" >
|
||
|
|
<view class="item" v-for="item in list" :key="item.id" @click="workshow(item.id)">
|
||
|
|
<view class="itempic" :style="{backgroundImage:`url(${item.thumbnail})`}">
|
||
|
|
<view class="left-cover">
|
||
|
|
<image class="collect" src="../../static/277.png" @click.stop="uncollect(item.id)" mode=""></image>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class=" text">
|
||
|
|
{{item.collectionName}}
|
||
|
|
</view>
|
||
|
|
<view class="textname">
|
||
|
|
{{item.artistName}} #{{item.issueNumber}}
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
list:[],
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onShow() {
|
||
|
|
this.mycollect();
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
//查询收藏作品
|
||
|
|
async mycollect() {
|
||
|
|
const res = await this.$myRequest({
|
||
|
|
url: '/api/foreignAuth/collect',
|
||
|
|
header: {
|
||
|
|
token: uni.getStorageSync("token"),
|
||
|
|
Authorization: uni.getStorageSync("Authorization"),
|
||
|
|
},
|
||
|
|
})
|
||
|
|
if (res.data.code == 200) {
|
||
|
|
this.list = res.data.rows
|
||
|
|
}
|
||
|
|
},
|
||
|
|
//取消收藏
|
||
|
|
async uncollect(id) {
|
||
|
|
const res = await this.$myRequest({
|
||
|
|
url: '/api/foreignAuth/cancel?id=' + id,
|
||
|
|
header: {
|
||
|
|
token: uni.getStorageSync("token"),
|
||
|
|
Authorization: uni.getStorageSync("Authorization"),
|
||
|
|
},
|
||
|
|
})
|
||
|
|
if (res.data.code == 200) {
|
||
|
|
uni.showToast({
|
||
|
|
title: "取消收藏成功"
|
||
|
|
})
|
||
|
|
this.mycollect();
|
||
|
|
}else{
|
||
|
|
uni.showToast({
|
||
|
|
title: res.data.msg
|
||
|
|
})
|
||
|
|
}
|
||
|
|
},
|
||
|
|
//跳转作品展示
|
||
|
|
workshow(id){
|
||
|
|
uni.navigateTo({
|
||
|
|
url:"./workshow?id="+id
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss">
|
||
|
|
.body {
|
||
|
|
padding-top: 0rpx;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
background-color: #000000;
|
||
|
|
min-height: 1340rpx;
|
||
|
|
font-family: Arial-Regular;
|
||
|
|
|
||
|
|
.content {
|
||
|
|
display: flex;
|
||
|
|
margin-top: 58rpx;
|
||
|
|
flex-wrap: wrap;
|
||
|
|
|
||
|
|
.item {
|
||
|
|
color: #FFFFFF;
|
||
|
|
width: 324rpx;
|
||
|
|
height: 446rpx;
|
||
|
|
background-color: #1C1C1C;
|
||
|
|
border-radius: 24rpx;
|
||
|
|
margin-left: 36rpx;
|
||
|
|
margin-top: 20rpx;
|
||
|
|
|
||
|
|
.itempic {
|
||
|
|
width: 324rpx;
|
||
|
|
height: 324rpx;
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
background-size: cover;
|
||
|
|
overflow: hidden;
|
||
|
|
border-radius:12rpx;
|
||
|
|
.left-cover{
|
||
|
|
|
||
|
|
image{
|
||
|
|
margin-left: 20rpx;
|
||
|
|
margin-top: 20rpx;
|
||
|
|
width: 36rpx;
|
||
|
|
height: 36rpx;
|
||
|
|
}
|
||
|
|
} }
|
||
|
|
|
||
|
|
.text {
|
||
|
|
font-size: 28rpx;
|
||
|
|
margin-left: 24rpx;
|
||
|
|
margin-top: 16rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.textname {
|
||
|
|
margin-top: 16rpx;
|
||
|
|
font-size: 28rpx;
|
||
|
|
margin-left: 24rpx;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|