From 6ed64ed071c75901ed8848131bfefa51c5c27fce Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 24 九月 2020 23:51:51 +0800
Subject: [PATCH] 2020-09-24
---
src/menu/datasource/verifycard/utils.jsx | 2
src/mob/colorsketch/index.jsx | 23
src/menu/components/card/cardcellcomponent/dragaction/index.scss | 32 +
src/mob/controller/index.jsx | 2
src/menu/components/card/cardcellcomponent/index.jsx | 188 +++++++++
src/menu/actioncomponent/dragaction/card.jsx | 2
src/menu/actioncomponent/formconfig.jsx | 8
src/menu/components/card/cardcellcomponent/index.scss | 28 +
src/menu/actioncomponent/actionform/index.jsx | 44 -
src/menu/actioncomponent/dragaction/index.jsx | 3
src/menu/components/card/cardcellcomponent/dragaction/index.jsx | 89 ++++
src/menu/components/card/cardcellcomponent/elementform/index.jsx | 336 ++++++++++++++++
src/menu/actioncomponent/index.jsx | 2
src/menu/components/card/data-card/index.jsx | 10
src/menu/components/card/cardcellcomponent/dragaction/card.jsx | 67 +++
src/menu/components/card/cardcellcomponent/formconfig.jsx | 238 +++++++++++
src/templates/sharecomponent/actioncomponent/index.jsx | 17
src/menu/components/card/data-card/index.scss | 15
src/templates/zshare/createinterface/index.jsx | 2
src/components/sidemenu/config.jsx | 16
src/mob/colorsketch/index.scss | 27
src/menu/components/card/cardcellcomponent/elementform/index.scss | 24 +
src/menu/bgcontroller/index.jsx | 19
src/utils/option.js | 2
24 files changed, 1,077 insertions(+), 119 deletions(-)
diff --git a/src/components/sidemenu/config.jsx b/src/components/sidemenu/config.jsx
index d6fc819..5595166 100644
--- a/src/components/sidemenu/config.jsx
+++ b/src/components/sidemenu/config.jsx
@@ -177,14 +177,14 @@
MenuNo: 'bd_msn_sms_tempM',
MenuName: '澶т簬鐭俊妯℃澘',
text: '澶т簬鐭俊妯℃澘'
- }, {
- src: '',
- PageParam: {OpenType: 'newtab', Template: 'ManageTable'},
- type: 'ManageTable',
- MenuID: '1599613340050c8nu6rbst9d4emnnbsq',
- MenuNo: 's_sms_qxM',
- MenuName: '濂囦簯鐭俊妯℃澘',
- text: '濂囦簯鐭俊妯℃澘'
+ // }, {
+ // src: '',
+ // PageParam: {OpenType: 'newtab', Template: 'ManageTable'},
+ // type: 'ManageTable',
+ // MenuID: '1599613340050c8nu6rbst9d4emnnbsq',
+ // MenuNo: 's_sms_qxM',
+ // MenuName: '濂囦簯鐭俊妯℃澘',
+ // text: '濂囦簯鐭俊妯℃澘'
}]
}, {
MenuID: 'systemPayManage',
diff --git a/src/menu/actioncomponent/actionform/index.jsx b/src/menu/actioncomponent/actionform/index.jsx
index b383f2c..953fea6 100644
--- a/src/menu/actioncomponent/actionform/index.jsx
+++ b/src/menu/actioncomponent/actionform/index.jsx
@@ -6,7 +6,6 @@
import Api from '@/api'
import options from '@/store/options.js'
-import Utils from '@/utils/utils.js'
import './index.scss'
const { TextArea } = Input
@@ -16,7 +15,7 @@
exec: ['label', 'OpenType', 'intertype', 'Ot', 'show', 'icon', 'class', 'execSuccess', 'execError'],
excelIn: ['label', 'Ot', 'OpenType', 'intertype', 'show', 'icon', 'class', 'sheet', 'execSuccess', 'execError'],
excelOut: ['label', 'OpenType', 'intertype', 'show', 'icon', 'class', 'execSuccess', 'execError', 'pagination', 'search'],
- popview: ['label', 'Ot', 'OpenType', 'show', 'icon', 'class', 'tabType', 'linkTab', 'popClose'],
+ popview: ['label', 'Ot', 'OpenType', 'show', 'icon', 'class', 'popClose'],
tab: ['label', 'Ot', 'OpenType', 'show', 'icon', 'class', 'linkmenu'],
innerpage: ['label', 'Ot', 'OpenType', 'pageTemplate', 'show', 'icon', 'class'],
funcbutton: ['label', 'OpenType', 'funcType', 'show', 'icon', 'class']
@@ -28,7 +27,6 @@
setting: PropTypes.object, // 椤甸潰璁剧疆
formlist: PropTypes.any, // 琛ㄥ崟淇℃伅
card: PropTypes.any, // 鎸夐挳淇℃伅
- tabs: PropTypes.array, // 鎵�鏈夋爣绛鹃〉
inputSubmit: PropTypes.any // 鍥炶溅鎻愪氦浜嬩欢
}
@@ -119,14 +117,6 @@
} else {
item.options = this.state.insertUpdateOptions
}
- } else if (item.key === 'linkTab') {
- item.options = [
- {
- value: '',
- text: '鏂板缓'
- },
- ...this.props.tabs
- ]
} else if (item.key === 'OpenType') {
item.initVal = _opentype
}
@@ -245,26 +235,6 @@
_fieldval.class = 'dgreen'
}
- this.props.form.setFieldsValue(_fieldval)
- })
- } else if (key === 'tabType') {
- let _tabs = this.props.tabs.filter(tab => tab.type === value)
- let _fieldval = {}
-
- this.setState({
- formlist: this.state.formlist.map(item => {
- if (item.key === 'linkTab') {
- item.options = [
- {
- value: '',
- text: '鏂板缓'
- },
- ..._tabs
- ]
- }
- return item
- })
- }, () => {
this.props.form.setFieldsValue(_fieldval)
})
} else if (key === 'funcType') {
@@ -643,8 +613,13 @@
values.uuid = this.props.card.uuid
values.verify = this.props.card.verify || null
- if (values.show === 'icon') {
-
+ if (values.show === 'icon' && !values.icon) {
+ notification.warning({
+ top: 92,
+ message: '璇烽�夋嫨鍥炬爣锛�',
+ duration: 5
+ })
+ return
} else if (values.OpenType === 'excelOut') {
if (values.intertype === 'system' && setting.interType !== 'system') {
notification.warning({
@@ -656,8 +631,7 @@
}
values.Ot = 'notRequired'
- } else if (values.OpenType === 'popview' && !values.linkTab) { // 娌℃湁鍏宠仈鏍囩锛堟柊寤烘椂锛夛紝鍒涘缓鏂版爣绛綢d
- values.linkTab = Utils.getuuid()
+ } else if (values.OpenType === 'popview') {
values.createTab = true // 鐢ㄤ簬鏍囪鎸夐挳澶嶅埗鏃讹紝鏄惁澶嶅埗鍘熸湁鏍囩
} else if (values.OpenType === 'funcbutton') { // 杞崲鎵撳嵃鏃舵墦寮�鏂瑰紡
if (values.funcType === 'print') {
diff --git a/src/menu/actioncomponent/dragaction/card.jsx b/src/menu/actioncomponent/dragaction/card.jsx
index 41c4a02..cdf4baf 100644
--- a/src/menu/actioncomponent/dragaction/card.jsx
+++ b/src/menu/actioncomponent/dragaction/card.jsx
@@ -38,7 +38,7 @@
let btnElement = null
if (card.show === 'icon') {
- btnElement = (<Icon type={card.icon} className={'mk-icon mk-' + card.class}/>)
+ btnElement = (card.icon ? <Icon type={card.icon} className={'mk-icon mk-' + card.class}/> : null)
} else if (card.show === 'link') {
btnElement = (<span className={'mk-link mk-' + card.class}>{card.label}{card.icon ? <Icon type={card.icon}/> : null}</span>)
} else {
diff --git a/src/menu/actioncomponent/dragaction/index.jsx b/src/menu/actioncomponent/dragaction/index.jsx
index ddbf3ea..3432829 100644
--- a/src/menu/actioncomponent/dragaction/index.jsx
+++ b/src/menu/actioncomponent/dragaction/index.jsx
@@ -150,8 +150,7 @@
doubleClickCard={doubleClickBtn}
/>
))}
-
- <Icon type="plus" onClick={addaction}/>
+ <Icon type="plus" title="娣诲姞鎸夐挳" onClick={addaction}/>
</div>
)
}
diff --git a/src/menu/actioncomponent/formconfig.jsx b/src/menu/actioncomponent/formconfig.jsx
index 0a83d2c..582d73d 100644
--- a/src/menu/actioncomponent/formconfig.jsx
+++ b/src/menu/actioncomponent/formconfig.jsx
@@ -161,14 +161,6 @@
},
{
type: 'select',
- key: 'linkTab',
- label: '鍏宠仈鏍囩',
- initVal: card.linkTab || '',
- required: false,
- options: []
- },
- {
- type: 'select',
key: 'pageTemplate',
label: Formdict['model.form.newpage.type'],
initVal: card.pageTemplate || '',
diff --git a/src/menu/actioncomponent/index.jsx b/src/menu/actioncomponent/index.jsx
index 4779d80..c95adb2 100644
--- a/src/menu/actioncomponent/index.jsx
+++ b/src/menu/actioncomponent/index.jsx
@@ -28,7 +28,6 @@
static propTpyes = {
type: PropTypes.string, // 鑿滃崟绫诲瀷锛屼富琛ㄦ垨瀛愯〃
config: PropTypes.object, // 鑿滃崟閰嶇疆淇℃伅
- tabs: PropTypes.array, // 鎵�鏈夋爣绛�
setSubConfig: PropTypes.func, // 璁剧疆瀛愰厤缃俊鎭�
updateaction: PropTypes.func // 鑿滃崟閰嶇疆鏇存柊
}
@@ -921,7 +920,6 @@
<ActionForm
dict={dict}
card={card}
- tabs={this.props.tabs}
formlist={this.state.formlist}
inputSubmit={this.handleSubmit}
setting={config.setting}
diff --git a/src/menu/bgcontroller/index.jsx b/src/menu/bgcontroller/index.jsx
index c3d6591..8c92d37 100644
--- a/src/menu/bgcontroller/index.jsx
+++ b/src/menu/bgcontroller/index.jsx
@@ -60,22 +60,6 @@
}
/**
- * @description 淇敼瀛椾綋棰滆壊 锛屾墜鍔ㄨ緭鍏�
- */
- changeBackgroundColorInput = (e) => {
- let val = e.target.value
- this.setState({
- backgroundColor: val
- })
-
- let config = fromJS(this.props.config).toJS()
- config.style.backgroundColor = val
-
- this.props.updateConfig(config)
- // if (/^#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})$|^[rR][gG][Bb][Aa]?[(]([\s]*(2[0-4][0-9]|25[0-5]|[01]?[0-9][0-9]?),){2}[\s]*(2[0-4][0-9]|25[0-5]|[01]?[0-9][0-9]?),?[\s]*(0\.\d{1,2}|1|0)?[)]{1}$/.test(val)) {}
- }
-
- /**
* @description 鎵嬪姩淇敼璺緞
*/
changeImage = (e) => {
@@ -129,8 +113,7 @@
<div className="menu-background-controller">
<Form {...formItemLayout}>
<Form.Item className="color-control" colon={false} label="棰滆壊">
- <ColorSketch color={backgroundColor} changeColor={this.changeBackgroundColor} />
- <Input value={backgroundColor} onChange={this.changeBackgroundColorInput} />
+ <ColorSketch value={backgroundColor} onChange={this.changeBackgroundColor} />
</Form.Item>
<Form.Item colon={false} label="鍥剧墖">
<FileUpload value={bgimages} maxFile={2} fileType="text" onChange={this.imgChange}/>
diff --git a/src/menu/components/card/cardcellcomponent/dragaction/card.jsx b/src/menu/components/card/cardcellcomponent/dragaction/card.jsx
new file mode 100644
index 0000000..00b39aa
--- /dev/null
+++ b/src/menu/components/card/cardcellcomponent/dragaction/card.jsx
@@ -0,0 +1,67 @@
+import React from 'react'
+import { useDrag, useDrop } from 'react-dnd'
+import { Icon, Popover, Slider } from 'antd'
+import './index.scss'
+
+const Card = ({ id, cardIds, card, moveCard, findCard, editCard, delCard }) => {
+ const originalIndex = findCard(id).index
+ const [{ isDragging }, drag] = useDrag({
+ item: { type: 'action', id, originalIndex },
+ collect: monitor => ({
+ isDragging: monitor.isDragging(),
+ }),
+ })
+ const [, drop] = useDrop({
+ accept: 'action',
+ canDrop: () => true,
+ drop({ id: draggedId }) {
+ if (!draggedId) return
+ if (!cardIds.includes(draggedId)) return
+
+ if (draggedId !== id) {
+ const { index: overIndex } = findCard(id)
+ moveCard(draggedId, overIndex)
+ }
+ },
+ })
+
+ let _style = {opacity: isDragging ? 0 : 1}
+
+ _style.textAlign = card.align
+ _style.color = card.color
+
+ if (card.padding) {
+ _style.padding = card.padding
+ }
+
+ const getContent = () => {
+ if (card.eleType === 'text' || card.eleType === 'number') {
+ return card.value
+ } else if (card.eleType === 'icon') {
+ return (<Icon type={card.icon}/>)
+ } else if (card.eleType === 'slider') {
+ return (
+ <div className="ant-slider">
+ <div className="ant-slider-rail"></div>
+ <div className="ant-slider-track" style={{width: '30%', backgroundColor: card.color}}></div>
+ <div className="ant-slider-handle" style={{left: '30%', borderColor: card.color}}></div>
+ <div style={{display: 'none'}}><Slider value={30} tooltipVisible={false} /></div>
+ </div>
+ )
+ }
+ }
+
+ return (
+ <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
+ <div className="mk-popover-control">
+ <Icon className="edit" title="edit" type="edit" onClick={() => editCard(id)} />
+ <Icon className="close" title="close" type="close" onClick={() => delCard(id)} />
+ </div>
+ } trigger="hover">
+ <div ref={node => drag(drop(node))} className={'ant-col card-cell ant-col-' + card.width} style={_style}>
+ {getContent()}
+ </div>
+ </Popover>
+ )
+}
+export default Card
diff --git a/src/menu/components/card/cardcellcomponent/dragaction/index.jsx b/src/menu/components/card/cardcellcomponent/dragaction/index.jsx
new file mode 100644
index 0000000..90e4bc9
--- /dev/null
+++ b/src/menu/components/card/cardcellcomponent/dragaction/index.jsx
@@ -0,0 +1,89 @@
+import React, { useState } from 'react'
+import { useDrop } from 'react-dnd'
+import { is, fromJS } from 'immutable'
+import update from 'immutability-helper'
+import { Icon } from 'antd'
+
+import Utils from '@/utils/utils.js'
+import Card from './card'
+import './index.scss'
+
+const Container = ({type, list, handleList, handleMenu, deleteMenu }) => {
+ const [cards, setCards] = useState(list)
+ const moveCard = (id, atIndex) => {
+ const { card, index } = findCard(id)
+ const _cards = update(cards, { $splice: [[index, 1], [atIndex, 0, card]] })
+ handleList(_cards)
+ }
+
+ if (!is(fromJS(cards), fromJS(list))) {
+ setCards(list)
+ }
+
+ const findCard = id => {
+ const card = cards.filter(c => `${c.uuid}` === id)[0]
+ return {
+ card,
+ index: cards.indexOf(card),
+ }
+ }
+
+ const editCard = id => {
+ const { card } = findCard(id)
+ handleMenu(card)
+ }
+
+ const delCard = id => {
+ const { card } = findCard(id)
+ deleteMenu(card)
+ }
+
+ let cardIds = cards.map(card => card.uuid)
+
+ const [, drop] = useDrop({
+ accept: 'action',
+ drop() {}
+ })
+
+ const addelement = () => {
+ let newcard = {}
+ newcard.uuid = Utils.getuuid()
+ newcard.focus = true
+
+ newcard.eleType = 'text'
+ newcard.datatype = 'dynamic'
+ newcard.color = 'rgba(0,0,0,0.85)'
+ newcard.padding = '5px'
+ newcard.align = 'left'
+
+ let targetId = cards.length > 0 ? cards[cards.length - 1].uuid : 0
+
+ const { index: overIndex } = findCard(`${targetId}`)
+ let targetIndex = overIndex
+
+ targetIndex++
+
+ const _cards = update(cards, { $splice: [[targetIndex, 0, newcard]] })
+
+ handleList(_cards, newcard)
+ }
+
+ return (
+ <div ref={drop} className="ant-row card-detail-row">
+ {cards.map(card => (
+ <Card
+ id={card.uuid}
+ key={card.uuid}
+ cardIds={cardIds}
+ card={card}
+ moveCard={moveCard}
+ editCard={editCard}
+ delCard={delCard}
+ findCard={findCard}
+ />
+ ))}
+ <Icon type="plus" title="娣诲姞鍏冪礌" onClick={addelement}/>
+ </div>
+ )
+}
+export default Container
diff --git a/src/menu/components/card/cardcellcomponent/dragaction/index.scss b/src/menu/components/card/cardcellcomponent/dragaction/index.scss
new file mode 100644
index 0000000..7896580
--- /dev/null
+++ b/src/menu/components/card/cardcellcomponent/dragaction/index.scss
@@ -0,0 +1,32 @@
+.card-detail-row {
+ .ant-slider-track {
+ height: 7px;
+ }
+ .ant-slider-rail {
+ height: 7px;
+ }
+ .cyan {
+ .ant-slider-track {
+ background-color: #13C2C2;
+ }
+ .ant-slider-handle {
+ border-color: #13C2C2;
+ }
+ }
+ .orange {
+ .ant-slider-track {
+ background-color: orange;
+ }
+ .ant-slider-handle {
+ border-color: lightsalmon;
+ }
+ }
+ .primary {
+ .ant-slider-track {
+ background-color: #1890ff;
+ }
+ .ant-slider-handle {
+ border-color: #91d5ff;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/menu/components/card/cardcellcomponent/elementform/index.jsx b/src/menu/components/card/cardcellcomponent/elementform/index.jsx
new file mode 100644
index 0000000..0107902
--- /dev/null
+++ b/src/menu/components/card/cardcellcomponent/elementform/index.jsx
@@ -0,0 +1,336 @@
+import React, {Component} from 'react'
+import PropTypes from 'prop-types'
+import { fromJS } from 'immutable'
+import { Form, Row, Col, Input, Select, Icon, Radio, Tooltip, InputNumber } from 'antd'
+import { formRule } from '@/utils/option.js'
+
+import ColorSketch from '@/mob/colorsketch'
+import './index.scss'
+
+const cardTypeOptions = {
+ text: ['eleType', 'datatype', 'value', 'format', 'fontSize', 'fontWeight', 'width', 'height', 'color', 'align', 'padding', 'prefix', 'postfix'],
+ number: ['eleType', 'datatype', 'value', 'format', 'fontSize', 'fontWeight', 'width', 'height', 'color', 'align', 'padding', 'prefix', 'postfix'],
+ picture: ['eleType', 'datatype', 'width', 'lenWidRadio', 'radius', 'padding'],
+ icon: ['eleType', 'icon', 'fontSize', 'width', 'height', 'color', 'align', 'padding', 'tooltip'],
+ slider: ['eleType', 'field', 'width', 'sildercolor', 'padding'],
+ splitline: ['eleType', 'color', 'padding'],
+}
+
+class MainSearch extends Component {
+ static propTpyes = {
+ dict: PropTypes.object, // 瀛楀吀椤�
+ config: PropTypes.object, // 缁勪欢淇℃伅
+ formlist: PropTypes.any, // 琛ㄥ崟淇℃伅
+ card: PropTypes.any, // 鎸夐挳淇℃伅
+ inputSubmit: PropTypes.any // 鍥炶溅鎻愪氦浜嬩欢
+ }
+
+ state = {
+ formlist: null, // 琛ㄥ崟淇℃伅
+ eleType: '',
+ datatype: ''
+ }
+
+
+ UNSAFE_componentWillMount () {
+ const { card, config } = this.props
+
+ let _options = this.getOptions(card.eleType, card.datatype)
+
+ this.setState({
+ eleType: card.eleType,
+ datatype: card.datatype,
+ formlist: this.props.formlist.map(item => {
+ item.hidden = !_options.includes(item.key)
+
+ if (item.key === 'field') {
+ item.options = []
+ config.columns.forEach(col => {
+ if (!/^Nvarchar/ig.test(col.datatype) && (card.eleType === 'number' || card.eleType === 'slider')) {
+ item.options.push({
+ value: col.field,
+ text: col.label
+ })
+ } else if (/^Nvarchar/ig.test(col.datatype) && card.eleType !== 'number' && card.eleType !== 'slider') {
+ item.options.push({
+ value: col.field,
+ text: col.label
+ })
+ }
+ })
+ }
+
+ return item
+ })
+ })
+ }
+
+ getOptions = (eleType, datatype) => {
+ let _options = fromJS(cardTypeOptions[eleType]).toJS() // 閫夐」鍒楄〃
+
+ if (['text', 'number', 'picture'].includes(eleType)) {
+ if (datatype === 'dynamic') {
+ _options.push('field')
+ }
+ }
+
+ return _options
+ }
+
+ /**
+ * @description 涓嬫媺鍒囨崲
+ * 1銆佹墦寮�鏂瑰紡鍒囨崲锛岄噸缃彲瑙佽〃鍗曞拰琛ㄥ崟鍊�
+ * 2銆佹樉绀轰綅缃垏鎹紝閲嶇疆閫夋嫨琛�
+ * 3銆佸垏鎹㈡爣绛剧被鍨嬶紝閲嶇疆鍙�夋爣绛�
+ */
+ selectChange = (key, value, option) => {
+ const { config } = this.props
+ const { datatype } = this.state
+
+ if (key === 'eleType') {
+ let _options = this.getOptions(value, datatype)
+
+ let _formlist = this.state.formlist.map(item => {
+ item.hidden = !_options.includes(item.key)
+ if (item.key === 'field') {
+ item.options = []
+ config.columns.forEach(col => {
+ if (!/^Nvarchar/ig.test(col.datatype) && (value === 'number' || value === 'slider')) {
+ item.options.push({
+ value: col.field,
+ text: col.label
+ })
+ } else if (/^Nvarchar/ig.test(col.datatype) && value !== 'number' && value !== 'slider') {
+ item.options.push({
+ value: col.field,
+ text: col.label
+ })
+ }
+ })
+ }
+
+ return item
+ })
+
+ this.setState({
+ eleType: value,
+ formlist: _formlist
+ }, () => {
+ if (value === 'slider' || value === 'splitline') {
+ if (this.props.form.getFieldValue('width') !== undefined) {
+ this.props.form.setFieldsValue({width: 24})
+ }
+ }
+ })
+ } else if (key === 'field') {
+ if (this.props.form.getFieldValue('value') !== undefined) {
+ this.props.form.setFieldsValue({value: option.props.title})
+ }
+ }
+ }
+
+ onChange = (e, key) => {
+ const { eleType } = this.state
+ let value = e.target.value
+
+ if (key === 'datatype') {
+ let _options = this.getOptions(eleType, value)
+ this.setState({
+ formlist: this.state.formlist.map(item => {
+ item.hidden = !_options.includes(item.key)
+
+ return item
+ })
+ })
+ }
+ }
+
+ handleSubmit = (e) => {
+ e.preventDefault()
+
+ if (this.props.inputSubmit) {
+ this.props.inputSubmit()
+ }
+ }
+
+ getFields() {
+ const { getFieldDecorator } = this.props.form
+ const fields = []
+
+ this.state.formlist.forEach((item, index) => {
+ if (item.hidden) return
+
+ if (item.type === 'text') { // 鏂囨湰鎼滅储
+ let rules = []
+
+ if (item.key === 'padding') {
+ rules = [{
+ pattern: /^\d+px$|^\d+px\s\d+px$|^\d+px\s\d+px\s\d+px$|^\d+px\s\d+px\s\d+px\s\d+px$/ig,
+ message: '璇锋纭緭鍏ュ唴杈硅窛锛�'
+ }]
+ }
+
+ fields.push(
+ <Col span={12} key={index}>
+ <Form.Item label={item.tooltip ?
+ <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}>
+ <Icon type="question-circle" />
+ {item.label}
+ </Tooltip> : item.label
+ }>
+ {getFieldDecorator(item.key, {
+ initialValue: item.initVal || '',
+ rules: [
+ {
+ required: item.readonly ? false : !!item.required,
+ message: this.props.dict['form.required.input'] + item.label + '!'
+ },
+ {
+ max: formRule.input.max,
+ message: formRule.input.message
+ },
+ ...rules
+ ]
+ })(<Input placeholder="" autoComplete="off" disabled={item.readonly} onPressEnter={this.handleSubmit} />)}
+ </Form.Item>
+ </Col>
+ )
+ } else if (item.type === 'number') {
+ fields.push(
+ <Col span={12} key={index}>
+ <Form.Item label={item.tooltip ?
+ <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}>
+ <Icon type="question-circle" />
+ {item.label}
+ </Tooltip> : item.label
+ }>
+ {getFieldDecorator(item.key, {
+ initialValue: item.initVal,
+ rules: [
+ {
+ required: item.readonly ? false : !!item.required,
+ message: this.props.dict['form.required.input'] + item.label + '!'
+ }
+ ]
+ })(<InputNumber min={0} max={10000} precision={0} />)}
+ </Form.Item>
+ </Col>
+ )
+ } else if (item.type === 'select') { // 涓嬫媺鎼滅储
+ fields.push(
+ <Col span={12} key={index}>
+ <Form.Item label={item.tooltip ?
+ <Tooltip placement="topLeft" overlayClassName={item.tooltipClass} title={item.tooltip}>
+ <Icon type="question-circle" />
+ {item.label}
+ </Tooltip> : item.label
+ }>
+ {getFieldDecorator(item.key, {
+ initialValue: item.initVal || '',
+ rules: [
+ {
+ required: !!item.required,
+ message: this.props.dict['form.required.select'] + item.label + '!'
+ }
+ ]
+ })(
+ <Select
+ showSearch
+ filterOption={(input, option) => option.props.children[2].toLowerCase().indexOf(input.toLowerCase()) >= 0}
+ onChange={(value, option) => {this.selectChange(item.key, value, option)}}
+ getPopupContainer={() => document.getElementById('card-winter')}
+ >
+ {item.options.map((option, index) =>
+ <Select.Option id={`${index}`} title={option.text} key={`${index}`} value={option.value}>
+ {item.key === 'icon' && option.value && <Icon type={option.value} />} {option.text}
+ </Select.Option>
+ )}
+ </Select>
+ )}
+ </Form.Item>
+ </Col>
+ )
+ } else if (item.type === 'radio') {
+ fields.push(
+ <Col span={12} key={index}>
+ <Form.Item label={item.label}>
+ {getFieldDecorator(item.key, {
+ initialValue: item.initVal,
+ rules: [
+ {
+ required: !!item.required,
+ message: this.props.dict['form.required.select'] + item.label + '!'
+ }
+ ]
+ })(
+ <Radio.Group onChange={(e) => {this.onChange(e, item.key)}} disabled={item.readonly}>
+ {
+ item.options.map(option => {
+ return (
+ <Radio key={option.value} value={option.value}>{option.text}</Radio>
+ )
+ })
+ }
+ </Radio.Group>
+ )}
+ </Form.Item>
+ </Col>
+ )
+ } else if (item.type === 'color') {
+ fields.push(
+ <Col span={12} key={index} className="color-form">
+ <Form.Item label={item.label}>
+ {getFieldDecorator(item.key, {
+ initialValue: item.initVal,
+ rules: [
+ {
+ required: !!item.required,
+ message: this.props.dict['form.required.select'] + item.label + '!'
+ }
+ ]
+ })(
+ <ColorSketch />
+ )}
+ </Form.Item>
+ </Col>
+ )
+ }
+ })
+ return fields
+ }
+
+ handleConfirm = () => {
+ // 琛ㄥ崟鎻愪氦鏃舵鏌ヨ緭鍏ュ�兼槸鍚︽纭�
+ return new Promise((resolve, reject) => {
+ this.props.form.validateFieldsAndScroll((err, values) => {
+ if (!err) {
+ values.uuid = this.props.card.uuid
+ values.marks = this.props.card.marks || null
+ resolve(values)
+ } else {
+ reject(err)
+ }
+ })
+ })
+ }
+
+ render() {
+ const formItemLayout = {
+ labelCol: {
+ xs: { span: 24 },
+ sm: { span: 7 }
+ },
+ wrapperCol: {
+ xs: { span: 24 },
+ sm: { span: 17 }
+ }
+ }
+ return (
+ <Form {...formItemLayout} className="menu-card-detail-form" id="card-winter">
+ <Row gutter={24}>{this.getFields()}</Row>
+ </Form>
+ )
+ }
+}
+
+export default Form.create()(MainSearch)
\ No newline at end of file
diff --git a/src/menu/components/card/cardcellcomponent/elementform/index.scss b/src/menu/components/card/cardcellcomponent/elementform/index.scss
new file mode 100644
index 0000000..166f28c
--- /dev/null
+++ b/src/menu/components/card/cardcellcomponent/elementform/index.scss
@@ -0,0 +1,24 @@
+.menu-card-detail-form {
+ min-height: 190px;
+
+ .ant-input-number {
+ width: 100%;
+ }
+ .ant-form-item-label {
+ .anticon-question-circle {
+ color: #c49f47;
+ margin-right: 5px;
+ }
+ }
+ .ant-col {
+ height: 65px;
+ }
+ .color-form {
+ .ant-form-item-control {
+ .color-sketch-block {
+ position: relative;
+ top: 7px;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/menu/components/card/cardcellcomponent/formconfig.jsx b/src/menu/components/card/cardcellcomponent/formconfig.jsx
new file mode 100644
index 0000000..891ba78
--- /dev/null
+++ b/src/menu/components/card/cardcellcomponent/formconfig.jsx
@@ -0,0 +1,238 @@
+// import zhCN from '@/locales/zh-CN/model.js'
+// import enUS from '@/locales/en-US/model.js'
+
+// const Formdict = localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS
+
+/**
+ * @description 鑾峰彇鎸夐挳琛ㄥ崟閰嶇疆淇℃伅
+ * @param {*} card 缂栬緫鎸夐挳
+ * @param {*} setting 缁勪欢閰嶇疆
+ * @param {*} permFuncField 瀛樺偍杩囩▼鍙敤鐨勫紑濮嬪瓧娈�
+ * @param {*} type 鎸夐挳绫诲瀷锛岀敤浜庡尯鍒嗗彲閫夌殑鎵撳紑鏂瑰紡
+ */
+export function getCardCellForm (card) {
+ let forms = [
+ {
+ type: 'select',
+ key: 'eleType',
+ label: '鍏冪礌绫诲瀷',
+ initVal: card.eleType,
+ required: true,
+ options: [
+ { value: 'text', text: '鏂囨湰'},
+ { value: 'number', text: '鏁板��'},
+ { value: 'picture', text: '鍥剧墖'},
+ { value: 'icon', text: '鍥炬爣'},
+ { value: 'slider', text: '杩涘害鏉�'},
+ { value: 'splitline', text: '鍒嗗壊绾�'},
+ ]
+ },
+ {
+ type: 'radio',
+ key: 'datatype',
+ label: '鏁版嵁绫诲瀷',
+ initVal: card.datatype || 'dynamic',
+ required: true,
+ options: [
+ { value: 'dynamic', text: '鍔ㄦ��' },
+ { value: 'static', text: '闈欐��' }
+ ]
+ },
+ {
+ type: 'select',
+ key: 'field',
+ label: '瀛楁',
+ initVal: card.field || '',
+ required: true,
+ options: []
+ },
+ {
+ type: 'text',
+ key: 'value',
+ label: '鍐呭',
+ initVal: card.value || '',
+ required: true
+ },
+ {
+ type: 'text',
+ key: 'prefix',
+ label: '鍓嶇紑',
+ initVal: card.prefix || '',
+ required: false
+ },
+ {
+ type: 'text',
+ key: 'postfix',
+ label: '鍚庣紑',
+ initVal: card.postfix || '',
+ required: false
+ },
+ {
+ type: 'select',
+ key: 'icon',
+ label: '鍥炬爣',
+ initVal: card.icon,
+ required: true,
+ options: [
+ { value: 'question-circle', text: 'question-circle'},
+ { value: 'alert', text: 'alert'},
+ { value: 'cloud', text: 'cloud'},
+ { value: 'eye', text: 'eye'},
+ { value: 'eye-invisible', text: 'eye-invisible'},
+ { value: 'android', text: 'android'},
+ { value: 'apple', text: 'apple'},
+ { value: 'windows', text: 'windows'},
+ { value: 'ie', text: 'ie'},
+ { value: 'chrome', text: 'chrome'},
+ { value: 'github', text: 'github'},
+ { value: 'aliwangwang', text: 'aliwangwang'},
+ { value: 'dingding', text: 'dingding'},
+ { value: 'wechat', text: 'wechat'},
+ { value: 'alipay', text: 'alipay'},
+ { value: 'weibo-square', text: 'weibo-square'},
+ { value: 'weibo-circle', text: 'weibo-circle'},
+ { value: 'taobao-circle', text: 'taobao-circle'},
+ { value: 'weibo', text: 'weibo'},
+ { value: 'twitter', text: 'twitter'},
+ { value: 'youtube', text: 'youtube'},
+ { value: 'alipay-circle', text: 'alipay-circle'},
+ { value: 'taobao', text: 'taobao'},
+ { value: 'skype', text: 'skype'},
+ { value: 'qq', text: 'qq'},
+ { value: 'gitlab', text: 'gitlab'},
+ { value: 'zhihu', text: 'zhihu'},
+ { value: 'slack', text: 'slack'},
+ { value: 'sketch', text: 'sketch'},
+ { value: 'yahoo', text: 'yahoo'},
+ { value: 'reddit', text: 'reddit'},
+ { value: 'dribbble', text: 'dribbble'},
+ ]
+ },
+ {
+ type: 'text',
+ key: 'tooltip',
+ label: '鎻愮ず淇℃伅',
+ initVal: card.tooltip || '',
+ tooltip: '榧犳爣鎮诞鏃舵樉绀恒��',
+ required: false
+ },
+ {
+ type: 'select',
+ key: 'format',
+ label: '鏍煎紡鍖�',
+ initVal: card.format || '',
+ tooltip: '娉細鐧惧垎鏁般�佸崈鍒嗕綅瀵逛簬鏁板�肩被鍨嬫湁鏁堬紝YYYY-MM-DD瀵逛簬鏃堕棿绫诲瀷鐨勬枃鏈湁鏁堛��',
+ required: false,
+ options: [
+ { value: '', text: '鏃�' },
+ { value: 'percent', text: '鐧惧垎鏁�' },
+ { value: 'thdSeparator', text: '鍗冨垎浣�' },
+ { value: 'YYYY-MM-DD', text: 'YYYY-MM-DD' }
+ ]
+ },
+ {
+ type: 'radio',
+ key: 'align',
+ label: '瀵归綈鏂瑰紡',
+ initVal: card.align || 'left',
+ required: true,
+ options: [
+ { value: 'left', text: '宸﹀榻�' },
+ { value: 'center', text: '灞呬腑' },
+ { value: 'right', text: '鍙冲榻�' },
+ ]
+ },
+ {
+ type: 'number',
+ key: 'fontSize',
+ min: 12,
+ max: 50,
+ label: '瀛椾綋澶у皬',
+ initVal: card.fontSize || 14,
+ required: true,
+ },
+ {
+ type: 'select',
+ key: 'fontWeight',
+ label: '瀛椾綋绮楃粏',
+ initVal: card.fontWeight || 'normal',
+ required: true,
+ options: [
+ { value: 'normal', text: '姝ｅ父' },
+ { value: 'bold', text: 'bold' },
+ { value: 'bolder', text: 'bolder' },
+ { value: 'lighter', text: 'lighter' },
+ { value: '100', text: '100' },
+ { value: '200', text: '200' },
+ { value: '300', text: '300' },
+ { value: '400', text: '400' },
+ { value: '500', text: '500' },
+ { value: '600', text: '600' },
+ { value: '700', text: '700' },
+ { value: '800', text: '800' },
+ { value: '900', text: '900' }
+ ]
+ },
+ {
+ type: 'color',
+ key: 'color',
+ label: '棰滆壊',
+ initVal: card.color,
+ required: false
+ },
+ {
+ type: 'number',
+ key: 'width',
+ min: 1,
+ max: 24,
+ precision: 0,
+ label: '瀹藉害',
+ initVal: card.width || 12,
+ tooltip: '姣忚绛夊垎涓�24浠姐��',
+ required: true
+ },
+ {
+ type: 'number',
+ key: 'height',
+ min: 1,
+ max: 10,
+ label: '楂樺害(琛�)',
+ initVal: card.height || 1,
+ required: true,
+ },
+ {
+ type: 'select',
+ key: 'lenWidRadio',
+ label: '闀垮姣�',
+ initVal: card.lenWidRadio || '1:1',
+ required: true,
+ options: [
+ { value: '1:1', text: '1:1' },
+ { value: '3:2', text: '3:2' },
+ { value: '4:3', text: '4:3' },
+ { value: '16:9', text: '16:9' }
+ ]
+ },
+ {
+ type: 'radio',
+ key: 'radius',
+ label: '鍦嗚',
+ initVal: card.radius || 'false',
+ required: true,
+ options: [
+ { value: 'true', text: '鏈�' },
+ { value: 'false', text: '鏃�' }
+ ]
+ },
+ {
+ type: 'text',
+ key: 'padding',
+ label: '鍐呰竟璺�',
+ initVal: card.padding,
+ tooltip: '鍐呰竟璺濋渶瑕佹寜鐓у浐瀹氭牸寮忓～鍐欙紝渚嬶細5px锛堜笂涓嬪乏鍙冲潎涓�5鍍忕礌锛夛紝5px 10px锛堜笂涓�5鍍忕礌锛屽乏鍙�10鍍忕礌锛夛紝5px 10px 15px锛堜笂5鍍忕礌锛屽乏鍙�10鍍忕礌锛屼笅15鍍忕礌锛夛紝5px 10px 5px 10px锛堜笂5鍍忕礌锛屽彸10鍍忕礌锛屼笅5鍍忕礌锛屽乏10鍍忕礌锛�',
+ required: false
+ },
+ ]
+
+ return forms
+}
diff --git a/src/menu/components/card/cardcellcomponent/index.jsx b/src/menu/components/card/cardcellcomponent/index.jsx
new file mode 100644
index 0000000..023cf5b
--- /dev/null
+++ b/src/menu/components/card/cardcellcomponent/index.jsx
@@ -0,0 +1,188 @@
+import React, {Component} from 'react'
+import PropTypes from 'prop-types'
+import { is, fromJS } from 'immutable'
+import { Modal } from 'antd'
+
+import zhCN from '@/locales/zh-CN/model.js'
+import enUS from '@/locales/en-US/model.js'
+import { getCardCellForm } from './formconfig'
+
+import ElementForm from './elementform'
+import DragElement from './dragaction'
+import './index.scss'
+
+const { confirm } = Modal
+
+class CardCellComponent extends Component {
+ static propTpyes = {
+ config: PropTypes.object, // 鑿滃崟閰嶇疆淇℃伅
+ updateElement: PropTypes.func // 鑿滃崟閰嶇疆鏇存柊
+ }
+
+ state = {
+ dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
+ card: null, // 缂栬緫涓厓绱�
+ formlist: null, // 琛ㄥ崟淇℃伅
+ elements: null, // 鎸夐挳缁�
+ visible: false, // 妯℃�佹鎺у埗
+ }
+
+ /**
+ * @description 鎼滅储鏉′欢鍒濆鍖�
+ */
+ UNSAFE_componentWillMount () {
+ const { config } = this.props
+
+ this.setState({
+ elements: fromJS(config.elements).toJS()
+ })
+ }
+
+ /**
+ * @description 鎸夐挳椤哄簭璋冩暣锛屾垨鎷栨嫿娣诲姞
+ */
+ handleList = (list, card) => {
+ const { config } = this.props
+
+ if (card) {
+ this.setState({elements: list})
+ this.handleElement(card)
+ } else {
+ this.setState({elements: list}, () => {
+ this.props.updateElement({...config, elements: list})
+ })
+ }
+ }
+
+ /**
+ * @description 鎸夐挳缂栬緫锛岃幏鍙栨寜閽〃鍗曚俊鎭�
+ */
+ handleElement = (card) => {
+ this.setState({
+ visible: true,
+ card: card,
+ formlist: getCardCellForm(card)
+ })
+ }
+
+ /**
+ * @description 鍙栨秷淇濆瓨锛屽鏋滃厓绱犱负鏂版坊鍏冪礌锛屽垯浠庡簭鍒椾腑鍒犻櫎
+ */
+ editModalCancel = () => {
+ const { card, elements } = this.state
+ let _elements = null
+
+ if (card.focus) {
+ _elements = elements.filter(item => item.uuid !== card.uuid)
+ } else {
+ _elements = elements
+ }
+
+ this.setState({
+ card: null,
+ elements: _elements,
+ visible: false
+ })
+ }
+
+ /**
+ * @description 鎼滅储淇敼鍚庢彁浜や繚瀛�
+ * 1銆佸幓闄ょ郴缁熼粯璁ゆ悳绱㈡潯浠�
+ * 2銆佸瓧娈靛強鎻愮ず鏂囧瓧閲嶅鏍￠獙
+ * 3銆佹洿鏂颁笅鎷夎彍鍗曞彲閫夐泦鍚�
+ * 4銆佷笅鎷夎彍鍗曟暟鎹簮璇硶楠岃瘉
+ */
+ handleSubmit = () => {
+ const { config } = this.props
+ const { elements } = this.state
+
+ this.elementFormRef.handleConfirm().then(ele => {
+ let _elements = elements.map(cell => {
+ if (cell.uuid === ele.uuid) return ele
+ return cell
+ })
+
+ this.setState({
+ elements: _elements,
+ visible: false
+ }, () => {
+ this.props.updateElement({...config, elements: _elements})
+ })
+ })
+ }
+
+ /**
+ * @description 鎸夐挳鍒犻櫎
+ */
+ deleteElement = (card) => {
+ const { config } = this.props
+ const { dict, elements } = this.state
+ let _this = this
+
+ confirm({
+ content: dict['model.confirm'] + dict['model.delete'] + '鍏冪礌鍚楋紵',
+ onOk() {
+ let _elements = elements.filter(item => item.uuid !== card.uuid)
+
+ _this.setState({
+ elements: _elements
+ }, () => {
+ _this.props.updateElement({...config, elements: _elements})
+ })
+ },
+ onCancel() {}
+ })
+ }
+
+
+ shouldComponentUpdate (nextProps, nextState) {
+ return !is(fromJS(this.props.config), fromJS(nextProps.config)) || !is(fromJS(this.state), fromJS(nextState))
+ }
+
+ /**
+ * @description 缁勪欢閿�姣侊紝娓呴櫎state鏇存柊
+ */
+ componentWillUnmount () {
+ this.setState = () => {
+ return
+ }
+ }
+
+ render() {
+ const { config } = this.props
+ const { elements, visible, card, dict } = this.state
+
+ return (
+ <div className="model-menu-card-cell-list">
+ <DragElement
+ list={elements}
+ handleList={this.handleList}
+ handleMenu={this.handleElement}
+ deleteMenu={this.deleteElement}
+ />
+ {/* 缂栬緫鎸夐挳锛氬鍒躲�佺紪杈� */}
+ <Modal
+ title={'缂栬緫鍏冪礌'}
+ visible={visible}
+ width={800}
+ maskClosable={false}
+ onCancel={this.editModalCancel}
+ onOk={this.handleSubmit}
+ destroyOnClose
+ >
+ <ElementForm
+ dict={dict}
+ card={card}
+ formlist={this.state.formlist}
+ inputSubmit={this.handleSubmit}
+ config={config}
+ wrappedComponentRef={(inst) => this.elementFormRef = inst}
+ />
+ </Modal>
+ </div>
+ )
+ }
+}
+
+
+export default CardCellComponent
\ No newline at end of file
diff --git a/src/menu/components/card/cardcellcomponent/index.scss b/src/menu/components/card/cardcellcomponent/index.scss
new file mode 100644
index 0000000..40c20c0
--- /dev/null
+++ b/src/menu/components/card/cardcellcomponent/index.scss
@@ -0,0 +1,28 @@
+.model-menu-card-cell-list {
+ min-height: calc(100% - 50px);
+ position: relative;
+ .ant-form-item-label {
+ .anticon-question-circle {
+ color: #c49f47;
+ position: absolute;
+ left: 5px;
+ top: 5px;
+ }
+ }
+
+ .card-detail-row > .anticon-plus {
+ color: #26C281;
+ font-size: 16px;
+ padding: 5px;
+ cursor: pointer;
+ }
+ // .card-cell {
+ // box-sizing: content-box;
+ // }
+ .card-cell:hover {
+ box-shadow: 0px 0px 1px #d8d8d8;
+ }
+ .ant-slider {
+ margin: 0px;
+ }
+}
diff --git a/src/menu/components/card/data-card/index.jsx b/src/menu/components/card/data-card/index.jsx
index 3c55cab..2cd1ab4 100644
--- a/src/menu/components/card/data-card/index.jsx
+++ b/src/menu/components/card/data-card/index.jsx
@@ -15,6 +15,7 @@
const SettingComponent = asyncIconComponent(() => import('@/menu/datasource'))
const WrapComponent = asyncIconComponent(() => import('./wrapsetting'))
const ActionComponent = asyncComponent(() => import('@/menu/actioncomponent'))
+const CardCellComponent = asyncComponent(() => import('../cardcellcomponent'))
class antvBarLineChart extends Component {
static propTpyes = {
@@ -117,13 +118,8 @@
<Icon type="tool" />
</Popover>
<div className={'ant-col card-item ant-col-' + (card.wrap.cardWidth || 6)} style={{height: card.wrap.height ? card.wrap.height + 'px' : 'auto'}}>
-
- <ActionComponent
- config={card}
- tabs={[]}
- // setSubConfig={(_btn) => this.setSubConfig(_btn, 'button')}
- updateaction={this.updateComponent}
- />
+ <CardCellComponent config={card} updateElement={this.updateComponent}/>
+ <ActionComponent config={card} updateaction={this.updateComponent}/>
</div>
</div>
)
diff --git a/src/menu/components/card/data-card/index.scss b/src/menu/components/card/data-card/index.scss
index fb83659..ea7467b 100644
--- a/src/menu/components/card/data-card/index.scss
+++ b/src/menu/components/card/data-card/index.scss
@@ -22,6 +22,21 @@
.card-item:hover {
box-shadow: 0px 0px 2px #e8e8e8;
}
+
+ .model-menu-card-cell-list .card-detail-row > .anticon-plus {
+ position: absolute;
+ right: -30px;
+ font-size: 16px;
+ }
+ .model-menu-action-list {
+ min-height: 40px;
+ line-height: 40px;
+ .ant-row > .anticon-plus {
+ position: absolute;
+ right: -30px;
+ font-size: 16px;
+ }
+ }
}
.menu-data-card-edit-box::after {
display: block;
diff --git a/src/menu/datasource/verifycard/utils.jsx b/src/menu/datasource/verifycard/utils.jsx
index 7521726..12cda4e 100644
--- a/src/menu/datasource/verifycard/utils.jsx
+++ b/src/menu/datasource/verifycard/utils.jsx
@@ -7,7 +7,7 @@
* @return {Object} setting 椤甸潰璁剧疆
* @return {Array} columns 鏄剧ず瀛楁
*/
- static getDebugSql (setting, scripts, columns, searches) {
+ static getDebugSql (setting, scripts, columns, searches = []) {
let sql = ''
let _dataresource = ''
let _customScript = ''
diff --git a/src/mob/colorsketch/index.jsx b/src/mob/colorsketch/index.jsx
index 42a3b13..14e0f95 100644
--- a/src/mob/colorsketch/index.jsx
+++ b/src/mob/colorsketch/index.jsx
@@ -2,22 +2,22 @@
import PropTypes from 'prop-types'
// import { is, fromJS } from 'immutable'
import { SketchPicker } from 'react-color'
-import {Popover } from 'antd'
+import { Popover } from 'antd'
import './index.scss'
class ColorSketch extends Component {
static propTpyes = {
- color: PropTypes.any,
- changeColor: PropTypes.func
+ value: PropTypes.any,
+ onChange: PropTypes.func
}
state = {
- color: this.props.color,
+ color: this.props.value,
}
handleChange = (color) => {
this.setState({ color: color.rgb })
- this.props.changeColor(`rgba(${ color.rgb.r }, ${ color.rgb.g }, ${ color.rgb.b }, ${ color.rgb.a })`)
+ this.props.onChange(`rgba(${ color.rgb.r }, ${ color.rgb.g }, ${ color.rgb.b }, ${ color.rgb.a })`)
}
render() {
@@ -31,13 +31,14 @@
}
return (
- <Popover content={
- <SketchPicker color={ this.state.color } onChange={ this.handleChange } />
- } overlayClassName="color-sketch-popover" placement="bottomRight" title="" trigger="click">
- <div className="color-sketch-block">
+ <div className="color-sketch-block">
+ <Popover content={
+ <SketchPicker color={ this.state.color } onChange={ this.handleChange } />
+ } overlayClassName="color-sketch-popover" placement="bottomRight" title="" trigger="click">
<div className="color-sketch-block-inner" style={ {background: _color} }></div>
- </div>
- </Popover>
+ </Popover>
+ <div className="color-sketch-value">{_color}</div>
+ </div>
)
}
}
diff --git a/src/mob/colorsketch/index.scss b/src/mob/colorsketch/index.scss
index ceca993..b616d14 100644
--- a/src/mob/colorsketch/index.scss
+++ b/src/mob/colorsketch/index.scss
@@ -1,19 +1,30 @@
.color-sketch-block {
- padding: 5px;
- background: #fff;
- border-radius: 2px;
- box-shadow: 0 0 0 1px rgba(0, 0, 0, .1);
- display: inline-block;
- cursor: pointer;
+ height: 25px;
+ width: 100%;
.color-sketch-block-inner {
- width: 50px;
- height: 14px;
+ display: inline-block;
+ cursor: pointer;
border-radius: 2px;
+ box-shadow: 0 0 0 1px rgba(0, 0, 0, .1);
+ width: calc(100% - 170px);
+ height: 100%;
+ border-radius: 2px;
+ }
+ .color-sketch-value {
+ display: inline-block;
+ width: 170px;
+ padding-left: 10px;
+ height: 25px;
+ line-height: 25px;
+ vertical-align: top;
+ white-space: nowrap;
+ overflow: visible;
}
}
.color-sketch-popover {
+ z-index: 1090!important;
.ant-popover-inner-content {
padding: 0;
.sketch-picker {
diff --git a/src/mob/controller/index.jsx b/src/mob/controller/index.jsx
index a10efeb..7b3ba2f 100644
--- a/src/mob/controller/index.jsx
+++ b/src/mob/controller/index.jsx
@@ -315,7 +315,7 @@
label={<Icon title="瀛椾綋棰滆壊" type="font-colors" />}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
- <ColorSketch color={card.color || '#000000'} changeColor={this.changeFontColor} />
+ <ColorSketch value={card.color || '#000000'} onChange={this.changeFontColor} />
<Input value={fontColor} onChange={this.changeFontColorInput} />
</Form.Item>
</Col>
diff --git a/src/templates/sharecomponent/actioncomponent/index.jsx b/src/templates/sharecomponent/actioncomponent/index.jsx
index 6ef56de..730a43c 100644
--- a/src/templates/sharecomponent/actioncomponent/index.jsx
+++ b/src/templates/sharecomponent/actioncomponent/index.jsx
@@ -856,14 +856,6 @@
const { config, type, menu } = this.props
this.actionFormRef.handleConfirm().then(result => {
- if (result.Ot === 'requiredOnce') {
- notification.warning({
- top: 92,
- message: '澶氳鎷兼帴鏃讹紝涓嶅彲鍒涘缓鎺ュ彛锛�',
- duration: 5
- })
- return
- }
let _menu = {
type: type,
MenuID: menu.MenuID,
@@ -907,11 +899,6 @@
const { config } = this.props
const { actionlist, visible, card, dict, copying, profVisible } = this.state
- let hasbtncrtinter = false
- if (card && !card.copyType && config.setting.interType === 'system' && config.setting.dataresource) {
- hasbtncrtinter = true
- }
-
return (
<div className="model-table-action-list" style={config.charts.length > 1 ? {paddingTop: 25} : null}>
<Tooltip placement="bottomLeft" overlayClassName="middle" title={dict['model.tooltip.action.guide']}>
@@ -935,8 +922,8 @@
maskClosable={false}
onCancel={this.editModalCancel}
footer={[
- hasbtncrtinter ? <CreateInterface key="interface" dict={dict} ref="btnCreatInterface" trigger={this.btnCreatInterface}/> : null,
- card && !card.copyType ? <CreateFunc key="create" dict={dict} ref="btnCreatFunc" trigger={this.creatFunc}/> : null,
+ <CreateInterface key="interface" dict={dict} ref="btnCreatInterface" trigger={this.btnCreatInterface}/>,
+ <CreateFunc key="create" dict={dict} ref="btnCreatFunc" trigger={this.creatFunc}/>,
<Button key="cancel" onClick={this.editModalCancel}>{dict['model.cancel']}</Button>,
<Button key="confirm" type="primary" loading={copying} onClick={this.handleSubmit}>{dict['model.confirm']}</Button>
]}
diff --git a/src/templates/zshare/createinterface/index.jsx b/src/templates/zshare/createinterface/index.jsx
index 4529aa1..89a9089 100644
--- a/src/templates/zshare/createinterface/index.jsx
+++ b/src/templates/zshare/createinterface/index.jsx
@@ -314,7 +314,7 @@
if (!['pop', 'exec', 'prompt'].includes(btn.OpenType) || btn.funcType || btn.intertype !== 'system') {
notification.warning({
top: 92,
- message: '鎵撳紑鏂瑰紡涓� 寮圭獥锛堣〃鍗曪級銆佹彁绀烘鎴栫洿鎺ユ墽琛岋紝涓斾娇鐢ㄧ郴缁熷嚱鏁版椂锛屾墠鍙互鍒涘缓鎺ュ彛锛�',
+ message: '鎵撳紑鏂瑰紡涓� 寮圭獥锛堣〃鍗曪級銆佹彁绀烘鎴栫洿鎺ユ墽琛岋紝涓旀帴鍙ｇ被鍨嬩负绯荤粺鏃讹紝鎵嶅彲浠ュ垱寤烘帴鍙ｏ紒',
duration: 5
})
return
diff --git a/src/utils/option.js b/src/utils/option.js
index a18023c..fbdaff3 100644
--- a/src/utils/option.js
+++ b/src/utils/option.js
@@ -200,7 +200,7 @@
// 鎸夐挳鍥炬爣闆�
export const btnIcons = [{
value: '',
- text: 'unset'
+ text: '鏃�'
}, {
value: 'plus',
text: 'plus'
--
Gitblit v1.8.0