1992 lines
54 KiB
Vue
1992 lines
54 KiB
Vue
|
<template>
|
|||
|
|
<scroll-view class="pay" v-if="loading" :scroll-y="isScroll" :class="showCoupon ? 'hidden' : ''">
|
|||
|
|
<view class="pay-none" @click="chooseAddress" v-if="!address">
|
|||
|
|
<view class="plus">
|
|||
|
|
<up-icon name="plus" color="#5780B0" size="16"/>
|
|||
|
|
<text>添加收货地址</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="pay-address" v-else>
|
|||
|
|
<view class="pay-address-info">
|
|||
|
|
<view class="left">
|
|||
|
|
<up-icon class="icon" size="25" :color="Color" name="map-fill" />
|
|||
|
|
<view class="">
|
|||
|
|
<view>
|
|||
|
|
<text class="name">{{address.name}}</text>
|
|||
|
|
<text class="text">{{address.mobile}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="address text">{{address.detailedAddress}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="btn" @click="chooseAddress">修改</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="tip">请确认收货地址，如需更换，请点击右侧按钮更换</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 跨境实名认证 -->
|
|||
|
|
<view class="kongxin" v-if="needReal">
|
|||
|
|
<view class="realbox">
|
|||
|
|
<text class="iconfont icon-realname"></text>
|
|||
|
|
<view class="cont">
|
|||
|
|
<view class="info">
|
|||
|
|
<view class="title">
|
|||
|
|
<view class="tit" @click="showKnow = true">实名认证 <up-icon name="info-circle" /></view>
|
|||
|
|
<view class="text" @click="openReal()" v-if="noRealName">添加认证信息 <up-icon name="arrow-right" /></view>
|
|||
|
|
</view>
|
|||
|
|
<view class="name" v-if="!noRealName" @click="toAddReal()">
|
|||
|
|
<text>{{realInfo.name}} {{realInfo.cert_id}}</text>
|
|||
|
|
<up-icon name="arrow-right" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="msg">*为保证顺利清关，请确保实名认证和付款人信息一致</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 有效商品 -->
|
|||
|
|
<block v-for="(order, index) in goods.orders" :key="index">
|
|||
|
|
<view class="goods box" v-if="order.items.length > 0 && !order.items[0].is_add">
|
|||
|
|
<view class="pay-goods">
|
|||
|
|
<block v-for="(item, i) in order.items" :key="i">
|
|||
|
|
<template v-if="!item.is_add">
|
|||
|
|
<!-- 赠品 -->
|
|||
|
|
<view class="item" v-if="item.goods.is_gift == 1">
|
|||
|
|
<image :src="item.goods.sku.pic_url || item.goods.face_img" mode="aspectFill"></image>
|
|||
|
|
<view class="tag">福利品</view>
|
|||
|
|
<view class="flexBox">
|
|||
|
|
<view class="txtBox">{{item.goods.title}}</view>
|
|||
|
|
<view class="price">
|
|||
|
|
<text>￥{{item.price}}</text>
|
|||
|
|
<view @click="checkedGifts(item.goods.goods_id)">
|
|||
|
|
<span v-if="gift_ids && gift_ids.indexOf(item.goods.goods_id) >= 0" class="iconfont icon-checked"></span>
|
|||
|
|
<span v-else class="iconfont icon-circle"></span>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="item" v-else>
|
|||
|
|
<image :src="item.goods.sku.pic_url || item.goods.face_img" mode="aspectFill"></image>
|
|||
|
|
<view class="info">
|
|||
|
|
<view class="info-name box1">
|
|||
|
|
<view class="name">
|
|||
|
|
<view class="kuajing" v-if="item.goods.is_cross_border === 1">跨境包税</view>
|
|||
|
|
<view class="kuajing" v-else-if="item.goods.overseas_direct_mail === 1">海外直邮</view>{{item.goods.title}}
|
|||
|
|
</view>
|
|||
|
|
<view class="price">
|
|||
|
|
<text class="icon">￥</text>
|
|||
|
|
<text>{{item.price}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view v-if="item.goods.limit_type == 1" class="box_number">
|
|||
|
|
{{item.goods.start_sale_num}}件起购</view>
|
|||
|
|
<view v-if="item.goods.limit_type == 2" class="box_number">限购{{item.goods.limit}}件</view>
|
|||
|
|
<view class="info-num box1" style="margin-top: 10rpx;">
|
|||
|
|
<view class="text">
|
|||
|
|
<text>{{item.goods.sku.v1}}</text>
|
|||
|
|
<text v-if="item.goods.sku.v2">-{{item.goods.sku.v2}}</text>
|
|||
|
|
<text v-if="item.goods.sku.v3">-{{ item.goods.sku.v3}}</text>
|
|||
|
|
<text v-if="item.goods.sku.v4">-{{ item.goods.sku.v4}}</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<template v-if="from === 0">
|
|||
|
|
<template v-if="item.goods.limit_type == 1">
|
|||
|
|
<up-number-box
|
|||
|
|
v-model="item.num"
|
|||
|
|
:min="parseInt(item.goods.start_sale_num)"
|
|||
|
|
:max="item.goods.specs_type === 1 ? (item.goods.sku.stock <= 0 ? 0 : item.goods.sku.stock) : (item.goods.stock <= 0 ? 0 : item.goods.stock)"
|
|||
|
|
@overlimit="plusBtn(1)"
|
|||
|
|
disabledInput
|
|||
|
|
bgColor="#f2f3f5"
|
|||
|
|
:longPress="false"
|
|||
|
|
:asyncChange="true"
|
|||
|
|
@change="changeNum($event, item, index, i)">
|
|||
|
|
</up-number-box>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<template v-else-if="item.goods.limit_type == 2">
|
|||
|
|
<up-number-box
|
|||
|
|
v-model="item.num"
|
|||
|
|
:min="1"
|
|||
|
|
:max="parseInt(item.goods.limit)"
|
|||
|
|
@overlimit="plusBtn(2, item.num ,item.goods.limit)"
|
|||
|
|
disabledInput
|
|||
|
|
bgColor="#f2f3f5"
|
|||
|
|
:longPress="false"
|
|||
|
|
:asyncChange="true"
|
|||
|
|
@change="changeNum($event, item, index, i)">
|
|||
|
|
</up-number-box>
|
|||
|
|
</template>
|
|||
|
|
<template v-else>
|
|||
|
|
<up-number-box
|
|||
|
|
v-model="item.num"
|
|||
|
|
:min="1"
|
|||
|
|
:max="item.goods.specs_type === 1 ? (item.goods.sku.stock <= 0 ? 0 : item.goods.sku.stock) : (item.goods.stock <= 0 ? 0 : item.goods.stock)"
|
|||
|
|
@overlimit="plusBtn(0, (item.goods.stock <= 0 ? 0 : item.goods.stock))"
|
|||
|
|
disabledInput
|
|||
|
|
bgColor="#f2f3f5"
|
|||
|
|
:longPress="false"
|
|||
|
|
:asyncChange="true"
|
|||
|
|
@change="changeNum($event, item, index, i)">
|
|||
|
|
</up-number-box>
|
|||
|
|
</template>
|
|||
|
|
</template>
|
|||
|
|
<text v-else>x1</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
</block>
|
|||
|
|
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<view class="pay-price">
|
|||
|
|
<view class="pay-price-item" v-if="order.has_cross_border || order.overseas_direct_mail">
|
|||
|
|
<view class="title" @click="showTaxation = true">进口税 <up-icon name="info-circle" /></view>
|
|||
|
|
<text class="title">商品已包税</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="pay-price-item" v-if="(order.items.length == 1 && order.items[0].goods && (order.items[0].goods.delivery_mode === 1 || order.items[0].goods.delivery_mode === 2)) || order.oneMode">
|
|||
|
|
<template>
|
|||
|
|
<text class="title" v-if="Number(order.freight_price) !== 0">发货时效</text>
|
|||
|
|
<text class="title" v-else>快递(包邮)</text>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<view v-if="order.items[0].goods.delivery_mode === 1 && order.items[0].goods.delivery_special_delay === 0" class="mode">
|
|||
|
|
现货{{order.items[0].goods.delivery_need_time}}天内发货
|
|||
|
|
</view>
|
|||
|
|
<view v-if="order.items[0].goods.delivery_mode === 1 && order.items[0].goods.delivery_special_delay === 1" class="mode">
|
|||
|
|
<!-- 如果当前时间 在不发货时间段，则取最晚发货时间，否则取预计发货 -->
|
|||
|
|
<template v-if="compareDate(order.items[0].goods.delivery_order_start_time, nowTime) && compareDate(nowTime, order.items[0].goods.delivery_order_end_time)">
|
|||
|
|
最晚{{parseTime(order.items[0].goods.delivery_latest_time)}}发货
|
|||
|
|
</template>
|
|||
|
|
<template v-else>
|
|||
|
|
现货{{order.items[0].goods.delivery_need_time}}天内发货
|
|||
|
|
</template>
|
|||
|
|
</view>
|
|||
|
|
<view v-if="order.items[0].goods.delivery_mode === 2" class="mode">
|
|||
|
|
预售{{order.items[0].goods.delivery_need_time}}天内发货
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<view class="pay-price-item-list" v-if="order.unFull && (order.unFull.length != 0 || Number(order.freight_price) != 0)">
|
|||
|
|
<text class="title" v-if="!order.unFull.length">运费</text>
|
|||
|
|
<template v-if="order.unFull.length == 1">
|
|||
|
|
<block class="title" v-for="(i, index) in order.unFull" :key="index">
|
|||
|
|
<text v-if="i.type == 'number'">运费(还差{{ i.full_number - i.buyNum}}件即可免费包邮)</text>
|
|||
|
|
<text v-if="i.type == 'amount'">运费(还差{{(i.full_amount - i.totalPrice).toFixed(2)}}元即可免费配送)</text>
|
|||
|
|
</block>
|
|||
|
|
</template>
|
|||
|
|
<view style="flex: 2">
|
|||
|
|
<template v-if="order.unFull.length > 1">
|
|||
|
|
<block class="title-goods" v-for="(i, index) in order.unFull" :key="index">
|
|||
|
|
<text style="display: block"
|
|||
|
|
v-if="i.type == 'number'">运费({{ i.shop_goods_title[0].slice(0, 8) }}还差{{i.full_number - i.buyNum}}件即可免费配送)</text>
|
|||
|
|
<text style="display: block"
|
|||
|
|
v-if="i.type == 'amount'">运费({{ i.shop_goods_title[0].slice(0, 8) }}还差{{(i.full_amount - i.totalPrice).toFixed(2)}}元即可免费配送)</text>
|
|||
|
|
</block>
|
|||
|
|
</template>
|
|||
|
|
</view>
|
|||
|
|
<text class="title-price">￥{{ order.freight_price }}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class='active_move' v-if="order.actives && order.actives.length > 0">
|
|||
|
|
<view v-for="(val ,index) in order.actives" :key='val.id' style="margin-bottom: 10px;" class="flex">
|
|||
|
|
<text class="active_movename">活动优惠</text>
|
|||
|
|
<text class="active_moveparice">{{val.name}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 新增优惠券信息 -->
|
|||
|
|
<view class="pay-price-item" v-if="order.use_coupon.length !== 0">
|
|||
|
|
<!-- 普通优惠券 -->
|
|||
|
|
<view class="flex1" v-if="order.use_coupon.use_type === 10 || order.use_coupon.use_type === 20 || order.use_coupon.use_type === 21">
|
|||
|
|
<view class="coupon_icon" :style="{backgroundImage: 'url(' + sp2 + ')'}"></view>
|
|||
|
|
<text class="title">优惠券</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 满减优惠券 -->
|
|||
|
|
<view class="flex1" v-if="order.use_coupon.use_type === 30 || order.use_coupon.use_type === 31">
|
|||
|
|
<view class="quanbox">
|
|||
|
|
<view class="quan">券</view>
|
|||
|
|
<text>满减券(满{{order.use_coupon.full_amount}}-{{order.use_coupon.amount}})</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="flex1" style="color: #F14939;" @click="openCoupon(order.coupon_id)">
|
|||
|
|
<text style="font-weight: 600;">-￥{{order.use_coupon.amount}}</text>
|
|||
|
|
<up-icon name="arrow-right" v-if="from === 0" color="#F14939" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="pay-price-item">
|
|||
|
|
<text class="title">备注</text>
|
|||
|
|
<input class="input" v-model="order.message" placeholder="请填写您的要求" @blur="isScroll = true" @focus="isScroll = false" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
|
|||
|
|
<!-- 优惠详情 -->
|
|||
|
|
<view class="youhuiBox" v-if="goods.sum.use_coupon && goods.sum.use_coupon.length !== 0">
|
|||
|
|
<view v-for="it in goods.sum.use_coupon" :key="it.id" class="box1">
|
|||
|
|
<view class="flex1" v-if="it.use_type === 10 || it.use_type === 20 || it.use_type === 21">
|
|||
|
|
<view class="coupon_icon" :style="{backgroundImage: 'url(' + sp2 + ')'}"></view>
|
|||
|
|
<text class="title">优惠券</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 满减优惠券 -->
|
|||
|
|
<view class="flex1" v-if="it.use_type === 30 || it.use_type === 31">
|
|||
|
|
<view class="quanbox">
|
|||
|
|
<view class="quan">券</view>
|
|||
|
|
<text>满减券(满{{it.full_amount}}减{{it.amount}})</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="flex1" style="color: #F14939;" @click="openCoupon(it.id)">
|
|||
|
|
<text style="font-weight: 600;font-size: 30rpx;">-￥{{it.amount}}</text>
|
|||
|
|
<up-icon name="arrow-right" v-if="from === 0" color="#F14939" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 未使用优惠券且有优惠券可用 -->
|
|||
|
|
<view class="youhuiBox" v-if="couponId === 0 && canUseCoupon.length && from === 0">
|
|||
|
|
<view class="box1">
|
|||
|
|
<view class="quanbox"><view class="quan">券</view></view>
|
|||
|
|
<view class="flex1" style="color: #F14939;" @click="openCoupon(0)">
|
|||
|
|
<text style="font-size: 28rpx;">有优惠券可用</text>
|
|||
|
|
<up-icon name="arrow-right" color="#F14939" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="sumActive" v-if="goods.sum && goods.sum.actives && goods.sum.actives.length > 0">
|
|||
|
|
<view class="row" v-for="(val, index) in goods.sum.actives" :key="val.id">
|
|||
|
|
<view class="flex1">
|
|||
|
|
<view class="label">活动</view>
|
|||
|
|
<text class="name">{{val.name}}</text>
|
|||
|
|
</view>
|
|||
|
|
<text class="amount" v-if="val.type === 2">-￥{{val.amount}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="onTheGo" v-if="theGoGoods.length">
|
|||
|
|
<view class="tit">
|
|||
|
|
<view class="text">顺手<text>买1件</text></view>
|
|||
|
|
<view class="huan" @click="changeGoods()" v-if="theGoGoods.length !== 1"><span class="iconfont icon-huanyihuan"></span>换一换</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="spBox">
|
|||
|
|
<image :src="curGoGoods.shop_goods.face_img" mode="aspectFill" @click="toGroup"></image>
|
|||
|
|
<view class="txtBox" @click="toGroup">
|
|||
|
|
<view class="tt">
|
|||
|
|
<view class="name">{{curGoGoods.shop_goods.title}}</view>
|
|||
|
|
<view class="sku" v-if="curGoGoods.shop_goods_sku && curGoGoods.shop_goods_sku.sku">
|
|||
|
|
<text>{{curGoGoods.shop_goods_sku.sku.v1}}</text>
|
|||
|
|
<text v-if="curGoGoods.shop_goods_sku.sku.v2">-{{curGoGoods.shop_goods_sku.sku.v2}}</text>
|
|||
|
|
<text v-if="curGoGoods.shop_goods_sku.sku.v3">-{{curGoGoods.shop_goods_sku.sku.v3}}</text>
|
|||
|
|
<text v-if="curGoGoods.shop_goods_sku.sku.v4">-{{curGoGoods.shop_goods_sku.sku.v4}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="price">
|
|||
|
|
<text class="prefix">￥</text>
|
|||
|
|
<text v-if="curGoGoods.shop_goods_sku">{{curGoGoods.shop_goods_sku.price}}</text>
|
|||
|
|
<text v-else>{{curGoGoods.shop_goods.price}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="icon" @click="checkedTheGo()">
|
|||
|
|
<span v-if="theChecked" class="iconfont icon-checked"></span>
|
|||
|
|
<span v-else class="iconfont icon-circle"></span>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="trans_detail" v-if="goods.sum.goods_price * 1">
|
|||
|
|
<view class="tit">交易明细</view>
|
|||
|
|
<view class="row">
|
|||
|
|
<text>商品总价</text>
|
|||
|
|
<text>￥{{goods.sum.goods_price}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="row" v-if="goods.sum.active_discount_amount * 1">
|
|||
|
|
<text>活动优惠</text>
|
|||
|
|
<text class="red">-￥{{goods.sum.active_discount_amount}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="row" v-if="goods.sum.coupon_price * 1">
|
|||
|
|
<text>优惠券</text>
|
|||
|
|
<text class="red">-￥{{goods.sum.coupon_price}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="row" v-if="goods.sum.freight_price * 1">
|
|||
|
|
<text>运费</text>
|
|||
|
|
<text>￥{{goods.sum.freight_price}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="row" @click="checkedVal = 1, showScore = true" v-if="goods.detail.score_cash_type">
|
|||
|
|
<text>积分</text>
|
|||
|
|
<view class="red">
|
|||
|
|
<template v-if="is_use_score">使用{{goods.sum.useScore}}积分抵扣，-￥{{goods.sum.deductionProfit}}</template>
|
|||
|
|
<template v-else><text>可用{{goods.detail.useScore}}积分，抵{{goods.detail.deductionProfit}}元 </text>去使用</template>
|
|||
|
|
<up-icon name="arrow-right" size="14" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="payBox">
|
|||
|
|
<view class="row flex" v-for="it in payList" :key="it.id" @click="pay_method = it.id">
|
|||
|
|
<view class="flex1">
|
|||
|
|
<text class="iconfont logo" :class="'icon-' + it.icon" :style="{color: it.color}"></text>
|
|||
|
|
<text>{{it.name}}</text>
|
|||
|
|
</view>
|
|||
|
|
<text class="iconfont icon-checked" v-if="it.id == pay_method"></text>
|
|||
|
|
<text class="iconfont icon-circle" v-else></text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- <view class="">返回信息：{{backInfo}}</view> -->
|
|||
|
|
|
|||
|
|
<view class="goods box" v-if="freightGoods.length">
|
|||
|
|
<view class="pay-title" style="color: #F14939;" v-if="address">以下商品无法购买(不在配送范围内)</view>
|
|||
|
|
<view class="pay-goods">
|
|||
|
|
<view class="item" v-for="item in freightGoods">
|
|||
|
|
<image :src="item.goods.sku.pic_url || item.goods.face_img"></image>
|
|||
|
|
<view class="info">
|
|||
|
|
<view class="info-name box1">
|
|||
|
|
<text class="name">{{item.goods.title}}</text>
|
|||
|
|
<view class="price">
|
|||
|
|
<text class="icon">￥</text>
|
|||
|
|
<text>{{item.price}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="info-num box1">
|
|||
|
|
<view class="text">
|
|||
|
|
<text>{{item.goods.sku.v1}}</text>
|
|||
|
|
<text v-if="item.goods.sku.v2">-{{item.goods.sku.v2}}</text>
|
|||
|
|
<text v-if="item.goods.sku.v3">-{{ item.goods.sku.v3}}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="num">x{{item.num}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="openvip" v-if="isShowOpen && !hasActive" @click="selectVip">
|
|||
|
|
<view class="left">
|
|||
|
|
<view class="sheng">省</view>会员价本单再减{{reducePrice}}元
|
|||
|
|
</view>
|
|||
|
|
<view class="right">{{vipInfo.vip_name}}￥{{vipInfo.vip_price}}元/{{vipInfo.vip_type == 1 ? '月' : '年'}}
|
|||
|
|
<view class="xuanzhe">
|
|||
|
|
<span v-if="isChecked" class="iconfont icon-checked"></span>
|
|||
|
|
<span v-else class="iconfont icon-circle"></span>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 提交订单 -->
|
|||
|
|
<view class="pay-btn">
|
|||
|
|
<view class="flex1">
|
|||
|
|
<text class="text">合计：</text>
|
|||
|
|
<view class="price">
|
|||
|
|
<view class="icon">￥<text>{{goods.sum.total_price}}</text></view>
|
|||
|
|
<view class="reduce" v-if="goods.sum.total_discount_amount * 1">共减￥{{goods.sum.total_discount_amount}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<text class="btn" @click="payBtn()">提交订单</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 了解实名认证 -->
|
|||
|
|
<up-modal :show="showKnow" :showCancelButton="false" :showConfirmButton="false">
|
|||
|
|
<view>
|
|||
|
|
<view class="refTitle">关于实名认证</view>
|
|||
|
|
<view class="mesg">1.根据海关规定：购买跨境商品需要对订购人进行实名认证。提交的姓名与身份证号码必须相符且真实有效，否则会影响海关审放。<br>
|
|||
|
|
2.实名购物也是您权利的保障，如果您对所购买的商品有疑问，您可以向海关申清查询货品是否经过海关正规进口流程。<br>
|
|||
|
|
3.妙选商城不会向除中国海关报关相关机构外任何第三方提供用户的身份信息。<br>
|
|||
|
|
4.如您还有其他关于实名认证的问题可以联系我们客服为您处理。
|
|||
|
|
</view>
|
|||
|
|
<view style="padding: 50rpx;">
|
|||
|
|
<view class="iknow" @click="showKnow = false">我知道了</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</up-modal>
|
|||
|
|
|
|||
|
|
<up-modal :show="showTaxation" :showCancelButton="false" :showConfirmButton="false">
|
|||
|
|
<view>
|
|||
|
|
<view class="refTitle">进口税</view>
|
|||
|
|
<view class="mesg" style="text-align: center;">商品售价已包含税费，无需另付税费</view>
|
|||
|
|
<view style="padding: 50rpx;">
|
|||
|
|
<view class="iknow" @click="showTaxation = false">我知道了</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</up-modal>
|
|||
|
|
|
|||
|
|
<!-- 授权 -->
|
|||
|
|
<up-modal :show="showAuth" :showCancelButton="false" :showConfirmButton="false">
|
|||
|
|
<view>
|
|||
|
|
<view class="authMesg">您需通过手机号码或者昵称头像完成小程序授权，才能继续购买</view>
|
|||
|
|
<view style="padding: 50rpx;">
|
|||
|
|
<button class="authBtn" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber($event)">获取手机号码</button>
|
|||
|
|
<view class="authBtn" @click="toUpdateNickName()">更新昵称头像</view>
|
|||
|
|
<view class="cancelAuth" @click="showAuth = false">取消</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</up-modal>
|
|||
|
|
|
|||
|
|
<!-- 填写实名认证 -->
|
|||
|
|
<up-modal :show="showReal" :showCancelButton="true" :showConfirmButton="true" @confirm="commitReal()"
|
|||
|
|
@cancel="showReal = false" :confirmColor="Color">
|
|||
|
|
<view style="width: 100%;">
|
|||
|
|
<view class="refTitle">填写实名认证</view>
|
|||
|
|
<view class="realBox">
|
|||
|
|
<input v-model="realAddInfo.name" placeholder="因海关清关需要，请填写真实姓名" class="input" />
|
|||
|
|
<input v-model="realAddInfo.cert_id" placeholder="请填写您的身份证号" class="input" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</up-modal>
|
|||
|
|
|
|||
|
|
<view class="lineBox"></view>
|
|||
|
|
|
|||
|
|
<!-- 选择优惠券 -->
|
|||
|
|
<up-popup :show="showCoupon" class="popupbox" :round="10" mode="bottom" @close="showCoupon = false" catchtouchmove="preventDefault" :safe-area-inset-bottom="true">
|
|||
|
|
<view class="reTitle">
|
|||
|
|
<text>优惠券</text>
|
|||
|
|
<view @click="showCoupon = false">
|
|||
|
|
<up-icon name="close" color="#777" size="20" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view style="padding: 0 20rpx 20rpx;background-color: #F6F6F6;">
|
|||
|
|
<scroll-view class="couponBox" :scroll-y="true" :scroll-with-animation="true" :enhanced="true" style="height: calc(80vh - 200rpx);">
|
|||
|
|
<!-- 可用优惠券 -->
|
|||
|
|
<view class="item" v-for="(item, index) in canUseCoupon" :key="item.id" @click="selectCoupon(item.id)">
|
|||
|
|
<view class="coupon-left textColor1">
|
|||
|
|
<text class="sign">￥<text class="money">{{item.amount}}</text></text>
|
|||
|
|
<view class="title" v-if="item.use_type === 30 || item.use_type === 31">满{{item.full_amount}}元可用</view>
|
|||
|
|
<view class="title" v-else>无门槛</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="coupon-right">
|
|||
|
|
<view class="coupon-text">
|
|||
|
|
<view v-if="item.use_type == 20 || item.use_type === 31" class="text chang textColor">仅该团购可用：{{item.extend.title}}</view>
|
|||
|
|
<view v-else class="text textColor">
|
|||
|
|
<text v-if="Number(item.amount) < 3">全场通用</text>
|
|||
|
|
<text v-else>部分团可用</text>
|
|||
|
|
</view>
|
|||
|
|
<text class="time">{{item.finish_time.substring(0, 16)}}前有效</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="coupon-btn">
|
|||
|
|
<span v-if="item.id == tempId" class="iconfont icon-checked"></span>
|
|||
|
|
<span v-else class="iconfont icon-circle"></span>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view style="padding: 50rpx 0;" v-if="canUseCoupon.length === 0">
|
|||
|
|
<up-empty mode="coupon" icon="https://ct-upimg.yx090.com/g.ii090/images/sprite/empty/coupon.png" text="无可用优惠券"></up-empty>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 不可用优惠券 -->
|
|||
|
|
<view style="font-size: 28rpx;color: #888;padding: 30rpx 0 20rpx;" v-if="cannotUseCoupon.length">以下优惠券不可用</view>
|
|||
|
|
<view class="item" v-for="(item, index) in cannotUseCoupon" :key="item.id">
|
|||
|
|
<view class="coupon-left textColor2">
|
|||
|
|
<text class="sign">￥<text class="money">{{item.amount}}</text></text>
|
|||
|
|
<view class="title" v-if="item.use_type === 30 || item.use_type === 31">满{{item.full_amount}}元可用</view>
|
|||
|
|
<view class="title" v-else>无门槛</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="coupon-right">
|
|||
|
|
<view class="coupon-text">
|
|||
|
|
<view v-if="item.use_type == 20 || item.use_type === 31" class="text chang textColor2">仅该团购可用：{{item.extend.title}}</view>
|
|||
|
|
<view v-else class="text textColor2">
|
|||
|
|
<text v-if="Number(item.amount) < 3">全场通用</text>
|
|||
|
|
<text v-else>部分团可用</text>
|
|||
|
|
</view>
|
|||
|
|
<text class="time">{{item.finish_time.substring(0, 16)}}前有效</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</scroll-view>
|
|||
|
|
|
|||
|
|
<div @click="handleCoupon()" class="box_btn">确 定</div>
|
|||
|
|
</view>
|
|||
|
|
</up-popup>
|
|||
|
|
|
|||
|
|
<!-- 使用积分 -->
|
|||
|
|
<up-popup :show="showScore" :round="10" mode="bottom" @close="showScore = false" catchtouchmove="preventDefault" :safe-area-inset-bottom="true">
|
|||
|
|
<view class="reTitle">
|
|||
|
|
<text>积分抵扣</text>
|
|||
|
|
<up-icon name="close" color="#777" size="20" @click="showScore = false"/>
|
|||
|
|
</view>
|
|||
|
|
<view class="scoreBox">
|
|||
|
|
<view class="row" @click="checkedVal = 1">
|
|||
|
|
<view class="text">使用{{goods.detail.useScore}}积分抵{{goods.detail.deductionProfit}}元</view>
|
|||
|
|
<up-icon v-if="checkedVal === 1" name="checkmark-circle-fill" :color="Color" size="20" />
|
|||
|
|
<up-icon v-else name="checkmark-circle" color="#999999" size="20" />
|
|||
|
|
</view>
|
|||
|
|
<view class="row" @click="checkedVal = 0">
|
|||
|
|
<view class="text">不使用</view>
|
|||
|
|
<up-icon v-if="checkedVal === 0" name="checkmark-circle-fill" :color="Color" size="20" />
|
|||
|
|
<up-icon v-else name="checkmark-circle" color="#999999" size="20" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view style="padding: 30rpx;box-sizing: border-box;">
|
|||
|
|
<view @click="setUseScore()" class="box_btn">确 定</view>
|
|||
|
|
</view>
|
|||
|
|
</up-popup>
|
|||
|
|
|
|||
|
|
</scroll-view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { ref, reactive, toRefs, watch } from 'vue'
|
|||
|
|
import { get, post } from '@/api/request.js'
|
|||
|
|
import { goodsItem, showToast, getUserInfo, getUserPhone, compareDate } from '@/components/common.js'
|
|||
|
|
import { Style } from '@/utils/list.js'
|
|||
|
|
import { sp2 } from '@/components/img.js'
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
setup() {
|
|||
|
|
const data = reactive({
|
|||
|
|
sp2: sp2,
|
|||
|
|
is_cart: '',
|
|||
|
|
shop_goods: uni.getStorageSync('shopGoods'),
|
|||
|
|
loading: false,
|
|||
|
|
isScroll: true,
|
|||
|
|
freightGoods: [],
|
|||
|
|
is_vip: uni.getStorageSync('is_vip'),
|
|||
|
|
vip_on: uni.getStorageSync('vip_on'),
|
|||
|
|
is_authorized: uni.getStorageSync('is_authorized'),
|
|||
|
|
activeName: [],
|
|||
|
|
isShowOpen: false,
|
|||
|
|
reducePrice: 0,
|
|||
|
|
isChecked: false,
|
|||
|
|
vipInfo: {},
|
|||
|
|
needReal: false,
|
|||
|
|
noRealName: true,
|
|||
|
|
showKnow: false,
|
|||
|
|
showTaxation: false,
|
|||
|
|
showAuth: false,
|
|||
|
|
showReal: false,
|
|||
|
|
realAddInfo: {},
|
|||
|
|
hasActive: false,
|
|||
|
|
source: '',
|
|||
|
|
nowTime: '',
|
|||
|
|
lastId: 0,
|
|||
|
|
first: true,
|
|||
|
|
couponId: '',
|
|||
|
|
canUseCoupon: [],
|
|||
|
|
cannotUseCoupon: [],
|
|||
|
|
showCoupon: false,
|
|||
|
|
use_coupons: [],
|
|||
|
|
from: 0,
|
|||
|
|
Color: uni.getStorageSync('theme_color'),
|
|||
|
|
priceColor: Style[uni.getStorageSync('theme_index') * 1].priceColor,
|
|||
|
|
bgColor: Style[uni.getStorageSync('theme_index') * 1].bgColor,
|
|||
|
|
canBuy: true,
|
|||
|
|
tempId: 0,
|
|||
|
|
gift_ids: null,
|
|||
|
|
firstLoad: true, // 标识首次执行/check接口赋值赠品id
|
|||
|
|
theChecked: false,
|
|||
|
|
theGoGoods: [],
|
|||
|
|
curGoGoods: {},
|
|||
|
|
curGoIndex: 0,
|
|||
|
|
is_use_score: 0,
|
|||
|
|
showScore: false,
|
|||
|
|
checkedVal: 1,
|
|||
|
|
backInfo: '',
|
|||
|
|
pay_method: 'alipay',
|
|||
|
|
payList: [
|
|||
|
|
// { id: 'wxpay', icon: 'wxpay', color: '#15BA11', name: '微信支付' },
|
|||
|
|
{ id: 'alipay', icon: 'alipay', color: '#00A0EA', name: '支付宝' }
|
|||
|
|
],
|
|||
|
|
pay_id: '',
|
|||
|
|
create_id: 0
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 检查订单
|
|||
|
|
const goods = reactive({
|
|||
|
|
orders: [],
|
|||
|
|
sum: {},
|
|||
|
|
oederNum: 0,
|
|||
|
|
detail: {}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
const to_VipPage = () => {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/pages/vip/mine/index'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const plusBtn = (type, index, e) => {
|
|||
|
|
if (type === 0) {
|
|||
|
|
if (index <= 1) {
|
|||
|
|
showToast('已达到该商品最大件数')
|
|||
|
|
} else {
|
|||
|
|
showToast('该商品不能低于1件')
|
|||
|
|
}
|
|||
|
|
} else if (type === 1) {
|
|||
|
|
showToast('该商品不能低于起购数')
|
|||
|
|
} else {
|
|||
|
|
if (index == e) {
|
|||
|
|
showToast('已达到商品限购件数')
|
|||
|
|
} else if (index > e) {
|
|||
|
|
showToast('已达到商品限购件数')
|
|||
|
|
} else if (index != e) {
|
|||
|
|
showToast('该商品不能低于1件')
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
async function checkOrder(val = 1) {
|
|||
|
|
uni.showLoading({
|
|||
|
|
title: '加载中...'
|
|||
|
|
})
|
|||
|
|
let res = await post('/api/v1/order/check', {
|
|||
|
|
shop_id: 1,
|
|||
|
|
shop_goods: data.shop_goods,
|
|||
|
|
address: address.value,
|
|||
|
|
purchase_vip: data.isChecked ? 1 : 0,
|
|||
|
|
use_coupons: data.use_coupons,
|
|||
|
|
gift_goods_ids: data.gift_ids,
|
|||
|
|
score_cash: data.is_use_score
|
|||
|
|
})
|
|||
|
|
if (res.code == 0) {
|
|||
|
|
uni.hideLoading()
|
|||
|
|
}
|
|||
|
|
goods.oederNum = 0
|
|||
|
|
goods.orders = []
|
|||
|
|
data.freightGoods = []
|
|||
|
|
data.needReal = res.data.sum.has_cross_border
|
|||
|
|
if(val == 0 && !data.needReal) {
|
|||
|
|
getRandomGoods(res.data.orders)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
res.data.orders.forEach((orders, ordersIndex) => {
|
|||
|
|
goods.orders[ordersIndex] = {
|
|||
|
|
...orders,
|
|||
|
|
items: []
|
|||
|
|
}
|
|||
|
|
orders.items.forEach((items, index) => {
|
|||
|
|
if (items.goods.freight_status === 1) {
|
|||
|
|
data.freightGoods.push(items)
|
|||
|
|
} else {
|
|||
|
|
goods.orders[ordersIndex].items.push(items)
|
|||
|
|
goods.oederNum += 1
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
if(orders.actives.length !== 0) {
|
|||
|
|
data.hasActive = true
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
goods.orders.forEach((item) => {
|
|||
|
|
if(item.items.length) {
|
|||
|
|
item.message = ''
|
|||
|
|
}
|
|||
|
|
let expect_time0 = item.items[0] && item.items[0].delivery_expect_time
|
|||
|
|
let oneMode = true
|
|||
|
|
item.items.forEach((items, index) => {
|
|||
|
|
if(items.goods.is_gift == 0) {
|
|||
|
|
if(expect_time0 !== items.delivery_expect_time) {
|
|||
|
|
oneMode = false
|
|||
|
|
}
|
|||
|
|
expect_time0 = items.delivery_expect_time
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
item.oneMode = oneMode
|
|||
|
|
})
|
|||
|
|
goods.sum = res.data.sum
|
|||
|
|
goods.detail = res.data.detail
|
|||
|
|
if(data.firstLoad) {
|
|||
|
|
data.gift_ids = res.data.gift_goods_ids
|
|||
|
|
}
|
|||
|
|
data.firstLoad = false
|
|||
|
|
data.reducePrice = res.data.sum.expect_vip_discount_amount
|
|||
|
|
data.vipInfo = res.data.vip
|
|||
|
|
data.first = false
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 选择地址
|
|||
|
|
const address = ref(null)
|
|||
|
|
// 获取默认地址
|
|||
|
|
async function getAddress() {
|
|||
|
|
await get('/api/v1/address/default').then((res) => {
|
|||
|
|
if (res.data.id) {
|
|||
|
|
res.data.detailedAddress =
|
|||
|
|
res.data.province.name +
|
|||
|
|
res.data.city.name +
|
|||
|
|
res.data.area.name +
|
|||
|
|
res.data.address
|
|||
|
|
address.value = res.data
|
|||
|
|
data.lastId = res.data.id
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function getUseCoupon() {
|
|||
|
|
let params = {
|
|||
|
|
shop_id: 1,
|
|||
|
|
shop_goods: data.shop_goods,
|
|||
|
|
address: address.value,
|
|||
|
|
purchase_vip: data.isChecked ? 1 : 0
|
|||
|
|
}
|
|||
|
|
await post('/api/v1/order/checkCoupons', params).then((res) => {
|
|||
|
|
data.canUseCoupon = res.data.can_use
|
|||
|
|
data.cannotUseCoupon = res.data.cannot_use
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 在进入到地址列表之后将地址删除再次返回之后，原来地址信息还存在的场景
|
|||
|
|
function isHasAddress() {
|
|||
|
|
let flag = false
|
|||
|
|
if(data.lastId) {
|
|||
|
|
get('/api/v1/address').then((res) => {
|
|||
|
|
res.data.forEach((it) => {
|
|||
|
|
if(it.id === data.lastId) {
|
|||
|
|
flag = true
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
if(!flag) {
|
|||
|
|
address.value = null
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 重新选择地址
|
|||
|
|
function chooseAddress() {
|
|||
|
|
let url = '/pages/address/list/index?type=1'
|
|||
|
|
if (address.value) {
|
|||
|
|
url += `&id=${address.value.id}`
|
|||
|
|
}
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
watch(address, async(newValue, oldValue) => {
|
|||
|
|
data.lastId = newValue.id || ''
|
|||
|
|
if(!data.first) {
|
|||
|
|
await checkOrder()
|
|||
|
|
getUseCoupon()
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
watch(() => data.showCoupon, (newData) => {
|
|||
|
|
data.isScroll = !newData
|
|||
|
|
}, {
|
|||
|
|
deep: true
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 修改数量
|
|||
|
|
async function changeNum(e, item, index, i) {
|
|||
|
|
for (let i = 0; i < data.shop_goods.length; i++) {
|
|||
|
|
if (
|
|||
|
|
data.shop_goods[i].shop_goods_id === item.shop_goods_id &&
|
|||
|
|
data.shop_goods[i].shop_group_goods_id === item.shop_group_goods_id &&
|
|||
|
|
data.shop_goods[i].shop_goods_sku_id === item.shop_goods_sku_id
|
|||
|
|
) {
|
|||
|
|
data.shop_goods[i].num = e.value
|
|||
|
|
break
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
await checkOrder()
|
|||
|
|
getUseCoupon()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 创建订单
|
|||
|
|
async function payBtn() {
|
|||
|
|
if (!address.value) {
|
|||
|
|
showToast('请选择收货地址')
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (data.needReal && !realInfo.value.id) {
|
|||
|
|
showToast('所购商品有跨境商品，需进行实名认证')
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (goods.oederNum === 0 || !data.canBuy) {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
data.canBuy = false
|
|||
|
|
uni.showLoading({
|
|||
|
|
title: '加载中...',
|
|||
|
|
mask: true
|
|||
|
|
})
|
|||
|
|
let goodsOrder = []
|
|||
|
|
goods.orders.forEach((itm) => {
|
|||
|
|
let obj = JSON.parse(JSON.stringify(itm))
|
|||
|
|
obj.items = []
|
|||
|
|
for (let i = 0; i < itm.items.length; i++) {
|
|||
|
|
let it = itm.items[i]
|
|||
|
|
if(it.goods.is_gift == 0 || (it.goods.is_gift == 1 && data.gift_ids.indexOf(it.goods.goods_id) >= 0)) {
|
|||
|
|
obj.items.push(it)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if(obj.items.length !== 0) {
|
|||
|
|
goodsOrder.push(obj)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
let params = {
|
|||
|
|
is_cart: data.is_cart,
|
|||
|
|
purchase_vip: data.isChecked,
|
|||
|
|
sum: goods.sum,
|
|||
|
|
orders: goodsOrder,
|
|||
|
|
address: {
|
|||
|
|
consignee: address.value.name,
|
|||
|
|
mobile: address.value.mobile,
|
|||
|
|
address: address.value.detailedAddress,
|
|||
|
|
province_id: address.value.province_id,
|
|||
|
|
city_id: address.value.city_id,
|
|||
|
|
area_id: address.value.area_id,
|
|||
|
|
id: address.value.id
|
|||
|
|
},
|
|||
|
|
identity_card_id: 0,
|
|||
|
|
source: data.source,
|
|||
|
|
use_coupons: data.use_coupons,
|
|||
|
|
scene: uni.getEnterOptionsSync().scene,
|
|||
|
|
gift_goods_ids: data.gift_ids,
|
|||
|
|
score_cash: data.is_use_score,
|
|||
|
|
pay_type: data.pay_method == 'wxpay' ? 1 : 2
|
|||
|
|
}
|
|||
|
|
if(data.needReal) {
|
|||
|
|
params.identity_card_id = realInfo.value.id
|
|||
|
|
}
|
|||
|
|
post('/api/v1/order/create', params).then(async(res) => {
|
|||
|
|
uni.removeStorageSync('shopGoods')
|
|||
|
|
let pages = getCurrentPages()
|
|||
|
|
let prevPage = pages[pages.length - 2]
|
|||
|
|
if (prevPage.route === 'pages/groups/index') {
|
|||
|
|
} else {
|
|||
|
|
prevPage.$vm.checked = []
|
|||
|
|
prevPage.$vm.checkAll = false
|
|||
|
|
}
|
|||
|
|
uni.hideLoading()
|
|||
|
|
await pay(res.data.id, data.isChecked)
|
|||
|
|
data.canBuy = true
|
|||
|
|
// uni.hideLoading()
|
|||
|
|
}).catch(() => {
|
|||
|
|
data.canBuy = true
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
async function pay(id, isBuyVip) {
|
|||
|
|
data.backInfo = ''
|
|||
|
|
await get(`/api/v1/pay/group/${id}`, { pay_style: 'app_pay' }).then((res) => {
|
|||
|
|
data.pay_id = res.data.pay_id
|
|||
|
|
data.create_id = id
|
|||
|
|
getNum()
|
|||
|
|
if(data.pay_method == 'wxpay') {
|
|||
|
|
// 跳转微信小程序
|
|||
|
|
plus.share.getServices((ress) => {
|
|||
|
|
let sweixin = null
|
|||
|
|
for(let i = 0; i < ress.length; i++) {
|
|||
|
|
if(ress[i].id == 'weixin') {
|
|||
|
|
sweixin = ress[i]
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if(sweixin) {
|
|||
|
|
const path = res.data.jump_mini_path
|
|||
|
|
sweixin.launchMiniProgram({
|
|||
|
|
id: res.data.jump_mini_org_id, // 原始id：gh_开头 要跳转的微信小程序原始ID
|
|||
|
|
path,
|
|||
|
|
type: 0 // 默认为0, 0: 正式版 1：测试版 2：体验版
|
|||
|
|
}, (success) => {
|
|||
|
|
data.backInfo = JSON.stringify(success)
|
|||
|
|
}, (err) => {
|
|||
|
|
console.log(err)
|
|||
|
|
data.backInfo = JSON.stringify(err)
|
|||
|
|
return uni.showToast({
|
|||
|
|
title: '请检查手机是否有微信应用~',
|
|||
|
|
icon: 'none'
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
} else if(data.pay_method == 'alipay') {
|
|||
|
|
// 跳转支付宝小程序
|
|||
|
|
let alipayUrl = res.data.jump_mini_path
|
|||
|
|
// let alipayUrl = res.data.jump_mini_path + '&returnSchema=miaoxuan://'
|
|||
|
|
if (uni.getSystemInfoSync().platform == "ios") {
|
|||
|
|
alipayUrl = res.data.jump_mini_path.replace('alipays', 'alipay')
|
|||
|
|
}
|
|||
|
|
console.log(alipayUrl)
|
|||
|
|
plus.runtime.openURL(alipayUrl)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function selectVip() {
|
|||
|
|
data.isChecked = !data.isChecked
|
|||
|
|
await checkOrder()
|
|||
|
|
getUseCoupon()
|
|||
|
|
}
|
|||
|
|
const { getNum } = goodsItem()
|
|||
|
|
|
|||
|
|
// 获取认证信息
|
|||
|
|
const realInfo = ref(null)
|
|||
|
|
// 获取默认地址
|
|||
|
|
function getRealInfo() {
|
|||
|
|
get('/api/v1/identityCard').then((res) => {
|
|||
|
|
realInfo.value = res.data[0] || {}
|
|||
|
|
if(res.data.length === 0) {
|
|||
|
|
data.noRealName = true
|
|||
|
|
} else {
|
|||
|
|
data.noRealName = false
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function toAddReal() {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/pages/mine/realName/list?from=1'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function openReal() {
|
|||
|
|
data.realAddInfo = {}
|
|||
|
|
data.showReal = true
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function toUpdateNickName() {
|
|||
|
|
data.showAuth = false
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/pages/user/info'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 授权手机号码
|
|||
|
|
async function getPhoneNumber(e) {
|
|||
|
|
if(e.detail.errMsg == 'getPhoneNumber:ok') {
|
|||
|
|
await getUserPhone(e.detail).then((res) => {
|
|||
|
|
data.is_authorized = 1
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function commitReal() {
|
|||
|
|
if(!data.realAddInfo.name || !data.realAddInfo.cert_id) {
|
|||
|
|
showToast('请填写完整信息')
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
post('/api/v1/identityCard', data.realAddInfo).then((res) => {
|
|||
|
|
data.showReal = false
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '保存成功',
|
|||
|
|
icon: 'success',
|
|||
|
|
duration: 1000,
|
|||
|
|
mask: true
|
|||
|
|
})
|
|||
|
|
data.noRealName = false
|
|||
|
|
realInfo.value = res.data
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getNowTime() {
|
|||
|
|
let now = new Date()
|
|||
|
|
let nowYear = now.getFullYear()
|
|||
|
|
let nowMonth = now.getMonth() + 1
|
|||
|
|
let nowDay = now.getDate()
|
|||
|
|
let month = nowMonth >= 1 && nowMonth <= 9 ? '0' + nowMonth : nowMonth
|
|||
|
|
let day = nowDay >= 1 && nowDay <= 9 ? '0' + nowDay : nowDay
|
|||
|
|
|
|||
|
|
let hour = now.getHours() < 10 ? '0' + now.getHours() : now.getHours()
|
|||
|
|
let minute = now.getMinutes() < 10 ? '0' + now.getMinutes() : now.getMinutes()
|
|||
|
|
let second = now.getSeconds() < 10 ? '0' + now.getSeconds() : now.getSeconds()
|
|||
|
|
data.nowTime = nowYear + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function parseTime(time) {
|
|||
|
|
let month = Number(time.substr(0, 10).split('-')[1])
|
|||
|
|
let day = Number(time.substr(0, 10).split('-')[2])
|
|||
|
|
return month + '月' + day + '日'
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 打开优惠券
|
|||
|
|
function openCoupon(id) {
|
|||
|
|
if(data.from === 0) {
|
|||
|
|
data.tempId = id
|
|||
|
|
data.showCoupon = true
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 选中优惠券
|
|||
|
|
function selectCoupon(id) {
|
|||
|
|
data.tempId = data.tempId == id ? 0 : id
|
|||
|
|
}
|
|||
|
|
function handleCoupon() {
|
|||
|
|
data.showCoupon = false
|
|||
|
|
data.couponId = data.tempId
|
|||
|
|
data.use_coupons = data.tempId ? [data.tempId] : [0]
|
|||
|
|
checkOrder()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function checkedGifts(id) {
|
|||
|
|
let index = data.gift_ids.indexOf(id)
|
|||
|
|
if(index >= 0) {
|
|||
|
|
data.gift_ids.splice(index, 1)
|
|||
|
|
} else {
|
|||
|
|
data.gift_ids.push(id)
|
|||
|
|
}
|
|||
|
|
await checkOrder()
|
|||
|
|
getUseCoupon()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function changeGoods() {
|
|||
|
|
data.curGoIndex = data.curGoIndex == data.theGoGoods.length - 1 ? 0 : data.curGoIndex + 1
|
|||
|
|
data.curGoGoods = data.theGoGoods[data.curGoIndex]
|
|||
|
|
if(data.theChecked) {
|
|||
|
|
data.theChecked = false
|
|||
|
|
let list = JSON.parse(JSON.stringify(data.shop_goods))
|
|||
|
|
data.shop_goods = []
|
|||
|
|
for (var i = 0; i < list.length; i++) {
|
|||
|
|
if(!list[i].is_add) {
|
|||
|
|
data.shop_goods.push(list[i])
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
await checkOrder()
|
|||
|
|
getUseCoupon()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function checkedTheGo() {
|
|||
|
|
data.theChecked = !data.theChecked
|
|||
|
|
if(data.theChecked) {
|
|||
|
|
let params = {
|
|||
|
|
shop_goods_id: data.curGoGoods.shop_goods_id,
|
|||
|
|
shop_goods_sku_id: data.curGoGoods.shop_goods_sku_id || 0,
|
|||
|
|
num: 1,
|
|||
|
|
shop_group_goods_id: data.curGoGoods.shop_group_goods_id,
|
|||
|
|
source_id: 0,
|
|||
|
|
source_type: 'normal',
|
|||
|
|
is_add: true
|
|||
|
|
}
|
|||
|
|
data.shop_goods.push(params)
|
|||
|
|
} else {
|
|||
|
|
let list = JSON.parse(JSON.stringify(data.shop_goods))
|
|||
|
|
data.shop_goods = []
|
|||
|
|
for (var i = 0; i < list.length; i++) {
|
|||
|
|
if(!list[i].is_add) {
|
|||
|
|
data.shop_goods.push(list[i])
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
await checkOrder()
|
|||
|
|
getUseCoupon()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function getRandomGoods(list) {
|
|||
|
|
let goodsIds = []
|
|||
|
|
list.forEach((itm) => {
|
|||
|
|
itm.items.forEach((it) => {
|
|||
|
|
goodsIds.push(it.shop_goods_id)
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
await post('/api/v1/recommend/goods/v2', {goods_ids: goodsIds}).then((res) => {
|
|||
|
|
data.theGoGoods = res.data
|
|||
|
|
data.curGoGoods = data.theGoGoods[0]
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function toGroup() {
|
|||
|
|
uni.navigateTo({ url: '/pages/groups/index?id=' + data.curGoGoods.shop_group_goods_id })
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function setUseScore() {
|
|||
|
|
data.is_use_score = data.checkedVal == 1
|
|||
|
|
data.showScore = false
|
|||
|
|
checkOrder()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function isPayOrder() {
|
|||
|
|
uni.showLoading({
|
|||
|
|
title: '加载中...',
|
|||
|
|
mask: true
|
|||
|
|
})
|
|||
|
|
get(`/api/v1/pay/check/${data.pay_id}`).then((res) => {
|
|||
|
|
uni.hideLoading()
|
|||
|
|
if(res.data.status) {
|
|||
|
|
uni.redirectTo({
|
|||
|
|
url: '/pages/success/index?id=' + data.create_id + '&type=1&pay_id=' + data.pay_id + '&from=0'
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
showToast('支付失败')
|
|||
|
|
uni.redirectTo({ url: '/pages/order/list/index' })
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return {
|
|||
|
|
realInfo,
|
|||
|
|
...toRefs(data),
|
|||
|
|
plusBtn,
|
|||
|
|
goods,
|
|||
|
|
checkOrder,
|
|||
|
|
address,
|
|||
|
|
chooseAddress,
|
|||
|
|
getUseCoupon,
|
|||
|
|
getAddress,
|
|||
|
|
payBtn,
|
|||
|
|
getNum,
|
|||
|
|
changeNum,
|
|||
|
|
to_VipPage,
|
|||
|
|
selectVip,
|
|||
|
|
getRealInfo,
|
|||
|
|
toAddReal,
|
|||
|
|
toUpdateNickName,
|
|||
|
|
getPhoneNumber,
|
|||
|
|
commitReal,
|
|||
|
|
openReal,
|
|||
|
|
isHasAddress,
|
|||
|
|
compareDate,
|
|||
|
|
getNowTime,
|
|||
|
|
parseTime,
|
|||
|
|
selectCoupon,
|
|||
|
|
handleCoupon,
|
|||
|
|
openCoupon,
|
|||
|
|
checkedGifts,
|
|||
|
|
checkedTheGo,
|
|||
|
|
changeGoods,
|
|||
|
|
getRandomGoods,
|
|||
|
|
toGroup,
|
|||
|
|
setUseScore,
|
|||
|
|
isPayOrder
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
async onLoad(options) {
|
|||
|
|
console.log(options)
|
|||
|
|
// await this.$onLaunched
|
|||
|
|
await this.getAddress()
|
|||
|
|
this.is_cart = options.type
|
|||
|
|
this.source = options.source || ''
|
|||
|
|
this.from = Number(options.from) || 0
|
|||
|
|
this.use_coupons = options.coupon_id ? [options.coupon_id] : []
|
|||
|
|
await this.checkOrder(0)
|
|||
|
|
this.loading = true
|
|||
|
|
if (!this.is_vip && this.vip_on == 1) {
|
|||
|
|
this.isShowOpen = true
|
|||
|
|
}
|
|||
|
|
this.getNowTime()
|
|||
|
|
this.getUseCoupon()
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
setTimeout(() => {
|
|||
|
|
this.isHasAddress()
|
|||
|
|
}, 500)
|
|||
|
|
this.getRealInfo()
|
|||
|
|
|
|||
|
|
// 在此判断订单是否已经支付成功
|
|||
|
|
let args = plus.runtime.arguments
|
|||
|
|
console.log(args)
|
|||
|
|
this.backInfo = JSON.stringify(args)
|
|||
|
|
if (args) {
|
|||
|
|
plus.runtime.arguments = null
|
|||
|
|
this.isPayOrder()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.flex{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
.flexc{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
.flex1{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.box_number {
|
|||
|
|
background: rgba(255, 255, 255, 0.39);
|
|||
|
|
border: 1px solid #656565;
|
|||
|
|
color: #656565;
|
|||
|
|
font-size: 25rpx;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
display: inline-block;
|
|||
|
|
margin: 10rpx 0;
|
|||
|
|
padding: 2rpx 10rpx;
|
|||
|
|
}
|
|||
|
|
.lineBox{
|
|||
|
|
width: 100%;
|
|||
|
|
height: calc(200rpx + env(safe-area-inset-bottom));
|
|||
|
|
}
|
|||
|
|
.pay {
|
|||
|
|
height: 100vh;
|
|||
|
|
overflow: auto;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
&.hidden{
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
.vip_advert {
|
|||
|
|
margin: 20rpx 30rpx -25rpx;
|
|||
|
|
height: 67rpx;
|
|||
|
|
background: rgba(255, 255, 255, 0.39);
|
|||
|
|
|
|||
|
|
.vip_advert_img {
|
|||
|
|
height: 100%;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.box {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
background: #ffffff;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
padding: 20rpx;
|
|||
|
|
margin: 24rpx 24rpx 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pay-none {
|
|||
|
|
padding: 24rpx 24rpx 0;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
.plus{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 120rpx;
|
|||
|
|
background: url(https://ct-upimg.yx090.com/ju8hn6/shop/image/2022/12/05/p15B2jVlAIlWfw9M7iC1Wwzwvm2kp125Pby3ZK1i.png) no-repeat center;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
color: #5780B0;
|
|||
|
|
background-color: #fff;
|
|||
|
|
background-size: 100% 100%;
|
|||
|
|
}
|
|||
|
|
text{
|
|||
|
|
margin-left: 8rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pay-address {
|
|||
|
|
background: #ffffff;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
padding: 20rpx;
|
|||
|
|
margin: 24rpx 24rpx 0;
|
|||
|
|
|
|||
|
|
&-info {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// height: 100rpx;
|
|||
|
|
.left {
|
|||
|
|
display: flex;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
margin-right: 30rpx;
|
|||
|
|
|
|||
|
|
.icon {
|
|||
|
|
margin-right: 14rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.name {
|
|||
|
|
font-weight: bold;
|
|||
|
|
margin-right: 24rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.text {
|
|||
|
|
color: #666666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.address {
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
margin-top: 14rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.btn {
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
border: 1rpx solid #4c4c4c;
|
|||
|
|
border-radius: 34rpx;
|
|||
|
|
padding: 4rpx 34rpx;
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tip {
|
|||
|
|
margin-top: 10rpx;
|
|||
|
|
color: v-bind('priceColor');
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
margin-left: 25px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.goods {
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: normal !important;
|
|||
|
|
padding: 0 !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
&-goods {
|
|||
|
|
align-items: normal !important;
|
|||
|
|
flex-direction: column;
|
|||
|
|
padding: 20rpx !important;
|
|||
|
|
|
|||
|
|
.item{
|
|||
|
|
display: flex;
|
|||
|
|
position: relative;
|
|||
|
|
image {
|
|||
|
|
width: 174rpx;
|
|||
|
|
height: 174rpx;
|
|||
|
|
background: #bbb;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
margin-right: 26rpx;
|
|||
|
|
}
|
|||
|
|
.info {
|
|||
|
|
flex: 1;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
.box1 {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
&-name {
|
|||
|
|
align-items: flex-start;
|
|||
|
|
.name {
|
|||
|
|
flex: 1;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
display: -webkit-box;
|
|||
|
|
-webkit-box-orient: vertical;
|
|||
|
|
-webkit-line-clamp: 2;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
.price {
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
margin-left: 15rpx;
|
|||
|
|
.icon {
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.text {
|
|||
|
|
color: #7b7b7b;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
&-num {
|
|||
|
|
.text {
|
|||
|
|
flex: 1;
|
|||
|
|
display: -webkit-box;
|
|||
|
|
-webkit-box-orient: vertical;
|
|||
|
|
-webkit-line-clamp: 2;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.num {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
border: 2rpx solid #d1d1d1;
|
|||
|
|
padding: 0 5rpx;
|
|||
|
|
border-radius: 8rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.tag{
|
|||
|
|
background: v-bind('Color');
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
padding: 4rpx 8rpx;
|
|||
|
|
font-size: 22rpx;
|
|||
|
|
color: #fff;
|
|||
|
|
border-radius: 10rpx 0 10rpx 0;
|
|||
|
|
}
|
|||
|
|
.flexBox{
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
flex: 1;
|
|||
|
|
.txtBox{
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
.price{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
text{
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: v-bind('Color');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.item:not(:first-child) {
|
|||
|
|
margin-top: 24rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
&-price {
|
|||
|
|
flex-direction: column;
|
|||
|
|
padding: 0 20rpx !important;
|
|||
|
|
|
|||
|
|
&-item {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
width: 100%;
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
.input {
|
|||
|
|
text-align: right;
|
|||
|
|
}
|
|||
|
|
.title {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
&-btn {
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 98rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
background-color: #fff;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
z-index: 100;
|
|||
|
|
padding-bottom: env(safe-area-inset-bottom);
|
|||
|
|
|
|||
|
|
.text {
|
|||
|
|
color: #555555;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.icon {
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.price {
|
|||
|
|
margin-right: 30rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.btn {
|
|||
|
|
color: #fff;
|
|||
|
|
// background: #f14939;
|
|||
|
|
background: v-bind('Color');
|
|||
|
|
margin-right: 30rpx;
|
|||
|
|
height: 66rpx;
|
|||
|
|
width: 190rpx;
|
|||
|
|
line-height: 66rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
border-radius: 34rpx;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pay-title {
|
|||
|
|
padding: 30rpx 20rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pay-price-item-list {
|
|||
|
|
font-size: 14px;
|
|||
|
|
display: flex;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
align-items: center;
|
|||
|
|
.list-title {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
margin-bottom: 10rpx;
|
|||
|
|
}
|
|||
|
|
.title-price {
|
|||
|
|
text-align: right;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list-box {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.coupon_icon{
|
|||
|
|
margin-right: 10rpx;
|
|||
|
|
width: 17px;
|
|||
|
|
height: 17px;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-size: 678px 612px;
|
|||
|
|
background-position: -36px -207.5px;
|
|||
|
|
}
|
|||
|
|
.active_move {
|
|||
|
|
width: 100%;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #f14939;
|
|||
|
|
margin-bottom: 10px;
|
|||
|
|
.active_movename {
|
|||
|
|
padding: 4rpx 10rpx;
|
|||
|
|
line-height: 1;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
border: 1px solid #f14939;
|
|||
|
|
}
|
|||
|
|
.active_moveprice {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.sumActive{
|
|||
|
|
margin: 24rpx 24rpx 0;
|
|||
|
|
padding: 10rpx 20rpx;
|
|||
|
|
background: #ffffff;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
.row{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
padding: 10rpx 0;
|
|||
|
|
.label{
|
|||
|
|
width: 72rpx;
|
|||
|
|
height: 36rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
font-size: 22rpx;
|
|||
|
|
background: #F14939;
|
|||
|
|
color: #fff;
|
|||
|
|
margin-right: 10rpx;
|
|||
|
|
border-radius: 6rpx;
|
|||
|
|
}
|
|||
|
|
.name{
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #444;
|
|||
|
|
}
|
|||
|
|
.amount{
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
font-weight: 600;
|
|||
|
|
color: #f14939;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.onTheGo{
|
|||
|
|
background: #ffffff;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
padding: 0 20rpx 20rpx;
|
|||
|
|
margin: 24rpx 24rpx 0;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
.tit{
|
|||
|
|
height: 80rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
.text{
|
|||
|
|
font-style: italic;
|
|||
|
|
font-weight: bold;
|
|||
|
|
text{
|
|||
|
|
color: v-bind('Color');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.huan{
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
color: #999;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
.iconfont{
|
|||
|
|
font-size: 16px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.spBox{
|
|||
|
|
display: flex;
|
|||
|
|
height: 220rpx;
|
|||
|
|
image{
|
|||
|
|
width: 220rpx;
|
|||
|
|
height: 100%;
|
|||
|
|
background: #bbb;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
margin-right: 26rpx;
|
|||
|
|
}
|
|||
|
|
.txtBox{
|
|||
|
|
flex: 1;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
.price{
|
|||
|
|
font-size: 38rpx;
|
|||
|
|
color: v-bind('priceColor');
|
|||
|
|
.prefix{
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.sku{
|
|||
|
|
display: inline-block;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #999;
|
|||
|
|
margin-top: 10rpx;
|
|||
|
|
background: #f7f8fa;
|
|||
|
|
border-radius: 5rpx;
|
|||
|
|
padding: 4rpx 14rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.icon{
|
|||
|
|
width: 90rpx;
|
|||
|
|
height: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.trans_detail{
|
|||
|
|
background: #ffffff;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
padding: 10rpx 20rpx;
|
|||
|
|
margin: 24rpx 24rpx 0;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
.tit{
|
|||
|
|
line-height: 80rpx;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
font-weight: 600;
|
|||
|
|
}
|
|||
|
|
.row{
|
|||
|
|
padding: 20rpx 0;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
.red{
|
|||
|
|
color: v-bind('priceColor');
|
|||
|
|
text{
|
|||
|
|
color: #999;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.payBox{
|
|||
|
|
background: #ffffff;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
padding: 10rpx 20rpx;
|
|||
|
|
margin: 24rpx 24rpx 0;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
.row{
|
|||
|
|
padding: 20rpx 0;
|
|||
|
|
.logo{
|
|||
|
|
font-size: 16px;
|
|||
|
|
margin-right: 10rpx;
|
|||
|
|
display: inline-block;
|
|||
|
|
width: 20px;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.scoreBox{
|
|||
|
|
height: 600rpx;
|
|||
|
|
padding: 24rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
.row{
|
|||
|
|
padding: 24rpx 0;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.openvip {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 80rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
background: v-bind('bgColor');
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
color: v-bind('Color');
|
|||
|
|
padding: 0 30rpx;
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 98rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
z-index: 1;
|
|||
|
|
.left {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
|
|||
|
|
.sheng {
|
|||
|
|
width: 40rpx;
|
|||
|
|
height: 40rpx;
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
color: #fff;
|
|||
|
|
background: v-bind('Color');
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
font-weight: 100;
|
|||
|
|
margin-right: 8rpx;
|
|||
|
|
border-radius: 6rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.right {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.van-checkbox {
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pay-btn {
|
|||
|
|
padding: 0 24rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
.btn {
|
|||
|
|
margin-right: 0;
|
|||
|
|
}
|
|||
|
|
.price {
|
|||
|
|
color: v-bind('priceColor');
|
|||
|
|
.icon {
|
|||
|
|
font-weight: bold;
|
|||
|
|
text{
|
|||
|
|
font-size: 36rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.reduce{
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
line-height: 1;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.kongxin{
|
|||
|
|
padding: 0 24rpx;
|
|||
|
|
margin-top: 20rpx;
|
|||
|
|
}
|
|||
|
|
.realbox{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
background: #fff;
|
|||
|
|
padding: 28rpx 20rpx;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
.cont{
|
|||
|
|
width: calc(100% - 60rpx);
|
|||
|
|
.info{
|
|||
|
|
margin-bottom: 10rpx;
|
|||
|
|
.title{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
.tit{
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #303030;
|
|||
|
|
font-weight: 600;
|
|||
|
|
}
|
|||
|
|
.text{
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
color: #98989F;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.name{
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
color: #000;
|
|||
|
|
margin-top: 10rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.msg{
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: v-bind('Color');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.refTitle{
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #000;
|
|||
|
|
padding: 0 0 30rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
position: relative;
|
|||
|
|
text-align: center;
|
|||
|
|
margin-bottom: 10rpx;
|
|||
|
|
}
|
|||
|
|
.mesg{
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #303030;
|
|||
|
|
line-height: 46rpx;
|
|||
|
|
font-weight: 600;
|
|||
|
|
}
|
|||
|
|
.iknow{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 80rpx;
|
|||
|
|
background: v-bind('Color');
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #fff;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
border-radius: 80rpx;
|
|||
|
|
}
|
|||
|
|
.authMesg{
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #333;
|
|||
|
|
line-height: 48rpx;
|
|||
|
|
padding: 0rpx 50rpx 0;
|
|||
|
|
}
|
|||
|
|
.authBtn{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 80rpx;
|
|||
|
|
background: v-bind('Color');
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #fff;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
margin-bottom: 50rpx;
|
|||
|
|
}
|
|||
|
|
.cancelAuth{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 80rpx;
|
|||
|
|
background: #f3f3f3;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #666;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
}
|
|||
|
|
.realBox{
|
|||
|
|
padding: 0 0 60rpx;
|
|||
|
|
.input{
|
|||
|
|
background: #F5F5F5;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 80rpx;
|
|||
|
|
margin: 20rpx 0;
|
|||
|
|
color: #333;
|
|||
|
|
padding: 0 20rpx;
|
|||
|
|
border-radius: 8rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mode{
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #000;
|
|||
|
|
font-weight: bold;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
margin-top: 16rpx;
|
|||
|
|
border-radius: 6rpx;
|
|||
|
|
}
|
|||
|
|
.quanbox{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
font-weight: bold;
|
|||
|
|
.quan{
|
|||
|
|
width: 36rpx;
|
|||
|
|
height: 36rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
font-size: 22rpx;
|
|||
|
|
background: #F14939;
|
|||
|
|
color: #fff;
|
|||
|
|
margin-right: 10rpx;
|
|||
|
|
}
|
|||
|
|
text{
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #444;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.youhuiBox{
|
|||
|
|
margin: 24rpx 24rpx 0;
|
|||
|
|
padding: 10rpx 20rpx;
|
|||
|
|
background: #ffffff;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
.box1{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
padding: 10rpx 0;
|
|||
|
|
}
|
|||
|
|
.quanbox{
|
|||
|
|
font-weight: normal;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.couponBox {
|
|||
|
|
.item{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
background-color: #ffffff;
|
|||
|
|
margin: 20rpx 0;
|
|||
|
|
padding: 30rpx 0;
|
|||
|
|
border-radius: 8rpx;
|
|||
|
|
}
|
|||
|
|
.coupon-left {
|
|||
|
|
width: 200rpx;
|
|||
|
|
border-right: 2rpx dashed #f0f0f0;
|
|||
|
|
text-align: center;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
.sign {
|
|||
|
|
font-size: 36rpx;
|
|||
|
|
}
|
|||
|
|
.money {
|
|||
|
|
font-size: 42rpx;
|
|||
|
|
}
|
|||
|
|
.title {
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
padding: 10rpx 16rpx 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.coupon-right {
|
|||
|
|
width: calc(100% - 200rpx);
|
|||
|
|
padding: 0 20rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
.coupon-text {
|
|||
|
|
width: calc(100% - 150rpx);
|
|||
|
|
.text {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
margin-bottom: 10px;
|
|||
|
|
font-weight: 500;
|
|||
|
|
padding-right: 20rpx;
|
|||
|
|
&.chang{
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.time {
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #98989f;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.textColor {
|
|||
|
|
color: #333333;
|
|||
|
|
}
|
|||
|
|
.textColor1 {
|
|||
|
|
color: v-bind('priceColor');
|
|||
|
|
}
|
|||
|
|
.textColor2 {
|
|||
|
|
color: #98989f;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.reTitle{
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #000;
|
|||
|
|
padding: 30rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
font-weight: bold;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
border-bottom: 1px solid #e5e5e5;
|
|||
|
|
background-color: #F6F6F6;
|
|||
|
|
border-radius: 10px 10px 0 0;
|
|||
|
|
}
|
|||
|
|
.box_btn{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 80rpx;
|
|||
|
|
background: v-bind('Color');
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
color: #ffffff;
|
|||
|
|
text-align: center;
|
|||
|
|
line-height: 80rpx;
|
|||
|
|
}
|
|||
|
|
.iconfont{
|
|||
|
|
font-size: 20px;
|
|||
|
|
}
|
|||
|
|
.icon-checked{
|
|||
|
|
color: v-bind('Color');
|
|||
|
|
}
|
|||
|
|
.icon-circle{
|
|||
|
|
color: #aaa;
|
|||
|
|
}
|
|||
|
|
</style>
|