57 lines
2.1 KiB
TypeScript
57 lines
2.1 KiB
TypeScript
import { View } from "@tarojs/components";
|
|
import style from "./index.module.scss"
|
|
import classnames from "classnames";
|
|
import { memo, ReactNode, useMemo } from "react";
|
|
import CloseBtnIcon from "@/components/closeBtn"
|
|
|
|
export interface Params {
|
|
title?: string,
|
|
show?: false|true,
|
|
showTitle?: false|true,
|
|
onClose?:() => void,
|
|
children?: ReactNode,
|
|
IconButton?: ReactNode,
|
|
showIconButton?: false|true,
|
|
position?: 'bottom'|'top'|'right'
|
|
}
|
|
export default memo((
|
|
{
|
|
title = '标题',
|
|
show = false,
|
|
showTitle = true,
|
|
onClose,
|
|
showIconButton = false,
|
|
children,
|
|
position = 'bottom'
|
|
}:Params) => {
|
|
|
|
|
|
return (
|
|
<>
|
|
<View className={style.drawer_main}>
|
|
<View catchMove={true} className={`${style.drawer} ${show?style.drawer_active:''}` }>
|
|
<View
|
|
className={classnames(style.drawer_mask, {[style.drawer_mask_active]: show})}
|
|
onClick={() => onClose?.()}
|
|
>
|
|
<View
|
|
className={classnames(style.drawer_container, style['drawer_container_'+position], {[style.drawer_container_active]: show})}
|
|
onClick={(e) => e.stopPropagation()}
|
|
>
|
|
{showTitle&&<View className={style.drawer_container_title}>{title}</View>}
|
|
{showIconButton&&<View className={style.common_close_btn_icon}>
|
|
<CloseBtnIcon onClose={() => onClose?.()}/>
|
|
</View>}
|
|
|
|
<View className={style.drawer_container_context}>
|
|
{children}
|
|
</View>
|
|
<View className="common_safe_area_y"></View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</>
|
|
)
|
|
})
|