import React from 'react' ; import ListClass from '@app/class/list' ; import HTMLText from '@app/components/html-text' ; import { useStore , useSelector } from 'react-redux' ; import { loadBlockList , removeBlock } from '@app/redux/actions/block' ; import { getBlockListById } from '@app/redux/reducers/block' ; import './styles/index.scss' ; interface Props { id : string ; query : object ; scrollLoad ? : boolean ; showPagination ? : boolean ; itemType ? : string ; } export default function ( props ) { const { id } = props ; const store = useStore ( ) ; const list = useSelector ( ( state ) => { return getBlockListById ( state , id ) ; } ) ; const remove = function ( item ) { return async ( ) => { let params = { } ; if ( item . people_id ) params . people_id = item . people_id . _id ; if ( item . posts_id ) params . posts_id = item . posts_id . _id ; if ( item . comment_id ) params . comment_id = item . comment_id . _id ; let [ err , res ] = await removeBlock ( { args : params , id : item . _id } ) ( store . dispatch , store . getState ) ; if ( res && res . success ) { $ . toast ( { text : '取消成功' , position : 'top-center' , showHideTransition : 'slide' , icon : 'success' , loader : false , allowToastClose : false } ) ; } else if ( err && err . message ) { $ . toast ( { text : err . message , position : 'top-center' , showHideTransition : 'slide' , icon : 'error' , loader : false , allowToastClose : false } ) ; } } ; } ; return ( < ListClass { ... props } { ... list } load = { ( params ) => loadBlockList ( params ) ( store . dispatch , store . getState ) } renderItem = { ( item ) => { return ( < div key = { item . _id } className = "card-body border-bottom row" > < div className = "col-9 col-md-10" > { item . posts_id ? item . posts_id . title : null } { item . people_id ? < div styleName = "people" > < img src = { item . people_id . avatar_url } /> { item . people_id . nickname } < /div> : null } { item . comment_id ? < div > < HTMLText content = { item . comment_id . content_html } /> < /div> : null } < /div> < div className = "col-3 col-md-2 text-right" > < div className = "btn btn-outline-secondary btn-sm" onClick = { remove ( item ) } > 取消 < /div> < /div> < /div>); } } />); }