import React, { useCallback } from 'react'; import { CRUDProps } from '../types'; import { Html } from '../../../components'; import { filter } from '../../../utils/tpl'; import { isEqual } from 'lodash'; import { getVariable } from '../../../utils/helper'; interface SelectionProps { props: CRUDProps; control: any } export const ItemSelection: React.FC = ({ props, control }) => { const { store, classnames: cx, labelField, labelTpl, primaryField, translate: __ } = props; if (!store.selectedItems.length) { return null; } const unSelectItem = useCallback((item: any, index: number) => { const data = control?.props?.store?.rows.concat() const Item = data?.find((items: any) => isEqual(item, items.data)) if (Item) { control?.handleCheck?.(Item) } const selected = store.selectedItems.concat() const unSelected = store.unSelectedItems.concat(); const idx = selected.indexOf(item); ~idx && unSelected.push.apply(unSelected, selected.splice(idx, 1)); store.setSelectedItems(selected); store.setUnSelectedItems(unSelected); }, []) const clearSelection = useCallback(() => { control?.handleCheckAll(2) const selected = store.selectedItems.concat() const unSelected = store.unSelectedItems.concat(); store.setSelectedItems([]); store.setUnSelectedItems(unSelected.concat(selected)); }, []) return (

{__('CRUD.selected')}

{store.selectedItems.map((item, index) => { return

unSelectItem(item, index)} > × {labelTpl ? ( ) : ( getVariable(item, labelField || 'label') || getVariable(item, primaryField || 'id') )}

})} {__('clear')}

); };