Skip to content

肖康 / Europa-web

Go to a project
Commit 07eb486b by 肖康
Options

搜索修改

parent 0c40b45e
Inline Side-by-side
Showing with 261 additions and 73 deletions
configReact.tsx
const os = require('os'); const os = require('os');
export const QQURL='https://wpa.qq.com/msgrd?v=3&uin=1908059998&site=qq&menu=yes' export const QQURL='https://wpa.qq.com/msgrd?v=3&uin=1908059998&site=qq&menu=yes'
export const API_URL=((os.hostname()=="MS-NDPSTQVAWPAX"||os.hostname()=="dev235"||os.hostname()=="localhost")?'http://erpweb.liexindev.net':'http://api.chiplinks.net') export const API_URL=((os.hostname()=="MS-NDPSTQVAWPAX"||os.hostname()=="dev235"||os.hostname()=="localhost"||os.hostname()=="erpweb.liexindev.com")?'http://erpweb.liexindev.net':'http://api.chiplinks.net')
console.log(os.hostname(),API_URL)
pages/orderSettle/index.tsx
...@@ -81,21 +81,21 @@ const TopH = (props: { cateList: ResponseTypeCateList }) =>{ ...@@ -81,21 +81,21 @@ const TopH = (props: { cateList: ResponseTypeCateList }) =>{
handleDataInit() handleDataInit()
}, [query,sourceType]) }, [query,sourceType])
useEffect(() => { // useEffect(() => {
if(userInfo){return} // if(userInfo){return}
userRequest({ url: '/api/userInfo/userInfo', method: 'get', data: { } }).then((res) => { // userRequest({ url: '/api/userInfo/userInfo', method: 'get', data: { } }).then((res) => {
if (res?.code === 0) { // if (res?.code === 0) {
setUserInfo(res?.data) // setUserInfo(res?.data)
if(res?.data.audit_status!=1){ // if(res?.data.audit_status!=1){
message("请先审核用户发票！",3000) // message("请先审核用户发票！",3000)
} // }
}else{ // }else{
message(res?.msg) // message(res?.msg)
} // }
}) // })
}, []) // }, [])
useEffect(() => { useEffect(() => {
handleInvoiceInit() handleInvoiceInit()
handleAddressInit() handleAddressInit()
...@@ -189,10 +189,10 @@ const TopH = (props: { cateList: ResponseTypeCateList }) =>{ ...@@ -189,10 +189,10 @@ const TopH = (props: { cateList: ResponseTypeCateList }) =>{
} }
const handleOrderSubmit = async () => { const handleOrderSubmit = async () => {
if(userInfo?.audit_status!=1){ // if(userInfo?.audit_status!=1){
message("请先审核用户发票！",3000) // message("请先审核用户发票！",3000)
return // return
} // }
const param = { const param = {
goods_list: disList.map((disItem:any) => { goods_list: disList.map((disItem:any) => {
return { return {
......
pages/search/[keyword].tsx
...@@ -25,10 +25,10 @@ import FixedSearchTop from '@/components/FixedSearchTop'; ...@@ -25,10 +25,10 @@ import FixedSearchTop from '@/components/FixedSearchTop';
export const getServerSideProps: GetServerSideProps = async () => { export const getServerSideProps: GetServerSideProps = async () => {
return getCateList() return getCateList()
} }
const supplierIdS = ['', '24','73','102','57'] const supplierIdS = ['', '24', '73', '102', '57']
const Page = (props: { cateList: ResponseTypeCateList }) => { const Page = (props: { cateList: ResponseTypeCateList }) => {
const { QQURL,PHONE}=useQq() const { QQURL, PHONE } = useQq()
const requestCount = useRef(0) const requestCount = useRef(0)
const router = useRouter() const router = useRouter()
const keyword = router.query.keyword || ''; const keyword = router.query.keyword || '';
...@@ -38,7 +38,7 @@ const Page = (props: { cateList: ResponseTypeCateList }) => { ...@@ -38,7 +38,7 @@ const Page = (props: { cateList: ResponseTypeCateList }) => {
const { request: getListRequest } = useRequest<ResponseTypeSearch>({ manual: true,loading:false }) const { request: getListRequest } = useRequest<ResponseTypeSearch>({ manual: true, loading: false })
const initSupplierList = useRef<supplierDataType[]>([])//初始化数据 const initSupplierList = useRef<supplierDataType[]>([])//初始化数据
const [supplierList, dispatchSupplierList] = useReducer(supplierDataReducer, []) const [supplierList, dispatchSupplierList] = useReducer(supplierDataReducer, [])
...@@ -46,15 +46,15 @@ const Page = (props: { cateList: ResponseTypeCateList }) => { ...@@ -46,15 +46,15 @@ const Page = (props: { cateList: ResponseTypeCateList }) => {
const [isFixedH, setIsFixedH] = useState(false); const [isFixedH, setIsFixedH] = useState(false);
useEffect(() => { useEffect(() => {
const handleScroll = () => { const handleScroll = () => {
try{ try {
let distanceFromTop = document.getElementById('tableboxfg')!.offsetTop; let distanceFromTop = document.getElementById('tableboxfg')!.offsetTop;
if (window.scrollY > distanceFromTop) { if (window.scrollY > distanceFromTop) {
setIsFixedH(true); setIsFixedH(true);
} else { } else {
setIsFixedH(false); setIsFixedH(false);
} }
}catch(err){} } catch (err) { }
}; };
window.addEventListener('scroll', handleScroll); window.addEventListener('scroll', handleScroll);
// 清除事件监听器 // 清除事件监听器
...@@ -63,6 +63,26 @@ const Page = (props: { cateList: ResponseTypeCateList }) => { ...@@ -63,6 +63,26 @@ const Page = (props: { cateList: ResponseTypeCateList }) => {
}; };
}, []); }, []);
const getSlideSupplierInit = (datasg: any[]) => {
let newSlideSupplier: any = []
datasg.forEach((item) => {
const id_ = String(item.supplier_id)
const name_ = String(item.supplier_name)
newSlideSupplier = [...newSlideSupplier, { id: id_, value: name_, checked: false }]
})
let uniqueBrand = newSlideSupplier.reduce((acc: any, current: any) => {
if (!acc.some((item: any) => item.id === current.id)) {
if (current.value) {
acc.push(current);
}
}
return acc;
}, []);
if (uniqueBrand.length > 0) {
uniqueBrand[0].checked = true
}
return uniqueBrand
}
useEffect(() => { useEffect(() => {
initSupplierList.current = [] initSupplierList.current = []
...@@ -85,10 +105,15 @@ const Page = (props: { cateList: ResponseTypeCateList }) => { ...@@ -85,10 +105,15 @@ const Page = (props: { cateList: ResponseTypeCateList }) => {
datasg.push(child) datasg.push(child)
}) })
}) })
dispatchSupplierR({ type: 'supplierInit', value: JSON.parse(JSON.stringify(datasg)) }) dispatchSupplierR({ type: 'supplierInit', value: JSON.parse(JSON.stringify(datasg)) })
dispatchBrands({ type: 'brandsInit', value: JSON.parse(JSON.stringify(datasg)) }) dispatchBrands({ type: 'brandsInit', value: JSON.parse(JSON.stringify(datasg)) })
dispatchclasss({ type: 'classsInit', value: JSON.parse(JSON.stringify(datasg)) }) dispatchclasss({ type: 'classsInit', value: JSON.parse(JSON.stringify(datasg)) })
dispatchSupplierList({ type: 'init', value: JSON.parse(JSON.stringify(initSupplierList.current)) }) dispatchSupplierList({ type: 'init', value: JSON.parse(JSON.stringify(initSupplierList.current)) })
if (requestCount.current >= supplierIdS.length) { if (requestCount.current >= supplierIdS.length) {
} }
...@@ -112,12 +137,68 @@ const Page = (props: { cateList: ResponseTypeCateList }) => { ...@@ -112,12 +137,68 @@ const Page = (props: { cateList: ResponseTypeCateList }) => {
const [supplierListAll, setSupplierListAll] = useState(false) const [supplierListAll, setSupplierListAll] = useState(false)
const [brandListAll, setBrandListAll] = useState(false) const [brandListAll, setBrandListAll] = useState(false)
const [classListAll, setClassListAll] = useState(false) const [classListAll, setClassListAll] = useState(false)
//侧边栏盒子
const [slideSupplier, setSlideSupplier] = useState<any>([])
const elementsRef = useRef([]);
useEffect(() => {
if (supplierR.length == 0) {
setSlideSupplier([])
return
}
let arr_: any[] = []
supplierR.forEach(item => {
if (item.checked) {
arr_.push({
id: item.id,
value: item.value
})
}
})
if (arr_.length == 0) {
supplierR.forEach(item => {
arr_.push({
id: item.id,
value: item.value,
check: false
})
})
}
arr_[0].checked = true
setSlideSupplier(arr_)
}, [supplierR])
const scrollToSupplierBox = (id: string | number) => {
let arr_:any[]=[]
slideSupplier.forEach((item:any) => {
arr_.push({
value:item.value,
id:item.id,
checked:id==item.id?true:false
})
});
setSlideSupplier(arr_)
try {
const element = document.getElementById('supplierBox' + id);
if (element) {
const elementTop = element.offsetTop;
const scrollPosition = elementTop - 100;
console.log(scrollPosition)
window.scrollTo({
top: scrollPosition,
behavior: 'smooth'
});
}
} catch (e) {
}
}
//品牌,分类,渠道，排序发生变化 //品牌,分类,渠道，排序发生变化
useEffect(() => { useEffect(() => {
dispatchSupplierList({ type: 'change', value: JSON.parse(JSON.stringify(initSupplierList.current)),supplierR:supplierR, brandsR: brandsR, classsR: classsR, sortObj: sortObj }) dispatchSupplierList({ type: 'change', value: JSON.parse(JSON.stringify(initSupplierList.current)), supplierR: supplierR, brandsR: brandsR, classsR: classsR, sortObj: sortObj })
}, [brandsR, classsR,supplierR, sortObj]) }, [brandsR, classsR, supplierR, sortObj])
const updateBrandAndClass = (type: number, id?: string) => { const updateBrandAndClass = (type: number, id?: string) => {
if (type === 1) { if (type === 1) {
...@@ -132,7 +213,8 @@ const Page = (props: { cateList: ResponseTypeCateList }) => { ...@@ -132,7 +213,8 @@ const Page = (props: { cateList: ResponseTypeCateList }) => {
} }
return ( return (
<> <>
<main> <main>
...@@ -205,11 +287,11 @@ const Page = (props: { cateList: ResponseTypeCateList }) => { ...@@ -205,11 +287,11 @@ const Page = (props: { cateList: ResponseTypeCateList }) => {
</div> </div>
} }
<div className={styles.databox}> <div className={styles.databox}>
<ListSort sortObj={sortObj} setSortObj={setSortObj} /> <ListSort sortObj={sortObj} setSortObj={setSortObj} />
<div id="tableboxfg" className={styles.tableboxt}> <div id="tableboxfg" className={styles.tableboxt}>
<div className={isFixedH?`${styles.tableTitle} ${styles.tableTitleFixed}`:`${styles.tableTitle}`}> <div className={isFixedH ? `${styles.tableTitle} ${styles.tableTitleFixed}` : `${styles.tableTitle}`}>
<span className={styles.boxInfo}>商品信息</span> <span className={styles.boxInfo}>商品信息</span>
<span className={styles.boxCount}>库存及起订</span> <span className={styles.boxCount}>库存及起订</span>
<span className={styles.boxJt}>阶梯</span> <span className={styles.boxJt}>阶梯</span>
...@@ -219,26 +301,26 @@ const Page = (props: { cateList: ResponseTypeCateList }) => { ...@@ -219,26 +301,26 @@ const Page = (props: { cateList: ResponseTypeCateList }) => {
<span className={styles.boxAction}>操作</span> <span className={styles.boxAction}>操作</span>
</div> </div>
</div> </div>
{ {
(supplierList.length == 0 &&requestCount.current != supplierIdS.length)&& (supplierList.length == 0 && requestCount.current != supplierIdS.length) &&
<div className={styles.searchLoadingBox}> <div className={styles.searchLoadingBox}>
<img src="/images/searchLoading.gif" alt="" /> <img src="/images/searchLoading.gif" alt="" />
</div> </div>
} }
{ {
supplierList.length > 0 ? supplierList.length > 0 ?
supplierList.map((item, index) => { supplierList.map((item: any, index) => {
return ( return (
item.data.length > 0 && item.data.length > 0 &&
<div className={styles.dataGroupSupplier} id={`supplierBox${item.supplier_id}`} 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.dataListTitle}>{item.supplier_name || '其他'}</div>
<div className={styles.searchListDatas}> <div className={styles.searchListDatas}>
{ {
item.data.map(child => { item.data.map((child: any) => {
return ( return (
<ListOneItem key={String(child.sku_id) + Math.random()} {...child} QQURL={QQURL} PHONE={PHONE} /> <ListOneItem key={String(child.sku_id) + Math.random()} {...child} QQURL={QQURL} PHONE={PHONE} />
) )
}) })
} }
...@@ -247,17 +329,22 @@ const Page = (props: { cateList: ResponseTypeCateList }) => { ...@@ -247,17 +329,22 @@ const Page = (props: { cateList: ResponseTypeCateList }) => {
</div> </div>
) )
}) })
: requestCount.current >= supplierIdS.length && <Empty image='/images/emptyorder.png' description="数据为空！" imageStyle={{height: '183px', margin: '30px auto 0'}} /> : requestCount.current >= supplierIdS.length && <Empty image='/images/emptyorder.png' description="数据为空！" imageStyle={{ height: '183px', margin: '30px auto 0' }} />
} }
</div> </div>
{
<div className={`${styles.fixedSupplierBox}`}> slideSupplier.length > 0 &&
<p>dddddd</p> <div className={`${styles.fixedSupplierBox}`}>
<p>dddddd</p> <div>快速访问</div>
<p>dddddd</p> {
</div> slideSupplier.map((item: any, index: number) => {
return <p key={index} onClick={() => { scrollToSupplierBox(item.id) }} className={item.checked ? `${styles.act}` : ''}>{item?.value}</p>
})
}
</div>
}
</div> </div>
<Footer /> <Footer />
......
pages/search/index.module.css
...@@ -4,29 +4,80 @@ ...@@ -4,29 +4,80 @@
.mvSearchPage .fixedSupplierBox { .mvSearchPage .fixedSupplierBox {
position: fixed; position: fixed;
top: 225px; top: 243px;
transform: translateX(-220px); transform: translateX(-214px);
}
.mvSearchPage .fixedSupplierBox div {
position: relative;
width: 62px;
height: 22px;
background-color: #FF9A00;
border-radius: 2px;
color: #fff;
margin-bottom: 12px;
line-height: 21px;
font-size: 14px;
padding: 0 5px;
left: 128px;
}
.mvSearchPage .fixedSupplierBox div::after {
content: "";
position: absolute;
right: 7px;
top: 22px;
height: 0;
width: 0;
overflow: hidden;
font-size: 0;
line-height: 0;
border-color: #fff #FF9A00 transparent transparent;
border-style: solid solid dashed dashed;
border-width: 0px 8px 8px 0;
} }
.mvSearchPage .fixedSupplierBox p { .mvSearchPage .fixedSupplierBox p {
width: 200px; width: 200px;
box-sizing: border-box; box-sizing: border-box;
padding-right: 12px; padding-right: 12px;
border-right: 2px solid #ccc; border-right: 1px solid #e5e5e5;
font-size: 14px; font-size: 14px;
height: 32px; height: 35px;
line-height: 32px; line-height: 35px;
color: #333; color: #000;
font-weight: bold;
text-align: right; text-align: right;
transition: all 0.6s; position: relative;
} }
.mvSearchPage .fixedSupplierBox p:hover { .mvSearchPage .fixedSupplierBox p:hover, .mvSearchPage .fixedSupplierBox p.act {
color: #FF9A00; color: #FF9A00;
border-right: 2px solid #FF9A00;
cursor: pointer; cursor: pointer;
} }
.mvSearchPage .fixedSupplierBox p:hover::after, .mvSearchPage .fixedSupplierBox p.act::after {
content: "";
position: absolute;
width: 0;
height: 0;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-right: 6px solid #FF9A00;
right: 2px;
top: 11px;
}
.mvSearchPage .fixedSupplierBox p:hover::before, .mvSearchPage .fixedSupplierBox p.act::before {
content: "";
position: absolute;
height: 18px;
width: 3px;
background: #FF9A00;
right: -3px;
top: 8px;
}
.mvSearchPage .shiftBox { .mvSearchPage .shiftBox {
padding: 24px 30px; padding: 24px 30px;
background: #fff; background: #fff;
...@@ -92,7 +143,7 @@ ...@@ -92,7 +143,7 @@
width: 58px; width: 58px;
border: 1px solid #B0B0B0; border: 1px solid #B0B0B0;
box-sizing: border-box; box-sizing: border-box;
color: #919191; color: #595959;
font-size: 12px; font-size: 12px;
cursor: pointer; cursor: pointer;
} }
...@@ -110,7 +161,7 @@ ...@@ -110,7 +161,7 @@
} }
.mvSearchPage .shiftBox .shiftGroup .shitrank i { .mvSearchPage .shiftBox .shiftGroup .shitrank i {
color: #919191; color: #595959;
font-size: 12px; font-size: 12px;
} }
...@@ -131,7 +182,7 @@ ...@@ -131,7 +182,7 @@
} }
.mvSearchPage .databox .dataGroupSupplier { .mvSearchPage .databox .dataGroupSupplier {
border: 1px solid #EDEFEF; border: 1px solid #f0f0f0;
margin-bottom: 30px; margin-bottom: 30px;
} }
......
pages/search/index.module.min.css
.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} .mvSearchPage{margin-bottom:70px}.mvSearchPage .fixedSupplierBox{position:fixed;top:243px;transform:translateX(-214px)}.mvSearchPage .fixedSupplierBox div{position:relative;width:62px;height:22px;background-color:#FF9A00;border-radius:2px;color:#fff;margin-bottom:12px;line-height:21px;font-size:14px;padding:0 5px;left:128px}.mvSearchPage .fixedSupplierBox div::after{content:"";position:absolute;right:7px;top:22px;height:0;width:0;overflow:hidden;font-size:0;line-height:0;border-color:#fff #FF9A00 transparent transparent;border-style:solid solid dashed dashed;border-width:0px 8px 8px 0}.mvSearchPage .fixedSupplierBox p{width:200px;box-sizing:border-box;padding-right:12px;border-right:1px solid #e5e5e5;font-size:14px;height:35px;line-height:35px;color:#000;font-weight:bold;text-align:right;position:relative}.mvSearchPage .fixedSupplierBox p:hover,.mvSearchPage .fixedSupplierBox p.act{color:#FF9A00;cursor:pointer}.mvSearchPage .fixedSupplierBox p:hover::after,.mvSearchPage .fixedSupplierBox p.act::after{content:"";position:absolute;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:6px solid #FF9A00;right:2px;top:11px}.mvSearchPage .fixedSupplierBox p:hover::before,.mvSearchPage .fixedSupplierBox p.act::before{content:"";position:absolute;height:18px;width:3px;background:#FF9A00;right:-3px;top:8px}.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:#595959;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:#595959;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 #f0f0f0;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
...@@ -2,23 +2,70 @@ ...@@ -2,23 +2,70 @@
margin-bottom: 70px; margin-bottom: 70px;
.fixedSupplierBox{ .fixedSupplierBox{
position: fixed; position: fixed;
top:225px; top:243px;
transform: translateX(-220px); transform: translateX(-214px);
div{
position: relative;
width: 62px;
height: 22px;
background-color: #FF9A00;
border-radius: 2px;
color: #fff;
margin-bottom: 12px;
line-height: 21px;
font-size: 14px;
padding:0 5px;
left:128px;
&::after{
content:"";
position: absolute;
right:7px;
top:22px;
height: 0;
width: 0;
overflow: hidden;
font-size: 0;
line-height: 0;
border-color: #fff #FF9A00 transparent transparent;
border-style: solid solid dashed dashed;
border-width: 0px 8px 8px 0;
}
}
p{ p{
width:200px; width:200px;
box-sizing: border-box; box-sizing: border-box;
padding-right:12px; padding-right:12px;
border-right: 2px solid #ccc; border-right: 1px solid #e5e5e5;
font-size: 14px; font-size: 14px;
height:32px; height:35px;
line-height: 32px; line-height: 35px;
color:#333; color:#000;
font-weight: bold;
text-align: right; text-align: right;
transition: all 0.6s; position: relative;
&:hover{ &:hover,&.act{
color:#FF9A00; color:#FF9A00;
border-right: 2px solid #FF9A00;
cursor: pointer; cursor: pointer;
&::after{
content:"";
position: absolute;
width: 0;
height: 0;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-right: 6px solid #FF9A00;
right:2px;
top:11px;
}
&::before{
content:"";
position: absolute;
height:18px;
width:3px;
background: #FF9A00;
right:-3px;
top:8px;
}
} }
} }
} }
...@@ -73,7 +120,7 @@ ...@@ -73,7 +120,7 @@
width:58px; width:58px;
border: 1px solid #B0B0B0; border: 1px solid #B0B0B0;
box-sizing: border-box; box-sizing: border-box;
color:#919191; color:#595959;
font-size: 12px; font-size: 12px;
cursor: pointer; cursor: pointer;
&.shows{ &.shows{
...@@ -84,7 +131,7 @@ ...@@ -84,7 +131,7 @@
} }
&:first-child{margin-left: 0px;} &:first-child{margin-left: 0px;}
i{ i{
color:#919191; color:#595959;
font-size: 12px; font-size: 12px;
} }
} }
...@@ -105,7 +152,7 @@ ...@@ -105,7 +152,7 @@
} }
} }
.dataGroupSupplier{ .dataGroupSupplier{
border: 1px solid #EDEFEF; border: 1px solid #f0f0f0;
margin-bottom: 30px; margin-bottom: 30px;
.searchListDatas{ .searchListDatas{
.listGroupOneItem:first-child{ .listGroupOneItem:first-child{
......
reducers/searchReducers.tsx
...@@ -35,7 +35,7 @@ export const brandsAndClasssReducer = (state: BrandAndClassType, action: any) => ...@@ -35,7 +35,7 @@ export const brandsAndClasssReducer = (state: BrandAndClassType, action: any) =>
}) })
const uniqueBrand = newBrand.reduce((acc: BrandAndClassType, current) => { let uniqueBrand = newBrand.reduce((acc: BrandAndClassType, current) => {
if (!acc.some(item => item.id === current.id)) { if (!acc.some(item => item.id === current.id)) {
if(current.value){ if(current.value){
acc.push(current); acc.push(current);
...@@ -43,6 +43,7 @@ export const brandsAndClasssReducer = (state: BrandAndClassType, action: any) => ...@@ -43,6 +43,7 @@ export const brandsAndClasssReducer = (state: BrandAndClassType, action: any) =>
} }
return acc; return acc;
}, []); }, []);
return uniqueBrand return uniqueBrand
} }
if (action.type === 'supplierUpdate'||action.type === 'brandsUpdate' || action.type === 'classsUpdate') { if (action.type === 'supplierUpdate'||action.type === 'brandsUpdate' || action.type === 'classsUpdate') {
...@@ -60,6 +61,8 @@ export const brandsAndClasssReducer = (state: BrandAndClassType, action: any) => ...@@ -60,6 +61,8 @@ export const brandsAndClasssReducer = (state: BrandAndClassType, action: any) =>
} }
return newList return newList
} }
return state return state
} }
......
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