提交 0c0950e5 作者: 龚洪江

修复:筛选二级下拉样式

上级 6bb5e6b1
......@@ -26,10 +26,12 @@ export default function CategoryItem(props: Props) {
}, []);
const onClick = (item: FilterOptionResp) => {
props.onChange({
id: item.id,
name: `${props.typeName}${item.name}`,
});
if (!item.children) {
props.onChange({
id: item.id,
name: `${props.typeName}${item.name}`,
});
}
};
const onMouseEnter = (item: FilterOptionResp, index: number) => {
if (item.children) {
......@@ -53,7 +55,7 @@ export default function CategoryItem(props: Props) {
<Collapse ghost collapsible='icon' expandIconPosition='end' style={{ width: '100%' }}>
<Collapse.Panel
header={
<Space size={[40, 0]}>
<Space size={[10, 0]}>
{data.slice(0, showCount).map((item, index) => {
return (
<div
......
......@@ -60,12 +60,14 @@
display: flex;
align-items: center;
cursor: pointer;
padding: 0 15px;
.filterItemIcon{
transform: rotateZ(180deg);
margin-left: 5px;
transition: transform 1s;
}
&:hover{
background: #ECECEC;
.filterItemIcon{
transform: rotateZ(0deg);
transition: transform 0.168s;
......@@ -112,6 +114,7 @@
}
.filterCategorySecond:hover ~ .filterItem{
.filterItemContentHover{
background: #ECECEC;
.filterItemIcon{
transform: rotateZ(0deg) !important;
transition: transform 0.168s !important;
......
......@@ -88,7 +88,8 @@ const Filter = (props: Props, ref: Ref<any>) => {
};
const routerList = ['/jobServices', '/equipmentLeasing', '/flyingHandService', '/mall'];
const [typeInfo, setTypeInfo] = useState<Array<TypesResp> | null>();
const [currentItemIndex, setCurrentItemIndex] = useState<number>(-1); // 当前移入的下标
const [currentDicIndex, setCurrentDicIndex] = useState<number>(-1);
const [currentItemIndex, setCurrentItemIndex] = useState<number>(-1); // 当前分类移入的下标
const [categoryObj, setCategoryObj] = useState<FilterOptionResp>();
// 分类移入
......@@ -100,6 +101,7 @@ const Filter = (props: Props, ref: Ref<any>) => {
const index: number = typeInfo.findIndex((v) =>
v.categoriesInfoListDTO.some((i) => i.id === item.id),
);
setCurrentDicIndex(index);
categorySecondRef.current.style.top = `${(index + 1) * 26}px`;
}
} else {
......@@ -193,7 +195,7 @@ const Filter = (props: Props, ref: Ref<any>) => {
))}
</div>
{typeInfo?.length &&
typeInfo?.map((item) => (
typeInfo?.map((item, index) => (
<TypeInfo
key={item.directoryId}
typeName={item.name}
......@@ -201,7 +203,7 @@ const Filter = (props: Props, ref: Ref<any>) => {
onChange={(e: FilterOptionResp) => onChange(e, 'categoryId')}
categoryMouseEnter={categoryMouseEnter}
changeCurrentItemIndex={changeCurrentItemIndex}
currentItemIndex={currentItemIndex}
currentItemIndex={currentDicIndex === index ? currentItemIndex : -1}
categoryMouseLeave={categoryMouseLeave}
></TypeInfo>
))}
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论