2022-11-01

king

2022-11-01 cf62796bdc550a1fd35b15dd7bd39ba58cac82aa

 src/templates/zshare/codemirror/index.jsx

@@ -27,7 +27,6 @@
  }

  state = {
    editor: null,   // code对象
    defaultVal: '', // 初始值
    value: '',      // 实时内容
    options: null,  // mode : text/xml, text/css, text/javascript、text/x-mysql ; theme : cobalt - 黑底
@@ -35,6 +34,8 @@
    style: {fontSize: '18px', lineHeight: '32px'},
    display: true
  }

  editor = null

  UNSAFE_componentWillMount () {
    let options = {
@@ -56,15 +57,15 @@
  }

  UNSAFE_componentWillReceiveProps (nextProps) {
    const { value, editor } = this.state
    const { value } = this.state

    if (value !== nextProps.value) {
      this.setState({
        value: nextProps.value || ''
      })

      if (editor && editor.setValue) {
        editor.setValue(nextProps.value || '')
      if (this.editor && this.editor.setValue) {
        this.editor.setValue(nextProps.value || '')
      } else {
        this.setState({
          defaultVal: nextProps.value || ''
@@ -74,7 +75,7 @@
  }

  shouldComponentUpdate (nextProps, nextState) {
    return !is(fromJS({...this.state, value: '', editor: ''}), fromJS({...nextState, value: '', editor: ''}))
    return !is(fromJS({...this.state, value: ''}), fromJS({...nextState, value: ''}))
  }

  fullScreenChange = () => {
@@ -100,7 +101,7 @@
    }

    // 切换字体大小，刷新编辑器窗口，解决调整后的选择区域错乱问题
    this.setState({style: _style, display: false, editor: null, defaultVal: this.state.value}, () => {
    this.setState({style: _style, display: false, defaultVal: this.state.value}, () => {
      this.setState({display: true})
    })
  }
@@ -110,12 +111,34 @@
    
    if (!_sql) return
    
    let getuuid = () => {
      let uuid = []
      let _options = '0123456789abcdefghigklmnopqrstuv'
      for (let i = 0; i < 19; i++) {
        uuid.push(_options.substr(Math.floor(Math.random() * 0x20), 1))
      }
      return '\'' + uuid.join('') + '\''
    }

    let arr = []
    _sql = _sql.replace(/@[0-9a-zA-Z_]+@/g, (word) => {
      let uuid = getuuid()
      arr.push({id: uuid, value: word})
      return uuid
    })

    _sql = sqlFormatter.format(_sql.replace(/\s{2,}/g, ' '))
    // _sql = _sql.replace(/case\n\s+when\s/ig, (word) => {
    //   return word.replace(/case/, '').replace(/when/, 'case when')
    // })

    this.setState({display: false, editor: null, defaultVal: _sql}, () => {
    _sql = _sql.replace(/\$\s\*\s\//g, '$*/').replace(/\*\s\//g, '*/')

    arr.forEach(item => {
      _sql = _sql.replace(item.id, item.value)
    })

    this.setState({display: false, defaultVal: _sql}, () => {
      this.setState({display: true})
    })
    
@@ -178,8 +201,9 @@
          className="code-mirror-area"
          value={defaultVal}
          options={options}
          ref={(ref) => { this.editor = ref }}
          onChange={(editor, data, value) => {
            this.setState({editor, value})
            this.setState({value})
            this.props.onChange(value)
          }}
        /> : null}