|
@@ -1,2094 +0,0 @@
|
|
-<template>
|
|
|
|
- <view class="container">
|
|
|
|
- <!-- 轮播图 -->
|
|
|
|
- <view class="carousel">
|
|
|
|
- <swiper indicator-dots :circular="true" duration="400">
|
|
|
|
- <swiper-item class="swiper-item" v-for="(item, index) in imgList" :key="index">
|
|
|
|
- <view class="image-wrapper"><image :src="item" class="loaded" mode="scaleToFill"></image></view>
|
|
|
|
- </swiper-item>
|
|
|
|
- </swiper>
|
|
|
|
- </view>
|
|
|
|
- <!-- 介绍部分 -->
|
|
|
|
- <view class="introduce-section">
|
|
|
|
- <view class="introduce-price flex1">
|
|
|
|
- <view class="price">
|
|
|
|
- <view class="price-left">
|
|
|
|
- <view class="left-1">¥</view>
|
|
|
|
- <view class="left-2">{{goodsObjact.price}}</view>
|
|
|
|
- </view>
|
|
|
|
- <!-- <view class="price-right" >单买价 ¥{{goodsObjact.product_price}}</view> -->
|
|
|
|
- </view>
|
|
|
|
- <view class="people flex_item">
|
|
|
|
- <view class="people_number">{{goodsObjact.people}}人拼</view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="title" >{{goodsObjact.title}}</view>
|
|
|
|
- <view class="bot-row flex1">
|
|
|
|
- <view>快递:¥ {{goodsObjact.postage}}</view>
|
|
|
|
- <view>剩余:{{ goodsObjact.allStock}}件</view>
|
|
|
|
- <view>销量:{{ goodsObjact.sales }}</view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <!-- <view class="c-list">
|
|
|
|
- <view class="c-row b-b"><text class="tit">拼团玩法</text></view>
|
|
|
|
- <view class="c-row b-b">
|
|
|
|
- <view class="c-text">
|
|
|
|
- ①开团/参团
|
|
|
|
- <text>——</text>
|
|
|
|
- ②邀请好友
|
|
|
|
- <text>——</text>
|
|
|
|
- ③满员发货
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="c-row b-b" @click="toggleSpec()" v-if="goodsType == 2">
|
|
|
|
- <text class="tit">购买数量</text>
|
|
|
|
- <view class="con">
|
|
|
|
- <text class="selected-text">{{ goodsNumber }}</text>
|
|
|
|
- </view>
|
|
|
|
- <text class="iconfont iconenter"></text>
|
|
|
|
- </view>
|
|
|
|
- </view> -->
|
|
|
|
- <view class="pinklistbox" v-if="pinkTlist.length > 0">
|
|
|
|
- <view class="listbox-1 flex1">
|
|
|
|
- <view >{{pinkTlist.length}}人在拼单,可直接参与</view>
|
|
|
|
- <view class="more flex-center" @click="opens_popup" v-if="more">查看全部
|
|
|
|
- <image src="../../../static/img/img39.png"></image>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="pinklist">
|
|
|
|
- <view v-for="(ls, ind) in showlist" :key="ind" class="flex pinklist_list">
|
|
|
|
- <view class="pink_row flex1">
|
|
|
|
- <view class="pink_img"><image :src="ls.avatar"></image></view>
|
|
|
|
- <view class="pink_name">{{ ls.nickname }}</view>
|
|
|
|
- </view>
|
|
|
|
- <view class="pink_tpl flex1">
|
|
|
|
- <view >
|
|
|
|
- <view class="pink_people">
|
|
|
|
- 还差
|
|
|
|
- <text>{{ ls.count}}</text>
|
|
|
|
- 人拼团
|
|
|
|
- </view>
|
|
|
|
- <!-- <view class="pink_people">
|
|
|
|
- 剩余{{ls.time || '00:00:00'}}
|
|
|
|
- </view> -->
|
|
|
|
- </view>
|
|
|
|
- <view class="pint" @click="groupBooking(ls.id)">
|
|
|
|
- 去拼单
|
|
|
|
- <!-- <text class="iconfont iconenter"></text> opens_popups-->
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <!-- 评价 -->
|
|
|
|
- <!-- <view class="eva-section" v-if="replyCount > 0" @click="navTo('/pages/product/reply')">
|
|
|
|
- <view class="e-header">
|
|
|
|
- <text class="tit">评价</text>
|
|
|
|
- <text class="number">({{replyCount}})</text>
|
|
|
|
- <text class="tip">全部评价</text>
|
|
|
|
- <text class="iconfont iconenter"></text>
|
|
|
|
- </view>
|
|
|
|
- <view class="eva-box">
|
|
|
|
- <view class="box-1 flex1">
|
|
|
|
- <view class="left flex-start">
|
|
|
|
- <image :src="commentList.avatar"></image>
|
|
|
|
- <view class="content">
|
|
|
|
- <view class="content-name">{{commentList.nickname}}</view>
|
|
|
|
- <view class="content-time">{{commentList.add_time}}</view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="right flex-upDown-center">
|
|
|
|
- <view><uniRate text="1" size="14" margin="1" :value="commentList.product_score" ></uniRate></view>
|
|
|
|
- <text class="red">{{commentList.product_score}}分</text>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="box-2">{{commentList.comment}}</view>
|
|
|
|
- <view class="box-3">
|
|
|
|
- <view v-for="(item,index) in commentList.pics" :key="index" class="box-3-1">
|
|
|
|
- <image :src="item"></image>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view> -->
|
|
|
|
- <view class="eva-section" v-if="reply.length > 0" @click="navTo('/pages/product/reply?id=' + goodsid)">
|
|
|
|
- <view class="e-header">
|
|
|
|
- <text class="tit">评价</text>
|
|
|
|
- <text>({{ list.replyCount }})</text>
|
|
|
|
- <text class="tip">好评率 {{ list.replyChance }}%</text>
|
|
|
|
- <text class="iconfont iconenter"></text>
|
|
|
|
- </view>
|
|
|
|
- <view class="eva-box">
|
|
|
|
- <image class="portrait" :src="reply.avatar" mode="aspectFill"></image>
|
|
|
|
- <view class="right">
|
|
|
|
- <text class="name">{{ reply.nickname }}</text>
|
|
|
|
- <text class="con">{{ reply.comment }}</text>
|
|
|
|
- <view class="con_box">
|
|
|
|
- <view class="con_image" v-for="item in reply.pics"><image :src="item"></image></view>
|
|
|
|
- </view>
|
|
|
|
- <view class="bot">
|
|
|
|
- <text class="attr"></text>
|
|
|
|
- <text class="time">{{ reply.add_time }}</text>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <!-- 商品详情图 -->
|
|
|
|
- <view class="detail-desc">
|
|
|
|
- <view class="desc-title flex-center">
|
|
|
|
- <view class="one"></view>
|
|
|
|
- 商品详情
|
|
|
|
- <view class="two"></view>
|
|
|
|
- </view>
|
|
|
|
- <rich-text :nodes="goodsObjact.description"></rich-text>
|
|
|
|
- </view>
|
|
|
|
- <!-- <view class="detail-desc">
|
|
|
|
- <view class="d-header"><text>图文详情</text></view>
|
|
|
|
- <rich-text :nodes="goodsObjact.description"></rich-text>
|
|
|
|
- </view> -->
|
|
|
|
- <!-- 拼团商品 -->
|
|
|
|
- <view class="page-bottom" >
|
|
|
|
- <!-- <navigator url="/pages/index/index" open-type="switchTab" class="p-b-btn">
|
|
|
|
- <text class="iconfont iconhomefill"></text>
|
|
|
|
- <text>首页</text>
|
|
|
|
- </navigator> -->
|
|
|
|
- <!--<view class="botton-1 flex-center">
|
|
|
|
- <view class="botton-frame" @click="toFavorite(goodsObjact)">
|
|
|
|
- <view class="img-box" v-if="goodsObjact.userCollect == false"><image src="../../static/label/img02.png"></image></view>
|
|
|
|
- <view class="img-box" v-if="goodsObjact.userCollect == true"><image src="../../static/label/img08.png"></image></view>
|
|
|
|
- <view class="word" :class="{ active: goodsObjact.userCollect }">收藏</view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="p-b-btn" :class="{ active: goodsObjact.userCollect }" @click="toFavorite(goodsObjact)">
|
|
|
|
- <text class="iconfont iconlikefill"></text>
|
|
|
|
- <text>收藏</text>
|
|
|
|
- </view> -->
|
|
|
|
- <view class="action-btn-group">
|
|
|
|
- <!-- <button type="primary" class=" action-btn no-border btn-favorites-btn" @click="navTo('/pages/favorites/favorites')">收藏夹</button> -->
|
|
|
|
- <!-- <button type="primary" class=" action-btn no-border buy-now-btn" @click="toFavorite(goodsObjact)">{{ goodsObjact.userCollect ? '取消收藏' : '收藏' }}</button> -->
|
|
|
|
- <button type="primary" class=" action-btn no-border add-cart-btn" @click="specOPne()">一键开团</button>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <!-- 规格-模态层弹窗 -->
|
|
|
|
- <view class="popup spec" :class="specClass" @touchmove.stop.prevent="stopPrevent" @click="toggleSpec()">
|
|
|
|
- <!-- 遮罩层 -->
|
|
|
|
- <view class="mask"></view>
|
|
|
|
- <view class="layer attr-content" @click.stop="stopPrevent">
|
|
|
|
- <view class="a-t">
|
|
|
|
- <image :src="actionImage"></image>
|
|
|
|
- <view class="right">
|
|
|
|
- <text class="name">{{ goodsObjact.store_name }}</text>
|
|
|
|
- <text class="price">¥{{ actionPrice * goodsNumber }}</text>
|
|
|
|
- <text class="stock">库存:{{ goodsStore }}件</text>
|
|
|
|
- <view class="selected" v-if="specList != ''">
|
|
|
|
- 已选:
|
|
|
|
- <text class="selected-text" v-for="(sItem, sIndex) in specSelected" :key="sIndex">{{ sItem }}</text>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view v-for="(item, index) in specList" :key="index" class="attr-list">
|
|
|
|
- <text>{{ item.attr_name }}</text>
|
|
|
|
- <view class="item-list">
|
|
|
|
- <text
|
|
|
|
- v-for="(childItem, childIndex) in item.attr_value"
|
|
|
|
- :key="childIndex"
|
|
|
|
- class="tit"
|
|
|
|
- :class="{ selected: childItem.check }"
|
|
|
|
- @click="selectSpec(childItem, item, index)"
|
|
|
|
- >
|
|
|
|
- {{ childItem.attr }}
|
|
|
|
- </text>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <!-- <view class="attr-list">
|
|
|
|
- <text>购买数量</text>
|
|
|
|
- <view class="item-list">
|
|
|
|
- <uni-number-box class="step" :isMin="true" :value="goodsNumber" :min="1" :max="goodsNumberMax" @eventChange="numberChange"></uni-number-box>
|
|
|
|
- </view>
|
|
|
|
- </view> -->
|
|
|
|
- <button class="btn" @click.stop="buy" v-show="buys_show">完成</button>
|
|
|
|
- <button class="btn" style="background-color: #999999;" v-show="buys_shows">售罄</button>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <!-- 查看全部拼单 -->
|
|
|
|
- <uni-popup ref="popup" type="center" >
|
|
|
|
- <view class="popup-row">
|
|
|
|
- <view class="popup-1">
|
|
|
|
- 正在拼单
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <scroll-view scroll-y="true" class="popcont-box">
|
|
|
|
- <view class="popup-2">
|
|
|
|
- <view v-for="(item,index) in pinkTlist" :key="index" class="popup-2-row flex1">
|
|
|
|
- <view class="row-1 flex1">
|
|
|
|
- <view class="one">
|
|
|
|
- <image :src="item.avatar"></image>
|
|
|
|
- <view class="two">
|
|
|
|
- <view class="two-1">{{item.nickname }}</view>
|
|
|
|
- <!-- <view>剩余 {{item.time}}</view> -->
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- <text class="two-1-1">还差{{item.count}}人</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="row-2" @click="groupBooking(item.id)">
|
|
|
|
- 去拼单
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </scroll-view>
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
- <view class="delete" @click="closes_popup"><image src="../../../static/img/deletes.png"></image></view>
|
|
|
|
- </uni-popup>
|
|
|
|
-
|
|
|
|
- <!-- <uni-popup ref="popups" type="center" >
|
|
|
|
- <view class="popup-rows" >
|
|
|
|
- <view class="rows-1">参与李丹的拼单</view>
|
|
|
|
- <view class="rows-2">仅剩<text class="red">1</text>个名额,23:41:55后结束</view>
|
|
|
|
- <view class="rows-3 flex1">
|
|
|
|
- <view class="rows-3-group" v-for="(item,index) in information" >
|
|
|
|
- <view class="group-1">
|
|
|
|
- <image src="../../static/delete/timg.jpg"></image>
|
|
|
|
- <view class="group-1-1" >团长</view>
|
|
|
|
- </view>
|
|
|
|
- <view class="group-2">婷930sadasa</view>
|
|
|
|
- </view>
|
|
|
|
- <view class="rows-3-group" v-for="i in (5 - information.length) " >
|
|
|
|
- <view class="group-1">
|
|
|
|
- <image src="../../static/label/blank.png"></image>
|
|
|
|
- </view>
|
|
|
|
- <view class="group-2">带邀请</view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="rows-4" @click="navTo('/pages/order/createOrder')">参与拼单</view>
|
|
|
|
- </view>
|
|
|
|
- <view class="delete" @click="groupBooking()"><image src="../../static/label/deletes.png"></image></view>
|
|
|
|
- </uni-popup>
|
|
|
|
- -->
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- <!-- #ifdef H5 -->
|
|
|
|
- <!-- <view class="btn_fenxiang" @click="open">分享</view> -->
|
|
|
|
- <view class="mask" v-show="show"><image @click="onTap" src="https://mmz.liuniu946.com/statics/img/shareimg.png"></image></view>
|
|
|
|
- <!-- #endif -->
|
|
|
|
- <!-- #ifdef MP-WEIXIN -->
|
|
|
|
- <button open-type="share" class="shareDate">分享</button>
|
|
|
|
- <!-- #endif -->
|
|
|
|
- </view>
|
|
|
|
-</template>
|
|
|
|
-<script>
|
|
|
|
-import { mapState } from 'vuex';
|
|
|
|
-
|
|
|
|
-import { uniFav } from '@/components/uni-fav/uni-fav.vue';
|
|
|
|
-import { groupGoods, cartAdd, collectAdd, collectDel, productDetail } from '@/api/product.js';
|
|
|
|
-import { saveUrl } from '@/utils/loginUtils.js';
|
|
|
|
-import uniNoticeBar from '@/components/uni-notice-bar/uni-notice-bar.vue';
|
|
|
|
-import uniRate from '@/components/uni-rate/uni-rate.vue';
|
|
|
|
-import uniPopup from '@/components/uni-popup/uni-popup.vue'
|
|
|
|
-import uniPopupMessage from '@/components/uni-popup/uni-popup-message.vue'
|
|
|
|
-import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue'
|
|
|
|
-import uniNumberBox from '@/components/uni-number-box.vue';
|
|
|
|
-// #ifdef H5
|
|
|
|
-import { weixindata } from '@/utils/wxAuthorized';
|
|
|
|
-// #endif
|
|
|
|
-export default {
|
|
|
|
- components: {
|
|
|
|
- uniNumberBox,
|
|
|
|
- uniFav,
|
|
|
|
- uniNoticeBar,
|
|
|
|
- uniRate,
|
|
|
|
- uniPopup,
|
|
|
|
- uniPopupMessage,
|
|
|
|
- uniPopupDialog
|
|
|
|
- },
|
|
|
|
- // #ifdef MP
|
|
|
|
- onShareAppMessage: function(res) {
|
|
|
|
- if (res.from === 'button') {
|
|
|
|
- // 来自页面内分享按钮
|
|
|
|
- let pages = getCurrentPages();
|
|
|
|
- // 获取当前页面
|
|
|
|
- let page = pages[pages.length - 1];
|
|
|
|
- let path = '/' + page.route + '?';
|
|
|
|
- // 保存传值
|
|
|
|
- for (let i in page.options) {
|
|
|
|
- path += i + '=' + page.options[i] + '&';
|
|
|
|
- }
|
|
|
|
- // 保存邀请人
|
|
|
|
- path += 'spread=' + this.userInfo.uid;
|
|
|
|
- let data = {
|
|
|
|
- path: path,
|
|
|
|
- imageUrl: this.goodsObjact.image,
|
|
|
|
- title: this.goodsObjact.title
|
|
|
|
- };
|
|
|
|
- return data;
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- // #endif
|
|
|
|
- data() {
|
|
|
|
- return {
|
|
|
|
- imgList: [], //商品轮播图
|
|
|
|
- goodsObjact: {}, //保存商品数据
|
|
|
|
- pinkTlist:{
|
|
|
|
- length:5
|
|
|
|
- }, //进行中的拼团的信息
|
|
|
|
- showlist: [],//进行中的拼团前两组的信息
|
|
|
|
- replyCount:0,//评价总数
|
|
|
|
- commentList:{},
|
|
|
|
- specList: [],
|
|
|
|
- ishow:'',
|
|
|
|
- information:[],
|
|
|
|
- popuplist:[],
|
|
|
|
- show: false,
|
|
|
|
- showModal: true, //拼单遮罩层
|
|
|
|
- more: true, //查看更多按钮
|
|
|
|
- autoplay: true,
|
|
|
|
- vertical: true,
|
|
|
|
- interval: 3000,
|
|
|
|
- duration: 500,
|
|
|
|
- buys_show: true,
|
|
|
|
- buys_shows: false,
|
|
|
|
- circular: true,
|
|
|
|
- type: 1, //默认支付方式add为
|
|
|
|
- specClass: 'none', //显示隐藏弹窗
|
|
|
|
- actionImage: '', //商品图片
|
|
|
|
- goodsid: '', //商品id
|
|
|
|
- actionPrice: '', //商品价格
|
|
|
|
- // specClass: 'none', //显示隐藏弹窗
|
|
|
|
- shareList: [], //分享列表
|
|
|
|
- goodsNumberMax: 0, //商品库存
|
|
|
|
- //图片循环
|
|
|
|
- people: '', //拼团人数
|
|
|
|
- goodsNumber: 1, //购买数量(开团数量为1,整团数量为1*参团人数)
|
|
|
|
- carnumber: '', //整团购买商品数量
|
|
|
|
- reply: {}, //商品数据
|
|
|
|
- list: '', //详情数据
|
|
|
|
- goodsType: 1, //商品类型1秒杀商品0为普通商品2为拼团商品3为新人礼包
|
|
|
|
- count: 0, //点击查看更多
|
|
|
|
- showmore: true,
|
|
|
|
- pinkTlistnum: '',
|
|
|
|
- spread: '',
|
|
|
|
- chooseGoodsNumber: 1, //选择商品的数量
|
|
|
|
- specSelected: [], //选中的分类
|
|
|
|
- goodsStore: 0, //选中库存
|
|
|
|
- uniqueId: '',
|
|
|
|
- productValue: '',
|
|
|
|
- isCollect: '', //是否被收藏
|
|
|
|
- maskshow: false, //弹窗
|
|
|
|
- posturl: '',
|
|
|
|
- option: '', //保存传值
|
|
|
|
- opt: '', //保存小程序传值
|
|
|
|
- uniquetype:false,//判断是否是从拼团详情界面跳回的 false 不是 true 是
|
|
|
|
- shop:'',//返回的拼团订单id
|
|
|
|
- allStock:0//商品总库存
|
|
|
|
- };
|
|
|
|
- },
|
|
|
|
- onLoad(option) {
|
|
|
|
- this.option = option;
|
|
|
|
- if (option.scene) {
|
|
|
|
- if (typeof option.scene == 'string') {
|
|
|
|
- let scene = ('{' + option.scene + '}')
|
|
|
|
- .replace('qr%26', '')
|
|
|
|
- .replace(/%3D/g, ':')
|
|
|
|
- .replace(/%26/g, ',')
|
|
|
|
- .replace('pid', '"pid"')
|
|
|
|
- .replace('type', '"type"')
|
|
|
|
- .replace('id', '"id"');
|
|
|
|
- let opt = JSON.parse(scene);
|
|
|
|
- this.opt = opt;
|
|
|
|
- // 保存拼团订单id
|
|
|
|
- this.goodsid = opt.id;
|
|
|
|
- if (opt.pid) {
|
|
|
|
- // 存储邀请人
|
|
|
|
- this.spread = opt.pid;
|
|
|
|
- uni.setStorageSync('spread', opt.pid);
|
|
|
|
- }
|
|
|
|
- if (opt.type) {
|
|
|
|
- this.goodsType = opt.type;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- } else {
|
|
|
|
- //保存商品id
|
|
|
|
- this.goodsid = option.id;
|
|
|
|
- //判断有无人邀请
|
|
|
|
- if (option.spread) {
|
|
|
|
- // 存储邀请人
|
|
|
|
- this.spread = option.spread;
|
|
|
|
- uni.setStorageSync('spread', option.spread);
|
|
|
|
- }
|
|
|
|
- //判断是否是普通商品
|
|
|
|
- if (option.type) {
|
|
|
|
- console.log(option.type);
|
|
|
|
- this.goodsType = option.type;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- //判断是否是从拼团详情界面跳回的
|
|
|
|
- if (option.uniquetype) {
|
|
|
|
- console.log(option.uniquetype);
|
|
|
|
- this.uniquetype = option.uniquetype;
|
|
|
|
- }
|
|
|
|
- //接受返回的拼团订单id
|
|
|
|
- if (option.shop) {
|
|
|
|
- console.log(option.uniquetype);
|
|
|
|
- this.shop = option.shop;
|
|
|
|
- }
|
|
|
|
- // 保存当前页面
|
|
|
|
- saveUrl();
|
|
|
|
- },
|
|
|
|
- onShow() {
|
|
|
|
- let obj = this;
|
|
|
|
- groupGoods({}, obj.goodsid).then(function({ data }) {
|
|
|
|
- console.log(data,112)
|
|
|
|
- let goods = data.storeInfo;
|
|
|
|
- obj.imgList = goods.images;//拼团轮播图
|
|
|
|
- obj.goodsObjact = goods;//拼团拼团产品信息
|
|
|
|
- // 保存商品总库存
|
|
|
|
- obj.allStock = 0;
|
|
|
|
- for(let key in data.productValue){
|
|
|
|
- obj.allStock +=data.productValue[key].stock
|
|
|
|
- }
|
|
|
|
- obj.pinkTlist = data.pink;//进行中的拼团的信息
|
|
|
|
- obj.showlist = obj.pinkTlist.slice(0, 2);//截取拼团信息的前两组
|
|
|
|
- obj.replyCount = data.replyCount;//评价总数
|
|
|
|
- //obj.commentList = data.reply[0];//保存评价里的第一条
|
|
|
|
- obj.specList = data.productAttr;//保存产品属性
|
|
|
|
- //商品详情图超出屏幕问题
|
|
|
|
- if (obj.goodsObjact.description != null) {
|
|
|
|
- obj.goodsObjact.description = obj.goodsObjact.description.replace(/<img/g, '<img class="rich-img"').replace(/<p>\S*<img/g, '<p class="pHeight"><img');
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- if(obj.pinkTlist.length<=2){
|
|
|
|
- obj.more = false;
|
|
|
|
- };
|
|
|
|
- if (data.reply) {
|
|
|
|
- obj.reply = data.reply;
|
|
|
|
- }
|
|
|
|
- obj.list = data; //详情数据
|
|
|
|
- obj.productValue = data.productValue; //保存属性值
|
|
|
|
- // 保存数据修改数组
|
|
|
|
- // console.log(obj.pinkTlist,55)
|
|
|
|
- obj.people = goods.people; //拼团人数
|
|
|
|
- obj.productId = goods.product_id;
|
|
|
|
-
|
|
|
|
- // 保存默认选中的对象
|
|
|
|
- obj.specSelected = []; //初始化默认选择对象
|
|
|
|
- for (let i = 0; i < obj.specList.length; i++) {
|
|
|
|
- // 设置默认数据
|
|
|
|
- let attrValue = obj.specList[i].attr_value[0];
|
|
|
|
- attrValue.check = true;
|
|
|
|
- obj.specSelected.push(attrValue.attr);
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- //保存默认选中的对象字符串名称
|
|
|
|
- let str = obj.specSelected.join(',');
|
|
|
|
- // 设置默认值
|
|
|
|
- obj.actionPrice = obj.productValue[str].price;
|
|
|
|
- obj.goodsNumberMax = obj.productValue[str].stock;
|
|
|
|
- obj.actionImage = obj.productValue[str].image;
|
|
|
|
- obj.uniqueId = obj.productValue[str].unique;
|
|
|
|
- obj.goodsStore = obj.productValue[str].quota;
|
|
|
|
- console.log(obj.goodsStore,9000)
|
|
|
|
- // #ifdef H5
|
|
|
|
- obj.shareDate();
|
|
|
|
- // #endif
|
|
|
|
- // obj.clickMore();
|
|
|
|
- });
|
|
|
|
- // combination({}, obj.goodsid).then()
|
|
|
|
- },
|
|
|
|
- computed: {
|
|
|
|
- ...mapState(['userInfo', 'baseURL'])
|
|
|
|
- },
|
|
|
|
- methods: {
|
|
|
|
- //选择规格
|
|
|
|
- selectSpec(item, arr, ind) {
|
|
|
|
- console.log(item,arr,ind,';')
|
|
|
|
- arr.attr_value.forEach(function(e) {
|
|
|
|
- e.check = false;
|
|
|
|
- });
|
|
|
|
- item.check = true;
|
|
|
|
- let obj = this;
|
|
|
|
- obj.specSelected[ind] = item.attr;
|
|
|
|
- let str = obj.specSelected.join(',');
|
|
|
|
- console.log(obj.productValue[str],116)
|
|
|
|
- if (obj.productValue[str]) {
|
|
|
|
- obj.buys_show = true;
|
|
|
|
- obj.buys_shows = false;
|
|
|
|
- obj.actionPrice = obj.productValue[str].price;
|
|
|
|
- obj.goodsNumberMax = obj.productValue[str].stock;
|
|
|
|
- obj.actionImage = obj.productValue[str].image;
|
|
|
|
- obj.uniqueId = obj.productValue[str].unique;
|
|
|
|
- if (obj.goodsType == 2) {
|
|
|
|
- obj.goodsStore = obj.productValue[str].quota;
|
|
|
|
- } else {
|
|
|
|
- obj.goodsStore = obj.productValue[str].product_stock;
|
|
|
|
- }
|
|
|
|
- } else {
|
|
|
|
- (obj.buys_show = false), (obj.buys_shows = true);
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- numberChange(e) {
|
|
|
|
- //购买数量
|
|
|
|
- this.chooseGoodsNumber = e.number;
|
|
|
|
- // console.log(e.number)
|
|
|
|
- // console.log(this.chooseGoodsNumber,'chooseGoodsNumber')
|
|
|
|
- },
|
|
|
|
- opens_popup(){
|
|
|
|
- this.$refs.popup.open()
|
|
|
|
- },
|
|
|
|
- closes_popup(){
|
|
|
|
- this.$refs.popup.close()
|
|
|
|
- },
|
|
|
|
- opens_popups(){
|
|
|
|
- this.$refs.popup.close()
|
|
|
|
- this.$refs.popups.open()
|
|
|
|
- },
|
|
|
|
- closes_popups(){
|
|
|
|
- this.$refs.popups.close()
|
|
|
|
- },
|
|
|
|
- // 处理数组结构
|
|
|
|
- dataUpReturn(data) {
|
|
|
|
- //保存处理完毕数据
|
|
|
|
- let arr = [];
|
|
|
|
- // 保存临时数据
|
|
|
|
- let arr1 = [];
|
|
|
|
- // 设置每个小数组可以存放的数量
|
|
|
|
- let num = 2;
|
|
|
|
- if (data.length > 1) {
|
|
|
|
- for (let i = 0; i < data.length; i++) {
|
|
|
|
- // 保存数据到临时数组
|
|
|
|
- arr1.push(data[i]);
|
|
|
|
- if ((i + 1) % num === 0) {
|
|
|
|
- console.log(arr1, 2);
|
|
|
|
- // 添加数据到返回数组,用map方法解决物理指针问题导致的数据对象改变问题
|
|
|
|
- arr.push(
|
|
|
|
- arr1.map(e => {
|
|
|
|
- return e;
|
|
|
|
- })
|
|
|
|
- );
|
|
|
|
- // 清空临时数组重新开始计算
|
|
|
|
- arr1 = [];
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- // 判断是否为奇数
|
|
|
|
- if (data.length % num === 1) {
|
|
|
|
- arr.push([data[data.length - 1]]);
|
|
|
|
- }
|
|
|
|
- return arr;
|
|
|
|
- },
|
|
|
|
- specOPne() {
|
|
|
|
- //显示弹出框
|
|
|
|
- // 是否有开团用户
|
|
|
|
- // if (this.pinkTlist.length > 0) {
|
|
|
|
- // this.groupBooking(this.pinkTlist[0][0].id);
|
|
|
|
- // } else {
|
|
|
|
- // }
|
|
|
|
- this.specClass = 'show';
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- //去拼团
|
|
|
|
- groupBooking(item) {
|
|
|
|
- uni.navigateTo({
|
|
|
|
- url: '/pages/product/details?pink_id=' + item
|
|
|
|
- });
|
|
|
|
- },
|
|
|
|
- //拼团列表数据分页
|
|
|
|
- setPinkList() {
|
|
|
|
- let obj = this;
|
|
|
|
- let showlist = new Array();
|
|
|
|
- for (let i = 0; i < obj.pinkTlist.length; i++) {
|
|
|
|
- if (i >= obj.count) {
|
|
|
|
- break;
|
|
|
|
- }
|
|
|
|
- showlist[i] = obj.pinkTlist[i];
|
|
|
|
- }
|
|
|
|
- obj.showlist = showlist;
|
|
|
|
- },
|
|
|
|
- //查看更多
|
|
|
|
- // clickMore() {
|
|
|
|
- // let obj = this;
|
|
|
|
- // obj.count += 2;
|
|
|
|
- // obj.setPinkList();
|
|
|
|
- // if (obj.count >= obj.pinkTlist.length) {
|
|
|
|
- // obj.showmore = false; //当次数大于拼团数据,查看更多隐藏
|
|
|
|
- // } else {
|
|
|
|
- // obj.showmore = true; //当次数大于拼团数据,查看更多隐藏
|
|
|
|
- // }
|
|
|
|
- // },
|
|
|
|
- clickMore() {
|
|
|
|
- this.showlist = this.pinkTlist;
|
|
|
|
- console.log(this.showlist, 22);
|
|
|
|
- this.more = false;
|
|
|
|
- },
|
|
|
|
- //规格弹窗开关
|
|
|
|
- toggleSpec(str) {
|
|
|
|
- if (this.specClass === 'show') {
|
|
|
|
- this.specClass = 'hide';
|
|
|
|
- setTimeout(() => {
|
|
|
|
- this.specClass = 'none';
|
|
|
|
- }, 250);
|
|
|
|
- } else if (this.specClass === 'none') {
|
|
|
|
- this.specClass = 'show';
|
|
|
|
- }
|
|
|
|
- // 判断是否为数字
|
|
|
|
- if (typeof str == 'number') {
|
|
|
|
- // 保存当前购买类型
|
|
|
|
- this.type = str;
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- //显示弹窗
|
|
|
|
- open() {
|
|
|
|
- this.show = true;
|
|
|
|
- },
|
|
|
|
- //随意点击隐藏弹窗
|
|
|
|
- onTap() {
|
|
|
|
- if (!this.open) return;
|
|
|
|
- this.close();
|
|
|
|
- },
|
|
|
|
- close() {
|
|
|
|
- this.show = false;
|
|
|
|
- },
|
|
|
|
- //收藏
|
|
|
|
- toFavorite(item) {
|
|
|
|
- let obj = this;
|
|
|
|
-
|
|
|
|
- item.userCollect = !item.userCollect;
|
|
|
|
- // 判断是否已经收藏
|
|
|
|
- if (!item.userCollect) {
|
|
|
|
- collectDel({
|
|
|
|
- id: item.id,
|
|
|
|
- category: 'pink'
|
|
|
|
- }).then(function(e) {
|
|
|
|
- obj.$api.msg('成功取消收藏!');
|
|
|
|
- });
|
|
|
|
- } else {
|
|
|
|
- collectAdd({
|
|
|
|
- id: item.id,
|
|
|
|
- category: 'pink'
|
|
|
|
- }).then(function(e) {
|
|
|
|
- obj.$api.msg('成功加入收藏!');
|
|
|
|
- });
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- // #ifdef H5
|
|
|
|
- shareDate() {
|
|
|
|
- let obj = this;
|
|
|
|
- let url = window.location.href.replace(/[\?,&]{0,1}from=singlemessage/g, '') + '&spread=' + this.userInfo.uid;
|
|
|
|
- let bool = uni.getStorageSync('weichatBrowser') || '';
|
|
|
|
- // 判断是否微信浏览器
|
|
|
|
- if (bool) {
|
|
|
|
- let data;
|
|
|
|
- if (obj.goodsType == 0) {
|
|
|
|
- data = {
|
|
|
|
- link: url, // 分享链接
|
|
|
|
- imgUrl: obj.goodsObjact.image, // 分享图标
|
|
|
|
- desc: obj.goodsObjact.store_info,
|
|
|
|
- title: obj.goodsObjact.store_name,
|
|
|
|
- success: function() {}
|
|
|
|
- };
|
|
|
|
- }
|
|
|
|
- if (obj.goodsType == 2) {
|
|
|
|
- data = {
|
|
|
|
- link: url, // 分享链接
|
|
|
|
- imgUrl: obj.goodsObjact.image, // 分享图标
|
|
|
|
- title: obj.goodsObjact.title,
|
|
|
|
- desc: obj.goodsObjact.info,
|
|
|
|
- success: function() {}
|
|
|
|
- };
|
|
|
|
- }
|
|
|
|
- weixindata(data);
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- // #endif
|
|
|
|
- /**
|
|
|
|
- * 统一跳转接口,拦截未登录路由
|
|
|
|
- * navigator标签现在默认没有转场动画,所以用view
|
|
|
|
- */
|
|
|
|
- navTo(url) {
|
|
|
|
- uni.navigateTo({
|
|
|
|
- url
|
|
|
|
- });
|
|
|
|
- },
|
|
|
|
- // 立即购买
|
|
|
|
- buy(item) {
|
|
|
|
- let obj = this;
|
|
|
|
- if(obj.uniquetype == false){
|
|
|
|
- // 创建传值对象
|
|
|
|
- console.log(obj.list.productValue);
|
|
|
|
- console.log(obj.list);
|
|
|
|
- let data = {
|
|
|
|
- // cartNum: obj.goodsNumber, //商品数量
|
|
|
|
- cartNum: obj.chooseGoodsNumber, //商品数量
|
|
|
|
- uniqueId: obj.uniqueId, //商品标签
|
|
|
|
- new: 1, //商品是否新增加到购物车1为不加入0为加入
|
|
|
|
- mer_id: obj.shopId,
|
|
|
|
- combinationId: obj.goodsid, //拼团编号
|
|
|
|
- productId: obj.goodsObjact.product_id, //商品编号
|
|
|
|
- };
|
|
|
|
- this.specClass = 'none';
|
|
|
|
- cartAdd(data)
|
|
|
|
- .then(function(e) {
|
|
|
|
- let da = e.data;
|
|
|
|
- console.log(e);
|
|
|
|
- if (obj.type == 1) {
|
|
|
|
- // 跳转到支付页
|
|
|
|
- uni.navigateTo({
|
|
|
|
- url: '/pages/order/createOrder?id=' + da.cartId + '&goodsType=' + obj.goodsType
|
|
|
|
- });
|
|
|
|
- }
|
|
|
|
- if (obj.type == 2) {
|
|
|
|
- obj.$api.msg('成功加入购物车');
|
|
|
|
- obj.toggleSpec();
|
|
|
|
- }
|
|
|
|
- })
|
|
|
|
- .catch(e => {
|
|
|
|
- console.log(e);
|
|
|
|
- });
|
|
|
|
- }else{
|
|
|
|
- console.log(obj.uniquetype,'obj.uniquetype')
|
|
|
|
- uni.navigateTo({
|
|
|
|
- url: '/pages/product/details?pink_id=' + obj.shop + '&unique=' + obj.uniqueId + '&uniquetype=' + obj.uniquetype
|
|
|
|
- });
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- },
|
|
|
|
- // 阻止触发上级事件
|
|
|
|
- stopPrevent() {}
|
|
|
|
- }
|
|
|
|
-};
|
|
|
|
-</script>
|
|
|
|
-
|
|
|
|
-<style lang="scss">
|
|
|
|
-page {
|
|
|
|
- background: $page-color-base;
|
|
|
|
- padding-bottom: 160rpx;
|
|
|
|
- line-height: 1;
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-// 处理图片间白色间距问题
|
|
|
|
-/deep/ .pHeight {
|
|
|
|
- line-height: 0;
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-/deep/ div,
|
|
|
|
-/deep/ table {
|
|
|
|
- max-width: 100% !important;
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-/* #ifdef MP */
|
|
|
|
-.rich-img {
|
|
|
|
- width: 100% !important;
|
|
|
|
- height: auto;
|
|
|
|
-}
|
|
|
|
-// 处理图片间白色间距问题
|
|
|
|
-.pHeight {
|
|
|
|
- line-height: 0;
|
|
|
|
-}
|
|
|
|
-/* #endif */
|
|
|
|
-
|
|
|
|
-.popup-row{
|
|
|
|
- width:580rpx;
|
|
|
|
- background:#ffffff;
|
|
|
|
- border-radius:20rpx;
|
|
|
|
- .popup-1{
|
|
|
|
- padding: 35rpx 0;
|
|
|
|
- font-size:$font-lg;
|
|
|
|
- font-weight:bold;
|
|
|
|
- color:#333333;
|
|
|
|
- text-align: center;
|
|
|
|
- border-bottom: 1px solid #EEEEEE;
|
|
|
|
- }
|
|
|
|
- .popcont-box {
|
|
|
|
- height: 600rpx;
|
|
|
|
- }
|
|
|
|
- .popup-2{
|
|
|
|
- padding: 0 25rpx;
|
|
|
|
- .popup-2-row{
|
|
|
|
- padding: 25rpx 0;
|
|
|
|
- border-bottom: 1px solid #EEEEEE;
|
|
|
|
- &:nth-last-child(1){
|
|
|
|
- border-bottom:none;
|
|
|
|
- }
|
|
|
|
- .row-1{
|
|
|
|
- width: 70%;
|
|
|
|
- .one{
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- image{
|
|
|
|
- width: 75rpx;
|
|
|
|
- height: 75rpx;
|
|
|
|
- border-radius: 50%;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .two{
|
|
|
|
- margin-left: 20rpx;
|
|
|
|
- font-size:28rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#333333;
|
|
|
|
- .two-1{
|
|
|
|
- // margin-bottom: 20rpx;
|
|
|
|
- font-size:$font-base;
|
|
|
|
- font-weight:500;
|
|
|
|
- max-width: 160rpx;
|
|
|
|
- overflow: hidden;
|
|
|
|
- text-overflow: ellipsis;
|
|
|
|
- white-space: nowrap;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .two-1-1{
|
|
|
|
- font-size:$font-base;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#666666;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .row-2{
|
|
|
|
- padding: 20rpx 30rpx;
|
|
|
|
- background:$base-color;
|
|
|
|
- border-radius:10rpx;
|
|
|
|
- font-size:28rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#FFFFFF;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-.popup-rows{
|
|
|
|
- width:580rpx;
|
|
|
|
- background:#ffffff;
|
|
|
|
- border-radius:20rpx;
|
|
|
|
- text-align: center;
|
|
|
|
- padding-bottom: 35rpx;
|
|
|
|
- .rows-1{
|
|
|
|
- font-size:$font-lg;
|
|
|
|
- font-weight:bold;
|
|
|
|
- color:#333333;
|
|
|
|
- padding-top: 60rpx;
|
|
|
|
- }
|
|
|
|
- .rows-2{
|
|
|
|
- margin-top: 25rpx;
|
|
|
|
- font-size:28rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#333333;
|
|
|
|
- }
|
|
|
|
- .rows-3{
|
|
|
|
- margin-top: 35rpx;
|
|
|
|
- padding: 0 50rpx;
|
|
|
|
-
|
|
|
|
- .rows-3-group {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- flex-direction: column;
|
|
|
|
- .group-1{
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- flex-direction: column;
|
|
|
|
- }
|
|
|
|
- .group-2{
|
|
|
|
- flex: 1;
|
|
|
|
- font-size:$font-sm - 4rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#666666;
|
|
|
|
- margin-top: 10rpx;
|
|
|
|
- width:55rpx;
|
|
|
|
- overflow:hidden;
|
|
|
|
- white-space:nowrap;
|
|
|
|
- text-overflow:ellipsis;
|
|
|
|
- }
|
|
|
|
- image{
|
|
|
|
- width: 80rpx;
|
|
|
|
- height: 80rpx;
|
|
|
|
- border-radius: 50%;
|
|
|
|
- }
|
|
|
|
- .group-1-1{
|
|
|
|
- z-index: 10;
|
|
|
|
- margin-top: -25rpx;
|
|
|
|
- width:70rpx;
|
|
|
|
- height:25rpx;
|
|
|
|
- background:#e64048;
|
|
|
|
- border-radius:12rpx;
|
|
|
|
- font-size:$font-sm - 4rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#ffffff;
|
|
|
|
- line-height: 25rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .rows-4{
|
|
|
|
- margin: 40rpx 45rpx 0rpx 45rpx;
|
|
|
|
- padding: 25rpx 0;
|
|
|
|
- background:$base-color;
|
|
|
|
- border-radius:10rpx;
|
|
|
|
-
|
|
|
|
- font-size:$font-lg;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#ffffff;
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.delete{
|
|
|
|
- width: 60rpx;
|
|
|
|
- height: 60rpx;
|
|
|
|
- position: absolute;
|
|
|
|
- right: -30rpx;
|
|
|
|
- top:-30rpx;
|
|
|
|
- image{
|
|
|
|
- width: 60rpx;
|
|
|
|
- height: 60rpx;
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-/* 评价 */
|
|
|
|
-.eva-section {
|
|
|
|
- padding: 20rpx 30rpx;
|
|
|
|
- background: #fff;
|
|
|
|
- margin-top: 20rpx;
|
|
|
|
- .e-header {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- font-size:28rpx;
|
|
|
|
- color: #333333;
|
|
|
|
- .tit {
|
|
|
|
- margin-right: 15rpx;
|
|
|
|
- }
|
|
|
|
- .tip {
|
|
|
|
- flex: 1;
|
|
|
|
- font-size:24rpx;
|
|
|
|
- color: #999999;
|
|
|
|
- text-align: right;
|
|
|
|
- }
|
|
|
|
- .iconenter {
|
|
|
|
- width: 24rpx;
|
|
|
|
- height: 24rpx;
|
|
|
|
- margin-left: 10rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .eva-box {
|
|
|
|
- padding-top: 30rpx;
|
|
|
|
- .box-1{
|
|
|
|
- .left{
|
|
|
|
- image{
|
|
|
|
- width: 80rpx;
|
|
|
|
- height: 80rpx;
|
|
|
|
- border-radius: 50%;
|
|
|
|
- }
|
|
|
|
- .content{
|
|
|
|
- margin-left: 15rpx;
|
|
|
|
- .content-name{
|
|
|
|
- font-size:24rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#333333;
|
|
|
|
- }
|
|
|
|
- .content-time{
|
|
|
|
- font-size:20rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#999999;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .right{
|
|
|
|
- .image{
|
|
|
|
- width: 25rpx;
|
|
|
|
- height: 25rpx;
|
|
|
|
- margin-left: 10rpx;
|
|
|
|
- }
|
|
|
|
- .red{
|
|
|
|
- margin-left: 15rpx;
|
|
|
|
- font-size:24rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#fd5b23;
|
|
|
|
- }
|
|
|
|
- .con_image{
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .box-2{
|
|
|
|
- padding: 30rpx 0 15rpx 0;
|
|
|
|
- font-size:28rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#666666;
|
|
|
|
- }
|
|
|
|
- .box-3{
|
|
|
|
- .box-3-1{
|
|
|
|
- display: inline;
|
|
|
|
- width: 150rpx;
|
|
|
|
- height: 150rpx;
|
|
|
|
- image{
|
|
|
|
- margin-right: 20rpx;
|
|
|
|
- width: 150rpx;
|
|
|
|
- height: 150rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-/* .list-row {
|
|
|
|
- position: fixed;
|
|
|
|
- top: 450rpx;
|
|
|
|
- left: 86rpx;
|
|
|
|
-
|
|
|
|
- .row {
|
|
|
|
- position: relative;
|
|
|
|
- width: 578rpx;
|
|
|
|
- height: 700rpx;
|
|
|
|
- background: #ffffff;
|
|
|
|
- border-radius: 20rpx;
|
|
|
|
-
|
|
|
|
- .row-1 {
|
|
|
|
- flex: 1;
|
|
|
|
- text-align: center;
|
|
|
|
- padding: 26rpx 223rpx;
|
|
|
|
- border-bottom: 2rpx solid #eeeeee;
|
|
|
|
-
|
|
|
|
- .row-1-1 {
|
|
|
|
- font-size: $font-lg;
|
|
|
|
- font-weight: bold;
|
|
|
|
- color: #333333;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .row-2 {
|
|
|
|
- padding: 0 23rpx;
|
|
|
|
-
|
|
|
|
- .pinklist_list {
|
|
|
|
- padding: 20rpx 0;
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: space-around;
|
|
|
|
- align-items: center;
|
|
|
|
- border-bottom: 1px solid #eeeeee;
|
|
|
|
-
|
|
|
|
- .left {
|
|
|
|
- width: 74rpx;
|
|
|
|
- height: 74rpx;
|
|
|
|
- background-color: #e3e3e3;
|
|
|
|
- border-radius: 50%;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .center {
|
|
|
|
- display: flex;
|
|
|
|
- flex-wrap: wrap;
|
|
|
|
- margin-left: 17rpx;
|
|
|
|
-
|
|
|
|
- .center-1 {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- letter-spacing: 3rpx;
|
|
|
|
-
|
|
|
|
- .center-1-1 {
|
|
|
|
- font-size: $font-base;
|
|
|
|
- font-weight: 500;
|
|
|
|
- color: #333333;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .center-1-2 {
|
|
|
|
- font-size: $font-base - 2rpx;
|
|
|
|
- font-weight: 500;
|
|
|
|
- color: #333333;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .right {
|
|
|
|
- width: 134rpx;
|
|
|
|
- height: 59rpx;
|
|
|
|
- background: $base-color;
|
|
|
|
- border-radius: 10rpx;
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: center;
|
|
|
|
-
|
|
|
|
- .right-word {
|
|
|
|
- font-size: 26rpx;
|
|
|
|
- font-weight: 500;
|
|
|
|
- color: #ffffff;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .row-3 {
|
|
|
|
- width: 56rpx;
|
|
|
|
- height: 56rpx;
|
|
|
|
- position: absolute;
|
|
|
|
- top: -28rpx;
|
|
|
|
- right: -28rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-} */
|
|
|
|
-
|
|
|
|
-.iconenter {
|
|
|
|
- font-size: $font-base + 2rpx;
|
|
|
|
- color: #888;
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-.carousel {
|
|
|
|
- height: 722rpx;
|
|
|
|
- position: relative;
|
|
|
|
-
|
|
|
|
- swiper {
|
|
|
|
- height: 100%;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .image-wrapper {
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .swiper-item {
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: center;
|
|
|
|
- align-content: center;
|
|
|
|
- height: 750rpx;
|
|
|
|
- overflow: hidden;
|
|
|
|
-
|
|
|
|
- image {
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-/* 标题简介 */
|
|
|
|
-.introduce-section {
|
|
|
|
- background: #fff;
|
|
|
|
- padding: 15rpx 25rpx 30rpx 25rpx;
|
|
|
|
- .introduce-price{
|
|
|
|
- width: 100%;
|
|
|
|
- overflow: hidden;
|
|
|
|
- .price{
|
|
|
|
- display: flex;
|
|
|
|
- align-items: flex-end;
|
|
|
|
- justify-content: flex-start;
|
|
|
|
-
|
|
|
|
- .price-left{
|
|
|
|
- display: flex;
|
|
|
|
- align-items: flex-end;
|
|
|
|
- color:#fc4141;
|
|
|
|
- margin-right: 20rpx;
|
|
|
|
- .left-1{
|
|
|
|
- margin-right: 5rpx;
|
|
|
|
- font-size:28rpx;
|
|
|
|
- }
|
|
|
|
- .left-2{
|
|
|
|
- font-size:$font-lg + 16rpx;
|
|
|
|
- line-height: 38rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .price-right{
|
|
|
|
- font-size:28rpx;
|
|
|
|
- color:#333333;
|
|
|
|
- opacity:0.61;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .people{
|
|
|
|
- width: 140rpx;
|
|
|
|
- height: 45rpx;
|
|
|
|
- background: url(../../../static/img/img43.png) no-repeat center;
|
|
|
|
- background-size: 100%;
|
|
|
|
- .people_number{
|
|
|
|
- margin-left: 60rpx;
|
|
|
|
- font-size:20rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:rgba(250,39,64,1);
|
|
|
|
- line-height: 40rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- /* .share{
|
|
|
|
- image{
|
|
|
|
- width: 30rpx;
|
|
|
|
- height: 35rpx;
|
|
|
|
- }
|
|
|
|
- } */
|
|
|
|
- }
|
|
|
|
- .title {
|
|
|
|
- margin-top: 30rpx;
|
|
|
|
- font-size: 32rpx;
|
|
|
|
- color: #1D2023;
|
|
|
|
- line-height: 40rpx;
|
|
|
|
- font-weight: 600;
|
|
|
|
- }
|
|
|
|
- .bot-row{
|
|
|
|
- margin-top: 20rpx;
|
|
|
|
- overflow: hidden;
|
|
|
|
- font-size:24rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#999999;
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-/* 标题简介 */
|
|
|
|
-/* .introduce-section {
|
|
|
|
- background: #fff;
|
|
|
|
- padding: 20rpx 30rpx;
|
|
|
|
-
|
|
|
|
- .title {
|
|
|
|
- font-size: 32rpx;
|
|
|
|
- color: $font-color-dark;
|
|
|
|
- height: 50rpx;
|
|
|
|
- line-height: 50rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .price-box {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: baseline;
|
|
|
|
- // height: 64rpx;
|
|
|
|
- padding: 10rpx 0;
|
|
|
|
- font-size: 26rpx;
|
|
|
|
- color: $uni-color-primary;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .price {
|
|
|
|
- font-size: $font-lg + 2rpx;
|
|
|
|
- color: #666666 !important;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .vip_price {
|
|
|
|
- font-size: $font-lg + 2rpx;
|
|
|
|
- color: $uni-color-primary;
|
|
|
|
- padding-left: 15rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .m-price {
|
|
|
|
- margin: 0 12rpx;
|
|
|
|
- color: $font-color-light;
|
|
|
|
- text-decoration: line-through;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .coupon-tip {
|
|
|
|
- align-items: center;
|
|
|
|
- padding: 4rpx 10rpx;
|
|
|
|
- background: $uni-color-primary;
|
|
|
|
- font-size: $font-sm;
|
|
|
|
- color: #fff;
|
|
|
|
- border-radius: 6rpx;
|
|
|
|
- line-height: 1;
|
|
|
|
- transform: translateY(-4rpx);
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .bot-row {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- height: 50rpx;
|
|
|
|
- font-size: $font-sm;
|
|
|
|
- color: $font-color-light;
|
|
|
|
-
|
|
|
|
- text {
|
|
|
|
- flex: 1;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .people {
|
|
|
|
- border-radius: 10rpx;
|
|
|
|
- height: 35rpx !important;
|
|
|
|
- border: 2rpx solid #db1935;
|
|
|
|
- height: 40rpx;
|
|
|
|
-
|
|
|
|
- .people_image {
|
|
|
|
- background-color: #db1935;
|
|
|
|
- width: 40rpx;
|
|
|
|
- height: 35rpx;
|
|
|
|
- text-align: center;
|
|
|
|
- border-top-left-radius: 20%;
|
|
|
|
- border-bottom-left-radius: 20%;
|
|
|
|
-
|
|
|
|
- image {
|
|
|
|
- width: 25rpx;
|
|
|
|
- height: 20rpx;
|
|
|
|
- // margin-bottom: 5rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .people_number {
|
|
|
|
- padding: 5rpx 10rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-} */
|
|
|
|
-
|
|
|
|
-/* 分享 */
|
|
|
|
-.share-section {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- color: $font-color-base;
|
|
|
|
- background: linear-gradient(left, #fdf5f6, #fbebf6);
|
|
|
|
- padding: 12rpx 30rpx;
|
|
|
|
-
|
|
|
|
- .share-icon {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- width: 70rpx;
|
|
|
|
- height: 30rpx;
|
|
|
|
- line-height: 1;
|
|
|
|
- border: 1px solid $uni-color-primary;
|
|
|
|
- border-radius: 4rpx;
|
|
|
|
- position: relative;
|
|
|
|
- overflow: hidden;
|
|
|
|
- font-size: 22rpx;
|
|
|
|
- color: $uni-color-primary;
|
|
|
|
-
|
|
|
|
- &:after {
|
|
|
|
- content: '';
|
|
|
|
- width: 50rpx;
|
|
|
|
- height: 50rpx;
|
|
|
|
- border-radius: 50%;
|
|
|
|
- left: -20rpx;
|
|
|
|
- top: -12rpx;
|
|
|
|
- position: absolute;
|
|
|
|
- background: $uni-color-primary;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .iconfavorfill {
|
|
|
|
- position: relative;
|
|
|
|
- z-index: 1;
|
|
|
|
- font-size: 24rpx;
|
|
|
|
- margin-left: 2rpx;
|
|
|
|
- margin-right: 10rpx;
|
|
|
|
- color: #fff;
|
|
|
|
- line-height: 1;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .tit {
|
|
|
|
- font-size: $font-base;
|
|
|
|
- margin-left: 10rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .iconprompt {
|
|
|
|
- padding: 10rpx;
|
|
|
|
- font-size: 30rpx;
|
|
|
|
- line-height: 1;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .share-btn {
|
|
|
|
- flex: 1;
|
|
|
|
- text-align: right;
|
|
|
|
- font-size: $font-sm;
|
|
|
|
- color: $uni-color-primary;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .iconenter {
|
|
|
|
- font-size: $font-sm;
|
|
|
|
- margin-left: 4rpx;
|
|
|
|
- color: $uni-color-primary;
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.c-list {
|
|
|
|
- font-size: $font-sm + 2rpx;
|
|
|
|
- color: #303133;
|
|
|
|
- margin-top: 20rpx;
|
|
|
|
- background: #fff;
|
|
|
|
-
|
|
|
|
- .c-row {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- padding: 20rpx 30rpx;
|
|
|
|
- position: relative;
|
|
|
|
-
|
|
|
|
- .c-text {
|
|
|
|
- text {
|
|
|
|
- padding-left: 25rpx;
|
|
|
|
- padding-right: 25rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .tit {
|
|
|
|
- width: 140rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .con {
|
|
|
|
- flex: 1;
|
|
|
|
- color: $font-color-dark;
|
|
|
|
-
|
|
|
|
- .selected-text {
|
|
|
|
- margin-right: 10rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .bz-list {
|
|
|
|
- height: 40rpx;
|
|
|
|
- font-size: $font-sm + 2rpx;
|
|
|
|
- color: $font-color-dark;
|
|
|
|
-
|
|
|
|
- text {
|
|
|
|
- display: inline-block;
|
|
|
|
- margin-right: 30rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .con-list {
|
|
|
|
- flex: 1;
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- color: $font-color-dark;
|
|
|
|
- line-height: 40rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .red {
|
|
|
|
- color: $uni-color-primary;
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-/* 评价 */
|
|
|
|
-/* .eva-section {
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- padding: 20rpx 30rpx;
|
|
|
|
- background: #fff;
|
|
|
|
- margin-top: 16rpx;
|
|
|
|
-
|
|
|
|
- .e-header {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- height: 70rpx;
|
|
|
|
- font-size: $font-sm + 2rpx;
|
|
|
|
- color: $font-color-light;
|
|
|
|
-
|
|
|
|
- .tit {
|
|
|
|
- font-size: $font-base + 2rpx;
|
|
|
|
- color: $font-color-dark;
|
|
|
|
- margin-right: 4rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .tip {
|
|
|
|
- flex: 1;
|
|
|
|
- text-align: right;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .iconenter {
|
|
|
|
- margin-left: 10rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.eva-box {
|
|
|
|
- display: flex;
|
|
|
|
- padding: 20rpx 0;
|
|
|
|
-
|
|
|
|
- .portrait {
|
|
|
|
- flex-shrink: 0;
|
|
|
|
- width: 80rpx;
|
|
|
|
- height: 80rpx;
|
|
|
|
- border-radius: 100px;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .right {
|
|
|
|
- flex: 1;
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- font-size: $font-base;
|
|
|
|
- color: $font-color-base;
|
|
|
|
- padding-left: 26rpx;
|
|
|
|
-
|
|
|
|
- .con {
|
|
|
|
- font-size: $font-base;
|
|
|
|
- color: $font-color-dark;
|
|
|
|
- padding: 20rpx 0;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .bot {
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- font-size: $font-sm;
|
|
|
|
- color: $font-color-light;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.con_image {
|
|
|
|
- width: 130rpx;
|
|
|
|
- height: 130rpx;
|
|
|
|
- display: inline-block;
|
|
|
|
- padding: 15rpx;
|
|
|
|
-
|
|
|
|
- image {
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- }
|
|
|
|
-}*/
|
|
|
|
-
|
|
|
|
-/* 详情 */
|
|
|
|
-.detail-desc {
|
|
|
|
- .desc-title{
|
|
|
|
- font-size:28rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#1D2023;
|
|
|
|
- padding: 25rpx 0;
|
|
|
|
- .one{
|
|
|
|
- width:77rpx;
|
|
|
|
- height:1px;
|
|
|
|
- background:linear-gradient( to right ,rgba(204,204,204,0), rgba(204,204,204,1));
|
|
|
|
- margin-right: 10rpx;
|
|
|
|
- }
|
|
|
|
- .two{
|
|
|
|
- margin-left: 10rpx;
|
|
|
|
- width:77rpx;
|
|
|
|
- height:1px;
|
|
|
|
- background:linear-gradient( to left ,rgba(204,204,204,0), rgba(204,204,204,1));
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
-}
|
|
|
|
-/* .detail-desc {
|
|
|
|
- background: #fff;
|
|
|
|
- margin-top: 16rpx;
|
|
|
|
-
|
|
|
|
- img {
|
|
|
|
- max-width: 100%;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .d-header {
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: center;
|
|
|
|
- align-items: center;
|
|
|
|
- height: 80rpx;
|
|
|
|
- font-size: $font-base + 2rpx;
|
|
|
|
- color: $font-color-dark;
|
|
|
|
- position: relative;
|
|
|
|
-
|
|
|
|
- text {
|
|
|
|
- padding: 0 20rpx;
|
|
|
|
- background: #fff;
|
|
|
|
- position: relative;
|
|
|
|
- z-index: 1;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- &:after {
|
|
|
|
- position: absolute;
|
|
|
|
- left: 50%;
|
|
|
|
- top: 50%;
|
|
|
|
- transform: translateX(-50%);
|
|
|
|
- width: 300rpx;
|
|
|
|
- height: 0;
|
|
|
|
- content: '';
|
|
|
|
- border-bottom: 1px solid #ccc;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-} */
|
|
|
|
-
|
|
|
|
-/* 规格选择弹窗 */
|
|
|
|
-.attr-content {
|
|
|
|
- padding: 25rpx 30rpx;
|
|
|
|
-
|
|
|
|
- .a-t {
|
|
|
|
- display: flex;
|
|
|
|
-
|
|
|
|
- image {
|
|
|
|
- width: 170rpx;
|
|
|
|
- height: 170rpx;
|
|
|
|
- flex-shrink: 0;
|
|
|
|
- border-radius: 8rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .right {
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- padding-left: 24rpx;
|
|
|
|
- font-size: $font-sm + 2rpx;
|
|
|
|
- color: $font-color-base;
|
|
|
|
- line-height: 42rpx;
|
|
|
|
- width: 75%;
|
|
|
|
-
|
|
|
|
- .price {
|
|
|
|
- font-size: $font-lg;
|
|
|
|
- color: $uni-color-primary;
|
|
|
|
- margin: 10rpx 0rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .name {
|
|
|
|
- font-size: 32rpx;
|
|
|
|
- color: $font-color-dark;
|
|
|
|
- height: 50rpx;
|
|
|
|
- overflow: hidden;
|
|
|
|
- text-overflow: ellipsis;
|
|
|
|
- white-space: nowrap;
|
|
|
|
- display: block;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .selected-text {
|
|
|
|
- margin-right: 10rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .attr-list {
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- font-size: $font-base + 2rpx;
|
|
|
|
- color: $font-color-base;
|
|
|
|
- padding-top: 30rpx;
|
|
|
|
- padding-left: 10rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .item-list {
|
|
|
|
- padding: 20rpx 0 0;
|
|
|
|
- display: flex;
|
|
|
|
- flex-wrap: wrap;
|
|
|
|
-
|
|
|
|
- text {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: center;
|
|
|
|
- background: #eee;
|
|
|
|
- margin-right: 20rpx;
|
|
|
|
- margin-bottom: 20rpx;
|
|
|
|
- border-radius: 100rpx;
|
|
|
|
- min-width: 60rpx;
|
|
|
|
- height: 60rpx;
|
|
|
|
- padding: 0 20rpx;
|
|
|
|
- font-size: $font-base;
|
|
|
|
- color: $font-color-dark;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .selected {
|
|
|
|
- background: #fbebee;
|
|
|
|
- color: $uni-color-primary;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-/* 弹出层 */
|
|
|
|
-.popup {
|
|
|
|
- position: fixed;
|
|
|
|
- left: 0;
|
|
|
|
- top: 0;
|
|
|
|
- right: 0;
|
|
|
|
- bottom: 0;
|
|
|
|
- z-index: 99;
|
|
|
|
-
|
|
|
|
- &.show {
|
|
|
|
- display: block;
|
|
|
|
-
|
|
|
|
- .mask {
|
|
|
|
- animation: showPopup 0.2s linear both;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .layer {
|
|
|
|
- animation: showLayer 0.2s linear both;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- &.hide {
|
|
|
|
- .mask {
|
|
|
|
- animation: hidePopup 0.2s linear both;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .layer {
|
|
|
|
- animation: hideLayer 0.2s linear both;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- &.none {
|
|
|
|
- display: none;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .mask {
|
|
|
|
- position: fixed;
|
|
|
|
- top: 0;
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- z-index: 1;
|
|
|
|
- background-color: rgba(0, 0, 0, 0.4);
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .layer {
|
|
|
|
- position: fixed;
|
|
|
|
- z-index: 99;
|
|
|
|
- bottom: 0;
|
|
|
|
- width: 100%;
|
|
|
|
- min-height: 35vh;
|
|
|
|
- border-radius: 10rpx 10rpx 0 0;
|
|
|
|
- background-color: #fff;
|
|
|
|
-
|
|
|
|
- .btn {
|
|
|
|
- height: 66rpx;
|
|
|
|
- line-height: 66rpx;
|
|
|
|
- border-radius: 100rpx;
|
|
|
|
- background: $uni-color-primary;
|
|
|
|
- font-size: $font-base + 2rpx;
|
|
|
|
- color: #fff;
|
|
|
|
- margin: 30rpx auto 20rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- @keyframes showPopup {
|
|
|
|
- 0% {
|
|
|
|
- opacity: 0;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- 100% {
|
|
|
|
- opacity: 1;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- @keyframes hidePopup {
|
|
|
|
- 0% {
|
|
|
|
- opacity: 1;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- 100% {
|
|
|
|
- opacity: 0;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- @keyframes showLayer {
|
|
|
|
- 0% {
|
|
|
|
- transform: translateY(120%);
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- 100% {
|
|
|
|
- transform: translateY(0%);
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- @keyframes hideLayer {
|
|
|
|
- 0% {
|
|
|
|
- transform: translateY(0);
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- 100% {
|
|
|
|
- transform: translateY(120%);
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-//分享
|
|
|
|
-.btn_fenxiang {
|
|
|
|
- position: fixed;
|
|
|
|
- right: 20rpx;
|
|
|
|
- bottom: 50%;
|
|
|
|
- z-index: 95;
|
|
|
|
- width: 100rpx;
|
|
|
|
- color: #ffffff;
|
|
|
|
- border-radius: 100%;
|
|
|
|
- background-color: $background-color;
|
|
|
|
- line-height: 100rpx;
|
|
|
|
- text-align: center;
|
|
|
|
- font-size: 30rpx;
|
|
|
|
-}
|
|
|
|
-.shareDate{
|
|
|
|
- position: fixed;
|
|
|
|
- right: 20rpx;
|
|
|
|
- bottom: 50%;
|
|
|
|
- z-index: 95;
|
|
|
|
- color: #ffffff;
|
|
|
|
- border-radius: 100rpx;
|
|
|
|
- height: 120rpx;
|
|
|
|
- line-height: 120rpx;
|
|
|
|
- background-color: $background-color;
|
|
|
|
- text-align: center;
|
|
|
|
- font-size: 30rpx;
|
|
|
|
-}
|
|
|
|
-/* 底部操作菜单 */
|
|
|
|
-.page-bottom {
|
|
|
|
- position: fixed;
|
|
|
|
- bottom: 0rpx;
|
|
|
|
- z-index: 95;
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: center;
|
|
|
|
- align-items: center;
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100rpx;
|
|
|
|
- background: rgba(255, 255, 255, 0.9);
|
|
|
|
- .botton-1{
|
|
|
|
- width: 100rpx;
|
|
|
|
- height: 100rpx;
|
|
|
|
- background-color: #FFFFFF;
|
|
|
|
- .botton-frame {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- flex-direction: column;
|
|
|
|
- .img-box {
|
|
|
|
- width: 45rpx;
|
|
|
|
- height: 40rpx;
|
|
|
|
- image{
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- .word{
|
|
|
|
- margin-top: 6rpx;
|
|
|
|
- font-size:20rpx;
|
|
|
|
- font-weight:400;
|
|
|
|
- color:#666666;
|
|
|
|
- &.active {
|
|
|
|
- color: $uni-color-primary;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .p-b-btn {
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: center;
|
|
|
|
- font-size: $font-sm;
|
|
|
|
- color: $font-color-base;
|
|
|
|
- width: 100rpx;
|
|
|
|
- height: 100rpx;
|
|
|
|
-
|
|
|
|
- .iconfont {
|
|
|
|
- font-size: 40rpx;
|
|
|
|
- line-height: 48rpx;
|
|
|
|
- color: $font-color-light;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- &.active,
|
|
|
|
- &.active .iconfont {
|
|
|
|
- color: $uni-color-primary;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .icon-fenxiang2 {
|
|
|
|
- font-size: 42rpx;
|
|
|
|
- transform: translateY(-2rpx);
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .iconlikefill {
|
|
|
|
- font-size: 46rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .gobuy {
|
|
|
|
- width: 100%;
|
|
|
|
- background: #db1935;
|
|
|
|
- height: 100%;
|
|
|
|
- color: #ffffff;
|
|
|
|
- text-align: center;
|
|
|
|
- padding-top: 25rpx;
|
|
|
|
- border-radius: 15rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .action-btn-group {
|
|
|
|
- display: flex;
|
|
|
|
- flex:1;
|
|
|
|
- height: 100%;
|
|
|
|
- overflow: hidden;
|
|
|
|
- position: relative;
|
|
|
|
-
|
|
|
|
- &:after {
|
|
|
|
- content: '';
|
|
|
|
- position: absolute;
|
|
|
|
- top: 50%;
|
|
|
|
- right: 50%;
|
|
|
|
- transform: translateY(-50%);
|
|
|
|
- height: 28rpx;
|
|
|
|
- width: 0;
|
|
|
|
- // border-right: 1px solid rgba(255, 255, 255, 0.5);
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .action-btn {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: center;
|
|
|
|
- flex: 1;
|
|
|
|
- height: 100%;
|
|
|
|
- font-size: $font-lg + 4rpx;
|
|
|
|
- font-weight:bold;
|
|
|
|
- background: transparent;
|
|
|
|
- border-radius:0;
|
|
|
|
- letter-spacing: 5rpx;
|
|
|
|
-
|
|
|
|
- &.buy-now-btn {
|
|
|
|
- background-color: #ffb238;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- &.add-cart-btn {
|
|
|
|
- background:$base-color;
|
|
|
|
- }
|
|
|
|
- &.btn-favorites-btn {
|
|
|
|
- background-color: rgba(24, 179, 255, 1);
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- /* .action-btn1 {
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: center;
|
|
|
|
- width: 210rpx;
|
|
|
|
- height: 100%;
|
|
|
|
- font-size: $font-base;
|
|
|
|
- padding: 0;
|
|
|
|
- border-radius: 0;
|
|
|
|
- background: transparent;
|
|
|
|
-
|
|
|
|
- &.buy-now-btn {
|
|
|
|
- background-color: #ffb238;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- &.add-cart-btn {
|
|
|
|
- background-color: #db1935;
|
|
|
|
- }
|
|
|
|
- } */
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-// 底部拼团、秒杀支付按钮
|
|
|
|
-.goods-pay-box {
|
|
|
|
- position: fixed;
|
|
|
|
- left: 0;
|
|
|
|
- bottom: 0;
|
|
|
|
- z-index: 95;
|
|
|
|
- width: 750rpx;
|
|
|
|
- height: 100rpx;
|
|
|
|
- line-height: 1;
|
|
|
|
- color: #ffffff;
|
|
|
|
- text-align: center;
|
|
|
|
- font-size: $font-lg;
|
|
|
|
- .bgLine {
|
|
|
|
- background: linear-gradient(90deg, rgba(239, 78, 81, 1) 0%, rgba(244, 113, 59, 1) 100%);
|
|
|
|
- }
|
|
|
|
- // 拼团支付按钮
|
|
|
|
- .goods-pay {
|
|
|
|
- display: flex;
|
|
|
|
- align-content: center;
|
|
|
|
- flex-wrap: wrap;
|
|
|
|
- justify-content: center;
|
|
|
|
- .goods-buttom,
|
|
|
|
- .goods-buttom-money {
|
|
|
|
- width: 100%;
|
|
|
|
- }
|
|
|
|
- .goods-buttom-money {
|
|
|
|
- font-size: $font-base;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .goods-pay-stop,
|
|
|
|
- .goods-pay {
|
|
|
|
- padding: 15rpx 0;
|
|
|
|
- height: 100%;
|
|
|
|
- width: 100%;
|
|
|
|
- }
|
|
|
|
- .goods-pay-stop {
|
|
|
|
- background: $color-gray;
|
|
|
|
- line-height: 70rpx;
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-//拼团列表
|
|
|
|
-.pinklistbox {
|
|
|
|
- background: #ffffff;
|
|
|
|
- text-align: center;
|
|
|
|
- font-size: 26rpx;
|
|
|
|
- margin-top: 25rpx;
|
|
|
|
- .listbox-1{
|
|
|
|
- padding: 25rpx;
|
|
|
|
- font-size:$font-lg - 2rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#333333;
|
|
|
|
- border-bottom: 1px solid #EEEEEE;
|
|
|
|
- .more{
|
|
|
|
- font-size:$font-base - 2rpx;
|
|
|
|
- font-weight:500;
|
|
|
|
- color:#999999;
|
|
|
|
- image {
|
|
|
|
- width: 25rpx;
|
|
|
|
- height: 25rpx;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .pinklist{
|
|
|
|
- margin: 0 25rpx;
|
|
|
|
-
|
|
|
|
- .pinklist_list{
|
|
|
|
- padding: 25rpx 0;
|
|
|
|
- border-bottom: 1px solid #EEEEEE;
|
|
|
|
- &:nth-last-child(1){
|
|
|
|
- border-bottom: none;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-/* .pinklistbox {
|
|
|
|
- background: #ffffff;
|
|
|
|
- margin-top: 25rpx;
|
|
|
|
- overflow: hidden;
|
|
|
|
-} */
|
|
|
|
-
|
|
|
|
-.pink_num {
|
|
|
|
- background: -webkit-linear-gradient(left, #fdf5f6, #fbebf6);
|
|
|
|
- padding: 15rpx 25rpx;
|
|
|
|
- font-size: 26rpx;
|
|
|
|
- color: #dd524d;
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.pint {
|
|
|
|
- background: -webkit-linear-gradient(0deg, #fa2740,#fe5544);
|
|
|
|
- border-radius:10rpx;
|
|
|
|
- margin-left: 20rpx;
|
|
|
|
- padding: 20rpx 25rpx;
|
|
|
|
- color: #ffffff;
|
|
|
|
- font-size: $font-base - 2rpx;
|
|
|
|
-
|
|
|
|
- /* .iconenter {
|
|
|
|
- font-size: 15px;
|
|
|
|
- color: #ffffff;
|
|
|
|
- } */
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-.pink_row {
|
|
|
|
- .pink_img{
|
|
|
|
- width: 70rpx;
|
|
|
|
- height: 70rpx;
|
|
|
|
-
|
|
|
|
- image {
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- border-radius: 100%;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
-}
|
|
|
|
-.pink_people {
|
|
|
|
- font-size: $font-base - 2rpx;
|
|
|
|
- // margin-top: 10rpx;
|
|
|
|
- text {
|
|
|
|
- color: $font-color;
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.pink_time {
|
|
|
|
- font-size: 26rpx;
|
|
|
|
- color: #909399;
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.pink_name {
|
|
|
|
- font-size:30rpx;
|
|
|
|
- color:#333333;
|
|
|
|
- margin-left: 20rpx;
|
|
|
|
-}
|
|
|
|
-.More {
|
|
|
|
- width: 100%;
|
|
|
|
- line-height: 2;
|
|
|
|
- background-color: #fc2a3f;
|
|
|
|
- font-size:$font-lg;
|
|
|
|
- margin: 0 auto;
|
|
|
|
- text-align: center;
|
|
|
|
- color: #ffffff;
|
|
|
|
- // border-radius: 50rpx;
|
|
|
|
-}
|
|
|
|
-.mask {
|
|
|
|
- z-index: 999;
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- position: fixed;
|
|
|
|
- top: 0;
|
|
|
|
- left: 0;
|
|
|
|
- text-align: center;
|
|
|
|
- background-color: rgba(0, 0, 0, 0.5);
|
|
|
|
- image {
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- opacity: 0.8;
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-</style>
|
|
|