Merge branch 'master' into positec

king

2025-05-23 24842b40de5cd60700bf69dfd38a0332f5431e36

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
import React, {Component} from 'react'
import PropTypes from 'prop-types'
 
import './index.scss'
 
class SysColorSketch extends Component {
  static propTpyes = {
    onChange: PropTypes.func
  }
  state = {
    colors: ['#1890ff', '#40a9ff', '#69c0ff', '#91d5ff', '#bae7ff', '#e6f7ff']
  }
 
  handleChange = (color) => {
    let _color = 'var(--mk-sys-color)'
    if (color === '#1890ff') {
      _color = 'var(--mk-sys-color)'
    } else if (color === '#40a9ff') {
      _color = 'var(--mk-sys-color5)'
    } else if (color === '#69c0ff') {
      _color = 'var(--mk-sys-color4)'
    } else if (color === '#91d5ff') {
      _color = 'var(--mk-sys-color3)'
    } else if (color === '#bae7ff') {
      _color = 'var(--mk-sys-color2)'
    } else if (color === '#e6f7ff') {
      _color = 'var(--mk-sys-color1)'
    }
 
    this.props.onChange(_color)
  }
 
  render() {
    const { colors } = this.state
 
    return (
      <div className="sys-color-sketch-block">
        {colors.map(color => <span key={color} onClick={() => this.handleChange(color)} style={ {background: color} }></span>)}
      </div>
    )
  }
}
 
export default SysColorSketch