✨ 商品收藏:商品详情的底部接入
parent
3b5c84f970
commit
9049182843
|
@ -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;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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. 加载优惠劵信息
|
||||||
|
|
|
@ -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({
|
||||||
|
|
Loading…
Reference in New Issue