Commit 693a0bd6 by 肖康

搜索品牌 商品详情页面

parent 434e9d31
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class BrandController extends Controller
{
/**
* Create a new controller instance.
*
* @return void
*/
public function __construct()
{
// $this->middleware('auth');
}
/**
* Show the application dashboard.
*
* @return \Illuminate\Contracts\Support\Renderable
*/
public function map()
{
return view('brand.map');
}
public function list()
{
return view('brand.list');
}
}
.brandmap{
.cons{
.left-box{
width: 200px;
height: 170px;
background: #FFFFFF;
padding: 22px 14px;
p{font-size: 16px;font-weight: bold;}
input{
width: 173px;
height: 32px;
border: 1px solid #164D9A;
border-radius: 4px;
background: #fff;
color:#333;
margin-top: 12px;
}
}
.right-box{
padding: 26px 22px;
background: #Fff;
p{font-size: 18px;font-weight: bold;margin-bottom: 24px;}
.brand-head{
width: 940px;
height: 48px;
background: #DFEAFA;
border-radius: 8px;
line-height: 48px;
font-size: 14px;
color:#555;
padding:0 27px;
margin-bottom: 12px;
span{cursor: pointer; &.act{
color:#333;
font-weight: bold;
}}
}
.brand-con{
width: 940px;
height: 574px;
background: #F7FAFF;
border-radius: 8px;
padding:22px 20px;
overflow-y: auto;
position: relative;
&::-webkit-scrollbar {
width : 2px;
background-color: #EDEDED
}
&::-webkit-scrollbar-thumb {
border-radius : 2px;
background-color: #164D9A
}
}
.brand-group{
.ttl{
font-size: 14px;
color:#333;
padding-bottom: 6px;
border-bottom: 1px solid #DFEAFA;
}
.ttc{
flex-wrap: wrap;
padding:0 23px;
padding-top:12px;
a{
color:#333;
font-size: 14px;
flex:0 0 33.33%;
margin-bottom: 12px;
&:hover{
color:#164D9A;
}
}
}
}
}
}
}
\ No newline at end of file
.brandmap .cons .left-box{width:200px;height:170px;background:#FFFFFF;padding:22px 14px}.brandmap .cons .left-box p{font-size:16px;font-weight:bold}.brandmap .cons .left-box input{width:173px;height:32px;border:1px solid #164D9A;border-radius:4px;background:#fff;color:#333;margin-top:12px}.brandmap .cons .right-box{padding:26px 22px;background:#Fff}.brandmap .cons .right-box p{font-size:18px;font-weight:bold;margin-bottom:24px}.brandmap .cons .right-box .brand-head{width:940px;height:48px;background:#DFEAFA;border-radius:8px;line-height:48px;font-size:14px;color:#555;padding:0 27px;margin-bottom:12px}.brandmap .cons .right-box .brand-head span{cursor:pointer}.brandmap .cons .right-box .brand-head span.act{color:#333;font-weight:bold}.brandmap .cons .right-box .brand-con{width:940px;height:574px;background:#F7FAFF;border-radius:8px;padding:22px 20px;overflow-y:auto;position:relative}.brandmap .cons .right-box .brand-con::-webkit-scrollbar{width:2px;background-color:#EDEDED}.brandmap .cons .right-box .brand-con::-webkit-scrollbar-thumb{border-radius:2px;background-color:#164D9A}.brandmap .cons .right-box .brand-group .ttl{font-size:14px;color:#333;padding-bottom:6px;border-bottom:1px solid #DFEAFA}.brandmap .cons .right-box .brand-group .ttc{flex-wrap:wrap;padding:0 23px;padding-top:12px}.brandmap .cons .right-box .brand-group .ttc a{color:#333;font-size:14px;flex:0 0 33.33%;margin-bottom:12px}.brandmap .cons .right-box .brand-group .ttc a:hover{color:#164D9A}
\ No newline at end of file
.brandlist{
.cons{
.namebox{
font-size: 36px;
color:#333;
font-weight: bold;
margin-top: 20px;
margin-bottom: 20px;
}
.listcon {
background: #fff;
padding : 25px 0;
.stbox {
padding : 0 25px;
font-size: 16px;
color : #555;
.searchCount {
color: #164D9A;
}
.shifth {
margin-top: 20px;
margin-bottom: 15px;
.sort-item{
height: 32px;
padding:0 24px;
background: #FAFAFA;
border: 1px solid #DFEAFA;
border-radius: 8px;
color:#164D9A;
text-align: center;
line-height: 32px;
cursor: pointer;
margin-right: 30px;
position: relative;
.icon{font-size: 12px;display: none;}
&.act{
background: #DFEAFA;
border: 1px solid #164D9A;
&.top{
.tp{
.sx{display: inline;}
}
.bt{
.kx{display: inline;}
}
}
&.bottom{
.tp{
.kx{display: inline;}
}
.bt{
.sx{display: inline;}
}
}
}
.tp{
position: absolute;
right:7px;
top:-6px;
color:#164D9A;
}
.bt{
position: absolute;
right:7px;
top:7px;
color:#164D9A;
transform: rotate(180deg);;
}
}
.check-group {
color : #555;
font-size: 16px;
cursor : pointer;
.check {
width : 22px;
height : 22px;
background : #FAFAFA;
border : 1px solid #DFEAFA;
border-radius: 4px;
text-align : center;
line-height : 20px;
i {
color : #164D9A;
font-size: 16px;
position : relative;
top : 1px;
display : none;
}
}
margin-right: 30px;
p {
height : 22px;
line-height: 22px;
margin-left: 9px;
}
&.act {
.check {
background: #DFEAFA;
border : 1px solid #164D9A;
i {
display: inline;
}
}
}
}
.search-shit{
width: 230px;
height: 32px;
background: #FAFAFA;
border: 1px solid #DFEAFA;
border-radius: 8px;
position: relative;
margin-left: 112px;
span.icon{
position: absolute;
right: 0px;
top: -1px;
width: 50px;
height: 32px;
background: #164D9A;
text-align: center;
line-height: 32px;
border-radius: 0px 8px 8px 0px;
cursor: pointer;
i{
font-size: 18px;
color:#fff;
}
}
input{
background: #fff;
display: block;
height: 30px;
line-height: 30px;
color:#333;
padding-left:15px;
width:182px;
}
}
}
}
}
}
}
\ No newline at end of file
.brandlist .cons .namebox{font-size:36px;color:#333;font-weight:bold;margin-top:20px;margin-bottom:20px}.brandlist .cons .listcon{background:#fff;padding:25px 0}.brandlist .cons .listcon .stbox{padding:0 25px;font-size:16px;color:#555}.brandlist .cons .listcon .stbox .searchCount{color:#164D9A}.brandlist .cons .listcon .stbox .shifth{margin-top:20px;margin-bottom:15px}.brandlist .cons .listcon .stbox .shifth .sort-item{height:32px;padding:0 24px;background:#FAFAFA;border:1px solid #DFEAFA;border-radius:8px;color:#164D9A;text-align:center;line-height:32px;cursor:pointer;margin-right:30px;position:relative}.brandlist .cons .listcon .stbox .shifth .sort-item .icon{font-size:12px;display:none}.brandlist .cons .listcon .stbox .shifth .sort-item.act{background:#DFEAFA;border:1px solid #164D9A}.brandlist .cons .listcon .stbox .shifth .sort-item.act.top .tp .sx{display:inline}.brandlist .cons .listcon .stbox .shifth .sort-item.act.top .bt .kx{display:inline}.brandlist .cons .listcon .stbox .shifth .sort-item.act.bottom .tp .kx{display:inline}.brandlist .cons .listcon .stbox .shifth .sort-item.act.bottom .bt .sx{display:inline}.brandlist .cons .listcon .stbox .shifth .sort-item .tp{position:absolute;right:7px;top:-6px;color:#164D9A}.brandlist .cons .listcon .stbox .shifth .sort-item .bt{position:absolute;right:7px;top:7px;color:#164D9A;transform:rotate(180deg)}.brandlist .cons .listcon .stbox .shifth .check-group{color:#555;font-size:16px;cursor:pointer;margin-right:30px}.brandlist .cons .listcon .stbox .shifth .check-group .check{width:22px;height:22px;background:#FAFAFA;border:1px solid #DFEAFA;border-radius:4px;text-align:center;line-height:20px}.brandlist .cons .listcon .stbox .shifth .check-group .check i{color:#164D9A;font-size:16px;position:relative;top:1px;display:none}.brandlist .cons .listcon .stbox .shifth .check-group p{height:22px;line-height:22px;margin-left:9px}.brandlist .cons .listcon .stbox .shifth .check-group.act .check{background:#DFEAFA;border:1px solid #164D9A}.brandlist .cons .listcon .stbox .shifth .check-group.act .check i{display:inline}.brandlist .cons .listcon .stbox .shifth .search-shit{width:230px;height:32px;background:#FAFAFA;border:1px solid #DFEAFA;border-radius:8px;position:relative;margin-left:112px}.brandlist .cons .listcon .stbox .shifth .search-shit span.icon{position:absolute;right:0px;top:-1px;width:50px;height:32px;background:#164D9A;text-align:center;line-height:32px;border-radius:0px 8px 8px 0px;cursor:pointer}.brandlist .cons .listcon .stbox .shifth .search-shit span.icon i{font-size:18px;color:#fff}.brandlist .cons .listcon .stbox .shifth .search-shit input{background:#fff;display:block;height:30px;line-height:30px;color:#333;padding-left:15px;width:182px}
\ No newline at end of file
.classbox{
.class-three-box{
width: 1200px;
background: #fff;
.chead{
width: 1200px;
height: 48px;
background: #DFEAFA;
line-height: 48px;
padding-left:26px;
color:#164D9A;
font-size: 20px;
font-weight: bold;
}
.csec{
width: 1200px;
max-height:160px;
overflow-y: auto;
padding:20px 50px;
&::-webkit-scrollbar {
width: 2px;
background-color: #EDEDED
}
&::-webkit-scrollbar-thumb {
border-radius: 2px;
background-color: #164D9A;
}
a{color:#555;&:hover{color:#164D9A;} float:left;height:20px;width:25%;margin-bottom: 20px;}
}
}
.shit-box{
padding:20px 25px;
p.titletext{font-size: 14px;color:#333;margin-bottom: 15px;}
.brand-box{
width: 294px;
height: 30px;
background: #FFFFFF;
border: 1px solid #DFEAFA;
border-radius: 8px;
position: relative;
span.icon{
position: absolute;
left:15px;
top:6px;
i{
font-size: 18px;
color:#aaa;
}
}
input{
background: #fff;
display: block;
height: 30px;
line-height: 30px;
color:#333;
padding-left:42px;
}
.bcon{
position: absolute;
top:30px;
left:0px;
width:294px;
background: #fff;
box-shadow: 0px 0px 5px #ccc;
max-height: 150px;
overflow-y: auto;
display: none;
p{height:20px;line-height: 20px;padding:5px 15px;color:#333;font-size: 14px;cursor: pointer;&:hover{background: #F0F7FF;color:#164D9A;}}
&::-webkit-scrollbar {
width: 2px;
background-color: #EDEDED
}
&::-webkit-scrollbar-thumb {
border-radius: 2px;
background-color: #164D9A;
}
}
}
}
.mb20{margin-bottom: 20px;}
.listcon{
background: #fff;
padding:25px 0px;
.p25{padding:0 25px;}
.countshead{color:#555;font-size: 16px;}
.butcon{
position: relative;
top:10px;
.but{
width: 100px;
height: 32px;
background: #164D9A;
border-radius: 8px;
text-align: center;
line-height: 32px;
color:#fff;
font-size: 16px;
margin-left: 30px;
}
}
.search-shit{
width: 350px;
height: 32px;
background: #FAFAFA;
border: 1px solid #DFEAFA;
border-radius: 8px;
position: relative;
span.icon{
position: absolute;
right: 0px;
top: -1px;
width: 50px;
height: 32px;
background: #164D9A;
text-align: center;
line-height: 32px;
border-radius: 0px 8px 8px 0px;
cursor: pointer;
i{
font-size: 18px;
color:#fff;
}
}
input{
background: #fff;
display: block;
height: 30px;
line-height: 30px;
color:#333;
padding-left:15px;
width:305px;
}
}
.check-group{
color:#555;
font-size: 16px;
cursor: pointer;
.check{
width: 22px;
height: 22px;
background: #FAFAFA;
border: 1px solid #DFEAFA;
border-radius: 4px;
text-align: center;
line-height: 20px;
i{
color:#164D9A;
font-size: 16px;
position: relative;
top:1px;
display: none;
}
}
margin-left: 50px;
p{height:22px;line-height: 22px;margin-left: 9px;}
&.act{
.check{
background: #DFEAFA;
border: 1px solid #164D9A;
i{display: inline;}
}
}
}
}
}
\ No newline at end of file
.classbox .class-three-box{width:1200px;background:#fff}.classbox .class-three-box .chead{width:1200px;height:48px;background:#DFEAFA;line-height:48px;padding-left:26px;color:#164D9A;font-size:20px;font-weight:bold}.classbox .class-three-box .csec{width:1200px;max-height:160px;overflow-y:auto;padding:20px 50px}.classbox .class-three-box .csec::-webkit-scrollbar{width:2px;background-color:#EDEDED}.classbox .class-three-box .csec::-webkit-scrollbar-thumb{border-radius:2px;background-color:#164D9A}.classbox .class-three-box .csec a{color:#555;float:left;height:20px;width:25%;margin-bottom:20px}.classbox .class-three-box .csec a:hover{color:#164D9A}.classbox .shit-box{padding:20px 25px}.classbox .shit-box p.titletext{font-size:14px;color:#333;margin-bottom:15px}.classbox .shit-box .brand-box{width:294px;height:30px;background:#FFFFFF;border:1px solid #DFEAFA;border-radius:8px;position:relative}.classbox .shit-box .brand-box span.icon{position:absolute;left:15px;top:6px}.classbox .shit-box .brand-box span.icon i{font-size:18px;color:#aaa}.classbox .shit-box .brand-box input{background:#fff;display:block;height:30px;line-height:30px;color:#333;padding-left:42px}.classbox .shit-box .brand-box .bcon{position:absolute;top:30px;left:0px;width:294px;background:#fff;box-shadow:0 0 5px #ccc;max-height:150px;overflow-y:auto;display:none}.classbox .shit-box .brand-box .bcon p{height:20px;line-height:20px;padding:5px 15px;color:#333;font-size:14px;cursor:pointer}.classbox .shit-box .brand-box .bcon p:hover{background:#F0F7FF;color:#164D9A}.classbox .shit-box .brand-box .bcon::-webkit-scrollbar{width:2px;background-color:#EDEDED}.classbox .shit-box .brand-box .bcon::-webkit-scrollbar-thumb{border-radius:2px;background-color:#164D9A}.classbox .mb20{margin-bottom:20px}.classbox .listcon{background:#fff;padding:25px 0px}.classbox .listcon .p25{padding:0 25px}.classbox .listcon .countshead{color:#555;font-size:16px}.classbox .listcon .butcon{position:relative;top:10px}.classbox .listcon .butcon .but{width:100px;height:32px;background:#164D9A;border-radius:8px;text-align:center;line-height:32px;color:#fff;font-size:16px;margin-left:30px}.classbox .listcon .search-shit{width:350px;height:32px;background:#FAFAFA;border:1px solid #DFEAFA;border-radius:8px;position:relative}.classbox .listcon .search-shit span.icon{position:absolute;right:0px;top:-1px;width:50px;height:32px;background:#164D9A;text-align:center;line-height:32px;border-radius:0px 8px 8px 0px;cursor:pointer}.classbox .listcon .search-shit span.icon i{font-size:18px;color:#fff}.classbox .listcon .search-shit input{background:#fff;display:block;height:30px;line-height:30px;color:#333;padding-left:15px;width:305px}.classbox .listcon .check-group{color:#555;font-size:16px;cursor:pointer;margin-left:50px}.classbox .listcon .check-group .check{width:22px;height:22px;background:#FAFAFA;border:1px solid #DFEAFA;border-radius:4px;text-align:center;line-height:20px}.classbox .listcon .check-group .check i{color:#164D9A;font-size:16px;position:relative;top:1px;display:none}.classbox .listcon .check-group p{height:22px;line-height:22px;margin-left:9px}.classbox .listcon .check-group.act .check{background:#DFEAFA;border:1px solid #164D9A}.classbox .listcon .check-group.act .check i{display:inline}
\ No newline at end of file
......@@ -15,6 +15,54 @@
.shifth {
margin-top: 20px;
margin-bottom: 15px;
.sort-item{
height: 32px;
padding:0 24px;
background: #FAFAFA;
border: 1px solid #DFEAFA;
border-radius: 8px;
color:#164D9A;
text-align: center;
line-height: 32px;
cursor: pointer;
margin-right: 30px;
position: relative;
.icon{font-size: 12px;display: none;}
&.act{
background: #DFEAFA;
border: 1px solid #164D9A;
&.top{
.tp{
.sx{display: inline;}
}
.bt{
.kx{display: inline;}
}
}
&.bottom{
.tp{
.kx{display: inline;}
}
.bt{
.sx{display: inline;}
}
}
}
.tp{
position: absolute;
right:7px;
top:-6px;
color:#164D9A;
}
.bt{
position: absolute;
right:7px;
top:7px;
color:#164D9A;
transform: rotate(180deg);;
}
}
.check-group {
color : #555;
font-size: 16px;
......@@ -36,7 +84,7 @@
display : none;
}
}
margin-left: 30px;
margin-right: 30px;
p {
height : 22px;
line-height: 22px;
......
.searchbox .listcon{background:#fff;padding:25px 0}.searchbox .listcon .stbox{padding:0 25px;font-size:16px;color:#555}.searchbox .listcon .stbox .searchCount{color:#164D9A}.searchbox .listcon .stbox .shifth{margin-top:20px;margin-bottom:15px}.searchbox .listcon .stbox .shifth .check-group{color:#555;font-size:16px;cursor:pointer;margin-left:30px}.searchbox .listcon .stbox .shifth .check-group .check{width:22px;height:22px;background:#FAFAFA;border:1px solid #DFEAFA;border-radius:4px;text-align:center;line-height:20px}.searchbox .listcon .stbox .shifth .check-group .check i{color:#164D9A;font-size:16px;position:relative;top:1px;display:none}.searchbox .listcon .stbox .shifth .check-group p{height:22px;line-height:22px;margin-left:9px}.searchbox .listcon .stbox .shifth .check-group.act .check{background:#DFEAFA;border:1px solid #164D9A}.searchbox .listcon .stbox .shifth .check-group.act .check i{display:inline}
\ No newline at end of file
.searchbox .listcon{background:#fff;padding:25px 0}.searchbox .listcon .stbox{padding:0 25px;font-size:16px;color:#555}.searchbox .listcon .stbox .searchCount{color:#164D9A}.searchbox .listcon .stbox .shifth{margin-top:20px;margin-bottom:15px}.searchbox .listcon .stbox .shifth .sort-item{height:32px;padding:0 24px;background:#FAFAFA;border:1px solid #DFEAFA;border-radius:8px;color:#164D9A;text-align:center;line-height:32px;cursor:pointer;margin-right:30px;position:relative}.searchbox .listcon .stbox .shifth .sort-item .icon{font-size:12px;display:none}.searchbox .listcon .stbox .shifth .sort-item.act{background:#DFEAFA;border:1px solid #164D9A}.searchbox .listcon .stbox .shifth .sort-item.act.top .tp .sx{display:inline}.searchbox .listcon .stbox .shifth .sort-item.act.top .bt .kx{display:inline}.searchbox .listcon .stbox .shifth .sort-item.act.bottom .tp .kx{display:inline}.searchbox .listcon .stbox .shifth .sort-item.act.bottom .bt .sx{display:inline}.searchbox .listcon .stbox .shifth .sort-item .tp{position:absolute;right:7px;top:-6px;color:#164D9A}.searchbox .listcon .stbox .shifth .sort-item .bt{position:absolute;right:7px;top:7px;color:#164D9A;transform:rotate(180deg)}.searchbox .listcon .stbox .shifth .check-group{color:#555;font-size:16px;cursor:pointer;margin-right:30px}.searchbox .listcon .stbox .shifth .check-group .check{width:22px;height:22px;background:#FAFAFA;border:1px solid #DFEAFA;border-radius:4px;text-align:center;line-height:20px}.searchbox .listcon .stbox .shifth .check-group .check i{color:#164D9A;font-size:16px;position:relative;top:1px;display:none}.searchbox .listcon .stbox .shifth .check-group p{height:22px;line-height:22px;margin-left:9px}.searchbox .listcon .stbox .shifth .check-group.act .check{background:#DFEAFA;border:1px solid #164D9A}.searchbox .listcon .stbox .shifth .check-group.act .check i{display:inline}
\ No newline at end of file
.skubox .class-three-box{width:1200px;background:#fff}.skubox .class-three-box .chead{width:1200px;height:48px;background:#DFEAFA;line-height:48px;padding-left:26px;color:#164D9A;font-size:20px;font-weight:bold}.skubox .class-three-box .csec{width:1200px;max-height:160px;overflow-y:auto;padding:20px 50px}.skubox .class-three-box .csec::-webkit-scrollbar{width:2px;background-color:#EDEDED}.skubox .class-three-box .csec::-webkit-scrollbar-thumb{border-radius:2px;background-color:#164D9A}.skubox .class-three-box .csec a{color:#555;float:left;height:20px;width:25%;margin-bottom:20px}.skubox .class-three-box .csec a:hover{color:#164D9A}.skubox .shit-box{padding:20px 25px}.skubox .shit-box p.titletext{font-size:14px;color:#333;margin-bottom:15px}.skubox .shit-box .brand-box{width:294px;height:30px;background:#FFFFFF;border:1px solid #DFEAFA;border-radius:8px;position:relative}.skubox .shit-box .brand-box span.icon{position:absolute;left:15px;top:6px}.skubox .shit-box .brand-box span.icon i{font-size:18px;color:#aaa}.skubox .shit-box .brand-box input{background:#fff;display:block;height:30px;line-height:30px;color:#333;padding-left:42px}.skubox .shit-box .brand-box .bcon{position:absolute;top:30px;left:0px;width:294px;background:#fff;box-shadow:0 0 5px #ccc;max-height:150px;overflow-y:auto;display:none}.skubox .shit-box .brand-box .bcon p{height:20px;line-height:20px;padding:5px 15px;color:#333;font-size:14px;cursor:pointer}.skubox .shit-box .brand-box .bcon p:hover{background:#F0F7FF;color:#164D9A}.skubox .shit-box .brand-box .bcon::-webkit-scrollbar{width:2px;background-color:#EDEDED}.skubox .shit-box .brand-box .bcon::-webkit-scrollbar-thumb{border-radius:2px;background-color:#164D9A}.skubox .mb20{margin-bottom:20px}.skubox .listcon{background:#fff;padding:25px 0px}.skubox .listcon .p25{padding:0 25px}.skubox .listcon .countshead{color:#555;font-size:16px}.skubox .listcon .butcon{position:relative;top:10px}.skubox .listcon .butcon .but{width:100px;height:32px;background:#164D9A;border-radius:8px;text-align:center;line-height:32px;color:#fff;font-size:16px;margin-left:30px}.skubox .listcon .search-shit{width:350px;height:32px;background:#FAFAFA;border:1px solid #DFEAFA;border-radius:8px;position:relative}.skubox .listcon .search-shit span.icon{position:absolute;right:0px;top:-1px;width:50px;height:32px;background:#164D9A;text-align:center;line-height:32px;border-radius:0px 8px 8px 0px;cursor:pointer}.skubox .listcon .search-shit span.icon i{font-size:18px;color:#fff}.skubox .listcon .search-shit input{background:#fff;display:block;height:30px;line-height:30px;color:#333;padding-left:15px;width:305px}.skubox .listcon .check-group{color:#555;font-size:16px;cursor:pointer;margin-left:50px}.skubox .listcon .check-group .check{width:22px;height:22px;background:#FAFAFA;border:1px solid #DFEAFA;border-radius:4px;text-align:center;line-height:20px}.skubox .listcon .check-group .check i{color:#164D9A;font-size:16px;position:relative;top:1px;display:none}.skubox .listcon .check-group p{height:22px;line-height:22px;margin-left:9px}.skubox .listcon .check-group.act .check{background:#DFEAFA;border:1px solid #164D9A}.skubox .listcon .check-group.act .check i{display:inline}
\ No newline at end of file
.skubox .cons{padding:20px;background:#fff}.skubox .cons .detailtop .left .imgbox{width:224px;height:224px;background:#FFFFFF;border:1px solid #DFEAFA}.skubox .cons .detailtop .left .imgbox img{max-height:220px;max-width:224px;display:block;margin:0 auto}.skubox .cons .detailtop .left .imgtips{margin-top:9px;font-size:14px;color:#555;text-align:center}.skubox .cons .detailtop .left .skuinfo{width:465px;margin-left:35px}.skubox .cons .detailtop .left .skuinfo .h3{color:#222;font-weight:bold;font-size:20px;border-bottom:1px solid #DFEAFA;padding-bottom:10px}.skubox .cons .detailtop .left .skuinfo .group-info{font-size:14px;margin-top:20px;margin-bottom:25px}.skubox .cons .detailtop .left .skuinfo .group-info .label{color:#222}.skubox .cons .detailtop .left .skuinfo .group-info .contents{color:#555;margin-left:60px}.skubox .cons .detailtop .left .skuinfo .group-info .contents .pdf{color:#F68332;font-size:20px}.skubox .cons .detailtop .right{width:398px}.skubox .cons .detailtop .right .stores{color:#222;font-size:20px;font-weight:bold;border-bottom:1px solid #DFEAFA;padding-bottom:10px}.skubox .cons .detailtop .right .numtitle{color:#222;font-size:14px;font-weight:bold;margin-top:22px;margin-bottom:14px}.skubox .cons .detailtop .right .inputval{display:block;width:400px;height:32px;background:#FAFAFA;border:1px solid #DFEAFA;border-radius:4px;color:#222}.skubox .cons .detailtop .right .pricebox{margin-top:20px}.skubox .cons .detailtop .right .pricebox .group-tp{flex-wrap:wrap;color:#555;font-size:14px;margin-bottom:14px}.skubox .cons .detailtop .right .pricebox .group-tp div{flex:0 0 33.33%;text-align:right}.skubox .cons .detailtop .right .pricebox .group-tp div.lt{text-align:left}.skubox .cons .detailtop .right .pricebox .group-tp.tt{color:#222}.skubox .cons .detailtop .right .pricebox .group-tp.tt div{font-weight:bold}.skubox .cons .detailtop .right .totalMoney{font-size:20px;color:#222;font-weight:bold;text-align:right}.skubox .cons .detailtop .right .butbox{margin-top:20px}.skubox .cons .detailtop .right .butbox .buts{width:120px;height:32px;background:#164D9A;border-radius:8px;color:#fff;font-size:14px;text-align:center;line-height:32px;margin-left:36px;cursor:pointer}.skubox .cons .detailtop .right .butbox .buts.leftbut{position:relative;left:100px}.skubox .cons .detailbottom{margin-top:40px}.skubox .cons .detailbottom .left .model{font-weight:bold;color:#222;font-size:20px;margin-bottom:14px}.skubox .cons .detailbottom .left .more-sku{width:704px}.skubox .cons .detailbottom .left .more-sku .sku-group{font-size:14px;color:#555;line-height:24px}.skubox .cons .detailbottom .left .more-sku .sku-group .skuimgbox{width:161px;height:161px;background:#FFFFFF;border:1px solid #DFEAFA;margin-bottom:15px}.skubox .cons .detailbottom .left .more-sku .sku-group .skuimgbox img{max-width:159px;max-height:159px;display:block;margin:0 auto}.skubox .cons .detailbottom .left .more-sku .sku-group div{width:161px}.skubox .cons .detailbottom .left .more-sku .sku-group .prc{color:#333}.skubox .cons .detailbottom .right{width:398px}.skubox .cons .detailbottom .right .jttitle{font-weight:bold;font-size:20px;color:#222}.skubox .cons .detailbottom .right .qm{font-size:14px;color:#555;margin:20px 0}.skubox .cons .detailbottom .right .qm span{margin-right:100px}.skubox .cons .detailbottom .right .jthead{font-size:14px;color:#555;flex-wrap:wrap;width:398px;line-height:42px;height:42px;background:#DFEAFA;border-radius:8px 8px 0px 0px;padding-left:25px}.skubox .cons .detailbottom .right .jthead div{flex:0 0 33.33%}.skubox .cons .detailbottom .right .jtcon{width:398px;min-height:210px;background:#F7FAFF;border-radius:0px 0px 8px 8px;padding-left:25px;padding-top:20px;padding-bottom:10px}.skubox .cons .detailbottom .right .jtcon .jtpgroup{flex-wrap:wrap;width:398px;margin-bottom:20px}.skubox .cons .detailbottom .right .jtcon .jtpgroup div.item{flex:0 0 33.33%;color:#555;font-size:14px}.skubox .cons .detailbottom .right .jtcon .jtpgroup div.item.jti{color:#164D9A}
\ No newline at end of file
define('map', [], function (require, exports, module) {
var map = {
init: function () {
map.handle();
},
handle: function () {
$(".brand-head span").click(function(){
$(".brand-head span").removeClass("act")
$(this).addClass("act");
var guid_=$(this).attr("guid");
var top_=$(".brand-group[guid='"+guid_+"']").position().top;
var scroll_top=$(".brand-con").scrollTop();
$(".brand-con").stop().animate({
scrollTop:(top_+scroll_top-10)
})
})
}
}
module.exports = map.init();
})
seajs.use(['map'])
\ No newline at end of file
@extends('layouts.appMall')
@section('css')
<link rel="stylesheet" href="{{$public}}/assets/css/brand/list.min.css?v={{time()}}">
@endsection
@section('body')
<div class="mallpage">
@include('common.mallHeaderTop')
@include('common.mallHeaderNav')
<div class="brandlist w1200">
<div class="bread-menu row boxsiz">
<a href="">Home</a>
<i>></i>
<a href="">Manufacturers</a>
<i>></i>
<span>NXP</span>
</div>
<div class="cons">
<div class="namebox">NXP Semiconductors</div>
<div class="listcon boxsiz w1200">
<div class="stbox">
<div>The Results of NXP Semiconductors <span class="searchCount">26</span></div>
<div class="row shifth">
<div class="sort-item">
<div>All Listings</div>
</div>
<div class="sort-item act top">
<div>Availability</div>
<span class="tp">
<i class="icon iconfont icon-a-sanjiaoxing-xiantiaofan kx"></i>
<span class="icon iconfont icon-sanjiaoxing-tianchong sx"></span>
</span>
<span class="bt">
<i class="icon iconfont icon-a-sanjiaoxing-xiantiaofan kx"></i>
<span class="icon iconfont icon-sanjiaoxing-tianchong sx"></span>
</span>
</div>
<div class="sort-item act bottom">
<div>Prices</div>
<span class="tp">
<i class="icon iconfont icon-a-sanjiaoxing-xiantiaofan kx"></i>
<span class="icon iconfont icon-sanjiaoxing-tianchong sx"></span>
</span>
<span class="bt">
<i class="icon iconfont icon-a-sanjiaoxing-xiantiaofan kx"></i>
<span class="icon iconfont icon-sanjiaoxing-tianchong sx"></span>
</span>
</div>
<div class="check-group row verCenter act">
<div class="check">
<i class="icon iconfont icon-gou"></i>
</div>
<p>Exact Match</p>
</div>
<div class="check-group row verCenter ">
<div class="check">
<i class="icon iconfont icon-gou"></i>
</div>
<p>Show what's available</p>
</div>
<div class="search-shit boxsiz">
<span class="icon"><i class="icon iconfont icon-shouyesousuo"></i></span>
<input type="text" placeholder="Search in the results">
</div>
</div>
</div>
<div class="datalistcon boxsiz">
<div class="list-th boxsiz row">
<div class="th w180">Part NO.</div>
<div class="th w180">Manufacturer</div>
<div class="th w280">Availability/Sales Unit/Full Reel</div>
<div class="th w140">Delivery date</div>
<div class="th w180">Prices</div>
<div class="th">Options</div>
</div>
<div class="data-td">
<div class="td-group boxsiz row">
<div class="td w180">
<a href="" class="goodsname">RC0603JR-0710KL</a>
<div class="copyname">
<i class="icon iconfont icon-fuzhi"></i>
</div>
</div>
<div class="td w180">
Texas Instruments
<div class="pdflink"> <i class="icon iconfont icon-PDF"></i></div>
</div>
<div class="td w280">
<div> Availability:10000</div>
<div> Min:100 <span class="mult">Mult:100</span></div>
<div> Full Reel:2500</div>
</div>
<div class="td w140">2-5 Weeks</div>
<div class="th w180">
<div class="price-jt">
<div class="price-group row">
<div class="jtpr">5000+</div>
<div class="jtpc">$22.2222</div>
</div>
<div class="price-group row">
<div class="jtpr">50+</div>
<div class="jtpc">$2222.2222</div>
</div>
</div>
</div>
<div class="td">
<div class="input-box ">
<input type="text" class="valuep" onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}">
<div class="addCar">Add</div>
</div>
<div class="total-price">
Total:$144.5
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@include('common.mallFooter')
</div>
@endsection
@section('js')
<script src="{{$public}}/assets/js/brand/list.js?v={{time()}}"></script>
@endsection
\ No newline at end of file
@extends('layouts.appMall')
@section('css')
<link rel="stylesheet" href="{{$public}}/assets/css/brand/brand.min.css?v={{time()}}">
@endsection
@section('body')
<div class="mallpage">
@include('common.mallHeaderTop')
@include('common.mallHeaderNav')
<div class="brandmap w1200">
<div class="bread-menu row boxsiz">
<a href="">Home</a>
<i>></i>
<span>Manufacturers</span>
</div>
<div class="cons row bothSide">
<div class="left-box boxsiz">
<p>REFINE SEARCH</p>
<input type="text">
</div>
<div class="right-box boxsiz">
<p>Manufacturers</p>
<div class="brand-head row boxsiz avarage">
<span guid="#">#</span>
<span guid="A">A</span>
<span guid="B">B</span>
<span guid="C">C</span>
<span guid="D">D</span>
<span guid="E">E</span>
<span guid="F">F</span>
<span guid="G">G</span>
<span guid="H">H</span>
<span guid="I">I</span>
<span guid="J">J</span>
<span guid="K">K</span>
<span guid="L">L</span>
<span guid="M">M</span>
<span guid="N">N</span>
<span guid="O">O</span>
<span guid="P">P</span>
<span guid="Q">Q</span>
<span guid="R">R</span>
<span guid="S">S</span>
<span guid="T">T</span>
<span guid="U">U</span>
<span guid="V">V</span>
<span guid="W">W</span>
<span guid="X">X</span>
<span guid="Y">Y</span>
<span guid="Z">Z</span>
</div>
<div class="brand-con boxsiz">
<div class="brand-group" guid="#">
<div class="ttl">#</div>
<div class="ttc row boxsiz">
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
</div>
</div>
<div class="brand-group" guid="A">
<div class="ttl">A</div>
<div class="ttc row boxsiz">
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
</div>
</div>
<div class="brand-group" guid="B">
<div class="ttl">B</div>
<div class="ttc row boxsiz">
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
</div>
</div>
<div class="brand-group" guid="C">
<div class="ttl">C</div>
<div class="ttc row boxsiz">
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
</div>
</div>
<div class="brand-group" guid="D">
<div class="ttl">D</div>
<div class="ttc row boxsiz">
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
</div>
</div>
<div class="brand-group" guid="E">
<div class="ttl">E</div>
<div class="ttc row boxsiz">
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
</div>
</div>
<div class="brand-group" guid="F">
<div class="ttl">F</div>
<div class="ttc row boxsiz">
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
</div>
</div>
<div class="brand-group" guid="G">
<div class="ttl">G</div>
<div class="ttc row boxsiz">
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
</div>
</div>
<div class="brand-group" guid="H">
<div class="ttl">H</div>
<div class="ttc row boxsiz">
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
<a href="">3DXTECH</a>
<a href="">3G Shielding Specialties</a>
<a href="">4D Systems</a>
</div>
</div>
</div>
</div>
</div>
</div>
@include('common.mallFooter')
</div>
@endsection
@section('js')
<script src="{{$public}}/assets/js/brand/map.js?v={{time()}}"></script>
@endsection
\ No newline at end of file
@extends('layouts.appMall')
@section('css')
<link rel="stylesheet" href="{{$public}}/assets/css/class/class.min.css?v={{time()}}">
@endsection
@section('body')
<div class="mallpage">
@include('common.mallHeaderTop')
@include('common.mallHeaderNav')
<div class="classbox w1200">
<div class="bread-menu row boxsiz">
<a href="">Home</a>
<i>></i>
<a href="">Discrete Semiconductor Products</a>
<i>></i>
<span>Diodes - Zener - Single</span>
</div>
<div class="class-three-box boxsiz">
<div class="chead boxsiz">Discrete Semiconductor Products(100000)</div>
<div class="csec boxsiz clear">
<a href="">Diodes - Zener - Single(100000)</a>
<a href="">Diodes - Zener - Single(100000)</a>
</div>
</div>
<div class="shit-box boxsiz">
<p class="titletext">Manufacturer</p>
<div class="shift-con row boxsiz">
<div class="brand-box">
<span class="icon"><i class="icon iconfont icon-shouyesousuo"></i></span>
<input type="text" placeholder="search">
<div class="bcon boxsiz">
<p>TI</p>
</div>
</div>
</div>
</div>
<div class="listcon boxsiz w1200">
<div class="row p25 bothSide">
<div class="countshead">Filtering results:19452</div>
<div class="butcon row">
<div class="but">Search</div>
<div class="but">Reset</div>
</div>
</div>
<div class="row p25 mb20">
<div class="search-shit boxsiz">
<span class="icon"><i class="icon iconfont icon-shouyesousuo"></i></span>
<input type="text" placeholder="search">
</div>
<div class="check-group row verCenter ">
<div class="check">
<i class="icon iconfont icon-gou"></i>
</div>
<p>Show what's available</p>
</div>
</div>
<div class="datalistcon boxsiz">
<div class="list-th boxsiz row">
<div class="th w180">Part NO.</div>
<div class="th w180">Manufacturer</div>
<div class="th w280">Availability/Sales Unit/Full Reel</div>
<div class="th w140">Delivery date</div>
<div class="th w180">Prices</div>
<div class="th">Options</div>
</div>
<div class="data-td">
<div class="td-group boxsiz row">
<div class="td w180">
<a href="" class="goodsname">RC0603JR-0710KL</a>
<div class="copyname">
<i class="icon iconfont icon-fuzhi"></i>
</div>
</div>
<div class="td w180">
Texas Instruments
<div class="pdflink"> <i class="icon iconfont icon-PDF"></i></div>
</div>
<div class="td w280">
<div> Availability:10000</div>
<div> Min:100 <span class="mult">Mult:100</span></div>
<div> Full Reel:2500</div>
</div>
<div class="td w140">2-5 Weeks</div>
<div class="th w180">
<div class="price-jt">
<div class="price-group row">
<div class="jtpr">5000+</div>
<div class="jtpc">$22.2222</div>
</div>
<div class="price-group row">
<div class="jtpr">50+</div>
<div class="jtpc">$2222.2222</div>
</div>
</div>
</div>
<div class="td">
<div class="input-box ">
<input type="text" class="valuep" onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}">
<div class="addCar">Add</div>
</div>
<div class="total-price">
Total:$144.5
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@include('common.mallFooter')
</div>
@endsection
@section('js')
<script src="{{$public}}/assets/js/class/class.js?v={{time()}}"></script>
@endsection
\ No newline at end of file
......@@ -18,9 +18,31 @@
<div>The Results of NXP Semiconductors <span class="searchCount">26</span></div>
<div class="row shifth">
<div class="sort-item">
<div>All Listings</div>
</div>
<div class="check-group row verCenter ">
<div class="sort-item act top">
<div>Availability</div>
<span class="tp">
<i class="icon iconfont icon-a-sanjiaoxing-xiantiaofan kx"></i>
<span class="icon iconfont icon-sanjiaoxing-tianchong sx"></span>
</span>
<span class="bt">
<i class="icon iconfont icon-a-sanjiaoxing-xiantiaofan kx"></i>
<span class="icon iconfont icon-sanjiaoxing-tianchong sx"></span>
</span>
</div>
<div class="sort-item act bottom">
<div>Prices</div>
<span class="tp">
<i class="icon iconfont icon-a-sanjiaoxing-xiantiaofan kx"></i>
<span class="icon iconfont icon-sanjiaoxing-tianchong sx"></span>
</span>
<span class="bt">
<i class="icon iconfont icon-a-sanjiaoxing-xiantiaofan kx"></i>
<span class="icon iconfont icon-sanjiaoxing-tianchong sx"></span>
</span>
</div>
<div class="check-group row verCenter act">
<div class="check">
<i class="icon iconfont icon-gou"></i>
</div>
......
......@@ -40,4 +40,8 @@ Route::get('/about/refund', 'AboutController@refund')->name('about.refund');
Route::get('/mall', 'MallController@index')->name('mall.index');
Route::get('/sku', 'SkuController@detail')->name('sku.detail');
Route::get('/class', 'ClassificationController@index')->name('classification.index');
Route::get('/brand/map', 'BrandController@map')->name('brand.map');
Route::get('/brand/list', 'BrandController@list')->name('brand.list');
Route::get('/search', 'SearchController@index')->name('search.idnex');
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment