shang/yfs
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

收藏组件

Browse Source
This commit is contained in:
zpc 2025-03-23 02:24:11 +08:00
parent 846aa96fa9
commit 7512cb366b
3 changed files with 90 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
components/collect-btn/collect-btn.vue Normal file
View File

@ -0,0 +1,80 @@
<template>
<view class="collect-btn justify-center" :style="customStyle" @tap="toggleCollect">
<image :src="isCollected ? $img1('index/sc1.png') : $img1('index/sc2.png')"></image>
<text>收藏</text>
</view>
</template>
<script>
export default {
name: 'CollectBtn',
props: {
goodsId: {
type: [Number, String],
required: true
},
goodsNum: {
type: [Number, String],
required: true
},
isCollected: {
type: Boolean,
default: false
},
customStyle: {
type: String,
default: 'position: absolute; right: 0; top: 232rpx; margin-right: 48rpx;'
}
},
data() {
return {
collecting: false
}
},
methods: {
toggleCollect() {
if (this.collecting) return;
this.collecting = true;
this.req({
url: 'addCollect',
data: {
goods_id: this.goodsId,
goods_num: this.goodsNum
},
success: res => {
if (res.status == 1) {
this.$emit('collection-changed', !this.isCollected);
}
},
complete: () => {
this.collecting = false;
}
})
}
}
}
</script>
<style lang="scss">
.collect-btn {
width: 65rpx;
height: 95rpx;
box-sizing: border-box;
flex-direction: column;
> image {
width: 64rpx;
height: 64rpx;
}
> text {
width: 100%;
text-align: center;
font-weight: 400;
font-size: 20rpx;
color: #FFFFFF;
margin-top: 4rpx;
text-shadow: #000 1px 0 0, #000 0 1px 0, #000 -1px 0 0, #000 0 -1px 0;
}
}
</style>

3
pages.json
View File

@ -1,6 +1,7 @@
{
"easycom": {
"^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
"^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue",
"^collect-btn$": "@/components/collect-btn/collect-btn.vue"
},
"pages": [{
"path": "pages/shouye/index",

75
pages/shouye/detail.vue
View File

@ -37,16 +37,12 @@
<template v-if="pageData.goods.type != 5">/含明信片</template>
</text>
</view>
<view class="header-shoucang justify-center" style=" flex-direction: column; margin-right: 48rpx;"
@tap="toggleCollect">
<image :src="pageData.goods.collection_is?$img1('index/sc1.png'):$img1('index/sc2.png')"></image>
<text>收藏</text>
</view>
<collect-btn
v-if="pageData && pageData.goods" :goods-id="pageData.goods.id"
:goods-num="pageData.goods.num"
:is-collected="pageData.goods.collection_is"
@collection-changed="onCollectionChanged"
></collect-btn>
</view>
<view class="spylView" v-if="tabCur == 1 && pageData">
<view class="" style="display: flex; flex-direction: row; margin-left: 32rpx; margin-top: 56rpx;">
@ -136,7 +132,6 @@
<template v-if="tabCur == 2">
<view class="" style="display: flex; flex-direction: row; margin-left: 32rpx; margin-top: 56rpx;">
<view class="" style="width: 160rpx; height: 92rpx;">
<image style="width: 160rpx; height: 92rpx;" v-if="pageData.goods.type == 5"
@ -206,21 +201,6 @@
</mescroll-body>
</template>
<!-- <view class="fixed-btns">
<view class="btn" @click="doRefresh">
<image :src="$img('/static/img/refresh.png')" lazy-load></image>
</view>
<view class="btn relative">
<button class="hide" open-type="share"></button>
<image :src="$img('/static/img/share.png')" lazy-load></image>
</view>
<view class="btn" @click="toBag">
<image :src="$img('/static/img/bag.png')" lazy-load></image>
</view>
</view> -->
<view v-if="pageData" class="ft-fixed justify-evenly">
<view v-if="pageData.goods.type == 3" class="lt-btn" @click="confirmSubmit([0, 1])">
@ -518,7 +498,6 @@
<view v-if="aniShow" class="ani-pop">
<image :src="aniSrc" lazy-load></image>
</view>
<rule-pop ref="rulePop"></rule-pop>
<coupon-pop ref="couponPop"></coupon-pop>
</view>
@ -817,19 +796,8 @@
}
},
toggleCollect() {
this.req({
url: 'addCollect',
data: {
goods_id: this.pageData.goods.id,
goods_num: this.pageData.goods.num
},
success: res => {
if (res.status == 1) {
this.doRefresh()
}
}
})
onCollectionChanged() {
this.doRefresh()
},
toBag() {
@ -1232,33 +1200,6 @@
}
}
&-shoucang {
width: 65rpx;
height: 95rpx;
position: absolute;
right: 0;
top: 232rpx;
box-sizing: border-box;
// background: url($imgurl+'/common/shoucang.png') no-repeat 0 0 / 100% 100%;
>image {
width: 64rpx;
height: 64rpx;
// margin-top: 22rpx;
}
>text {
width: 100%;
text-align: center;
font-weight: 400;
font-size: 20rpx;
color: #FFFFFF;
margin-top: 4rpx;
// line-height: 66rpx;
text-shadow: #000 1px 0 0, #000 0 1px 0, #000 -1px 0 0, #000 0 -1px 0;
}
}
&-footer {
width: 750rpx;
position: absolute;