qm-bus/src/GalleryBox/components/Uploader.js

千米公有云业务组件库

import React, { Component } from 'react'
import { Tabs } from 'antd'
import { QMConst } from 'qm-ux'
import MediaUpload from './MediaUpload'
import ImageUpload from './ImageUpload'

const TabPane = Tabs.TabPane

class Uploader extends Component {
  static defaultProps = {
    type: 'pic',
    limit: 10,
  }

  constructor(props) {
    super(props)
  }

  render() {
    let { Platform, SystemId } = QMConst.get('project')
    let headers = {
      Platform: Platform,
      systemId: SystemId,
    }

    const formLayout = {
      labelCol: { span: 4 },
      wrapperCol: { span: 18 },
    }
    const { type, limit, pic_rule, video_rule } = this.props

    if (type == 'all') {
      return (
        <div className="upload-picture-library modal-body-main">
          <div className={'upload-picture-main upload'}>
            <Tabs defaultActiveKey="1">
              <TabPane tab="上传图片" key="1" className="pushtt">
                <ImageUpload
                  formLayout={formLayout}
                  headers={headers}
                  limit={limit}
                  rule={pic_rule}
                />
              </TabPane>
              <TabPane tab="上传视频" key="2" className="pushtt">
                <MediaUpload
                  formLayout={formLayout}
                  headers={headers}
                  scope={this.props.scope}
                  limit={limit}
                  rule={video_rule}
                />
              </TabPane>
            </Tabs>
          </div>
        </div>
      )
    }
    if (type == 'video') {
      return (
        <div className="upload-picture-library modal-body-main">
          <div className={'upload-picture-main upload'}>
            <MediaUpload
              formLayout={formLayout}
              headers={headers}
              rule={video_rule}
              limit={limit}
            />
          </div>
        </div>
      )
    }

    return (
      <div className="upload-picture-library modal-body-main">
        <div className={'upload-picture-main upload'}>
          <ImageUpload formLayout={formLayout} headers={headers} rule={pic_rule} limit={limit} />
        </div>
      </div>
    )
  }
}

export default Uploader