| | |
| | | import React, {Component} from 'react' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Collapse, Form, Col, InputNumber, Input, Select, Radio, Drawer, Button, message } from 'antd' |
| | | import { Collapse, Form, Col, InputNumber, Input, Select, Radio, Drawer, Button, message, Checkbox, Tooltip } from 'antd' |
| | | import { |
| | | ColumnHeightOutlined, |
| | | FontSizeOutlined, |
| | |
| | | SwapOutlined, |
| | | EnterOutlined, |
| | | DragOutlined, |
| | | EyeOutlined |
| | | EyeOutlined, |
| | | QuestionCircleOutlined |
| | | } from '@ant-design/icons' |
| | | |
| | | import MKEmitter from '@/utils/events.js' |
| | |
| | | </Radio.Group> |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {options.includes('fontFamily') ? <Col span={24}> |
| | | <Form.Item |
| | | colon={false} |
| | | label=" " |
| | | labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} } |
| | | > |
| | | <Checkbox.Group options={[ |
| | | { label: '微软雅黑', value: 'Microsoft YaHei' }, |
| | | { label: '宋体', value: 'Simsun' }, |
| | | { label: '黑体', value: 'Simhei' }, |
| | | { label: '仿宋', value: 'FangSong' }, |
| | | { label: '楷体', value: 'KaiTi' }, |
| | | // { label: 'Helvetica', value: 'Helvetica' }, |
| | | // { label: 'Arial', value: 'Arial' }, |
| | | // { label: 'Verdana', value: 'Verdana' }, |
| | | // { label: 'Georgia', value: 'Georgia' }, |
| | | ]} defaultValue={card.fontFamily} onChange={(val) => this.changeNormalStyle(val, 'fontFamily')} /> |
| | | </Form.Item> |
| | | </Col> : null} |
| | | </Panel> : null} |
| | | {options.includes('background') || options.includes('backgroundColor') ? <Panel header="背景" key="background"> |
| | | <Col span={24} className="bg-color-panel"> |
| | |
| | | </Form.Item> |
| | | </Col> |
| | | </Panel> : null} |
| | | {options.includes('float') ? <Panel header="对齐方式" key="float"> |
| | | {options.includes('float') ? <Panel header={<Tooltip placement="topLeft" title="按钮相对于栅格的位置,注:设置宽度时有效。">对齐方式<QuestionCircleOutlined style={{marginLeft: '3px'}} /></Tooltip>} key="float"> |
| | | <Col span={24}> |
| | | <Form.Item |
| | | colon={false} |
| | | 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 || (type === 'mk-button' ? 'center' : 'left')} onChange={(e) => this.changeNormalStyle(e.target.value, 'float')}> |
| | | <Radio.Group style={{whiteSpace: 'nowrap'}} defaultValue={card.float || 'left'} onChange={(e) => this.changeNormalStyle(e.target.value, 'float')}> |
| | | <Radio value="left">左</Radio> |
| | | <Radio value="center">居中</Radio> |
| | | <Radio value="right">右</Radio> |
| | |
| | | <Col span={24}> |
| | | <Form.Item |
| | | colon={false} |
| | | label={<SwapOutlined title="浮动"/>} |
| | | label={<SwapOutlined title="显示"/>} |
| | | labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} } |
| | | > |
| | | <Radio.Group style={{whiteSpace: 'nowrap'}} defaultValue={card.display || 'block'} onChange={(e) => this.changeNormalStyle(e.target.value, 'display')}> |