wuhui_zzw
/
wyyl
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化前台ui

This commit is contained in:
pushuo 2022-06-27 09:30:00 +08:00
parent bb56840db7
commit e4fee9c047
32 changed files with 17957 additions and 5969 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
beike/Shop/Http/Controllers/PagesController.php Normal file
View File

@ -0,0 +1,23 @@
<?php
/**
* PagesController.php
*
* @copyright 2017 opencart.cn - All Rights Reserved
* @link http://www.guangdawangluo.com
* @author Edward Yang <yangjin@opencart.cn>
* @created 2017-08-28 19:55
* @modified 2017-08-28 19:55
*/
namespace Beike\Shop\Http\Controllers;
use Illuminate\Http\Request;
class PagesController extends Controller
{
public function show($urlKey, Request $request)
{
$data = [];
return view("pages/{$urlKey}", $data);
}
}

4
beike/Shop/Routes/shop.php
View File

@ -24,6 +24,8 @@ Route::prefix('/')
Route::middleware('shop_auth:'.\Beike\Models\Customer::AUTH_GUARD)
->group(function () {
Route::get('account', [\Beike\Shop\Http\Controllers\account\AccountController::class, 'index'])->name('account.index');
});
Route::get('/{url_key}',[Beike\Shop\Http\Controllers\PagesController::class, 'show'])->name('pages.show');
});

1
package.json
View File

@ -12,6 +12,7 @@
"devDependencies": {
"axios": "^0.21",
"bootstrap": "^4.6.1",
"bootstrap-5.1.3": "npm:bootstrap@5.1.3",
"browser-sync": "^2.27.10",
"browser-sync-webpack-plugin": "^2.3.0",
"laravel-mix": "^6.0.6",

143
public/build/beike/shop/default/css/app.css vendored
View File

@ -32,6 +32,12 @@
background: #FD560F;
}
header {
background: #fff;
}
body:not(.page-home) header {
border-bottom: 1px solid #e5e5e5;
}
header .top-wrap {
height: 44px;
background: #F7F8FA;
@ -42,21 +48,24 @@ header .header-content .container {
align-items: center;
justify-content: space-between;
}
header .header-content .menu-wrap .navbar-nav li:hover .dropdown-menu {
header .header-content .navbar-nav li:hover .dropdown-menu {
margin: 0;
display: block;
}
header .header-content .menu-wrap .nav-link {
color: #333;
font-weight: bold;
font-size: 0.9rem;
padding-left: 1rem;
padding-right: 1rem;
}
header .header-content .logo img {
max-width: 180px;
max-width: 170px;
max-height: 30px;
}
header .header-content .right-btn .nav-link {
color: #333;
padding-right: 0.7rem;
padding-left: 0.7rem;
}
header .header-content .right-btn .nav-link i {
font-size: 1.1rem;
@ -64,6 +73,7 @@ header .header-content .right-btn .nav-link i {
footer {
background: #F8F9FA;
margin-top: 3rem;
}
footer .footer-top {
padding: 2.2rem 0;
@ -159,3 +169,130 @@ footer .footer-bottom {
margin-bottom: 30px;
height: 90px;
}
.module-tab-product .nav .nav-link {
color: #6c757d;
}
.module-tab-product .nav .nav-link.active {
color: #111;
font-weight: bold;
}
body.page-login .login-item-header {
background: #f8f9fa;
border-bottom: none;
padding: 1.2rem 1.5rem;
}
body.page-login .login-item-header h6 {
font-weight: bold;
font-size: 1rem;
}
body.page-login .card {
border: none;
}
body.page-account {
background-color: #F7F8FA;
}
body.page-account footer {
background-color: #fff;
}
body.page-account .account-info .head {
display: flex;
flex-direction: column;
align-items: center;
padding: 2rem 1rem;
background-color: #fff;
}
body.page-account .account-info .head .portrait {
width: 90px;
height: 90px;
border-radius: 50%;
box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.14);
border: 2px solid #FFFFFF;
overflow: hidden;
margin-bottom: 1rem;
}
body.page-account .account-info .head .account-name {
font-weight: bold;
font-size: 1rem;
margin-bottom: 0.4rem;
}
body.page-account .account-info .head .account-email {
color: #666666;
}
body.page-account .account-info .account-links > a {
color: #4B566B;
border: none;
border-bottom: 1px solid #EEEEEE;
transition: all 0.2s ease-in-out;
text-decoration: none !important;
}
body.page-account .account-info .account-links > a:hover {
background-color: #E9ECEF;
}
body.page-account .account-info .account-links > a.active {
background-color: #E9ECEF;
color: #4B566B;
}
body.page-account .account-info .account-links > a .badge {
color: #fff;
}
body.page-account .account-card {
border: none;
}
body.page-account .account-card .card-header {
border: none;
background-color: #fff;
}
body.page-account .account-card .card-header h6 {
border-left: 3px solid #fd560f;
padding-left: 6px;
font-size: 0.9rem;
}
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;
}
body.page-product .product-image .left > div {
margin-bottom: 1rem;
}
body.page-product .peoduct-info {
padding-left: 3rem;
}
body.page-product .peoduct-info .rating-wrap {
margin-bottom: 2rem;
}
body.page-product .peoduct-info .rating-wrap .rating {
margin-right: 0.5rem;
}
body.page-product .peoduct-info .rating-wrap .rating i {
color: #fd560f;
}
body.page-product .peoduct-info .price-wrap .new-price {
margin-right: 0.6rem;
font-size: 1.6rem;
line-height: 1;
}

19818
public/build/beike/shop/default/css/bootstrap.css vendored
View File

File diff suppressed because it is too large Load Diff

0
public/vendor/bootstrap-4.6.1/css/bootstrap.min.css → public/vendor/bootstrap/4.6.1/css/bootstrap.min.css vendored
View File

0
public/vendor/bootstrap-4.6.1/js/bootstrap.bundle.min.js → public/vendor/bootstrap/4.6.1/js/bootstrap.bundle.min.js vendored
View File

0
public/vendor/bootstrap-4.6.1/js/bootstrap.min.js → public/vendor/bootstrap/4.6.1/js/bootstrap.min.js vendored
View File

7
public/vendor/bootstrap/5.1.3/css/bootstrap.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

7
public/vendor/bootstrap/5.1.3/js/bootstrap.bundle.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

7
public/vendor/bootstrap/5.1.3/js/bootstrap.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

BIN
public/vendor/bootstrap/icon/bootstrap-icons.woff vendored Normal file
View File

Binary file not shown.

BIN
public/vendor/bootstrap/icon/bootstrap-icons.woff2 vendored Normal file
View File

Binary file not shown.

BIN
public/vendor/iconfont/iconfont.ttf vendored
View File

Binary file not shown.

BIN
public/vendor/iconfont/iconfont.woff vendored
View File

Binary file not shown.

BIN
public/vendor/iconfont/iconfont.woff2 vendored
View File

Binary file not shown.

107
resources/beike/shop/default/account/account.scss vendored Normal file
View File

@ -0,0 +1,107 @@
@charset "UTF-8";
body.page-account {
background-color: #F7F8FA;
footer {
background-color: #fff;
}
.account-info {
.head {
display: flex;
flex-direction: column;
align-items: center;
padding: 2rem 1rem;
background-color: #fff;
.portrait {
width: 90px;
height: 90px;
border-radius: 50%;
box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.14);
border: 2px solid #FFFFFF;
overflow: hidden;
margin-bottom: 1rem;
}
.account-name {
font-weight: bold;
font-size: 1rem;
margin-bottom: 0.4rem;
}
.account-email {
color: #666666;
}
}
.account-links {
> a {
color: #4B566B;
border: none;
border-bottom: 1px solid #EEEEEE;
transition: all .2s ease-in-out;
text-decoration: none !important;
&:hover {
background-color: #E9ECEF;
}
&.active {
background-color: #E9ECEF;
color: #4B566B;
}
.badge {
color: #fff;
}
}
}
}
.account-card {
border: none;
.card-header {
border: none;
background-color: #fff;
h6 {
border-left: 3px solid $primary;
padding-left: 6px;
font-size: 0.9rem;
}
}
.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;
}
}
}
}

6
resources/beike/shop/default/app.scss vendored
View File

@ -9,4 +9,8 @@ $primary: #fd560f;
@import './footer';
@import './module-image-plus';
@import './product-style';
@import './module-brand';
@import './module-brand';
@import './module-tab-product';
@import './login';
@import './account/account';
@import './product';

3393
resources/beike/shop/default/bootstrap/bootstrap-icons.scss vendored Normal file
View File

File diff suppressed because it is too large Load Diff

23
resources/beike/shop/default/bootstrap/bootstrap.scss vendored
View File

@ -11,7 +11,28 @@
$primary: #fd560f;
$font-size-base: 0.8rem;
@import 'node_modules/bootstrap/scss/bootstrap';
// Breadcrumbs
// scss-docs-start breadcrumb-variables
// $breadcrumb-font-size: null !default;
$breadcrumb-padding-y: 1.4rem;
$breadcrumb-padding-x: 0;
// $breadcrumb-item-padding-x: .5rem !default;
$breadcrumb-margin-bottom: 0;
$breadcrumb-bg: transparent;
// $breadcrumb-divider-color: $gray-600 !default;
// $breadcrumb-active-color: $gray-600 !default;
// $breadcrumb-divider: quote("/") !default;
// $breadcrumb-divider-flipped: $breadcrumb-divider !default;
// $breadcrumb-border-radius: null !default;
$border-radius: 0;
$input-btn-padding-y: .6rem;
$input-btn-font-size: 0.9rem;
// $input-btn-padding-x: .75rem !default;
@import 'node_modules/bootstrap-5.1.3/scss/bootstrap';
@import './bootstrap-icons';
.container-fluid {
padding-right: 50px;

1
resources/beike/shop/default/footer.scss vendored
View File

@ -2,6 +2,7 @@
footer {
background: #F8F9FA;
margin-top: 3rem;
.footer-top {
padding: 2.2rem 0;

28
resources/beike/shop/default/header.scss vendored
View File

@ -1,6 +1,12 @@
@charset "UTF-8";
header {
// box-shadow: 0px 1px 10px rgba(0, 0, 0, .04);
background: #fff;
body:not(.page-home) & {
border-bottom: 1px solid #e5e5e5;
}
.top-wrap {
// padding: 10px;
height: 44px;
@ -16,20 +22,22 @@ header {
justify-content: space-between;
}
.menu-wrap {
.navbar-nav {
li {
&:hover {
.dropdown-menu {
display: block;
}
.navbar-nav {
li {
&:hover {
.dropdown-menu {
margin: 0;
display: block;
}
}
}
}
.menu-wrap {
.nav-link {
color: #333;
font-weight: bold;
// font-weight: bold;
font-size: .9rem;
padding-left: 1rem;
padding-right: 1rem;
}
@ -37,7 +45,7 @@ header {
.logo {
img {
max-width: 180px;
max-width: 170px;
max-height: 30px;
}
}
@ -45,6 +53,8 @@ header {
.right-btn {
.nav-link {
color: #333;
padding-right: 0.7rem;
padding-left: 0.7rem;
i {
font-size: 1.1rem;
}

17
resources/beike/shop/default/login.scss vendored Normal file
View File

@ -0,0 +1,17 @@
@charset "UTF-8";
body.page-login {
.login-item-header {
background: #f8f9fa;
border-bottom: none;
padding: 1.2rem 1.5rem;
h6 {
font-weight: bold;
font-size: 1rem;
}
}
.card {
border: none;
}
}

7
resources/beike/shop/default/module-tab-product.scss vendored
View File

@ -3,7 +3,12 @@
.module-tab-product {
.nav {
.nav-link {
color: #333;
color: #6c757d;
&.active {
color: #111;
font-weight: bold;
}
}
}
}

35
resources/beike/shop/default/product.scss vendored Normal file
View File

@ -0,0 +1,35 @@
@charset "UTF-8";
body.page-product {
.product-image {
.left {
margin-right: 1rem;
> div {
margin-bottom: 1rem;
}
}
}
.peoduct-info {
padding-left: 3rem;
.rating-wrap {
margin-bottom: 2rem;
.rating {
margin-right: .5rem;
i {
color: $primary;
}
}
}
.price-wrap {
.new-price {
margin-right: .6rem;
font-size: 1.6rem;
line-height: 1;
}
}
}
}

23
themes/default/home.blade.php
View File

@ -1,5 +1,5 @@
@extends('layout.master')
@section('body-class', 'page-home')
@section('content')
<section class="module-wrap mb-5"><img src="{{ asset('image/default/banner.png') }}" class="img-fluid"></section>
{{-- @foreach ($categories as $category)
@ -19,30 +19,27 @@
</div>
</div>
</section>
<section class="module-tab-product mb-4">
<div class="module-title">推荐商品模块</div>
<div class="container">
<div class="nav justify-content-center mb-3">
<a class="nav-link active" href="#tab-product-1" data-bs-toggle="tab">Women</a>
<a class="nav-link" href="#tab-product-2" data-bs-toggle="tab">Men</a>
<a class="nav-link" href="#tab-product-3" data-bs-toggle="tab">Kids</a>
@foreach ($category_products as $key => $category)
<a class="nav-link {{ $loop->first ? 'active' : '' }}" href="#tab-product-{{ $loop->index }}" data-bs-toggle="tab">{{ $key }}</a>
@endforeach
</div>
<div class="tab-content">
<div class="tab-pane fade show active" id="tab-product-1">
@foreach ($category_products as $products)
<div class="tab-pane fade show {{ $loop->first ? 'active' : '' }}" id="tab-product-{{ $loop->index }}">
<div class="row">
@for ($i = 0; $i < 10; $i++)
@foreach ($products as $product)
<div class="col-6 col-md-4 col-lg-3">
@include('layout.product')
</div>
@endfor
@endforeach
</div>
</div>
<div class="tab-pane fade" id="tab-product-2">
22222
</div>
<div class="tab-pane fade" id="tab-product-3">
33333
</div>
@endforeach
</div>
</div>
</section>

14
themes/default/layout/header.blade.php
View File

@ -36,7 +36,7 @@
</div>
<div class="header-content py-3">
<div class="container navbar-expand-lg">
<div class="logo"><a href="http://"><img src="{{ asset('image/logo.png') }}" class="img-fluid"></a></div>
<div class="logo"><a href="{{ shop_route('home.index') }}"><img src="{{ asset('image/logo.png') }}" class="img-fluid"></a></div>
<div class="menu-wrap">
<ul class="navbar-nav mx-auto">
@foreach ($categories as $category)
@ -59,8 +59,16 @@
<ul class="navbar-nav flex-row">
<li class="nav-item"><a href="" class="nav-link"><i class="iconfont">&#xe8d6;</i></a></li>
<li class="nav-item"><a href="" class="nav-link"><i class="iconfont">&#xe662;</i></a></li>
<li class="nav-item"><a href="" class="nav-link"><i class="iconfont">&#xe619;</i></a></li>
<li class="nav-item"><a href="" class="nav-link"><i class="iconfont">&#xe634;</i></a></li>
<li class="nav-item dropdown">
<a href="" class="nav-link"><i class="iconfont">&#xe619;</i></a>
<ul class="dropdown-menu dropdown-menu-right">
<li><a href="/accounts" class="dropdown-item">个人中心</a></li>
<li><a href="{{ shop_route('login.index') }}" class="dropdown-item">登录/注册</a></li>
</ul>
</li>
<li class="nav-item">
<a href="" class="nav-link"><i class="iconfont">&#xe634;</i></a>
</li>
</ul>
</div>
</div>

6
themes/default/layout/master.blade.php
View File

@ -7,12 +7,12 @@
<title>首页</title>
<link rel="stylesheet" type="text/css" href="{{ asset('/build/beike/shop/default/css/bootstrap.css') }}">
<script src="{{ asset('vendor/jquery/jquery-3.6.0.min.js') }}"></script>
<script src="{{ asset('vendor/bootstrap-4.6.1/js/bootstrap.bundle.min.js') }}"></script>
<script src="{{ asset('vendor/bootstrap-4.6.1/js/bootstrap.min.js') }}"></script>
<script src="{{ asset('vendor/bootstrap/5.1.3/js/bootstrap.bundle.min.js') }}"></script>
<script src="{{ asset('vendor/bootstrap/5.1.3/js/bootstrap.min.js') }}"></script>
<link rel="stylesheet" type="text/css" href="{{ asset('/build/beike/shop/default/css/app.css') }}">
@stack('header')
</head>
<body>
<body class="@yield('body-class')">
@include('layout.header')
@yield('content')

2
themes/default/layout/product.blade.php
View File

@ -1,6 +1,6 @@
<div class="product-wrap">
<div class="image"><img src="{{ asset('image/default/zhanweitu.png') }}" class="img-fluid"></div>
<div class="product-name">这是一个产品名称名称名称</div>
<div class="product-name">{{ $product['name'] }}</div>
<div class="product-price">
<span class="price-new">$55.00</span>
<span class="price-lod">$125.00</span>

126
themes/default/login.blade.php
View File

@ -1,42 +1,114 @@
@extends('layout.master')
@section('body-class', 'page-login')
@section('content')
<div class="container">
<h1>Login</h1>
<form action="{{ route('shop.login.store') }}" method="post">
@csrf
<div class="container">
<nav aria-label="breadcrumb">
<ol class="breadcrumb justify-content-center">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Library</li>
</ol>
</nav>
<div class="hero-content pb-5 text-center"><h1 class="hero-heading">用户登录与注册</h1></div>
<div class="justify-content-center row mb-5">
<div class="col-lg-5">
<div class="card">
<div class="login-item-header card-header">
<h6 class="text-uppercase mb-0">Login</h6>
</div>
<div class="card-body">
<p class="lead">Already our customer?</p>
<p class="text-muted">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis
egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit
amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
<hr>
<div class="form-group">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text" id="email">邮箱</span>
</div>
<input type="text" name="email" class="form-control" value="{{ old('email') }}" placeholder="邮箱地址">
</div>
<form action="{{ route('shop.login.store') }}" method="post">
@csrf
<div class="mb-4">
<label class="form-label" for="email_1">Email</label>
<input type="text" name="email" class="form-control" value="{{ old('email') }}" placeholder="邮箱地址">
@error('email')
<x-admin::form.error :message="$message" />
<x-admin::form.error :message="$message" />
@enderror
</div>
</div>
<div class="form-group">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text" id="password">密码</span>
</div>
<input type="password" name="password" class="form-control" placeholder="密码">
</div>
<div class="mb-4">
<label class="form-label" for="email_1">Password</label>
<input type="password" name="password" class="form-control" placeholder="密码">
@error('password')
<x-admin::form.error :message="$message" />
<x-admin::form.error :message="$message" />
@enderror
</div>
</div>
@if (session('error'))
@if (session('error'))
<div class="alert alert-success">
{{ session('error') }}
{{ session('error') }}
</div>
@endif
@endif
<button type="submit" class="btn btn-primary btn-block mb-4">登录</button>
</form>
<div class="mb-4">
<button type="submit" class="btn btn-outline-dark"><i class="bi bi-box-arrow-in-right"></i> 登录</button>
</div>
</form>
</div>
</div>
</div>
<div class="col-lg-5">
<div class="card">
<div class="login-item-header card-header">
<h6 class="text-uppercase mb-0">New account</h6>
</div>
<div class="card-body">
<p class="lead">Not our registered customer yet?</p>
<p class="text-muted">With registration with us new world of fashion, fantastic discounts and much more opens to
you! The whole process will not take you more than a minute!</p>
<p class="text-muted">If you have any questions, please feel free to <a href="/contact">contact us</a>, our
customer service center is working for you 24/7.</p>
<hr>
<form action="{{ route('shop.register.store') }}" method="post">
@csrf
<div class="mb-4">
<label class="form-label" for="name">邮箱</label>
<input type="text" name="email" class="form-control" value="{{ old('email') }}" placeholder="邮箱地址">
@error('email')
<x-admin::form.error :message="$message" />
@enderror
</div>
<div class="mb-4">
<label class="form-label" for="name">密码</label>
<input type="password" name="password" class="form-control" placeholder="密码">
@error('password')
<x-admin::form.error :message="$message" />
@enderror
</div>
<div class="mb-4">
<label class="form-label" for="name">密码</label>
<input type="password" name="password" class="form-control" placeholder="密码">
@error('password')
<x-admin::form.error :message="$message" />
@enderror
</div>
@if (session('error'))
<div class="alert alert-success">
{{ session('error') }}
</div>
@endif
<div class="mb-4">
<button type="submit" class="btn btn-outline-dark"><i class="bi bi-person"></i> 注册</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection

84
themes/default/pages/accounts.blade.php Normal file
View File

@ -0,0 +1,84 @@
@extends('layout.master')
@section('body-class', 'page-account')
@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">
<div class="col-3">
<div class="account-info">
<div class="head">
<div class="portrait"><img src="http://fpoimg.com/120x120" class="img-fluid"></div>
<div class="account-name">Pu shuo</div>
<div class="account-email">229102104@qq.com</div>
</div>
<nav class="list-group account-links">
<a class="list-group-item d-flex justify-content-between align-items-center active" href="">
<span>个人中心</span></a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="">
<span>我的订单</span><span class="px-3 badge rounded-pill bg-dark">5</span></a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="">
<span>我的收藏</span><span class="px-3 badge rounded-pill bg-dark">5</span></a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="">
<span>我的收藏</span></a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="">
<span>我的收藏</span></a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="">
<span>我的收藏</span></a>
<a class="list-group-item d-flex justify-content-between align-items-center" href="">
<span>我的收藏</span></a>
</nav>
</div>
</div>
<div class="col-9">
<div class="card mb-4 account-card">
<div class="card-header d-flex justify-content-between align-items-center">
<h6 class="mb-0">个人中心</h6>
<a href="http://" class="text-muted">修改休息</a>
</div>
<div class="card-body">
<div class="d-flex flex-nowrap card-items">
<a href="http://" class="d-flex flex-column align-items-center"><i class="iconfont">&#xe77f;</i><span
class="text-muted">收藏</span></a>
<a href="http://" class="d-flex flex-column align-items-center"><i class="iconfont">&#xe6a3;</i><span
class="text-muted">优惠券</span></a>
<a href="http://" class="d-flex flex-column align-items-center"><i class="iconfont">&#xe6a3;</i><span
class="text-muted">优惠券</span></a>
</div>
</div>
</div>
<div class="card account-card">
<div class="card-header d-flex justify-content-between align-items-center">
<h6 class="mb-0">我的订单</h6>
<a href="http://" class="text-muted">全部订单</a>
</div>
<div class="card-body">
<div class="d-flex flex-nowrap card-items mb-4">
<a href="http://" class="d-flex flex-column align-items-center"><i class="iconfont">&#xf12f;</i><span
class="text-muted">待付款</span></a>
<a href="http://" class="d-flex flex-column align-items-center"><i class="iconfont">&#xf130;</i><span
class="text-muted">待发货</span></a>
<a href="http://" class="d-flex flex-column align-items-center"><i class="iconfont">&#xf131;</i><span
class="text-muted">待收货</span></a>
<a href="http://" class="d-flex flex-column align-items-center"><i class="iconfont">&#xf132;</i><span
class="text-muted">售后</span></a>
</div>
<div class="order-wrap">
<div class="no-order d-flex flex-column align-items-center">
<div class="icon mb-2"><i class="iconfont">&#xe60b;</i></div>
<div class="text mb-3 text-muted">您还没有订单！<a href="">去下单</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection

44
themes/default/pages/product.blade.php Normal file
View File

@ -0,0 +1,44 @@
@extends('layout.master')
@section('body-class', 'page-product')
@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">
<div class="col-12 col-md-6">
<div class="product-image d-flex">
<div class="left">
@for ($i = 0; $i < 5; $i++)
<div class=""><img src="http://fpoimg.com/100x100?bg_color=f3f3f3" class="img-fluid"></div>
@endfor
</div>
<div class="right"><img src="http://fpoimg.com/560x560?bg_color=f3f3f3" class="img-fluid"></div>
</div>
</div>
<div class="col-12 col-md-6 ps-lg-10">
<div class="peoduct-info">
<h1>Super Oversized T-Shirt With Raw Sleeves In Brown</h1>
<div class="rating-wrap d-flex">
<div class="rating">
@for ($i = 0; $i < 5; $i++)
<i class="iconfont">&#xe628;</i>
@endfor
</div>
<span class="text-muted">132 reviews</span>
</div>
<div class="price-wrap d-flex align-items-end">
<div class="new-price">$815.00</div>
<div class="old-price text-muted text-decoration-line-through">$1015.00</div>
</div>
</div>
</div>
</div>
</div>
@endsection