From 56672ac3de3153246f199fdf29655ea72d13b085 Mon Sep 17 00:00:00 2001 From: admin Date: Sat, 30 May 2026 22:38:15 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E8=B4=AD=E7=89=A9?= =?UTF-8?q?=E8=BD=A6=E7=A7=BB=E5=8A=A8=E7=AB=AF=E5=88=A0=E9=99=A4=E6=8C=89?= =?UTF-8?q?=E9=92=AE=E4=BD=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 删除按钮绝对定位在右上角 - 复选框绝对定位在左上角 - 商品信息占整行 - 数量选择器单独一行显示 Co-Authored-By: Claude Opus 4.8 --- frontend/src/views/user/Cart.vue | 117 +++++++++++++------------------ 1 file changed, 47 insertions(+), 70 deletions(-) diff --git a/frontend/src/views/user/Cart.vue b/frontend/src/views/user/Cart.vue index c5e1bbe..0ec6e0e 100644 --- a/frontend/src/views/user/Cart.vue +++ b/frontend/src/views/user/Cart.vue @@ -942,89 +942,66 @@ onMounted(() => { } .cart-item { - flex-wrap: wrap; - gap: 8px; + display: block; padding: 12px; - align-items: flex-start; - - > .el-checkbox { - width: 24px; - order: 1; - margin-top: 24px; - } - > .item-product { - flex: 1; - min-width: 0; - order: 2; - width: calc(100% - 36px); - } - > .item-price { - display: none; - } - > .item-quantity { - order: 4; - width: 100%; - display: flex; - flex-direction: row; - align-items: center; - justify-content: flex-start; - gap: 12px; - padding-left: 36px; - margin-top: 8px; - } - > .item-subtotal { - order: 3; - width: auto; - margin-left: auto; - padding-right: 8px; - } - > .item-action { - order: 5; - width: 100%; - padding-left: 36px; - margin-top: 4px; - } + position: relative; } - .item-product { - gap: 10px; - flex-wrap: nowrap; + .cart-item > .el-checkbox { + position: absolute; + top: 12px; + left: 12px; + width: 24px; + } - .item-image { - width: 70px; - height: 70px; - flex-shrink: 0; - } + .cart-item > .item-product { + display: flex; + gap: 10px; + padding-left: 32px; + padding-right: 60px; + } + + .cart-item > .item-price { + display: none; + } + + .cart-item > .item-quantity { + display: flex; + align-items: center; + justify-content: space-between; + margin-top: 10px; + padding-left: 32px; + } + + .cart-item > .item-subtotal { + text-align: right; + margin-top: 8px; + } + + .cart-item > .item-action { + position: absolute; + top: 12px; + right: 12px; + width: auto; + } + + .item-product .item-image { + width: 70px; + height: 70px; + flex-shrink: 0; } .item-info { flex: 1; min-width: 0; - display: flex; - flex-direction: column; - justify-content: center; - gap: 4px; } - .item-name { - font-size: 14px; - line-height: 1.4; + .item-quantity :deep(.el-input-number) { + width: 100px; } - .item-quantity { - :deep(.el-input-number) { - width: 100px; - } - - .stock-tip { - font-size: 11px; - } - } - - .item-subtotal { - .subtotal-price { - font-size: 16px; - } + .item-subtotal .subtotal-price { + font-size: 16px; } .payment-methods {