837 lines
21 KiB
Vue
837 lines
21 KiB
Vue
<template>
|
|
<div class="wrapper">
|
|
<!-- 选择地址 -->
|
|
<div class="box1 box">
|
|
<u-row style="margin-top: 32rpx">
|
|
<u-col style="padding: 0 !important" :offset="0" :span="11" @click.native="clickToAddress()">
|
|
<div v-if="!address.id">请选择地址</div>
|
|
<div v-else>
|
|
<div class="userClass">
|
|
{{ address.name }}
|
|
<span>
|
|
{{ address.mobile | secrecyMobile }}
|
|
<u-tag v-if="address.isDefault" text="默认" style="margin-left: 24rpx" mode="plain" type="error" size="mini" />
|
|
</span>
|
|
</div>
|
|
<div class="userAdress">
|
|
<span v-if="address.consigneeAddressPath[0]">{{
|
|
address.consigneeAddressPath[0]
|
|
}}</span>
|
|
|
|
<span v-if="address.consigneeAddressPath[1]">{{
|
|
address.consigneeAddressPath[1]
|
|
}}</span>
|
|
<span v-if="address.consigneeAddressPath[2]">{{
|
|
address.consigneeAddressPath[2]
|
|
}}</span>
|
|
|
|
<span v-if="address.consigneeAddressPath[3]">{{
|
|
address.consigneeAddressPath[3]
|
|
}}</span>
|
|
<span>
|
|
{{ address.detail }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</u-col>
|
|
<u-col :span="1" @click.native="
|
|
navigateTo('/pages/mine/address/address?way=' + routerVal.way)
|
|
" style="text-align: right">
|
|
<u-icon name="arrow-right" style="color: #bababa"></u-icon>
|
|
</u-col>
|
|
</u-row>
|
|
</div>
|
|
<!-- 背景 -->
|
|
<div class="bar"></div>
|
|
|
|
<!-- 开团信息 -->
|
|
<view class="group-box" v-if="isAssemble">
|
|
<view class="group-title">
|
|
<span v-if="pintuanFlage">你正在开团购买</span>
|
|
<span v-else>为你加入仅差<span>{{routerVal.parentOrder.toBeGroupedNum }}</span>人的团购买</span>
|
|
</view>
|
|
<view class="group">
|
|
<view>
|
|
<u-image borderRadius="50%" shape="square" class="head-img" width="81rpx" height="81rpx" :src="masterWay.face || '/static/missing-face.png'"></u-image>
|
|
<view class="btn-one">团长</view>
|
|
</view>
|
|
<view class="line"> </view>
|
|
<view>
|
|
<!-- 如果有最后一名，显示最后一名，没有最后一名，显示等待参团 -->
|
|
<u-image class="head-img" v-if="endWay.face" :src="endWay.face" borderRadius="50%" shape="square" width="81rpx" height="81rpx">
|
|
<view slot="loading"></view>
|
|
</u-image>
|
|
|
|
<u-image class="head-img" borderRadius="50%" shape="square" v-else width="81rpx" height="81rpx" :src="endWay.face || '/static/missing-face.png'"></u-image>
|
|
|
|
<view class="wait">{{ endWay.nickname || "等待参团" }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 店铺商品信息 -->
|
|
<div class="box box2" v-for="(item, index) in orderMessage.cartList" :key="index">
|
|
<u-row class="tab1" @click="navigateToStore(item)">
|
|
<u-col :offset="0">
|
|
<span class="ybname">{{ item.storeName }}</span>
|
|
</u-col>
|
|
</u-row>
|
|
<div class="promotionNotice">{{ item.promotionNotice }}</div>
|
|
<u-row class="goodsBorder" v-for="(val, i) in item.skuList" :key="i">
|
|
<u-col class="tabL" :offset="0" @click="navigateTo('/pages/product/goods?id=' + val.goodsSku.id+'&goodsId='+val.goodsSku.goodsId)" :span="3">
|
|
<u-image borderRadius="10rpx" :src="val.goodsSku.thumbnail" alt />
|
|
</u-col>
|
|
<u-col :span="9" @click="navigateTo('/pages/product/goods?id=' + val.goodsSku.id+'&goodsId='+val.goodsSku.goodsId)" class="tabC">
|
|
<div style="overflow: hidden">
|
|
<p class="sp_name">{{ val.goodsSku.goodsName }}</p>
|
|
<p class="sp_promotion" v-if="val.promotion_tags">
|
|
<view class="sp_tag sp_tag_plain" v-for="(promotion_item, promotion_index) in val.promotion_tags" :key="promotion_index">{{ promotion_item }}</view>
|
|
</p>
|
|
<span class="nums">x{{ val.num }}</span>
|
|
</div>
|
|
|
|
<p class="sp_number">￥{{ val.goodsSku.price | unitPrice }}</p>
|
|
</u-col>
|
|
</u-row>
|
|
|
|
<u-row>
|
|
<u-col :offset="0" :span="4" class="tl" style="text-align: left">备注信息</u-col>
|
|
<u-col :span="8" textAlign="right">
|
|
<u-input style="text-align:right;" class="uinput" v-model="remarkVal[index].remark" />
|
|
</u-col>
|
|
</u-row>
|
|
</div>
|
|
<!-- 订单信息 -->
|
|
<div class="box box3">
|
|
<u-row>
|
|
<u-col :offset="0" :span="4">发票信息</u-col>
|
|
<u-col :span="8" class="tipsColor" textAlign="right" @click.native="invoice()">
|
|
<span v-if="receiptList">{{receiptList.receiptTitle}} - {{receiptList.receiptContent}}</span>
|
|
<span v-else>不开发票</span>
|
|
</u-col>
|
|
</u-row>
|
|
</div>
|
|
|
|
<!-- 发票信息 -->
|
|
<invoices :res="receiptList" @callbackInvoice="callbackInvoice" v-if="invoiceFlag" />
|
|
<u-select v-model="shippingFlag" :list="shippingMethod" @confirm="checkedshipMethod"></u-select>
|
|
|
|
<!-- 优惠券 -->
|
|
<div class="box box4">
|
|
<u-row>
|
|
<u-col :offset="0" :span="9" @click="shippingFlag = true">配送方式</u-col>
|
|
<u-col :span="3" textAlign="right" @click="shippingFlag = true">
|
|
{{ shippingMethod.find(e=>{ return e.value == shippingText; }).label }}
|
|
</u-col>
|
|
</u-row>
|
|
<u-row>
|
|
<u-col :offset="0" :span="9" @click="GET_Discount()">优惠券</u-col>
|
|
|
|
<u-col :span="3" v-if="orderMessage.priceDetailDTO && orderMessage.priceDetailDTO.couponPrice" textAlign="right" @click="GET_Discount()">
|
|
<span class="main-color">-{{orderMessage.priceDetailDTO.couponPrice | unitPrice}}</span>
|
|
</u-col>
|
|
<!-- orderMessage.priceDetailDTO.couponPrice | unitPrice -->
|
|
<u-col :span="3" v-else textAlign="right" @click="GET_Discount()">
|
|
{{ couponNums || "0" }}张可用
|
|
<u-icon name="arrow-right"></u-icon>
|
|
</u-col>
|
|
</u-row>
|
|
|
|
</div>
|
|
|
|
<div class="box box5" v-if="orderMessage.priceDetailDTO">
|
|
<div>
|
|
<u-row>
|
|
<u-col :span="9">商品合计</u-col>
|
|
<u-col :span="3" textAlign="right">
|
|
<span>￥{{ orderMessage.priceDetailDTO.goodsPrice | unitPrice }}</span>
|
|
</u-col>
|
|
</u-row>
|
|
</div>
|
|
<div>
|
|
<u-row>
|
|
<u-col :span="7">运费</u-col>
|
|
<u-col :span="5" class="tr tipsColor" textAlign="right">
|
|
<u-tag v-if="orderMessage.priceDetailDTO.freightPrice == 0" style="margin-right: 20rpx" color="#FF6262" text="包邮" type="warning" size="mini" mode="plain" shape="circle" />
|
|
<span>￥{{
|
|
orderMessage.priceDetailDTO.freightPrice | unitPrice
|
|
}}</span>
|
|
</u-col>
|
|
</u-row>
|
|
</div>
|
|
|
|
<div>
|
|
<u-row>
|
|
<u-col :span="9">优惠金额</u-col>
|
|
<u-col :span="3" textAlign="right">-￥{{ orderMessage.priceDetailDTO.couponPrice | unitPrice }}</u-col>
|
|
</u-row>
|
|
</div>
|
|
<div>
|
|
<u-row>
|
|
<u-col :span="6">活动优惠</u-col>
|
|
<u-col :span="6" class="tr tipsColor" textAlign="right">
|
|
<u-tag style="margin-right: 20rpx" v-if="orderMessage.priceDetailDTO.discountPrice != 0" color="#FF6262" :text="`优惠 ${orderMessage.priceDetailDTO.discountPrice} 元`" type="warning"
|
|
size="mini" mode="plain" shape="circle" />
|
|
<span>{{
|
|
orderMessage.priceDetailDTO.discountPrice | unitPrice
|
|
}}</span>
|
|
</u-col>
|
|
</u-row>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 结账 -->
|
|
<div class="box box6 mp-iphonex-bottom" v-if="orderMessage.priceDetailDTO">
|
|
<div class="navL">
|
|
合计：
|
|
<span class="number">
|
|
¥
|
|
<span>{{ orderMessage.priceDetailDTO.billPrice | unitPrice }}</span>
|
|
</span>
|
|
</div>
|
|
<div class="navRiv" @click="createTradeFun()">
|
|
<!-- #ifndef MP-WEIXIN -->
|
|
<div class="navR">提交订单</div>
|
|
<!-- #endif -->
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
<div class="navR">微信支付</div>
|
|
<!-- #endif -->
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import * as API_Trade from "@/api/trade";
|
|
import * as API_Address from "@/api/address";
|
|
import * as API_Order from "@/api/order";
|
|
import invoices from "@/pages/order/invoice/setInvoice";
|
|
|
|
import LiLiWXPay from "@/js_sdk/lili-pay/wx-pay.js";
|
|
|
|
export default {
|
|
onLoad: function (val) {
|
|
this.routerVal = val;
|
|
},
|
|
components: {
|
|
invoices,
|
|
},
|
|
|
|
watch: {},
|
|
data() {
|
|
return {
|
|
invoiceFlag: false, //开票开关
|
|
shippingText: "LOGISTICS",
|
|
shippingFlag: false,
|
|
shippingMethod: [
|
|
{
|
|
value: "LOGISTICS",
|
|
label: "物流",
|
|
},
|
|
],
|
|
isAssemble: false, //是否拼团
|
|
couponNums: "", //结算页面优惠券数量
|
|
selectAddressId: "",
|
|
routerVal: "",
|
|
params: {},
|
|
// 优惠劵
|
|
couponList: "",
|
|
// 已选地址
|
|
address: "",
|
|
// 发票信息
|
|
receiptList: "",
|
|
// 店铺信息
|
|
orderMessage: "",
|
|
data: "",
|
|
// 存储备注
|
|
remarkVal: [],
|
|
detail: "", //返回的所有数据
|
|
endWay: "", //最后一个参团人
|
|
masterWay: "", //团长信息
|
|
pintuanFlage: true, //是开团还是拼团
|
|
};
|
|
},
|
|
filters: {
|
|
/**
|
|
* 发票收据类型
|
|
*/
|
|
receiptType(type) {
|
|
switch (type) {
|
|
case "VATORDINARY":
|
|
return "增值税普通发票";
|
|
case "ELECTRO":
|
|
return "电子普通发票";
|
|
case "VATOSPECIAL":
|
|
return "增值税专用发票";
|
|
default:
|
|
return "不开发票";
|
|
}
|
|
},
|
|
},
|
|
|
|
/**
|
|
* 监听返回
|
|
*/
|
|
onBackPress(e) {
|
|
if (e.from == "backbutton") {
|
|
let routes = getCurrentPages();
|
|
let curRoute = routes[routes.length - 1].options;
|
|
routes.forEach((item) => {
|
|
if (
|
|
item.route == "pages/tabbar/cart/cartList" ||
|
|
item.route.indexOf("pages/product/goods") != -1
|
|
) {
|
|
uni.redirectTo({
|
|
url: item.route,
|
|
});
|
|
}
|
|
});
|
|
|
|
if (curRoute.addId) {
|
|
uni.reLaunch({
|
|
url: "/pages/tabbar/cart/cartList",
|
|
});
|
|
} else {
|
|
uni.navigateBack();
|
|
}
|
|
return true; //阻止默认返回行为
|
|
}
|
|
},
|
|
|
|
onShow() {
|
|
uni.showLoading({
|
|
mask: true,
|
|
});
|
|
this.getOrderList();
|
|
uni.hideLoading();
|
|
if (this.routerVal.way == "PINTUAN") {
|
|
this.isAssemble = true;
|
|
this.routerVal.parentOrder = JSON.parse(
|
|
decodeURIComponent(this.routerVal.parentOrder)
|
|
);
|
|
this.pintuanWay();
|
|
}
|
|
},
|
|
mounted() {},
|
|
|
|
methods: {
|
|
//发票回调 选择发票之后刷新购物车
|
|
async callbackInvoice(val) {
|
|
this.invoiceFlag = false;
|
|
this.receiptList = val;
|
|
if (val) {
|
|
let submit = {
|
|
way: this.routerVal.way,
|
|
...this.receiptList,
|
|
};
|
|
let receipt = await API_Order.getReceipt(submit);
|
|
if (receipt.data.success) {
|
|
this.shippingFlag = false;
|
|
this.getOrderList();
|
|
}
|
|
}
|
|
},
|
|
|
|
// 跳转到店铺
|
|
navigateToStore(val) {
|
|
uni.navigateTo({
|
|
url: "/pages/product/shopPage?id=" + val.storeId,
|
|
});
|
|
},
|
|
// 点击跳转地址
|
|
clickToAddress() {
|
|
this.navigateTo(
|
|
`/pages/mine/address/address?from=cart&way=${
|
|
this.routerVal.way
|
|
}&parentOrder=${encodeURIComponent(
|
|
JSON.stringify(this.routerVal.parentOrder)
|
|
)}`
|
|
);
|
|
},
|
|
|
|
// 判断团长以及团员信息
|
|
pintuanWay() {
|
|
const { memberId } = this.routerVal.parentOrder;
|
|
|
|
const userInfo = this.$options.filters.isLogin();
|
|
if (memberId) {
|
|
this.endWay = userInfo;
|
|
this.masterWay = this.routerVal.parentOrder;
|
|
this.pintuanFlage = false;
|
|
} else {
|
|
this.pintuanFlage = true;
|
|
this.masterWay = userInfo;
|
|
}
|
|
},
|
|
// 判断发票
|
|
invoice() {
|
|
this.invoiceFlag = true;
|
|
},
|
|
|
|
// 领取优惠券
|
|
GET_Discount() {
|
|
// 循环店铺id,商品id获取优惠券
|
|
let store = [];
|
|
let skus = [];
|
|
this.orderMessage.cartList.forEach((item) => {
|
|
item.skuList.forEach((sku) => {
|
|
store.push(sku.storeId);
|
|
skus.push(sku.goodsSku.id);
|
|
});
|
|
});
|
|
store = Array.from(new Set(store));
|
|
skus = Array.from(new Set(skus));
|
|
uni.setStorage({
|
|
key: "totalPrice",
|
|
data: this.orderMessage.priceDetailDTO.goodsPrice,
|
|
});
|
|
this.navigateTo(
|
|
`/pages/cart/coupon/index?way=${this.routerVal.way}&storeId=${store}&skuId=${skus}`
|
|
);
|
|
},
|
|
|
|
/**
|
|
* 跳转
|
|
*/
|
|
navigateTo(url) {
|
|
uni.navigateTo({
|
|
url,
|
|
});
|
|
},
|
|
|
|
/**
|
|
* 提交订单准备支付
|
|
*/
|
|
|
|
// 创建订单
|
|
createTradeFun() {
|
|
// 防抖
|
|
this.$u.throttle(() => {
|
|
if (!this.address.id) {
|
|
uni.showToast({
|
|
title: "请选择地址",
|
|
duration: 2000,
|
|
icon: "none",
|
|
});
|
|
return false;
|
|
}
|
|
// 创建订单
|
|
let client;
|
|
// #ifdef H5
|
|
client = "H5";
|
|
// #endif
|
|
// #ifdef MP-WEIXIN
|
|
client = "WECHAT_MP";
|
|
// #endif
|
|
// #ifdef APP-PLUS
|
|
client = "APP";
|
|
// #endif
|
|
|
|
let submit = {
|
|
client,
|
|
way: this.routerVal.way,
|
|
remark: this.remarkVal,
|
|
parentOrderSn: "",
|
|
};
|
|
// 如果是拼团并且当前用户不是团长
|
|
this.routerVal.parentOrder && this.routerVal.parentOrder.orderSn
|
|
? (submit.parentOrderSn = this.routerVal.parentOrder.orderSn)
|
|
: delete submit.parentOrderSn;
|
|
|
|
/**
|
|
* 创建订单
|
|
*/
|
|
API_Trade.createTrade(submit).then((res) => {
|
|
if (res.data.success) {
|
|
uni.showToast({
|
|
title: "创建订单成功!",
|
|
duration: 2000,
|
|
icon: "none",
|
|
});
|
|
// 如果当前价格为0跳转到订单列表
|
|
if (this.orderMessage.priceDetailDTO.billPrice == 0) {
|
|
uni.redirectTo({
|
|
url: "/pages/order/myOrder?status=0",
|
|
});
|
|
} else {
|
|
// #ifdef MP-WEIXIN
|
|
// 微信小程序中点击创建订单直接开始支付
|
|
this.pay(res.data.result.sn);
|
|
// #endif
|
|
|
|
// #ifndef MP-WEIXIN
|
|
this.navigateTo(
|
|
`/pages/cart/payment/payOrder?trade_sn=${res.data.result.sn}`
|
|
);
|
|
// #endif
|
|
}
|
|
} else {
|
|
uni.showToast({
|
|
title: "创建订单有误!请稍后重试",
|
|
duration: 2000,
|
|
icon: "none",
|
|
});
|
|
}
|
|
});
|
|
}, 3000);
|
|
},
|
|
|
|
/**
|
|
* 微信小程序中直接支付
|
|
*/
|
|
async pay(sn) {
|
|
new LiLiWXPay({
|
|
sn: sn,
|
|
price: this.orderMessage.priceDetailDTO.billPrice,
|
|
}).pay();
|
|
},
|
|
|
|
/**
|
|
* 获取用户地址
|
|
*/
|
|
getUserAddress() {
|
|
// 如果没有商品选择地址的话 则选择 默认地址
|
|
API_Address.getAddressDefault().then((res) => {
|
|
if (res.data.result) {
|
|
res.data.result.consigneeAddressPath = res.data.result.consigneeAddressPath.split(
|
|
","
|
|
);
|
|
this.address = res.data.result;
|
|
}
|
|
});
|
|
},
|
|
|
|
// 获取结算参数
|
|
getOrderList() {
|
|
// 获取购物车可用优惠券
|
|
this.getCartsCouponNums();
|
|
// 获取结算参数
|
|
API_Trade.getCheckoutParams(this.routerVal.way).then((res) => {
|
|
res.data.result.cartList.forEach((item, index) => {
|
|
this.remarkVal[index] = {
|
|
remark: item.remark,
|
|
storeId: item.storeId,
|
|
};
|
|
});
|
|
this.orderMessage = res.data.result;
|
|
|
|
if (!res.data.result.memberAddress.id) {
|
|
// 获取会员默认地址
|
|
this.getUserAddress();
|
|
} else {
|
|
this.address = res.data.result.memberAddress;
|
|
res.data.result.memberAddress.consigneeAddressPath = res.data.result.memberAddress.consigneeAddressPath.split(
|
|
","
|
|
);
|
|
}
|
|
});
|
|
},
|
|
|
|
/**购物车可用优惠券 */
|
|
getCartsCouponNums() {
|
|
API_Trade.getCartCouponNum(this.routerVal.way).then((res) => {
|
|
if (res.data.success) {
|
|
this.couponNums = res.data.result;
|
|
}
|
|
});
|
|
},
|
|
|
|
//
|
|
},
|
|
};
|
|
</script>
|
|
<style scoped lang="scss">
|
|
.main-color {
|
|
font-weight: bold;
|
|
}
|
|
.uinput {
|
|
/deep/ input {
|
|
text-align: right;
|
|
}
|
|
}
|
|
.promotionNotice {
|
|
font-size: 24rpx;
|
|
color: $aider-light-color;
|
|
}
|
|
.nums {
|
|
color: $light-color;
|
|
float: right;
|
|
width: 15%;
|
|
text-align: center;
|
|
}
|
|
.wait {
|
|
font-size: 22rpx;
|
|
font-family: PingFang SC, PingFang SC-Regular;
|
|
font-weight: 400;
|
|
color: #cccccc;
|
|
text-align: center;
|
|
}
|
|
|
|
.line {
|
|
margin-left: 14rpx;
|
|
margin-right: 14rpx;
|
|
margin-bottom: 50rpx;
|
|
width: 143rpx;
|
|
border-bottom: 2px dotted #999;
|
|
}
|
|
|
|
.btn-one,
|
|
.wait {
|
|
margin-top: 14rpx;
|
|
}
|
|
|
|
.btn-one {
|
|
width: 100rpx;
|
|
height: 40rpx;
|
|
background: $light-color;
|
|
border-radius: 20rpx;
|
|
font-size: 22rpx;
|
|
font-family: PingFang SC, PingFang SC-Regular;
|
|
font-weight: 400;
|
|
text-align: left;
|
|
color: #ffffff;
|
|
text-align: center;
|
|
line-height: 40rpx;
|
|
}
|
|
|
|
.head-img {
|
|
width: 81rpx;
|
|
height: 81rpx;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.group-title {
|
|
text-align: center;
|
|
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC, PingFang SC-Regular;
|
|
font-weight: 400;
|
|
|
|
color: $light-color;
|
|
}
|
|
|
|
.group-box {
|
|
height: 242rpx;
|
|
align-items: center;
|
|
display: flex;
|
|
justify-content: center;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
background: #fff;
|
|
}
|
|
|
|
.group {
|
|
width: 100%;
|
|
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.tr {
|
|
text-align: right;
|
|
}
|
|
|
|
.tl {
|
|
text-align: left;
|
|
}
|
|
|
|
/deep/ .u-col-3 {
|
|
text-align: right;
|
|
}
|
|
|
|
.bar {
|
|
height: 4rpx;
|
|
overflow: hidden;
|
|
width: 100%;
|
|
background: url("/pages/floor/imgs/line.png") no-repeat;
|
|
}
|
|
|
|
.tabC {
|
|
> p {
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
|
|
.box2 {
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.userClass {
|
|
font-weight: bold;
|
|
font-size: 32rpx;
|
|
color: $u-content-color;
|
|
> span {
|
|
margin-left: 20rpx;
|
|
}
|
|
}
|
|
|
|
.userAdress {
|
|
margin: 20rpx 0;
|
|
color: $u-tips-color;
|
|
font-size: 26rpx;
|
|
}
|
|
|
|
.box6 {
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
|
|
margin: 0;
|
|
height: 100rpx;
|
|
overflow: hidden;
|
|
line-height: 100rpx;
|
|
margin-bottom: 0px !important;
|
|
background: #fff;
|
|
color: #333;
|
|
width: 100%;
|
|
|
|
> .navL {
|
|
width: 65%;
|
|
}
|
|
|
|
> .navRiv {
|
|
float: left;
|
|
}
|
|
}
|
|
|
|
.navR {
|
|
margin-top: 10rpx;
|
|
height: 80rpx;
|
|
color: #fff;
|
|
line-height: 80rpx;
|
|
background: linear-gradient(91deg, $light-color 1%, $aider-light-color 99%);
|
|
padding: 0 44rpx;
|
|
text-align: center;
|
|
border-radius: 400px;
|
|
}
|
|
|
|
.sp_tag {
|
|
display: inline;
|
|
background: #f2f2f2;
|
|
padding: 0 20rpx 0 10rpx;
|
|
height: 20rpx;
|
|
line-height: 20rpx;
|
|
font-size: 24rpx;
|
|
color: #262626;
|
|
border-radius: 0.4em;
|
|
}
|
|
|
|
.sp_promotion {
|
|
float: left;
|
|
width: 75%;
|
|
margin: 4rpx 0;
|
|
}
|
|
|
|
.sp_tag_plain {
|
|
margin-left: 8rpx;
|
|
padding: 0 6rpx 0 6rpx;
|
|
background: #fff;
|
|
border: 1px solid $main-color;
|
|
font-size: 24rpx;
|
|
color: $main-color;
|
|
border-radius: 50px;
|
|
}
|
|
|
|
.sp_tag_plain:nth-of-type(1) {
|
|
margin-left: 0;
|
|
}
|
|
|
|
.sp_name {
|
|
float: left;
|
|
width: 75%;
|
|
font-size: 28rpx;
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.sp_type {
|
|
color: $u-tips-color;
|
|
padding: 8rpx 0;
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.number {
|
|
color: $main-color;
|
|
font-size: 26rpx;
|
|
margin-left: 10rpx;
|
|
|
|
> span {
|
|
font-size: 36rpx;
|
|
}
|
|
}
|
|
|
|
.sp_number {
|
|
color: $light-color;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.box1 {
|
|
background: #f6f6f6 !important;
|
|
min-height: 166rpx;
|
|
// height: 200rpx;
|
|
|
|
/deep/ .u-row {
|
|
border: none;
|
|
}
|
|
|
|
margin-bottom: 0 !important;
|
|
}
|
|
|
|
.box {
|
|
border-radius: 40rpx;
|
|
overflow: hidden;
|
|
background: #fff;
|
|
margin-bottom: 20rpx;
|
|
padding: 0 32rpx;
|
|
}
|
|
|
|
.navL,
|
|
.navR {
|
|
float: left;
|
|
}
|
|
|
|
.wrapper {
|
|
background: #f9f9f9;
|
|
height: auto;
|
|
padding-bottom: 200rpx;
|
|
overflow: auto !important;
|
|
}
|
|
|
|
.tab1 {
|
|
}
|
|
|
|
.ybname {
|
|
margin-left: 20rpx;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
}
|
|
|
|
/deep/ .u-col {
|
|
padding: 36rpx 0 !important;
|
|
}
|
|
|
|
/deep/ .u-col-3,
|
|
.tipsColor {
|
|
color: $u-tips-color;
|
|
}
|
|
|
|
.tabL {
|
|
text-align: left;
|
|
overflow: hidden;
|
|
|
|
/deep/ .u-image,
|
|
.u-image__image {
|
|
width: 132rpx !important;
|
|
height: 132rpx !important;
|
|
border-radius: 0.4em !important;
|
|
}
|
|
}
|
|
</style>
|