From 2cb65d99c9aebf8293cb2838fcfe3e09fb2739ce Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期五, 06 十二月 2019 00:15:12 +0800
Subject: [PATCH] 2019-12-06

---
 src/templates/modalconfig/editcard/index.jsx |   77 +++++++++++++++++++++++---------------
 1 files changed, 46 insertions(+), 31 deletions(-)

diff --git a/src/templates/modalconfig/editcard/index.jsx b/src/templates/modalconfig/editcard/index.jsx
index f691210..398cfee 100644
--- a/src/templates/modalconfig/editcard/index.jsx
+++ b/src/templates/modalconfig/editcard/index.jsx
@@ -1,6 +1,8 @@
 import React, {Component} from 'react'
-import { Row, Col, Icon, Radio } from 'antd'
+import { Row, Col, Icon, Radio, Input } from 'antd'
 import './index.scss'
+
+const { Search } = Input
 
 class EditCardCell extends Component {
   constructor(props) {
@@ -16,6 +18,8 @@
     const { card } = this.state
     this.setState({
       card: {...card, selected: !card.selected}
+    }, () => {
+      this.props.changeCard(this.state.card)
     })
   }
 
@@ -27,34 +31,21 @@
   }
 
   render() {
-    const { card, type } = this.state
-    let _type = card.type
-    if (type === 'columns') {
-      if (_type !== 'picture') {
-        _type = 'text'
-      }
-    } else if (type === 'search') {
-      if (_type === 'number') {
-        _type = 'text'
-      }
-    }
+    const { card } = this.state
     return (
       <div className={'ant-card ant-card-bordered ' + (card.selected ? 'selected' : '')} >
         <div className="base" onClick={this.changeSelect}>
           <Icon type="check" />
-          <p title={card.field}>瀛楁鍚�: {card.field}</p>
-          <p title={card.label}>鎻愮ず鏂囧瓧: {card.label}</p>
+          <p title={card.field}>瀛楁锛� <span>{card.field}</span></p>
+          <p title={card.label}>鍚嶇О锛� <span>{card.label}</span></p>
         </div>
-        {type === 'search' && <Radio.Group onChange={this.changeType} value={_type} disabled={!card.selected}>
+        <Radio.Group onChange={this.changeType} value={card.type} disabled={!card.selected}>
           <Radio value="text">text</Radio>
+          <Radio value="number">number</Radio>
           <Radio value="select">select</Radio>
           <Radio value="date">date</Radio>
           <Radio value="datetime">datetime</Radio>
-        </Radio.Group>}
-        {type === 'columns' && <Radio.Group onChange={this.changeType} value={_type} disabled={!card.selected}>
-          <Radio value="text">text</Radio>
-          <Radio value="picture">picture</Radio>
-        </Radio.Group>}
+        </Radio.Group>
       </div>
     )
   }
@@ -66,16 +57,29 @@
 
     this.state = {
       dataSource: props.data,
-      type: props.type
+      selectCards: props.data.filter(item => item.selected),
+      type: props.type,
+      searchKey: ''
     }
   }
 
-  getSelectedCard = () => {
-    let box = []
-    this.state.dataSource.forEach((item, index) => {
-      box.push(this.refs['cellCard' + index].state.card)
+  changeCard = (item) => {
+    let cards = JSON.parse(JSON.stringify(this.state.selectCards))
+    let isAdd = true
+    cards = cards.map(card => {
+      if (card.field === item.field) {
+        isAdd = false
+        return item
+      } else {
+        return card
+      }
     })
-    return box
+    if (isAdd) {
+      cards.push(item)
+    }
+    this.setState({
+      selectCards: cards
+    })
   }
 
   render() {
@@ -83,12 +87,23 @@
 
     return (
       <div className="common-modal-edit-card">
+        <Row className="search-row">
+          <Col span={8}>
+            <Search placeholder="璇疯緭鍏ュ瓧娈靛悕" onSearch={value => {this.setState({searchKey: value})}} enterButton />
+          </Col>
+        </Row>
         <Row>
-          {dataSource.map((item, index) => (
-            <Col key={index} span={8}>
-              <EditCardCell ref={'cellCard' + index} type={type} card={item} />
-            </Col>
-          ))}
+          {dataSource.map((item, index) => {
+            if (item.field.toLowerCase().indexOf(this.state.searchKey.toLowerCase()) >= 0) {
+              return (
+                <Col key={index} span={8}>
+                  <EditCardCell ref={'cellCard' + index} type={type} card={item} changeCard={this.changeCard} />
+                </Col>
+              )
+            } else {
+              return ''
+            }
+          })}
         </Row>
       </div>
     )

--
Gitblit v1.8.0