|
|
@@ -0,0 +1,983 @@
|
|
|
+<template>
|
|
|
+ <view class="container">
|
|
|
+ <navbar :config="config" backColor="#666"></navbar>
|
|
|
+ <view id="page-top">
|
|
|
+ <view class="product">
|
|
|
+ <view class="u-bg-fff pb40">
|
|
|
+ <view class="pic">
|
|
|
+ <swiper
|
|
|
+ class="swiper"
|
|
|
+ indicator-dots="true"
|
|
|
+ :autoplay="true"
|
|
|
+ interval="2000"
|
|
|
+ duration="1500"
|
|
|
+ circular="true"
|
|
|
+ >
|
|
|
+ <swiper-item v-if="dataForm.video_url">
|
|
|
+ <j-video
|
|
|
+ class="jvideo"
|
|
|
+ :url="dataForm.video_url"
|
|
|
+ width="750rpx"
|
|
|
+ height="620rpx"
|
|
|
+ ></j-video>
|
|
|
+ </swiper-item>
|
|
|
+ <swiper-item v-for="(item, index) in imglist" :key="index">
|
|
|
+ <image :src="item" mode="aspectFill"></image>
|
|
|
+ </swiper-item>
|
|
|
+ </swiper>
|
|
|
+
|
|
|
+ <view class="p-price">
|
|
|
+ <view class="pd24 u-flex-center" style="align-items: baseline">
|
|
|
+ <view class="u-FFF u-font36">
|
|
|
+ <rich-text
|
|
|
+ :nodes="$mUtil.priceBigSmallTwo(dataForm.min_price)"
|
|
|
+ ></rich-text>
|
|
|
+ </view>
|
|
|
+ <text class="discount u-font24 u-ml20 u-del"
|
|
|
+ >¥{{ dataForm.max_sale_price }}</text
|
|
|
+ >
|
|
|
+ </view>
|
|
|
+ <view class="p-ab u-flex-center">
|
|
|
+ <view class="triangle-bottomright"></view>
|
|
|
+ <view class="seckill u-text-center u-font28">
|
|
|
+ <!-- active_state 0:未开始 * 1:进行中 * 2:已结束 -->
|
|
|
+
|
|
|
+ <view class="u-bold" v-if="dataForm.active_state == 1"
|
|
|
+ >距结束</view
|
|
|
+ >
|
|
|
+
|
|
|
+ <view
|
|
|
+ class="u-bold"
|
|
|
+ v-if="
|
|
|
+ dataForm.active_state == 0 || dataForm.active_state == 2
|
|
|
+ "
|
|
|
+ >已结束</view
|
|
|
+ >
|
|
|
+ <view v-if="dataForm.active_state != 2">
|
|
|
+ <uni-countdown
|
|
|
+ :backgroundColor="'none'"
|
|
|
+ @timeup="overDown1"
|
|
|
+ :color="'#3775F6'"
|
|
|
+ :splitorColor="'#3775F6'"
|
|
|
+ :show-day="time1[0] > 0"
|
|
|
+ :day="time1[0]"
|
|
|
+ :hour="time1[1]"
|
|
|
+ :minute="time1[2]"
|
|
|
+ :second="time1[3]"
|
|
|
+ ></uni-countdown>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="mt10 u-plr30">
|
|
|
+ <view>
|
|
|
+ <view
|
|
|
+ v-if="shop.platform_shop"
|
|
|
+ class="tipsStatus"
|
|
|
+ style="vertical-align: middle"
|
|
|
+ >自营</view
|
|
|
+ >
|
|
|
+ <text class="u-font34 u-bold u-1A1A1A">{{
|
|
|
+ dataForm.title
|
|
|
+ }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="u-font24 u-mt15 u-999">
|
|
|
+ <text
|
|
|
+ >已售
|
|
|
+ <text class="u-FF0000">{{ dataForm.result_sale_num }}</text
|
|
|
+ >件,仅剩<text class="u-FF0000">{{
|
|
|
+ dataForm.residue_stock_total
|
|
|
+ }}</text
|
|
|
+ >件</text
|
|
|
+ >
|
|
|
+ </view>
|
|
|
+ <!--优惠-->
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="u-bg-fff u-mt10">
|
|
|
+ <view class="u-plr30 u-flex-center-sb pt-pb35">
|
|
|
+ <view class="u-flex-center" @click="goShop">
|
|
|
+ <view>
|
|
|
+ <image class="u-avatar104" :src="shop.logo"></image>
|
|
|
+ </view>
|
|
|
+ <view class="u-ml25">
|
|
|
+ <view class="u-font28 u-1A1A1A u-bold"
|
|
|
+ >{{ shop.shop_name }}
|
|
|
+ </view>
|
|
|
+ <view class="u-999 u-font24 u-mt5 u-text2">
|
|
|
+ <text
|
|
|
+ class="iconfont"
|
|
|
+ style="color: #00bf5a"
|
|
|
+ @click.stop="goLocal"
|
|
|
+ ></text
|
|
|
+ >
|
|
|
+ {{ shop.province_name }}{{ shop.city_name }}{{ shop.area_name
|
|
|
+ }}{{ shop.address }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="iconfont" @click="goShop"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="u-bg-fff u-mt10">
|
|
|
+ <view
|
|
|
+ class="tab u-flex-center-sa u-font30 u-1A1A1A u-border-one-one"
|
|
|
+ :style="[{ top: `calc(${statusBarHeight}px + 44px)` }]"
|
|
|
+ >
|
|
|
+ <view
|
|
|
+ @tap="change(0)"
|
|
|
+ class="pb30"
|
|
|
+ :class="{ active: isChecked == 0 }"
|
|
|
+ >商品详情</view
|
|
|
+ >
|
|
|
+ <view
|
|
|
+ @tap="change(1)"
|
|
|
+ class="pb30"
|
|
|
+ :class="{ active: isChecked == 1 }"
|
|
|
+ >用户评论({{ commentListLength }})</view
|
|
|
+ >
|
|
|
+ </view>
|
|
|
+ <view class="u-mt10">
|
|
|
+ <!--商品详情-->
|
|
|
+ <view v-if="isChecked == 0">
|
|
|
+ <view class="richText ql-editor-box">
|
|
|
+ <u-parse
|
|
|
+ class="custom-parse"
|
|
|
+ :html="goodsInfo.mobile_detail"
|
|
|
+ ></u-parse>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!--评论-->
|
|
|
+ <view class="u-plr30" v-else>
|
|
|
+ <comment :value="commentList"></comment>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view style="height: 170rpx; background-color: white"></view>
|
|
|
+ <view class="bottom-btn u-bg-fff">
|
|
|
+ <view class="pt-pb30 u-plr30 u-flex-center-sb">
|
|
|
+ <button
|
|
|
+ open-type="share"
|
|
|
+ class="u-text-center"
|
|
|
+ style="line-height: normal; margin-left: 25rpx"
|
|
|
+ >
|
|
|
+ <view class="iconfont2 u-font44 u-999"></view>
|
|
|
+ <view class="u-font28 u-1A1A1A">分享</view>
|
|
|
+ </button>
|
|
|
+
|
|
|
+ <!--秒杀按钮-->
|
|
|
+ <view class="seckill-btn" v-if="dataForm.active_state == 0">
|
|
|
+ <button v-if="ispay" class="u-btn-two u-DCCDA4" @click="notStarted()">
|
|
|
+ 立即购买
|
|
|
+ </button>
|
|
|
+ </view>
|
|
|
+ <view class="seckill-btn" v-if="dataForm.active_state == 1">
|
|
|
+ <button
|
|
|
+ v-if="ispay"
|
|
|
+ class="u-btn-two u-DCCDA4"
|
|
|
+ @click="buy(1, dataForm.id)"
|
|
|
+ >
|
|
|
+ 立即购买
|
|
|
+ </button>
|
|
|
+ </view>
|
|
|
+ <view class="seckill-btn" v-if="dataForm.active_state == 2">
|
|
|
+ <button
|
|
|
+ v-if="ispay"
|
|
|
+ class="u-btn-two u-DCCDA4"
|
|
|
+ @click="itSover(1, dataForm.id)"
|
|
|
+ >
|
|
|
+ 立即购买
|
|
|
+ </button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!--规格-->
|
|
|
+ <uv-popup type="bottom" ref="specOpenRef">
|
|
|
+ <view class="u-bg-fff spec">
|
|
|
+ <view class="u-plr30 flex-sb u-border-one-one pb30">
|
|
|
+ <view class="u-flex-center">
|
|
|
+ <image
|
|
|
+ class="u-goods200"
|
|
|
+ :src="choseConfig.cover ? choseConfig.cover : cover"
|
|
|
+ ></image>
|
|
|
+ <view class="u-ml20">
|
|
|
+ <view class="u-999 u-font24 u-flex-center">
|
|
|
+ <view class="u-00BF5A u-font36">
|
|
|
+ <rich-text
|
|
|
+ :nodes="
|
|
|
+ $mUtil.priceBigSmall(
|
|
|
+ choseConfig.activity_price
|
|
|
+ ? choseConfig.activity_price
|
|
|
+ : moPrice
|
|
|
+ )
|
|
|
+ "
|
|
|
+ ></rich-text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <text class="u-del u-ml15"
|
|
|
+ >¥{{
|
|
|
+ choseConfig.market_price
|
|
|
+ ? choseConfig.market_price
|
|
|
+ : moDelPrice
|
|
|
+ }}
|
|
|
+ </text>
|
|
|
+ </view>
|
|
|
+ <view class="u-font22 u-999 u-mt5"
|
|
|
+ >活动库存 {{ stock }} 件
|
|
|
+ <text
|
|
|
+ >商品库存{{
|
|
|
+ choseConfig.able_stock
|
|
|
+ ? choseConfig.able_stock
|
|
|
+ : goods_total_stock
|
|
|
+ }}</text
|
|
|
+ >
|
|
|
+ </view>
|
|
|
+ <view class="u-1A1A1A u-mt25"
|
|
|
+ >{{
|
|
|
+ choseConfig.sku_set_name ? choseConfig.sku_set_name : "请选择"
|
|
|
+ }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="iconfont u-999 closeIcon" @click="specOpenRef.close()"
|
|
|
+ ></view
|
|
|
+ >
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view>
|
|
|
+ <view class="">
|
|
|
+ <view
|
|
|
+ class="u-mt30"
|
|
|
+ v-for="(item, index) in skuTab"
|
|
|
+ :key="item.head.id"
|
|
|
+ >
|
|
|
+ <view class="u-plr30">{{ item.head.name }}</view>
|
|
|
+ <view class="u-mt20 u-border-one-one pb30">
|
|
|
+ <view class="u-plr30 u-flex u-flex-warp">
|
|
|
+ <view
|
|
|
+ class="spec-item"
|
|
|
+ :class="childrenItem.flag ? 'activeColor' : ''"
|
|
|
+ @click="chonseSku(index, childrenItem.id)"
|
|
|
+ v-for="childrenItem in item.values"
|
|
|
+ :key="childrenItem.id"
|
|
|
+ >{{ childrenItem.name }}</view
|
|
|
+ >
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="u-plr30 u-mt30">
|
|
|
+ <view class="u-flex-center-sb">
|
|
|
+ <view>购买数量</view>
|
|
|
+ <view class="u-flex-center">
|
|
|
+ <view class="iconfont minus" @click="resNum"></view>
|
|
|
+ <view class="num">{{ add_num }}</view>
|
|
|
+ <view class="iconfont plus-sign" @click="addNum"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="specOpen-btn">
|
|
|
+ <view v-if="btnType == 0">
|
|
|
+ <button class="u-btn-two" @click="btnBuy(btnType)">
|
|
|
+ {{ btnName }}
|
|
|
+ </button>
|
|
|
+ </view>
|
|
|
+ <view v-else>
|
|
|
+ <button class="u-btn-two" @click="btnBuy(btnType)">
|
|
|
+ {{ btnName }}
|
|
|
+ </button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </uv-popup>
|
|
|
+ <!--页面加载动画-->
|
|
|
+ <ldLoading isFullScreen :active="loading"></ldLoading>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref } from "vue";
|
|
|
+import { onShareAppMessage, onShow, onLoad } from "@dcloudio/uni-app";
|
|
|
+import comment from "@/components/ld-comment/ld-comment.vue";
|
|
|
+
|
|
|
+const $http = uni.$http;
|
|
|
+const $mUtil = uni.$mUtil;
|
|
|
+const specOpenRef = ref(null);
|
|
|
+// 手机状态栏高度
|
|
|
+const statusBarHeight = ref(uni.getSystemInfoSync().statusBarHeight);
|
|
|
+
|
|
|
+const imglist = ref([]); // 详情图片数组
|
|
|
+const isChecked = ref(0);
|
|
|
+const btnName = ref("");
|
|
|
+const btnType = ref(""); // 0 购物车,1 立即购买
|
|
|
+const dataForm = ref({}); // 商品详情
|
|
|
+const shop = ref({}); // 店铺信息
|
|
|
+const shopDiscounts = ref({}); // 店铺首单优惠
|
|
|
+const stock = ref(0);
|
|
|
+const goods_total_stock = ref(0);
|
|
|
+const cover = ref("");
|
|
|
+const loading = ref(true);
|
|
|
+const moDelPrice = ref("");
|
|
|
+const moPrice = ref("");
|
|
|
+const goodsSkuList = ref([]); // sku 组合值
|
|
|
+const skuTab = ref([]); // sku 二位数组
|
|
|
+const goods_id = ref(null);
|
|
|
+const limit_buy_num = ref(0);
|
|
|
+const choseConfig = ref({});
|
|
|
+const hasId = ref("");
|
|
|
+const add_num = ref(1);
|
|
|
+const goStatus = ref(0); // 0: 购物车,1 下单
|
|
|
+const shop_id = ref(0);
|
|
|
+const commentList = ref([]);
|
|
|
+const commentListLength = ref(0);
|
|
|
+const goodsInfo = ref({});
|
|
|
+const time1 = ref([0, 0, 0, 0]);
|
|
|
+const ispay = ref(getApp().globalData.openPay);
|
|
|
+const able_stock = ref(0);
|
|
|
+
|
|
|
+// 生命周期
|
|
|
+onShow(() => {});
|
|
|
+
|
|
|
+onLoad((options) => {
|
|
|
+ // 当用户进来有缓存店铺
|
|
|
+
|
|
|
+ // 店铺推荐(商品)
|
|
|
+ if (options.id) {
|
|
|
+ getDetailInfo(options.id);
|
|
|
+ }
|
|
|
+ if (options.shareId) {
|
|
|
+ recordSave(options.shareId, options.id);
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
+onShareAppMessage(() => {
|
|
|
+ let user = uni.getStorageSync("personal");
|
|
|
+ if (res.from === "button") {
|
|
|
+ // 来自页面内分享按钮
|
|
|
+ console.log(res.target);
|
|
|
+ }
|
|
|
+
|
|
|
+ return {
|
|
|
+ title: dataForm.value.title,
|
|
|
+ imageUrl: dataForm.value.cover,
|
|
|
+ path: `/pages/product/goods/seckillGoods?id=${
|
|
|
+ dataForm.value.id
|
|
|
+ }&share=1&shareId=${user.id || ""}`,
|
|
|
+ };
|
|
|
+});
|
|
|
+
|
|
|
+// 方法
|
|
|
+const notStarted = () => {
|
|
|
+ uni.$uv.toast("活动尚未开始");
|
|
|
+};
|
|
|
+
|
|
|
+const itSover = () => {
|
|
|
+ uni.$uv.toast("活动已结束");
|
|
|
+};
|
|
|
+
|
|
|
+const goLocal = () => {
|
|
|
+ uni.openLocation({
|
|
|
+ latitude: Number(shop.value.tx_latitude),
|
|
|
+ longitude: Number(shop.value.tx_longitude),
|
|
|
+ name: shop.value.name,
|
|
|
+ address: shop.value.address,
|
|
|
+ success: function () {
|
|
|
+ console.log("success");
|
|
|
+ },
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+const goShop = () => {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: "/pages/convenienceService/shopDetails?shopId=" + shop_id.value,
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+const recordSave = (share_user_id, goods_id) => {
|
|
|
+ $http
|
|
|
+ .post("/share/record/save", {
|
|
|
+ share_user_id: share_user_id,
|
|
|
+ goods_id: goods_id,
|
|
|
+ })
|
|
|
+ .then((res) => {});
|
|
|
+};
|
|
|
+
|
|
|
+const getDetailInfo = (id) => {
|
|
|
+ $http.get("/marketing/seckillActivityGoods/info/" + id).then((res) => {
|
|
|
+ loading.value = false;
|
|
|
+ if (res && res.code == 200) {
|
|
|
+ dataForm.value = res.data;
|
|
|
+ shop_id.value = res.data.shop_id;
|
|
|
+ $http
|
|
|
+ .get("/marketing/firstOrder/getByShop/" + shop_id.value)
|
|
|
+ .then((res) => {
|
|
|
+ if (res && res.code == 200) {
|
|
|
+ shopDiscounts.value = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ $http.get("/yxt/shop/info/" + shop_id.value).then((res) => {
|
|
|
+ if (res.data && res.code == 200) {
|
|
|
+ shop.value = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ imglist.value = res.data.cover.split(",");
|
|
|
+
|
|
|
+ if (res.data.active_state == 0 || res.data.active_state == 2) {
|
|
|
+ time1.value = $mUtil
|
|
|
+ .countDown(res.data.will_start_time)
|
|
|
+ .split(":")
|
|
|
+ .map((val) => Number(val));
|
|
|
+ } else {
|
|
|
+ time1.value = $mUtil
|
|
|
+ .countDown(res.data.finish_time)
|
|
|
+ .split(":")
|
|
|
+ .map((val) => Number(val));
|
|
|
+ }
|
|
|
+ $http.get(`/goods/content/${dataForm.value.goods_id}`).then((res) => {
|
|
|
+ if (res && res.code == 200) {
|
|
|
+ goodsInfo.value = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ $http
|
|
|
+ .get(`/comment/orderGoods/getgoodscomments/${dataForm.value.goods_id}`)
|
|
|
+ .then((res) => {
|
|
|
+ if (res && res.code == 200) {
|
|
|
+ commentList.value = res.list;
|
|
|
+ commentListLength.value =
|
|
|
+ res.list && res.list.length ? res.list.length : 0;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+const change = (i) => {
|
|
|
+ isChecked.value = i;
|
|
|
+};
|
|
|
+
|
|
|
+const buy = (i, id) => {
|
|
|
+ btnType.value = i;
|
|
|
+ checkSku(id);
|
|
|
+ if (i == 0) {
|
|
|
+ btnName.value = "加入购物车";
|
|
|
+ } else {
|
|
|
+ btnName.value = "立即购买";
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+const resNum = () => {
|
|
|
+ if (add_num.value > 1) {
|
|
|
+ add_num.value--;
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+const addNum = () => {
|
|
|
+ add_num.value++;
|
|
|
+};
|
|
|
+
|
|
|
+const chonseSku = (index, id) => {
|
|
|
+ skuTab.value[index].values.forEach((res) => {
|
|
|
+ res.flag = false;
|
|
|
+ if (res.id == id) {
|
|
|
+ res.flag = true;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ let choseId = [];
|
|
|
+ skuTab.value.forEach((res) => {
|
|
|
+ res.values.forEach((Key) => {
|
|
|
+ if (Key.flag) {
|
|
|
+ choseId.push(Key.id);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ let totalId = choseId.sort((a, b) => a - b).join("|");
|
|
|
+ hasId.value = totalId;
|
|
|
+ goodsSkuList.value.forEach((res) => {
|
|
|
+ let temp = res.sku_hash_code;
|
|
|
+ let sku_hash_code_val = temp
|
|
|
+ .split("|")
|
|
|
+ .sort((a, b) => a - b)
|
|
|
+ .join("|");
|
|
|
+ if (sku_hash_code_val == totalId) {
|
|
|
+ choseConfig.value = res;
|
|
|
+ stock.value = dataForm.value.real_stock_total;
|
|
|
+ able_stock.value = res.able_stock;
|
|
|
+ }
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+const checkSku = (id) => {
|
|
|
+ $http
|
|
|
+ .get(`/marketing/seckillActivityGoods/skus/${dataForm.value.id}`)
|
|
|
+ .then((res) => {
|
|
|
+ loading.value = false;
|
|
|
+ goods_total_stock.value = res.data.goods_total_stock;
|
|
|
+ if (res && res.code == 200) {
|
|
|
+ choseConfig.value = {};
|
|
|
+ hasId.value = "";
|
|
|
+ res.data.goods.sku_table.forEach((keys) => {
|
|
|
+ keys.values.forEach((val) => {
|
|
|
+ val.flag = false;
|
|
|
+ });
|
|
|
+ });
|
|
|
+ limit_buy_num.value = dataForm.value.limit_buy_num;
|
|
|
+ goods_id.value = dataForm.value.goods_id;
|
|
|
+ goodsSkuList.value = res.data.goods_sku_list;
|
|
|
+ moPrice.value = dataForm.value.min_price;
|
|
|
+ moDelPrice.value = dataForm.value.min_sale_price;
|
|
|
+ cover.value = imglist.value[0];
|
|
|
+ stock.value = dataForm.value.real_stock_total;
|
|
|
+ if (res.data.goods_auth) {
|
|
|
+ if (res.data.goods_auth.added) {
|
|
|
+ specOpenRef.value.open();
|
|
|
+ } else {
|
|
|
+ uni.$uv.toast("该商品已经下架");
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ uni.$uv.toast("没有经营权限");
|
|
|
+ }
|
|
|
+ if (skuTab.value.length == 0) {
|
|
|
+ skuTab.value = res.data.goods.sku_table;
|
|
|
+ for (let i in skuTab.value) {
|
|
|
+ skuTab.value[i].values[0].flag = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ chonseSku(0, skuTab.value[0].values[0].id);
|
|
|
+ }
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+const btnBuys = () => {
|
|
|
+ if (skuTab.value.length > 0 && hasId.value == "") {
|
|
|
+ uni.$uv.toast("请选中 sku");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (add_num.value > limit_buy_num.value && limit_buy_num.value != 0) {
|
|
|
+ uni.$uv.toast("商品限购" + limit_buy_num.value + "件");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ if (goodsSkuList.value.length > 0 && able_stock.value < add_num.value) {
|
|
|
+ uni.$uv.toast("商品库存只有" + able_stock.value + "件");
|
|
|
+ $http
|
|
|
+ .post(`/singlegoods/understockrecord/save`, {
|
|
|
+ shop_id: shop_id.value,
|
|
|
+ goods_id: goods_id.value,
|
|
|
+ single_goods_id: choseConfig.value.single_goods_id,
|
|
|
+ sku_set_name: choseConfig.value.sku_set_name,
|
|
|
+ buy_num: add_num.value,
|
|
|
+ })
|
|
|
+ .then((res) => {});
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ if (goStatus.value == 0) {
|
|
|
+ let data = {
|
|
|
+ goods_id: goods_id.value,
|
|
|
+ sku_hash_code: hasId.value,
|
|
|
+ add_num: add_num.value,
|
|
|
+ source_shop_id: shop_id.value.toString(),
|
|
|
+ };
|
|
|
+ $http.post(`/cart/add`, data).then((res) => {
|
|
|
+ if (res && res.code == 200) {
|
|
|
+ uni.$uv.toast("添加成功");
|
|
|
+ // specOpen.value.close();
|
|
|
+ choseConfig.value = {};
|
|
|
+ add_num.value = 1;
|
|
|
+ cartList();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ psotJson();
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+const psotJson = () => {
|
|
|
+ let dataJson = {};
|
|
|
+ let childArr = [];
|
|
|
+ let parendArr = [];
|
|
|
+ choseConfig.value;
|
|
|
+
|
|
|
+ childArr.push({
|
|
|
+ user_cart_id: 0,
|
|
|
+ activity_goods_id: choseConfig.value.activity_goods_id,
|
|
|
+ goods_id: goods_id.value,
|
|
|
+ num: add_num.value,
|
|
|
+ sku_hash_code: choseConfig.value.sku_hash_code,
|
|
|
+ });
|
|
|
+ parendArr.push({
|
|
|
+ shop_id: shop.value.id,
|
|
|
+ source_shop_id: shop.value.id,
|
|
|
+ activity_id: dataForm.value.seckill_id,
|
|
|
+ sponsor_activity_id: 0,
|
|
|
+ user_remark: "",
|
|
|
+ items: childArr,
|
|
|
+ });
|
|
|
+ dataJson = {
|
|
|
+ is_cart: false,
|
|
|
+ receipt_id: null,
|
|
|
+ shipment_mode: 0,
|
|
|
+ shop_orders: parendArr,
|
|
|
+ marketing_type: 1,
|
|
|
+ };
|
|
|
+ uni.setStorageSync("dataJson", dataJson);
|
|
|
+ uni.navigateTo({
|
|
|
+ url: "../surePay/surePaySechill",
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+const btnBuy = (i) => {
|
|
|
+ goStatus.value = i;
|
|
|
+ let token = uni.getStorageSync("apiToken");
|
|
|
+ if (!token) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: "/pages/login/index",
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ btnBuys();
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+const cartList = () => {
|
|
|
+ // 实现购物车逻辑
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.pd24 {
|
|
|
+ padding: 24rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.pd20 {
|
|
|
+ padding: 20rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.pt20-pb14 {
|
|
|
+ padding-top: 20rpx;
|
|
|
+ padding-bottom: 14rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.pt28-pb18 {
|
|
|
+ padding-top: 28rpx;
|
|
|
+ padding-bottom: 18rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.pb30 {
|
|
|
+ padding-bottom: 30rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.pb40 {
|
|
|
+ padding-bottom: 40rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.pb50 {
|
|
|
+ padding-bottom: 50rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.pt-pb30 {
|
|
|
+ padding-top: 30rpx;
|
|
|
+ padding-bottom: 30rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.pt-pb35 {
|
|
|
+ padding-top: 35rpx;
|
|
|
+ padding-bottom: 35rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.ml54 {
|
|
|
+ margin-left: 54rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.ml138 {
|
|
|
+ margin-left: 138rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.br-rd10 {
|
|
|
+ border-radius: 10rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.br-rd20 {
|
|
|
+ border-radius: 20rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.stb-btn {
|
|
|
+ padding: 8rpx 18rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.br-FF0000 {
|
|
|
+ border: 1rpx solid #00bf5a;
|
|
|
+ border-radius: 24rpx;
|
|
|
+ padding: 6rpx 12rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.bg-FFF6EE {
|
|
|
+ background-color: #fff6ee;
|
|
|
+}
|
|
|
+
|
|
|
+.mt80 {
|
|
|
+ margin-top: 80rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.mt10 {
|
|
|
+ margin-top: 10rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.product {
|
|
|
+ // padding-bottom: 150rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.pic {
|
|
|
+ width: 100%;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .swiper {
|
|
|
+ // height: 620rpx;
|
|
|
+ height: 100vw;
|
|
|
+
|
|
|
+ video {
|
|
|
+ width: 100%;
|
|
|
+ // height: 620rpx;
|
|
|
+ height: 100vw;
|
|
|
+ }
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 100%;
|
|
|
+ // height: 620rpx;
|
|
|
+ height: 100vw;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .p-price {
|
|
|
+ width: 100%;
|
|
|
+ // position: absolute;
|
|
|
+ top: 460rpx;
|
|
|
+ // background: linear-gradient(90deg,#20a733, #0a824b);
|
|
|
+ background: #00bf5a;
|
|
|
+ border-radius: 20rpx 20rpx 0px 0px;
|
|
|
+ position: relative;
|
|
|
+ top: -16rpx;
|
|
|
+
|
|
|
+ .discount {
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.richText {
|
|
|
+ padding: 30rpx;
|
|
|
+
|
|
|
+ ::v-deep img {
|
|
|
+ margin-top: 0 !important;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+//秒杀,拼团样式
|
|
|
+.p-ab {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.stb-list {
|
|
|
+ padding-bottom: 10rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.triangle-bottomright {
|
|
|
+ width: 0;
|
|
|
+ height: 0;
|
|
|
+ border-bottom: 105rpx solid #dccda4;
|
|
|
+ border-left: 60rpx solid transparent;
|
|
|
+}
|
|
|
+
|
|
|
+.seckill {
|
|
|
+ background-color: #dccda4;
|
|
|
+ color: #00bf5a;
|
|
|
+ padding: 12rpx 15rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-radius: 5rpx 20rpx 0px 0px;
|
|
|
+ text-align: center;
|
|
|
+ // width: 150rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.seckill-btn {
|
|
|
+ width: 76%;
|
|
|
+}
|
|
|
+
|
|
|
+.br-284534 {
|
|
|
+ border-bottom: 1rpx solid rgba($color: #284534, $alpha: 0.3);
|
|
|
+}
|
|
|
+
|
|
|
+.gb-te {
|
|
|
+ padding-top: 20rpx;
|
|
|
+ padding-bottom: 15rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.gb-btn {
|
|
|
+ padding: 18rpx 80rpx 8rpx;
|
|
|
+ line-height: 30rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.btn-bg-dccda4 {
|
|
|
+ background: #dccda4;
|
|
|
+ border-radius: 48rpx 0rpx 0rpx 48rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.btn-bg-00321E {
|
|
|
+ background: #0b844a;
|
|
|
+ border-radius: 0px 48px 48px 0px;
|
|
|
+}
|
|
|
+
|
|
|
+.tab {
|
|
|
+ position: sticky;
|
|
|
+ top: 0;
|
|
|
+ background-color: #fff;
|
|
|
+ padding-top: 38rpx;
|
|
|
+ z-index: 9;
|
|
|
+
|
|
|
+ .pb30 {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ content: "";
|
|
|
+ position: absolute;
|
|
|
+ left: 50%;
|
|
|
+ bottom: 0;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ width: 0;
|
|
|
+ height: 2px;
|
|
|
+ background: #00bf5a;
|
|
|
+ transition: all 0.3s;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.active {
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #00bf5a;
|
|
|
+ font-weight: 700;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.bottom-btn {
|
|
|
+ width: 100%;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ z-index: 9;
|
|
|
+ border-top: 1rpx solid #e6e6e6;
|
|
|
+
|
|
|
+ .cart {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .number {
|
|
|
+ position: absolute;
|
|
|
+ top: -10rpx;
|
|
|
+ left: 45rpx;
|
|
|
+ padding: 4rpx 8rpx;
|
|
|
+ background-color: #ff0000;
|
|
|
+ border: 4rpx solid #ffffff;
|
|
|
+ border-radius: 40rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .cart-btn {
|
|
|
+ width: 230rpx;
|
|
|
+ height: 85rpx;
|
|
|
+ background: #dccda4;
|
|
|
+ border-radius: 43rpx 0rpx 0rpx 43rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .buy-btn {
|
|
|
+ width: 230rpx;
|
|
|
+ height: 85rpx;
|
|
|
+ line-height: 85rpx;
|
|
|
+ background: #0b844a;
|
|
|
+ border-radius: 0rpx 43rpx 43rpx 0rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.flex-sb {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+
|
|
|
+//弹窗
|
|
|
+.spec {
|
|
|
+ border-radius: 18rpx 18rpx 0rpx 0rpx;
|
|
|
+ padding-top: 30rpx;
|
|
|
+ max-height: 900rpx;
|
|
|
+ overflow-y: auto;
|
|
|
+
|
|
|
+ .spec-item {
|
|
|
+ background-color: #f6f6f6;
|
|
|
+ border: 1px solid #f6f6f6;
|
|
|
+ padding: 12rpx 30rpx;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #1a1a1a;
|
|
|
+ border-radius: 4px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .activeColor {
|
|
|
+ background-color: #e1e6e3;
|
|
|
+ border: 1px solid #3775f6;
|
|
|
+ color: #00bf5a;
|
|
|
+ border-radius: 4px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .spec-item:not(:last-child) {
|
|
|
+ margin-right: 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ //减号
|
|
|
+ .minus {
|
|
|
+ width: 50rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ line-height: 50rpx;
|
|
|
+ text-align: center;
|
|
|
+ background: #dedede;
|
|
|
+ border-radius: 8rpx 0rpx 0rpx 8rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .num {
|
|
|
+ width: 74rpx;
|
|
|
+ height: 46rpx;
|
|
|
+ line-height: 46rpx;
|
|
|
+ text-align: center;
|
|
|
+ border: 1px solid #dedede;
|
|
|
+ }
|
|
|
+
|
|
|
+ //加号
|
|
|
+ .plus-sign {
|
|
|
+ width: 50rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ line-height: 50rpx;
|
|
|
+ text-align: center;
|
|
|
+ background: #dedede;
|
|
|
+ border-radius: 0rpx 8rpx 8rpx 0rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .specOpen-btn {
|
|
|
+ margin-top: 68rpx;
|
|
|
+ padding-bottom: 34rpx;
|
|
|
+
|
|
|
+ button {
|
|
|
+ background-color: #00bf5a;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|