+
- {{ order.orderStatusValue }}
{{ order.orderStatusValue }}
+订单号：{{ order.order.sn }}
@@ -23,7 +23,7 @@
"
>
确认收货
核验码：{{ order.order.verificationCode }}
-
+
-
收货人信息
-收货人：{{ order.order.consigneeName }}
-手机号码：{{ $filters.secrecyMobile( order.order.consigneeMobile ) }}
-- 收货地址：{{ $filters.unitAddress(order.order.consigneeAddressPath) }} - {{ order.order.consigneeDetail }} -
+
+ 收货人
+ {{ order.order.consigneeName }}
+
+
+ 手机号码
+ {{ $filters.secrecyMobile( order.order.consigneeMobile ) }}
+
+
+ 收货地址
+
+ {{ $filters.unitAddress(order.order.consigneeAddressPath) }}
+ {{ order.order.consigneeDetail }}
+
+
+
-
自提点信息
-自提点名称：{{ order.order.storeAddressPath }}
-联系方式：{{ order.order.storeAddressMobile }}
+
+ 自提点名称
+ {{ order.order.storeAddressPath }}
+
+
+ 联系方式
+ {{ order.order.storeAddressMobile }}
+
+
-
付款信息
-支付方式：{{ order.paymentMethodValue }}
-付款状态：{{ order.payStatusValue }}
+
+ 支付方式
+ {{ order.paymentMethodValue }}
+
+
+ 付款状态
+ {{ order.payStatusValue }}
+
+
配送信息
-配送方式：{{ displayDeliveryMethodValue }}
-配送状态：{{ order.deliverStatusValue }}
+
+ 配送方式
+ {{ displayDeliveryMethodValue }}
+
+
+ 配送状态
+ {{ order.deliverStatusValue }}
+
- 发货时间：{{ noDeliveryShipTime }}
-配送说明：{{ noDeliveryRemark }}
+
+ 发货时间
+ {{ noDeliveryShipTime }}
+
+
+ 配送说明
+ {{ noDeliveryRemark }}
+
- - 物流信息：{{ logistics.shipper || "暂无物流信息" }} -
-- 物流单号：{{ logistics.logisticCode || "暂无物流单号" }} -
-
-
-
订单日志：
-
- {{ item.AcceptTime }}
- {{ item.AcceptStation }}
+
-
+ 物流信息
+ {{ logistics.shipper || "暂无物流信息" }}
+
+
+ 物流单号
+ {{ logistics.logisticCode || "暂无物流单号" }}
+
+
+ 订单日志
+
+
+
+
+ {{ item.AcceptTime }}
+ {{ item.AcceptStation }}
+
+
+
-
发票信息
-发票类型：{{ formatReceiptType(order.receipt) }}
-发票抬头：{{ formatReceiptHeaderType(order.receipt) }}
-- 个人名称：{{ order.receipt.personalName }} -
-- 单位名称：{{ order.receipt.companyName }} -
-- 纳税人识别号：{{ order.receipt.taxpayerId }} -
-- 单位地址：{{ order.receipt.companyAddress }} -
-- 单位电话：{{ order.receipt.companyPhone }} -
-- 开户银行：{{ order.receipt.bankName }} -
-- 银行账号：{{ order.receipt.bankAccount }} -
-发票内容：{{ order.receipt.receiptContent }}
-- 收票人手机：{{ order.receipt.receiptPhone }} -
-- 收票人邮箱：{{ order.receipt.receiptEmail }} -
+
+ 发票类型
+ {{ formatReceiptType(order.receipt) }}
+
+
+ 发票抬头
+ {{ formatReceiptHeaderType(order.receipt) }}
+
+
+ 个人名称
+ {{ order.receipt.personalName }}
+
+
+ 单位名称
+ {{ order.receipt.companyName }}
+
+
+ 纳税人识别号
+ {{ order.receipt.taxpayerId }}
+
+
+ 单位地址
+ {{ order.receipt.companyAddress }}
+
+
+ 单位电话
+ {{ order.receipt.companyPhone }}
+
+
+ 开户银行
+ {{ order.receipt.bankName }}
+
+
+ 银行账号
+ {{ order.receipt.bankAccount }}
+
+
+ 发票内容
+ {{ order.receipt.receiptContent }}
+
+
+ 收票人手机
+ {{ order.receipt.receiptPhone }}
+
+
+ 收票人邮箱
+ {{ order.receipt.receiptEmail }}
+
-
+
查看发票
- 未开发票
+ 未开发票
+
卡密信息
-
+
-
-
+
{{order.order.storeName}}
- | 商品 | -货号 | -单价 | -数量 | -小计 | -操作 | -
|---|---|---|---|---|---|
|
-
-
- - {{ goods.goodsName }} - - |
- {{ goods.id }} | -{{ $filters.unitPrice(goods.goodsPrice, "￥") }} | -{{ goods.num }} | -{{ $filters.unitPrice((goods.goodsPrice * goods.num), "￥") }} | -
-
- |
-
+
+ ![]()
+
+
+
+ + {{ goods.goodsName }} +
+货号：{{ goods.id }}
+
+
+ {{ $filters.unitPrice(goods.goodsPrice, "￥") }} × {{ goods.num }}
+
+ {{ $filters.unitPrice((goods.goodsPrice * goods.num), "￥") }}
+
+
+
+ 投诉
+ 申请售后
+
+
@@ -488,6 +531,20 @@ const noDeliveryShipTime = computed(() => {
const pkg = noDeliveryPackages.value[0];
return pkg?.logisticsTime || "";
});
+const statusTagType = computed(() => {
+ const map = {
+ UNPAID: "warning",
+ PAID: "warning",
+ UNDELIVERED: "warning",
+ PARTS_DELIVERED: "warning",
+ DELIVERED: "warning",
+ TAKE: "warning",
+ STAY_PICKED_UP: "warning",
+ COMPLETED: "success",
+ CANCELLED: "info",
+ };
+ return map[order.value?.order?.orderStatus] || "info";
+});
function lineCardKeyRows(line) {
return line.cardKeys || [];
@@ -720,36 +777,59 @@ onMounted(() => {
}
}
-.mb_5 {
- margin-bottom: 5px;
-}
.order-detail {
color: #333;
}
-.order-card {
- padding: 4px 0 16px;
- margin-bottom: 8px;
- border-bottom: 1px solid #f0f0f0;
+.panel {
+ margin-top: 16px;
+ padding: 16px 20px;
+ border: 1px solid #eee;
+ border-radius: 8px;
+ background: #fff;
h3 {
margin: 0 0 12px;
- font-size: 15px;
+ padding-bottom: 12px;
+ border-bottom: 1px solid #f5f5f5;
+ font-size: 16px;
font-weight: 600;
color: #333;
- line-height: 1.4;
- }
-
- p {
- margin: 0;
- padding: 4px 0;
- color: #666;
- line-height: 22px;
+ line-height: 24px;
}
}
-.status-card {
- padding-top: 8px;
+.info-row {
+ display: flex;
+ gap: 16px;
+ padding: 12px 0;
+ border-bottom: 1px solid #f5f5f5;
+
+ &:last-child {
+ border-bottom: none;
+ padding-bottom: 4px;
+ }
+}
+
+.info-label {
+ flex: 0 0 80px;
+ color: #999;
+ font-size: 14px;
+ line-height: 22px;
+}
+
+.info-value {
+ flex: 1;
+ min-width: 0;
+ color: #333;
+ font-size: 14px;
+ line-height: 22px;
+ word-break: break-all;
+}
+
+.empty-text {
+ color: #999;
+ font-size: 14px;
}
.status-head {
@@ -759,16 +839,17 @@ onMounted(() => {
gap: 16px;
}
-.status-text {
- color: $theme_color;
- font-size: 18px;
- font-weight: 600;
- line-height: 1.4;
+.status-main {
+ display: flex;
+ align-items: center;
+ gap: 12px;
+ flex-wrap: wrap;
}
.status-sn {
- margin-top: 6px;
- color: #666;
+ margin: 0;
+ color: #999;
+ font-size: 14px;
}
.status-side {
@@ -828,78 +909,61 @@ onMounted(() => {
}
}
-.goods {
- padding-top: 8px;
-}
+.goods-panel {
+ .shop-name {
+ margin: 0 0 12px;
+ padding-bottom: 12px;
+ border-bottom: 1px solid #f5f5f5;
+ font-size: 16px;
+ font-weight: 600;
-.shop-name {
- margin: 8px 0 12px;
- font-size: 14px;
- font-weight: 600;
+ span {
+ color: #333;
+ cursor: pointer;
- span {
- color: #438cde;
- cursor: pointer;
-
- &:hover {
- color: $theme_color;
+ &:hover {
+ color: $theme_color;
+ }
}
}
}
-table {
- border: 1px solid #eee;
- color: #666;
- border-collapse: collapse;
- width: 100%;
-
- tr {
- border-top: 1px solid #eee;
- }
-
- thead > tr {
- height: 40px;
- background: #fafafa;
- }
-
- th {
- padding: 0 8px;
- font-size: 13px;
- font-weight: 500;
- color: #666;
- }
-
- td {
- padding: 12px 8px;
- text-align: center;
- vertical-align: middle;
-
- &:first-child {
- text-align: left;
- }
- }
+// 覆盖全局 .goods-list 的 flex 布局，避免订单商品行被压缩
+.goods-list {
+ display: block;
}
-.goods-cell {
+.goods-row {
display: flex;
align-items: center;
- gap: 12px;
- min-width: 0;
+ gap: 16px;
+ padding: 12px 0;
+ border-bottom: 1px solid #f5f5f5;
- img {
- width: 64px;
- height: 64px;
- border-radius: 6px;
- object-fit: cover;
- flex-shrink: 0;
- background: #f5f5f5;
- cursor: pointer;
+ &:last-child {
+ border-bottom: none;
}
}
+.goods-thumb {
+ width: 56px;
+ height: 56px;
+ border-radius: 6px;
+ object-fit: cover;
+ flex-shrink: 0;
+ background: #f5f5f5;
+ cursor: pointer;
+}
+
+.goods-info {
+ flex: 1;
+ min-width: 0;
+}
+
.goods-name {
- min-width: 0;
+ margin: 0;
color: #333;
+ font-size: 14px;
line-height: 20px;
display: -webkit-box;
-webkit-box-orient: vertical;
@@ -909,12 +973,41 @@ table {
cursor: pointer;
}
-.order-item-actions {
- vertical-align: middle;
+.goods-sn {
+ margin: 4px 0 0;
+ color: #999;
+ font-size: 12px;
+ line-height: 18px;
+}
+
+.goods-price {
+ flex-shrink: 0;
+ text-align: right;
+
+ .unit-price {
+ display: block;
+ color: #999;
+ font-size: 13px;
+ line-height: 20px;
+ }
+
+ .subtotal {
+ display: block;
+ color: #333;
+ font-size: 14px;
+ font-weight: 600;
+ line-height: 22px;
+ }
+}
+
+.goods-actions {
+ flex-shrink: 0;
+ display: flex;
+ flex-direction: column;
+ align-items: flex-end;
+ gap: 6px;
.comment-text {
- display: block;
- margin: 0 auto 6px;
padding: 0;
border: 0;
background: transparent;
@@ -924,9 +1017,8 @@ table {
cursor: pointer;
}
- .order-item-action-btn {
- display: block;
- margin: 0 auto 6px;
+ .el-button {
+ margin: 0;
min-width: 88px;
}
}
@@ -958,13 +1050,12 @@ table {
}
}
.verificationCode {
- font-size: 20px;
- margin-bottom: 20px;
- color: rgb(65, 63, 63);
- font-weight: bold;
- text-align: center;
+ margin: 16px 0 0;
+ font-size: 14px;
+ color: #333;
+
span {
- color: $theme_color;
+ font-weight: 600;
}
}
@@ -1086,34 +1177,4 @@ table {
}
}
}
-
-.layui-layer-wrap {
- dl {
- border-top: solid 1px #f5f5f5;
- margin-top: -1px;
- overflow: hidden;
-
- dt {
- font-size: 14px;
- line-height: 28px;
- display: inline-block;
- padding: 8px 1% 8px 0;
- color: #999;
- }
-
- dd {
- font-size: 14px;
- line-height: 28px;
- display: inline-block;
- padding: 8px 0 8px 8px;
- border-left: solid 1px #f5f5f5;
-
- .text-box {
- line-height: 40px;
- color: #333;
- word-break: break-all;
- }
- }
- }
-}