style:修改订单详情页订单支付方式展示效果
This commit is contained in:
File diff suppressed because one or more lines are too long
+5
@@ -39,5 +39,10 @@
|
||||
}
|
||||
]
|
||||
},
|
||||
"permission": {
|
||||
"scope.getPhoneNumber": {
|
||||
"desc": "您的手机号将用于登录和订单服务"
|
||||
}
|
||||
},
|
||||
"usingComponents": {}
|
||||
}
|
||||
+1
-1
@@ -6990,7 +6990,7 @@ function isConsoleWritable() {
|
||||
function initRuntimeSocketService() {
|
||||
const hosts = "192.168.10.59,127.0.0.1";
|
||||
const port = "8090";
|
||||
const id = "mp-weixin_1_bom0";
|
||||
const id = "mp-weixin_eQjgTz";
|
||||
const lazy = typeof swan !== "undefined";
|
||||
let restoreError = lazy ? () => {
|
||||
} : initOnError();
|
||||
|
||||
+23
-19
@@ -1,5 +1,6 @@
|
||||
"use strict";
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
const common_assets = require("../../common/assets.js");
|
||||
const config_user = require("../../config/user.js");
|
||||
const _sfc_main = {
|
||||
__name: "details",
|
||||
@@ -51,7 +52,7 @@ const _sfc_main = {
|
||||
return "";
|
||||
}
|
||||
});
|
||||
const paymentMethod = common_vendor.computed(() => {
|
||||
common_vendor.computed(() => {
|
||||
const payWay = orderInfo.value.payWay;
|
||||
if (payWay === "wx_score_pay") {
|
||||
return "微信支付分 (免押金)";
|
||||
@@ -192,35 +193,38 @@ const _sfc_main = {
|
||||
c: common_vendor.t(orderStatusDesc.value),
|
||||
d: common_vendor.t(orderInfo.value.orderNo || "-"),
|
||||
e: common_vendor.t(orderInfo.value.deviceNo || "-"),
|
||||
f: common_vendor.t(paymentMethod.value),
|
||||
g: common_vendor.t(orderInfo.value.createTime || "-"),
|
||||
h: common_vendor.t(orderInfo.value.startTime || "-"),
|
||||
i: orderInfo.value.endTime
|
||||
f: orderInfo.value.payWay === "wx_score_pay"
|
||||
}, orderInfo.value.payWay === "wx_score_pay" ? {
|
||||
g: common_assets._imports_0$2
|
||||
} : {}, {
|
||||
h: common_vendor.t(orderInfo.value.createTime || "-"),
|
||||
i: common_vendor.t(orderInfo.value.startTime || "-"),
|
||||
j: orderInfo.value.endTime
|
||||
}, orderInfo.value.endTime ? {
|
||||
j: common_vendor.t(orderInfo.value.endTime)
|
||||
k: common_vendor.t(orderInfo.value.endTime)
|
||||
} : {}, {
|
||||
k: orderInfo.value.phone
|
||||
l: orderInfo.value.phone
|
||||
}, orderInfo.value.phone ? {
|
||||
l: common_vendor.t(orderInfo.value.phone)
|
||||
m: common_vendor.t(orderInfo.value.phone)
|
||||
} : {}, {
|
||||
m: orderInfo.value.depositAmount
|
||||
n: orderInfo.value.depositAmount
|
||||
}, orderInfo.value.depositAmount ? {
|
||||
n: common_vendor.t(orderInfo.value.depositAmount)
|
||||
o: common_vendor.t(orderInfo.value.depositAmount)
|
||||
} : {}, {
|
||||
o: orderInfo.value.packageTime && orderInfo.value.packagePrice
|
||||
p: orderInfo.value.packageTime && orderInfo.value.packagePrice
|
||||
}, orderInfo.value.packageTime && orderInfo.value.packagePrice ? {
|
||||
p: common_vendor.t(orderInfo.value.packagePrice),
|
||||
q: common_vendor.t(formatTime(orderInfo.value.packageTime))
|
||||
q: common_vendor.t(orderInfo.value.packagePrice),
|
||||
r: common_vendor.t(formatTime(orderInfo.value.packageTime))
|
||||
} : {}, {
|
||||
r: common_vendor.t(orderInfo.value.payAmount || 0),
|
||||
s: orderInfo.value.orderStatus === "waiting_for_payment"
|
||||
s: common_vendor.t(orderInfo.value.payAmount || 0),
|
||||
t: orderInfo.value.orderStatus === "waiting_for_payment"
|
||||
}, orderInfo.value.orderStatus === "waiting_for_payment" ? {
|
||||
t: common_vendor.o(handleCancelOrder),
|
||||
v: common_vendor.o(handlePayment)
|
||||
v: common_vendor.o(handleCancelOrder),
|
||||
w: common_vendor.o(handlePayment)
|
||||
} : orderInfo.value.orderStatus === "in_used" ? {
|
||||
x: common_vendor.o(navigateToReturn)
|
||||
y: common_vendor.o(navigateToReturn)
|
||||
} : {}, {
|
||||
w: orderInfo.value.orderStatus === "in_used"
|
||||
x: orderInfo.value.orderStatus === "in_used"
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
+1
-1
@@ -1 +1 @@
|
||||
<view class="details-container data-v-2b5cbeae"><view class="status-card data-v-2b5cbeae"><view class="{{['status-icon', 'data-v-2b5cbeae', a]}}"></view><view class="status-text data-v-2b5cbeae">{{b}}</view><view class="status-desc data-v-2b5cbeae">{{c}}</view></view><view class="info-card data-v-2b5cbeae"><view class="card-title data-v-2b5cbeae">订单信息</view><view class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">订单号</text><text class="value data-v-2b5cbeae">{{d}}</text></view><view class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">设备号</text><text class="value data-v-2b5cbeae">{{e}}</text></view><view class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">支付方式</text><text class="value data-v-2b5cbeae">{{f}}</text></view><view class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">创建时间</text><text class="value data-v-2b5cbeae">{{g}}</text></view><view class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">开始时间</text><text class="value data-v-2b5cbeae">{{h}}</text></view><view wx:if="{{i}}" class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">结束时间</text><text class="value data-v-2b5cbeae">{{j}}</text></view><view wx:if="{{k}}" class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">联系电话</text><text class="value data-v-2b5cbeae">{{l}}</text></view></view><view class="info-card data-v-2b5cbeae"><view class="card-title data-v-2b5cbeae">费用信息</view><view wx:if="{{m}}" class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">押金</text><text class="value data-v-2b5cbeae">¥{{n}}</text></view><view wx:if="{{o}}" class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">套餐</text><text class="value data-v-2b5cbeae">¥{{p}}元 / {{q}}</text></view><view class="info-item total data-v-2b5cbeae"><text class="label data-v-2b5cbeae">合计</text><text class="value data-v-2b5cbeae">¥{{r}}</text></view></view><view wx:if="{{s}}" class="action-buttons data-v-2b5cbeae"><view class="btn cancel data-v-2b5cbeae" bindtap="{{t}}">取消订单</view><view class="btn primary data-v-2b5cbeae" bindtap="{{v}}">立即支付</view></view><view wx:elif="{{w}}" class="action-buttons data-v-2b5cbeae"><view class="btn primary data-v-2b5cbeae" bindtap="{{x}}">归还设备</view></view></view>
|
||||
<view class="details-container data-v-2b5cbeae"><view class="status-card data-v-2b5cbeae"><view class="{{['status-icon', 'data-v-2b5cbeae', a]}}"></view><view class="status-text data-v-2b5cbeae">{{b}}</view><view class="status-desc data-v-2b5cbeae">{{c}}</view></view><view class="info-card data-v-2b5cbeae"><view class="card-title data-v-2b5cbeae">订单信息</view><view class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">订单号</text><text class="value data-v-2b5cbeae">{{d}}</text></view><view class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">设备号</text><text class="value data-v-2b5cbeae">{{e}}</text></view><view class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">租借方式</text><view class="value payment-method data-v-2b5cbeae"><view wx:if="{{f}}" class="payment-badge wx-score data-v-2b5cbeae"><image src="{{g}}" mode="aspectFit" class="badge-icon data-v-2b5cbeae"></image><view class="badge-text data-v-2b5cbeae"><text class="data-v-2b5cbeae">微信支付分</text><text class="divider data-v-2b5cbeae">|</text><text class="highlight data-v-2b5cbeae">免押租借</text></view></view><view wx:else class="payment-badge deposit data-v-2b5cbeae"><text class="badge-text data-v-2b5cbeae">押金租借</text></view></view></view><view class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">创建时间</text><text class="value data-v-2b5cbeae">{{h}}</text></view><view class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">开始时间</text><text class="value data-v-2b5cbeae">{{i}}</text></view><view wx:if="{{j}}" class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">结束时间</text><text class="value data-v-2b5cbeae">{{k}}</text></view><view wx:if="{{l}}" class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">联系电话</text><text class="value data-v-2b5cbeae">{{m}}</text></view></view><view class="info-card data-v-2b5cbeae"><view class="card-title data-v-2b5cbeae">费用信息</view><view wx:if="{{n}}" class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">押金</text><text class="value data-v-2b5cbeae">¥{{o}}</text></view><view wx:if="{{p}}" class="info-item data-v-2b5cbeae"><text class="label data-v-2b5cbeae">套餐</text><text class="value data-v-2b5cbeae">¥{{q}}元 / {{r}}</text></view><view class="info-item total data-v-2b5cbeae"><text class="label data-v-2b5cbeae">合计</text><text class="value data-v-2b5cbeae">¥{{s}}</text></view></view><view wx:if="{{t}}" class="action-buttons data-v-2b5cbeae"><view class="btn cancel data-v-2b5cbeae" bindtap="{{v}}">取消订单</view><view class="btn primary data-v-2b5cbeae" bindtap="{{w}}">立即支付</view></view><view wx:elif="{{x}}" class="action-buttons data-v-2b5cbeae"><view class="btn primary data-v-2b5cbeae" bindtap="{{y}}">归还设备</view></view></view>
|
||||
@@ -115,6 +115,46 @@
|
||||
text-align: right;
|
||||
max-width: 70%;
|
||||
}
|
||||
.details-container .info-card .info-item .value.payment-method.data-v-2b5cbeae {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
}
|
||||
.details-container .info-card .info-item .value.payment-method .payment-badge.data-v-2b5cbeae {
|
||||
margin-top: 8rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 4rpx 10rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
.details-container .info-card .info-item .value.payment-method .payment-badge.wx-score.data-v-2b5cbeae {
|
||||
background: rgba(7, 193, 96, 0.08);
|
||||
}
|
||||
.details-container .info-card .info-item .value.payment-method .payment-badge.wx-score .badge-icon.data-v-2b5cbeae {
|
||||
width: 32rpx;
|
||||
height: 26rpx;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
.details-container .info-card .info-item .value.payment-method .payment-badge.wx-score .badge-text.data-v-2b5cbeae {
|
||||
font-size: 22rpx;
|
||||
color: #07c160;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.details-container .info-card .info-item .value.payment-method .payment-badge.wx-score .badge-text .divider.data-v-2b5cbeae {
|
||||
margin: 0 6rpx;
|
||||
}
|
||||
.details-container .info-card .info-item .value.payment-method .payment-badge.wx-score .badge-text .highlight.data-v-2b5cbeae {
|
||||
font-weight: 500;
|
||||
}
|
||||
.details-container .info-card .info-item .value.payment-method .payment-badge.deposit.data-v-2b5cbeae {
|
||||
background: #f5f5f5;
|
||||
}
|
||||
.details-container .info-card .info-item .value.payment-method .payment-badge.deposit .badge-text.data-v-2b5cbeae {
|
||||
font-size: 22rpx;
|
||||
color: #666;
|
||||
font-weight: 500;
|
||||
}
|
||||
.details-container .info-card .info-item.total.data-v-2b5cbeae {
|
||||
margin-top: 10rpx;
|
||||
padding-top: 30rpx;
|
||||
|
||||
Reference in New Issue
Block a user