@aligov/fr-comp-upload

@aligov/components-dialog

Usage no npm install needed!

<script type="module">
  import aligovFrCompUpload from 'https://cdn.skypack.dev/@aligov/fr-comp-upload';
</script>

README

数政dialog

@aligov/components-dialog

数政dialog,基于 Fusion Dialog 做定制,主要是对弹层宽度做了几个尺寸的限制,默认是 medium

API

参数名 说明 必填 类型 默认值 备注
size 大小:'small' or 'medium' or 'large' string medium
hasFooterBorder 底部按钮上方是否有分隔线 boolean false
okClickableDelay 确定按钮可点击的延时,单位秒,整数 number
okRender 确定按钮的渲染函数,主要配合 okClickableDelay 使用 (remainSeconds: number) => ReactElement
className 自定义 class string
style 自定义样式 object

除了上面这些参数外,其他参数沿用 Fusion Dialog 的参数,用法也一致。

关于弹层标题以及底部按钮和主体内容之间的分隔线,组件内部不会主动添加,而是采用主题的设置。

hasFooterBorder 在主题的基础上,默认底部按钮上方分隔线会隐藏掉,只要在设为 true 后才会展示。用于主体内容有分页(如表格 + 分页)的场景。

okClickableDelayokRender 搭配用来实现确定按钮需要等待指定秒数后才能点击的效果。

开发

开发阶段,如果需要在特定主题下看,先安装依赖(不要保存到 package.json 中),然后 bash 下使用 theme=the-pkg npm start 来运行,如 theme=@alifd/theme-dev-test-only npm start

fish 下使用 env theme=the-pkg npm start

Todo

[ ] max height