From 1fa9bbd032749dc07f98d21b7403b041053d0bed Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期一, 25 三月 2024 10:29:19 +0800
Subject: [PATCH] 2024-03-25
---
src/menu/stylecontroller/index.jsx | 92 +++++++++++++++++++++++++++++-----------------
1 files changed, 58 insertions(+), 34 deletions(-)
diff --git a/src/menu/stylecontroller/index.jsx b/src/menu/stylecontroller/index.jsx
index b2e0d63..04fb753 100644
--- a/src/menu/stylecontroller/index.jsx
+++ b/src/menu/stylecontroller/index.jsx
@@ -29,7 +29,8 @@
ArrowRightOutlined,
SwapOutlined,
EnterOutlined,
- DragOutlined
+ DragOutlined,
+ EyeOutlined
} from '@ant-design/icons'
import MKEmitter from '@/utils/events.js'
@@ -129,30 +130,37 @@
onCloseDrawer = () => {
let card = fromJS(this.state.card).toJS()
- let check = false
- if (card.borderWidth === '0px') {
+ if (card.borderWidth === '0px' || !card.borderWidth) {
delete card.borderWidth
delete card.borderColor
- check = true
- } else if (card.borderLeftWidth === '0px') {
- delete card.borderLeftWidth
- delete card.borderLeftColor
- check = true
- } else if (card.borderRightWidth === '0px') {
- delete card.borderRightWidth
- delete card.borderRightColor
- check = true
- } else if (card.borderTopWidth === '0px') {
- delete card.borderTopWidth
- delete card.borderTopColor
- check = true
- } else if (card.borderBottomWidth === '0px') {
- delete card.borderBottomWidth
- delete card.borderBottomColor
- check = true
}
- if (check) {
+ if (card.borderLeftWidth === '0px' || !card.borderLeftWidth) {
+ delete card.borderLeftWidth
+ delete card.borderLeftColor
+ }
+ if (card.borderRightWidth === '0px' || !card.borderRightWidth) {
+ delete card.borderRightWidth
+ delete card.borderRightColor
+ }
+ if (card.borderTopWidth === '0px' || !card.borderTopWidth) {
+ delete card.borderTopWidth
+ delete card.borderTopColor
+ }
+ if (card.borderBottomWidth === '0px' || !card.borderBottomWidth) {
+ delete card.borderBottomWidth
+ delete card.borderBottomColor
+ }
+
+ if (/0px 0px 0px | transparent/.test(card.boxShadow)) {
+ delete card.hShadow
+ delete card.vShadow
+ delete card.shadowBlur
+ delete card.shadowColor
+ delete card.boxShadow
+ }
+
+ if (!is(fromJS(this.state.card), fromJS(card))) {
this.callback && this.callback(card)
}
@@ -284,7 +292,7 @@
changeShadowColor = (val) => {
const { card } = this.state
- let boxShadow = `${card.hShadow || '0px'} ${card.vShadow || '0px'} ${card.shadowBlur || '0px'} ${val}`
+ let boxShadow = `${card.hShadow || '0px'} ${card.vShadow || '0px'} ${card.shadowBlur || '0px'} ${val || 'transparent'}`
this.updateStyle({shadowColor: val, boxShadow})
}
@@ -521,6 +529,8 @@
delete style.right
} else if (n === 'transform') {
delete style.transform
+ } else if (n === 'overflow') {
+ delete style.overflow
}
})
}
@@ -862,11 +872,11 @@
label={<ColumnWidthOutlined title="杈规瀹藉害"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
- {borposition === 'outer' ? <StyleInput defaultValue={card.borderWidth || '0px'} options={['px']} onChange={this.changeBorderWidth}/> : null}
- {borposition === 'left' ? <StyleInput defaultValue={card.borderLeftWidth || '0px'} options={['px']} onChange={this.changeBorderWidth}/> : null}
- {borposition === 'right' ? <StyleInput defaultValue={card.borderRightWidth || '0px'} options={['px']} onChange={this.changeBorderWidth}/> : null}
- {borposition === 'top' ? <StyleInput defaultValue={card.borderTopWidth || '0px'} options={['px']} onChange={this.changeBorderWidth}/> : null}
- {borposition === 'bottom' ? <StyleInput defaultValue={card.borderBottomWidth || '0px'} options={['px']} onChange={this.changeBorderWidth}/> : null}
+ {borposition === 'outer' ? <StyleInput defaultValue={card.borderWidth || ''} options={['px']} onChange={this.changeBorderWidth}/> : null}
+ {borposition === 'left' ? <StyleInput defaultValue={card.borderLeftWidth || ''} options={['px']} onChange={this.changeBorderWidth}/> : null}
+ {borposition === 'right' ? <StyleInput defaultValue={card.borderRightWidth || ''} options={['px']} onChange={this.changeBorderWidth}/> : null}
+ {borposition === 'top' ? <StyleInput defaultValue={card.borderTopWidth || ''} options={['px']} onChange={this.changeBorderWidth}/> : null}
+ {borposition === 'bottom' ? <StyleInput defaultValue={card.borderBottomWidth || ''} options={['px']} onChange={this.changeBorderWidth}/> : null}
</Form.Item>
</Col>
<Col span={24}>
@@ -875,11 +885,11 @@
label={<BgColorsOutlined title="杈规棰滆壊"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
- {borposition === 'outer' ? <ColorSketch value={card.borderColor || ''} onChange={this.changeBorderColor} /> : null}
- {borposition === 'left' ? <ColorSketch value={card.borderLeftColor || ''} onChange={this.changeBorderColor} /> : null}
- {borposition === 'right' ? <ColorSketch value={card.borderRightColor || ''} onChange={this.changeBorderColor} /> : null}
- {borposition === 'top' ? <ColorSketch value={card.borderTopColor || ''} onChange={this.changeBorderColor} /> : null}
- {borposition === 'bottom' ? <ColorSketch value={card.borderBottomColor || ''} onChange={this.changeBorderColor} /> : null}
+ {borposition === 'outer' ? <ColorSketch allowClear={true} value={card.borderColor || ''} onChange={this.changeBorderColor} /> : null}
+ {borposition === 'left' ? <ColorSketch allowClear={true} value={card.borderLeftColor || ''} onChange={this.changeBorderColor} /> : null}
+ {borposition === 'right' ? <ColorSketch allowClear={true} value={card.borderRightColor || ''} onChange={this.changeBorderColor} /> : null}
+ {borposition === 'top' ? <ColorSketch allowClear={true} value={card.borderTopColor || ''} onChange={this.changeBorderColor} /> : null}
+ {borposition === 'bottom' ? <ColorSketch allowClear={true} value={card.borderBottomColor || ''} onChange={this.changeBorderColor} /> : null}
</Form.Item>
<Form.Item
colon={false}
@@ -906,7 +916,7 @@
label={<BgColorsOutlined title="闃村奖棰滆壊"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
- <ColorSketch value={card.shadowColor || ''} onChange={this.changeShadowColor} />
+ <ColorSketch allowClear={true} value={card.shadowColor || ''} onChange={this.changeShadowColor} />
</Form.Item>
<Form.Item
colon={false}
@@ -1027,7 +1037,7 @@
label={<SwapOutlined title="瀵归綈"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
- <Radio.Group style={{whiteSpace: 'nowrap'}} defaultValue={card.float || 'left'} onChange={(e) => this.changeNormalStyle(e.target.value, 'float')}>
+ <Radio.Group style={{whiteSpace: 'nowrap'}} defaultValue={card.float || (type === 'mk-button' ? 'center' : 'left')} onChange={(e) => this.changeNormalStyle(e.target.value, 'float')}>
<Radio value="left">宸�</Radio>
<Radio value="center">灞呬腑</Radio>
<Radio value="right">鍙�</Radio>
@@ -1075,6 +1085,20 @@
</Form.Item>
</Col>
</Panel> : null}
+ {options.includes('overflow') ? <Panel header="婧㈠嚭" key="overflow">
+ <Col span={24}>
+ <Form.Item
+ colon={false}
+ label={<EyeOutlined title="婧㈠嚭"/>}
+ labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
+ >
+ <Radio.Group style={{whiteSpace: 'nowrap'}} defaultValue={card.overflow || 'hidden'} onChange={(e) => this.changeNormalStyle(e.target.value, 'overflow')}>
+ <Radio value="hidden">闅愯棌</Radio>
+ <Radio value="visible">鏄剧ず</Radio>
+ </Radio.Group>
+ </Form.Item>
+ </Col>
+ </Panel> : null}
{options.includes('position') ? <Panel header="瀹氫綅" key="position">
<div style={{paddingLeft: '35px', fontSize: '12px'}}>娉細瀹氫綅鏁堟灉璇峰湪杩愯鐜涓煡鐪嬨��</div>
<Col span={24}>
--
Gitblit v1.8.0