seckillGoods.vue 29 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005
  1. <template>
  2. <view class="container">
  3. <navbar :config="config" backColor="#666"></navbar>
  4. <view id="page-top">
  5. <view class="product">
  6. <view class="u-bg-fff pb40">
  7. <view class="pic">
  8. <!-- <image src="../../../static/delImg/product2.png" mode="aspectFill"></image> -->
  9. <!-- <j-video class="jvideo" :url="dataForm.video_url" width="750rpx" height="620rpx"></j-video> -->
  10. <swiper class="swiper" indicator-dots="true" :autoplay="true" interval="5000" duration="1500"
  11. circular="true">
  12. <swiper-item v-if="dataForm.video_url">
  13. <j-video class="jvideo" :url="dataForm.video_url" width="750rpx" height="620rpx"></j-video>
  14. </swiper-item>
  15. <swiper-item v-for="(item, index) in imglist" :key="index">
  16. <image :src="item" mode="aspectFill"></image>
  17. </swiper-item>
  18. </swiper>
  19. <view class="p-price">
  20. <view class="pd24 u-flex-center" style="align-items: baseline;">
  21. <view class="u-FFF u-font36">
  22. <rich-text :nodes="$mUtil.priceBigSmallTwo(dataForm.min_price)"></rich-text>
  23. </view>
  24. <text class="discount u-font24 u-ml20 u-del">¥{{ dataForm.max_sale_price }}</text>
  25. <!-- <text class="discount u-font24 u-ml15"
  26. >{{ dataForm.discount }}折</text
  27. > -->
  28. </view>
  29. <view class="p-ab u-flex-center">
  30. <view class="triangle-bottomright"></view>
  31. <view class="seckill u-text-center u-font28">
  32. <!-- active_state 0:未开始 * 1:进行中 * 2:已结束 -->
  33. <!-- <view class="u-bold" style="padding: 20rpx;" v-if="dataForm.active_state == 2"
  34. >已结束</view -->
  35. <view class="u-bold" v-if="dataForm.active_state == 1">距结束</view>
  36. <view class="u-bold" v-if="dataForm.active_state == 0||dataForm.active_state == 2">已结束</view>
  37. <view v-if="dataForm.active_state != 2">
  38. <uni-countdown :backgroundColor="'none'" @timeup="overDown1" :color="'#3775F6'"
  39. :splitorColor="'#3775F6'" :show-day="time1[0] > 0" :day="time1[0]" :hour="time1[1]"
  40. :minute="time1[2]" :second="time1[3]"></uni-countdown>
  41. </view>
  42. </view>
  43. </view>
  44. </view>
  45. <view class="mt10 u-plr30">
  46. <view>
  47. <view v-if="shop.platform_shop" class="tipsStatus" style="vertical-align: middle;">自营</view>
  48. <text class="u-font34 u-bold u-1A1A1A">{{ dataForm.title }}</text>
  49. </view>
  50. <view class="u-font24 u-mt15 u-999">
  51. <text>已售
  52. <text class="u-FF0000">{{ dataForm.result_sale_num }}</text>件,仅剩<text class="u-FF0000">{{
  53. dataForm.residue_stock_total
  54. }}</text>件</text>
  55. </view>
  56. <!--优惠-->
  57. <!-- <view
  58. class="bg-FFF6EE pd20 u-mt20 u-flex-center br-rd10"
  59. v-if="shopDiscounts.is_use == true"
  60. >
  61. <view class="u-FF0000 br-FF0000 u-font24">首单优惠</view>
  62. <view class="u-ml15 u-font24 u-CA7E57"
  63. >满{{ shopDiscounts.full }}元减{{
  64. shopDiscounts.reduction
  65. }}元</view
  66. >
  67. </view> -->
  68. </view>
  69. </view>
  70. </view>
  71. <view class="u-bg-fff u-mt10">
  72. <view class="u-plr30 u-flex-center-sb pt-pb35">
  73. <view class="u-flex-center">
  74. <view @click="goShop">
  75. <image class="u-avatar104" :src="shop.logo"></image>
  76. </view>
  77. <view class="u-ml25">
  78. <view class="u-font28 u-1A1A1A u-bold">{{ shop.shop_name }} </view>
  79. <view class="u-999 u-font24 u-mt5 u-text2" @click="goLocal">
  80. <text class="iconfont" style="color: #FA6138;">&#xe6db;</text>
  81. {{ shop.province_name }}{{ shop.city_name }}{{ shop.area_name
  82. }}{{ shop.address }}
  83. </view>
  84. </view>
  85. </view>
  86. <view class="iconfont" @click="goShop">&#xe6c7;</view>
  87. </view>
  88. </view>
  89. </view>
  90. <view class="u-bg-fff u-mt10">
  91. <view class="tab u-flex-center-sa u-font30 u-1A1A1A u-border-one-one"
  92. :style="`top: calc(${statusBarHeight}px + 44px)`">
  93. <view @tap="change(0)" class="pb30" :class="{ active: isChecked == 0 }">商品详情</view>
  94. <view @tap="change(1)" class="pb30" :class="{ active: isChecked == 1 }">用户评论({{ commentList.length }})</view>
  95. </view>
  96. <view class="u-mt10">
  97. <!--商品详情-->
  98. <view v-if="isChecked == 0">
  99. <view class="richText ql-editor-box">
  100. <rich-text :nodes="goodsInfo.mobile_detail"></rich-text>
  101. <!-- <jyf-parser :html="$mUtil.formatRichText(goodsInfo.mobile_detail)" ref="article"></jyf-parser> -->
  102. </view>
  103. </view>
  104. <!--评论-->
  105. <view class="u-plr30" v-else>
  106. <comment :value="commentList"></comment>
  107. </view>
  108. </view>
  109. </view>
  110. </view>
  111. <view style="height:170rpx;background-color:white"></view>
  112. <view class="bottom-btn u-bg-fff">
  113. <view class="pt-pb30 u-plr30 u-flex-center-sb">
  114. <button @click="share" class="u-text-center" style="line-height: normal;margin-left: 25rpx;">
  115. <view class="iconfont2 u-font44 u-999">&#xe684;</view>
  116. <view class="u-font28 u-1A1A1A">分享</view>
  117. </button>
  118. <!--秒杀按钮-->
  119. <view class="seckill-btn" v-if="dataForm.active_state==0">
  120. <button v-if="ispay" class="u-btn-two u-DCCDA4" @click="notStarted()">
  121. 立即购买
  122. </button>
  123. </view>
  124. <view class="seckill-btn" v-if="dataForm.active_state==1">
  125. <button v-if="ispay" class="u-btn-two u-DCCDA4 " @click="buy(1, dataForm.id)">
  126. 立即购买
  127. </button>
  128. </view>
  129. <view class="seckill-btn" v-if="dataForm.active_state==2">
  130. <button v-if="ispay" class="u-btn-two u-DCCDA4 " @click="itSover(1, dataForm.id)">
  131. 立即购买
  132. </button>
  133. </view>
  134. </view>
  135. </view>
  136. <!--规格-->
  137. <uniPopup type="bottom" ref="specOpen">
  138. <view class="u-bg-fff spec">
  139. <view class="u-plr30 flex-sb u-border-one-one pb30">
  140. <view class="u-flex-center">
  141. <image class="u-goods200" :src="choseConfig.cover ? choseConfig.cover : cover"></image>
  142. <view class="u-ml20">
  143. <view class="u-999 u-font24 u-flex-center">
  144. <view class="u-FF0000 u-font36">
  145. <rich-text :nodes="
  146. $mUtil.priceBigSmall(
  147. choseConfig.activity_price
  148. ? choseConfig.activity_price
  149. : moPrice
  150. )
  151. "></rich-text>
  152. </view>
  153. <!-- choseConfig.market_price ? choseConfig.market_price : moDelPrice -->
  154. <text class="u-del u-ml15">¥{{ choseConfig.market_price ? choseConfig.market_price : moDelPrice }}
  155. </text>
  156. <!-- <text class="u-ml10">{{ dataForm.discount }}折</text> -->
  157. </view>
  158. <view class="u-font22 u-999 u-mt5">活动库存 {{ stock }} 件
  159. <text>商品库存{{choseConfig.able_stock?choseConfig.able_stock:goods_total_stock}}</text>
  160. </view>
  161. <view class="u-1A1A1A u-mt25">{{
  162. choseConfig.sku_set_name ? choseConfig.sku_set_name : "请选择"
  163. }}
  164. </view>
  165. </view>
  166. </view>
  167. <view class="iconfont u-999 closeIcon" @click="specOpenClose">&#xe612;</view>
  168. </view>
  169. <view>
  170. <view class="">
  171. <view class="u-mt30" v-for="(item, index) in skuTab" :key="item.head.id">
  172. <view class="u-plr30">{{ item.head.name }}</view>
  173. <view class="u-mt20 u-border-one-one pb30">
  174. <view class="u-plr30 u-flex u-flex-warp">
  175. <view class="spec-item" :class="childrenItem.flag ? 'activeColor' : ''"
  176. @click="chonseSku(index, childrenItem.id)" v-for="childrenItem in item.values"
  177. :key="childrenItem.id">{{ childrenItem.name }}</view>
  178. </view>
  179. </view>
  180. </view>
  181. </view>
  182. <view class="u-plr30 u-mt30">
  183. <view class="u-flex-center-sb">
  184. <view>购买数量</view>
  185. <view class="u-flex-center">
  186. <view class="iconfont minus" @click="resNum">&#xe60b;</view>
  187. <view class="num">{{ add_num }}</view>
  188. <view class="iconfont plus-sign" @click="addNum">&#xe686;</view>
  189. </view>
  190. </view>
  191. <view class="specOpen-btn">
  192. <view v-if="btnType == 0">
  193. <button class="u-btn-two" @click="btnBuy(btnType)">
  194. {{ btnName }}
  195. </button>
  196. </view>
  197. <view v-else>
  198. <button class="u-btn-two" @click="btnBuy(btnType)">
  199. {{ btnName }}
  200. </button>
  201. </view>
  202. </view>
  203. </view>
  204. </view>
  205. </view>
  206. </uniPopup>
  207. <!--页面加载动画-->
  208. <ldLoading isFullScreen :active="loading"></ldLoading>
  209. <share ref="shares" :contentHeight="580" v-if="isvisible"></share>
  210. </view>
  211. </template>
  212. <script>
  213. import uniPopup from "../../../components/uni-popup/uni-popup.vue";
  214. import comment from "../../../components/ld-comment/ld-comment.vue";
  215. import jyfParser from "../../../components/jyf-parser/jyf-parser";
  216. import ImgUpload from "../../../components/uploadImg/imgUpload.vue";
  217. import share from "./../../public/share";
  218. import jVideo from "../../../components/j-video/j-video.vue"
  219. let app = getApp()
  220. export default {
  221. components: {
  222. uniPopup,
  223. comment,
  224. jyfParser,
  225. ImgUpload,
  226. share,
  227. jVideo
  228. },
  229. data() {
  230. return {
  231. //手机状态栏高度
  232. statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
  233. config: {
  234. back: true, //false是tolbar页面 是则不写
  235. title: "商品详情",
  236. color: "#1a1a1a",
  237. //背景颜色;参数一:透明度(0-1);参数二:背景颜色(array则为线性渐变,string为单色背景)
  238. backgroundColor: [1, "#fff"],
  239. backTabPage: "",
  240. },
  241. imglist: [], //详情图片数组
  242. isChecked: 0,
  243. btnName: "",
  244. btnType: "", //0 购物车,1 立即购买
  245. dataForm: {}, //商品详情
  246. shop: {}, //店铺信息
  247. shopDiscounts: {}, //店铺首单优惠
  248. stock: 0,
  249. goods_total_stock: 0,
  250. cover: "",
  251. loading: true,
  252. moDelPrice: "",
  253. moPrice: "",
  254. goodsSkuList: [], //sku组合值
  255. skuTab: [], //sku二位数组
  256. goods_id: null,
  257. limit_buy_num: 0,
  258. choseConfig: {},
  259. hasId: "",
  260. add_num: 1,
  261. goStatus: 0, //0:购物车,1下单
  262. shop_id: 0,
  263. commentList: [],
  264. goodsInfo: {},
  265. isvisible: false,
  266. time1: [0, 0, 0, 0],
  267. ispay: app.globalData.openPay
  268. };
  269. },
  270. onShow() {
  271. var pages = getCurrentPages();
  272. var prevPage = pages[pages.length - 2];
  273. if (prevPage == undefined) {
  274. // this.config.backTabPage = "/pages/research/homepage/lidaPage";
  275. }
  276. },
  277. onLoad(options) {
  278. //当用户进来有缓存店铺
  279. //店铺推荐(商品)
  280. if (options.id) {
  281. this.getDetailInfo(options.id);
  282. }
  283. if (options.shareId) {
  284. this.recordSave(options.shareId, options.id);
  285. }
  286. },
  287. onShareAppMessage(res) {
  288. if (res.from === "button") {
  289. // 来自页面内分享按钮
  290. console.log(res.target);
  291. }
  292. return {
  293. title: this.shareTitle,
  294. imageUrl: this.shareImg,
  295. path: `/pages/product/goods/seckillGoods?id=${this.dataForm.id}`,
  296. };
  297. },
  298. methods: {
  299. notStarted() {
  300. this.$mUtil.toast("活动尚未开始")
  301. },
  302. itSover() {
  303. this.$mUtil.toast("活动已结束")
  304. },
  305. goLocal() {
  306. uni.openLocation({
  307. latitude: Number(this.shop.tx_latitude),
  308. longitude: Number(this.shop.tx_longitude),
  309. name: this.shop.name,
  310. address: this.shop.address,
  311. success: function() {
  312. console.log("success");
  313. },
  314. });
  315. },
  316. goShop() {
  317. uni.navigateTo({
  318. url: "/pages/convenienceService/shopDetails?shopId=" + this.shop_id,
  319. });
  320. },
  321. recordSave(share_user_id, goods_id) {
  322. this.$http
  323. .post("/share/record/save", {
  324. share_user_id: share_user_id,
  325. goods_id: goods_id,
  326. })
  327. .then((res) => {});
  328. },
  329. share() {
  330. this.isvisible = false
  331. let token = uni.getStorageSync("apiToken");
  332. if (!token) {
  333. uni.navigateTo({
  334. url: "/pages/login/index",
  335. });
  336. } else {
  337. let user = uni.getStorageSync("personal");
  338. this.isvisible = true;
  339. this.$nextTick(() => {
  340. this.$refs.shares.shareInfo(
  341. "/?pageType=1&type=2&id=" + this.dataForm.id + "&shareId=" + user.id,
  342. 'pages/down',
  343. this.dataForm.title,
  344. "",
  345. this.dataForm.cover
  346. );
  347. });
  348. }
  349. },
  350. // 获取主页数据
  351. getIndexList(shopid) {
  352. this.$http.get("/yxt/shop/info/" + shopid).then((res) => {
  353. uni.stopPullDownRefresh();
  354. this.loading = false;
  355. if (res.data && res.code == 200) {
  356. this.shop = res.data;
  357. }
  358. });
  359. },
  360. getByShop(id) {
  361. //店铺优惠查询
  362. this.$http.get("/marketing/firstOrder/getByShop/" + id).then((res) => {
  363. if (res && res.code == 200) {
  364. this.shopDiscounts = res.data;
  365. }
  366. });
  367. },
  368. getDetailInfo(id) {
  369. this.$http
  370. .get("/marketing/seckillActivityGoods/info/" + id)
  371. .then((res) => {
  372. this.loading = false;
  373. if (res && res.code == 200) {
  374. this.dataForm = res.data;
  375. this.shop_id = res.data.shop_id;
  376. this.$http
  377. .get("/marketing/firstOrder/getByShop/" + this.shop_id)
  378. .then((res) => {
  379. if (res && res.code == 200) {
  380. this.shopDiscounts = res.data;
  381. }
  382. });
  383. this.$http.get("/yxt/shop/info/" + this.shop_id).then((res) => {
  384. if (res.data && res.code == 200) {
  385. this.shop = res.data;
  386. }
  387. });
  388. this.imglist = res.data.cover.split(",");
  389. // active_state 0:未开始 * 1:进行中 * 2:已结束
  390. if (res.data.active_state == 0 || res.data.active_state == 2) {
  391. this.time1 = this.$mUtil
  392. .countDown(res.data.will_start_time)
  393. .split(":").map(val => Number(val));
  394. } else {
  395. this.time1 = this.$mUtil
  396. .countDown(res.data.finish_time)
  397. .split(":").map(val => Number(val));
  398. }
  399. this.$http
  400. .get(`/goods/content/${this.dataForm.goods_id}`)
  401. .then((res) => {
  402. if (res && res.code == 200) {
  403. this.goodsInfo = res.data;
  404. }
  405. });
  406. this.$http
  407. .get(
  408. `/comment/orderGoods/getgoodscomments/${this.dataForm.goods_id}`
  409. )
  410. .then((res) => {
  411. if (res && res.code == 200) {
  412. this.commentList = res.list;
  413. }
  414. });
  415. }
  416. });
  417. },
  418. goTocart() {
  419. uni.navigateTo({
  420. url: "/pages/index/shop",
  421. });
  422. },
  423. //点击拼团更多
  424. goGb() {
  425. this.$refs.gbOpen.open();
  426. },
  427. //点击关闭
  428. gbClose() {
  429. this.$refs.gbOpen.close();
  430. },
  431. //评论,商品详情切换
  432. change(i) {
  433. this.isChecked = i;
  434. },
  435. //点购物车,立即购买
  436. buy(i, id) {
  437. this.btnType = i;
  438. this.checkSku(id);
  439. if (i == 0) {
  440. this.btnName = "加入购物车";
  441. } else {
  442. this.btnName = "立即购买";
  443. }
  444. },
  445. // 减数量
  446. resNum() {
  447. if (this.add_num > 1) {
  448. this.add_num--;
  449. }
  450. },
  451. //加数量
  452. addNum() {
  453. this.add_num++;
  454. },
  455. chonseSku(index, id) {
  456. this.skuTab[index].values.forEach((res) => {
  457. res.flag = false;
  458. if (res.id == id) {
  459. res.flag = true;
  460. }
  461. });
  462. let choseId = [];
  463. this.skuTab.forEach((res) => {
  464. res.values.forEach((Key) => {
  465. if (Key.flag) {
  466. choseId.push(Key.id);
  467. }
  468. });
  469. });
  470. let totalId = choseId.join("|");
  471. this.hasId = totalId;
  472. this.goodsSkuList.forEach((res) => {
  473. if (res.sku_hash_code == totalId) {
  474. this.choseConfig = res;
  475. this.stock = this.dataForm.real_stock_total;
  476. this.able_stock = res.able_stock;
  477. }
  478. });
  479. },
  480. //查询sku
  481. checkSku(id) {
  482. this.$http
  483. .get(`/marketing/seckillActivityGoods/skus/${this.dataForm.id}`)
  484. .then((res) => {
  485. this.loading = false;
  486. // console.log(res.data.goods_total_stock)
  487. this.goods_total_stock = res.data.goods_total_stock
  488. if (res && res.code == 200) {
  489. this.choseConfig = {};
  490. this.hasId = ''
  491. res.data.goods.sku_table.forEach((keys) => {
  492. keys.values.forEach((val) => {
  493. val.flag = false;
  494. });
  495. });
  496. this.limit_buy_num = this.dataForm.limit_buy_num;
  497. this.goods_id = this.dataForm.goods_id;
  498. this.goodsSkuList = res.data.goods_sku_list;
  499. this.moPrice = this.dataForm.min_price;
  500. this.moDelPrice = this.dataForm.min_sale_price;
  501. this.cover = this.imglist[0];
  502. this.stock = this.dataForm.real_stock_total;
  503. if (res.data.goods_auth) {
  504. if (res.data.goods_auth.added) {
  505. this.$refs.specOpen.open();
  506. } else {
  507. this.$mUtil.toast("该商品已经下架");
  508. }
  509. } else {
  510. this.$mUtil.toast("没有经营权限");
  511. }
  512. //只有没数据才去重新渲染sku的数据
  513. if (this.skuTab.length == 0) {
  514. this.skuTab = res.data.goods.sku_table;
  515. for (let i in this.skuTab) {
  516. //默认选中第一个可选项
  517. this.skuTab[i].values[0].flag = true;
  518. }
  519. //显示选中的sku信息
  520. //this.chonseSku(0, this.skuTab[0].values[0].id);
  521. }
  522. //显示选中的sku信息
  523. this.chonseSku(0, this.skuTab[0].values[0].id);
  524. // if(res.data.goods.sku_table.length>0){
  525. // this.$refs.specOpen.open()
  526. // }else{
  527. // this.hasId = ''
  528. // this.btnBuy()
  529. // }
  530. }
  531. });
  532. },
  533. //关闭规格弹窗
  534. specOpenClose() {
  535. this.$refs.specOpen.close();
  536. },
  537. //加入购物车
  538. btnBuys() {
  539. // 判断是否选中sku
  540. if (this.skuTab.length > 0 && this.hasId == "") {
  541. this.$mUtil.toast("请选中sku");
  542. return false;
  543. }
  544. // 判断限购
  545. if (this.add_num > this.limit_buy_num && this.limit_buy_num != 0) {
  546. this.$mUtil.toast("商品限购" + this.limit_buy_num + "件");
  547. return false;
  548. }
  549. //判断库存
  550. if (this.goodsSkuList.length > 0 && this.able_stock < this.add_num) {
  551. this.$mUtil.toast("商品库存只有" + this.able_stock + "件");
  552. this.$http.post(`/singlegoods/understockrecord/save`, {
  553. shop_id: this.shop_id,
  554. goods_id: this.goods_id,
  555. single_goods_id: this.choseConfig.single_goods_id,
  556. sku_set_name: this.choseConfig.sku_set_name,
  557. buy_num: this.add_num
  558. }).then((res) => {
  559. });
  560. return false;
  561. }
  562. if (this.goStatus == 0) {
  563. let data = {
  564. goods_id: this.goods_id,
  565. sku_hash_code: this.hasId,
  566. add_num: this.add_num,
  567. source_shop_id: this.shop_id.toString(),
  568. };
  569. this.$http.post(`/cart/add`, data).then((res) => {
  570. if (res && res.code == 200) {
  571. this.$mUtil.toast("添加成功");
  572. this.$refs.specOpen.close();
  573. this.choseConfig = {};
  574. this.add_num = 1;
  575. this.cartList();
  576. }
  577. });
  578. } else {
  579. this.psotJson();
  580. }
  581. },
  582. //组合数据
  583. psotJson() {
  584. // this.loading = true;
  585. let dataJson = {};
  586. let childArr = [];
  587. let parendArr = [];
  588. // let shop = uni.getStorageSync('shop')
  589. // let shopid = shop.id ? shop.id : ''
  590. this.choseConfig;
  591. childArr.push({
  592. user_cart_id: 0,
  593. activity_goods_id: this.choseConfig.activity_goods_id,
  594. goods_id: this.goods_id,
  595. num: this.add_num,
  596. sku_hash_code: this.hasId,
  597. });
  598. parendArr.push({
  599. shop_id: this.shop.id,
  600. source_shop_id: this.shop.id,
  601. activity_id: this.dataForm.seckill_id, //活动id
  602. sponsor_activity_id: 0, //拼团id
  603. user_remark: "",
  604. items: childArr,
  605. });
  606. dataJson = {
  607. is_cart: false, //是否来源于购物车
  608. receipt_id: null, //收货地址ID
  609. shipment_mode: 0, //0物流,1自提
  610. shop_orders: parendArr,
  611. marketing_type: 1, //0无活动,1秒杀,2拼团
  612. };
  613. uni.setStorageSync("dataJson", dataJson);
  614. uni.navigateTo({
  615. url: "../surePay/surePaySechill",
  616. });
  617. // let shop = uni.getStorageSync('shop')
  618. // let shopid=shop.id?shop.id:''
  619. // this.loading = false;
  620. // this.$http.post(`/order/build`, dataJson).then(res => {
  621. // if (res && res.code == 200) {
  622. // uni.setStorageSync('sureData', res.data)
  623. // uni.navigateTo({
  624. // url: '../surePay/surePay'
  625. // })
  626. // }
  627. // })
  628. },
  629. //
  630. btnBuy(i) {
  631. this.goStatus = i;
  632. let token = uni.getStorageSync("apiToken");
  633. //判断是否微信授权登录(没有授权登录进wx-login,授权了但没有注册进login)
  634. if (!token) {
  635. uni.navigateTo({
  636. url: "/pages/login/index",
  637. });
  638. } else {
  639. this.btnBuys();
  640. }
  641. //0 购物车,1 立即购买
  642. },
  643. },
  644. };
  645. </script>
  646. <style lang="scss">
  647. page {
  648. background-color: #f5f5f5;
  649. }
  650. </style>
  651. <style lang="scss" scoped>
  652. .pd24 {
  653. padding: 24rpx;
  654. }
  655. .pd20 {
  656. padding: 20rpx;
  657. }
  658. .pt20-pb14 {
  659. padding-top: 20rpx;
  660. padding-bottom: 14rpx;
  661. }
  662. .pt28-pb18 {
  663. padding-top: 28rpx;
  664. padding-bottom: 18rpx;
  665. }
  666. .pb30 {
  667. padding-bottom: 30rpx;
  668. }
  669. .pb40 {
  670. padding-bottom: 40rpx;
  671. }
  672. .pb50 {
  673. padding-bottom: 50rpx;
  674. }
  675. .pt-pb30 {
  676. padding-top: 30rpx;
  677. padding-bottom: 30rpx;
  678. }
  679. .pt-pb35 {
  680. padding-top: 35rpx;
  681. padding-bottom: 35rpx;
  682. }
  683. .ml54 {
  684. margin-left: 54rpx;
  685. }
  686. .ml138 {
  687. margin-left: 138rpx;
  688. }
  689. .br-rd10 {
  690. border-radius: 10rpx;
  691. }
  692. .br-rd20 {
  693. border-radius: 20rpx;
  694. }
  695. .stb-btn {
  696. padding: 8rpx 18rpx;
  697. border-radius: 10rpx;
  698. }
  699. .br-FF0000 {
  700. border: 1rpx solid #ff0000;
  701. border-radius: 24rpx;
  702. padding: 6rpx 12rpx;
  703. }
  704. .bg-FFF6EE {
  705. background-color: #fff6ee;
  706. }
  707. .mt80 {
  708. margin-top: 80rpx;
  709. }
  710. .mt10 {
  711. margin-top: 10rpx;
  712. }
  713. .product {
  714. // padding-bottom: 150rpx;
  715. }
  716. .pic {
  717. width: 100%;
  718. position: relative;
  719. .swiper {
  720. // height: 620rpx;
  721. height: 100vw;
  722. video {
  723. width: 100%;
  724. // height: 620rpx;
  725. height: 100vw;
  726. }
  727. image {
  728. width: 100%;
  729. // height: 620rpx;
  730. height: 100vw;
  731. }
  732. }
  733. .p-price {
  734. width: 100%;
  735. // position: absolute;
  736. top: 460rpx;
  737. // background: linear-gradient(90deg,#20a733, #0a824b);
  738. background: #FA6138;
  739. border-radius: 20rpx 20rpx 0px 0px;
  740. position: relative;
  741. top: -16rpx;
  742. .discount {
  743. color: #ffffff;
  744. }
  745. }
  746. }
  747. .richText {
  748. padding: 30rpx;
  749. /deep/ img {
  750. margin-top: 0 !important;
  751. }
  752. }
  753. //秒杀,拼团样式
  754. .p-ab {
  755. position: absolute;
  756. top: 0;
  757. right: 0;
  758. height: 100%;
  759. }
  760. .stb-list {
  761. padding-bottom: 10rpx;
  762. }
  763. .triangle-bottomright {
  764. width: 0;
  765. height: 0;
  766. border-bottom: 105rpx solid #dccda4;
  767. border-left: 60rpx solid transparent;
  768. }
  769. .seckill {
  770. background-color: #dccda4;
  771. color: #FA6138;
  772. padding: 12rpx 15rpx;
  773. box-sizing: border-box;
  774. border-radius: 5rpx 20rpx 0px 0px;
  775. text-align: center;
  776. // width: 150rpx;
  777. }
  778. .seckill-btn {
  779. width: 76%;
  780. }
  781. .br-284534 {
  782. border-bottom: 1rpx solid rgba($color: #284534, $alpha: 0.3);
  783. }
  784. .gb-te {
  785. padding-top: 20rpx;
  786. padding-bottom: 15rpx;
  787. }
  788. .gb-btn {
  789. padding: 18rpx 80rpx 8rpx;
  790. line-height: 30rpx;
  791. }
  792. .btn-bg-dccda4 {
  793. background: #dccda4;
  794. border-radius: 48rpx 0rpx 0rpx 48rpx;
  795. }
  796. .btn-bg-00321E {
  797. background: #0B844A;
  798. border-radius: 0px 48px 48px 0px;
  799. }
  800. .tab {
  801. position: sticky;
  802. top: 0;
  803. background-color: #fff;
  804. padding-top: 38rpx;
  805. z-index: 9;
  806. .pb30 {
  807. position: relative;
  808. &::before {
  809. content: '';
  810. position: absolute;
  811. left: 50%;
  812. bottom: 0;
  813. transform: translateX(-50%);
  814. width: 0;
  815. height: 2px;
  816. background: #FA6138;
  817. transition: all 0.3s;
  818. }
  819. &.active {
  820. font-size: 30rpx;
  821. color: #FA6138;
  822. font-weight: 700;
  823. &::before {
  824. width: 100%;
  825. }
  826. }
  827. }
  828. }
  829. .bottom-btn {
  830. width: 100%;
  831. position: fixed;
  832. bottom: 0;
  833. z-index: 9;
  834. border-top: 1rpx solid #e6e6e6;
  835. .cart {
  836. position: relative;
  837. .number {
  838. position: absolute;
  839. top: -10rpx;
  840. left: 45rpx;
  841. padding: 4rpx 8rpx;
  842. background-color: #ff0000;
  843. border: 4rpx solid #ffffff;
  844. border-radius: 40rpx;
  845. }
  846. }
  847. .cart-btn {
  848. width: 230rpx;
  849. height: 85rpx;
  850. background: #dccda4;
  851. border-radius: 43rpx 0rpx 0rpx 43rpx;
  852. }
  853. .buy-btn {
  854. width: 230rpx;
  855. height: 85rpx;
  856. line-height: 85rpx;
  857. background: #0B844A;
  858. border-radius: 0rpx 43rpx 43rpx 0rpx;
  859. }
  860. }
  861. .flex-sb {
  862. display: flex;
  863. justify-content: space-between;
  864. }
  865. //弹窗
  866. .spec {
  867. border-radius: 18rpx 18rpx 0rpx 0rpx;
  868. padding-top: 30rpx;
  869. max-height: 900rpx;
  870. overflow-y: auto;
  871. .spec-item {
  872. background-color: #f6f6f6;
  873. border: 1px solid #f6f6f6;
  874. padding: 12rpx 30rpx;
  875. font-size: 24rpx;
  876. color: #1a1a1a;
  877. border-radius: 4px;
  878. }
  879. .activeColor {
  880. background-color: #e1e6e3;
  881. border: 1px solid #3775F6;
  882. color: #FA6138;
  883. border-radius: 4px;
  884. }
  885. .spec-item:not(:last-child) {
  886. margin-right: 24rpx;
  887. }
  888. //减号
  889. .minus {
  890. width: 50rpx;
  891. height: 50rpx;
  892. line-height: 50rpx;
  893. text-align: center;
  894. background: #dedede;
  895. border-radius: 8rpx 0rpx 0rpx 8rpx;
  896. }
  897. .num {
  898. width: 74rpx;
  899. height: 46rpx;
  900. line-height: 46rpx;
  901. text-align: center;
  902. border: 1px solid #dedede;
  903. }
  904. //加号
  905. .plus-sign {
  906. width: 50rpx;
  907. height: 50rpx;
  908. line-height: 50rpx;
  909. text-align: center;
  910. background: #dedede;
  911. border-radius: 0rpx 8rpx 8rpx 0rpx;
  912. }
  913. .specOpen-btn {
  914. margin-top: 68rpx;
  915. padding-bottom: 34rpx;
  916. button {
  917. background-color: #FA6138;
  918. color: #ffffff;
  919. }
  920. }
  921. }
  922. </style>