| | |
| | | ) |
| | | } else if (card.eleType === 'text' || card.eleType === 'number') { |
| | | let val = `${card.prefix || ''}${card.datatype === 'static' ? (card.value || '') : (card.field || '')}${card.postfix || ''}` |
| | | if (card.fixStyle === 'alone') { |
| | | let _s = {fontSize: card.fixSize, color: card.fixColor, marginLeft: card.fixLeft, marginRight: card.fixRight} |
| | | val = <><span style={_s}>{card.prefix || ''}</span>{`${card.datatype === 'static' ? (card.value || '') : (card.field || '')}`}<span style={_s}>{card.postfix || ''}</span></> |
| | | } |
| | | return ( |
| | | <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') { |
| | | let val = `${card.prefix || ''}${moment().format(card.dateFormat)}${card.postfix || ''}` |
| | | if (card.fixStyle === 'alone') { |
| | | let _s = {fontSize: card.fixSize, color: card.fixColor, marginLeft: card.fixLeft, marginRight: card.fixRight} |
| | | val = <><span style={_s}>{card.prefix || ''}</span>{moment().format(card.dateFormat)}<span style={_s}>{card.postfix || ''}</span></> |
| | | } |
| | | return ( |
| | | <div className="ant-mk-date"> |
| | | {`${card.prefix || ''}${moment().format(card.dateFormat)}${card.postfix || ''}`} |
| | | {val} |
| | | </div> |
| | | ) |
| | | } else if (card.eleType === 'formula') { |
| | | let val = `${card.prefix || ''}${card.formula}${card.postfix || ''}` |
| | | if (card.fixStyle === 'alone') { |
| | | let _s = {fontSize: card.fixSize, color: card.fixColor, marginLeft: card.fixLeft, marginRight: card.fixRight} |
| | | val = <><span style={_s}>{card.prefix || ''}</span>{card.formula}<span style={_s}>{card.postfix || ''}</span></> |
| | | } |
| | | return ( |
| | | <div className="ant-mk-date"> |
| | | {`${card.prefix || ''}${card.formula}${card.postfix || ''}`} |
| | | {val} |
| | | </div> |
| | | ) |
| | | } |
| | |
| | | |
| | | let able = true |
| | | if ((appType === 'mob' || appType === 'pc') && parent && (parent.setting.click === 'menu' || parent.setting.click === 'menus')) { |
| | | // if ((appType === 'mob' || appType === 'pc') && parent && parent.setting.click === 'menu') { |
| | | able = false |
| | | } |
| | | |
| | |
| | | <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}> |