商品收藏:商品详情的底部接入

pull/28/head
YunaiV 2023-12-15 09:48:10 +08:00
parent 3b5c84f970
commit 9049182843
3 changed files with 75 additions and 41 deletions

View File

@ -1,3 +1,4 @@
<!-- 商品详情的底部导航 -->
<template> <template>
<su-fixed bottom placeholder bg="bg-white"> <su-fixed bottom placeholder bg="bg-white">
<view class="ui-tabbar-box"> <view class="ui-tabbar-box">
@ -12,7 +13,7 @@
class="item-icon" class="item-icon"
:src="sheep.$url.static('/static/img/shop/goods/collect_1.gif')" :src="sheep.$url.static('/static/img/shop/goods/collect_1.gif')"
mode="aspectFit" mode="aspectFit"
></image> />
<view class="item-title">已收藏</view> <view class="item-title">已收藏</view>
</block> </block>
<block v-else> <block v-else>
@ -20,7 +21,7 @@
class="item-icon" class="item-icon"
:src="sheep.$url.static('/static/img/shop/goods/collect_0.png')" :src="sheep.$url.static('/static/img/shop/goods/collect_0.png')"
mode="aspectFit" mode="aspectFit"
></image> />
<view class="item-title">收藏</view> <view class="item-title">收藏</view>
</block> </block>
</view> </view>
@ -33,7 +34,7 @@
class="item-icon" class="item-icon"
:src="sheep.$url.static('/static/img/shop/goods/message.png')" :src="sheep.$url.static('/static/img/shop/goods/message.png')"
mode="aspectFit" mode="aspectFit"
></image> />
<view class="item-title">客服</view> <view class="item-title">客服</view>
</view> </view>
<view <view
@ -45,7 +46,7 @@
class="item-icon" class="item-icon"
:src="sheep.$url.static('/static/img/shop/goods/share.png')" :src="sheep.$url.static('/static/img/shop/goods/share.png')"
mode="aspectFit" mode="aspectFit"
></image> />
<view class="item-title">分享</view> <view class="item-title">分享</view>
</view> </view>
<slot></slot> <slot></slot>
@ -63,13 +64,11 @@
* @property {String} ui - 自定义样式Class * @property {String} ui - 自定义样式Class
* @property {Boolean} noFixed - 是否定位 * @property {Boolean} noFixed - 是否定位
* @property {Boolean} topRadius - 上圆角 * @property {Boolean} topRadius - 上圆角
*
*
*/ */
import { reactive } from 'vue';
import { computed, reactive } from 'vue';
import sheep from '@/sheep'; import sheep from '@/sheep';
import { showShareModal } from '@/sheep/hooks/useModal'; import { showShareModal } from '@/sheep/hooks/useModal';
import FavoriteApi from '@/sheep/api/product/favorite';
// //
const state = reactive({}); const state = reactive({});
@ -114,25 +113,24 @@
default: true, default: true,
}, },
}); });
const elStyles = computed(() => {
return {
'border-top-left-radius': props.topRadius + 'rpx',
'border-top-right-radius': props.topRadius + 'rpx',
overflow: 'hidden',
};
});
const tabbarheight = (e) => {
uni.setStorageSync('tabbar', e);
};
async function onFavorite() { async function onFavorite() {
const { error } = await sheep.$api.user.favorite.do(props.modelValue.id); //
if (error === 0) {
if (props.modelValue.favorite) { if (props.modelValue.favorite) {
props.modelValue.favorite = 0; const { code } = await FavoriteApi.deleteFavorite(props.modelValue.id);
} else { if (code !== 0) {
props.modelValue.favorite = 1; return
} }
sheep.$helper.toast('取消收藏');
props.modelValue.favorite = false;
//
} else {
const { code } = await FavoriteApi.createFavorite(props.modelValue.id);
if (code !== 0) {
return
}
sheep.$helper.toast('收藏成功');
props.modelValue.favorite = true;
} }
} }

View File

@ -113,6 +113,7 @@
import sheep from '@/sheep'; import sheep from '@/sheep';
import CouponApi from '@/sheep/api/promotion/coupon'; import CouponApi from '@/sheep/api/promotion/coupon';
import ActivityApi from '@/sheep/api/promotion/activity'; import ActivityApi from '@/sheep/api/promotion/activity';
import FavoriteApi from '@/sheep/api/product/favorite';
import { import {
formatSales, formatSales,
formatGoodsSwiper, formatGoodsSwiper,
@ -127,9 +128,7 @@
import detailCommentCard from './components/detail/detail-comment-card.vue'; import detailCommentCard from './components/detail/detail-comment-card.vue';
import detailContentCard from './components/detail/detail-content-card.vue'; import detailContentCard from './components/detail/detail-content-card.vue';
import detailActivityTip from './components/detail/detail-activity-tip.vue'; import detailActivityTip from './components/detail/detail-activity-tip.vue';
import { import { isEmpty } from 'lodash';
isEmpty
} from 'lodash';
onPageScroll(() => {}); onPageScroll(() => {});
@ -153,19 +152,28 @@
// TODO // TODO
function onAddCart(e) { function onAddCart(e) {
if (!e.id) {
sheep.$helper.toast('请选择商品规格');
return;
}
sheep.$store('cart').add(e); sheep.$store('cart').add(e);
} }
// TODO //
function onBuy(e) { function onBuy(e) {
if (!state.selectedSku.id) {
sheep.$helper.toast('请选择商品规格');
return;
}
sheep.$router.go('/pages/order/confirm', { sheep.$router.go('/pages/order/confirm', {
data: JSON.stringify({ data: JSON.stringify({
order_type: 'goods', items: [{
goods_list: [{ skuId: state.selectedSku.id,
goods_id: e.goods_id, count: 1
goods_num: e.goods_num, }],
goods_sku_price_id: e.id, // TODO 2
}, ], deliveryType: 1,
pointStatus: false,
}), }),
}); });
} }
@ -230,6 +238,14 @@
// //
state.skeletonLoading = false; state.skeletonLoading = false;
state.goodsInfo = res.data; state.goodsInfo = res.data;
//
FavoriteApi.isFavoriteExists(state.goodsId, 'goods').then((res) => {
if (res.code !== 0) {
return;
}
state.goodsInfo.favorite = res.data;
});
}); });
// 2. // 2.

View File

@ -9,6 +9,26 @@ const FavoriteApi = {
params: data params: data
}); });
}, },
// 检查是否收藏过商品
isFavoriteExists: (spuId) => {
return request({
url: '/app-api/product/favorite/exits',
method: 'GET',
params: {
spuId
}
});
},
// 添加商品收藏
createFavorite: (spuId) => {
return request({
url: '/app-api/product/favorite/create',
method: 'POST',
data: {
spuId
}
});
},
// 取消商品收藏 // 取消商品收藏
deleteFavorite: (spuId) => { deleteFavorite: (spuId) => {
return request({ return request({