| | |
| | | <div className={'ant-mk-text line' + (card.height || '')} style={{height: card.innerHeight || 'auto'}}>{val}</div> |
| | | ) |
| | | } else if (card.eleType === 'icon') { |
| | | return (<MkIcon type={card.icon}/>) |
| | | let fontSize = 14 |
| | | let lineHeight = 1.5 |
| | | |
| | | if (card.style.fontSize) { |
| | | fontSize = parseInt(card.style.fontSize) |
| | | } |
| | | if (card.style.lineHeight) { |
| | | lineHeight = parseFloat(card.style.lineHeight) |
| | | } |
| | | |
| | | let innerHeight = fontSize * lineHeight |
| | | return (<MkIcon style={{height: innerHeight}} className="ant-mk-icon" type={card.icon}/>) |
| | | } else if (card.eleType === 'slider') { |
| | | let val = card.value ? (card.value / card.maxValue) * 100 : 30 |
| | | return <MkProgress value={val} config={card}/> |
| | |
| | | // ) |
| | | } else if (card.eleType === 'picture') { |
| | | let _imagestyle = {} |
| | | let url = card.url !== '@icon@' ? card.url : sessionStorage.getItem('CloudAvatar') |
| | | |
| | | if (card.url) { |
| | | _imagestyle = {backgroundImage: `url('${card.url}')`} |
| | | if (url) { |
| | | _imagestyle = {backgroundImage: `url('${url}')`} |
| | | } else { |
| | | let index = card.uuid.match(/\d{1}/g) |
| | | index = index.slice(-1)[0] % 5 |
| | |
| | | } else if (card.eleType === 'splitline') { |
| | | let _borderWidth = card.borderWidth === undefined ? 1 : card.borderWidth |
| | | return ( |
| | | <div style={{paddingTop: '1px'}}> |
| | | <div style={{paddingTop: _borderWidth ? '1px' : '10px'}}> |
| | | <div className="ant-mk-splitline" style={{borderColor: card.color, borderWidth: _borderWidth}}></div> |
| | | </div> |
| | | ) |
| | |
| | | </div> |
| | | ) |
| | | } else if (card.eleType === 'video') { |
| | | _style.overflow = 'hidden' |
| | | return ( |
| | | <div> |
| | | <Video card={card} value={card.url || 'http://qingqiumarket.cn/mkwms/Content/images/upload/20210104/trailer.mp4'}/> |
| | | <div className="video-wrap"> |
| | | <Video card={card} poster={card.posterUrl || ''} value={card.url || 'http://qingqiumarket.cn/mkwms/Content/images/upload/20210104/trailer.mp4'}/> |
| | | </div> |
| | | ) |
| | | } else if (card.eleType === 'currentDate') { |
| | |
| | | <CopyOutlined className="copy" title="复制" onClick={() => copyCard(id)} /> |
| | | <CloseOutlined className="close" title="删除" onClick={() => delCard(id)} /> |
| | | <FontColorsOutlined className="style" title="调整样式" onClick={() => changeStyle(id)}/> |
| | | {['text', 'number', 'slider', 'sequence', 'formula'].includes(card.eleType) ? <MarkColumn columns={fields} type={card.eleType} marks={card.marks} onSubmit={(vals) => updateMarks({...card, marks: vals})} /> : null } |
| | | {['text', 'number', 'slider', 'sequence', 'formula'].includes(card.eleType) ? <MarkColumn field={card.field || ''} columns={fields} type={card.eleType} marks={card.marks} onSubmit={(vals) => updateMarks({...card, marks: vals})} /> : null } |
| | | </div> |
| | | } trigger="hover"> |
| | | <div ref={node => drag(drop(node))} className={'ant-col card-cell ant-col-' + card.width}> |