'use strict'
!(function(require, directRequire) {
  const a = require('react'),
    b = require('./d3976cc01aeebc5b09e11c4135b6bd8d.js'),
    c = require('./1fcc6bd55b687d154a4247e57fe3011d.js'),
    d = require('./fc137838572a83604db39acff8e909e0.js'),
    e = require('./875171e7b864aa58d026d4fa0999fbd1.js'),
    { connect: f } = require('react-redux')
  class g extends a.Component {
    constructor(a) {
      super(a),
        (this.state = { show: a.show, name: '', width: '', height: '', dpr: 2 })
    }
    onClose() {
      this.setState({ show: !1 })
    }
    onNameChange(a) {
      this.setState({ name: a.currentTarget.value })
    }
    onNumberChange(a) {
      let b = a.currentTarget.value,
        c = a.currentTarget.dataset.type,
        d = /\.$/.test(b)
      ;(b = parseFloat(b)),
        this.setState({ [c]: isNaN(b) ? '' : d ? `${b}.` : b })
    }
    onConfirm() {
      let { name: a, width: b, height: c, dpr: d } = this.state
      return a
        ? b
          ? c
            ? d
              ? void (this.props.addDevice({
                  height: parseFloat(c),
                  width: parseFloat(b),
                  dpr: parseFloat(d),
                  name: a
                }),
                this.onClose())
              : void this.refs.dprInput.focus()
            : void this.refs.heightInput.focus()
          : void this.refs.widthInput.focus()
        : void this.refs.nameInput.focus()
    }
    onAnimationOut() {
      this.props.setAddDevicePopUp({ show: !1 })
    }
    render() {
      return a.createElement(
        e,
        {
          show: this.state.show,
          style: { width: 420, marginLeft: -210 },
          inClassName: 'ui-animate-pull-down ui-dialog',
          outClassName: 'ui-animate-pull-up ui-dialog',
          onAnimationOut: this.onAnimationOut.bind(this)
        },
        a.createElement(
          'div',
          { className: 'ui-dialog-hd' },
          a.createElement(
            'h3',
            { className: 'ui-dialog-title' },
            '\u6DFB\u52A0\u81EA\u5B9A\u4E49\u5C4F\u5E55'
          )
        ),
        a.createElement(
          'div',
          { className: 'ui-dialog-bd' },
          a.createElement(
            'div',
            { className: 'ui-form' },
            a.createElement(
              'div',
              { className: 'ui-form-item ui-form-item-inline' },
              a.createElement(
                'label',
                { className: 'ui-form-label' },
                '\u540D\u5B57'
              ),
              a.createElement(
                'div',
                { className: 'ui-form-controls' },
                a.createElement(
                  'div',
                  { className: 'ui-input-box' },
                  a.createElement('input', {
                    ref: 'nameInput',
                    className: 'ui-input',
                    value: this.state.name,
                    onChange: this.onNameChange.bind(this)
                  })
                )
              )
            ),
            a.createElement(
              'div',
              { className: 'ui-form-item ui-form-item-inline' },
              a.createElement(
                'label',
                { className: 'ui-form-label' },
                '\u5BBD\u5EA6'
              ),
              a.createElement(
                'div',
                { className: 'ui-form-controls' },
                a.createElement(
                  'div',
                  { className: 'ui-input-box' },
                  a.createElement('input', {
                    className: 'ui-input',
                    'data-type': 'width',
                    ref: 'widthInput',
                    value: this.state.width,
                    onChange: this.onNumberChange.bind(this)
                  })
                )
              )
            ),
            a.createElement(
              'div',
              { className: 'ui-form-item ui-form-item-inline' },
              a.createElement(
                'label',
                { className: 'ui-form-label' },
                '\u9AD8\u5EA6'
              ),
              a.createElement(
                'div',
                { className: 'ui-form-controls' },
                a.createElement(
                  'div',
                  { className: 'ui-input-box' },
                  a.createElement('input', {
                    className: 'ui-input',
                    'data-type': 'height',
                    ref: 'heightInput',
                    value: this.state.height,
                    onChange: this.onNumberChange.bind(this)
                  })
                )
              )
            ),
            a.createElement(
              'div',
              { className: 'ui-form-item ui-form-item-inline' },
              a.createElement('label', { className: 'ui-form-label' }, 'DPR'),
              a.createElement(
                'div',
                { className: 'ui-form-controls' },
                a.createElement(
                  'div',
                  { className: 'ui-input-box' },
                  a.createElement('input', {
                    className: 'ui-input',
                    'data-type': 'dpr',
                    ref: 'dprInput',
                    value: this.state.dpr,
                    onChange: this.onNumberChange.bind(this)
                  })
                )
              )
            )
          )
        ),
        a.createElement(
          'div',
          { className: 'ui-dialog-ft' },
          a.createElement(
            'div',
            { className: 'ui-dialog-action' },
            a.createElement(
              'button',
              {
                className: 'ui-button ui-button-default',
                onClick: this.onClose.bind(this)
              },
              '\u53D6\u6D88'
            ),
            a.createElement(
              'button',
              {
                className: 'ui-button ui-button-primary',
                onClick: this.onConfirm.bind(this)
              },
              '\u786E\u5B9A'
            )
          )
        )
      )
    }
  }
  module.exports = f(
    a => {
      return { show: a.info.addDeviceInfo && a.info.addDeviceInfo.show }
    },
    a => {
      return {
        addDevice: b.bindActionCreators(d.addDevice, a),
        setAddDevicePopUp: b.bindActionCreators(c.setAddDevicePopUp, a)
      }
    }
  )(g)
})(require('lazyload'), require)
