From 741994985005c699d8ae4aebf1736fd90ffcd55e Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 18 十一月 2021 13:33:16 +0800
Subject: [PATCH] Merge branch 'master' into bms
---
src/menu/components/card/cardcellcomponent/formconfig.jsx | 38 +++++++++++++------
src/components/mkProgress/index.jsx | 10 ++++-
src/menu/components/card/cardcellcomponent/elementform/index.jsx | 42 +++++++++++++++------
src/menu/components/card/cardcellcomponent/dragaction/mkProgress/index.jsx | 11 ++++-
src/assets/css/main.scss | 9 ++++
5 files changed, 82 insertions(+), 28 deletions(-)
diff --git a/src/assets/css/main.scss b/src/assets/css/main.scss
index 668699c..60cb6df 100644
--- a/src/assets/css/main.scss
+++ b/src/assets/css/main.scss
@@ -435,6 +435,15 @@
div.ant-input-number {
width: 100%;
}
+
+.ant-progress {
+ .ant-progress-circle-trail {
+ stroke: inherit!important;
+ }
+ .ant-progress-text {
+ color: inherit!important;
+ }
+}
// .ant-table.ant-table-mini .ant-table-thead > tr > th {
// padding: 8px 4px;
// }
diff --git a/src/components/mkProgress/index.jsx b/src/components/mkProgress/index.jsx
index 6c68405..007f05b 100644
--- a/src/components/mkProgress/index.jsx
+++ b/src/components/mkProgress/index.jsx
@@ -15,9 +15,14 @@
const { value, config, color } = this.props
let type = config.showType || 'line'
+ let style = {}
+
+ if (config.showInfo === 'true') {
+ style.color = config.infoColor || 'rgba(0, 0, 0, 0.65)'
+ }
if (type === 'line') {
- return <Progress percent={value} type="line" className={config.strokeLinecap || ''} strokeWidth={config.strokeWidth || 8} strokeColor={color} showInfo={config.showInfo === 'true'}/>
+ return <Progress percent={value} type="line" style={style} className={config.strokeLinecap || ''} strokeWidth={config.strokeWidth || 8} strokeColor={color} showInfo={config.showInfo === 'true'}/>
}
let width = config.outlineWidth || 0
@@ -25,10 +30,11 @@
if (this.progress && (!width || width > this.progress.clientWidth)) {
width = this.progress.clientWidth
}
+ style.stroke = config.trailColor || '#f5f5f5'
return (
<div ref={(ref) => this.progress = ref } style={{textAlign: config.textAlign || 'left'}}>
- <Progress percent={value} width={width} strokeLinecap={config.strokeLinecap || 'round'} type={type} strokeWidth={config.strokeWidth || 8} strokeColor={color} showInfo={config.showInfo === 'true'}/>
+ <Progress percent={value} width={width} style={style} strokeLinecap={config.strokeLinecap || 'round'} type={type} strokeWidth={config.strokeWidth || 8} strokeColor={color} showInfo={config.showInfo === 'true'}/>
</div>
)
}
diff --git a/src/menu/components/card/cardcellcomponent/dragaction/mkProgress/index.jsx b/src/menu/components/card/cardcellcomponent/dragaction/mkProgress/index.jsx
index bfb3d89..1db8ce5 100644
--- a/src/menu/components/card/cardcellcomponent/dragaction/mkProgress/index.jsx
+++ b/src/menu/components/card/cardcellcomponent/dragaction/mkProgress/index.jsx
@@ -14,9 +14,14 @@
const { value, config } = this.props
let type = config.showType || 'line'
+ let style = {}
+
+ if (config.showInfo === 'true') {
+ style.color = config.infoColor || 'rgba(0, 0, 0, 0.65)'
+ }
if (type === 'line') {
- return <Progress percent={value} type="line" className={config.strokeLinecap || ''} strokeWidth={config.strokeWidth || 8} strokeColor={config.color} showInfo={config.showInfo === 'true'}/>
+ return <Progress percent={value} style={style} type="line" className={config.strokeLinecap || ''} strokeWidth={config.strokeWidth || 8} strokeColor={config.color} showInfo={config.showInfo === 'true'}/>
}
let width = config.outlineWidth || 0
@@ -25,9 +30,11 @@
width = this.progress.clientWidth
}
+ style.stroke = config.trailColor || '#f5f5f5'
+
return (
<div ref={(ref) => this.progress = ref } style={{textAlign: config.textAlign || 'left'}}>
- <Progress percent={value} width={width} type={type} strokeLinecap={config.strokeLinecap || 'round'} strokeWidth={config.strokeWidth || 8} strokeColor={config.color} showInfo={config.showInfo === 'true'}/>
+ <Progress percent={value} width={width} style={style} type={type} strokeLinecap={config.strokeLinecap || 'round'} strokeWidth={config.strokeWidth || 8} strokeColor={config.color} showInfo={config.showInfo === 'true'}/>
</div>
)
}
diff --git a/src/menu/components/card/cardcellcomponent/elementform/index.jsx b/src/menu/components/card/cardcellcomponent/elementform/index.jsx
index e44398f..4f24969 100644
--- a/src/menu/components/card/cardcellcomponent/elementform/index.jsx
+++ b/src/menu/components/card/cardcellcomponent/elementform/index.jsx
@@ -20,7 +20,7 @@
picture: ['eleType', 'datatype', 'width', 'lenWidRadio', 'maxWidth', 'link', 'noValue'],
video: ['eleType', 'datatype', 'width', 'aspectRatio', 'autoPlay', 'loop', 'noValue'],
icon: ['eleType', 'icon', 'datatype', 'width'],
- slider: ['eleType', 'datatype', 'width', 'color', 'maxValue', 'showInfo', 'showType', 'strokeWidth', 'strokeLinecap'],
+ slider: ['eleType', 'datatype', 'width', 'color', 'maxValue', 'showInfo', 'showType', 'strokeWidth', 'strokeLinecap', 'trailColor'],
splitline: ['eleType', 'color', 'width', 'borderWidth'],
barcode: ['eleType', 'datatype', 'width', 'barHeight', 'displayValue', 'interval', 'noValue'],
qrcode: ['eleType', 'datatype', 'width', 'qrWidth', 'color', 'url', 'noValue'],
@@ -42,18 +42,20 @@
eleType: '',
datatype: '',
showType: '',
+ showInfo: 'false',
link: ''
}
UNSAFE_componentWillMount () {
const { card, config } = this.props
- let _options = this.getOptions(card.eleType, card.datatype, card.link, (card.showType || 'line'))
+ let _options = this.getOptions(card.eleType, card.datatype, card.link, (card.showType || 'line'), card.showInfo)
this.setState({
link: card.link,
eleType: card.eleType,
datatype: card.datatype,
showType: card.showType || 'line',
+ showInfo: card.showInfo || 'false',
formlist: this.props.formlist.map(item => {
item.hidden = !_options.includes(item.key)
@@ -93,7 +95,7 @@
})
}
- getOptions = (eleType, datatype, link, showType) => {
+ getOptions = (eleType, datatype, link, showType, showInfo) => {
let _options = fromJS(cardTypeOptions[eleType]).toJS() // 閫夐」鍒楄〃
if (['text', 'number', 'picture', 'link', 'slider', 'barcode', 'qrcode', 'video'].includes(eleType)) {
@@ -115,8 +117,13 @@
}
} else if (eleType === 'picture' && !link) {
_options.push('scale')
- } else if (eleType === 'slider' && showType !== 'line') {
- _options.push('outlineWidth', 'textAlign')
+ } else if (eleType === 'slider') {
+ if (showInfo === 'true') {
+ _options.push('infoColor')
+ }
+ if (showType !== 'line') {
+ _options.push('outlineWidth', 'textAlign')
+ }
}
} else if (eleType === 'icon') {
if (datatype === 'dynamic') {
@@ -137,10 +144,10 @@
*/
selectChange = (key, value, option) => {
const { card, config } = this.props
- const { datatype, eleType, showType } = this.state
+ const { datatype, eleType, showType, showInfo } = this.state
if (key === 'eleType') {
- let _options = this.getOptions(value, datatype, '', showType)
+ let _options = this.getOptions(value, datatype, '', showType, showInfo)
let _formlist = this.state.formlist.map(item => {
item.hidden = !_options.includes(item.key)
@@ -176,6 +183,8 @@
}
} else if (item.key === 'url') {
item.required = value !== 'qrcode'
+ } else if (item.key === 'showInfo') {
+ item.initVal = showInfo
}
return item
@@ -203,7 +212,7 @@
this.props.form.setFieldsValue({value: option.props.title})
}
} else if (key === 'link') {
- let _options = this.getOptions(eleType, this.state.datatype, value, showType)
+ let _options = this.getOptions(eleType, datatype, value, showType, showInfo)
this.setState({
link: value,
formlist: this.state.formlist.map(item => {
@@ -218,11 +227,11 @@
}
onChange = (e, key) => {
- const { eleType, datatype, link, showType } = this.state
+ const { eleType, datatype, link, showType, showInfo } = this.state
let value = e.target.value
if (key === 'datatype') {
- let _options = this.getOptions(eleType, value, link, showType)
+ let _options = this.getOptions(eleType, value, link, showType, showInfo)
this.setState({
datatype: value,
@@ -233,7 +242,7 @@
})
})
} else if (key === 'link') {
- let _options = this.getOptions(eleType, datatype, value, showType)
+ let _options = this.getOptions(eleType, datatype, value, showType, showInfo)
this.setState({
link: value,
formlist: this.state.formlist.map(item => {
@@ -244,11 +253,20 @@
return item
})
})
+ } else if (key === 'showInfo') {
+ let _options = this.getOptions(eleType, datatype, link, showType, value)
+ this.setState({
+ showInfo: value,
+ formlist: this.state.formlist.map(item => {
+ item.hidden = !_options.includes(item.key)
+ return item
+ })
+ })
} else if (key === 'showType') {
this.setState({
showType: value
}, () => {
- let _options = this.getOptions(eleType, datatype, link, value)
+ let _options = this.getOptions(eleType, datatype, link, value, showInfo)
this.setState({
formlist: this.state.formlist.map(item => {
item.hidden = !_options.includes(item.key)
diff --git a/src/menu/components/card/cardcellcomponent/formconfig.jsx b/src/menu/components/card/cardcellcomponent/formconfig.jsx
index 4d4da5e..ac90789 100644
--- a/src/menu/components/card/cardcellcomponent/formconfig.jsx
+++ b/src/menu/components/card/cardcellcomponent/formconfig.jsx
@@ -176,11 +176,30 @@
required: false
},
{
+ type: 'radio',
+ key: 'showType',
+ label: '灞曠幇褰㈠紡',
+ initVal: card.showType || 'line',
+ required: false,
+ options: [
+ { value: 'line', text: '杩涘害鏉�' },
+ { value: 'circle', text: '杩涘害鍦�' },
+ { value: 'dashboard', text: '浠〃鐩�' },
+ ]
+ },
+ {
type: 'color',
key: 'color',
- label: '棰滆壊',
- initVal: card.color || 'rgba(0, 0, 0, 0.85)',
+ label: '杩涘害鏉￠鑹�',
+ initVal: card.color || '#1890ff',
required: true
+ },
+ {
+ type: 'color',
+ key: 'trailColor',
+ label: '鏈畬鎴愰鑹�',
+ initVal: card.trailColor || '#f5f5f5',
+ required: false
},
{
type: 'radio',
@@ -194,16 +213,11 @@
]
},
{
- type: 'radio',
- key: 'showType',
- label: '灞曠幇褰㈠紡',
- initVal: card.showType || 'line',
- required: false,
- options: [
- { value: 'line', text: '杩涘害鏉�' },
- { value: 'circle', text: '杩涘害鍦�' },
- { value: 'dashboard', text: '浠〃鐩�' },
- ]
+ type: 'color',
+ key: 'infoColor',
+ label: '杩涘害鍊奸鑹�',
+ initVal: card.infoColor || 'rgba(0, 0, 0, 0.65)',
+ required: false
},
{
type: 'radio',
--
Gitblit v1.8.0