|
|
@@ -1,5 +1,5 @@
|
|
|
<script>
|
|
|
-import {getPointOrderInfo} from '@/api/pointOrder'
|
|
|
+import { getPointOrderInfo } from '@/api/pointOrder'
|
|
|
export default {
|
|
|
name: "orderDetails",
|
|
|
data() {
|
|
|
@@ -30,9 +30,9 @@ export default {
|
|
|
},
|
|
|
// 设备信息
|
|
|
deviceInfo: uni.getSystemInfoSync(),
|
|
|
- show:false,
|
|
|
- title:'',
|
|
|
- content:'',
|
|
|
+ show: false,
|
|
|
+ title: '',
|
|
|
+ content: '',
|
|
|
// 物流单号弹窗
|
|
|
showLogistics: false,
|
|
|
logisticsNumber: '',
|
|
|
@@ -64,9 +64,9 @@ export default {
|
|
|
orderNo: this.orderNo,
|
|
|
openId: uni.getStorageSync('wx_copenid')
|
|
|
})
|
|
|
- this.orderInfo = res.data.data;
|
|
|
+ this.orderInfo = res.data.data.orderInfo;
|
|
|
},
|
|
|
- orderTitle(info){
|
|
|
+ orderTitle(info) {
|
|
|
return info.orderStatusName || '--'
|
|
|
},
|
|
|
// 处理退货操作
|
|
|
@@ -103,27 +103,19 @@ export default {
|
|
|
afterSalesType: this.afterSalesType
|
|
|
});
|
|
|
// 这里可以调用售后API
|
|
|
- this.afterSalesShow = false;
|
|
|
-
|
|
|
- let receivedStatus
|
|
|
- let tab
|
|
|
- if (this.receiptStatus == 'notReceived') {
|
|
|
- receivedStatus = 1
|
|
|
- tab = 1
|
|
|
- } else if (this.receiptStatus == "received" && this.afterSalesType == "refund") {
|
|
|
- receivedStatus = 2
|
|
|
- tab = 1
|
|
|
- } else if (this.receiptStatus == "received" && this.afterSalesType == "exchange") {
|
|
|
+
|
|
|
+ //订单状态(0:待付款 1:待发货 2:待收货 3:已收货 4:售后中 11:取消订单)
|
|
|
+
|
|
|
+ if (this.orderInfo.orderStatus == 1 || this.orderInfo.orderStatus == 2) {
|
|
|
uni.navigateTo({
|
|
|
- url: `/points/productDetails/applyExchange?orderNo=${this.orderInfo.orderNo}&orderId=${this.orderInfo.id}`
|
|
|
+ url: `/points/productDetails/applyRefund?orderNo=${this.orderInfo.orderNo}&orderId=${this.orderInfo.id}&orderStatus=${this.orderInfo.orderStatus}`
|
|
|
+ });
|
|
|
+ } else if (this.orderInfo.orderStatus == 3) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/points/productDetails/applyExchange?orderNo=${this.orderInfo.orderNo}&orderId=${this.orderInfo.id}&orderStatus=${this.orderInfo.orderStatus}`
|
|
|
});
|
|
|
- return
|
|
|
}
|
|
|
- //receivedStatus 1 未收到,申请退款;2.已收到货,申请退款 3.已收货-换货申请
|
|
|
- //tab 1 退款 2 换货
|
|
|
- uni.navigateTo({
|
|
|
- url: `/points/productDetails/applyRefund?receivedStatus=${receivedStatus}&tab=${tab}&orderNo=${this.orderInfo.orderNo}&orderId=${this.orderInfo.id}`
|
|
|
- });
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -137,15 +129,16 @@ export default {
|
|
|
</view>
|
|
|
<!-- 商品信息 -->
|
|
|
<view class="product-info">
|
|
|
-<!-- <view class="product-image">-->
|
|
|
-<!-- <image :src="orderInfo.image" mode="aspectFill"></image>-->
|
|
|
-<!-- </view>-->
|
|
|
+ <!-- <view class="product-image">-->
|
|
|
+ <!-- <image :src="orderInfo.image" mode="aspectFill"></image>-->
|
|
|
+ <!-- </view>-->
|
|
|
<view class="product-details">
|
|
|
<text class="product-name">{{ orderInfo.name }}</text>
|
|
|
<text class="product-spec">已选 {{ orderInfo.spec }}</text>
|
|
|
<text class="product-price" v-if="orderInfo.paymentType == 1">{{ orderInfo.pointsUsed }}积分</text>
|
|
|
<text class="product-price" v-if="orderInfo.paymentType == 2">¥{{ orderInfo.totalAmount }}</text>
|
|
|
- <text class="product-price" v-if="orderInfo.paymentType == 3">¥{{ orderInfo.totalAmount }}+{{ orderInfo.pointsUsed }}积分</text>
|
|
|
+ <text class="product-price" v-if="orderInfo.paymentType == 3">¥{{ orderInfo.totalAmount }}+{{
|
|
|
+ orderInfo.pointsUsed }}积分</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
@@ -157,41 +150,41 @@ export default {
|
|
|
</view>
|
|
|
<view class="info-item">
|
|
|
<text class="info-label">发货时间</text>
|
|
|
- <text class="info-value">{{ orderInfo.deliveryTime || '--' }}</text>
|
|
|
+ <text class="info-value">{{ orderInfo.deliveryTime || '--' }}</text>
|
|
|
</view>
|
|
|
<view class="info-item">
|
|
|
<text class="info-label">订单号</text>
|
|
|
- <text class="info-value">{{ orderInfo.orderNo || '--' }}</text>
|
|
|
+ <text class="info-value">{{ orderInfo.orderNo || '--' }}</text>
|
|
|
</view>
|
|
|
<view class="info-item">
|
|
|
<text class="info-label">物流单号</text>
|
|
|
- <text class="info-value">{{ orderInfo.logisticsNo || '--' }}</text>
|
|
|
+ <text class="info-value">{{ orderInfo.logisticsNo || '--' }}</text>
|
|
|
</view>
|
|
|
<view class="info-item">
|
|
|
<text class="info-label">收件人</text>
|
|
|
- <text class="info-value">{{ orderInfo.receiverName || '--' }}</text>
|
|
|
+ <text class="info-value">{{ orderInfo.receiverName || '--' }}</text>
|
|
|
</view>
|
|
|
<view class="info-item">
|
|
|
<text class="info-label">联系电话</text>
|
|
|
- <text class="info-value">{{ orderInfo.receiverPhone || '--' }}</text>
|
|
|
+ <text class="info-value">{{ orderInfo.receiverPhone || '--' }}</text>
|
|
|
</view>
|
|
|
<view class="info-item">
|
|
|
<text class="info-label">收件地址</text>
|
|
|
- <text class="info-value">{{ orderInfo.addressName || '--' }}</text>
|
|
|
+ <text class="info-value">{{ orderInfo.addressName || '--' }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<!-- 退货信息 -->
|
|
|
-<!-- <view class="refund-info">-->
|
|
|
-<!-- <view class="info-item">-->
|
|
|
-<!-- <text class="info-label">退货原因</text>-->
|
|
|
-<!-- <text class="info-value">{{ orderInfo.refund.reason }}</text>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- <view class="info-item">-->
|
|
|
-<!-- <text class="info-label">申请时间</text>-->
|
|
|
-<!-- <text class="info-value">{{ orderInfo.refund.applyTime }}</text>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- </view>-->
|
|
|
+ <!-- <view class="refund-info">-->
|
|
|
+ <!-- <view class="info-item">-->
|
|
|
+ <!-- <text class="info-label">退货原因</text>-->
|
|
|
+ <!-- <text class="info-value">{{ orderInfo.refund.reason }}</text>-->
|
|
|
+ <!-- </view>-->
|
|
|
+ <!-- <view class="info-item">-->
|
|
|
+ <!-- <text class="info-label">申请时间</text>-->
|
|
|
+ <!-- <text class="info-value">{{ orderInfo.refund.applyTime }}</text>-->
|
|
|
+ <!-- </view>-->
|
|
|
+ <!-- </view>-->
|
|
|
|
|
|
<!-- 操作按钮 -->
|
|
|
<view class="action-buttons" :class="{ 'safe-area': hasSafeArea }">
|
|
|
@@ -201,16 +194,16 @@ export default {
|
|
|
</view>
|
|
|
<!-- 弹出层 -->
|
|
|
<u-modal :show="show" :title="title" :content='content' :show-cancel="false">
|
|
|
- <view slot="default" class="modal-content">
|
|
|
- <text class="modal-text">为了保障您的权益,请收到商品确认无误后再确认收货</text>
|
|
|
- </view>
|
|
|
- <view slot="confirmButton" class="modal-footer">
|
|
|
- <button class="modal-cancel" @click="show = false">取消</button>
|
|
|
- <button class="modal-confirm" @click="confirmReceive">确认收货</button>
|
|
|
- </view>
|
|
|
+ <view slot="default" class="modal-content">
|
|
|
+ <text class="modal-text">为了保障您的权益,请收到商品确认无误后再确认收货</text>
|
|
|
+ </view>
|
|
|
+ <view slot="confirmButton" class="modal-footer">
|
|
|
+ <button class="modal-cancel" @click="show = false">取消</button>
|
|
|
+ <button class="modal-confirm" @click="confirmReceive">确认收货</button>
|
|
|
+ </view>
|
|
|
</u-modal>
|
|
|
<!-- 填写物流单号 -->
|
|
|
- <u-popup :show="showLogistics" mode="bottom" @close="showLogistics = false" round="20rpx">
|
|
|
+ <u-popup :show="showLogistics" mode="bottom" @close="showLogistics = false" round="20rpx">
|
|
|
<view class="logistics-popup">
|
|
|
<!-- 标题 -->
|
|
|
<view class="popup-header">
|
|
|
@@ -220,12 +213,8 @@ export default {
|
|
|
|
|
|
<!-- 输入框 -->
|
|
|
<view class="popup-content">
|
|
|
- <u--textarea v-model="logisticsNumber"
|
|
|
- placeholder="请输入物流单号"
|
|
|
- border="surround"
|
|
|
- :border-radius="10"
|
|
|
- class="logistics-input"
|
|
|
- ></u--textarea>
|
|
|
+ <u--textarea v-model="logisticsNumber" placeholder="请输入物流单号" border="surround" :border-radius="10"
|
|
|
+ class="logistics-input"></u--textarea>
|
|
|
</view>
|
|
|
|
|
|
<!-- 提交按钮 -->
|
|
|
@@ -235,7 +224,7 @@ export default {
|
|
|
</view>
|
|
|
</u-popup>
|
|
|
<!-- 售后 -->
|
|
|
- <u-popup :show="afterSalesShow" mode="bottom" @close="afterSalesShow = false" round="20rpx">
|
|
|
+ <u-popup :show="afterSalesShow" mode="bottom" @close="afterSalesShow = false" round="20rpx">
|
|
|
<view class="after-sales-popup">
|
|
|
<!-- 标题 -->
|
|
|
<view class="popup-header">
|
|
|
@@ -247,16 +236,10 @@ export default {
|
|
|
<view class="popup-section">
|
|
|
<text class="section-title">请选择收货状态</text>
|
|
|
<view class="option-group">
|
|
|
- <button
|
|
|
- class="option-button"
|
|
|
- :class="{ active: receiptStatus === 'notReceived' }"
|
|
|
- @click="receiptStatus = 'notReceived'"
|
|
|
- >未收到货</button>
|
|
|
- <button
|
|
|
- class="option-button"
|
|
|
- :class="{ active: receiptStatus === 'received' }"
|
|
|
- @click="receiptStatus = 'received'"
|
|
|
- >已收到货</button>
|
|
|
+ <button class="option-button" :class="{ active: receiptStatus === 'notReceived' }"
|
|
|
+ @click="receiptStatus = 'notReceived'">未收到货</button>
|
|
|
+ <button class="option-button" :class="{ active: receiptStatus === 'received' }"
|
|
|
+ @click="receiptStatus = 'received'">已收到货</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
@@ -264,35 +247,29 @@ export default {
|
|
|
<view class="popup-section" v-if="receiptStatus === 'received'">
|
|
|
<text class="section-title">请选择售后类型</text>
|
|
|
<view class="option-group">
|
|
|
- <button
|
|
|
- class="option-button"
|
|
|
- :class="{ active: afterSalesType === 'refund' }"
|
|
|
- @click="afterSalesType = 'refund'"
|
|
|
- >退货</button>
|
|
|
- <button
|
|
|
- class="option-button"
|
|
|
- :class="{ active: afterSalesType === 'exchange' }"
|
|
|
- @click="afterSalesType = 'exchange'"
|
|
|
- >换货</button>
|
|
|
+ <button class="option-button" :class="{ active: afterSalesType === 'refund' }"
|
|
|
+ @click="afterSalesType = 'refund'">退货</button>
|
|
|
+ <button class="option-button" :class="{ active: afterSalesType === 'exchange' }"
|
|
|
+ @click="afterSalesType = 'exchange'">换货</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<!-- 商品选择 -->
|
|
|
-<!-- <view class="popup-section">-->
|
|
|
-<!-- <text class="section-title">-->
|
|
|
-<!-- 请选择商品-->
|
|
|
-<!-- <text v-if="receiptStatus === 'received'" class="time-limit">(2026-4-1 24时之前可申请)</text>-->
|
|
|
-<!-- </text>-->
|
|
|
-<!-- <view class="product-item">-->
|
|
|
-<!-- <view class="product-image">-->
|
|
|
-<!-- <image :src="orderInfo.product.image" mode="aspectFill"></image>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- <view class="product-details">-->
|
|
|
-<!-- <text class="product-name">{{ orderInfo.product.name }}</text>-->
|
|
|
-<!-- <text class="product-spec">已选: {{ orderInfo.product.spec }}</text>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- </view>-->
|
|
|
+ <!-- <view class="popup-section">-->
|
|
|
+ <!-- <text class="section-title">-->
|
|
|
+ <!-- 请选择商品-->
|
|
|
+ <!-- <text v-if="receiptStatus === 'received'" class="time-limit">(2026-4-1 24时之前可申请)</text>-->
|
|
|
+ <!-- </text>-->
|
|
|
+ <!-- <view class="product-item">-->
|
|
|
+ <!-- <view class="product-image">-->
|
|
|
+ <!-- <image :src="orderInfo.product.image" mode="aspectFill"></image>-->
|
|
|
+ <!-- </view>-->
|
|
|
+ <!-- <view class="product-details">-->
|
|
|
+ <!-- <text class="product-name">{{ orderInfo.product.name }}</text>-->
|
|
|
+ <!-- <text class="product-spec">已选: {{ orderInfo.product.spec }}</text>-->
|
|
|
+ <!-- </view>-->
|
|
|
+ <!-- </view>-->
|
|
|
+ <!-- </view>-->
|
|
|
|
|
|
<!-- 下一步按钮 -->
|
|
|
<view class="popup-footer">
|
|
|
@@ -304,7 +281,7 @@ export default {
|
|
|
</template>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
-.order-details{
|
|
|
+.order-details {
|
|
|
width: 750rpx;
|
|
|
min-height: 100vh;
|
|
|
background-image: url("@/static/points/orderBg.png");
|
|
|
@@ -312,8 +289,9 @@ export default {
|
|
|
background-repeat: no-repeat;
|
|
|
background-color: #F5F8F8;
|
|
|
padding-top: 54rpx;
|
|
|
- ::v-deep .u-modal{
|
|
|
- .u-modal__title{
|
|
|
+
|
|
|
+ ::v-deep .u-modal {
|
|
|
+ .u-modal__title {
|
|
|
background: #E8FFFD;
|
|
|
height: 92rpx;
|
|
|
padding: 0;
|
|
|
@@ -323,16 +301,19 @@ export default {
|
|
|
color: #000000;
|
|
|
line-height: 92rpx;
|
|
|
}
|
|
|
- .u-modal__content,.u-modal__button-group--confirm-button{
|
|
|
+
|
|
|
+ .u-modal__content,
|
|
|
+ .u-modal__button-group--confirm-button {
|
|
|
padding: 0;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// 模态框样式
|
|
|
- .modal-content{
|
|
|
+ .modal-content {
|
|
|
padding: 40rpx 32rpx;
|
|
|
text-align: center;
|
|
|
- .modal-text{
|
|
|
+
|
|
|
+ .modal-text {
|
|
|
font-family: PingFang SC, PingFang SC;
|
|
|
font-weight: 500;
|
|
|
font-size: 28rpx;
|
|
|
@@ -340,12 +321,14 @@ export default {
|
|
|
line-height: 39rpx;
|
|
|
}
|
|
|
}
|
|
|
- .modal-footer{
|
|
|
+
|
|
|
+ .modal-footer {
|
|
|
border-top: 1rpx solid #EEEEEE;
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
padding: 24rpx 58rpx;
|
|
|
- button{
|
|
|
+
|
|
|
+ button {
|
|
|
width: 225rpx;
|
|
|
height: 68rpx;
|
|
|
border-radius: 60rpx;
|
|
|
@@ -355,20 +338,24 @@ export default {
|
|
|
margin: 0 20rpx;
|
|
|
padding: 0;
|
|
|
}
|
|
|
- .modal-cancel{
|
|
|
+
|
|
|
+ .modal-cancel {
|
|
|
border: 1rpx solid #999999;
|
|
|
color: #333333;
|
|
|
}
|
|
|
- .modal-confirm{
|
|
|
- background: linear-gradient( 78deg, #1AD8CF 0%, #21C8C0 100%);
|
|
|
+
|
|
|
+ .modal-confirm {
|
|
|
+ background: linear-gradient(78deg, #1AD8CF 0%, #21C8C0 100%);
|
|
|
color: #FFFFFF;
|
|
|
}
|
|
|
}
|
|
|
- .header{
|
|
|
+
|
|
|
+ .header {
|
|
|
width: 100%;
|
|
|
margin-bottom: 38rpx;
|
|
|
text-align: center;
|
|
|
- .header-title{
|
|
|
+
|
|
|
+ .header-title {
|
|
|
font-family: PingFang SC, PingFang SC;
|
|
|
font-weight: 500;
|
|
|
font-size: 36rpx;
|
|
|
@@ -376,7 +363,8 @@ export default {
|
|
|
line-height: 40rpx;
|
|
|
}
|
|
|
}
|
|
|
- .product-info{
|
|
|
+
|
|
|
+ .product-info {
|
|
|
width: 686rpx;
|
|
|
height: 168rpx;
|
|
|
background: #FFFFFF;
|
|
|
@@ -384,18 +372,22 @@ export default {
|
|
|
margin: 0 auto 24rpx;
|
|
|
padding: 24rpx;
|
|
|
display: flex;
|
|
|
- .product-image{
|
|
|
+
|
|
|
+ .product-image {
|
|
|
width: 120rpx;
|
|
|
height: 120rpx;
|
|
|
margin-right: 24rpx;
|
|
|
- image{
|
|
|
+
|
|
|
+ image {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
}
|
|
|
}
|
|
|
- .product-details{
|
|
|
+
|
|
|
+ .product-details {
|
|
|
flex: 1;
|
|
|
- .product-name{
|
|
|
+
|
|
|
+ .product-name {
|
|
|
font-family: PingFang SC, PingFang SC;
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
@@ -404,7 +396,8 @@ export default {
|
|
|
margin-bottom: 24rpx;
|
|
|
display: block;
|
|
|
}
|
|
|
- .product-spec{
|
|
|
+
|
|
|
+ .product-spec {
|
|
|
font-family: PingFang SC, PingFang SC;
|
|
|
font-size: 26rpx;
|
|
|
line-height: 26rpx;
|
|
|
@@ -412,7 +405,8 @@ export default {
|
|
|
margin-bottom: 2rpx;
|
|
|
display: block;
|
|
|
}
|
|
|
- .product-price{
|
|
|
+
|
|
|
+ .product-price {
|
|
|
font-family: PingFang SC, PingFang SC;
|
|
|
font-weight: bold;
|
|
|
line-height: 26rpx;
|
|
|
@@ -421,28 +415,33 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.order-info,
|
|
|
- .refund-info{
|
|
|
+ .refund-info {
|
|
|
width: 686rpx;
|
|
|
background-color: #FFFFFF;
|
|
|
border-radius: 16rpx;
|
|
|
margin: 0 auto 24rpx;
|
|
|
padding: 26rpx 24rpx;
|
|
|
- .info-item{
|
|
|
+
|
|
|
+ .info-item {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: flex-start;
|
|
|
margin-bottom: 22rpx;
|
|
|
- &:last-child{
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
margin-bottom: 0;
|
|
|
}
|
|
|
- .info-label{
|
|
|
+
|
|
|
+ .info-label {
|
|
|
font-family: PingFang SC, PingFang SC;
|
|
|
font-weight: 400;
|
|
|
font-size: 26rpx;
|
|
|
color: #666666;
|
|
|
}
|
|
|
- .info-value{
|
|
|
+
|
|
|
+ .info-value {
|
|
|
flex: 1;
|
|
|
font-family: PingFang SC, PingFang SC;
|
|
|
font-weight: 400;
|
|
|
@@ -452,7 +451,8 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .action-buttons{
|
|
|
+
|
|
|
+ .action-buttons {
|
|
|
width: 750rpx;
|
|
|
background: #FFFFFF;
|
|
|
position: fixed;
|
|
|
@@ -464,11 +464,13 @@ export default {
|
|
|
// 正常手机的高度
|
|
|
height: auto;
|
|
|
min-height: 100rpx;
|
|
|
+
|
|
|
// 有安全区域的设备的高度
|
|
|
&.safe-area {
|
|
|
height: 164rpx;
|
|
|
}
|
|
|
- .detail-button{
|
|
|
+
|
|
|
+ .detail-button {
|
|
|
padding: 0 30rpx;
|
|
|
height: 56rpx;
|
|
|
border-radius: 98rpx;
|
|
|
@@ -479,7 +481,8 @@ export default {
|
|
|
border: 2rpx solid #999999;
|
|
|
margin: 0;
|
|
|
}
|
|
|
- .action-button{
|
|
|
+
|
|
|
+ .action-button {
|
|
|
padding: 0 30rpx;
|
|
|
height: 56rpx;
|
|
|
background: #03C1B8;
|
|
|
@@ -493,18 +496,19 @@ export default {
|
|
|
}
|
|
|
|
|
|
// 物流单号弹出框样式
|
|
|
- .logistics-popup{
|
|
|
+ .logistics-popup {
|
|
|
width: 100%;
|
|
|
padding: 40rpx;
|
|
|
background: #F5F8F8;
|
|
|
border-radius: 32rpx 32rpx 0 0;
|
|
|
|
|
|
- .popup-header{
|
|
|
+ .popup-header {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
margin-bottom: 32rpx;
|
|
|
- .popup-title{
|
|
|
+
|
|
|
+ .popup-title {
|
|
|
font-size: 40rpx;
|
|
|
font-weight: bold;
|
|
|
color: #333333;
|
|
|
@@ -512,15 +516,17 @@ export default {
|
|
|
background-repeat: no-repeat;
|
|
|
background-position: 20rpx 40rpx;
|
|
|
}
|
|
|
- .popup-close{
|
|
|
+
|
|
|
+ .popup-close {
|
|
|
font-size: 28rpx;
|
|
|
color: #999999;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .popup-content{
|
|
|
+ .popup-content {
|
|
|
margin-bottom: 32rpx;
|
|
|
- .logistics-input{
|
|
|
+
|
|
|
+ .logistics-input {
|
|
|
width: 100%;
|
|
|
height: 180rpx;
|
|
|
padding: 20rpx;
|
|
|
@@ -531,11 +537,11 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .popup-footer{
|
|
|
- .submit-button{
|
|
|
+ .popup-footer {
|
|
|
+ .submit-button {
|
|
|
width: 100%;
|
|
|
height: 80rpx;
|
|
|
- background: linear-gradient( 78deg, #1AD8CF 0%, #21C8C0 100%);
|
|
|
+ background: linear-gradient(78deg, #1AD8CF 0%, #21C8C0 100%);
|
|
|
border-radius: 40rpx;
|
|
|
font-size: 32rpx;
|
|
|
color: #FFFFFF;
|
|
|
@@ -548,55 +554,60 @@ export default {
|
|
|
}
|
|
|
|
|
|
// 售后弹出框样式
|
|
|
- .after-sales-popup{
|
|
|
+ .after-sales-popup {
|
|
|
width: 100%;
|
|
|
background: #F8F8F8;
|
|
|
border-radius: 32rpx 32rpx 0 0;
|
|
|
|
|
|
- .popup-header{
|
|
|
+ .popup-header {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
height: 92rpx;
|
|
|
padding: 0 32rpx;
|
|
|
- .popup-title{
|
|
|
+
|
|
|
+ .popup-title {
|
|
|
width: 100%;
|
|
|
text-align: center;
|
|
|
font-size: 32rpx;
|
|
|
font-weight: bold;
|
|
|
color: #333333;
|
|
|
}
|
|
|
- .popup-close{
|
|
|
+
|
|
|
+ .popup-close {
|
|
|
font-size: 32rpx;
|
|
|
color: #999999;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .popup-section{
|
|
|
+ .popup-section {
|
|
|
width: 686rpx;
|
|
|
min-height: 202rpx;
|
|
|
background: #FFFFFF;
|
|
|
border-radius: 16rpx;
|
|
|
margin: 0 auto 24rpx;
|
|
|
padding: 24rpx;
|
|
|
- .section-title{
|
|
|
+
|
|
|
+ .section-title {
|
|
|
font-family: PingFang SC, PingFang SC;
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
color: #333333;
|
|
|
display: block;
|
|
|
margin-bottom: 24rpx;
|
|
|
- .time-limit{
|
|
|
+
|
|
|
+ .time-limit {
|
|
|
font-size: 24rpx;
|
|
|
color: #f53e54;
|
|
|
font-weight: normal;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .option-group{
|
|
|
+ .option-group {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
- .option-button{
|
|
|
+
|
|
|
+ .option-button {
|
|
|
flex: 1;
|
|
|
height: 72rpx;
|
|
|
border-radius: 38rpx;
|
|
|
@@ -608,7 +619,8 @@ export default {
|
|
|
line-height: 72rpx;
|
|
|
margin: 0 10rpx;
|
|
|
padding: 0;
|
|
|
- &.active{
|
|
|
+
|
|
|
+ &.active {
|
|
|
background: #1AD8CF;
|
|
|
border-color: #1AD8CF;
|
|
|
color: #FFFFFF;
|
|
|
@@ -616,30 +628,35 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .product-item{
|
|
|
+ .product-item {
|
|
|
display: flex;
|
|
|
padding: 20rpx;
|
|
|
background-color: #F5F8F8;
|
|
|
border-radius: 10rpx;
|
|
|
- .product-image{
|
|
|
+
|
|
|
+ .product-image {
|
|
|
width: 100rpx;
|
|
|
height: 100rpx;
|
|
|
margin-right: 20rpx;
|
|
|
- image{
|
|
|
+
|
|
|
+ image {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
border-radius: 10rpx;
|
|
|
}
|
|
|
}
|
|
|
- .product-details{
|
|
|
+
|
|
|
+ .product-details {
|
|
|
flex: 1;
|
|
|
- .product-name{
|
|
|
+
|
|
|
+ .product-name {
|
|
|
font-size: 28rpx;
|
|
|
color: #333333;
|
|
|
margin-bottom: 10rpx;
|
|
|
display: block;
|
|
|
}
|
|
|
- .product-spec{
|
|
|
+
|
|
|
+ .product-spec {
|
|
|
font-size: 24rpx;
|
|
|
color: #999999;
|
|
|
display: block;
|
|
|
@@ -648,15 +665,16 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .popup-footer{
|
|
|
+ .popup-footer {
|
|
|
width: 750rpx;
|
|
|
height: 124rpx;
|
|
|
background: #FFFFFF;
|
|
|
padding: 20rpx 40rpx;
|
|
|
- .next-button{
|
|
|
+
|
|
|
+ .next-button {
|
|
|
width: 100%;
|
|
|
height: 80rpx;
|
|
|
- background: linear-gradient( 78deg, #1AD8CF 0%, #21C8C0 100%);
|
|
|
+ background: linear-gradient(78deg, #1AD8CF 0%, #21C8C0 100%);
|
|
|
border-radius: 40rpx;
|
|
|
font-size: 32rpx;
|
|
|
color: #FFFFFF;
|