king
2023-06-20 b25bda3d390f7db85584ae97315f2aeb7aae32ce
src/tabviews/zshare/topSearch/mkCheckCard/index.jsx
@@ -1,7 +1,7 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
import { Col, Row } from 'antd'
import { Col, Row, Dropdown, Menu } from 'antd'
import { CheckOutlined } from '@ant-design/icons'
import MKEmitter from '@/utils/events.js'
@@ -225,27 +225,7 @@
          </div>
        </Col>
      })
    } else if (display !== 'picture') {
      let _style = selectStyle === 'custom' ? {backgroundColor} : null
      return options.map(item => {
        let _active = false
        if (multiple === 'true') {
          _active = selectKeys.includes(item.$value)
        } else {
          _active = selectKeys === item.$value
        }
        return <Col span={width} key={item.key}>
          <div className={'card-cell' + (_active ? ' active' : '') + selectClass} onClick={() => this.changeCard(item)}>
            <div className="bg-mask" style={_style}></div>
            {fields.map(col => {
              return <span className="content-line" key={col.key} style={{color: col.color, fontSize: col.fontSize + 'px', height: col.fontSize * 1.5 + 'px', textAlign: col.align}}>{item[col.field]}</span>
            })}
          </div>
        </Col>
      })
    } else {
    } else if (display === 'picture') {
      let paddingTop = '100%'
      if (picratio === '4:3') {
        paddingTop = '75%'
@@ -276,6 +256,60 @@
          </div>
        </Col>
      })
    } else {
      let _style = selectStyle === 'custom' ? {backgroundColor} : null
      if (multiple === 'dropdown') {
        return options.map(item => {
          if (item.children.length) {
            return <Col span={width} key={item.key}>
              <Dropdown
                overlayClassName="mk-search-card"
                overlay={
                <Menu>
                  {item.children.map((cell, index) => (<Menu.Item className={selectKeys === cell.$value ? ' active' : ''} key={index} onClick={() => this.changeCard(cell)}>{cell[fields[0].field]}</Menu.Item>))}
                </Menu>}
                placement="bottomCenter"
              >
                <div className={'card-cell' + (selectKeys && (selectKeys === item.$value || item.subIds.includes(selectKeys)) ? ' active' : '') + selectClass} onClick={() => this.changeCard(item)}>
                  <div className="bg-mask" style={_style}></div>
                  {fields.map(col => {
                    return <span className="content-line" key={col.key} style={{color: col.color, fontSize: col.fontSize + 'px', height: col.fontSize * 1.5 + 'px', textAlign: col.align}}>{item[col.field]}</span>
                  })}
                </div>
              </Dropdown>
            </Col>
          } else {
            return <Col span={width} key={item.key}>
              <div className={'card-cell' + (selectKeys === item.$value ? ' active' : '') + selectClass} onClick={() => this.changeCard(item)}>
                <div className="bg-mask" style={_style}></div>
                {fields.map(col => {
                  return <span className="content-line" key={col.key} style={{color: col.color, fontSize: col.fontSize + 'px', height: col.fontSize * 1.5 + 'px', textAlign: col.align}}>{item[col.field]}</span>
                })}
              </div>
            </Col>
          }
        })
      } else {
        return options.map(item => {
          let _active = false
          if (multiple === 'true') {
            _active = selectKeys.includes(item.$value)
          } else {
            _active = selectKeys === item.$value
          }
          return <Col span={width} key={item.key}>
            <div className={'card-cell' + (_active ? ' active' : '') + selectClass} onClick={() => this.changeCard(item)}>
              <div className="bg-mask" style={_style}></div>
              {fields.map(col => {
                return <span className="content-line" key={col.key} style={{color: col.color, fontSize: col.fontSize + 'px', height: col.fontSize * 1.5 + 'px', textAlign: col.align}}>{item[col.field]}</span>
              })}
            </div>
          </Col>
        })
      }
    }
  }