h5-cli/src-react/create-consultation.js

hello

/*
 * @Author: saohui 
 * @Date: 2017-10-19 16:18:04 
 * @Last Modified by: saohui
 * @Last Modified time: 2017-10-19 16:45:07
 */

import React from 'react'

export default class CreateConsultation extends React.Component {


  renderInputTxt () {
    return <div className="textarea-wrapper" style={{ borderTop: 'none' }}>
      <textarea placeholder="请输入意见反馈，我们将为你不断改进" ref='content'></textarea>
    </div>
  }
  renderInputImg () {
    return <div className="image-picker-wrapper">
      <div className="item-input-title" style={{
        marginBottom: '15px'
      }}>上传图片
        </div>
      <div className="image-picker">
        <div className="image-picker-item">
          <div className="image-picker-remove" ></div>
          <div className="image-picker-content">
            <img src={'item'} width="100%" height="100%" />
          </div>
        </div>
        {
          // pics.map((item, index) => {
          //   return (
          //     <div key={index} className="image-picker-item">
          //       <div className="image-picker-remove" ></div>
          //       <div className="image-picker-content">
          //         <img src={item} width="100%" height="100%" />
          //       </div>
          //     </div>
          //   )
          // })
        }
        <div className="image-picker-item image-picker-upload">
          <input type="file" className="image-picker-input" style={{
            width: '100%'
          }} />
        </div>
      </div>
    </div>
  }
  renderSubmit () {
    return <div className="btn-wrapper">
      <button className="btn btn-block">
        下一步
      </button>
    </div>
  }

  renderSelectPatient () {
    return <div className="list-ord g-space" >
      <div className="list-item item-input">
        <div className="item-input-content item-select-wrapper">
          <select defaultValue="default" ref="type">
            <option value="default">{'请选择就诊人'}</option>
            <option value="交通原因(堵车、医院太远、停车难)">交通原因</option>
            <option value="就诊人不会使用设备取号(老人、小孩不会使用自助机或手机APP)">就诊人不会使用设备取号</option>
            <option value="排队太长，排到时已过期">排队太长，排到时已过期</option>
            <option value="手机故障无法取消">手机故障无法取消</option>
            <option value="预约错号了，没有取消">预约错号了，没有取消</option>
            <option value="设备出现问题，无法取号">设备出现问题，无法取号</option>
            <option value="其它原因">其它原因</option>
          </select>
        </div>
      </div>
    </div>
  }

  renderHeader () {
    return this.renderSelectPatient()
  }
  renderBody () {
    return <div className="list-ord g-space" >
      { this.renderInputTxt()}
      { this.renderInputImg()}
    </div>
  }
  renderFooter () {
    return <div className="main-footer">
      { this.renderSubmit()}
    </div>
  }

  render () {
    return <div>
      { this.renderHeader()}
      { this.renderBody()}
      { this.renderFooter()}
    </div>
  }
}