| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | // import { is, fromJS } from 'immutable' |
| | | import { Form, Icon, Popover, Input } from 'antd' |
| | | import { Form, Icon, Popover, Input, Modal } from 'antd' |
| | | |
| | | import zhCN from '@/locales/zh-CN/mob.js' |
| | | import enUS from '@/locales/en-US/mob.js' |
| | | import FileUpload from '@/tabviews/zshare/fileupload' |
| | | import './index.scss' |
| | | |
| | | const { TextArea } = Input |
| | | const { confirm } = Modal |
| | | |
| | | class ContentUpdate extends Component { |
| | | static propTpyes = { |
| | |
| | | |
| | | state = { |
| | | dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, |
| | | images: [], |
| | | visible: false |
| | | } |
| | | |
| | |
| | | } |
| | | } |
| | | |
| | | deleteElement = () => { |
| | | const _this = this |
| | | |
| | | confirm({ |
| | | title: '确定删除元素吗?', |
| | | onOk() { |
| | | _this.props.updateContent(null) |
| | | }, |
| | | onCancel() {} |
| | | }) |
| | | } |
| | | |
| | | imgChange = (list) => { |
| | | const { element } = this.props |
| | | |
| | | this.setState({images: list}) |
| | | if (list && list.length && list[0].response) { |
| | | this.setState({ |
| | | visible: false, |
| | | images: [] |
| | | }) |
| | | let val = list[0].response |
| | | if (val && element.content !== val) { |
| | | this.props.updateContent({...element, content: val}) |
| | | } |
| | | this.props.form.setFieldsValue({content: val}) |
| | | } |
| | | } |
| | | |
| | | render () { |
| | | const { element } = this.props |
| | | const { getFieldDecorator } = this.props.form |
| | | const { visible } = this.state |
| | | const { visible, images } = this.state |
| | | |
| | | return ( |
| | | <div className="mob-content-update"> |
| | | <Icon type="delete" onClick={this.deleteElement} /> |
| | | <Popover content={ |
| | | <div> |
| | | {element.eleType === 'img' ? <FileUpload value={images} maxFile={1} fileType="text" onChange={this.imgChange}/> : null} |
| | | {getFieldDecorator('content', { |
| | | initialValue: element.content |
| | | })(<Input placeholder="" autoComplete="off" onPressEnter={this.handleSubmit} />)} |
| | | })(element.eleType !== 'textarea' ? |
| | | <Input placeholder="" autoComplete="off" onPressEnter={this.handleSubmit} /> : |
| | | <TextArea autosize={{ minRows: 2, maxRows: 3 }} onPressEnter={this.handleSubmit} /> |
| | | )} |
| | | </div> |
| | | } overlayClassName="mob-content-update-popover" placement="bottomRight" title="" visible={visible} trigger="click" onVisibleChange={this.onVisibleChange}> |
| | | <Icon type="edit" /> |