|
|
@@ -0,0 +1,814 @@
|
|
|
+<template>
|
|
|
+ <view class="container">
|
|
|
+ <view class='no_data' v-if="dataError">
|
|
|
+ <image src="/static/no_data.png" class='image' mode='widthFix' />
|
|
|
+ <view>没有找到该订单呢……</view>
|
|
|
+ </view>
|
|
|
+ <view class='orderDetail_box'>
|
|
|
+ <view class="sec-wrap" v-if="!dataError">
|
|
|
+ <view class="order-status">
|
|
|
+ <view class="icon-box">
|
|
|
+ <block v-if="orderInfo.orderDetail">
|
|
|
+ <image v-if="orderInfo.orderDetail.status==2" class="icon" src="/static/order-details/icon-ddfk.png"></image>
|
|
|
+ <image v-else-if="orderInfo.orderDetail.status==3" class="icon" src="/static/order-details/icon-ddfh.png"></image>
|
|
|
+ <image v-else-if="orderInfo.orderDetail.status==4" class="icon" src="/static/order-details/icon-ddsh.png"></image>
|
|
|
+ <image v-else-if="orderInfo.orderDetail.status==5" class="icon" src="/static/order-details/icon-jycg.png"></image>
|
|
|
+ <image v-else-if="orderInfo.orderDetail.status==6 || orderInfo.orderDetail.status==7" class="icon" src="/static/order-details/icon-ddgb.png"></image>
|
|
|
+ </block>
|
|
|
+ </view>
|
|
|
+ <view class="right-text">
|
|
|
+ <view class="status">{{orderInfo.orderDetail?orderInfo.orderDetail.statusMsg:''}}</view>
|
|
|
+ <!-- <view class="des">{{changeTimeText}}</view> -->
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 配送 -->
|
|
|
+ <view class="address-box">
|
|
|
+ <view class="show-address">
|
|
|
+ <view class="name-tel">{{orderInfo.address.name}} {{orderInfo.address.mobile}}</view>
|
|
|
+ <view class="addr-text">{{orderInfo.address.province}} {{orderInfo.address.city}} {{orderInfo.address.county}} {{orderInfo.address.address}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class='logistics_btn' v-if="orderInfo.logistics && orderInfo.logistics.logistics_no && orderInfo.logistics.logistics_business" @tap="goLogistics">
|
|
|
+ <view class='l_box' v-if="orderInfo.logistics.statusMsg && orderInfo.logistics.statusMsg != ''">{{orderInfo.logistics.statusMsg}}</view>
|
|
|
+ <view class='l_box' v-else>已发货：{{orderInfo.logistics.logistics_business}}，快递单号：{{orderInfo.logistics.logistics_no}}</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="goods-list">
|
|
|
+ <view class="goods-info_box" v-for="(item,index) in orderInfo.mallGood" :key="index">
|
|
|
+ <scroll-view class="goods-img-container" :data-id="item.goodsId" @tap="toGoodsDetails">
|
|
|
+ <view class="img-box">
|
|
|
+ <image :src="item.image" mode='' class="goods-img"></image>
|
|
|
+ </view>
|
|
|
+ <view class='goodsDetail_info'>
|
|
|
+ <view class='goods_name'>{{item.goodsName}}
|
|
|
+ <view class='goods_num'>×{{item.buyCount}}</view>
|
|
|
+ </view>
|
|
|
+ <view class='goods_price r_color'>￥{{item.costPrice}}</view>
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- <view class="remark"><text>备注:</text>{{item}}</view> -->
|
|
|
+ <!-- <view class="goods-info">
|
|
|
+ <view class="row-box" v-if="orderInfo.coupon && orderInfo.coupon.id">
|
|
|
+ <view class="row-label">商品合计</view>
|
|
|
+ <view class="right-text r_color">¥ {{goodsTotalPrice}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="row-box" v-if="orderInfo.coupon && orderInfo.coupon.id">
|
|
|
+ <view class="row-label">店铺优惠</view>
|
|
|
+ <view class="right-text r_color">
|
|
|
+ {{orderInfo.coupon.type == 1?'- ￥':''}} {{orderInfo.coupon.actualCoupon}} {{orderInfo.coupon.type == 1?'':'折'}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view> -->
|
|
|
+ <view class='order_info'>
|
|
|
+ <view class='li_box' v-if="orderInfo.orderDetail.statusMsg">订单状态：
|
|
|
+ <view class='info_data'>{{orderInfo.orderDetail.statusMsg}}</view>
|
|
|
+ </view>
|
|
|
+ <view class='li_box' v-if="orderInfo.orderDetail.orderNo">订单编号：
|
|
|
+ <view class='info_data'>{{orderInfo.orderDetail.orderNo}}</view>
|
|
|
+ </view>
|
|
|
+ <view class='li_box' v-if="orderInfo.orderDetail.createTime">订单创建：
|
|
|
+ <view class='info_data'>{{orderInfo.orderDetail.createTime}}</view>
|
|
|
+ </view>
|
|
|
+ <view class='li_box'>支付方式：
|
|
|
+ <view class='info_data'>{{orderInfo.orderDetail.patTypeDesc}}</view>
|
|
|
+ </view>
|
|
|
+ <view class='li_box' v-if="orderInfo.orderDetail.integral">商品合计：
|
|
|
+ <view class='info_data'>{{orderInfo.orderDetail.integral}}</view>
|
|
|
+ </view>
|
|
|
+ <view class='li_box' v-if="orderInfo.orderDetail.orderTypes == 2">批发积分：
|
|
|
+ <view class='info_data'>{{orderInfo.orderDetail.totalPfInt}}</view>
|
|
|
+ </view>
|
|
|
+ <view class='li_box' v-if="orderInfo.orderDetail.orderTypes == 2">茶宝：
|
|
|
+ <view class='info_data'>{{orderInfo.orderDetail.totalTeaInt}}</view>
|
|
|
+ </view>
|
|
|
+ <view class='li_box' v-if="orderInfo.orderDetail.orderTypes == 7">拼团金：
|
|
|
+ <view class='info_data'>{{orderInfo.orderDetail.totalAccountSpell}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="detail_btn-row-box">
|
|
|
+ <view class="detail_btn-row">
|
|
|
+ <block>
|
|
|
+ <view class="btn cancel-btn" @tap="toCancel" v-if="orderInfo.orderDetail.status == 2">取消订单</view>
|
|
|
+ <view class="btn topay-btn" @tap="toPay" v-if="orderInfo.orderDetail.status == 2">立即支付</view>
|
|
|
+ <view class="btn topay-btn" @tap="toTake" v-if="orderInfo.orderDetail.status == 4 || orderInfo.orderDetail.status == 3">确认收货</view>
|
|
|
+ <view class="btn topay-btn" @tap="toCommen" v-if="orderInfo.orderDetail.comType && orderInfo.orderDetail.comType == 1">去评价</view>
|
|
|
+ <block v-if="(orderInfo.orderDetail.status == 3 || orderInfo.orderDetail.status == 4 || orderInfo.orderDetail.status == 5) && orderInfo.returnType == 1 && orderInfo.orderDetail.orderTypes!=2">
|
|
|
+ <view
|
|
|
+ v-if="orderInfo.refundId"
|
|
|
+ class="btn"
|
|
|
+ :class="orderInfo&&orderInfo.refundId ? 'topay-btn':'cancel-btn'"
|
|
|
+ :data-type="orderInfo.type"
|
|
|
+ :data-id="orderInfo.orderDetail.orderDetailId"
|
|
|
+ :data-reid="orderInfo.refundId"
|
|
|
+ @tap="toRefundDetails(orderInfo)"
|
|
|
+ >
|
|
|
+ 退款中
|
|
|
+ </view>
|
|
|
+ <view
|
|
|
+ v-else
|
|
|
+ class="btn"
|
|
|
+ :class="orderInfo&&orderInfo.refundId ? 'topay-btn':'cancel-btn'"
|
|
|
+ :data-type="orderInfo.type"
|
|
|
+ :data-id="orderInfo.orderDetail.orderDetailId"
|
|
|
+ :data-reid="orderInfo.refundId"
|
|
|
+ @tap="toRefund(orderInfo)"
|
|
|
+ >
|
|
|
+ 退货/退款
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
+ </block>
|
|
|
+ <view class="btn cancel-btn" @tap='goBack'>返回</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+var utils = require('../../utils/util.js');
|
|
|
+// import { ReqApi, ToPayOpre } from "../../utils/reqTools.js";
|
|
|
+// var reqApi = new ReqApi();
|
|
|
+// var toPayOpre = new ToPayOpre();
|
|
|
+var app = getApp();
|
|
|
+var appEv = app.$vm.$options;
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ currentTpye: false,
|
|
|
+ dataError: false,
|
|
|
+ orderInfo: {},
|
|
|
+ isTuanIng: false ,// 是否为拼团中订单
|
|
|
+ isweixin:'',
|
|
|
+ goodsNum:'',
|
|
|
+ goodsTotalPrice:'',
|
|
|
+ pt:''
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad: function(e) {
|
|
|
+ if (!e.id) {
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1
|
|
|
+ })
|
|
|
+ uni.showToast({
|
|
|
+ title: '参数错误',
|
|
|
+ image: '/static/static/images/toast_nothing.png',
|
|
|
+ duration: 1200
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.orderId=e.id
|
|
|
+ this.type=e.type
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中…',
|
|
|
+ mask: true
|
|
|
+ });
|
|
|
+ this.loadData();
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ loadData: function() {
|
|
|
+ var orderDetailId = this.orderId, type = this.type;
|
|
|
+ var info = reqApi.goodsOrderDetails({ orderDetailId, type:this.type });
|
|
|
+
|
|
|
+ var that = this;
|
|
|
+ if (info){
|
|
|
+ info.then(res => {
|
|
|
+ uni.hideLoading()
|
|
|
+ if(res.data.status == 200){
|
|
|
+ that.orderInfo = res.data
|
|
|
+ }else{
|
|
|
+ uni.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '网络较慢，请稍后重试',
|
|
|
+ success: function (res) {
|
|
|
+ if (res) {
|
|
|
+ uni.navigateBack({
|
|
|
+ delta:1
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ toRefund() {
|
|
|
+ var id = this.orderId, type = this.type;
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/order-refund/index?id=' + id + '&type=' + type,
|
|
|
+ })
|
|
|
+ },
|
|
|
+ toRefundDetails(e) {
|
|
|
+ var refundId = this.orderInfo.refundId;
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/order-refund-details/index?id=' + refundId,
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 取消订单
|
|
|
+ toCancel() {
|
|
|
+ var orderDetailId = this.orderId, type = this.type;
|
|
|
+ const info = reqApi.cancelOrder({ orderDetailId, type });
|
|
|
+ var that = this;
|
|
|
+ if (info) {
|
|
|
+ info.then(res => {
|
|
|
+ if (res.data.status == 200) {
|
|
|
+ appEv.errTips(res.data.msg || '订单已取消');
|
|
|
+ setTimeout(function () {
|
|
|
+ that.loadData();
|
|
|
+ }, 1200);
|
|
|
+ } else {
|
|
|
+ appEv.errTips(res.data.msg || '取消失败');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 立即支付
|
|
|
+ toPay(e){
|
|
|
+ let data = {
|
|
|
+ orderDetailIds:this.orderId,
|
|
|
+ types:1,
|
|
|
+ price:this.orderInfo.orderDetail.totalWxPrice,
|
|
|
+ account:this.orderInfo.orderDetail.totalAccount,
|
|
|
+ teaIntegral:this.orderInfo.orderDetail.totalTeaInt,
|
|
|
+ pfIntegral:this.orderInfo.orderDetail.totalPfInt,
|
|
|
+ xfIntegral:this.orderInfo.orderDetail.totalXfInt,
|
|
|
+ zfType:this.orderInfo.orderDetail.patType,
|
|
|
+ ojsType:this.orderInfo.orderDetail.ojsType
|
|
|
+ }
|
|
|
+ var info
|
|
|
+ info = reqApi.payOrder(data);
|
|
|
+ var that = this;
|
|
|
+ if (info) {
|
|
|
+ info.then(res => {
|
|
|
+ if (res.data.status == 200) {
|
|
|
+ toPayOpre.toPay(res.data.payParam);
|
|
|
+ } else {
|
|
|
+ appEv.errTips(res.data.msg || '支付失败');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 确认收货
|
|
|
+ toTake() {
|
|
|
+ var orderDetailId = this.orderId;
|
|
|
+ var that = this;
|
|
|
+ uni.showModal({
|
|
|
+ content: '亲，“确定收货”代表着本订单的交付流程已经完成，不再支持任何形式的退换货。？',
|
|
|
+ confirmText: "确认收货",
|
|
|
+ confirmColor: "#fa2f2e",
|
|
|
+ cancelText: "取消",
|
|
|
+ cancelColor: "#bbb",
|
|
|
+ success(res) {
|
|
|
+ if (res.confirm) {
|
|
|
+ const info = reqApi.takeOrder({ orderDetailId:orderDetailId, type:1 });
|
|
|
+ if (info) {
|
|
|
+ info.then(res => {
|
|
|
+ if (res.data.status == 200) {
|
|
|
+ appEv.errTips(res.data.msg);
|
|
|
+ setTimeout(function () {
|
|
|
+ that.loadData();
|
|
|
+ }, 1200);
|
|
|
+ } else {
|
|
|
+ appEv.errTips(res.data.msg || '收货失败');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else if (res.cancel) {
|
|
|
+ // console.log('用户点击取消');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //计时
|
|
|
+ timeChange: function(statusType, finsTime) {
|
|
|
+ var nowTime = utils.unxiNum();
|
|
|
+ finsTime = utils.unxiNum(finsTime);
|
|
|
+ var timeDiffNum = finsTime - nowTime;
|
|
|
+ var that = this,
|
|
|
+ text = '';
|
|
|
+ if (timeDiffNum > 0) {
|
|
|
+ var timer = setInterval(function() {
|
|
|
+ --timeDiffNum;
|
|
|
+ var back_text = utils.changeTimeStamp(timeDiffNum);
|
|
|
+ if (timeDiffNum <= 0 || !back_text) {
|
|
|
+ clearInterval(timer);
|
|
|
+ if (statusType == 0) {
|
|
|
+ text = "订单未在规定时间内付款已自动关闭";
|
|
|
+ that.currentTpye=7
|
|
|
+ that.onShow();
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (statusType == 0) {
|
|
|
+ text = "请于" + back_text + "内付款，超时订单将自动关闭";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ that.timeOver= false//时间是否已结束
|
|
|
+ that.changeTimeTexttext
|
|
|
+ }, 1000);
|
|
|
+ } else {
|
|
|
+ if (statusType == 0) {
|
|
|
+ text = "订单未在规定时间内付款已自动关闭";
|
|
|
+ }
|
|
|
+ that.timeOver=true //时间是否已结束
|
|
|
+ that.changeTimeText=text
|
|
|
+ }
|
|
|
+ },
|
|
|
+ goBack: function() {
|
|
|
+ uni.navigateBack({})
|
|
|
+ },
|
|
|
+ // 跳转商品详情
|
|
|
+ toGoodsDetails(e){
|
|
|
+ var url = '/pages/chengbei-goods-details/index?goods_id=' + e.currentTarget.dataset.id;
|
|
|
+ if (this.orderInfo.orderDetail.assembleType && this.orderInfo.orderDetail.assembleType != 1){
|
|
|
+ // 判断是否为拼团订单
|
|
|
+ url += "&type=TUAN";
|
|
|
+ }
|
|
|
+ uni.navigateTo({
|
|
|
+ url: url
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 跳转拼团分享页面
|
|
|
+ toTuanShare() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/tuan-share-info/index?orderNo=' + this.orderInfo.orderDetail.orderNo
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 跳转物流详情
|
|
|
+ goLogistics(){
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/logistics/index?id=' + this.orderInfo.orderDetail.orderDetaillId
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 去评价
|
|
|
+ toCommen(e) {
|
|
|
+ var id = this.orderId,
|
|
|
+ no = this.orderInfo.orderDetail.orderNo,
|
|
|
+ orderType = this.type;
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/add-goods-commen/index?orderId=' + id + '&orderNo=' + no + '&orderType=' + orderType
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+page {
|
|
|
+ background-color: #f3f5f7;
|
|
|
+}
|
|
|
+
|
|
|
+.r_color {
|
|
|
+ color: #fa2f2e;
|
|
|
+}
|
|
|
+
|
|
|
+.sec-wrap {
|
|
|
+ background-color: #21C792;
|
|
|
+ margin: 2rpx 0 20rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.bottom-fiexd {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+}
|
|
|
+.flex_hvcc{
|
|
|
+ display: flex;
|
|
|
+ display: -webkit-flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+.address-box {
|
|
|
+ width: 100%;
|
|
|
+ margin: -20rpx 0 20rpx;
|
|
|
+ background: #fff url(http://xcx.soowin.com/images/addr-line.png) no-repeat center top;
|
|
|
+ background-size: 100% 4rpx;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.show-address {
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 30rpx 0 80rpx;
|
|
|
+ background: url(http://xcx.soowin.com/images/ico-addr.png) no-repeat 25rpx 30rpx;
|
|
|
+ background-size: 40rpx auto;
|
|
|
+}
|
|
|
+
|
|
|
+.show-address .name-tel {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #000;
|
|
|
+ padding: 30rpx 0 20rpx 0;
|
|
|
+}
|
|
|
+.show-address .name-tel-phone {
|
|
|
+ padding: 30rpx 0;
|
|
|
+}
|
|
|
+
|
|
|
+.show-address .addr-text {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #888;
|
|
|
+ padding-bottom: 34rpx;
|
|
|
+ line-height: 36rpx;
|
|
|
+}
|
|
|
+.show-address .addr-text_lit {
|
|
|
+ padding-bottom: 10rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.sec-wrap .order-status {
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 30rpx;
|
|
|
+ height: 160rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.order-status .icon-box {
|
|
|
+ width: 80rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-right: 26rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.order-status .icon-box .icon {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.order-status .right-text {
|
|
|
+ width: calc(100% - 116rpx);
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.order-status .right-text .status {
|
|
|
+ font-size: 36rpx;
|
|
|
+ color: #fff;
|
|
|
+ padding: 2rpx 0 4rpx;
|
|
|
+ font-weight: 500;
|
|
|
+}
|
|
|
+
|
|
|
+.order-status .right-text .red {
|
|
|
+ color: #fa2f2e;
|
|
|
+}
|
|
|
+
|
|
|
+.order-status .right-text .des {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #fff;
|
|
|
+ padding: 4rpx 0;
|
|
|
+}
|
|
|
+
|
|
|
+.address-sec {
|
|
|
+ width: 720rpx;
|
|
|
+ margin-left: 30rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 30rpx 0;
|
|
|
+}
|
|
|
+
|
|
|
+.address-sec .icon-box {
|
|
|
+ width: 30rpx;
|
|
|
+ align-self: flex-start;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-right: 35rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.address-sec .icon-box .icon {
|
|
|
+ width: 30rpx;
|
|
|
+ height: 30rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.address-sec .right-box {
|
|
|
+ width: 620rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.address-sec .right-box .name-tel {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #000;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.address-sec .right-box .text {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #888;
|
|
|
+ line-height: 36rpx;
|
|
|
+ height: 72rpx;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.wuliu-box {
|
|
|
+ width: 720rpx;
|
|
|
+ margin-left: 30rpx;
|
|
|
+ border-bottom: 1rpx solid #eee;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 30rpx 0;
|
|
|
+}
|
|
|
+
|
|
|
+.wuliu-box .icon-box {
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-right: 31rpx;
|
|
|
+ align-self: flex-start;
|
|
|
+}
|
|
|
+
|
|
|
+.wuliu-box .icon-box .icon {
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.wuliu-box .arrow-right {
|
|
|
+ width: 15rpx;
|
|
|
+ height: 24rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.wuliu-box .arrow-right .arrow {
|
|
|
+ width: 15rpx;
|
|
|
+ height: 24rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.wuliu-box .right-text {
|
|
|
+ width: 575rpx;
|
|
|
+ margin-right: 30rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.wuliu-box .right-text .order-number {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #000;
|
|
|
+ margin-bottom: 14rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.wuliu-box .right-text .wuliu-text, .wuliu-box .right-text .wuliu-date {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #888;
|
|
|
+ line-height: 36rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.goods-list {
|
|
|
+ width: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ margin-bottom:24rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.goods-list .list-title {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #000;
|
|
|
+ padding: 16rpx 24rpx;
|
|
|
+}
|
|
|
+.avaImgs{
|
|
|
+ width: 50rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ border-radius: 50%;
|
|
|
+ background-color: #f3f5f7;
|
|
|
+ margin-right: 20rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.goods-info_box{
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ border-top: 2rpx solid #eee;
|
|
|
+}
|
|
|
+.goods-img-container {
|
|
|
+ overflow: hidden;
|
|
|
+ padding: 30rpx;
|
|
|
+ margin-bottom: 2rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.goods-info .goods-des {
|
|
|
+ width: 540rpx;
|
|
|
+ height: 78rpx;
|
|
|
+ line-height: 39rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #000;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.goods-img-container .img-box {
|
|
|
+ width: 170rpx;
|
|
|
+ height: 118.56rpx;
|
|
|
+ background-color: #f7f7f7;
|
|
|
+ overflow: hidden;
|
|
|
+ float: left;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-box-align: center;
|
|
|
+ -webkit-box-pack: center;
|
|
|
+}
|
|
|
+.goodsDetail_info{
|
|
|
+ overflow: hidden;
|
|
|
+ float: right;
|
|
|
+ width: calc(100% - 194rpx);
|
|
|
+ line-height: 1.5;
|
|
|
+ position: relative;
|
|
|
+ height: 118rpx;
|
|
|
+}
|
|
|
+.goodsDetail_info .goods_name{
|
|
|
+ padding-right: 66rpx;
|
|
|
+ position: relative;
|
|
|
+ font-size: 26rpx;
|
|
|
+ margin-bottom: 6rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ -webkit-line-clamp: 2;
|
|
|
+}
|
|
|
+.goodsDetail_info .goods_name .goods_num{
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #666;
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+}
|
|
|
+.goodsDetail_info .unimport{
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
+.goodsDetail_info .goods_price{
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ font-size: 28rpx;
|
|
|
+ line-height: 1.2;
|
|
|
+ font-weight:600;
|
|
|
+}
|
|
|
+.goods-img-container .img-box .goods-img {
|
|
|
+ width: 100%;
|
|
|
+ display: block;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.peisong-way {
|
|
|
+ width: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.peisong-way .row-box {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 24rpx 30rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ line-height: 1.6;
|
|
|
+}
|
|
|
+
|
|
|
+.goods-info {
|
|
|
+ width: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.goods-info .row-box {
|
|
|
+ width: calc(100% - 30rpx);
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ /* align-items: center; */
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 30rpx 30rpx 30rpx 0;
|
|
|
+ margin-left: 30rpx;
|
|
|
+ border-bottom: 1px solid #f5f5f5;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #000;
|
|
|
+}
|
|
|
+.goods-info .row-box .row-label {
|
|
|
+ width: calc(100% - 140rpx);
|
|
|
+}
|
|
|
+
|
|
|
+.goods-info .row-box .right-text {
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+
|
|
|
+.goods-info .row-box .right-text.r_color{
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.order_info{
|
|
|
+ width: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 16rpx 30rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.order_info .li_box{
|
|
|
+ line-height: 1.6;
|
|
|
+ padding: 10rpx 0;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
+
|
|
|
+.order_info .li_box .info_data{
|
|
|
+ display: inline-block;
|
|
|
+ color: #000;
|
|
|
+}
|
|
|
+
|
|
|
+.jiesuan-box {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ width: 100%;
|
|
|
+ height: 100rpx;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ border-top: 1px solid #eee;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.jiesuan-box .to-pay-btn {
|
|
|
+ width: 250rpx;
|
|
|
+ text-align: center;
|
|
|
+ height: 100%;
|
|
|
+ line-height: 100rpx;
|
|
|
+ background-color: #fa2f2e;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #fff;
|
|
|
+ border-radius: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.jiesuan-box .left-price {
|
|
|
+ display: flex;
|
|
|
+ width: 500rpx;
|
|
|
+ justify-content: flex-start;
|
|
|
+ line-height: 100rpx;
|
|
|
+ padding: 0 30rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.jiesuan-box .total {
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+
|
|
|
+.jiesuan-box .total .total_price {
|
|
|
+ color: #fa2f2e;
|
|
|
+ font-weight: 600;
|
|
|
+ display: inline-flex;
|
|
|
+}
|
|
|
+
|
|
|
+.logistics_btn{
|
|
|
+ padding: 24rpx 24rpx 24rpx 30rpx;
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ box-sizing: border-box;
|
|
|
+ font-size: 26rpx;
|
|
|
+ line-height: 1.6;
|
|
|
+ background-color: #fff;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+}
|
|
|
+.l_box{
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow: hidden;
|
|
|
+ padding: 0 28rpx 0 64rpx;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ /* background: url(http://xcx.soowin.com/images/logis_icon.png) no-repeat left top, url(http://xcx.soowin.com/images/arrow-right.png) no-repeat right center;
|
|
|
+ background-size: 46rpx auto, 16rpx auto; */
|
|
|
+ background: url(http://xcx.soowin.com/images/logis_icon.png) no-repeat left top;
|
|
|
+ background-size: 46rpx auto;
|
|
|
+}
|
|
|
+.detail_btn-row-box{
|
|
|
+ height: 104rpx;
|
|
|
+}
|
|
|
+.detail_btn-row{
|
|
|
+ width: 100%;
|
|
|
+ height: 104rpx;
|
|
|
+ padding: 18rpx 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow: hidden;
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ background: #fff;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ font-size: 26rpx;
|
|
|
+ align-items: center;
|
|
|
+ box-shadow: 0rpx -2rpx 16rpx rgba(0, 0, 0, 0.04);
|
|
|
+}
|
|
|
+.detail_btn-row .btn{
|
|
|
+ box-sizing: border-box;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 6rpx;
|
|
|
+ margin-left: 20rpx;
|
|
|
+ border: 1rpx solid #ccc;
|
|
|
+ padding: 16rpx 24rpx;
|
|
|
+}
|
|
|
+.detail_btn-row .topay-btn{
|
|
|
+ border-color: #E05F0B;
|
|
|
+ background-color: #E05F0B;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+.footerMargin{
|
|
|
+ margin-bottom: 104rpx;
|
|
|
+}
|
|
|
+
|
|
|
+// 备注
|
|
|
+.remark{width: 100%;overflow: hidden;background: #fff;padding: 30rpx; box-sizing: border-box;margin-top: 3rpx;}
|
|
|
+// 备注-end
|
|
|
+</style>
|
hejie