skyquake/plugins/admin/src/components/ChoiceCard.jsx

   1 import React from 'react'
   2 import ColumnCard from './ColumnCard'
   3 import { ExcerptIcon } from 'react-open-iconic-svg';
   4
   5 export default class extends React.Component {
   6     render() {
   7         try {
   8             const { model, path, isSelected, openElement } = this.props;
   9             const element = model.getElement(path)
  10             const name = element.name;
  11             let choiceName = "none";
  12             if (element.value) {
  13                 const selectedCase = element.schema.properties.find(c =>
  14                     c.properties && c.properties.some(p => element.value[p.name]));
  15                 if (selectedCase) {
  16                     choiceName = selectedCase.name;
  17                 }
  18             }
  19             console.debug(`ChoiceCard: ${name}`);
  20             return (
  21                 <ColumnCard path={path} isSelected={isSelected} className='chioce-card'>
  22                     <ExcerptIcon />
  23                     <div className='list-card' style={{ cursor: 'pointer' }} onClick={() => openElement({ path })}>
  24                         <span style={{ paddingRight: '8px' }} >{`${name}`}</span><span style={{ fontSize: 'small', verticalAlign: 'top' }}>{`(${choiceName})`}</span>
  25                     </div>
  26                 </ColumnCard>
  27             )
  28         } catch (e) {
  29             console.error("component render", e);
  30         }
  31     }
  32 }