From 523cec6c87d88b43954a4409a8dfde6aade095a1 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期五, 22 五月 2020 11:02:10 +0800
Subject: [PATCH] 2020-05-22
---
src/templates/sharecomponent/cardcomponent/index.jsx | 58 ++++++++++++++++++++++++++++++++++++++++++++++------------
1 files changed, 46 insertions(+), 12 deletions(-)
diff --git a/src/templates/sharecomponent/cardcomponent/index.jsx b/src/templates/sharecomponent/cardcomponent/index.jsx
index ab53003..bacd6f8 100644
--- a/src/templates/sharecomponent/cardcomponent/index.jsx
+++ b/src/templates/sharecomponent/cardcomponent/index.jsx
@@ -176,7 +176,8 @@
uuid: col.uuid,
value: col.field,
text: col.label,
- icon: mark.icon
+ icon: mark.icon,
+ color: mark.color[1]
})
}
}
@@ -268,7 +269,24 @@
},
onCancel() {}
})
-
+ }
+
+ deleteElem = (type) => {
+ const { dict } = this.state
+ let _this = this
+
+ confirm({
+ content: dict['model.confirm'] + dict['model.delete'] + '锛�',
+ okText: dict['model.confirm'],
+ cancelText: dict['header.cancel'],
+ onOk() {
+ let _subelement = fromJS(_this.props.card.subelement).toJS()
+ _subelement = _subelement.filter(_type => _type !== type)
+
+ _this.plotChange({subelement: _subelement})
+ },
+ onCancel() {}
+ })
}
render() {
@@ -279,37 +297,52 @@
_width = Math.floor((100 / card.bottom.actions.length) * 10000) / 10000 + '%'
}
let outclass = card.widthType === 'ratio' ? ' ant-col ant-col-' + card.cardWidth : ''
- if (card.background && card.background[1]) {
- outclass += ' background ' + card.background[1]
+ if (card.background) {
+ outclass += ' background ' + card.background
}
- console.log(card)
+ if (card.border === 'hidden') {
+ outclass += ' without-border'
+ } else {
+ outclass += ' ant-card-bordered'
+ }
+
return (
<div className="line-card-edit-box mingke-table">
{card.title ? <p className="chart-title">{card.title}</p> : null}
<div
- className={'ant-card ant-card-bordered chart-card ' + outclass}
+ className={'ant-card chart-card ' + outclass}
style={card.widthType === 'absolute' ? { width: card.cardWidth } : null}
>
{card.subelement.includes('header') ?
<div className="ant-card-head">
<Icon className="edit" title="Edit" type="edit" onClick={this.editHeader} />
+ <Icon className="edit close" title="close" type="close" onClick={() => this.deleteElem('header')} />
<div className="ant-card-head-wrapper">
<div className="ant-card-head-title">{card.header.content}</div>
- {card.header.actions && card.header.actions.length > 0 ? <div className="ant-card-extra">
- <span>{card.header.actions.length === 1 ? card.header.actions[0].text : 'Action'}</span>
- </div> : null}
+ {card.header.actions && card.header.actions.length > 0 ?
+ <div className="ant-card-extra">
+ {card.header.actions.length === 1 ?
+ <span>
+ {['icon', 'all'].includes(card.header.show) ? <Icon type={card.header.actions[0].icon || 'dash'}/> : null}
+ {['text', 'all'].includes(card.header.show) ? card.header.actions[0].text : null}
+ </span> : null
+ }
+ {card.header.actions.length > 1 ? <span>Action</span> : null}
+ </div> : null
+ }
</div>
</div> : null
}
- {card.subelement.includes('content') ? <div className="ant-card-body">
+ <div className="ant-card-body">
<div className="ant-card-meta">
<Icon type="plus" onClick={() => this.editdetail()} />
{card.subelement.includes('avatar') ?
<div className="ant-card-meta-avatar">
<Icon className="edit" title="Edit" type="edit" onClick={this.editAvatar} />
+ <Icon className="edit close" title="close" type="close" onClick={() => this.deleteElem('avatar')} />
<span className="ant-avatar ant-avatar-circle ant-avatar-image" style={{width: card.avatar.width || card.avatar.size || 32}}>
{card.avatar.type === 'picture' ? <img src={avatar} alt=""/> : null}
- {card.avatar.type === 'icon' ? <Icon className="avatar-icon" style={{fontSize: card.avatar.size + 'px'}} type={card.avatar.icon} /> : null}
+ {card.avatar.type === 'icon' ? <Icon className={'font ' + card.avatar.color} style={{fontSize: card.avatar.size + 'px'}} type={card.avatar.icon} /> : null}
</span>
</div> : null
}
@@ -320,10 +353,11 @@
deleteMenu={this.deletedetail}
/>
</div>
- </div> : null}
+ </div>
{card.subelement.includes('bottom') ?
<ul className="ant-card-actions">
<Icon className="edit" title="Edit" type="edit" onClick={this.editBottom} />
+ <Icon className="edit close" title="close" type="close" onClick={() => this.deleteElem('bottom')} />
{card.bottom.actions.map((item, i) => (<li key={i} style={{width: _width}}>
<span>
{['icon', 'all'].includes(card.bottom.show) ? <Icon type={item.icon || 'dash'}/> : null}
--
Gitblit v1.8.0