2021-06-04

king

2021-06-04 9e60fb89a8b1c8a1d16b557b20b6d0a509f37983

2021-06-04

 src/assets/mobimg/nest.png

 src/menu/components/chart/antv-bar/chartcompile/index.jsx

@@ -24,6 +24,7 @@

  state = {
    view: 'normal',
    ramp: 'false',
    visible: false,
    datatype: '',
    plot: null,
@@ -48,6 +49,34 @@
        }
      },
    ],
    rampColorColumns: [
      {
        title: '指标',
        dataIndex: 'label',
        editable: false,
        width: '20%'
      },
      {
        title: '颜色1',
        dataIndex: 'color',
        inputType: 'color',
        editable: true,
        width: '30%',
        render: (text, record) => {
          return (<div style={{width: '80px', height: '23px', background: text}}></div>)
        }
      },
      {
        title: '颜色2',
        dataIndex: 'color1',
        inputType: 'color',
        editable: true,
        width: '30%',
        render: (text, record) => {
          return (<div style={{width: '80px', height: '23px', background: text}}></div>)
        }
      },
    ],
    statColorColumns: [
      {
        title: '指标',
@@ -62,6 +91,35 @@
        inputType: 'color',
        editable: true,
        width: '40%',
        render: (text, record) => {
          return (<div style={{width: '80px', height: '23px', background: text}}></div>)
        }
      },
    ],
    rampStatColorColumns: [
      {
        title: '指标',
        dataIndex: 'type',
        inputType: 'input',
        editable: true,
        width: '20%'
      },
      {
        title: '颜色1',
        dataIndex: 'color',
        inputType: 'color',
        editable: true,
        width: '30%',
        render: (text, record) => {
          return (<div style={{width: '80px', height: '23px', background: text}}></div>)
        }
      },
      {
        title: '颜色2',
        dataIndex: 'color1',
        inputType: 'color',
        editable: true,
        width: '30%',
        render: (text, record) => {
          return (<div style={{width: '80px', height: '23px', background: text}}></div>)
        }
@@ -163,6 +221,7 @@
    this.setState({
      visible: true,
      view: 'normal',
      ramp: config.plot.ramp || 'false',
      datatype: config.plot.datatype || 'query',
      fieldName: fieldName,
      plot: fromJS(config.plot).toJS(),
@@ -338,6 +397,21 @@
    this.setState({plot: {...plot, mutilBar: val}})
  }

  rampChange = (e) => {
    const { plot } = this.state
    let val = e.target.value
    let colors = plot.colors || []

    if (val === 'true') {
      colors = colors.map(item => {
        item.color1 = item.color1 || item.color
        return item
      })
    }

    this.setState({plot: {...plot, colors, ramp: val}, ramp: val})
  }

  onSubmit = () => {
    const { config } = this.props
    const { plot, view } = this.state
@@ -432,7 +506,8 @@
                  uuid: Utils.getuuid(),
                  type: item,
                  label: labels[item] || item,
                  color: chartColors[i % limit]
                  color: chartColors[i % limit],
                  color1: chartColors[i % limit]
                }
              })
            }
@@ -466,7 +541,8 @@
    plot.colors.push({
      uuid: Utils.getuuid(),
      type: `指标${plot.colors.length}`,
      color: 'rgb(91, 143, 249)'
      color: 'rgb(91, 143, 249)',
      color1: 'rgb(91, 143, 249)'
    })

    this.setState({plot})
@@ -485,7 +561,7 @@
  }

  render() {
    const { view, visible, datatype, plot, colorColumns, statColorColumns, cusColumns, baseFormlist } = this.state
    const { view, visible, datatype, plot, ramp, colorColumns, rampColorColumns, statColorColumns, rampStatColorColumns, cusColumns, baseFormlist } = this.state
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
@@ -521,9 +597,19 @@
            </TabPane>
            {plot ? <TabPane tab="颜色设置" key="color">
              <div>
                <Col span={12} style={{height: '40px', top: '-5px', zIndex: 1}}>
                  <Form {...formItemLayout}>
                    <Form.Item label="渐变色" style={{marginBottom: 10}}>
                      <Radio.Group value={plot.ramp || 'false'} onChange={this.rampChange}>
                        <Radio value="false">不使用</Radio>
                        <Radio value="true">使用</Radio>
                      </Radio.Group>
                    </Form.Item>
                  </Form>
                </Col>
                {datatype === 'statistics' ? <Button className="color-add mk-green" onClick={this.addColor}>{this.props.dict['model.add']}</Button> : null}
                {datatype === 'statistics' ? <EditTable actions={['edit', 'move', 'del']} data={plot.colors || []} columns={statColorColumns} onChange={this.changeColor}/> : null}
                {datatype !== 'statistics' ? <EditTable actions={['edit']} data={plot.colors || []} columns={colorColumns} onChange={this.changeColor}/> : null}
                {datatype === 'statistics' ? <EditTable actions={['edit', 'move', 'del']} data={plot.colors || []} columns={ramp ==='true' ? rampStatColorColumns : statColorColumns} onChange={this.changeColor}/> : null}
                {datatype !== 'statistics' ? <EditTable actions={['edit']} data={plot.colors || []} columns={ramp ==='true' ? rampColorColumns : colorColumns} onChange={this.changeColor}/> : null}
              </div>
            </TabPane> : null}
            {plot ? <TabPane tab="自定义设置" disabled={datatype === 'statistics'} key="custom">

 src/menu/components/chart/antv-bar/index.jsx

@@ -285,11 +285,19 @@
      let colorIndex = 0

      if (plot.colors && plot.colors.length > 0) {
        if (plot.ramp === 'true') {
          plot.colors.forEach(item => {
            if (!colors.has(transfield[item.type])) {
              colors.set(transfield[item.type], `l(0) 0:${item.color} 1:${item.color1}` )
            }
          })
        } else {
        plot.colors.forEach(item => {
          if (!colors.has(transfield[item.type])) {
            colors.set(transfield[item.type], item.color)
          }
        })
        }
      }
  
      let _chart = chart
@@ -309,11 +317,11 @@
      if (plot.colors && plot.colors.length > 0) {
        let limit = chartColors.length
        _chart.color('key', (key) => {
          if (colors.get(key)) {
          if (colors.has(key)) {
            return colors.get(key)
          } else {
            colors.set(key, chartColors[colorIndex % limit])
            colorIndex++
            return chartColors[(colorIndex - 1) % limit]
          }
        })
      } else {
@@ -370,11 +378,29 @@
    let limit = chartColors.length

    if (plot.colors && plot.colors.length > 0) {
      plot.colors.forEach(item => {
        if (!colors.has(item.type)) {
          colors.set(item.type, item.color)
      if (plot.ramp === 'true') {
        let bars = {}
        plot.customs.forEach(item => {
          if (!item.shape || !item.shape[0] || item.shape[0] === 'bar') {
            bars[item.type] = true
        }
      })
        plot.colors.forEach(item => {
          if (!colors.has(transfield[item.type])) {
            if (bars[item.type]) {
              colors.set(transfield[item.type], `l(90) 0:${item.color} 1:${item.color1}` )
            } else {
              colors.set(transfield[item.type], `l(0) 0:${item.color} 1:${item.color1}` )
            }
          }
        })
      } else {
        plot.colors.forEach(item => {
          if (!colors.has(transfield[item.type])) {
            colors.set(transfield[item.type], item.color)
          }
        })
      }
    }

    let axisIndex = 0
@@ -385,8 +411,8 @@
      item.chartType = item.shape ? (item.shape[0] || 'bar') : 'bar'
      item.shape = item.shape ? (item.shape[1] || '') : ''

      if (colors.get(item.type)) {
        item.color = colors.get(item.type)
      if (colors.has(item.name)) {
        item.color = colors.get(item.name)
      } else {
        item.color = chartColors[colorIndex % limit]
        colorIndex++
@@ -517,17 +543,6 @@
  
      view1.legend(false)

      let colors = new Map()
      let colorIndex = 0

      if (plot.colors && plot.colors.length > 0) {
        plot.colors.forEach(item => {
          if (!colors.has(transfield[item.type])) {
            colors.set(transfield[item.type], item.color)
          }
        })
      }
  
      if (plot.mutilBar !== 'stack') {
        let _chart = view1
          .interval()
@@ -552,11 +567,12 @@
        if (plot.colors && plot.colors.length > 0) {
          let limit = chartColors.length
          _chart.color('key', (key) => {
            if (colors.get(key)) {
            // return 'l(90) 0:#1890ff 1:#70cdd0'
            if (colors.has(key)) {
              return colors.get(key)
            } else {
              colors.set(key, chartColors[colorIndex % limit])
              colorIndex++
              return chartColors[(colorIndex - 1) % limit]
            }
          })
        } else {
@@ -601,11 +617,11 @@
        if (plot.colors && plot.colors.length > 0) {
          let limit = chartColors.length
          _chart.color('key', (key) => {
            if (colors.get(key)) {
            if (colors.has(key)) {
              return colors.get(key)
            } else {
              colors.set(key, chartColors[colorIndex % limit])
              colorIndex++
              return chartColors[(colorIndex - 1) % limit]
            }
          })
        } else {
@@ -833,11 +849,19 @@
      let colorIndex = 0

      if (plot.colors && plot.colors.length > 0) {
        if (plot.ramp === 'true') {
          plot.colors.forEach(item => {
            if (!colors.has(transfield[item.type])) {
              colors.set(transfield[item.type], `l(90) 0:${item.color} 1:${item.color1}` )
            }
          })
        } else {
        plot.colors.forEach(item => {
          if (!colors.has(transfield[item.type])) {
            colors.set(transfield[item.type], item.color)
          }
        })
        }
      }
  
      if (plot.adjust !== 'stack') {
@@ -864,11 +888,11 @@
        if (plot.colors && plot.colors.length > 0) {
          let limit = chartColors.length
          _chart.color('key', (key) => {
            if (colors.get(key)) {
            if (colors.has(key)) {
              return colors.get(key)
            } else {
              colors.set(key, chartColors[colorIndex % limit])
              colorIndex++
              return chartColors[(colorIndex - 1) % limit]
            }
          })
        } else {
@@ -913,11 +937,11 @@
        if (plot.colors && plot.colors.length > 0) {
          let limit = chartColors.length
          _chart.color('key', (key) => {
            if (colors.get(key)) {
            if (colors.has(key)) {
              return colors.get(key)
            } else {
              colors.set(key, chartColors[colorIndex % limit])
              colorIndex++
              return chartColors[(colorIndex - 1) % limit]
            }
          })
        } else {

 src/menu/modulesource/option.jsx

@@ -12,6 +12,7 @@
import Editor from '@/assets/mobimg/editor.png'
import SandBox from '@/assets/mobimg/sandbox.png'
import Pie1 from '@/assets/mobimg/ring.png'
import Pie3 from '@/assets/mobimg/nest.png'
import Pie2 from '@/assets/mobimg/nightingale.png'
import Mainsearch from '@/assets/mobimg/mainsearch.png'
import Carousel from '@/assets/mobimg/carousel.png'
@@ -39,6 +40,7 @@
  { type: 'menu', url: bar1, component: 'bar', subtype: 'bar1', title: '条形图', width: 24 },
  { type: 'menu', url: Pie, component: 'pie', subtype: 'pie', title: '饼图', width: 12 },
  { type: 'menu', url: Pie1, component: 'pie', subtype: 'ring', title: '环图', width: 12 },
  { type: 'menu', url: Pie3, component: 'pie', subtype: 'nest', title: '嵌套饼图', width: 12 },
  { type: 'menu', url: Pie2, component: 'pie', subtype: 'nightingale', title: '南丁格尔图', width: 12 },
  { type: 'menu', url: dashboard, component: 'dashboard', subtype: 'dashboard', title: '仪表盘', width: 12 },
  { type: 'menu', url: scatter, component: 'scatter', subtype: 'scatter', title: '散点图', width: 24 },

 src/pc/modulesource/option.jsx

@@ -12,6 +12,7 @@
import Editor from '@/assets/mobimg/editor.png'
import SandBox from '@/assets/mobimg/sandbox.png'
import Pie1 from '@/assets/mobimg/ring.png'
import Pie3 from '@/assets/mobimg/nest.png'
import Pie2 from '@/assets/mobimg/nightingale.png'
import Mainsearch from '@/assets/mobimg/mainsearch.png'
import Navbar from '@/assets/mobimg/navbar.png'
@@ -42,6 +43,7 @@
  { type: 'menu', url: bar1, component: 'bar', subtype: 'bar1', title: '条形图', width: 24 },
  { type: 'menu', url: Pie, component: 'pie', subtype: 'pie', title: '饼图', width: 12 },
  { type: 'menu', url: Pie1, component: 'pie', subtype: 'ring', title: '环图', width: 12 },
  { type: 'menu', url: Pie3, component: 'pie', subtype: 'nest', title: '嵌套饼图', width: 12 },
  { type: 'menu', url: Pie2, component: 'pie', subtype: 'nightingale', title: '南丁格尔图', width: 12 },
  { type: 'menu', url: dashboard, component: 'dashboard', subtype: 'dashboard', title: '仪表盘', width: 12 },
  { type: 'menu', url: scatter, component: 'scatter', subtype: 'scatter', title: '散点图', width: 24 },

 src/tabviews/custom/components/chart/antv-bar-line/index.jsx

@@ -137,7 +137,7 @@
        item.chartType = item.shape ? (item.shape[0] || 'bar') : 'bar'
        item.shape = item.shape ? (item.shape[1] || '') : ''
  
        if (colors.get(item.type)) {
        if (colors.has(item.type)) {
          item.color = colors.get(item.type)
        } else {
          item.color = chartColors[colorIndex % limit]
@@ -841,11 +841,11 @@
    if (plot.colors && plot.colors.length > 0) {
      let limit = chartColors.length
      _chart.color(_typefield, (key) => {
        if (colors.get(key)) {
        if (colors.has(key)) {
          return colors.get(key)
        } else {
          colors.set(key, chartColors[colorIndex % limit])
          colorIndex++
          return chartColors[(colorIndex - 1) % limit]
        }
      })
    } else {
@@ -871,11 +871,11 @@
        .point()
        .position(`${plot.Xaxis}*${_valfield}`)
        .color(_typefield, (key) => {
          if (colors.get(key)) {
          if (colors.has(key)) {
            return colors.get(key)
          } else {
            colors.set(key, chartColors[colorIndex % limit])
            colorIndex++
            return chartColors[(colorIndex - 1) % limit]
          }
        })
        .size(3)
@@ -1052,11 +1052,11 @@
        if (plot.colors && plot.colors.length > 0) {
          let limit = chartColors.length
          _chart.color('key', (key) => {
            if (colors.get(key)) {
            if (colors.has(key)) {
              return colors.get(key)
            } else {
              colors.set(key, chartColors[colorIndex % limit])
              colorIndex++
              return chartColors[(colorIndex - 1) % limit]
            }
          })
        } else {
@@ -1101,11 +1101,11 @@
        if (plot.colors && plot.colors.length > 0) {
          let limit = chartColors.length
          _chart.color('key', (key) => {
            if (colors.get(key)) {
            if (colors.has(key)) {
              return colors.get(key)
            } else {
              colors.set(key, chartColors[colorIndex % limit])
              colorIndex++
              return chartColors[(colorIndex - 1) % limit]
            }
          })
        } else {
@@ -1392,11 +1392,11 @@
      if (plot.colors && plot.colors.length > 0) {
        let limit = chartColors.length
        _chart.color(_typefield, (key) => {
          if (colors.get(key)) {
          if (colors.has(key)) {
            return colors.get(key)
          } else {
            colors.set(key, chartColors[colorIndex % limit])
            colorIndex++
            return chartColors[(colorIndex - 1) % limit]
          }
        })
      } else {
@@ -1439,11 +1439,11 @@
      if (plot.colors && plot.colors.length > 0) {
        let limit = chartColors.length
        _chart.color(_typefield, (key) => {
          if (colors.get(key)) {
          if (colors.has(key)) {
            return colors.get(key)
          } else {
            colors.set(key, chartColors[colorIndex % limit])
            colorIndex++
            return chartColors[(colorIndex - 1) % limit]
          }
        })
      } else {

 src/tabviews/custom/components/chart/antv-pie/index.jsx

@@ -514,6 +514,17 @@
    let type = plot.type
    let color = plot.color

    let colors = new Map()
    let colorIndex = 0

    if (plot.colors && plot.colors.length > 0) {
      plot.colors.forEach(item => {
        if (!colors.has(item.label)) {
          colors.set(item.label, item.color)
        }
      })
    }

    let _data = this.getnestdata()

    const dvx = new DataView().source(_data)
@@ -577,7 +588,6 @@
      .interval()
      .adjust('stack')
      .position(Y_axis)
      .color(type)
      .tooltip(`${type}*${Y_axis}`, (type, percent) => {
        if (plot.show !== 'value') {
          percent = (percent * 100).toFixed(2) + '%'
@@ -591,6 +601,19 @@
        lineWidth: 1,
        stroke: '#fff',
      })
    if (plot.colors && plot.colors.length > 0) {
      let limit = chartColors.length
      chart1.color(type, (_type) => {
        if (colors.has(_type)) {
          return colors.get(_type)
        } else {
          colorIndex++
          return chartColors[(colorIndex - 1) % limit]
        }
      })
    } else {
      chart1.color(type)
    }

    if (plot.label !== 'false') {
      chart1.label(type, {
@@ -618,7 +641,6 @@
      .interval()
      .adjust('stack')
      .position(Y_axis)
      .color(X_axis)
      .tooltip(`${X_axis}*${Y_axis}`, (name, value) => {
        if (plot.show !== 'value') {
          value = (value * 100).toFixed(2) + '%'
@@ -632,6 +654,20 @@
        lineWidth: 1,
        stroke: '#fff',
      })

      if (plot.colors && plot.colors.length > 0) {
        let limit = chartColors.length
        chart2.color(X_axis, (type) => {
          if (colors.has(type)) {
            return colors.get(type)
          } else {
            colorIndex++
            return chartColors[(colorIndex - 1) % limit]
          }
        })
      } else {
        chart2.color(X_axis)
      }

      if (plot.label !== 'false') {
        if (plot.label === 'inner') {
@@ -810,11 +846,11 @@
      if (plot.colors && plot.colors.length > 0) {
        let limit = chartColors.length
        _chart.color(X_axis, (type) => {
          if (colors.get(type)) {
          if (colors.has(type)) {
            return colors.get(type)
          } else {
            colors.set(type, chartColors[colorIndex % limit])
            colorIndex++
            return chartColors[(colorIndex - 1) % limit]
          }
        })
      } else {
@@ -877,11 +913,11 @@
      if (plot.colors && plot.colors.length > 0) {
        let limit = chartColors.length
        _chart.color(X_axis, (type) => {
          if (colors.get(type)) {
          if (colors.has(type)) {
            return colors.get(type)
          } else {
            colors.set(type, chartColors[colorIndex % limit])
            colorIndex++
            return chartColors[(colorIndex - 1) % limit]
          }
        })
      } else {

 src/templates/zshare/editTable/index.jsx

@@ -171,6 +171,7 @@
  UNSAFE_componentWillMount () {
    const { data, actions } = this.props
    let columns = fromJS(this.props.columns).toJS()
    let operation = null

    if (actions && (actions.includes('edit') || actions.includes('copy') || actions.includes('del'))) {
      let _operation = null
@@ -181,7 +182,7 @@
        return item.dataIndex !== 'operation'
      })

      let operation = {
      operation = {
        title: (<div>
          {eTDict['model.operation']}
          {actions.includes('copy') ? (
@@ -233,7 +234,7 @@

    this.setState({
      data: data || [],
      oricolumns: fromJS(this.props.columns).toJS(),
      operation,
      columns
    })
  }
@@ -241,12 +242,12 @@
  UNSAFE_componentWillReceiveProps (nextProps) {
    if (!is(fromJS(this.state.data), fromJS(nextProps.data))) {
      this.setState({data: nextProps.data, editingKey: ''})
    } else if (!is(fromJS(this.state.oricolumns), fromJS(nextProps.columns))) {
    } else if (!is(fromJS(this.props.columns), fromJS(nextProps.columns))) {
      if (nextProps.columns.length === this.props.columns.length) {
      let cols = {}
      nextProps.columns.forEach(col => {cols[col.dataIndex] = col})

      this.setState({
        oricolumns: fromJS(nextProps.columns).toJS(),
        columns: this.state.columns.map(col => {
          if (cols[col.dataIndex]) {
            return cols[col.dataIndex]
@@ -254,6 +255,13 @@
          return col
        })
      })
      } else {
        let columns = fromJS(nextProps.columns).toJS()
        if (this.state.operation) {
          columns.push(this.state.operation)
        }
        this.setState({columns})
      }
    }
  }