content.jsx 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. /**
  2. * @author oldj
  3. * @blog https://oldj.net
  4. */
  5. 'use strict'
  6. import React from 'react'
  7. import classnames from 'classnames'
  8. import Editor from './editor'
  9. import './content.less'
  10. export default class Content extends React.Component {
  11. constructor (props) {
  12. super(props)
  13. this.state = {
  14. is_loading: this.props.current.is_loading
  15. }
  16. }
  17. setValue(v) {
  18. this.props.setHostsContent(v)
  19. }
  20. render () {
  21. let {current, lang} = this.props
  22. return (
  23. <div id="sh-content">
  24. <div className="inform">
  25. <span
  26. className={classnames({
  27. loading: 1,
  28. show: this.state.is_loading
  29. })}
  30. >loading...</span>
  31. <i
  32. className={classnames({
  33. show: current.where === 'remote',
  34. iconfont: 1,
  35. 'icon-earth': 1
  36. })}
  37. title={lang.remote_hosts}
  38. />
  39. <i
  40. className={classnames({
  41. show: this.props.readonly,
  42. iconfont: 1,
  43. 'icon-lock2': 1
  44. })}
  45. title={lang.readonly}
  46. />
  47. </div>
  48. <div className={classnames({
  49. errorMessage: 1,
  50. show: !!this.props.current.error
  51. })}>{this.props.current.error}</div>
  52. <Editor
  53. readonly={this.props.readonly}
  54. code={this.props.current.content || ''}
  55. setValue={this.setValue.bind(this)}
  56. />
  57. </div>
  58. )
  59. }
  60. }