@riil-frontend/component-condition-res-list

intro component

Usage no npm install needed!

<script type="module">
  import riilFrontendComponentConditionResList from 'https://cdn.skypack.dev/@riil-frontend/component-condition-res-list';
</script>

README

条件资源列表（包含动态匹配、手动添加）

@riil-frontend/component-condition-res-list

CHANGE LOG

  • 2022-1-20
  1. 添加属性 defaultSort
  2. 清空条件按钮调整，挪到 footer 中，单击后直接关闭抽屉
  • 2021-12-10
  1. 标题默认为“资源列表” -> 空
  2. 添加属性 buttonProps，可修改按钮显隐，文本等
  3. 添加属性 drawerProps
  4. 添加属性 filterCiRes，可定制资源类型范围
  5. 支持（资源名称、IP 地址、资源类型）排序
  6. 打开动态匹配抽屉时，默认不显示匹配结果列表，点击查看匹配结果按钮后才显示
  7. 动态匹配抽屉滚动方式修改为整体滚动
  8. 表格数据刷新后不清空勾选项
  9. defaultRuleCondition 可不传递，不传时组件内部根据 defaultRuleValues 自动转化

API

参数名 说明 类型 默认值
request 数据请求方法，必填 - -
title 表格左上方标题 String/ReactNode -
defaultRuleCondition 默认动态查询条件 String -
defaultRuleValues 默认动态查询条件对应的规则树的值 Array -
defaultFixResIds 默认手动资源 id 集合 Array -
onChange 动态条件或手动添加的资源变更时的回调 ({ ruleCondition, ruleValues, fixResIds })=>{} -
defaultSort 表格列默认排序方式，如果期望默认按名称排，传{ ['attributes.display_name']: 'asc'} Object [name]: 'desc' / 'asc'
columnsFormat 表格列配置转换，以该函数返回值作为表格列配置 Function (columns) => columns
filterCiRes 过滤资源类型函数，可同时限定动态条件和手动添加可选的资源类型 Function -
fixAddExcludeIds 添加固定资源时，额外排除的资源 id 集合 Array -
noDataPageProps 无数据组件参数透传 Object { imgSrc: '/noDataImg/tableNotData.svg' }
resAdvancedSearchProps 资源树高级搜索组件参数透传 Object { domainIsOptional：true, disabledFirstSelect:false }
commonResListProps 手动添加按钮打开的通用列表组件属性透传 Object -
filters 内置的过滤控件：keyword 表示搜索 Array ['keyword']
buttonProps [动态匹配按钮属性透传,手动添加按钮属性透传]，每个对象可额外设置 visible 表示隐藏按钮；label 表示按钮文本，如[{visible:false},{label:'手动触发',text:true}] Array<Object> true
drawerProps [动态匹配抽屉属性透传,手动添加抽屉透传]，分别透传抽屉对象，如[{width:500},{width:500}] Array<Object> -
paginationProps 主列表翻页器属性透传，fusion pagination props Object -

ref 公开方法：可以获取到组件内部数据和方法，通过 ref.current 进行调用

参数 说明 类型
formProps formily props Object
tableProps fusion next table props Object
paginationProps fusion pagination props Object
query 处理过的请求方法，可以在外界刷新 table，默认会带上上一次请求的参数，传入对象会自动合并 (params?: Object) => Promise<IResponse>
getParams 获取请求参数，只会在请求成功才更新 () => Object
getSelectedRowKeys 获取选中行指定的 primaryKey 值 () => any[]
resetAndQuery 重置请求条件并重新请求 () => Promise<any>