weaver_trunk_cli/pc4mobx/prj/components/add/MLinkCard.js

45 lines
1.6 KiB
JavaScript

import LinkCardItem from './LinkCardItem';
import {Card,Icon} from 'antd';
import isEqual from 'lodash/isEqual';
import * as mobx from 'mobx'
class MLinkCard extends React.Component {
shouldComponentUpdate(nextProps) {
const _c = !isEqual(mobx.toJS(this.props.types), mobx.toJS(nextProps.types));
return _c || this.props.isAbc !== nextProps.isAbc
}
render() {
const {types,isAbc,actions,user} = this.props;
return (
<div>
{
types.map((type,i)=>{
const {prjbeans,img,color,letter,selected,typeName,prjtmpcount} = type;
const icontype ="icon-base " +img;
return (
<Card ecId={`${this && this.props && this.props.ecId || ''}_Card@awhrvz@${i}`} id={letter} style={selected ? {"border-top-color":color,background:'#fff',boxShadow:'0 1px 6px hsla(0,0%,39%,.2)'} : {"border-top-color":color}}>
<div style={{padding:'5px 0 25px 0',textAlign:'center'}}>
{isAbc ?
<span style={{fontSize:26,color:color}}>{letter}</span>
:
<div className="wf-card-type-name">
<span style={{color:color,fontSize:26,marginRight:10}}><i className={icontype}/></span>
<span style={{height:36,lineHeight:'36px'}}>{typeName}{('(' + (prjtmpcount) + ')')}</span>
</div>
}
</div>
{
prjbeans.map((obj,j)=><LinkCardItem ecId={`${this && this.props && this.props.ecId || ''}_LinkCardItem@bzj05e@${j}`} user={user} prjbean={obj} iscommon={false} actions={actions} />)
}
</Card>
)
})
}
</div>
)
}
}
export default MLinkCard