订单详情

This commit is contained in:
pushuo 2022-07-06 17:34:24 +08:00
parent 1c3349eb46
commit 32af642169
13 changed files with 319 additions and 170 deletions

View File

@ -46,8 +46,7 @@ class OrderController extends Controller
{
$customer = current_customer();
$order = OrderRepo::getOrderByNumber($number, $customer);
dd($order);
return view('account/order_show', ['data' => $order]);
return view('account/order_info', ['order' => $order]);
}
public function success(Request $request, $number): View

View File

@ -9787,7 +9787,7 @@ textarea.form-control-lg {
color: #000;
background-color: #fd6f33;
border-color: #fd6727;
box-shadow: 0 0 0 0.25rem rgba(215, 73, 13, 0.5);
box-shadow: 0 0 0 0 rgba(215, 73, 13, 0.5);
}
.btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle {
color: #000;
@ -9795,7 +9795,7 @@ textarea.form-control-lg {
border-color: #fd6727;
}
.btn-check:checked + .btn-primary:focus, .btn-check:active + .btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus, .show > .btn-primary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(215, 73, 13, 0.5);
box-shadow: 0 0 0 0 rgba(215, 73, 13, 0.5);
}
.btn-primary:disabled, .btn-primary.disabled {
color: #000;
@ -9817,7 +9817,7 @@ textarea.form-control-lg {
color: #fff;
background-color: #5c636a;
border-color: #565e64;
box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
box-shadow: 0 0 0 0 rgba(130, 138, 145, 0.5);
}
.btn-check:checked + .btn-secondary, .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active, .show > .btn-secondary.dropdown-toggle {
color: #fff;
@ -9825,7 +9825,7 @@ textarea.form-control-lg {
border-color: #51585e;
}
.btn-check:checked + .btn-secondary:focus, .btn-check:active + .btn-secondary:focus, .btn-secondary:active:focus, .btn-secondary.active:focus, .show > .btn-secondary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
box-shadow: 0 0 0 0 rgba(130, 138, 145, 0.5);
}
.btn-secondary:disabled, .btn-secondary.disabled {
color: #fff;
@ -9847,7 +9847,7 @@ textarea.form-control-lg {
color: #fff;
background-color: #157347;
border-color: #146c43;
box-shadow: 0 0 0 0.25rem rgba(60, 153, 110, 0.5);
box-shadow: 0 0 0 0 rgba(60, 153, 110, 0.5);
}
.btn-check:checked + .btn-success, .btn-check:active + .btn-success, .btn-success:active, .btn-success.active, .show > .btn-success.dropdown-toggle {
color: #fff;
@ -9855,7 +9855,7 @@ textarea.form-control-lg {
border-color: #13653f;
}
.btn-check:checked + .btn-success:focus, .btn-check:active + .btn-success:focus, .btn-success:active:focus, .btn-success.active:focus, .show > .btn-success.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(60, 153, 110, 0.5);
box-shadow: 0 0 0 0 rgba(60, 153, 110, 0.5);
}
.btn-success:disabled, .btn-success.disabled {
color: #fff;
@ -9877,7 +9877,7 @@ textarea.form-control-lg {
color: #000;
background-color: #31d2f2;
border-color: #25cff2;
box-shadow: 0 0 0 0.25rem rgba(11, 172, 204, 0.5);
box-shadow: 0 0 0 0 rgba(11, 172, 204, 0.5);
}
.btn-check:checked + .btn-info, .btn-check:active + .btn-info, .btn-info:active, .btn-info.active, .show > .btn-info.dropdown-toggle {
color: #000;
@ -9885,7 +9885,7 @@ textarea.form-control-lg {
border-color: #25cff2;
}
.btn-check:checked + .btn-info:focus, .btn-check:active + .btn-info:focus, .btn-info:active:focus, .btn-info.active:focus, .show > .btn-info.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(11, 172, 204, 0.5);
box-shadow: 0 0 0 0 rgba(11, 172, 204, 0.5);
}
.btn-info:disabled, .btn-info.disabled {
color: #000;
@ -9907,7 +9907,7 @@ textarea.form-control-lg {
color: #000;
background-color: #ffca2c;
border-color: #ffc720;
box-shadow: 0 0 0 0.25rem rgba(217, 164, 6, 0.5);
box-shadow: 0 0 0 0 rgba(217, 164, 6, 0.5);
}
.btn-check:checked + .btn-warning, .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active, .show > .btn-warning.dropdown-toggle {
color: #000;
@ -9915,7 +9915,7 @@ textarea.form-control-lg {
border-color: #ffc720;
}
.btn-check:checked + .btn-warning:focus, .btn-check:active + .btn-warning:focus, .btn-warning:active:focus, .btn-warning.active:focus, .show > .btn-warning.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(217, 164, 6, 0.5);
box-shadow: 0 0 0 0 rgba(217, 164, 6, 0.5);
}
.btn-warning:disabled, .btn-warning.disabled {
color: #000;
@ -9937,7 +9937,7 @@ textarea.form-control-lg {
color: #fff;
background-color: #bb2d3b;
border-color: #b02a37;
box-shadow: 0 0 0 0.25rem rgba(225, 83, 97, 0.5);
box-shadow: 0 0 0 0 rgba(225, 83, 97, 0.5);
}
.btn-check:checked + .btn-danger, .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active, .show > .btn-danger.dropdown-toggle {
color: #fff;
@ -9945,7 +9945,7 @@ textarea.form-control-lg {
border-color: #a52834;
}
.btn-check:checked + .btn-danger:focus, .btn-check:active + .btn-danger:focus, .btn-danger:active:focus, .btn-danger.active:focus, .show > .btn-danger.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(225, 83, 97, 0.5);
box-shadow: 0 0 0 0 rgba(225, 83, 97, 0.5);
}
.btn-danger:disabled, .btn-danger.disabled {
color: #fff;
@ -9967,7 +9967,7 @@ textarea.form-control-lg {
color: #000;
background-color: #f9fafb;
border-color: #f9fafb;
box-shadow: 0 0 0 0.25rem rgba(211, 212, 213, 0.5);
box-shadow: 0 0 0 0 rgba(211, 212, 213, 0.5);
}
.btn-check:checked + .btn-light, .btn-check:active + .btn-light, .btn-light:active, .btn-light.active, .show > .btn-light.dropdown-toggle {
color: #000;
@ -9975,7 +9975,7 @@ textarea.form-control-lg {
border-color: #f9fafb;
}
.btn-check:checked + .btn-light:focus, .btn-check:active + .btn-light:focus, .btn-light:active:focus, .btn-light.active:focus, .show > .btn-light.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(211, 212, 213, 0.5);
box-shadow: 0 0 0 0 rgba(211, 212, 213, 0.5);
}
.btn-light:disabled, .btn-light.disabled {
color: #000;
@ -9997,7 +9997,7 @@ textarea.form-control-lg {
color: #fff;
background-color: #1c1f23;
border-color: #1a1e21;
box-shadow: 0 0 0 0.25rem rgba(66, 70, 73, 0.5);
box-shadow: 0 0 0 0 rgba(66, 70, 73, 0.5);
}
.btn-check:checked + .btn-dark, .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active, .show > .btn-dark.dropdown-toggle {
color: #fff;
@ -10005,7 +10005,7 @@ textarea.form-control-lg {
border-color: #191c1f;
}
.btn-check:checked + .btn-dark:focus, .btn-check:active + .btn-dark:focus, .btn-dark:active:focus, .btn-dark.active:focus, .show > .btn-dark.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(66, 70, 73, 0.5);
box-shadow: 0 0 0 0 rgba(66, 70, 73, 0.5);
}
.btn-dark:disabled, .btn-dark.disabled {
color: #fff;
@ -10023,7 +10023,7 @@ textarea.form-control-lg {
border-color: #fd560f;
}
.btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus {
box-shadow: 0 0 0 0.25rem rgba(253, 86, 15, 0.5);
box-shadow: 0 0 0 0 rgba(253, 86, 15, 0.5);
}
.btn-check:checked + .btn-outline-primary, .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show {
color: #000;
@ -10031,7 +10031,7 @@ textarea.form-control-lg {
border-color: #fd560f;
}
.btn-check:checked + .btn-outline-primary:focus, .btn-check:active + .btn-outline-primary:focus, .btn-outline-primary:active:focus, .btn-outline-primary.active:focus, .btn-outline-primary.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(253, 86, 15, 0.5);
box-shadow: 0 0 0 0 rgba(253, 86, 15, 0.5);
}
.btn-outline-primary:disabled, .btn-outline-primary.disabled {
color: #fd560f;
@ -10048,7 +10048,7 @@ textarea.form-control-lg {
border-color: #6c757d;
}
.btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus {
box-shadow: 0 0 0 0.25rem rgba(108, 117, 125, 0.5);
box-shadow: 0 0 0 0 rgba(108, 117, 125, 0.5);
}
.btn-check:checked + .btn-outline-secondary, .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show {
color: #fff;
@ -10056,7 +10056,7 @@ textarea.form-control-lg {
border-color: #6c757d;
}
.btn-check:checked + .btn-outline-secondary:focus, .btn-check:active + .btn-outline-secondary:focus, .btn-outline-secondary:active:focus, .btn-outline-secondary.active:focus, .btn-outline-secondary.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(108, 117, 125, 0.5);
box-shadow: 0 0 0 0 rgba(108, 117, 125, 0.5);
}
.btn-outline-secondary:disabled, .btn-outline-secondary.disabled {
color: #6c757d;
@ -10073,7 +10073,7 @@ textarea.form-control-lg {
border-color: #198754;
}
.btn-check:focus + .btn-outline-success, .btn-outline-success:focus {
box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.5);
box-shadow: 0 0 0 0 rgba(25, 135, 84, 0.5);
}
.btn-check:checked + .btn-outline-success, .btn-check:active + .btn-outline-success, .btn-outline-success:active, .btn-outline-success.active, .btn-outline-success.dropdown-toggle.show {
color: #fff;
@ -10081,7 +10081,7 @@ textarea.form-control-lg {
border-color: #198754;
}
.btn-check:checked + .btn-outline-success:focus, .btn-check:active + .btn-outline-success:focus, .btn-outline-success:active:focus, .btn-outline-success.active:focus, .btn-outline-success.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.5);
box-shadow: 0 0 0 0 rgba(25, 135, 84, 0.5);
}
.btn-outline-success:disabled, .btn-outline-success.disabled {
color: #198754;
@ -10098,7 +10098,7 @@ textarea.form-control-lg {
border-color: #0dcaf0;
}
.btn-check:focus + .btn-outline-info, .btn-outline-info:focus {
box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.5);
box-shadow: 0 0 0 0 rgba(13, 202, 240, 0.5);
}
.btn-check:checked + .btn-outline-info, .btn-check:active + .btn-outline-info, .btn-outline-info:active, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show {
color: #000;
@ -10106,7 +10106,7 @@ textarea.form-control-lg {
border-color: #0dcaf0;
}
.btn-check:checked + .btn-outline-info:focus, .btn-check:active + .btn-outline-info:focus, .btn-outline-info:active:focus, .btn-outline-info.active:focus, .btn-outline-info.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.5);
box-shadow: 0 0 0 0 rgba(13, 202, 240, 0.5);
}
.btn-outline-info:disabled, .btn-outline-info.disabled {
color: #0dcaf0;
@ -10123,7 +10123,7 @@ textarea.form-control-lg {
border-color: #ffc107;
}
.btn-check:focus + .btn-outline-warning, .btn-outline-warning:focus {
box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5);
box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.5);
}
.btn-check:checked + .btn-outline-warning, .btn-check:active + .btn-outline-warning, .btn-outline-warning:active, .btn-outline-warning.active, .btn-outline-warning.dropdown-toggle.show {
color: #000;
@ -10131,7 +10131,7 @@ textarea.form-control-lg {
border-color: #ffc107;
}
.btn-check:checked + .btn-outline-warning:focus, .btn-check:active + .btn-outline-warning:focus, .btn-outline-warning:active:focus, .btn-outline-warning.active:focus, .btn-outline-warning.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5);
box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.5);
}
.btn-outline-warning:disabled, .btn-outline-warning.disabled {
color: #ffc107;
@ -10148,7 +10148,7 @@ textarea.form-control-lg {
border-color: #dc3545;
}
.btn-check:focus + .btn-outline-danger, .btn-outline-danger:focus {
box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.5);
box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.5);
}
.btn-check:checked + .btn-outline-danger, .btn-check:active + .btn-outline-danger, .btn-outline-danger:active, .btn-outline-danger.active, .btn-outline-danger.dropdown-toggle.show {
color: #fff;
@ -10156,7 +10156,7 @@ textarea.form-control-lg {
border-color: #dc3545;
}
.btn-check:checked + .btn-outline-danger:focus, .btn-check:active + .btn-outline-danger:focus, .btn-outline-danger:active:focus, .btn-outline-danger.active:focus, .btn-outline-danger.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.5);
box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.5);
}
.btn-outline-danger:disabled, .btn-outline-danger.disabled {
color: #dc3545;
@ -10173,7 +10173,7 @@ textarea.form-control-lg {
border-color: #f8f9fa;
}
.btn-check:focus + .btn-outline-light, .btn-outline-light:focus {
box-shadow: 0 0 0 0.25rem rgba(248, 249, 250, 0.5);
box-shadow: 0 0 0 0 rgba(248, 249, 250, 0.5);
}
.btn-check:checked + .btn-outline-light, .btn-check:active + .btn-outline-light, .btn-outline-light:active, .btn-outline-light.active, .btn-outline-light.dropdown-toggle.show {
color: #000;
@ -10181,7 +10181,7 @@ textarea.form-control-lg {
border-color: #f8f9fa;
}
.btn-check:checked + .btn-outline-light:focus, .btn-check:active + .btn-outline-light:focus, .btn-outline-light:active:focus, .btn-outline-light.active:focus, .btn-outline-light.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(248, 249, 250, 0.5);
box-shadow: 0 0 0 0 rgba(248, 249, 250, 0.5);
}
.btn-outline-light:disabled, .btn-outline-light.disabled {
color: #f8f9fa;
@ -10198,7 +10198,7 @@ textarea.form-control-lg {
border-color: #212529;
}
.btn-check:focus + .btn-outline-dark, .btn-outline-dark:focus {
box-shadow: 0 0 0 0.25rem rgba(33, 37, 41, 0.5);
box-shadow: 0 0 0 0 rgba(33, 37, 41, 0.5);
}
.btn-check:checked + .btn-outline-dark, .btn-check:active + .btn-outline-dark, .btn-outline-dark:active, .btn-outline-dark.active, .btn-outline-dark.dropdown-toggle.show {
color: #fff;
@ -10206,7 +10206,7 @@ textarea.form-control-lg {
border-color: #212529;
}
.btn-check:checked + .btn-outline-dark:focus, .btn-check:active + .btn-outline-dark:focus, .btn-outline-dark:active:focus, .btn-outline-dark.active:focus, .btn-outline-dark.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(33, 37, 41, 0.5);
box-shadow: 0 0 0 0 rgba(33, 37, 41, 0.5);
}
.btn-outline-dark:disabled, .btn-outline-dark.disabled {
color: #212529;
@ -10844,7 +10844,7 @@ textarea.form-control-lg {
.navbar-toggler:focus {
text-decoration: none;
outline: 0;
box-shadow: 0 0 0 0.25rem;
box-shadow: 0 0 0 0;
}
.navbar-toggler-icon {

View File

@ -161,43 +161,6 @@
color: #fff;
}
.account-card {
border: none;
}
.account-card .card-header {
border: none;
background-color: #fff;
padding-top: 1rem;
}
.account-card .card-header h6 {
border-left: 3px solid #fd560f;
padding-left: 6px;
font-weight: bold;
font-size: 1rem;
}
.account-card .card-items > a {
width: 25%;
color: #444444;
text-decoration: none !important;
}
.account-card .card-items > a i {
font-size: 2rem;
}
.account-card .card-items > a span {
display: flex;
}
.account-card .order-wrap {
background-color: #f6f8f9;
padding: 2rem 1rem;
}
.account-card .order-wrap .icon i {
font-size: 4.5rem;
color: #777;
}
.account-card .order-wrap .text {
font-size: 1rem;
}
header {
background: #fff;
}
@ -374,6 +337,32 @@ body.page-login .card {
body.page-account {
background-color: #F7F8FA;
}
body.page-account .account-card {
border: none;
}
body.page-account .account-card .card-items > a {
width: 25%;
color: #444444;
text-decoration: none !important;
}
body.page-account .account-card .card-items > a i {
font-size: 2rem;
}
body.page-account .account-card .card-items > a span {
display: flex;
}
body.page-account .account-card .order-wrap {
background-color: #f6f8f9;
padding: 2rem 1rem;
}
body.page-account .account-card .order-wrap .icon i {
font-size: 4.5rem;
color: #777;
}
body.page-account .account-card .order-wrap .text {
font-size: 1rem;
}
body.page-product .product-image .left {
margin-right: 1rem;
}
@ -745,3 +734,30 @@ body.page-account-order-list .order-wrap .table .product-info .img {
width: 60px;
margin-right: 10px;
}
body.page-account-order-info {
background-color: #F7F8FA;
}
body.page-account-order-info .product-list {
display: flex;
align-items: center;
border-bottom: 1px solid #eee;
padding-bottom: 1rem;
margin-bottom: 1rem;
}
body.page-account-order-info .product-list .left {
width: 90px;
margin-right: 10px;
}
body.page-account-order-info .product-list .right {
color: #767676;
font-size: 0.9375rem;
}
body.page-account-order-info .product-list .right .name {
font-weight: bold;
margin-bottom: 0.4rem;
color: #1a1a1a;
}
body.page-account-order-info .product-list .right .price {
font-weight: bold;
}

View File

@ -9782,7 +9782,7 @@ textarea.form-control-lg {
color: #000;
background-color: #fd6f33;
border-color: #fd6727;
box-shadow: 0 0 0 0.25rem rgba(215, 73, 13, 0.5);
box-shadow: 0 0 0 0 rgba(215, 73, 13, 0.5);
}
.btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle {
color: #000;
@ -9790,7 +9790,7 @@ textarea.form-control-lg {
border-color: #fd6727;
}
.btn-check:checked + .btn-primary:focus, .btn-check:active + .btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus, .show > .btn-primary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(215, 73, 13, 0.5);
box-shadow: 0 0 0 0 rgba(215, 73, 13, 0.5);
}
.btn-primary:disabled, .btn-primary.disabled {
color: #000;
@ -9812,7 +9812,7 @@ textarea.form-control-lg {
color: #fff;
background-color: #5c636a;
border-color: #565e64;
box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
box-shadow: 0 0 0 0 rgba(130, 138, 145, 0.5);
}
.btn-check:checked + .btn-secondary, .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active, .show > .btn-secondary.dropdown-toggle {
color: #fff;
@ -9820,7 +9820,7 @@ textarea.form-control-lg {
border-color: #51585e;
}
.btn-check:checked + .btn-secondary:focus, .btn-check:active + .btn-secondary:focus, .btn-secondary:active:focus, .btn-secondary.active:focus, .show > .btn-secondary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
box-shadow: 0 0 0 0 rgba(130, 138, 145, 0.5);
}
.btn-secondary:disabled, .btn-secondary.disabled {
color: #fff;
@ -9842,7 +9842,7 @@ textarea.form-control-lg {
color: #fff;
background-color: #157347;
border-color: #146c43;
box-shadow: 0 0 0 0.25rem rgba(60, 153, 110, 0.5);
box-shadow: 0 0 0 0 rgba(60, 153, 110, 0.5);
}
.btn-check:checked + .btn-success, .btn-check:active + .btn-success, .btn-success:active, .btn-success.active, .show > .btn-success.dropdown-toggle {
color: #fff;
@ -9850,7 +9850,7 @@ textarea.form-control-lg {
border-color: #13653f;
}
.btn-check:checked + .btn-success:focus, .btn-check:active + .btn-success:focus, .btn-success:active:focus, .btn-success.active:focus, .show > .btn-success.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(60, 153, 110, 0.5);
box-shadow: 0 0 0 0 rgba(60, 153, 110, 0.5);
}
.btn-success:disabled, .btn-success.disabled {
color: #fff;
@ -9872,7 +9872,7 @@ textarea.form-control-lg {
color: #000;
background-color: #31d2f2;
border-color: #25cff2;
box-shadow: 0 0 0 0.25rem rgba(11, 172, 204, 0.5);
box-shadow: 0 0 0 0 rgba(11, 172, 204, 0.5);
}
.btn-check:checked + .btn-info, .btn-check:active + .btn-info, .btn-info:active, .btn-info.active, .show > .btn-info.dropdown-toggle {
color: #000;
@ -9880,7 +9880,7 @@ textarea.form-control-lg {
border-color: #25cff2;
}
.btn-check:checked + .btn-info:focus, .btn-check:active + .btn-info:focus, .btn-info:active:focus, .btn-info.active:focus, .show > .btn-info.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(11, 172, 204, 0.5);
box-shadow: 0 0 0 0 rgba(11, 172, 204, 0.5);
}
.btn-info:disabled, .btn-info.disabled {
color: #000;
@ -9902,7 +9902,7 @@ textarea.form-control-lg {
color: #000;
background-color: #ffca2c;
border-color: #ffc720;
box-shadow: 0 0 0 0.25rem rgba(217, 164, 6, 0.5);
box-shadow: 0 0 0 0 rgba(217, 164, 6, 0.5);
}
.btn-check:checked + .btn-warning, .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active, .show > .btn-warning.dropdown-toggle {
color: #000;
@ -9910,7 +9910,7 @@ textarea.form-control-lg {
border-color: #ffc720;
}
.btn-check:checked + .btn-warning:focus, .btn-check:active + .btn-warning:focus, .btn-warning:active:focus, .btn-warning.active:focus, .show > .btn-warning.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(217, 164, 6, 0.5);
box-shadow: 0 0 0 0 rgba(217, 164, 6, 0.5);
}
.btn-warning:disabled, .btn-warning.disabled {
color: #000;
@ -9932,7 +9932,7 @@ textarea.form-control-lg {
color: #fff;
background-color: #bb2d3b;
border-color: #b02a37;
box-shadow: 0 0 0 0.25rem rgba(225, 83, 97, 0.5);
box-shadow: 0 0 0 0 rgba(225, 83, 97, 0.5);
}
.btn-check:checked + .btn-danger, .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active, .show > .btn-danger.dropdown-toggle {
color: #fff;
@ -9940,7 +9940,7 @@ textarea.form-control-lg {
border-color: #a52834;
}
.btn-check:checked + .btn-danger:focus, .btn-check:active + .btn-danger:focus, .btn-danger:active:focus, .btn-danger.active:focus, .show > .btn-danger.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(225, 83, 97, 0.5);
box-shadow: 0 0 0 0 rgba(225, 83, 97, 0.5);
}
.btn-danger:disabled, .btn-danger.disabled {
color: #fff;
@ -9962,7 +9962,7 @@ textarea.form-control-lg {
color: #000;
background-color: #f9fafb;
border-color: #f9fafb;
box-shadow: 0 0 0 0.25rem rgba(211, 212, 213, 0.5);
box-shadow: 0 0 0 0 rgba(211, 212, 213, 0.5);
}
.btn-check:checked + .btn-light, .btn-check:active + .btn-light, .btn-light:active, .btn-light.active, .show > .btn-light.dropdown-toggle {
color: #000;
@ -9970,7 +9970,7 @@ textarea.form-control-lg {
border-color: #f9fafb;
}
.btn-check:checked + .btn-light:focus, .btn-check:active + .btn-light:focus, .btn-light:active:focus, .btn-light.active:focus, .show > .btn-light.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(211, 212, 213, 0.5);
box-shadow: 0 0 0 0 rgba(211, 212, 213, 0.5);
}
.btn-light:disabled, .btn-light.disabled {
color: #000;
@ -9992,7 +9992,7 @@ textarea.form-control-lg {
color: #fff;
background-color: #1c1f23;
border-color: #1a1e21;
box-shadow: 0 0 0 0.25rem rgba(66, 70, 73, 0.5);
box-shadow: 0 0 0 0 rgba(66, 70, 73, 0.5);
}
.btn-check:checked + .btn-dark, .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active, .show > .btn-dark.dropdown-toggle {
color: #fff;
@ -10000,7 +10000,7 @@ textarea.form-control-lg {
border-color: #191c1f;
}
.btn-check:checked + .btn-dark:focus, .btn-check:active + .btn-dark:focus, .btn-dark:active:focus, .btn-dark.active:focus, .show > .btn-dark.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(66, 70, 73, 0.5);
box-shadow: 0 0 0 0 rgba(66, 70, 73, 0.5);
}
.btn-dark:disabled, .btn-dark.disabled {
color: #fff;
@ -10018,7 +10018,7 @@ textarea.form-control-lg {
border-color: #fd560f;
}
.btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus {
box-shadow: 0 0 0 0.25rem rgba(253, 86, 15, 0.5);
box-shadow: 0 0 0 0 rgba(253, 86, 15, 0.5);
}
.btn-check:checked + .btn-outline-primary, .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show {
color: #000;
@ -10026,7 +10026,7 @@ textarea.form-control-lg {
border-color: #fd560f;
}
.btn-check:checked + .btn-outline-primary:focus, .btn-check:active + .btn-outline-primary:focus, .btn-outline-primary:active:focus, .btn-outline-primary.active:focus, .btn-outline-primary.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(253, 86, 15, 0.5);
box-shadow: 0 0 0 0 rgba(253, 86, 15, 0.5);
}
.btn-outline-primary:disabled, .btn-outline-primary.disabled {
color: #fd560f;
@ -10043,7 +10043,7 @@ textarea.form-control-lg {
border-color: #6c757d;
}
.btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus {
box-shadow: 0 0 0 0.25rem rgba(108, 117, 125, 0.5);
box-shadow: 0 0 0 0 rgba(108, 117, 125, 0.5);
}
.btn-check:checked + .btn-outline-secondary, .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show {
color: #fff;
@ -10051,7 +10051,7 @@ textarea.form-control-lg {
border-color: #6c757d;
}
.btn-check:checked + .btn-outline-secondary:focus, .btn-check:active + .btn-outline-secondary:focus, .btn-outline-secondary:active:focus, .btn-outline-secondary.active:focus, .btn-outline-secondary.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(108, 117, 125, 0.5);
box-shadow: 0 0 0 0 rgba(108, 117, 125, 0.5);
}
.btn-outline-secondary:disabled, .btn-outline-secondary.disabled {
color: #6c757d;
@ -10068,7 +10068,7 @@ textarea.form-control-lg {
border-color: #198754;
}
.btn-check:focus + .btn-outline-success, .btn-outline-success:focus {
box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.5);
box-shadow: 0 0 0 0 rgba(25, 135, 84, 0.5);
}
.btn-check:checked + .btn-outline-success, .btn-check:active + .btn-outline-success, .btn-outline-success:active, .btn-outline-success.active, .btn-outline-success.dropdown-toggle.show {
color: #fff;
@ -10076,7 +10076,7 @@ textarea.form-control-lg {
border-color: #198754;
}
.btn-check:checked + .btn-outline-success:focus, .btn-check:active + .btn-outline-success:focus, .btn-outline-success:active:focus, .btn-outline-success.active:focus, .btn-outline-success.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.5);
box-shadow: 0 0 0 0 rgba(25, 135, 84, 0.5);
}
.btn-outline-success:disabled, .btn-outline-success.disabled {
color: #198754;
@ -10093,7 +10093,7 @@ textarea.form-control-lg {
border-color: #0dcaf0;
}
.btn-check:focus + .btn-outline-info, .btn-outline-info:focus {
box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.5);
box-shadow: 0 0 0 0 rgba(13, 202, 240, 0.5);
}
.btn-check:checked + .btn-outline-info, .btn-check:active + .btn-outline-info, .btn-outline-info:active, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show {
color: #000;
@ -10101,7 +10101,7 @@ textarea.form-control-lg {
border-color: #0dcaf0;
}
.btn-check:checked + .btn-outline-info:focus, .btn-check:active + .btn-outline-info:focus, .btn-outline-info:active:focus, .btn-outline-info.active:focus, .btn-outline-info.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.5);
box-shadow: 0 0 0 0 rgba(13, 202, 240, 0.5);
}
.btn-outline-info:disabled, .btn-outline-info.disabled {
color: #0dcaf0;
@ -10118,7 +10118,7 @@ textarea.form-control-lg {
border-color: #ffc107;
}
.btn-check:focus + .btn-outline-warning, .btn-outline-warning:focus {
box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5);
box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.5);
}
.btn-check:checked + .btn-outline-warning, .btn-check:active + .btn-outline-warning, .btn-outline-warning:active, .btn-outline-warning.active, .btn-outline-warning.dropdown-toggle.show {
color: #000;
@ -10126,7 +10126,7 @@ textarea.form-control-lg {
border-color: #ffc107;
}
.btn-check:checked + .btn-outline-warning:focus, .btn-check:active + .btn-outline-warning:focus, .btn-outline-warning:active:focus, .btn-outline-warning.active:focus, .btn-outline-warning.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5);
box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.5);
}
.btn-outline-warning:disabled, .btn-outline-warning.disabled {
color: #ffc107;
@ -10143,7 +10143,7 @@ textarea.form-control-lg {
border-color: #dc3545;
}
.btn-check:focus + .btn-outline-danger, .btn-outline-danger:focus {
box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.5);
box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.5);
}
.btn-check:checked + .btn-outline-danger, .btn-check:active + .btn-outline-danger, .btn-outline-danger:active, .btn-outline-danger.active, .btn-outline-danger.dropdown-toggle.show {
color: #fff;
@ -10151,7 +10151,7 @@ textarea.form-control-lg {
border-color: #dc3545;
}
.btn-check:checked + .btn-outline-danger:focus, .btn-check:active + .btn-outline-danger:focus, .btn-outline-danger:active:focus, .btn-outline-danger.active:focus, .btn-outline-danger.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.5);
box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.5);
}
.btn-outline-danger:disabled, .btn-outline-danger.disabled {
color: #dc3545;
@ -10168,7 +10168,7 @@ textarea.form-control-lg {
border-color: #f8f9fa;
}
.btn-check:focus + .btn-outline-light, .btn-outline-light:focus {
box-shadow: 0 0 0 0.25rem rgba(248, 249, 250, 0.5);
box-shadow: 0 0 0 0 rgba(248, 249, 250, 0.5);
}
.btn-check:checked + .btn-outline-light, .btn-check:active + .btn-outline-light, .btn-outline-light:active, .btn-outline-light.active, .btn-outline-light.dropdown-toggle.show {
color: #000;
@ -10176,7 +10176,7 @@ textarea.form-control-lg {
border-color: #f8f9fa;
}
.btn-check:checked + .btn-outline-light:focus, .btn-check:active + .btn-outline-light:focus, .btn-outline-light:active:focus, .btn-outline-light.active:focus, .btn-outline-light.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(248, 249, 250, 0.5);
box-shadow: 0 0 0 0 rgba(248, 249, 250, 0.5);
}
.btn-outline-light:disabled, .btn-outline-light.disabled {
color: #f8f9fa;
@ -10193,7 +10193,7 @@ textarea.form-control-lg {
border-color: #212529;
}
.btn-check:focus + .btn-outline-dark, .btn-outline-dark:focus {
box-shadow: 0 0 0 0.25rem rgba(33, 37, 41, 0.5);
box-shadow: 0 0 0 0 rgba(33, 37, 41, 0.5);
}
.btn-check:checked + .btn-outline-dark, .btn-check:active + .btn-outline-dark, .btn-outline-dark:active, .btn-outline-dark.active, .btn-outline-dark.dropdown-toggle.show {
color: #fff;
@ -10201,7 +10201,7 @@ textarea.form-control-lg {
border-color: #212529;
}
.btn-check:checked + .btn-outline-dark:focus, .btn-check:active + .btn-outline-dark:focus, .btn-outline-dark:active:focus, .btn-outline-dark.active:focus, .btn-outline-dark.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(33, 37, 41, 0.5);
box-shadow: 0 0 0 0 rgba(33, 37, 41, 0.5);
}
.btn-outline-dark:disabled, .btn-outline-dark.disabled {
color: #212529;
@ -10839,7 +10839,7 @@ textarea.form-control-lg {
.navbar-toggler:focus {
text-decoration: none;
outline: 0;
box-shadow: 0 0 0 0.25rem;
box-shadow: 0 0 0 0;
}
.navbar-toggler-icon {
@ -18036,3 +18036,22 @@ textarea.form-control-lg {
.table > :not(:first-child) {
border-top: none;
}
.card {
border: none;
}
.card .card-header {
padding: 1rem 1rem 0.3rem;
background-color: #fff;
border-bottom: 0 solid rgba(0, 0, 0, 0.125);
}
.card .card-header:first-child {
border-radius: 1rem 1rem 0 0;
}
.card .card-header .card-title {
margin-bottom: 0;
padding-left: 10px;
border-left: 3px solid #fd560f;
line-height: 1;
font-size: 14px;
}

View File

@ -19,7 +19,7 @@ $form-floating-input-padding-t: 1.325rem;
$form-floating-input-padding-b: .625rem;
$form-floating-padding-y: .8rem;
$form-floating-height: 50px;
$btn-focus-width: 0;
$table-border-color: #e9ecef;
@import './bootstrap-icons';

View File

@ -3,7 +3,37 @@
body.page-account {
background-color: #F7F8FA;
footer {
// background-color: #fff;
.account-card {
border: none;
.card-items {
> a {
width: 25%;
color: #444444;
text-decoration: none !important;
i {
font-size: 2rem;
}
span {
display: flex;
}
}
}
.order-wrap {
background-color: #f6f8f9;
padding: 2rem 1rem;
.icon {
i {
font-size: 4.5rem;
color: #777;
}
}
.text {
font-size: 1rem;
}
}
}
}

View File

@ -18,4 +18,4 @@ $primary: #fd560f;
@import './page-checkout';
@import './element-ui';
@import './order-success';
@import './page-account-order-list';
@import './page-account-order';

View File

@ -32,15 +32,16 @@ $breadcrumb-bg: transparent;
$border-radius: 0;
$input-btn-padding-y: .6rem;
$input-btn-font-size: 0.9rem;
$input-btn-focus-box-shadow: 0 0 11px 0 rgba($color: $primary, $alpha: .1);
// $input-btn-padding-x: .75rem !default;
$btn-focus-width: 0;
// $btn-focus-box-shadow: 0 0 11px 0 rgba($color: $primary, $alpha: .1);
$link-decoration: none;
$link-color: #3480e7;
$link-hover-color: $primary;
$btn-focus-box-shadow: 0 0 11px 0 rgba($color: $primary, $alpha: .1);
$input-btn-focus-box-shadow: 0 0 11px 0 rgba($color: $primary, $alpha: .1);
$form-select-focus-box-shadow: 0 0 11px 0 rgba($color: $primary, $alpha: .1);
$btn-focus-box-shadow: 0 0 11px 0 rgba($color: $primary, $alpha: .1);
$form-floating-input-padding-t: 1.325rem;
$form-floating-input-padding-b: .625rem;
@ -72,4 +73,29 @@ $dropdown-item-padding-y: .4rem;
.table > :not(:first-child) {
border-top: none;
}
.card {
// box-shadow: rgba(0, 0, 0, .1) 0px 1px 4px 0px;
border: none;
.card-header {
padding: 1rem 1rem .3rem;
background-color: #fff;
// font-weight: bold;
// font-size: .8rem;
border-bottom: 0 solid rgba(0,0,0,.125);
&:first-child {
border-radius: 1rem 1rem 0 0;
}
.card-title {
margin-bottom: 0;
padding-left: 10px;
border-left: 3px solid $primary;
line-height: 1;
font-size: 14px;
}
}
}

View File

@ -171,50 +171,3 @@
}
}
}
.account-card {
border: none;
.card-header {
border: none;
background-color: #fff;
padding-top: 1rem;
h6 {
border-left: 3px solid $primary;
padding-left: 6px;
font-weight: bold;
font-size: 1rem;
}
}
.card-items {
> a {
width: 25%;
color: #444444;
text-decoration: none !important;
i {
font-size: 2rem;
}
span {
display: flex;
}
}
}
.order-wrap {
background-color: #f6f8f9;
padding: 2rem 1rem;
.icon {
i {
font-size: 4.5rem;
color: #777;
}
}
.text {
font-size: 1rem;
}
}
}

View File

@ -7,7 +7,6 @@ body.page-account-order-list {
.table {
.sep-row {
height: 20px;
// border: 0;
td {
border: 0;
@ -15,10 +14,8 @@ body.page-account-order-list {
}
.head-tr {
// border: 0;
background: #f5f5f5;
td {
// border: 0;
border-bottom-color: #f5f5f5;
}
}
@ -39,9 +36,8 @@ body.page-account-order-list {
.product-info {
display: flex;
align-items: center; // flex-start | center
// justify-content: space-between; // flex-end | center | space-between
// flex-wrap: wrap;
align-items: center;
.img {
width: 60px;
margin-right: 10px;
@ -49,4 +45,41 @@ body.page-account-order-list {
}
}
}
}
body.page-account-order-info {
background-color: #F7F8FA;
.order-head {
}
.product-list {
display: flex;
align-items: center; // flex-start | center
border-bottom: 1px solid #eee;
padding-bottom: 1rem;
margin-bottom: 1rem;
// justify-content: space-between; // flex-end | center | space-between
.left {
width: 90px;
margin-right: 10px;
}
.right {
color: #767676;
font-size: .9375rem;
.name {
font-weight: bold;
margin-bottom: .4rem;
color: #1a1a1a;
}
.price {
font-weight: bold;
}
}
}
}

View File

@ -23,7 +23,7 @@
@endif
<div class="card mb-4 account-card">
<div class="card-header d-flex justify-content-between align-items-center">
<h6 class="mb-0">个人中心</h6>
<h6 class="card-title">个人中心</h6>
<a href="http://" class="text-muted">修改休息</a>
</div>
<div class="card-body">
@ -39,7 +39,7 @@
</div>
<div class="card account-card">
<div class="card-header d-flex justify-content-between align-items-center">
<h6 class="mb-0">我的订单</h6>
<h6 class="card-title">我的订单</h6>
<a href="http://" class="text-muted">全部订单</a>
</div>
<div class="card-body">

View File

@ -22,11 +22,9 @@
<h6 class="mb-0">我的订单</h6>
</div>
<div class="card-body">
{{-- table-bordered --}}
<table class="table ">
<thead>
<tr>
{{-- <th>订单号</th> --}}
<th>订单详情</th>
<th>金额</th>
<th>状态</th>
@ -42,7 +40,6 @@
<span class="order-number">订单号:{{ $order->number }}</span>
</td>
</tr>
{{-- {{ dd($order->orderProducts) }} --}}
@foreach ($order->orderProducts as $product)
<tr class="{{ $loop->first ? 'first-tr' : '' }}">
<td>

View File

@ -0,0 +1,76 @@
@extends('layout.master')
@section('body-class', 'page-account-order-info')
@section('content')
<div class="container">
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Library</li>
</ol>
</nav>
<div class="row">
<x-shop-sidebar/>
{{-- {{ dd($order) }} --}}
<div class="col-12 col-md-9">
<div class="card mb-4 order-head">
<div class="card-header"><h6 class="card-title">订单详情</h6></div>
<div class="card-body">
<div class="bg-light p-2">
<table class="table table-borderless mb-0">
<thead>
<tr>
<th>订单号</th>
<th>下单日期</th>
<th>状态</th>
<th>订单金额</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{ $order->number }}</td>
<td>{{ $order->created_at }}</td>
<td>{{ $order->status }}</td>
<td>{{ $order->total }}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="card mb-4">
<div class="card-header"><h6 class="card-title">订购商品</h6></div>
<div class="card-body">
@foreach ($order->orderProducts as $product)
<div class="product-list">
<div class="left"><img src="{{ $product->image }}" class="img-fluid"></div>
<div class="right">
<div class="name">{{ $product->name }} x {{ $product->quantity }}</div>
<div class="price">{{ $product->price }}</div>
</div>
</div>
@endforeach
</div>
</div>
<div class="card mb-4">
<div class="card-header"><h6 class="card-title">物流状态</h6></div>
<div class="card-body">
</div>
</div>
<div class="card mb-4">
<div class="card-header"><h6 class="card-title">订单状态</h6></div>
<div class="card-body">
</div>
</div>
</div>
</div>
</div>
@endsection