From 46f79b491173d284a4900d19e7aecf7509481438 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期五, 21 一月 2022 17:21:25 +0800
Subject: [PATCH] 2022-01-21
---
src/menu/stylecombcontroller/index.jsx | 110 +++++++++++++++++++++++++++++-------------------------
1 files changed, 59 insertions(+), 51 deletions(-)
diff --git a/src/menu/stylecombcontroller/index.jsx b/src/menu/stylecombcontroller/index.jsx
index 6a9d18a..c26c17d 100644
--- a/src/menu/stylecombcontroller/index.jsx
+++ b/src/menu/stylecombcontroller/index.jsx
@@ -1,11 +1,35 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
-import { Collapse, Form, Col, Icon, InputNumber, Select, Radio, Drawer, Button } from 'antd'
+import { Collapse, Form, Col, InputNumber, Select, Radio, Drawer, Button } from 'antd'
+import {
+ ColumnHeightOutlined,
+ FontSizeOutlined,
+ BoldOutlined,
+ LineHeightOutlined,
+ ColumnWidthOutlined,
+ FontColorsOutlined,
+ ItalicOutlined,
+ AlignLeftOutlined,
+ AlignCenterOutlined,
+ AlignRightOutlined,
+ UnderlineOutlined,
+ StrikethroughOutlined,
+ BgColorsOutlined,
+ BorderOutlined,
+ BorderOuterOutlined,
+ BorderLeftOutlined,
+ BorderRightOutlined,
+ BorderTopOutlined,
+ BorderBottomOutlined,
+ RadiusSettingOutlined,
+ ArrowUpOutlined,
+ ArrowDownOutlined,
+ ArrowLeftOutlined,
+ ArrowRightOutlined,
+} from '@ant-design/icons'
import MKEmitter from '@/utils/events.js'
-import zhCN from '@/locales/zh-CN/mob.js'
-import enUS from '@/locales/en-US/mob.js'
import ColorSketch from '@/mob/colorsketch'
import StyleInput from './styleInput'
import './index.scss'
@@ -20,7 +44,6 @@
}
state = {
- dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
options: [],
style: {},
borposition: 'outer'
@@ -257,7 +280,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="楂樺害" type="column-height" />}
+ label={<ColumnHeightOutlined title="楂樺害" />}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={this.changeHeight}/>
@@ -266,12 +289,12 @@
</Panel> : null}
{options.includes('font') ? <Panel header="瀛椾綋" key="font">
<Col span={12}>
- <Form.Item colon={false} label={<Icon title="瀛椾綋澶у皬" type="font-size" />}>
+ <Form.Item colon={false} label={<FontSizeOutlined title="瀛椾綋澶у皬"/>}>
<InputNumber defaultValue={''} min={12} max={100} precision={0} onChange={this.changeFontSize} />
</Form.Item>
</Col>
<Col span={12}>
- <Form.Item colon={false} label={<Icon title="瀛椾綋绮楃粏" type="bold" />}>
+ <Form.Item colon={false} label={<BoldOutlined title="瀛椾綋绮楃粏"/>}>
<Select defaultValue={''} onChange={this.boldChange}>
<Option value="normal">normal</Option>
<Option value="bold">bold</Option>
@@ -290,19 +313,19 @@
</Form.Item>
</Col>
<Col span={12}>
- <Form.Item colon={false} label={<Icon title="琛岄珮" type="line-height" />}>
+ <Form.Item colon={false} label={<LineHeightOutlined title="琛岄珮" />}>
<InputNumber defaultValue={''} min={1} max={10} precision={1} onChange={this.changeLineHeight} />
</Form.Item>
</Col>
<Col span={12}>
- <Form.Item colon={false} label={<Icon title="瀛楅棿璺�" type="column-width" />}>
+ <Form.Item colon={false} label={<ColumnWidthOutlined title="瀛楅棿璺�"/>}>
<InputNumber defaultValue={''} min={0} max={100} precision={0} onChange={this.changeLetterSpacing}/>
</Form.Item>
</Col>
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="瀛椾綋棰滆壊" type="font-colors" />}
+ label={<FontColorsOutlined title="瀛椾綋棰滆壊"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<ColorSketch onChange={this.changeFontColor} />
@@ -316,7 +339,7 @@
>
<Radio.Group defaultValue={''} onChange={this.changeFontStyle}>
<Radio.Button value="normal"><span title="鏍囧噯">N</span></Radio.Button>
- <Radio.Button value="italic"><Icon title="鏂滀綋" type="italic" /></Radio.Button>
+ <Radio.Button value="italic"><ItalicOutlined title="鏂滀綋"/></Radio.Button>
<Radio.Button value="oblique" style={{fontStyle: 'oblique'}}><span title="鍊炬枩">B</span></Radio.Button>
</Radio.Group>
</Form.Item>
@@ -328,9 +351,9 @@
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<Radio.Group className="text-align" defaultValue={''} onChange={this.changeTextAlign}>
- <Radio.Button value="left"><Icon title="宸﹀榻�" type="align-left" /></Radio.Button>
- <Radio.Button value="center"><Icon title="灞呬腑瀵归綈" type="align-center" /></Radio.Button>
- <Radio.Button value="right"><Icon title="鍙冲榻�" type="align-right" /></Radio.Button>
+ <Radio.Button value="left"><AlignLeftOutlined title="宸﹀榻�"/></Radio.Button>
+ <Radio.Button value="center"><AlignCenterOutlined title="灞呬腑瀵归綈"/></Radio.Button>
+ <Radio.Button value="right"><AlignRightOutlined title="鍙冲榻�"/></Radio.Button>
</Radio.Group>
</Form.Item>
</Col>
@@ -342,8 +365,8 @@
>
<Radio.Group className="text-decoration" defaultValue={''} onChange={this.changeTextDecoration}>
<Radio.Button value="none"><span title="鏍囧噯">N</span></Radio.Button>
- <Radio.Button value="underline"><Icon title="涓嬪垝绾�" type="underline" /></Radio.Button>
- <Radio.Button value="line-through"><Icon title="涓垝绾�" type="strikethrough" /></Radio.Button>
+ <Radio.Button value="underline"><UnderlineOutlined title="涓嬪垝绾�"/></Radio.Button>
+ <Radio.Button value="line-through"><StrikethroughOutlined title="涓垝绾�"/></Radio.Button>
<Radio.Button value="overline" style={{textDecoration: 'overline'}}><span title="涓婂垝绾�">O</span></Radio.Button>
</Radio.Group>
</Form.Item>
@@ -353,7 +376,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="鑳屾櫙棰滆壊" type="bg-colors" />}
+ label={<BgColorsOutlined title="鑳屾櫙棰滆壊"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<ColorSketch onChange={this.changeBackgroundColor} />
@@ -364,22 +387,22 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="杈规浣嶇疆" type="border" />}
+ label={<BorderOutlined title="杈规浣嶇疆"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<Radio.Group className="border-position" defaultValue={'outer'} onChange={(e) => this.setState({borposition: e.target.value})}>
- <Radio value="outer"><Icon title="澶栬竟妗�" type="border-outer" /></Radio>
- <Radio value="left"><Icon title="宸﹁竟妗�" type="border-left" /></Radio>
- <Radio value="right"><Icon title="鍙宠竟妗�" type="border-right" /></Radio>
- <Radio value="top"><Icon title="涓婅竟妗�" type="border-top" /></Radio>
- <Radio value="bottom"><Icon title="涓嬭竟妗�" type="border-bottom" /></Radio>
+ <Radio value="outer"><BorderOuterOutlined title="澶栬竟妗�"/></Radio>
+ <Radio value="left"><BorderLeftOutlined title="宸﹁竟妗�"/></Radio>
+ <Radio value="right"><BorderRightOutlined title="鍙宠竟妗�"/></Radio>
+ <Radio value="top"><BorderTopOutlined title="涓婅竟妗�"/></Radio>
+ <Radio value="bottom"><BorderBottomOutlined title="涓嬭竟妗�"/></Radio>
</Radio.Group>
</Form.Item>
</Col>
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="杈规鏍峰紡" type="border-outer" />}
+ label={<BorderOuterOutlined title="杈规鏍峰紡"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
{borposition === 'outer' ? <Select defaultValue={'solid'} onChange={this.changeBorderStyle}>
@@ -417,7 +440,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="杈规瀹藉害" type="column-width" />}
+ label={<ColumnWidthOutlined title="杈规瀹藉害"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
{borposition === 'outer' ? <StyleInput defaultValue={''} options={['px']} onChange={this.changeBorderWidth}/> : null}
@@ -430,7 +453,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="杈规棰滆壊" type="bg-colors" />}
+ label={<BgColorsOutlined title="杈规棰滆壊"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
{borposition === 'outer' ? <ColorSketch onChange={this.changeBorderColor} /> : null}
@@ -443,7 +466,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="鍦嗚" type="radius-setting" />}
+ label={<RadiusSettingOutlined title="鍦嗚"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<StyleInput defaultValue={'0px'} options={['px', '%']} onChange={(val) => this.changeNormalStyle(val, 'borderRadius')}/>
@@ -454,7 +477,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="闃村奖棰滆壊" type="bg-colors" />}
+ label={<BgColorsOutlined title="闃村奖棰滆壊"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<ColorSketch onChange={this.changeShadowColor} />
@@ -465,7 +488,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="涓婅竟璺�" type="arrow-up"/>}
+ label={<ArrowUpOutlined title="涓婅竟璺�"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'marginTop')}/>
@@ -474,7 +497,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="涓嬭竟璺�" type="arrow-down"/>}
+ label={<ArrowDownOutlined title="涓嬭竟璺�"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'marginBottom')}/>
@@ -483,7 +506,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="宸﹁竟璺�" type="arrow-left"/>}
+ label={<ArrowLeftOutlined title="宸﹁竟璺�"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'marginLeft')}/>
@@ -492,7 +515,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="鍙宠竟璺�" type="arrow-right"/>}
+ label={<ArrowRightOutlined title="鍙宠竟璺�"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'marginRight')}/>
@@ -503,7 +526,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="涓婅竟璺�" type="arrow-up"/>}
+ label={<ArrowUpOutlined title="涓婅竟璺�"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'paddingTop')}/>
@@ -512,7 +535,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="涓嬭竟璺�" type="arrow-down"/>}
+ label={<ArrowDownOutlined title="涓嬭竟璺�"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'paddingBottom')}/>
@@ -521,7 +544,7 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="宸﹁竟璺�" type="arrow-left"/>}
+ label={<ArrowLeftOutlined title="宸﹁竟璺�"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'paddingLeft')}/>
@@ -530,25 +553,10 @@
<Col span={24}>
<Form.Item
colon={false}
- label={<Icon title="鍙宠竟璺�" type="arrow-right"/>}
+ label={<ArrowRightOutlined title="鍙宠竟璺�"/>}
labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
>
<StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'paddingRight')}/>
- </Form.Item>
- </Col>
- </Panel> : null}
- {options.includes('float') ? <Panel header="娴姩" key="float">
- <Col span={24}>
- <Form.Item
- colon={false}
- label={<Icon title="娴姩" type="swap" />}
- labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
- >
- <Radio.Group defaultValue={''} onChange={(e) => this.changeNormalStyle(e.target.value, 'float')}>
- <Radio value="left">宸︽诞鍔�</Radio>
- <Radio value="right">鍙虫诞鍔�</Radio>
- <Radio value="none">涓嶆诞鍔�</Radio>
- </Radio.Group>
</Form.Item>
</Col>
</Panel> : null}
--
Gitblit v1.8.0