From 686bb0f74bc8872b9a363f448186e3bbca12345e Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 16 六月 2020 14:23:08 +0800
Subject: [PATCH] 2020-06-16
---
src/tabviews/zshare/cardcomponent/index.jsx | 133 ++++++++++++++++++++++++++++++++++++++++----
1 files changed, 121 insertions(+), 12 deletions(-)
diff --git a/src/tabviews/zshare/cardcomponent/index.jsx b/src/tabviews/zshare/cardcomponent/index.jsx
index e9e7cfe..42963c9 100644
--- a/src/tabviews/zshare/cardcomponent/index.jsx
+++ b/src/tabviews/zshare/cardcomponent/index.jsx
@@ -18,6 +18,7 @@
class CardCell extends Component {
static propTpyes = {
+ type: PropTypes.any, // 鍗＄墖绫诲瀷锛屾坊鍔犳寜閽负 insert
BID: PropTypes.any, // 涓昏〃ID
BData: PropTypes.any, // 涓昏〃鏁版嵁
Tab: PropTypes.any, // 濡傛灉褰撳墠鍏冪礌涓烘爣绛炬椂锛宼ab涓烘爣绛句俊鎭�
@@ -34,7 +35,10 @@
state = {
extra: null, // 椤堕儴鎸夐挳淇℃伅
- actions: null // 搴曢儴鎸夐挳琛�
+ actions: null, // 搴曢儴鎸夐挳琛�
+ cardwidth: 0,
+ cardheight: 0,
+ plusSize: 0
}
UNSAFE_componentWillMount () {
@@ -54,6 +58,47 @@
shouldComponentUpdate (nextProps, nextState) {
return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState))
+ }
+
+ componentDidMount() {
+ if (this.insertRef) {
+ let _width = this.insertRef.offsetWidth
+ let _height = this.insertRef.offsetHeight
+
+ if (this.props.card.header) {
+ _height += 46
+ }
+ if (this.props.card.bottom) {
+ _height += 49
+ }
+ this.setState({
+ cardwidth: _width,
+ cardheight: _height,
+ plusSize: _width > _height ? _height / 2 : _width / 2
+ })
+ }
+ }
+
+ componentDidUpdate() {
+ if (this.insertRef) {
+ let _width = this.insertRef.offsetWidth
+ let _height = this.insertRef.offsetHeight
+
+ if (this.props.card.header) {
+ _height += 46
+ }
+ if (this.props.card.bottom) {
+ _height += 49
+ }
+
+ if (_height !== this.state.cardheight || _width !== this.state.cardwidth) {
+ this.setState({
+ cardwidth: _width,
+ cardheight: _height,
+ plusSize: _width > _height ? _height / 2 : _width / 2
+ })
+ }
+ }
}
/**
@@ -286,9 +331,9 @@
}
return (
- <div className={className}>
+ <span className={className}>
{content}
- </div>
+ </span>
)
} else if (col.type === 'number') {
let content = ''
@@ -334,9 +379,9 @@
}
return (
- <div className={className}>
+ <span className={className}>
{content}
- </div>
+ </span>
)
}
}
@@ -376,8 +421,8 @@
}
render() {
- const { card, selectKey, data } = this.props
- const { extra, actions } = this.state
+ const { card, selectKey, data, type } = this.props
+ const { extra, actions, plusSize } = this.state
let title = null
if (card.header) {
@@ -390,7 +435,7 @@
return (
<div className={'chart-card-box ' + card.outclass} style={card.outstyle || null} >
- <Card
+ {type !== 'insert' ? <Card
size="small"
className={'chart-card ' + (selectKey === data.key ? 'chart-card-selected' : '')}
title={title}
@@ -416,7 +461,35 @@
})}
</div>
</div>
- </Card>
+ </Card> : null}
+ {type === 'insert' ? <Card
+ size="small"
+ className="chart-card insert"
+ title={card.header ? ' ' : null}
+ bordered={card.bordered}
+ actions={card.bottom.actions ? [''] : null}
+ >
+ <div className="ant-card-meta" ref={(ref) => this.insertRef = ref} style={card.flex ? {display: 'flex'} : null}>
+ {card.avatar ? <div className="ant-card-meta-avatar" style={card.avatar.class}> </div> : null }
+ <div className="ant-card-meta-detail" style={card.flex ? {flex: 1} : null}>
+ {card.details.map((detail, i) => (<div className={detail.class} style={detail.style} key={i}></div>))}
+ </div>
+ </div>
+ <div className="mk-card-insert">
+ <NormalButton
+ BID={this.props.BID}
+ Tab={this.props.Tab}
+ btn={card.insertAction}
+ show={'plus' + plusSize}
+ BData={this.props.BData}
+ setting={this.props.setting}
+ columns={this.props.logcolumns}
+ selectedData={[]}
+ ContainerId={this.props.ContainerId}
+ updateStatus={this.updateStatus}
+ />
+ </div>
+ </Card> : null}
</div>
)
}
@@ -456,6 +529,7 @@
let actionMap = new Map() // 鎸夐挳缁�
let columns = fromJS(config.columns).toJS()
let actions = fromJS(config.action).toJS()
+ let insertAction = null
columns.forEach(col => {
if (col.field) {
@@ -466,6 +540,8 @@
actions.forEach(item => {
if ((item.Ot && item.Ot !== 'notRequired' && !['excelIn', 'excelOut'].includes(item.OpenType)) || item.funcType === 'changeuser') {
actionMap.set(item.uuid, item)
+ } else if (plot.insert === 'true' && !insertAction && item.OpenType === 'pop' && item.sqlType === 'insert' && item.Ot === 'notRequired') {
+ insertAction = item
}
})
@@ -603,6 +679,8 @@
card.switch = plot.switch !== 'false'
+ card.insertAction = insertAction // 娣诲姞鍗＄墖
+
this.setState({card: card, colMap: colMap})
}
@@ -622,9 +700,10 @@
const { plot } = this.props
const { card } = this.state
- let _flex = false
if (card.avatar) {
+ let _flex = false
let _cardWidth = 300
+
if (plot.widthType === 'absolute') {
_cardWidth = plot.cardWidth
} else {
@@ -695,6 +774,22 @@
/>
))
}
+ {!loading && card.insertAction && plot.over !== 'roll' ?
+ <CardCell
+ key="insert"
+ type="insert"
+ BID={BID}
+ Tab={Tab}
+ card={card}
+ data={{key: 'insert'}}
+ BData={BData}
+ MenuID={MenuID}
+ setting={config.setting}
+ ContainerId={ContainerId}
+ switchCard={() => {}}
+ refreshdata={this.props.refreshdata}
+ /> : null
+ }
{plot.over === 'roll' && data && data.length > 0 ?
<Tabs activeKey="">
{data.map((item, i) => (
@@ -713,11 +808,25 @@
switchCard={this.switchCard}
refreshdata={this.props.refreshdata}
/>} key={i}></TabPane>
-
))}
+ {!loading && card.insertAction ?
+ <TabPane tab={<CardCell
+ type="insert"
+ BID={BID}
+ Tab={Tab}
+ card={card}
+ data={{key: 'insert'}}
+ BData={BData}
+ MenuID={MenuID}
+ setting={config.setting}
+ ContainerId={ContainerId}
+ switchCard={() => {}}
+ refreshdata={this.props.refreshdata}
+ />} key="insert"></TabPane> : null
+ }
</Tabs> : null
}
- {!data || data.length === 0 ? <Empty description={false}/> : null}
+ {(loading || !card.insertAction) && (!data || data.length === 0) ? <Empty description={false}/> : null}
<div className="clear"></div>
</div>
)
--
Gitblit v1.8.0