From 4e570c993e66a47ead0f83de76b63b0a2f8c5446 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期一, 05 六月 2023 17:28:16 +0800
Subject: [PATCH] 2023-06-05
---
src/menu/stylecontroller/index.jsx | 98 +++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 87 insertions(+), 11 deletions(-)
diff --git a/src/menu/stylecontroller/index.jsx b/src/menu/stylecontroller/index.jsx
index e06a198..6acd6cc 100644
--- a/src/menu/stylecontroller/index.jsx
+++ b/src/menu/stylecontroller/index.jsx
@@ -1,7 +1,7 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
-import { Collapse, Form, Col, InputNumber, Input, Select, Radio, Drawer, Button } from 'antd'
+import { Collapse, Form, Col, InputNumber, Input, Select, Radio, Drawer, Button, message } from 'antd'
import {
ColumnHeightOutlined,
FontSizeOutlined,
@@ -29,7 +29,7 @@
ArrowLeftOutlined,
ArrowRightOutlined,
SwapOutlined,
- EnterOutlined,
+ EnterOutlined
} from '@ant-design/icons'
import MKEmitter from '@/utils/events.js'
@@ -42,6 +42,7 @@
const { Panel } = Collapse
const { Option } = Select
const ColorSketch = asyncComponent(() => import('@/mob/colorsketch'))
+const PasteBoard = asyncComponent(() => import('@/components/pasteboard'))
const SourceComponent = asyncComponent(() => import('@/menu/components/share/sourcecomponent'))
class MobController extends Component {
@@ -453,6 +454,77 @@
this.updateStyle({[type]: val})
}
+ copy = () => {
+ const { card, options } = this.state
+
+ let msg = { copyType: 'style' }
+
+ msg.data = card
+ msg.options = options
+
+ try {
+ msg = window.btoa(window.encodeURIComponent(JSON.stringify(msg)))
+ } catch (e) {
+ console.warn('Stringify Failure')
+ msg = ''
+ }
+
+ if (msg) {
+ let oInput = document.createElement('input')
+ oInput.value = msg
+ document.body.appendChild(oInput)
+ oInput.select()
+ document.execCommand('Copy')
+ document.body.removeChild(oInput)
+ message.success('澶嶅埗鎴愬姛銆�')
+ }
+ }
+
+ paste = (res, callback) => {
+ const { options } = this.state
+
+ if (res.copyType !== 'style') {
+ message.warning('閰嶇疆淇℃伅鏍煎紡閿欒锛�', 5)
+ return
+ } else if (JSON.stringify(res.options) !== JSON.stringify(options)) {
+ message.warning('鏍峰紡閫夐」涓嶄竴鑷达紝涓嶅彲绮樿创锛�', 5)
+ return
+ }
+
+ let style = res.data || {}
+
+ let backgroundImage = ''
+ if (style.backgroundImage && /^url/ig.test(style.backgroundImage)) {
+ backgroundImage = style.backgroundImage.replace(/^url\(/ig, '').replace(/\)$/ig, '')
+ }
+
+ let borposition = 'outer'
+
+ if (!style.borderWidth) {
+ if (style.borderLeftWidth) {
+ borposition = 'left'
+ } else if (style.borderRightWidth) {
+ borposition = 'right'
+ } else if (style.borderTopWidth) {
+ borposition = 'top'
+ } else if (style.borderBottomWidth) {
+ borposition = 'bottom'
+ }
+ }
+
+ this.setState({
+ card: style,
+ borposition,
+ backgroundImage
+ })
+
+ this.callback && this.callback(style)
+
+ callback()
+
+ message.success('绮樿创鎴愬姛銆�')
+ }
+
render () {
const { card, options, backgroundImage, borposition, fonts, type } = this.state
const formItemLayout = {
@@ -561,7 +633,7 @@
label={<FontColorsOutlined title="瀛椾綋棰滆壊"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
- <ColorSketch value={card.color || 'rgba(0, 0, 0, 0.85)'} onChange={this.changeFontColor} />
+ <ColorSketch value={card.color || ''} onChange={this.changeFontColor} />
</Form.Item>
<Form.Item
colon={false}
@@ -771,11 +843,11 @@
label={<BgColorsOutlined title="杈规棰滆壊"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
- {borposition === 'outer' ? <ColorSketch value={card.borderColor || 'transparent'} onChange={this.changeBorderColor} /> : null}
- {borposition === 'left' ? <ColorSketch value={card.borderLeftColor || 'transparent'} onChange={this.changeBorderColor} /> : null}
- {borposition === 'right' ? <ColorSketch value={card.borderRightColor || 'transparent'} onChange={this.changeBorderColor} /> : null}
- {borposition === 'top' ? <ColorSketch value={card.borderTopColor || 'transparent'} onChange={this.changeBorderColor} /> : null}
- {borposition === 'bottom' ? <ColorSketch value={card.borderBottomColor || 'transparent'} onChange={this.changeBorderColor} /> : null}
+ {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}
</Form.Item>
<Form.Item
colon={false}
@@ -802,7 +874,7 @@
label={<BgColorsOutlined title="闃村奖棰滆壊"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
- <ColorSketch value={card.shadowColor || 'transparent'} onChange={this.changeShadowColor} />
+ <ColorSketch value={card.shadowColor || ''} onChange={this.changeShadowColor} />
</Form.Item>
<Form.Item
colon={false}
@@ -972,8 +1044,12 @@
</Panel> : null}
</Collapse> : null}
</Form>
- <div style={{textAlign: 'right'}}>
- <Button style={{margin: '30px 10px 30px 0px'}} onClick={this.onCloseDrawer}>鍏抽棴</Button>
+ <div style={{textAlign: 'right', lineHeight: '60px', marginBottom: '30px'}}>
+ <div style={{float: 'left'}}>
+ <Button onClick={() => this.copy()} className="mk-border-green" style={{marginRight: '10px'}}>澶嶅埗</Button>
+ <PasteBoard getPasteValue={this.paste}><Button style={{borderColor: 'rgb(64, 169, 255)', color: 'rgb(64, 169, 255)'}}>绮樿创</Button></PasteBoard>
+ </div>
+ <Button style={{marginRight: '10px'}} onClick={this.onCloseDrawer}>鍏抽棴</Button>
</div>
</div>
</Drawer>
--
Gitblit v1.8.0