From 9e60fb89a8b1c8a1d16b557b20b6d0a509f37983 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期五, 04 六月 2021 19:22:39 +0800
Subject: [PATCH] 2021-06-04

---
 src/menu/components/chart/antv-bar/chartcompile/index.jsx |   96 +++++++++++++++++++++++++++++++++++++++++++++--
 1 files changed, 91 insertions(+), 5 deletions(-)

diff --git a/src/menu/components/chart/antv-bar/chartcompile/index.jsx b/src/menu/components/chart/antv-bar/chartcompile/index.jsx
index f1661fe..0562b38 100644
--- a/src/menu/components/chart/antv-bar/chartcompile/index.jsx
+++ b/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">

--
Gitblit v1.8.0