Skip to content

肖康 / Europa-web

Go to a project
Commit 0c40b45e by 肖康
Options

搜索

parent 6c9fe490
Inline Side-by-side
Showing with 57 additions and 4 deletions
pages/search/[keyword].tsx
......@@ -231,7 +231,7 @@ const Page = (props: { cateList: ResponseTypeCateList }) => {
supplierList.map((item, index) => {
return (
item.data.length > 0 &&
<div className={styles.dataGroupSupplier} key={String(item.supplier_id) + index + Math.random()}>
<div className={styles.dataGroupSupplier} id={`supplierBox${item.supplier_id}`} key={String(item.supplier_id) + index + Math.random()}>
<div className={styles.dataListTitle}>{item.supplier_name || '其他'}</div>
<div className={styles.searchListDatas}>
{
......@@ -252,6 +252,12 @@ const Page = (props: { cateList: ResponseTypeCateList }) => {
</div>
<div className={`${styles.fixedSupplierBox}`}>
<p>dddddd</p>
<p>dddddd</p>
<p>dddddd</p>
</div>
</div>
<Footer />
......
pages/search/index.module.css
......@@ -2,6 +2,31 @@
margin-bottom: 70px;
}
.mvSearchPage .fixedSupplierBox {
position: fixed;
top: 225px;
transform: translateX(-220px);
}
.mvSearchPage .fixedSupplierBox p {
width: 200px;
box-sizing: border-box;
padding-right: 12px;
border-right: 2px solid #ccc;
font-size: 14px;
height: 32px;
line-height: 32px;
color: #333;
text-align: right;
transition: all 0.6s;
}
.mvSearchPage .fixedSupplierBox p:hover {
color: #FF9A00;
border-right: 2px solid #FF9A00;
cursor: pointer;
}
.mvSearchPage .shiftBox {
padding: 24px 30px;
background: #fff;
......
pages/search/index.module.min.css
.mvSearchPage{margin-bottom:70px}.mvSearchPage .shiftBox{padding:24px 30px;background:#fff;padding-bottom:6px}.mvSearchPage .shiftBox .shiftGroup{border-bottom:1px solid #E7E7E7;margin-bottom:18px}.mvSearchPage .shiftBox .shiftGroup span{font-weight:bold;font-size:12px;color:#888888;padding-top:2px;width:50px}.mvSearchPage .shiftBox .shiftGroup:last-child{border-bottom:0px;margin-bottom:0px}.mvSearchPage .shiftBox .shiftGroup .itemBox{width:1000px;flex-wrap:wrap;min-height:40px}.mvSearchPage .shiftBox .shiftGroup .itemBox.overflowheight{height:40px;overflow:hidden}.mvSearchPage .shiftBox .shiftGroup .itemBox .item{height:22px;border:1px solid transparent;line-height:20px;box-sizing:border-box;margin-left:45px;margin-bottom:18px;font-size:12px;color:#000;cursor:pointer;text-align:center;padding:0 15px}.mvSearchPage .shiftBox .shiftGroup .itemBox .item.act{background:#FFFBF5;border:1px solid #FF9A00}.mvSearchPage .shiftBox .shiftGroup .shitrankbox{width:130px;justify-content:flex-end}.mvSearchPage .shiftBox .shiftGroup .shitrank{margin-left:5px;height:22px;width:58px;border:1px solid #B0B0B0;box-sizing:border-box;color:#919191;font-size:12px;cursor:pointer}.mvSearchPage .shiftBox .shiftGroup .shitrank.shows{display:flex}.mvSearchPage .shiftBox .shiftGroup .shitrank.hides{display:none}.mvSearchPage .shiftBox .shiftGroup .shitrank:first-child{margin-left:0px}.mvSearchPage .shiftBox .shiftGroup .shitrank i{color:#919191;font-size:12px}.mvSearchPage .databox{padding-top:24px;min-height:290px}.mvSearchPage .databox .searchLoadingBox{padding-top:40px 0}.mvSearchPage .databox .searchLoadingBox img{width:220px;height:220px;display:block;margin:0 auto}.mvSearchPage .databox .dataGroupSupplier{border:1px solid #EDEFEF;margin-bottom:30px}.mvSearchPage .databox .dataGroupSupplier .searchListDatas .listGroupOneItem:first-child .cons{border-top:0px}.mvSearchPage .databox .dataGroupSupplier .dataListTitle{padding:0 27px;height:50px;line-height:50px;font-size:16px;color:#000000;background:#f6f6f6}.mvSearchPage .databox .dataGroupSupplier .dataListMore{height:48px;line-height:48px;color:#000;font-size:12px;text-align:center;background:#fff}.mvSearchPage .databox .dataGroupSupplier .dataListMore b{color:#FF9A00;cursor:pointer}.mvSearchPage .databox .tableboxt{width:1226px;height:34px}.mvSearchPage .databox .tableTitle{width:1226px;height:34px;background:#F2EEE6;border:1px solid #E5DFD3;line-height:34px;display:flex;box-sizing:border-box;padding-left:17px}.mvSearchPage .databox .tableTitle.tableTitleFixed{position:fixed;z-index:4;top:60px}.mvSearchPage .databox .tableTitle>span{padding-left:10px}.mvSearchPage .databox .tableTitle .boxInfo{width:310px}.mvSearchPage .databox .tableTitle .boxCount{width:204px}.mvSearchPage .databox .tableTitle .boxJt{width:89px}.mvSearchPage .databox .tableTitle .boxHk{width:89px}.mvSearchPage .databox .tableTitle .boxMain{width:105px}.mvSearchPage .databox .tableTitle .boxTime{width:168px}.mvSearchPage .databox .tableTitle .boxAction{flex:2}
.mvSearchPage{margin-bottom:70px}.mvSearchPage .fixedSupplierBox{position:fixed;top:225px;transform:translateX(-220px)}.mvSearchPage .fixedSupplierBox p{width:200px;box-sizing:border-box;padding-right:12px;border-right:2px solid #ccc;font-size:14px;height:32px;line-height:32px;color:#333;text-align:right;transition:all 0.6s}.mvSearchPage .fixedSupplierBox p:hover{color:#FF9A00;border-right:2px solid #FF9A00;cursor:pointer}.mvSearchPage .shiftBox{padding:24px 30px;background:#fff;padding-bottom:6px}.mvSearchPage .shiftBox .shiftGroup{border-bottom:1px solid #E7E7E7;margin-bottom:18px}.mvSearchPage .shiftBox .shiftGroup span{font-weight:bold;font-size:12px;color:#888888;padding-top:2px;width:50px}.mvSearchPage .shiftBox .shiftGroup:last-child{border-bottom:0px;margin-bottom:0px}.mvSearchPage .shiftBox .shiftGroup .itemBox{width:1000px;flex-wrap:wrap;min-height:40px}.mvSearchPage .shiftBox .shiftGroup .itemBox.overflowheight{height:40px;overflow:hidden}.mvSearchPage .shiftBox .shiftGroup .itemBox .item{height:22px;border:1px solid transparent;line-height:20px;box-sizing:border-box;margin-left:45px;margin-bottom:18px;font-size:12px;color:#000;cursor:pointer;text-align:center;padding:0 15px}.mvSearchPage .shiftBox .shiftGroup .itemBox .item.act{background:#FFFBF5;border:1px solid #FF9A00}.mvSearchPage .shiftBox .shiftGroup .shitrankbox{width:130px;justify-content:flex-end}.mvSearchPage .shiftBox .shiftGroup .shitrank{margin-left:5px;height:22px;width:58px;border:1px solid #B0B0B0;box-sizing:border-box;color:#919191;font-size:12px;cursor:pointer}.mvSearchPage .shiftBox .shiftGroup .shitrank.shows{display:flex}.mvSearchPage .shiftBox .shiftGroup .shitrank.hides{display:none}.mvSearchPage .shiftBox .shiftGroup .shitrank:first-child{margin-left:0px}.mvSearchPage .shiftBox .shiftGroup .shitrank i{color:#919191;font-size:12px}.mvSearchPage .databox{padding-top:24px;min-height:290px}.mvSearchPage .databox .searchLoadingBox{padding-top:40px 0}.mvSearchPage .databox .searchLoadingBox img{width:220px;height:220px;display:block;margin:0 auto}.mvSearchPage .databox .dataGroupSupplier{border:1px solid #EDEFEF;margin-bottom:30px}.mvSearchPage .databox .dataGroupSupplier .searchListDatas .listGroupOneItem:first-child .cons{border-top:0px}.mvSearchPage .databox .dataGroupSupplier .dataListTitle{padding:0 27px;height:50px;line-height:50px;font-size:16px;color:#000000;background:#f6f6f6}.mvSearchPage .databox .dataGroupSupplier .dataListMore{height:48px;line-height:48px;color:#000;font-size:12px;text-align:center;background:#fff}.mvSearchPage .databox .dataGroupSupplier .dataListMore b{color:#FF9A00;cursor:pointer}.mvSearchPage .databox .tableboxt{width:1226px;height:34px}.mvSearchPage .databox .tableTitle{width:1226px;height:34px;background:#F2EEE6;border:1px solid #E5DFD3;line-height:34px;display:flex;box-sizing:border-box;padding-left:17px}.mvSearchPage .databox .tableTitle.tableTitleFixed{position:fixed;z-index:4;top:60px}.mvSearchPage .databox .tableTitle>span{padding-left:10px}.mvSearchPage .databox .tableTitle .boxInfo{width:310px}.mvSearchPage .databox .tableTitle .boxCount{width:204px}.mvSearchPage .databox .tableTitle .boxJt{width:89px}.mvSearchPage .databox .tableTitle .boxHk{width:89px}.mvSearchPage .databox .tableTitle .boxMain{width:105px}.mvSearchPage .databox .tableTitle .boxTime{width:168px}.mvSearchPage .databox .tableTitle .boxAction{flex:2}
pages/search/index.module.scss
.mvSearchPage{
margin-bottom: 70px;
.fixedSupplierBox{
position: fixed;
top:225px;
transform: translateX(-220px);
p{
width:200px;
box-sizing: border-box;
padding-right:12px;
border-right: 2px solid #ccc;
font-size: 14px;
height:32px;
line-height: 32px;
color:#333;
text-align: right;
transition: all 0.6s;
&:hover{
color:#FF9A00;
border-right: 2px solid #FF9A00;
cursor: pointer;
}
}
}
.shiftBox{
padding:24px 30px;
background: #fff;
......@@ -156,4 +178,5 @@
}
}
}
}
\ No newline at end of file
}
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