From eb31b84962c192de57abbb473cb4733a09bf4363 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 14 五月 2020 18:09:40 +0800
Subject: [PATCH] 2020-05-14

---
 src/templates/sharecomponent/chartgroupcomponent/chartform/index.jsx |  110 +++++++++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 94 insertions(+), 16 deletions(-)

diff --git a/src/templates/sharecomponent/chartgroupcomponent/chartform/index.jsx b/src/templates/sharecomponent/chartgroupcomponent/chartform/index.jsx
index 0d0c26d..5c9e405 100644
--- a/src/templates/sharecomponent/chartgroupcomponent/chartform/index.jsx
+++ b/src/templates/sharecomponent/chartgroupcomponent/chartform/index.jsx
@@ -103,6 +103,18 @@
         shape: 'ring'
       }
     }
+  ],
+  card: [
+    {
+      uuid: 'card1',
+      url: pie1,
+      type: 'card1'
+    },
+    {
+      uuid: 'card2',
+      url: pie2,
+      type: 'card2'
+    }
   ]
 }
 
@@ -123,6 +135,7 @@
 
   UNSAFE_componentWillMount () {
     const { card } = this.props
+    let formlist = JSON.parse(JSON.stringify(this.props.formlist))
 
     let _type = card.chartType || 'line'
     let _legends = null
@@ -135,11 +148,30 @@
       if (!_selectlegend) {
         _selectlegend = _legends[0]
       }
+    } else if (_type === 'card') {
+      _legends = syslegends[_type]
+      _selectlegend = _legends.filter(item => item.uuid === card.cardType)[0]
+
+      if (!_selectlegend) {
+        _selectlegend = _legends[0]
+      }
     }
 
     this.setState({
       legends: _legends,
-      selectlegend: _selectlegend
+      selectlegend: _selectlegend,
+      formlist: formlist.map(item => {
+        if (item.key === 'height' && ['table', 'card'].includes(_type)) {
+          item.hidden = true
+        } else if (item.key === 'widthType' && _type === 'card') {
+          item.hidden = false
+        } else if (item.key === 'cardWidth' && _type === 'card') {
+          item.hidden = false
+        } else if (item.key === 'over' && _type === 'card') {
+          item.hidden = false
+        }
+        return item
+      })
     })
   }
 
@@ -165,10 +197,44 @@
   }
 
   typeChange = (key, value) => {
+    const { card } = this.props
+    let formlist = JSON.parse(JSON.stringify(this.props.formlist))
+
     if (key === 'chartType') {
       this.setState({
         legends: syslegends[value] || null,
-        selectlegend: syslegends[value][0]
+        selectlegend: syslegends[value] ? syslegends[value][0] : null,
+        formlist: formlist.map(item => {
+          if (item.key === 'height' && ['table', 'card'].includes(value)) {
+            item.hidden = true
+          } else if (item.key === 'widthType' && value === 'card') {
+            item.hidden = false
+          } else if (item.key === 'cardWidth' && value === 'card') {
+            item.min = card.widthType === 'absolute' ? 50 : 1
+            item.max = card.widthType === 'absolute' ? 1000 : 24
+            item.hidden = false
+          } else if (item.key === 'over' && value === 'card') {
+            item.hidden = false
+          }
+          return item
+        })
+      })
+    }
+  }
+
+  radioChange = (val, key) => {
+    const { formlist } = this.state
+
+    if (key === 'widthType') {
+      this.setState({
+        formlist: formlist.map(item => {
+          if (item.key === 'cardWidth') {
+            item.min = val === 'absolute' ? 50 : 1
+            item.max = val === 'absolute' ? 1000 : 24
+          }
+
+          return item
+        })
       })
     }
   }
@@ -182,7 +248,7 @@
   getFields() {
     const { getFieldDecorator } = this.props.form
     const fields = []
-    this.props.formlist.forEach((item, index) => {
+    this.state.formlist.forEach((item, index) => {
       if (item.hidden) return
       
       if (item.type === 'text') { // 鏂囨湰鎼滅储
@@ -274,7 +340,7 @@
                   }
                 ]
               })(
-                <Radio.Group>
+                <Radio.Group onChange={(e) => this.radioChange(e.target.value, item.key)}>
                   {
                     item.options.map(option => {
                       return (
@@ -324,21 +390,33 @@
             table: 'table',
             line: 'line-chart',
             bar: 'bar-chart',
-            pie: 'pie-chart'
+            pie: 'pie-chart',
+            card: 'credit-card'
           }
 
-          if (selectlegend && this.props.card.modelId !== selectlegend.uuid) {
-            result = {...result, ...selectlegend.options}
-          }
+          if (result.chartType === 'line' || result.chartType === 'bar' || result.chartType === 'line') {
+            if (selectlegend && this.props.card.modelId !== selectlegend.uuid) {
+              result = {...result, ...selectlegend.options}
+            }
+  
+            if (selectlegend) {
+              result.modelId = selectlegend.uuid
+            }
+  
+            if (result.chartType !== 'pie' && result.Yaxis && typeof(result.Yaxis) === 'string') {
+              result.Yaxis = [result.Yaxis]
+            } else if (result.chartType === 'pie' && result.Yaxis && typeof(result.Yaxis) === 'object') {
+              result.Yaxis = result.Yaxis[0] || ''
+            }
+          } else if (result.chartType === 'card') {
+            result.cardType = selectlegend.type
 
-          if (selectlegend) {
-            result.modelId = selectlegend.uuid
-          }
-
-          if (result.chartType !== 'pie' && result.Yaxis && typeof(result.Yaxis) === 'string') {
-            result.Yaxis = [result.Yaxis]
-          } else if (result.chartType === 'pie' && result.Yaxis && typeof(result.Yaxis) === 'object') {
-            result.Yaxis = result.Yaxis[0] || ''
+            if (!result.details) {
+              result.details = [
+                {type: 'title', uuid: 'cardtitle', content: 'Card title', datatype: 'static', align: 'left'},
+                {type: 'description', uuid: 'carddescription', content: 'This is the description', datatype: 'static', align: 'left'}
+              ]
+            }
           }
 
           result.icon = icons[result.chartType]

--
Gitblit v1.8.0