2224 lines
60 KiB
Vue
2224 lines
60 KiB
Vue
<template>
|
||
<view>
|
||
<up-popup :show="showPopup" mode="bottom" :round="10" :safe-area-inset-bottom="true" catchtouchmove="preventD" :lock-scroll="true" :z-index="202">
|
||
<view class="whole" :class="fontSize == 'small' ? '' : 'large'">
|
||
<view class="titBox">
|
||
<text>跟团购买</text>
|
||
<view class="close" @click="close"><up-icon name="close" color="#898989" size="20" /></view>
|
||
</view>
|
||
|
||
<view class="content">
|
||
<view class="oneBox" @click="showAddr = true">
|
||
<view class="icon">
|
||
<up-icon name="map-fill" :color="Color" size="20" />
|
||
</view>
|
||
<view class="box">
|
||
<text v-if="!originAddr.id">请填写收货地址</text>
|
||
<template v-else>
|
||
<view class="txt"><text>{{originAddr.name}}</text> {{originAddr.mobile}}</view>
|
||
<view class="txt">{{originAddr.detail}}</view>
|
||
</template>
|
||
<view class="tips" v-if="freightGoods.length"><up-icon name="error-circle" />当前地址超出配送范围，请重新选择</view>
|
||
</view>
|
||
<up-icon name="arrow-right" color="#898989" size="20" />
|
||
</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>
|
||
|
||
<view class="skuTop">
|
||
<image class="img" :src="pic_url || viewImg" @click="preViewImg(pic_url || viewImg)" mode="aspectFill" />
|
||
<view class="topInfo">
|
||
<view class="title">
|
||
<view class="kuajing" v-if="goodsSpec.is_cross_border === 1">跨境包税</view>
|
||
<view class="kuajing" v-else-if="goodsSpec.overseas_direct_mail === 1">海外直邮</view>{{goodsSpec.title}}
|
||
</view>
|
||
<view class="priceBox">
|
||
<!-- 会员下普通价格 -->
|
||
<view class="text1" v-if="vipOn && chooseItem.vip_price > 0 && (is_vip || (!is_vip && vip_price_show))">
|
||
<text>￥{{chooseItem.price}}</text>
|
||
</view>
|
||
|
||
<template>
|
||
<!-- 显示会员价 -->
|
||
<view v-if="vipOn && chooseItem.vip_price > 0 && (is_vip || (!is_vip && vip_price_show))" class="vip">
|
||
<view class="vip-tag"><text class="txt">会员价 ￥</text>{{chooseItem.vip_price}}</view>
|
||
</view>
|
||
|
||
<!-- 显示普通价格 -->
|
||
<view v-else class="vip">
|
||
<text>￥{{chooseItem.price}}</text>
|
||
</view>
|
||
</template>
|
||
</view>
|
||
<view class="sel" v-if="skuName">已选：{{skuName || '-'}}</view>
|
||
<view class="bbox">
|
||
<view class="text" v-if="show_stock === 1">剩余{{ chooseItem.stock > 0 ? chooseItem.stock : 0 }}件</view>
|
||
<up-number-box
|
||
v-model="chooseItem.num"
|
||
:min="goodsSpec.limit_type == 1 ? parseInt(goodsSpec.start_sale_num) : goodsSpec.limit_type === 0 ? 1 : 1"
|
||
:max="goodsSpec.limit_type == 2 ? parseInt(goodsSpec.limit) : (chooseItem.stock > 0 ? chooseItem.stock : 0)"
|
||
@overlimit="plusBtn(goodsSpec.limit_type == 1 ? 0 : goodsSpec.limit_type == 2 ? 1 : 2, chooseItem.num, goodsSpec.limit)"
|
||
disabledInput
|
||
bgColor="#f2f3f5"
|
||
:longPress="false"
|
||
:asyncChange="true"
|
||
@change="changeNum($event)">
|
||
</up-number-box>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="skuBox" v-if="specsList.length">
|
||
<view class="item" v-for="(item, index) in specsList" :key="item.spec_id">
|
||
<view class="tit">{{item.spec_name}}</view>
|
||
<view class="row">
|
||
<view class="tag" v-for="(i, i_index) in item.value" :key="i.id"
|
||
@click="!i.show ? chooseSku(i, index, i_index) : ''"
|
||
:class="choose['v' + (index + 1) + '_id'] === i.id || skus_1 ? 'choose' : i.show ? 'box' : '' ">
|
||
<image :src="i.img" v-if="i.img" class="tag_img"></image>
|
||
<text>{{i.value}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<block v-for="(order, index) in orders" :key="index">
|
||
<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>
|
||
</block>
|
||
|
||
<view class="trans_detail" v-if="sum.goods_price * 1">
|
||
<view class="row">
|
||
<text>商品总价</text>
|
||
<text>￥{{sum.goods_price}}</text>
|
||
</view>
|
||
<view class="row" v-if="sum.active_discount_amount * 1">
|
||
<text>活动优惠</text>
|
||
<text class="red">-￥{{sum.active_discount_amount}}</text>
|
||
</view>
|
||
|
||
<template v-for="(order, index) in orders" :key="index">
|
||
<!-- 新增优惠券信息 -->
|
||
<view class="row" v-if="order.use_coupon.length !== 0">
|
||
<!-- 普通优惠券 -->
|
||
<view style="display: flex;align-items: center;" 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 style="display: flex;align-items: center;" 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 style="color: #F14939;display: flex;align-items: center;" @click="openCoupon(order.coupon_id)">
|
||
<text>-￥{{order.use_coupon.amount}}</text>
|
||
<up-icon name="arrow-right" size="14" v-if="from === 0" />
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<view class="youhuiBox" v-if="sum.use_coupon && sum.use_coupon.length !== 0">
|
||
<view v-for="it in sum.use_coupon" :key="it.id" class="box1 flex">
|
||
<view style="display: flex;align-items: center;" 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 style="display: flex;align-items: center;" 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 style="display: flex;align-items: center;color: #F14939;" @click="openCoupon(it.id)">
|
||
<text style="font-size: 30rpx;">-￥{{it.amount}}</text>
|
||
<up-icon name="arrow-right" size="14" v-if="from === 0" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 未使用优惠券且有优惠券可用 -->
|
||
<view class="youhuiBox" v-if="couponId === 0 && canUseCoupon.length && from === 0">
|
||
<view class="box1 flex">
|
||
<view class="quanbox"><view class="quan">券</view></view>
|
||
<view style="display: flex;align-items: center;color: #F14939;" @click="openCoupon(0)">
|
||
<text style="font-size: 28rpx;">有优惠券可用</text>
|
||
<up-icon name="arrow-right" size="14" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- <view class="row" v-if="sum.freight_price * 1">
|
||
<text>运费</text>
|
||
<text>￥{{sum.freight_price}}</text>
|
||
</view> -->
|
||
|
||
<template v-for="(order, index) in orders" :key="index">
|
||
<view class="row1" 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>
|
||
</template>
|
||
|
||
<view class="row" @click="showScore = true" v-if="detail.score_cash_type">
|
||
<text>积分</text>
|
||
<view class="red">
|
||
<template v-if="is_use_score">使用{{sum.useScore}}积分抵扣，-￥{{sum.deductionProfit}}</template>
|
||
<template v-else><text>可用{{detail.useScore}}积分，抵{{detail.deductionProfit}}元 </text>去使用</template>
|
||
<up-icon name="arrow-right" size="14" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="noticeBox">
|
||
<text class="tit">备注</text>
|
||
<input class="input" v-model="message" placeholder="请填写您的要求" />
|
||
</view>
|
||
|
||
<view class="payBox">
|
||
<view class="row flex1" v-for="it in payList" :key="it.id" @click="pay_method = it.id">
|
||
<view class="flex">
|
||
<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>
|
||
|
||
<view class="paybtn">
|
||
<!-- :class="canPass && freightGoods.length == 0 ? '' : 'disabled'" -->
|
||
<view class="box" @click="payOrder">立即支付
|
||
<text v-if="canPass">￥{{sum.total_price}}</text>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
|
||
<up-popup :show="showAddr" mode="bottom" :round="10" :safe-area-inset-bottom="true" :lock-scroll="true">
|
||
<view class="contBox">
|
||
<view class="topBox">
|
||
<text>选择地址</text>
|
||
<view class="close" @click="showAddr = false"><up-icon name="close" color="#898989" size="20" /></view>
|
||
</view>
|
||
<view class="BBox">
|
||
<view class="searchBox">
|
||
<view class="box">
|
||
<up-icon name="search" color="#A8A8A8" size="17" />
|
||
<input class="input" type="text" :value="keyWord" placeholder="搜索联系人名字、电话" @input="fillValue" @confirm="searchAddress" />
|
||
</view>
|
||
</view>
|
||
<view class="addrBox" v-if="addrList.length > 0">
|
||
<view class="item" v-for="(item, index) in addrList" :key="item.id">
|
||
<view class="row" @click="chooseAddress(item)">
|
||
<view class="icon">
|
||
<span v-if="item.id == addrId" class="iconfont icon-checked"></span>
|
||
<span v-else class="iconfont icon-circle"></span>
|
||
</view>
|
||
<view class="box">
|
||
<view class="txt"><text>{{item.name}}</text> {{item.mobile}}
|
||
<text v-if="item.is_default === 1" class="default">默认</text>
|
||
</view>
|
||
<view class="txt">{{item.detail}}</view>
|
||
</view>
|
||
</view>
|
||
<view class="btnBox">
|
||
<view class="btn" @click="toEdit(item)">
|
||
<up-icon name="edit-pen" />
|
||
<text>编辑</text>
|
||
</view>
|
||
<view class="btn" @click="delBtn(item.id, index)">
|
||
<up-icon name="trash" />
|
||
<text>删除</text>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="btmBox">
|
||
<view class="add btn" @click="toAdd()">新增地址</view>
|
||
</view>
|
||
</view>
|
||
</up-popup>
|
||
|
||
<!-- 编辑、新增地址 -->
|
||
<up-popup :show="showEdit" mode="bottom" :round="10" :safe-area-inset-bottom="true" :lock-scroll="true">
|
||
<view class="contBox">
|
||
<view class="topBox">
|
||
<text>{{tempAddr.id ? '编辑' : '新增'}}地址</text>
|
||
<view class="close" @click="showEdit = false"><up-icon name="close" color="#898989" size="20" /></view>
|
||
</view>
|
||
|
||
<view class="editBox">
|
||
<view class="rowBox">
|
||
<view class="row">
|
||
<text>姓名</text>
|
||
<input v-model="tempAddr.name" placeholder="请输入姓名" />
|
||
</view>
|
||
<view class="row">
|
||
<text>手机号</text>
|
||
<input v-model="tempAddr.mobile" placeholder="请输入手机号" />
|
||
</view>
|
||
<view class="row">
|
||
<text>所在地区</text>
|
||
<view class="area">
|
||
<view class="picker">
|
||
<uni-data-picker
|
||
placeholder="请选择"
|
||
popup-title="请选择"
|
||
:localdata="areaList"
|
||
v-model="tempAddr.area_id"
|
||
@change="chooseArea"
|
||
:map="{text:'name', value:'id'}">
|
||
</uni-data-picker>
|
||
</view>
|
||
<view class="icon" @click="showMap">
|
||
<up-icon name="map-fill" size="20" :color="Color" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="row">
|
||
<text>详细地址</text>
|
||
<input v-model="tempAddr.address" placeholder="请填写具体地址" />
|
||
</view>
|
||
</view>
|
||
|
||
<view class="defaultbox">
|
||
<up-checkbox :checked="tempAddr.is_default === 1" class="check" :activeColor="Color" @change="onChange" shape="circle" usedAlone label="设为默认地址"></up-checkbox>
|
||
</view>
|
||
</view>
|
||
<view class="savebtn" @click="saveBtn">保存地址</view>
|
||
</view>
|
||
</up-popup>
|
||
|
||
|
||
<!-- 了解实名认证 -->
|
||
<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="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>
|
||
|
||
<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-popup :show="showCoupon" :round="10" mode="bottom" @close="showCoupon = false" catchtouchmove="preventDefault" :safe-area-inset-bottom="true">
|
||
<view class="reTitle">
|
||
<text>优惠券</text>
|
||
<view @click="showCoupon = false" class="close">
|
||
<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>
|
||
<view @click="showScore = false" class="close">
|
||
<up-icon name="close" color="#777" size="20" />
|
||
</view>
|
||
</view>
|
||
<view class="scoreBox">
|
||
<view class="row" @click="setUseScore(1)">
|
||
<view class="text">使用{{detail.useScore}}积分抵{{detail.deductionProfit}}元</view>
|
||
<span class="iconfont icon-checked" v-if="is_use_score"></span>
|
||
<span class="iconfont icon-circle" v-else></span>
|
||
</view>
|
||
<view class="row" @click="setUseScore(0)">
|
||
<view class="text">不使用</view>
|
||
<span class="iconfont icon-checked" v-if="!is_use_score"></span>
|
||
<span class="iconfont icon-circle" v-else></span>
|
||
</view>
|
||
</view>
|
||
</up-popup>
|
||
|
||
<!-- 隐私协议弹窗 -->
|
||
<privacy-popup :show-dialog="showPrivacy" @close="showPrivacy = false" @agree="showPrivacy = false" @refuse="showPrivacy = false" />
|
||
|
||
</up-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { ref, reactive, toRefs, watch } from 'vue'
|
||
import { showToast, compareDate, parseTime, judgePrivacy, getAreaCode } from '../common.js'
|
||
import { get, post } from '@/api/request.js'
|
||
import { Style } from '@/utils/list.js'
|
||
import { areaList } from '@/components/areaList.js'
|
||
import { sp2 } from '@/components/img.js'
|
||
import privacyPopup from '@/components/privacyPopup/index.vue'
|
||
import uniDataPicker from '@/uni_modules/uni-data-picker/components/uni-data-picker/uni-data-picker.vue'
|
||
|
||
export default {
|
||
components: {
|
||
privacyPopup, uniDataPicker
|
||
},
|
||
props: {
|
||
show: {
|
||
type: Boolean,
|
||
default: false
|
||
},
|
||
show_stock: {
|
||
type: Number,
|
||
default: 0
|
||
},
|
||
groupId: {
|
||
type: Number,
|
||
default: 0
|
||
},
|
||
sourceId: {
|
||
type: Number,
|
||
default: 0
|
||
},
|
||
sourceType: {
|
||
type: String,
|
||
default: 'normal'
|
||
},
|
||
goodId: {
|
||
type: Number,
|
||
default: 0
|
||
},
|
||
skus_1: {
|
||
type: Boolean,
|
||
default: false
|
||
},
|
||
source: {
|
||
type: String
|
||
}
|
||
},
|
||
setup(props, context) {
|
||
const data = reactive({
|
||
sp2: sp2,
|
||
showKnow: false,
|
||
message: '',
|
||
show: true,
|
||
chooseItem: {},
|
||
originAddr: {},
|
||
Color: uni.getStorageSync('theme_color'),
|
||
priceColor: Style[uni.getStorageSync('theme_index') * 1].priceColor,
|
||
bgColor: Style[uni.getStorageSync('theme_index') * 1].bgColor,
|
||
showPopup: false,
|
||
address: {},
|
||
addrId: 0,
|
||
showAddr: false,
|
||
keyWord: '',
|
||
addrList: [],
|
||
tempAddr: {},
|
||
showEdit: false,
|
||
arealist: [],
|
||
area: '',
|
||
area_id: '',
|
||
showArea: false,
|
||
goodId: 0,
|
||
groupId: 0,
|
||
vipOn: uni.getStorageSync('vip_on') === 1,
|
||
vip_price_show: uni.getStorageSync('vip_price_show'),
|
||
sourceId: 0,
|
||
sourceType: '',
|
||
viewImg: '',
|
||
imgWidth: 200,
|
||
skuInfo: {},
|
||
skuName: '',
|
||
is_vip: uni.getStorageSync('is_vip'),
|
||
specsList: [],
|
||
mainImg: [],
|
||
images: [],
|
||
chooseItem: {},
|
||
choose: {},
|
||
chooseIndex: [],
|
||
pickSkuList: [],
|
||
skusInfo: [],
|
||
curIndex: 0,
|
||
specType: 1,
|
||
goodsSpec: {},
|
||
pic_url: '',
|
||
needReal: false,
|
||
hasActive: false,
|
||
reducePrice: 0,
|
||
vipInfo: {},
|
||
canPass: false,
|
||
canBuy: true,
|
||
noRealName: true,
|
||
showReal: false,
|
||
realAddInfo: {},
|
||
from: 0,
|
||
use_coupons: [],
|
||
couponId: '',
|
||
canUseCoupon: [],
|
||
cannotUseCoupon: [],
|
||
showCoupon: false,
|
||
showTaxation: false,
|
||
tempId: 0,
|
||
nowTime: '',
|
||
freightGoods: [],
|
||
showPrivacy: false,
|
||
is_use_score: 0,
|
||
showScore: false,
|
||
pay_method: 'alipay',
|
||
payList: [
|
||
// { id: 'wxpay', icon: 'wxpay', color: '#15BA11', name: '微信支付' },
|
||
{ id: 'alipay', icon: 'alipay', color: '#00A0EA', name: '支付宝' }
|
||
],
|
||
fontSize: 'small'
|
||
})
|
||
|
||
const goods = reactive({
|
||
orders: [],
|
||
sum: {},
|
||
detail: {},
|
||
oederNum: 0
|
||
})
|
||
|
||
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
|
||
}
|
||
|
||
async function getDefaultAddress() {
|
||
await get('/api/v1/address/default').then(async (res) => {
|
||
if (res.data instanceof Array === false) {
|
||
res.data.detail =
|
||
res.data.province.name +
|
||
res.data.city.name +
|
||
res.data.area.name +
|
||
res.data.address
|
||
data.originAddr = res.data
|
||
data.addrId = res.data.id
|
||
await checkOrder()
|
||
}
|
||
})
|
||
}
|
||
|
||
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 getUseCoupon(obj) {
|
||
let params = {
|
||
shop_id: uni.getStorageSync('shop_id'),
|
||
shop_goods: obj,
|
||
address: data.originAddr,
|
||
purchase_vip: 0
|
||
}
|
||
await post('/api/v1/order/checkCoupons', params).then((res) => {
|
||
data.canUseCoupon = res.data.can_use
|
||
data.cannotUseCoupon = res.data.cannot_use
|
||
})
|
||
}
|
||
|
||
function chooseAddress(row) {
|
||
data.addrId = row.id
|
||
data.originAddr = JSON.parse(JSON.stringify(row))
|
||
data.showAddr = false
|
||
checkOrder()
|
||
}
|
||
|
||
function fillValue(e) {
|
||
data.keyWord = e.detail.value
|
||
}
|
||
|
||
const searchAddress = () => {
|
||
getAddrList()
|
||
}
|
||
|
||
async function getAddrList() {
|
||
await get('/api/v1/address', { keyword: data.keyWord}).then((res) => {
|
||
res.data.forEach((item) => {
|
||
item.detail = item.province.name + item.city.name + item.area.name + item.address
|
||
if(item.id == data.addrId) {
|
||
data.originAddr = JSON.parse(JSON.stringify(item))
|
||
}
|
||
})
|
||
data.addrList = res.data
|
||
})
|
||
}
|
||
|
||
function delBtn(id, index) {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '确认删除该地址吗？',
|
||
confirmColor: '#42b983',
|
||
success(res) {
|
||
if (res.confirm) {
|
||
post(`/api/v1/address/${id}`, {}, 'DELETE').then((res) => {
|
||
showToast('删除成功')
|
||
data.addrList.splice(index, 1)
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
function toEdit(row) {
|
||
let obj = JSON.parse(JSON.stringify(row))
|
||
data.tempAddr = {
|
||
id: obj.id,
|
||
name: obj.name,
|
||
mobile: obj.mobile,
|
||
is_default: obj.is_default,
|
||
province_id: obj.province_id,
|
||
city_id: obj.city_id,
|
||
area_id: obj.area_id,
|
||
address: obj.address,
|
||
postal_code: ''
|
||
}
|
||
data.area_id = obj.area_id
|
||
data.area = row.province.name + row.city.name + row.area.name
|
||
data.showEdit = true
|
||
}
|
||
|
||
function toAdd() {
|
||
data.tempAddr = {
|
||
id: 0,
|
||
name: '',
|
||
mobile: '',
|
||
is_default: 0,
|
||
province_id: '',
|
||
city_id: '',
|
||
area_id: '',
|
||
address: '',
|
||
postal_code: ''
|
||
}
|
||
data.area = ''
|
||
data.area_id = ''
|
||
data.showEdit = true
|
||
}
|
||
|
||
function chooseArea(e) {
|
||
let list = e.detail.value
|
||
data.tempAddr.province = {
|
||
id: list[0].value,
|
||
name: list[0].text
|
||
}
|
||
data.tempAddr.province_id = list[0].value
|
||
|
||
data.tempAddr.city = {
|
||
id: list[1].value,
|
||
name: list[1].text
|
||
}
|
||
data.tempAddr.city_id = list[1].value
|
||
|
||
data.tempAddr.area = {
|
||
id: list[2].value,
|
||
name: list[2].text
|
||
}
|
||
data.tempAddr.area_id = list[2].value
|
||
|
||
data.area = list[0].text + list[1].text + list[2].text
|
||
data.area_id = list[2].value
|
||
data.showArea = false
|
||
}
|
||
|
||
function onChange(e) {
|
||
data.tempAddr.is_default = e ? 1 : 0
|
||
}
|
||
|
||
function saveBtn() {
|
||
var reg_tel = /(^1[3-9]\d{9}$)|(^((0\d{2,3})-)(\d{7,8})(-(\d{3,}))?$)|(^(400)-(\d{3})-(\d{4})(.)(\d{1,4})$)|(^(400)-(\d{3})-(\d{4}$))/
|
||
if(!data.tempAddr.mobile || !reg_tel.test(data.tempAddr.mobile)) {
|
||
showToast('请输入正确联系方式')
|
||
return
|
||
}
|
||
if(data.tempAddr.id) {
|
||
post(`/api/v1/address/${data.tempAddr.id}`, { ...data.tempAddr }, 'PUT').then(async () => {
|
||
showToast('编辑成功')
|
||
await getAddrList()
|
||
data.showEdit = false
|
||
if(data.tempAddr.id == data.originAddr.id) {
|
||
await checkOrder()
|
||
}
|
||
})
|
||
} else {
|
||
post(`/api/v1/address`, { ...data.tempAddr }).then(() => {
|
||
showToast('新增成功')
|
||
getAddrList()
|
||
data.showEdit = false
|
||
})
|
||
}
|
||
}
|
||
|
||
function close() {
|
||
data.showPopup = false
|
||
data.choose = {}
|
||
data.addrId = 0
|
||
data.originAddr = {}
|
||
data.freightGoods = []
|
||
data.chooseItem = {
|
||
num: 1
|
||
}
|
||
data.message = ''
|
||
data.needReal = false
|
||
data.noRealName = true
|
||
data.canPass = false
|
||
data.couponId = ''
|
||
data.use_coupons = []
|
||
data.images = []
|
||
data.specsList = []
|
||
data.chooseIndex = []
|
||
data.skuName = ''
|
||
data.specType = 1
|
||
name = []
|
||
context.emit('close')
|
||
}
|
||
|
||
let name = []
|
||
function chooseSku(e, index, i_index) {
|
||
data.firstWatch = false
|
||
data.show = false
|
||
if (e.img) {
|
||
data.chooseItem.pic_url = e.img
|
||
data.chooseItem.pic_url_800 = e.img_800
|
||
data.pic_url = e.img_800 || e.img
|
||
}
|
||
data.choose['v' + (index + 1) + '_id'] = data.specsList[index].value[i_index].id
|
||
name[index] = data.specsList[index].value[i_index].value
|
||
data.chooseIndex.push(index)
|
||
data.chooseIndex = Array.from(new Set(data.chooseIndex))
|
||
data.skuName = name.join('-')
|
||
}
|
||
|
||
async function getSpecList() {
|
||
await get(`/api/v1/goods/spec/${data.goodId}`).then(async (res) => {
|
||
data.goodsSpec = res.data
|
||
data.viewImg = res.data.face_img
|
||
data.mainImg = res.data.gallery || []
|
||
data.chooseItem = {
|
||
stock: res.data.stock,
|
||
num: 1
|
||
}
|
||
data.specType = res.data.specs_type
|
||
data.specsList = res.data.specs || []
|
||
data.skusInfo = res.data.skus || []
|
||
|
||
if(res.data.specs_type == 0) { // 单规格
|
||
data.chooseItem.price = res.data.price
|
||
data.chooseItem.vip_price = res.data.vip_price
|
||
data.chooseItem.id = 0
|
||
} else {
|
||
if(data.specsList.length) {
|
||
data.specsList[0].value.forEach((it) => {
|
||
if(it.img_800){
|
||
data.images.push(it.img_800)
|
||
}
|
||
})
|
||
// 当只有一种规格时，判断是否还有库存
|
||
if (data.specsList.length === 1) {
|
||
var sku = []
|
||
data.skusInfo.forEach((ress) => {
|
||
if (ress.stock <= 0 || ress.price == 0) {
|
||
sku.push(ress.v1_id)
|
||
}
|
||
})
|
||
data.specsList.forEach((res, index) => {
|
||
res.value.forEach((res1) => {
|
||
if (sku.includes(res1.id)) {
|
||
res1.show = true
|
||
} else {
|
||
res1.show = false
|
||
}
|
||
})
|
||
})
|
||
}
|
||
}
|
||
if(data.skusInfo.length > 0) {
|
||
data.chooseItem.price = data.skusInfo[0].price
|
||
}
|
||
if(data.skusInfo.length == 1 && data.skusInfo[0].stock > 0) {
|
||
data.chooseItem = JSON.parse(JSON.stringify(data.skusInfo[0]))
|
||
data.chooseItem.num = 1
|
||
data.choose = {
|
||
'v1_id': data.chooseItem.v1_id
|
||
}
|
||
data.skuName = data.chooseItem.v1
|
||
name = [data.chooseItem.v1]
|
||
await checkOrder()
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
watch(
|
||
() => data.choose, async(newChoose) => {
|
||
if (data.specsList.length - Object.keys(data.choose).length == 1) {
|
||
|
||
// 如果只有一个规格类未选中，则去判断未选中的这一项是否可选
|
||
data.specsList.forEach((req, i) => {
|
||
if (data.chooseIndex.indexOf(i) == -1) {
|
||
req.value.forEach((rej, j) => {
|
||
data.skusInfo.forEach((ress, m) => {
|
||
let flag = [rej.id === ress['v' + (i + 1) + '_id']]
|
||
for (const key in data.choose) {
|
||
flag.push(ress[key] == data.choose[key])
|
||
}
|
||
if (flag.findIndex(target => target === false) == -1) {
|
||
if (ress.stock <= 0 || ress.price == 0) {
|
||
rej.show = true
|
||
} else {
|
||
rej.show = false
|
||
}
|
||
}
|
||
})
|
||
})
|
||
}
|
||
})
|
||
} else if (data.specsList.length == Object.keys(data.choose).length) {
|
||
for (const key in data.choose) {
|
||
let i = parseInt(key.substr(1, 1))
|
||
data.specsList[i - 1].value.forEach((req) => {
|
||
data.skusInfo.forEach((ress, m) => {
|
||
let flag = [req.id == ress['v' + i + '_id']]
|
||
for (const k in data.choose) {
|
||
let j = parseInt(k.substr(1, 1))
|
||
if (i != j) {
|
||
flag.push(ress[k] == data.choose[k])
|
||
}
|
||
}
|
||
if (flag.findIndex(target => target === false) == -1) {
|
||
if ((ress.stock <= 0 || ress.price == 0)) {
|
||
req.show = true
|
||
} else {
|
||
req.show = false
|
||
}
|
||
}
|
||
})
|
||
})
|
||
}
|
||
}
|
||
if (newChoose) {
|
||
data.show = false
|
||
}
|
||
if (JSON.stringify(newChoose) == '{}') {
|
||
data.show = true
|
||
}
|
||
// 判断选择规格值是否完整
|
||
for (let i = data.specsList.length; i >= 1; i--) {
|
||
if (!newChoose['v' + i + '_id']) {
|
||
return
|
||
}
|
||
}
|
||
// 对比选中项
|
||
let list = data.skusInfo
|
||
list.forEach((sku, s_index) => {
|
||
let num = data.chooseItem.num
|
||
if (
|
||
sku.v1_id === newChoose.v1_id &&
|
||
sku.v2_id === newChoose.v2_id &&
|
||
sku.v3_id === newChoose.v3_id &&
|
||
sku.v4_id === newChoose.v4_id
|
||
) {
|
||
data.chooseItem = {
|
||
...sku
|
||
}
|
||
if (num > 0) {
|
||
data.chooseItem.num = num < sku.stock ? num : (sku.stock > 0 ? sku.stock : 0)
|
||
} else if (sku.stock > 0) {
|
||
data.chooseItem.num =
|
||
data.goodsSpec.limit_type == 0 ?
|
||
1 :
|
||
data.goodsSpec.limit_type == 1 ?
|
||
parseInt(data.goodsSpec.start_sale_num) :
|
||
1
|
||
} else {
|
||
data.chooseItem.num = 0
|
||
}
|
||
if (sku.pic_url === 'undefined') {
|
||
data.chooseItem.pic_url = props.skuInfo.face_img
|
||
}
|
||
}
|
||
})
|
||
await checkOrder()
|
||
}, {
|
||
deep: true
|
||
}
|
||
)
|
||
|
||
const preViewImg = (img) => {
|
||
let img_preview_suffix = uni.getStorageSync('img_preview_suffix') || ''
|
||
let imurl = img + img_preview_suffix
|
||
if(img.indexOf('.gif') >= 0 || img.indexOf('.GIF') >= 0) {
|
||
imurl = img
|
||
}
|
||
uni.previewImage({
|
||
urls: [imurl],
|
||
current: 0
|
||
})
|
||
}
|
||
|
||
function changeNum(e) {
|
||
if(data.goodsSpec.limit_type === 2 && e.value > data.goodsSpec.limit) {
|
||
showToast('本团商品限购' + data.goodsSpec.limit + '件')
|
||
return
|
||
}
|
||
data.chooseItem.num = e.value
|
||
data.couponId = 0
|
||
data.use_coupons = [0]
|
||
checkOrder()
|
||
}
|
||
|
||
function plusBtn(number, index, e) {
|
||
if (data.chooseItem.num === data.chooseItem.stock) {
|
||
showToast('库存不足')
|
||
}
|
||
if (number == 0 && !data.show) {
|
||
showToast('该商品不能低于起购件数')
|
||
} else if (number == 1 && !data.show) {
|
||
if (index == e) {
|
||
showToast('已达到商品限购件数')
|
||
} else if (index > e) {
|
||
showToast('已达到商品限购件数')
|
||
} else if (index != e) {
|
||
showToast('该商品不能低于1件')
|
||
}
|
||
} else if (number == 2 && !data.show) {
|
||
showToast('该商品不能低于1件')
|
||
}
|
||
}
|
||
|
||
// 获取认证信息
|
||
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() {
|
||
data.realAddInfo = {
|
||
id: realInfo.value.id,
|
||
name: realInfo.value.name,
|
||
cert_id: realInfo.value.cert_id
|
||
}
|
||
data.showReal = true
|
||
}
|
||
|
||
function openReal() {
|
||
data.realAddInfo = {}
|
||
data.showReal = true
|
||
}
|
||
|
||
function commitReal() {
|
||
if(!data.realAddInfo.name || !data.realAddInfo.cert_id) {
|
||
showToast('请填写完整信息')
|
||
return false
|
||
}
|
||
let params = {
|
||
name: data.realAddInfo.name,
|
||
cert_id: data.realAddInfo.cert_id
|
||
}
|
||
if(data.realAddInfo.id) {
|
||
post('/api/v1/identityCard/' + data.realAddInfo.id, params, 'PUT').then((res) => {
|
||
data.showReal = false
|
||
uni.showToast({
|
||
title: '保存成功',
|
||
icon: 'success',
|
||
duration: 1000,
|
||
mask: true
|
||
})
|
||
data.noRealName = false
|
||
getRealInfo()
|
||
})
|
||
} else {
|
||
post('/api/v1/identityCard', params).then((res) => {
|
||
data.showReal = false
|
||
uni.showToast({
|
||
title: '保存成功',
|
||
icon: 'success',
|
||
duration: 1000,
|
||
mask: true
|
||
})
|
||
data.noRealName = false
|
||
realInfo.value = res.data
|
||
})
|
||
}
|
||
}
|
||
|
||
function payOrder() {
|
||
let arr1 = name.filter((d) => d)
|
||
if(!data.originAddr.id) {
|
||
showToast('请选择您的收货地址')
|
||
return
|
||
} else if (data.specType == 1 && arr1.length < data.specsList.length) {
|
||
showToast('请选择完整规格')
|
||
return
|
||
} else if (data.needReal && !realInfo.value.id) {
|
||
showToast('所购商品为跨境商品，需进行实名认证')
|
||
return
|
||
} else if (data.freightGoods.length) {
|
||
showToast('当前地址超出配送范围，请重新选择')
|
||
return
|
||
} else {
|
||
commitPay()
|
||
}
|
||
}
|
||
|
||
async function commitPay() {
|
||
data.canBuy = false
|
||
uni.showLoading({
|
||
title: '加载中...',
|
||
mask: true
|
||
})
|
||
let goodsOrder = []
|
||
goods.orders.forEach((it) => {
|
||
if(it.items.length !== 0) {
|
||
it.message = data.message
|
||
goodsOrder.push(it)
|
||
}
|
||
})
|
||
let params = {
|
||
is_cart: 0,
|
||
purchase_vip: 0,
|
||
sum: goods.sum,
|
||
orders: goodsOrder,
|
||
address: {
|
||
consignee: data.originAddr.name,
|
||
mobile: data.originAddr.mobile,
|
||
address: data.originAddr.detail,
|
||
province_id: data.originAddr.province_id,
|
||
city_id: data.originAddr.city_id,
|
||
area_id: data.originAddr.area_id,
|
||
id: data.originAddr.id
|
||
},
|
||
identity_card_id: 0,
|
||
source: data.source,
|
||
use_coupons: data.use_coupons,
|
||
scene: uni.getEnterOptionsSync().scene,
|
||
score_cash: data.is_use_score,
|
||
pay_type: data.pay_method == 'wxpay' ? 1 : 2,
|
||
channel: 'app'
|
||
}
|
||
if(data.needReal) {
|
||
params.identity_card_id = realInfo.value.id
|
||
}
|
||
post('/api/v1/order/create', params).then(async(res) => {
|
||
await pay(res.data.id, 0)
|
||
data.canBuy = true
|
||
uni.hideLoading()
|
||
}).catch(() => {
|
||
data.canBuy = true
|
||
})
|
||
}
|
||
|
||
async function pay(id, isBuyVip) {
|
||
await get(`/api/v1/pay/group/${id}`, { pay_style: 'app_pay' }).then((res) => {
|
||
let info = {
|
||
pay_id: res.data.pay_id,
|
||
create_id: id,
|
||
from: data.from,
|
||
source: 'direct'
|
||
}
|
||
context.emit('back', info)
|
||
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) => {
|
||
console.log(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 checkOrder() {
|
||
let arr1 = name.filter((d) => d)
|
||
if(!data.originAddr.id || (data.specType == 1 && arr1.length < data.specsList.length) || (data.specType == 1 && !data.chooseItem.id)) {
|
||
data.canPass = false
|
||
} else {
|
||
data.canPass = true
|
||
uni.showLoading({
|
||
title: '加载中...'
|
||
})
|
||
data.originAddr.province_id = data.originAddr.province.id
|
||
data.originAddr.city_id = data.originAddr.city.id
|
||
data.originAddr.area_id = data.originAddr.area.id
|
||
|
||
let obj = [{
|
||
num: data.chooseItem.num,
|
||
shop_goods_id: data.goodId,
|
||
shop_goods_sku_id: data.chooseItem.id || 0,
|
||
shop_group_goods_id: data.groupId,
|
||
source_id: data.sourceId,
|
||
source_type: data.sourceType
|
||
}]
|
||
let params = {
|
||
shop_id: uni.getStorageSync('shop_id'),
|
||
shop_goods: obj,
|
||
address: data.originAddr,
|
||
purchase_vip: 0,
|
||
use_coupons: data.use_coupons,
|
||
score_cash: data.is_use_score
|
||
}
|
||
await post('/api/v1/order/check', params).then((res) => {
|
||
goods.oederNum = 0
|
||
goods.orders = []
|
||
data.freightGoods = []
|
||
data.needReal = res.data.sum.has_cross_border
|
||
|
||
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(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
|
||
data.reducePrice = res.data.sum.expect_vip_discount_amount
|
||
data.vipInfo = res.data.vip
|
||
uni.hideLoading()
|
||
getUseCoupon(obj)
|
||
})
|
||
}
|
||
}
|
||
|
||
async function showMap() {
|
||
if(await judgePrivacy()) {
|
||
data.showPrivacy = true
|
||
return false
|
||
}
|
||
uni.chooseLocation({
|
||
success(ress) {
|
||
if(ress.address) {
|
||
post('/api/v1/address/parse', {address: ress.address + ress.name}).then((res) => {
|
||
let list = getAreaCode(res.data.province, res.data.city, res.data.region)
|
||
data.tempAddr.province_id = list[0].code
|
||
data.tempAddr.city_id = list[1].code
|
||
data.tempAddr.area_id = list[2].code
|
||
|
||
data.tempAddr.address = (res.data.street || '') + (res.data.addr || '')
|
||
|
||
data.tempAddr.province = {
|
||
id: list[0].code,
|
||
name: res.data.province || ''
|
||
}
|
||
data.tempAddr.city = {
|
||
id: list[1].code,
|
||
name: res.data.city || ''
|
||
}
|
||
data.tempAddr.area = {
|
||
id: list[2].code,
|
||
name: res.data.region || ''
|
||
}
|
||
data.area = res.data.province + res.data.city + res.data.region
|
||
data.area_id = list[2].code
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
function setUseScore(val) {
|
||
data.is_use_score = val
|
||
data.showScore = false
|
||
checkOrder()
|
||
}
|
||
|
||
watch(props, async(newProps) => {
|
||
if(newProps.show) {
|
||
data.goodId = newProps.goodId
|
||
data.groupId = newProps.groupId
|
||
data.sourceId = newProps.sourceId
|
||
data.sourceType = newProps.sourceType
|
||
data.fontSize = uni.getStorageSync('font') || 'small'
|
||
getNowTime()
|
||
await getSpecList()
|
||
await getDefaultAddress()
|
||
getAddrList()
|
||
getRealInfo()
|
||
data.showPopup = true
|
||
} else {
|
||
data.showPopup = false
|
||
}
|
||
})
|
||
|
||
return {
|
||
parseTime,
|
||
areaList,
|
||
realInfo,
|
||
compareDate,
|
||
...toRefs(data),
|
||
...toRefs(goods),
|
||
getDefaultAddress,
|
||
getNowTime,
|
||
getAddrList,
|
||
chooseAddress,
|
||
fillValue,
|
||
searchAddress,
|
||
delBtn,
|
||
toEdit,
|
||
toAdd,
|
||
chooseArea,
|
||
onChange,
|
||
saveBtn,
|
||
close,
|
||
getSpecList,
|
||
chooseSku,
|
||
preViewImg,
|
||
payOrder,
|
||
changeNum,
|
||
plusBtn,
|
||
getRealInfo,
|
||
toAddReal,
|
||
openReal,
|
||
commitReal,
|
||
checkOrder,
|
||
openCoupon,
|
||
selectCoupon,
|
||
getUseCoupon,
|
||
handleCoupon,
|
||
getAreaCode,
|
||
showMap,
|
||
setUseScore
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.flex{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
.flex1{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.whole{
|
||
height: 75vh;
|
||
overflow: hidden;
|
||
font-size: 28rpx;
|
||
.titBox{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 0 24rpx;
|
||
height: 90rpx;
|
||
box-sizing: border-box;
|
||
border-bottom: 1rpx solid #eee;
|
||
text{
|
||
font-weight: 600;
|
||
font-size: 30rpx;
|
||
}
|
||
.close{
|
||
width: 60rpx;
|
||
height: 90rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
}
|
||
.content{
|
||
height: calc(100% - 200rpx);
|
||
overflow: auto;
|
||
box-sizing: border-box;
|
||
padding-bottom: 100rpx;
|
||
background-color: #f0f0f0;
|
||
}
|
||
.oneBox{
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 24rpx;
|
||
box-sizing: border-box;
|
||
background-color: #fff;
|
||
.icon{
|
||
width: 60rpx;
|
||
font-size: 22px;
|
||
}
|
||
.box{
|
||
width: calc(100% - 60rpx);
|
||
color: #444;
|
||
.txt{
|
||
margin: 4rpx 0;
|
||
}
|
||
text{
|
||
font-size: 30rpx;
|
||
font-weight: 600;
|
||
}
|
||
.tips{
|
||
color: #f00;
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
.kongxin{
|
||
margin-top: 18rpx;
|
||
.realbox{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
background: #fff;
|
||
padding: 28rpx;
|
||
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');
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.skuTop{
|
||
display: flex;
|
||
padding: 24rpx;
|
||
box-sizing: border-box;
|
||
border-top: 1rpx solid #eee;
|
||
background-color: #fff;
|
||
.img{
|
||
background: #bbbbbb;
|
||
border-radius: 8rpx;
|
||
margin-right: 24rpx;
|
||
width: 200rpx;
|
||
height: 200rpx;
|
||
}
|
||
.topInfo{
|
||
display: flex;
|
||
width: calc(100% - 224rpx);
|
||
flex-direction: column;
|
||
.title{
|
||
margin-bottom: 10rpx;
|
||
}
|
||
.priceBox{
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
.text1{
|
||
font-size: 32rpx;
|
||
color: v-bind('priceColor');
|
||
margin-right: 10rpx;
|
||
font-weight: 600;
|
||
}
|
||
.vip{
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 34rpx;
|
||
color: v-bind('priceColor');
|
||
}
|
||
.vip-tag {
|
||
font-size: 32rpx;
|
||
color: #fbe6c3;
|
||
background: #353648;
|
||
border-radius: 20rpx 0 0 0;
|
||
padding: 8rpx 10rpx;
|
||
line-height: 1;
|
||
.txt{
|
||
font-size: 22rpx;
|
||
}
|
||
}
|
||
}
|
||
.bbox{
|
||
margin-top: 10rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.text{
|
||
font-size: 24rpx;
|
||
color: #999999;
|
||
display: block;
|
||
}
|
||
.sel{
|
||
margin-top: 20rpx;
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
.skuBox{
|
||
padding: 10rpx 24rpx 30rpx;
|
||
border-top: 1rpx solid #eee;
|
||
position: relative;
|
||
background-color: #fff;
|
||
.item{
|
||
.tit{
|
||
font-size: 26rpx;
|
||
margin-top: 10rpx;
|
||
}
|
||
.row{
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
font-size: 24rpx;
|
||
.tag{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #000;
|
||
background-color: #f4f4f4;
|
||
margin-right: 22rpx;
|
||
margin-top: 20rpx;
|
||
padding: 10rpx 18rpx;
|
||
box-sizing: border-box;
|
||
border-radius: 6rpx;
|
||
&.box{
|
||
opacity: 0.35;
|
||
}
|
||
.tag_img{
|
||
width: 35rpx;
|
||
height: 35rpx;
|
||
margin-right: 15rpx;
|
||
}
|
||
}
|
||
.choose{
|
||
background-color: v-bind('bgColor');
|
||
color: v-bind('Color');
|
||
border-radius: 8rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.pay-price{
|
||
background-color: #fff;
|
||
border-top: 1rpx solid #eee;
|
||
padding: 12rpx 24rpx 0;
|
||
&-item {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
width: 100%;
|
||
font-size: 26rpx;
|
||
padding: 12rpx 0;
|
||
.input {
|
||
text-align: right;
|
||
}
|
||
.title {
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
.pay-price-item-list {
|
||
font-size: 28rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 12rpx 0;
|
||
.list-title {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.title-price {
|
||
text-align: right;
|
||
}
|
||
}
|
||
}
|
||
|
||
.noticeBox{
|
||
margin-top: 18rpx;
|
||
padding: 24rpx;
|
||
box-sizing: border-box;
|
||
background-color: #fff;
|
||
display: flex;
|
||
align-items: center;
|
||
text{
|
||
font-size: 30rpx;
|
||
margin-right: 20rpx;
|
||
line-height: 1;
|
||
}
|
||
.input{
|
||
flex: 1;
|
||
width: 100%;
|
||
}
|
||
}
|
||
.paybtn{
|
||
background-color: #fff;
|
||
width: 100%;
|
||
.box{
|
||
background-color: v-bind('Color');
|
||
font-size: 30rpx;
|
||
height: 110rpx;
|
||
font-weight: 600;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #fff;
|
||
&.disabled{
|
||
opacity: 0.65;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.contBox{
|
||
font-size: 28rpx;
|
||
background-color: #F0F0F0;
|
||
border-radius: 10px 10px 0 0;
|
||
.topBox{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 0 24rpx;
|
||
height: 80rpx;
|
||
box-sizing: border-box;
|
||
border-bottom: 1rpx solid #eee;
|
||
background-color: #fff;
|
||
border-radius: 10px 10px 0 0;
|
||
text{
|
||
font-weight: 600;
|
||
font-size: 30rpx;
|
||
}
|
||
.close{
|
||
width: 60rpx;
|
||
height: 80rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
}
|
||
.searchBox{
|
||
padding: 20rpx 24rpx;
|
||
box-sizing: border-box;
|
||
width: 100%;
|
||
.box{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 16rpx 20rpx;
|
||
box-sizing: border-box;
|
||
background-color: #fff;
|
||
border-radius: 50rpx;
|
||
}
|
||
.input{
|
||
font-size: 28rpx;
|
||
width: calc(100% - 50rpx);
|
||
color: #333;
|
||
}
|
||
}
|
||
.BBox{
|
||
height: calc(80vh - 200rpx);
|
||
overflow: auto;
|
||
}
|
||
.addrBox{
|
||
padding: 0 24rpx 24rpx;
|
||
box-sizing: border-box;
|
||
.item{
|
||
background-color: #fff;
|
||
margin-bottom: 24rpx;
|
||
border-radius: 10rpx;
|
||
padding: 0 20rpx;
|
||
box-sizing: border-box;
|
||
.row{
|
||
display: flex;
|
||
align-items: center;
|
||
border-bottom: 1rpx solid #eee;
|
||
padding: 20rpx 0;
|
||
.icon{
|
||
width: 60rpx;
|
||
font-size: 20px;
|
||
}
|
||
.box{
|
||
color: #444;
|
||
flex: 1;
|
||
.txt{
|
||
margin: 4rpx 0;
|
||
}
|
||
text{
|
||
font-size: 30rpx;
|
||
font-weight: 600;
|
||
}
|
||
.default{
|
||
padding: 4rpx 8rpx;
|
||
font-size: 22rpx;
|
||
color: v-bind('Color');
|
||
border: 1px solid v-bind('Color');
|
||
border-radius: 6rpx;
|
||
line-height: 1;
|
||
margin-left: 6rpx;
|
||
}
|
||
}
|
||
}
|
||
.btnBox{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
padding: 20rpx 0;
|
||
.btn{
|
||
margin-left: 30rpx;
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.btmBox{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
width: 100%;
|
||
padding: 24rpx;
|
||
box-sizing: border-box;
|
||
font-size: 30rpx;
|
||
.btn{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 100%;
|
||
border-radius: 80rpx;
|
||
height: 80rpx;
|
||
}
|
||
.add{
|
||
color: #fff;
|
||
background-color: v-bind('Color');
|
||
}
|
||
}
|
||
|
||
.editBox{
|
||
height: calc(80vh - 200rpx);
|
||
overflow: auto;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
}
|
||
.rowBox{
|
||
padding: 0 20rpx;
|
||
border-radius: 10rpx;
|
||
background-color: #fff;
|
||
margin-bottom: 24rpx;
|
||
.row{
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 26rpx;
|
||
height: 90rpx;
|
||
text {
|
||
width: 160rpx;
|
||
flex-shrink: 0;
|
||
font-size: 30rpx;
|
||
font-weight: bold;
|
||
}
|
||
input {
|
||
flex: 1;
|
||
}
|
||
.area {
|
||
display: flex;
|
||
align-items: center;
|
||
flex: 1;
|
||
justify-content: space-between;
|
||
width: calc(100% - 160rpx);
|
||
.icon{
|
||
width: 60rpx;
|
||
text-align: center;
|
||
}
|
||
}
|
||
.picker{
|
||
width: calc(100% - 60rpx);
|
||
overflow: hidden;
|
||
}
|
||
&:not(:last-child) {
|
||
border-bottom: 2rpx solid #e5e5e5;
|
||
}
|
||
}
|
||
}
|
||
.defaultbox{
|
||
font-size: 26rpx;
|
||
color: #666;
|
||
padding: 30rpx 20rpx;
|
||
border-radius: 10rpx;
|
||
background-color: #fff;
|
||
margin-bottom: 24rpx;
|
||
}
|
||
.savebtn{
|
||
width: 94%;
|
||
height: 85rpx;
|
||
line-height: 85rpx;
|
||
background-color: v-bind('Color');
|
||
border-radius: 43rpx;
|
||
font-size: 30rpx;
|
||
color: #fff;
|
||
text-align: center;
|
||
margin: 20rpx auto;
|
||
}
|
||
}
|
||
|
||
.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;
|
||
}
|
||
.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;
|
||
}
|
||
}
|
||
|
||
.youhuiBox{
|
||
margin-top: 24rpx;
|
||
padding: 14rpx 0;
|
||
background: #fff;
|
||
box-sizing: border-box;
|
||
.box1{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.quanbox{
|
||
font-weight: normal;
|
||
}
|
||
}
|
||
.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;
|
||
}
|
||
}
|
||
.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;
|
||
}
|
||
}
|
||
.sumActive{
|
||
margin: 24rpx 0 0;
|
||
padding: 10rpx 24rpx;
|
||
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;
|
||
}
|
||
}
|
||
}
|
||
.trans_detail{
|
||
background: #ffffff;
|
||
border-radius: 10rpx;
|
||
padding: 0 24rpx 12rpx;
|
||
font-size: 28rpx;
|
||
.tit{
|
||
line-height: 80rpx;
|
||
font-size: 30rpx;
|
||
font-weight: 600;
|
||
}
|
||
.row{
|
||
padding: 14rpx 0;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.red{
|
||
color: v-bind('priceColor');
|
||
text{
|
||
color: #999;
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
.row1{
|
||
font-size: 28rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 14rpx 0;
|
||
.title {
|
||
font-size: 28rpx;
|
||
}
|
||
.list-title{
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.title-price{
|
||
text-align: right;
|
||
}
|
||
}
|
||
}
|
||
.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;
|
||
}
|
||
}
|
||
.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;
|
||
padding: 6rpx 0;
|
||
.name{
|
||
padding: 4rpx 10rpx;
|
||
line-height: 1;
|
||
font-size: 24rpx;
|
||
border: 1px solid #f14939;
|
||
}
|
||
.price{
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
.reTitle{
|
||
font-size: 30rpx;
|
||
color: #000;
|
||
padding: 0 30rpx;
|
||
height: 80rpx;
|
||
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;
|
||
.close{
|
||
width: 60rpx;
|
||
height: 80rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
}
|
||
.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');
|
||
}
|
||
.whole.large{
|
||
.titBox{
|
||
text{font-size: 36rpx;}
|
||
}
|
||
.oneBox{
|
||
font-size: 34rpx;
|
||
text{
|
||
font-size: 36rpx;
|
||
}
|
||
}
|
||
.skuTop{
|
||
.title{font-size: 36rpx;}
|
||
.priceBox{
|
||
.vip{
|
||
font-size: 40rpx;
|
||
}
|
||
}
|
||
.sel{
|
||
font-size: 34rpx;
|
||
}
|
||
.bbox{
|
||
.text{
|
||
font-size: 34rpx;
|
||
}
|
||
}
|
||
}
|
||
.skuBox{
|
||
.tit{font-size: 34rpx;}
|
||
.row{font-size: 34rpx;}
|
||
}
|
||
.pay-price-item{
|
||
font-size: 34rpx;
|
||
.title{font-size: 34rpx;}
|
||
}
|
||
.noticeBox{
|
||
font-size: 34rpx;
|
||
.tit{font-size: 34rpx;}
|
||
}
|
||
.trans_detail{
|
||
font-size: 34rpx;
|
||
}
|
||
}
|
||
.payBox{
|
||
background: #ffffff;
|
||
padding: 10rpx 30rpx;
|
||
border-top: 1rpx solid #eee;
|
||
font-size: 28rpx;
|
||
.row{
|
||
padding: 20rpx 0;
|
||
.logo{
|
||
font-size: 16px;
|
||
margin-right: 10rpx;
|
||
display: inline-block;
|
||
width: 20px;
|
||
text-align: center;
|
||
}
|
||
}
|
||
}
|
||
</style> |