You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
2202 lines
51 KiB
2202 lines
51 KiB
<template>
|
|
<view class="detail">
|
|
<u-navbar>
|
|
<view class="slot-wrap">
|
|
<image style="width: 50rpx; height: 50rpx;" @click="goHome()" :src="$picUrl+'/static/detail/home.png'">
|
|
</image>
|
|
<view class="search">
|
|
<input type="text" @click="toSearch()" disabled placeholder="iPhone15" class="searInput" />
|
|
</view>
|
|
</view>
|
|
</u-navbar>
|
|
|
|
<view class="head">
|
|
<view class="swiper">
|
|
<swiper class="swiper" :circular="true" autoplay @change="changeSwiper">
|
|
<swiper-item v-for="(item,index) in goods.goods_images1" :key="index" @click="previewImage(index)">
|
|
<image :src="item" class="goodsImg"></image>
|
|
</swiper-item>
|
|
</swiper>
|
|
<view class="dots" v-if="goods.goods_images && goods.goods_images.length> 0">
|
|
{{(currenIndex+1)+"/"+goods.goods_images.length}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="goodsInfo">
|
|
<view class="goodsPrice">
|
|
<view class="left">
|
|
<view class="leftPrice">
|
|
<text>￥</text>{{goods.goods_price_min?Number(goods.goods_price_min):0}}
|
|
</view>
|
|
<view class="sellPrice">
|
|
<text class="sellLeft"></text>￥{{goods.line_price_min?Number(goods.line_price_min):0}}
|
|
</view>
|
|
</view>
|
|
<view class="right">
|
|
<view class="rightPrice" v-if="goods.is_check==1">
|
|
<image :src="$picUrl+'/static/detail/shenhe.png'" style="width: 44rpx;height: 42rpx;"></image>
|
|
</view>
|
|
<view class="rightBox">
|
|
<image :src="$picUrl+'/static/detail/ben.png'" v-if="userInfo.user_type==40"
|
|
style="width: 44rpx;height: 42rpx;"></image>
|
|
<image :src="$picUrl+'/static/detail/zhuan.png'" v-if="userInfo.user_type==30"
|
|
style="width: 44rpx;height: 38rpx;"></image>
|
|
<image :src="$picUrl+'/static/detail/sheng.png'" v-if="userInfo.user_type==20"></image>
|
|
<text class="span"
|
|
v-if="userInfo.user_type==40">￥{{goods.cost_price_min?Number(goods.cost_price_min):0}}</text>
|
|
<text class="span"
|
|
v-else>￥{{(goods.line_price_min>0&&goods.goods_price_min>0)?Number((Number(goods.line_price_min)-Number(goods.goods_price_min)).toFixed(2)):0}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="pro" v-if="isLogin">
|
|
<view class="proMem">
|
|
<text v-if="userInfo.user_type==20">Plus</text>
|
|
<text v-if="userInfo.user_type==30">分销</text>
|
|
PRO会员
|
|
</view>
|
|
<view class="proInfo">
|
|
开通<text v-if="userInfo.user_type==20">Plus</text>
|
|
<text v-if="userInfo.user_type==30">分销</text>会员预计再省<text style="color: #FF1D1D;">30</text>元
|
|
</view>
|
|
<view class="proBtn" @click="goMember()">
|
|
立即开通
|
|
</view>
|
|
</view>
|
|
<view class="goodsDetail">
|
|
<view class="goodsContent">
|
|
<view class="line2 goodsName">
|
|
{{goods.goods_name}}
|
|
</view>
|
|
<view class="goodsCircle" @click="shareImg()">
|
|
<image :src="$picUrl+'/static/detail/moments.png'" mode="" class="goodsCircleImg"></image>
|
|
<view class="goodsCircleText">
|
|
分享
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="goodsOpera">
|
|
<view v-if="goods.goods_no" class="goodsNum" @click="copyNum(goods.goods_no)">
|
|
<text>{{goods.goods_no}}</text>
|
|
<image :src="$picUrl+'/static/detail/copy.png'"></image>
|
|
</view>
|
|
<view class="operaImg">
|
|
<image :src="$picUrl+'/static/detail/miaosha.png'" v-if="isSeckill" class="tips"></image>
|
|
<image :src="$picUrl+'/static/detail/tip.png'" v-if="goods_sku_no" @click="toJDdetal()"
|
|
class="tips">
|
|
</image>
|
|
</view>
|
|
</view> -->
|
|
<view class="rank" @click="goRanking()" v-if="goods && goods.category">
|
|
<text><text style="font-size: 32rpx;font-weight: bold;">排行榜</text>
|
|
{{goods.category.name}}热搜榜第{{goods.paihang}}名</text>
|
|
<image :src="$picUrl+'/static/detail/rightIcon.png'"></image>
|
|
</view>
|
|
<view class="goodsOpera" style="margin-top: 30rpx;">
|
|
<!-- @click="toCity" -->
|
|
<view class="goodsNum">
|
|
<picker mode="multiSelector" @change="multiChange" @columnchange="columnChange"
|
|
value="{{multiIndex}}" :range="multiArray" range-key="name">
|
|
<image :src="$picUrl+'/static/detail/address.png'"
|
|
style="width: 46rpx;height: 46rpx;margin-right: 7rpx;">
|
|
</image>
|
|
<text style="margin-right: 10rpx;">{{addressResult.city}}：{{stockValue}}</text>
|
|
<u-icon name="arrow-right" color="#B7B7B7" size="22"></u-icon>
|
|
</picker>
|
|
</view>
|
|
<view v-if="goods.goods_no" class="operaImg" @click="copyNum(goods.goods_no)">
|
|
<view class="left_1">
|
|
{{goods.goods_source}}
|
|
</view>
|
|
<text>{{goods.goods_no}}</text>
|
|
<image :src="$picUrl+'/static/detail/copy.png'"
|
|
style="width: 27rpx;height: 27rpx;margin-left: 8rpx;"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="orderInfo">
|
|
<view class="chosed" v-if="goods.spec_type == 20" @click="choseSku(3)">
|
|
<view class="title">已选</view>
|
|
<view class="info" style="justify-content: flex-start;" v-if="goods.skuList.length>0">
|
|
<text
|
|
style="margin-right: 10rpx;">{{selectSku.title.name}}-{{selectSku.value.name}}</text>{{selectShop}}件
|
|
</view>
|
|
<u-icon name="arrow-right" color="#B7B7B7"></u-icon>
|
|
</view>
|
|
<view class="chosed" v-else @click="choseSku(3)">
|
|
<view class="title">已选</view>
|
|
<view class="info">{{selectShop}}件</view>
|
|
<u-icon name="arrow-right" color="#B7B7B7"></u-icon>
|
|
</view>
|
|
<view class="chosed" v-if="goods.skuList && goods.skuList.length > 0 && goods.skuList[0].stock_num > 0">
|
|
<view class="title">送至</view>
|
|
<view class="info">
|
|
<view class="infoLeft">
|
|
现货
|
|
<image :src="$picUrl+'/static/detail/rightIcon.png'"></image>
|
|
</view>
|
|
<view class="box" @click="choseAddress()">
|
|
<view class="address">
|
|
{{addressInfo.region?addressInfo.region.province +'-'+addressInfo.region.city+'-'+addressInfo.region.region:'全国'}}
|
|
</view>
|
|
<u-icon name="arrow-right" color="#B7B7B7"></u-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="chosed">
|
|
<view class="title">发货</view>
|
|
<view class="info">预计
|
|
<text v-if="goods.delivery_time==0">24小时内发货</text>
|
|
<text v-if="goods.delivery_time==2">72小时内发货</text>
|
|
<text v-if="goods.delivery_time==3">7天内发货</text>
|
|
<text v-if="goods.delivery_time==4">15天内发货</text>
|
|
<text v-if="goods.delivery_time==5">30天内发货</text>
|
|
<text v-if="goods.delivery_time==6">45天内发货</text>
|
|
</view>
|
|
</view>
|
|
<view class="chosed">
|
|
<view class="title">运费</view>
|
|
<view class="info">包邮（已提交订单时为准）
|
|
</view>
|
|
</view>
|
|
<view class="chosed" v-if="serveList.length>0">
|
|
<view class="title">保障</view>
|
|
<view class="info">
|
|
<view class="infoBao" v-for="(item,index) in serveList" :key="index">
|
|
<image :src="$picUrl+'/static/detail/selectIcon.png'" class="buy"></image>
|
|
<text class="info" style="margin-right: 3rpx;">{{item.name}}</text>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
<view class="chosed" v-else>
|
|
<view class="title">保障</view>
|
|
<view class="info">
|
|
<image :src="$picUrl+'/static/detail/buy.png'" class="buy"></image>
|
|
<text class="li" style="margin-right: 5rpx;">正品保障</text>
|
|
<text class="li" style="margin-right: 5rpx;">全程跟踪</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="about">
|
|
<view class="aboutHead">
|
|
<view class="aboutSuggest">
|
|
相关推荐
|
|
</view>
|
|
<!-- <view class="more">
|
|
查看更多
|
|
</view> -->
|
|
</view>
|
|
<view class="goodsList">
|
|
<view class="goodsItem" v-for="(item,index) in suggestGoodsList" :key="index"
|
|
@click="toDetail(item.goods_id)">
|
|
<view class="img">
|
|
<image :src="item.goods_image" mode="" class="goodsImg"></image>
|
|
</view>
|
|
<view class="goodsName ">
|
|
{{item.goods_name}}
|
|
</view>
|
|
<view class="price">
|
|
￥<text>{{item.goods_price_min}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="detail-content" v-html="goods.content"></view>
|
|
<view class="footer">
|
|
<view class="fooLeft">
|
|
<view class="footerCus firstBtn" v-if="isLogin == false" @click="addCar()">
|
|
<view class="cusIcon">
|
|
<image src="/static/detail/customer.png"></image>
|
|
</view>
|
|
<view class="customer">
|
|
客服
|
|
</view>
|
|
</view>
|
|
<view class="footerCus firstBtn" v-else>
|
|
<view class="cusIcon">
|
|
<image src="/static/detail/customer.png"></image>
|
|
</view>
|
|
<view class="customer">
|
|
客服
|
|
</view>
|
|
<button open-type="contact"></button>
|
|
</view>
|
|
<view class="footerCus firstBtn" @click="toJDdetal()">
|
|
<view class="cusIcon">
|
|
<image :src="$picUrl+'/static/detail/tongkuan.png'" style="width: 50rpx;height: 34rpx;"></image>
|
|
</view>
|
|
<view class="customer">
|
|
看同款
|
|
</view>
|
|
</view>
|
|
<view class="footerCus " style="position: relative;" @click="shoppingCart()">
|
|
<view v-if="cartTotal > 0" class="uni-tabbar__badge">
|
|
{{ cartTotal > 99 ? '99+' : cartTotal }}
|
|
</view>
|
|
<view class="cusIcon">
|
|
<image src="/static/detail/car.png" mode=""></image>
|
|
</view>
|
|
<view class="customer car">
|
|
购物车
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="fooRight" v-if="isLogin && userInfo.user_type == 40">
|
|
<template v-if="goods.status == 20">
|
|
<view class="btn-bg">
|
|
已下架
|
|
</view>
|
|
</template>
|
|
<template v-else>
|
|
<view class="btn-bg" v-if="goods.spec_type == 20" style="background-color: #FF9E2B;"
|
|
@click="choseSku(3)">
|
|
修改价格
|
|
</view>
|
|
<view class="btn-bg" v-else style="background-color: #FF9E2B;" @click="openPirce(1)">
|
|
修改价格
|
|
</view>
|
|
<view class="btn-bg"
|
|
style="background:linear-gradient( 102deg, #FE5E06 0%, #F3221A 100%);margin-left:40rpx;"
|
|
@click="setPirce()">
|
|
设置秒杀
|
|
</view>
|
|
</template>
|
|
</view>
|
|
|
|
<view class="fooRight" v-else>
|
|
<template v-if="goods.status == 20">
|
|
<view class="btn-bg">
|
|
已下架
|
|
</view>
|
|
</template>
|
|
<template v-else>
|
|
<template v-if="goods.skuList && goods.skuList.length > 0 && goods.skuList[0].stock_num == 0">
|
|
<view class="btn-bg">
|
|
暂无库存
|
|
</view>
|
|
</template>
|
|
<template v-else>
|
|
<template v-if="!isPre">
|
|
<template v-if="isSeckill">
|
|
<template v-if="isBuy">
|
|
<template v-if="seckillText=='距离'">
|
|
<view class="addCar" @click="choseSku(2)">
|
|
加入购物车
|
|
</view>
|
|
<view class="buyNow" @click="choseSku(3)">
|
|
立即购买
|
|
</view>
|
|
</template>
|
|
<template v-else>
|
|
<view class="btn-bg">
|
|
未到时间
|
|
</view>
|
|
</template>
|
|
</template>
|
|
<template v-else>
|
|
<view class="btn-bg">
|
|
已下架
|
|
</view>
|
|
</template>
|
|
</template>
|
|
<template v-else>
|
|
<view class="addCar" @click="choseSku(2)">
|
|
加入购物车
|
|
</view>
|
|
<view class="buyNow" @click="choseSku(3)">
|
|
立即购买
|
|
</view>
|
|
</template>
|
|
</template>
|
|
<template v-if="isPre">
|
|
<view class="buyNow" @click="onReservation()" v-if="isBuy > 0">
|
|
立即预约
|
|
</view>
|
|
<view class="btn-bg" v-else>
|
|
已失效
|
|
</view>
|
|
</template>
|
|
</template>
|
|
</template>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
<view class="dia" v-if="openDialog">
|
|
<view class="preSuc" v-if="shareType=='pre'">
|
|
<view class="preImg">
|
|
<image src="../../static/order/ld.png" mode="" class="ldImg"></image>
|
|
</view>
|
|
<view class="preTitle">
|
|
预约成功
|
|
</view>
|
|
<view class="iKnow" @click="onKonw">
|
|
查看预约记录
|
|
</view>
|
|
</view>
|
|
<view class="setMs" v-if="shareType=='setPrice'">
|
|
<view class="msprice">
|
|
设置商品价格
|
|
</view>
|
|
<view class="msLine">
|
|
<u-line class="u-line"></u-line>
|
|
</view>
|
|
<view class="msp">
|
|
<text>成本价格:</text>
|
|
<input type="text" v-model="cost_price" class="inp" placeholder="成本价格" />
|
|
</view>
|
|
<view class="msp">
|
|
<text>商品价格:</text>
|
|
<input type="text" v-model="max_price" placeholder="商品价格" class="inp" />
|
|
</view>
|
|
<view class="operaBtn">
|
|
<view class="cancel btnComm" @click="shareCancel(1)">
|
|
取消
|
|
</view>
|
|
<view class="sureBtn btnComm" @click="toUnpdatePrice()">
|
|
确定
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="shareWechat" v-if="shareType=='share'">
|
|
<view class="shareGoods">
|
|
<image :src="goods.goods_image" mode="heightFix" class="shareImg"></image>
|
|
</view>
|
|
<view class="shareInfo">
|
|
<view class="shareGoodsInfo">
|
|
{{goods.goods_name}}
|
|
</view>
|
|
<view class="sharePrice">
|
|
￥{{goods.goods_price_min?Number(goods.goods_price_min):goods.goods_price_min}}
|
|
</view>
|
|
</view>
|
|
<view class="shareOpera">
|
|
<view class="operaItem" @click="toHaibao(2)">
|
|
<view class="imgIcon">
|
|
<u-icon name="order" class="iconIm"></u-icon>
|
|
</view>
|
|
<view class="shareText">
|
|
复制文案
|
|
</view>
|
|
</view>
|
|
<view class="operaItem">
|
|
<view class="imgIcon weChatIcon">
|
|
<u-icon name="order" class="iconIm"></u-icon>
|
|
</view>
|
|
<view class="shareText">微信好友
|
|
<button open-type="share" @click="shareWechat"></button>
|
|
</view>
|
|
</view>
|
|
<view class="operaItem" @click="toHaibao(1)">
|
|
<view class="imgIcon hb">
|
|
<u-icon name="order" class="iconIm"></u-icon>
|
|
</view>
|
|
<view class="shareText">
|
|
生成海报
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="shareCancel" @click="shareCancel(1)">
|
|
取消
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="toTop" v-if="isTop" @click="openScrollTo()">
|
|
<image :src="$picUrl+'/static/toTop.png?=1'"></image>
|
|
</view>
|
|
<view v-if="isTodo">
|
|
<SkuPopup v-model="showSkuPopup" :skuMode="skuMode" :goods="goods" @getSku='onGetSku'
|
|
@addCart="onAddCart" />
|
|
</view>
|
|
<setPrice ref="setRange" @getprice="getprice" />
|
|
<!-- 海报图弹层 -->
|
|
<goods-poster-popup v-model="showGoodsPosterPopup" :apiCall="posterApiCall" :apiParam="{goodsId}" />
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import {
|
|
getSceneData
|
|
} from '@/core/app'
|
|
import GoodsPosterPopup from '@/components/goods-poster-popup'
|
|
import * as GoodsApi from '@/api/goods'
|
|
import * as goodsCar from '@/api/cart.js'
|
|
import SkuPopup from './components/SkuPopup'
|
|
import setPrice from './components/setPrice'
|
|
import * as address from '@/api/address.js'
|
|
import * as CartApi from '@/api/cart'
|
|
export default {
|
|
components: {
|
|
SkuPopup,
|
|
GoodsPosterPopup,
|
|
setPrice
|
|
},
|
|
data() {
|
|
return {
|
|
goods_sku_no: "",
|
|
isTodo: false,
|
|
result: {},
|
|
max_price: "",
|
|
cost_price: '',
|
|
markup_rate: "",
|
|
showGoodsPosterPopup: false,
|
|
cityInfo: {},
|
|
currenIndex: 0,
|
|
isTop: false,
|
|
goodShow: false,
|
|
showSkuPopup: false,
|
|
allPicture: '',
|
|
keyword: '',
|
|
// 模式 1:都显示 2:只显示购物车 3:只显示立即购买
|
|
skuMode: 1,
|
|
diaShow: false,
|
|
searchValue: '',
|
|
isPre: false, //是否预售
|
|
pre_id: '', //预售id
|
|
isBuy: "", //是否购买
|
|
isSeckill: false, //是否秒杀
|
|
seckillText: "", //是否秒杀
|
|
setPrice: false,
|
|
openDialog: false,
|
|
goodsId: '',
|
|
goods: {
|
|
skuList: []
|
|
},
|
|
suggestGoodsList: [],
|
|
userInfo: {},
|
|
addressList: [],
|
|
addressInfo: {},
|
|
serveList: [],
|
|
isLogin: false,
|
|
selectShop: {},
|
|
// 获取商品海报图api方法
|
|
posterApiCall: GoodsApi.poster,
|
|
// 购物车总数量
|
|
cartTotal: 0,
|
|
guaranteeList: [{
|
|
name: '原包正品'
|
|
}, {
|
|
name: '全国联保'
|
|
}, {
|
|
name: '运损换新'
|
|
}],
|
|
selectSku: '',
|
|
selectShop: 1,
|
|
multiIndex: [0, 0, 0],
|
|
multiArray: [],
|
|
multiData: [],
|
|
stockValue: '南京市',
|
|
addressResult: {
|
|
province: '江苏省',
|
|
city: '南京市',
|
|
district: '玄武区'
|
|
}
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
const that = this;
|
|
let result = uni.getStorageSync("addressResult")
|
|
this.addressResult = result?result.address_component:this.addressResult
|
|
this.isPre = options.isPre ? options.isPre : null
|
|
// 记录query参数
|
|
// this.onRecordQuery(options)
|
|
const scene = getSceneData(options)
|
|
this.goodsId = options.goodsId ? parseInt(options.goodsId) : parseInt(scene.gid)
|
|
// this.goodsId = options.goodsId ? options.goodsId : null
|
|
this.pre_id = options.pre_id ? options.pre_id : null;
|
|
this.isSeckill = options.isSeckill ? options.isSeckill : null;
|
|
this.isBuy = options.isBuy ? decodeURIComponent(options.isBuy) : null;
|
|
this.seckillText = options.seckillText ? decodeURIComponent(options.seckillText) : null;
|
|
this.getSuggestGoods()
|
|
this.getServeList()
|
|
this.getGoodsDetail()
|
|
this.cityInfo = uni.getStorageSync("cityInfo");
|
|
this.getGoodsStockInfor()
|
|
this.getCartTotal()
|
|
this.getProvinceAll()
|
|
uni.$on("onenPrice", function(selectShop) {
|
|
that.openPirce();
|
|
that.isTodo = false;
|
|
that.selectShop = selectShop
|
|
that.selectShop.price = that.selectShop.price / 100
|
|
})
|
|
// uni.$on("checkSelectShop", function(selectShop) {
|
|
// console.log("checkSelectShop1",selectShop)
|
|
// if(selectShop && selectShop.goods_sku_id){
|
|
// that.goodsId = selectShop.goods_id
|
|
// that.getGoodsDetail();
|
|
// }
|
|
// })
|
|
|
|
},
|
|
onShow() {
|
|
if (uni.getStorageSync('AccessToken')) {
|
|
this.getAddressList()
|
|
this.isLogin = true;
|
|
this.userInfo = uni.getStorageSync('userInfo');
|
|
} else {
|
|
this.isLogin = false;
|
|
this.userInfo = {}
|
|
}
|
|
},
|
|
onPageScroll(e) {
|
|
if (e.scrollTop <= 200) { // 当滚动到顶部且向下滑动时为true
|
|
this.isTop = false
|
|
} else {
|
|
this.isTop = true
|
|
}
|
|
},
|
|
methods: {
|
|
async getGoodsStockInfor() {
|
|
let params = {
|
|
goods_id: this.goodsId,
|
|
province: this.addressResult ? this.addressResult.province : '江苏省',
|
|
city: this.addressResult ? this.addressResult.city : '南京市',
|
|
district: this.addressResult ? this.addressResult.district : '玄武区'
|
|
}
|
|
let {
|
|
status,
|
|
message,
|
|
data
|
|
} = await GoodsApi.getGoodsStock(params);
|
|
if (status == 200) {
|
|
this.stockValue = data.stock
|
|
}
|
|
},
|
|
async getProvinceAll() {
|
|
let {
|
|
status,
|
|
message,
|
|
data
|
|
} = await address.province();
|
|
if (status == 200) {
|
|
this.multiData = data.list;
|
|
var multiIndex = this.multiIndex;
|
|
this.multiArray = [
|
|
this.multiData,
|
|
this.multiData[0].children,
|
|
this.multiData[0].children[0].children
|
|
]
|
|
}
|
|
},
|
|
// 获取多列的索引
|
|
multiChange: function(e) {
|
|
this.multiIndex = e.detail.value;
|
|
let province = this.multiArray[0][e.detail.value[0]].name;
|
|
let city = this.multiArray[1][e.detail.value[1]].name;
|
|
let district = this.multiArray[2][e.detail.value[2]].name;
|
|
this.addressResult.province = province;
|
|
this.addressResult.city = city
|
|
this.addressResult.district = district
|
|
this.getGoodsStockInfor()
|
|
},
|
|
|
|
// 选择列
|
|
columnChange: function(e) {
|
|
var _this = this;
|
|
var columnIndex = e.detail.column;
|
|
var columnValue = e.detail.value;
|
|
_this.multiIndex[columnIndex] = columnValue;
|
|
this.multiArray = [
|
|
_this.multiData,
|
|
_this.multiData[_this.multiIndex[0]].children,
|
|
_this.multiData[_this.multiIndex[0]].children[_this.multiIndex[1]].children
|
|
]
|
|
},
|
|
// 记录query参数
|
|
onRecordQuery(query) {
|
|
const scene = getSceneData(query)
|
|
this.goodsId = query.goodsId ? parseInt(query.goodsId) : parseInt(scene.gid)
|
|
},
|
|
getprice(e) {
|
|
let that = this
|
|
let params = {
|
|
goods_id: that.goods.goods_id,
|
|
sku_id: that.goods.skuList[0].id,
|
|
seckill_price: e.secondPrice,
|
|
sec_start_time: e.startTime,
|
|
sec_end_time: e.endTime,
|
|
is_limit: e.secondQuota,
|
|
limit_times: e.quotaNum
|
|
}
|
|
GoodsApi.editGoodsSeckillPrice(params).then(res => {
|
|
if (res.status == 200) {
|
|
that.$toast("设置成功");
|
|
this.$refs.setRange.afterSale = false;
|
|
setTimeout(() => {
|
|
that.getGoodsDetail(1);
|
|
}, 500)
|
|
}
|
|
})
|
|
.catch()
|
|
},
|
|
setPirce() {
|
|
console.log(this.$refs.setRange)
|
|
this.$refs.setRange.afterSale = true;
|
|
},
|
|
// 获取购物车总数量
|
|
getCartTotal() {
|
|
const app = this
|
|
return new Promise((resolve, reject) => {
|
|
CartApi.total()
|
|
.then(result => {
|
|
app.cartTotal = result.data.cartTotal
|
|
resolve(result)
|
|
})
|
|
.catch(reject)
|
|
})
|
|
},
|
|
//修改商品价格
|
|
async toUnpdatePrice() {
|
|
const that = this;
|
|
if (!that.cost_price) {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: "成本价格不能为空！"
|
|
})
|
|
return;
|
|
}
|
|
if (!that.max_price) {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: "商品价格不能为空！"
|
|
})
|
|
return;
|
|
}
|
|
|
|
let sku_id = ""
|
|
if (that.goods.spec_type == 20) {
|
|
sku_id = that.goods.skuList[0].id
|
|
}
|
|
let params = {
|
|
id: that.goods.goods_id,
|
|
goods_price: that.max_price,
|
|
cost_price: that.cost_price,
|
|
sku_id: sku_id.toString()
|
|
}
|
|
GoodsApi.editGoodsPrice(params).then(res => {
|
|
if (res.status == 200) {
|
|
that.$toast("修改成功");
|
|
setTimeout(() => {
|
|
that.getGoodsDetail(1);
|
|
}, 500)
|
|
}
|
|
})
|
|
.catch()
|
|
},
|
|
//跳转京东小程序详情
|
|
toJDdetal() {
|
|
wx.navigateToMiniProgram({
|
|
appId: 'wx91d27dbf599dff74',
|
|
path: '/pages/item/detail/detail?sku=' + this.goods_sku_no,
|
|
envVersion: 'release',
|
|
success(res) {
|
|
// 打开成功
|
|
console.log(res);
|
|
}
|
|
})
|
|
},
|
|
//修改价格
|
|
openPirce(type) {
|
|
this.openDialog = true;
|
|
this.shareType = 'setPrice'
|
|
if (type == 1) {
|
|
this.selectShop = {}
|
|
this.selectShop.price = this.goods.goods_price_max;
|
|
}
|
|
},
|
|
//门店图片预览
|
|
previewImage(i) {
|
|
uni.previewImage({
|
|
current: this.goods.goods_images1[i],
|
|
urls: this.goods.goods_images1
|
|
})
|
|
},
|
|
//监听滚动
|
|
changeSwiper(e) {
|
|
this.currenIndex = e.detail.current
|
|
},
|
|
openScrollTo() {
|
|
uni.pageScrollTo({
|
|
scrollTop: 0
|
|
})
|
|
},
|
|
shareImg() {
|
|
this.openDialog = true
|
|
this.shareType = 'share'
|
|
},
|
|
//立即预约
|
|
preNow() {
|
|
const that = this
|
|
let params = {
|
|
goods_id: that.goods.goods_id,
|
|
pre_id: 1
|
|
}
|
|
GoodsApi.presale(params).then(res => {
|
|
if (res.status == 200) {
|
|
that.$toast(res.message)
|
|
}
|
|
})
|
|
.catch()
|
|
},
|
|
getServeList() {
|
|
const that = this
|
|
let params = {
|
|
goodsId: that.goodsId
|
|
}
|
|
return new Promise((resolve, reject) => {
|
|
GoodsApi.serveList(params).then(res => {
|
|
if (res.status == 200) {
|
|
that.serveList = res.data.list
|
|
}
|
|
})
|
|
.catch()
|
|
})
|
|
},
|
|
// 预约成功去列表
|
|
onKonw() {
|
|
uni.navigateTo({
|
|
url: '/pages/news/park/recordHistory'
|
|
})
|
|
},
|
|
async onReservation() {
|
|
let {
|
|
status,
|
|
message,
|
|
data
|
|
} = await GoodsApi.presale({
|
|
goods_id: this.goodsId,
|
|
pre_id: this.pre_id
|
|
});
|
|
if (status == 200) {
|
|
this.shareType = 'pre';
|
|
this.openDialog = true
|
|
this.diaShow = true
|
|
}
|
|
},
|
|
// 选择商品规格
|
|
getAddressList() {
|
|
const that = this
|
|
return new Promise((resolve, reject) => {
|
|
address.list().then(res => {
|
|
if (res.status == 200) {
|
|
that.addressList = res.data.list
|
|
if (res.data.list && res.data.list.length > 0) {
|
|
that.getDefaultAddress()
|
|
} else {
|
|
console.log(222)
|
|
}
|
|
}
|
|
})
|
|
.catch()
|
|
})
|
|
},
|
|
//获取收货地址
|
|
getDefaultAddress() {
|
|
console.log('5855555')
|
|
const that = this
|
|
return new Promise((resolve, reject) => {
|
|
address.defaultId().then(res => {
|
|
if (res.status == 200) {
|
|
for (var i = 0; i < that.addressList.length; i++) {
|
|
if (res.data.defaultId == that.addressList[i].address_id) {
|
|
that.addressInfo = that.addressList[i];
|
|
console.log(that.addressInfo, '获取地址')
|
|
}
|
|
}
|
|
}
|
|
})
|
|
.catch()
|
|
})
|
|
},
|
|
//选择地址
|
|
choseAddress() {
|
|
if (!uni.getStorageSync("AccessToken")) {
|
|
uni.navigateTo({
|
|
url: "/pages/login/index"
|
|
})
|
|
return;
|
|
}
|
|
if (this.addressList && this.addressList.length > 0) {
|
|
uni.navigateTo({
|
|
url: '/pages/address/index'
|
|
})
|
|
} else {
|
|
uni.navigateTo({
|
|
url: '/pages/address/create'
|
|
})
|
|
}
|
|
},
|
|
toSearch() {
|
|
uni.navigateTo({
|
|
url: "/pages/search/index"
|
|
})
|
|
},
|
|
onGetSku(e) {
|
|
this.selectSku = e.selectSku
|
|
this.selectShop = e.shopNum
|
|
},
|
|
// 更新购物车数量
|
|
onAddCart(total) {
|
|
this.getCartTotal()
|
|
},
|
|
choseSku(skuMode) {
|
|
if (!uni.getStorageSync("AccessToken")) {
|
|
uni.navigateTo({
|
|
url: "/pages/login/index"
|
|
})
|
|
return;
|
|
}
|
|
this.skuMode = skuMode
|
|
this.showSkuPopup = true
|
|
console.log("choseSku", this.goods)
|
|
},
|
|
copyNum(msg) {
|
|
uni.setClipboardData({
|
|
data: (typeof msg == 'number') ? msg.toString() : msg, // 这里是个坑接受字符串类型 value转化为字符串
|
|
success: function() {
|
|
//调用方法成功
|
|
uni.showToast({
|
|
title: '复制成功',
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
}
|
|
})
|
|
},
|
|
// 获取商品信息
|
|
getGoodsDetail(type) {
|
|
const that = this
|
|
return new Promise((resolve, reject) => {
|
|
GoodsApi.detail(this.goodsId)
|
|
.then(result => {
|
|
let info = result.data.detail;
|
|
that.goods.skuList = [];
|
|
that.godds = {}
|
|
info.goods_images1 = []
|
|
if (info.goods_images && info.goods_images.length > 0) {
|
|
info.goods_images.map(a => {
|
|
info.goods_images1.push(a.preview_url)
|
|
})
|
|
}
|
|
info.content = info.content
|
|
.replace(/style=""/g, '')
|
|
.replace(/<img " src=/g, '<img src=')
|
|
.replace(/<img src=/g, '<img style="width: 100%; display:block" src=')
|
|
// that.goods = info;
|
|
Object.keys(info).forEach(item => {
|
|
this.$set(this.goods, item, info[item])
|
|
// that.goods[item] = info[item]
|
|
})
|
|
|
|
that.isTodo = true;
|
|
that.goods_sku_no = ""
|
|
if (info.skuList && info.skuList.length > 0) {
|
|
that.goods_sku_no = info.skuList[0].goods_sku_no
|
|
}
|
|
that.allPicture = info.goods_images.length;
|
|
if (type == 1) {
|
|
that.selectShop = {}
|
|
that.max_price = ""
|
|
that.markup_rate = ""
|
|
that.shareCancel();
|
|
}
|
|
if (this.goods.skuList.length > 0) {
|
|
if (this.goods.skuList[0].goods_props) {
|
|
this.selectSku = {
|
|
title: this.goods.skuList[0].goods_props[0].group,
|
|
value: this.goods.skuList[0].goods_props[0].value
|
|
}
|
|
}
|
|
}
|
|
})
|
|
.catch()
|
|
})
|
|
},
|
|
getSuggestGoods() {
|
|
// 获取推荐商品列表
|
|
const that = this
|
|
GoodsApi.recommended()
|
|
.then(result => {
|
|
let arr = result.data.goodsList
|
|
if (arr && arr.length > 0) {
|
|
arr.map(a => {
|
|
a.goods_price_min = Number(a.goods_price_min)
|
|
a.goods_price_max = Number(a.goods_price_max)
|
|
a.line_price_min = Number(a.line_price_min)
|
|
a.line_price_max = Number(a.line_price_max)
|
|
})
|
|
}
|
|
that.suggestGoodsList = arr
|
|
})
|
|
.catch()
|
|
},
|
|
goHome() {
|
|
uni.switchTab({
|
|
url: '/pages/index/index'
|
|
})
|
|
},
|
|
toDetail(goods_id) {
|
|
uni.navigateTo({
|
|
url: '/pages/goods/detail?goodsId=' + goods_id
|
|
})
|
|
},
|
|
goRanking() {
|
|
// 跳转排行榜
|
|
uni.navigateTo({
|
|
url: '/pages/activity/ranking'
|
|
})
|
|
},
|
|
goMember() {
|
|
if (!uni.getStorageSync("AccessToken")) {
|
|
uni.navigateTo({
|
|
url: "/pages/login/index"
|
|
})
|
|
return;
|
|
}
|
|
uni.navigateTo({
|
|
url: '/pages/member/index'
|
|
})
|
|
},
|
|
toFuwu() {
|
|
uni.navigateTo({
|
|
url: "/pages/news/consult/about"
|
|
})
|
|
},
|
|
shoppingCart() {
|
|
// 购物车
|
|
uni.switchTab({
|
|
url: '/pages/cart/index'
|
|
})
|
|
},
|
|
addCar() {
|
|
if (!uni.getStorageSync("AccessToken")) {
|
|
uni.navigateTo({
|
|
url: "/pages/login/index"
|
|
})
|
|
return;
|
|
}
|
|
// 加入购物车
|
|
const that = this
|
|
goodsCar.add(that.goods.goods_id, (that.goods.skuList && that.goods.skuList.length > 0 ? that.goods
|
|
.skuList[0].goods_sku_id : ''), that.goods.spec_type == 20 ? 1 : 1)
|
|
.then(res => {
|
|
if (res.status == 200) {
|
|
that.$toast(res.message)
|
|
}
|
|
})
|
|
.catch()
|
|
},
|
|
buyNow() {
|
|
if (!uni.getStorageSync("AccessToken")) {
|
|
uni.navigateTo({
|
|
url: "/pages/login/index"
|
|
})
|
|
return;
|
|
}
|
|
// 立即下单
|
|
console.log(this.token, '登录信息')
|
|
if (this.goods.stock_total == 0) {
|
|
return this.$toast('库存不足，请选择其他商品购买')
|
|
}
|
|
const item = JSON.stringify(this.goods)
|
|
|
|
uni.navigateTo({
|
|
url: '/pages/sureOrder/index?goodsID=' + encodeURIComponent(item)
|
|
})
|
|
},
|
|
shareCancel() {
|
|
this.shareType = "";
|
|
this.isTodo = true;
|
|
this.openDialog = false;
|
|
},
|
|
toHaibao(index) {
|
|
this.shareCancel();
|
|
if (index == 2) {
|
|
let str = `${this.goods.goods_name}\n
|
|
前台价：￥${this.goods.goods_price_max}元\n
|
|
推广价：￥${this.goods.goods_price_min}元\n
|
|
SKU：${this.goods.goods_no}
|
|
`
|
|
uni.setClipboardData({
|
|
data: str, // 这里是个坑接受字符串类型 value转化为字符串
|
|
success: function() {
|
|
//调用方法成功
|
|
uni.showToast({
|
|
title: '复制成功',
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
}
|
|
})
|
|
} else {
|
|
this.openDialog = false
|
|
this.showGoodsPosterPopup = true;
|
|
}
|
|
},
|
|
},
|
|
/**
|
|
* 分享当前页面
|
|
*/
|
|
onShareAppMessage() {
|
|
const app = this
|
|
// 构建页面参数
|
|
const params = app.$getShareUrlParams({
|
|
goodsId: app.goodsId,
|
|
})
|
|
return {
|
|
title: app.goods.goods_name,
|
|
imageUrl: app.goods.goods_image,
|
|
path: `/pages/goods/detail?${params}`
|
|
}
|
|
},
|
|
|
|
/**
|
|
* 分享到朋友圈
|
|
* 本接口为 Beta 版本，暂只在 Android 平台支持，详见分享到朋友圈 (Beta)
|
|
* https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html
|
|
*/
|
|
onShareTimeline() {
|
|
const app = this
|
|
return {
|
|
title: app.goods.goods_name,
|
|
imageUrl: app.goods.goods_image,
|
|
path: `/pages/goods/detail?goodsId=${app.goodsId}`
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.detail {
|
|
width: 100%;
|
|
height: 100%;
|
|
padding-bottom: 150rpx;
|
|
|
|
.toTop {
|
|
position: fixed;
|
|
bottom: 150rpx;
|
|
right: 32rpx;
|
|
width: 99rpx;
|
|
height: 99rpx;
|
|
border-radius: 50%;
|
|
z-index: 19;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
}
|
|
|
|
&-content {
|
|
padding: 30rpx;
|
|
font-size: 26rpx;
|
|
line-height: 50rpx;
|
|
width: 710rpx;
|
|
margin: 0 auto;
|
|
margin-top: 30rpx;
|
|
background-color: #fff;
|
|
box-sizing: border-box;
|
|
}
|
|
}
|
|
|
|
.slot-wrap {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
|
|
.search {
|
|
width: 400rpx;
|
|
height: 58rpx;
|
|
border-radius: 60rpx;
|
|
background-color: #F3F3F3;
|
|
display: flex;
|
|
align-items: center;
|
|
padding-left: 20rpx;
|
|
box-sizing: border-box;
|
|
margin: 0 20rpx;
|
|
}
|
|
|
|
}
|
|
|
|
.search {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.icon {
|
|
width: 34rpx;
|
|
height: 38rpx;
|
|
margin: 0 22rpx 0 76rpx;
|
|
}
|
|
|
|
.searInput {
|
|
width: 428rpx;
|
|
height: 58rpx;
|
|
background: #F3F3F3;
|
|
border-radius: 60rpx 60rpx 60rpx 60rpx;
|
|
opacity: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.seaIcon {
|
|
width: 28rpx;
|
|
height: 28rpx;
|
|
margin: 0 0 0 26rpx;
|
|
}
|
|
|
|
.input {
|
|
flex: 1;
|
|
padding-left: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.head {
|
|
width: 100%;
|
|
height: 750rpx;
|
|
position: relative;
|
|
}
|
|
|
|
.share {
|
|
z-index: 10;
|
|
top: 28rpx;
|
|
width: 74rpx;
|
|
height: 74rpx;
|
|
position: absolute;
|
|
background-color: rgba(255, 255, 255, 1);
|
|
border-radius: 50%;
|
|
text-align: center;
|
|
right: 28rpx;
|
|
|
|
.sp {
|
|
width: 54rpx;
|
|
height: 54rpx;
|
|
display: none;
|
|
}
|
|
|
|
.shareIcon {
|
|
width: 54rpx;
|
|
height: 54rpx;
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
|
|
.swiper {
|
|
width: 100%;
|
|
height: 750rpx;
|
|
opacity: 1;
|
|
left: 0;
|
|
right: 0;
|
|
margin: auto;
|
|
|
|
.goodsImg {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.dots {
|
|
width: 82rpx;
|
|
line-height: 56rpx;
|
|
background: rgba(38, 38, 38, 0.85);
|
|
position: absolute;
|
|
bottom: 20rpx;
|
|
right: 0;
|
|
z-index: 10;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
border-radius: 56rpx 0 0 56rpx;
|
|
}
|
|
}
|
|
|
|
.goodsInfo {
|
|
width: 720rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 6rpx;
|
|
padding-bottom: 30rpx;
|
|
overflow: hidden;
|
|
margin: 20rpx auto 16rpx;
|
|
|
|
.goodsPrice {
|
|
background-image: url('https://www.royaum.com.cn/static/detail/priceback.png');
|
|
width: 720rpx;
|
|
height: 136rpx;
|
|
background-size: cover;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
|
|
.left {
|
|
margin: 0 0 0 28rpx;
|
|
|
|
.leftPrice {
|
|
height: 64rpx;
|
|
font-size: 46rpx;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
line-height: 64rpx;
|
|
|
|
text {
|
|
height: 64rpx;
|
|
font-size: 32rpx;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
line-height: 64rpx;
|
|
margin-right: 8rpx;
|
|
}
|
|
}
|
|
|
|
.sellPrice {
|
|
height: 34rpx;
|
|
font-size: 24rpx;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
line-height: 34rpx;
|
|
text-decoration: line-through;
|
|
|
|
.sellLeft {
|
|
width: 72rpx;
|
|
margin-right: 8rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.right {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-right: 40rpx;
|
|
|
|
.rightPrice {
|
|
overflow: hidden;
|
|
margin-right: 24rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
image {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
}
|
|
}
|
|
|
|
.rightInfo {
|
|
width: 125rpx;
|
|
height: 26rpx;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.rightBox {
|
|
min-width: 195rpx;
|
|
height: 64rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
image {
|
|
width: 38rpx;
|
|
height: 38rpx;
|
|
margin-right: 5rpx;
|
|
}
|
|
|
|
.span {
|
|
height: 42rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 800;
|
|
font-size: 30rpx;
|
|
color: #F21A1C;
|
|
line-height: 35rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
margin-left: 5rpx;
|
|
margin-top: 5rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.pro {
|
|
background-image: url('https://www.royaum.com.cn/static/detail/pro.png');
|
|
background-size: 100% 100%;
|
|
width: 690rpx;
|
|
height: 82rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 20rpx 0 0 10rpx;
|
|
|
|
.proMem {
|
|
width: 142rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
color: #966542;
|
|
margin-left: 18rpx;
|
|
padding-right: 24rpx;
|
|
border-right: 2rpx solid #EFD4B4;
|
|
}
|
|
|
|
.proInfo {
|
|
width: 304rpx;
|
|
font-size: 24rpx;
|
|
font-weight: 500;
|
|
color: #966542;
|
|
margin: 0 38rpx 0 26rpx;
|
|
}
|
|
|
|
.proBtn {
|
|
width: 126rpx;
|
|
height: 50rpx;
|
|
background: #9F744D;
|
|
border-radius: 82rpx;
|
|
opacity: 1;
|
|
text-align: center;
|
|
line-height: 50rpx;
|
|
font-size: 24rpx;
|
|
font-weight: 500;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
}
|
|
|
|
.goodsDetail {
|
|
.goodsContent {
|
|
justify-content: space-between;
|
|
display: flex;
|
|
margin: 28rpx 28rpx 0 28rpx;
|
|
}
|
|
|
|
.goodsName {
|
|
width: 582rpx;
|
|
font-size: 32rpx;
|
|
font-weight: 400;
|
|
color: #000;
|
|
line-height: 50rpx;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.line2 {
|
|
word-break: break-all;
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 2;
|
|
-webkit-box-orient: vertical;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.goodsCircle {
|
|
width: 48rpx;
|
|
// text-align: right;
|
|
}
|
|
|
|
.goodsCircleImg {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
margin-right: 3rpx;
|
|
}
|
|
|
|
.goodsCircleText {
|
|
width: 48rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #333333;
|
|
line-height: 28rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
.goodsOpera {
|
|
margin-left: 28rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
.goodsNum {
|
|
text {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: 28rpx;
|
|
color: #333333;
|
|
text-align: left;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
image {
|
|
width: 28rpx;
|
|
height: 28rpx;
|
|
vertical-align: middle;
|
|
margin-left: 10rpx;
|
|
}
|
|
|
|
}
|
|
|
|
.operaImg {
|
|
margin-right: 34rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
image {
|
|
width: 49rpx;
|
|
height: 49rpx;
|
|
}
|
|
|
|
.tips {
|
|
margin-left: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.rank {
|
|
height: 70rpx;
|
|
background: #FFF3EE;
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
width: 670rpx;
|
|
border-radius: 8rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 0 28rpx;
|
|
box-sizing: border-box;
|
|
margin: 16rpx auto 0;
|
|
|
|
text {
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #FF1130;
|
|
line-height: 58rpx;
|
|
}
|
|
|
|
image {
|
|
width: 11rpx;
|
|
height: 19rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.orderInfo {
|
|
width: 720rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 6rpx;
|
|
opacity: 1;
|
|
margin: 16rpx auto 20rpx;
|
|
padding: 25rpx 25rpx 5rpx;
|
|
box-sizing: border-box;
|
|
|
|
.chosed {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
padding-bottom: 18rpx;
|
|
overflow: hidden;
|
|
|
|
.title {
|
|
font-size: 24rpx;
|
|
font-weight: 400;
|
|
color: #C4C4C4;
|
|
margin-right: 38rpx;
|
|
}
|
|
|
|
.info {
|
|
flex: 1;
|
|
font-size: 24rpx;
|
|
font-weight: 400;
|
|
color: #3D3D3D;
|
|
display: flex;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
|
|
.infoBao {
|
|
overflow: hidden;
|
|
display: flex;
|
|
align-items: flex-end;
|
|
margin-right: 15rpx;
|
|
margin-bottom: 15rpx;
|
|
|
|
image {
|
|
width: 29rpx;
|
|
height: 29rpx;
|
|
}
|
|
|
|
text {
|
|
flex: 1;
|
|
font-size: 24rpx;
|
|
font-weight: 400;
|
|
color: #3D3D3D;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
.buy {
|
|
width: 114rpx;
|
|
height: 23rpx;
|
|
margin-right: 10rpx;
|
|
display: block;
|
|
}
|
|
|
|
.infoLeft {
|
|
height: 34rpx;
|
|
font-size: 24rpx;
|
|
font-weight: 400;
|
|
color: #FE3636;
|
|
line-height: 34rpx;
|
|
|
|
image {
|
|
width: 8rpx;
|
|
height: 14rpx;
|
|
margin: 0 10rpx 0 8rpx;
|
|
}
|
|
}
|
|
|
|
.address {
|
|
height: 34rpx;
|
|
font-size: 24rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #3D3D3D;
|
|
line-height: 34rpx;
|
|
|
|
}
|
|
}
|
|
|
|
.serve {
|
|
.serveInfo {
|
|
width: 48rpx;
|
|
height: 34rpx;
|
|
font-size: 24rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #C4C4C4;
|
|
line-height: 34rpx;
|
|
margin-right: 38rpx;
|
|
}
|
|
|
|
.span {
|
|
width: 48rpx;
|
|
height: 34rpx;
|
|
}
|
|
}
|
|
|
|
.box {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
flex: 1;
|
|
}
|
|
|
|
.business {
|
|
.busSour {
|
|
height: 30rpx;
|
|
font-size: 24rpx;
|
|
font-weight: 400;
|
|
color: #3D3D3D;
|
|
}
|
|
|
|
.busName {
|
|
height: 34rpx;
|
|
font-size: 24rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #3D3D3D;
|
|
line-height: 34rpx;
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
.about {
|
|
width: 720rpx;
|
|
// height: 730rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 6rpx 6rpx 6rpx 6rpx;
|
|
opacity: 1;
|
|
margin: 14rpx 0 0rpx 20rpx;
|
|
padding: 24rpx 0 0 36rpx;
|
|
|
|
.aboutHead {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
.aboutSuggest {
|
|
width: 112rpx;
|
|
height: 40rpx;
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #000000;
|
|
line-height: 40rpx;
|
|
}
|
|
|
|
.more {
|
|
width: 96rpx;
|
|
height: 34rpx;
|
|
font-size: 24rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #909090;
|
|
line-height: 34rpx;
|
|
margin-right: 20rpx;
|
|
|
|
}
|
|
}
|
|
|
|
.goodsList {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
margin-top: 30rpx;
|
|
padding-bottom: 20rpx;
|
|
overflow: hidden;
|
|
|
|
.goodsItem {
|
|
margin-right: 18rpx;
|
|
|
|
.img {
|
|
width: 204rpx;
|
|
height: 168rpx;
|
|
background: #FBFBFB;
|
|
border-radius: 6rpx 6rpx 6rpx 6rpx;
|
|
opacity: 1;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
|
|
.goodsImg {
|
|
width: 190rpx;
|
|
height: 144rpx;
|
|
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.goodsName {
|
|
width: 184rpx;
|
|
height: 80rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #000000;
|
|
line-height: 40rpx;
|
|
display: -webkit-box;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: normal !important;
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
.price {
|
|
width: 66rpx;
|
|
height: 44rpx;
|
|
font-size: 24rpx;
|
|
font-weight: 500;
|
|
color: #ED2B00;
|
|
line-height: 38rpx;
|
|
|
|
text {
|
|
font-size: 32rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.vacancy {
|
|
width: 100%;
|
|
height: 150rpx;
|
|
}
|
|
|
|
.footer {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 100%;
|
|
height: 130rpx;
|
|
background: #FFFFFF;
|
|
box-shadow: -6rpx 14rpx 48rpx 0rpx rgba(0, 0, 0, 0.25);
|
|
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
|
opacity: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
text-align: center;
|
|
justify-content: space-between;
|
|
|
|
.fooLeft {
|
|
margin: 0 24rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.fooRight {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
margin-right: 20rpx;
|
|
}
|
|
|
|
.fooRight2 {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
// margin-right: 20rpx;
|
|
}
|
|
|
|
.footerCus {
|
|
width: 95rpx;
|
|
text-align: center;
|
|
position: relative;
|
|
|
|
.cusIcon {
|
|
width: 38rpx;
|
|
height: 38rpx;
|
|
margin: 0 auto;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
button {
|
|
width: 100%;
|
|
height: 100%;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: 2;
|
|
opacity: 0;
|
|
}
|
|
|
|
.customer {
|
|
// width: 40rpx;
|
|
// height: 28rpx;
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 20rpx;
|
|
font-weight: 400;
|
|
color: #3D3D3D;
|
|
line-height: 40rpx;
|
|
}
|
|
|
|
.car {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.addCar {
|
|
width: 196rpx;
|
|
height: 78rpx;
|
|
background: #FF9E2B;
|
|
border-radius: 42rpx 42rpx 42rpx 42rpx;
|
|
opacity: 1;
|
|
font-size: 24rpx;
|
|
font-family: PingFang SC;
|
|
font-weight: 600;
|
|
color: #FFFFFF;
|
|
line-height: 78rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.buyNow {
|
|
flex: 1;
|
|
height: 78rpx;
|
|
background: linear-gradient(102deg, #FE5E06 0%, #F3221A 100%);
|
|
border-radius: 42rpx 42rpx 42rpx 42rpx;
|
|
opacity: 1;
|
|
font-size: 24rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
color: #FFFFFF;
|
|
line-height: 78rpx;
|
|
text-align: center;
|
|
margin-left: 8rpx;
|
|
}
|
|
|
|
.btn-bg {
|
|
flex: 1;
|
|
height: 78rpx;
|
|
background: #cecece;
|
|
border-radius: 42rpx;
|
|
opacity: 1;
|
|
font-size: 24rpx;
|
|
font-weight: 600;
|
|
color: #FFFFFF;
|
|
line-height: 78rpx;
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
.dia {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(69, 69, 69, 0.44);
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
text-align: center;
|
|
z-index: 22;
|
|
|
|
.preSuc {
|
|
width: 560rpx;
|
|
height: 400rpx;
|
|
background: linear-gradient(180deg, #FFE4E4 0%, #FFFFFF 100%);
|
|
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
opacity: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
|
|
.preImg {
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
position: relative;
|
|
top: -50rpx;
|
|
|
|
.ldImg {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.preTitle {
|
|
height: 44rpx;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #000000;
|
|
line-height: 38rpx;
|
|
margin-top: 32rpx;
|
|
}
|
|
|
|
.iKnow {
|
|
width: 312rpx;
|
|
height: 72rpx;
|
|
background: #F55349;
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
opacity: 1;
|
|
text-align: center;
|
|
line-height: 72rpx;
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
margin-top: 70rpx;
|
|
}
|
|
}
|
|
|
|
.setMs {
|
|
width: 556rpx;
|
|
height: 480rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
opacity: 1;
|
|
|
|
.msprice {
|
|
width: 100%;
|
|
height: 44rpx;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
color: #262626;
|
|
line-height: 38rpx;
|
|
text-align: center;
|
|
margin-top: 24rpx;
|
|
margin-bottom: 26rpx;
|
|
}
|
|
|
|
.msLine {
|
|
margin-bottom: 30rpx;
|
|
}
|
|
|
|
.msp {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-bottom: 30rpx;
|
|
|
|
.inp {
|
|
width: 300rpx;
|
|
height: 72rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
|
opacity: 1;
|
|
border: 2rpx solid #EBEBEB;
|
|
margin-left: 20rpx;
|
|
line-height: 72rpx;
|
|
}
|
|
}
|
|
|
|
.qj {
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #262626;
|
|
line-height: 33rpx;
|
|
margin-bottom: 34rpx;
|
|
|
|
.msQj {
|
|
position: relative;
|
|
left: -218rpx;
|
|
}
|
|
|
|
.date {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-top: 16rpx;
|
|
|
|
.timeCommn {
|
|
width: 260rpx;
|
|
height: 68rpx;
|
|
background: #F1F1F1;
|
|
border-radius: 62rpx 62rpx 62rpx 62rpx;
|
|
opacity: 1;
|
|
line-height: 68rpx;
|
|
font-size: 24rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #929292;
|
|
padding-left: 34rpx;
|
|
}
|
|
|
|
.beginTime {
|
|
margin-right: 16rpx;
|
|
}
|
|
|
|
.endTime {
|
|
margin-left: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.msLimit {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 0 38rpx 0 42rpx;
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #262626;
|
|
line-height: 33rpx;
|
|
}
|
|
|
|
.peoLimit {
|
|
display: flex;
|
|
margin-left: 42rpx;
|
|
align-items: center;
|
|
|
|
.num {
|
|
width: 106rpx;
|
|
height: 60rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
|
opacity: 1;
|
|
border: 2rpx solid #EBEBEB;
|
|
text-align: center;
|
|
line-height: 60rpx;
|
|
margin: 0 18rpx 0 16rpx;
|
|
}
|
|
}
|
|
|
|
.operaBtn {
|
|
display: flex;
|
|
justify-content: center;
|
|
margin-top: 52rpx;
|
|
|
|
.btnComm {
|
|
width: 216rpx;
|
|
height: 70rpx;
|
|
background: #EEEEEE;
|
|
border-radius: 44rpx 44rpx 44rpx 44rpx;
|
|
opacity: 1;
|
|
line-height: 70rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.sureBtn {
|
|
width: 214rpx;
|
|
height: 74rpx;
|
|
background: linear-gradient(180deg, #FD5D06 0%, #F3211A 100%);
|
|
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
|
opacity: 1;
|
|
text-align: center;
|
|
line-height: 74rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
color: #FFFFFF;
|
|
margin-left: 24rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.shareWechat {
|
|
width: 656rpx;
|
|
height: 884rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
opacity: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-top: 24rpx;
|
|
|
|
.shareGoods {
|
|
margin-left: 28rpx;
|
|
width: 604rpx;
|
|
height: 382rpx;
|
|
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
|
opacity: 1;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.shareInfo {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-top: 12rpx;
|
|
padding: 0 30rpx;
|
|
justify-content: space-between;
|
|
|
|
.shareGoodsInfo {
|
|
width: 400rpx;
|
|
height: 120rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #000000;
|
|
line-height: 40rpx;
|
|
text-align: left;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.sharePrice {
|
|
height: 64rpx;
|
|
font-size: 46rpx;
|
|
font-weight: 500;
|
|
color: #FF645A;
|
|
line-height: 54rpx;
|
|
text-align: right;
|
|
}
|
|
}
|
|
|
|
.shareOpera {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-around;
|
|
margin-top: 36rpx;
|
|
margin-bottom: 46rpx;
|
|
|
|
.operaItem {
|
|
position: relative;
|
|
|
|
.imgIcon {
|
|
width: 88rpx;
|
|
height: 88rpx;
|
|
background: linear-gradient(180deg, #EC6244 0%, #FA938C 100%);
|
|
border-radius: 50%;
|
|
opacity: 1;
|
|
line-height: 88rpx;
|
|
text-align: center;
|
|
color: #fff;
|
|
|
|
.iconIm {
|
|
font-size: 32rpx;
|
|
}
|
|
}
|
|
|
|
.weChatIcon {
|
|
background: #28C445;
|
|
}
|
|
|
|
.hb {
|
|
background: linear-gradient(180deg, #53A2EE 0%, #6FB2F4 100%);
|
|
}
|
|
|
|
.shareText {
|
|
width: 96rpx;
|
|
height: 34rpx;
|
|
font-size: 24rpx;
|
|
font-weight: 400;
|
|
color: #000000;
|
|
line-height: 60rpx;
|
|
|
|
button {
|
|
width: 100%;
|
|
height: 100%;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: 2;
|
|
opacity: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.shareCancel {
|
|
width: 556rpx;
|
|
height: 82rpx;
|
|
background: #EEEEEE;
|
|
border-radius: 44rpx 44rpx 44rpx 44rpx;
|
|
opacity: 1;
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
color: #585858;
|
|
line-height: 82rpx;
|
|
text-align: center;
|
|
left: 0;
|
|
right: 0;
|
|
margin: auto;
|
|
}
|
|
}
|
|
}
|
|
|
|
.uni-tabbar__badge {
|
|
width: auto;
|
|
height: 16px;
|
|
line-height: 16px;
|
|
border-radius: 16px;
|
|
min-width: 16px;
|
|
padding: 0 2px;
|
|
font-size: 12px;
|
|
text-align: center;
|
|
white-space: nowrap;
|
|
position: absolute;
|
|
top: -5px;
|
|
right: 1px;
|
|
background-color: #f43530;
|
|
color: #ffffff;
|
|
transform: translate(40%, -20%);
|
|
}
|
|
|
|
::v-deep .u-btn--primary {
|
|
background-color: #FF6257 !important;
|
|
border-color: #FF6257 !important;
|
|
}
|
|
|
|
.left_1 {
|
|
height: 100%;
|
|
margin-right: 8rpx;
|
|
line-height: 36.5rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: bold;
|
|
font-size: 30rpx;
|
|
color: #F21A1C;
|
|
text-align: center;
|
|
margin-right: 10rpx;
|
|
}
|
|
</style>
|
|
|