import React from 'react';
import CRUD from '../../../commons/crud';
import CrudView from '../../packages/crud/crud-view';
import { app } from '../../../core/app';
import Form from '../../../forms/form';

const crud = new CRUD('substance');

// definition of the form fields to edit substances
const editorDef = {
    controls: [{
        property: 'shortName',
        required: true,
        type: 'string',
        max: 20,
        label: __('form.shortName'),
        size: { md: 3 }
    }, {
        property: 'name',
        required: true,
        type: 'string',
        max: 200,
        label: __('form.name'),
        size: { md: 6 }
    }, {
        property: 'line',
        required: true,
        type: 'select',
        options: app.getState().app.lists.MedicineLine,
        label: __('MedicineLine'),
        size: { md: 6 }
    }, {
        property: 'active',
        type: 'yesNo',
        label: __('EntityState.ACTIVE'),
        defaultValue: true,
        required: true,
        size: { md: 4 }
    }, {
        property: 'customId',
        type: 'string',
        label: __('form.customId'),
        size: { md: 3 }
    }],
    title: doc => doc && doc.id ? __('admin.substances.edt') : __('admin.substances.new')
};

/**
 * The page controller of the public module
 */
export default class Substances extends React.Component {

    constructor(props) {
        super(props);
        this.cellRender = this.cellRender.bind(this);
    }

    _itemClass(item) {
        switch (item.line) {
            case 'FIRST_LINE':
                return 'bg-success';
            case 'SECOND_LINE':
                return 'bg-danger';
            default:
                return 'bg-warning';
        }
    }

    cellRender(item) {
        const opts = app.getState().app.lists.MedicineLine;
        const medline = opts[item.line];
        const className = 'pull-right status-box text-small ' + this._itemClass(item);

        return React.createElement(
            'div',
            null,
            React.createElement(
                'div',
                { className: className },
                medline
            ),
            React.createElement(
                'b',
                null,
                item.shortName
            ),
            React.createElement(
                'div',
                { className: 'text-muted' },
                item.name
            )
        );
    }

    collapseCellRender(item) {
        const YesNo = Form.types.yesNo;
        return React.createElement(
            'div',
            null,
            React.createElement('hr', null),
            React.createElement(
                'dl',
                { className: 'text-small dl-horizontal text-muted' },
                React.createElement(
                    'dt',
                    null,
                    __('form.displayorder') + ':'
                ),
                React.createElement(
                    'dd',
                    null,
                    item.displayOrder
                ),
                React.createElement(
                    'dt',
                    null,
                    __('Substance.dstResultForm') + ':'
                ),
                React.createElement(
                    'dd',
                    null,
                    React.createElement(YesNo, { value: item.dstResultForm, noForm: true })
                ),
                React.createElement(
                    'dt',
                    null,
                    __('Substance.prevTreatmentForm') + ':'
                ),
                React.createElement(
                    'dd',
                    null,
                    React.createElement(YesNo, { value: item.prevTreatmentForm, noForm: true })
                ),
                React.createElement(
                    'dt',
                    null,
                    __('EntityState.ACTIVE') + ':'
                ),
                React.createElement(
                    'dd',
                    null,
                    React.createElement(YesNo, { value: item.active, noForm: true })
                ),
                React.createElement(
                    'dt',
                    null,
                    __('form.customId') + ':'
                ),
                React.createElement(
                    'dd',
                    null,
                    item.customId
                )
            ),
            React.createElement('hr', null)
        );
    }

    render() {
        // get information about the route of this page
        const data = this.props.route.data;

        return React.createElement(CrudView, { crud: crud,
            title: data.title,
            onCellRender: this.cellRender,
            onDetailRender: this.collapseCellRender,
            editorSchema: editorDef,
            perm: data.perm });
    }
}

Substances.propTypes = {
    route: React.PropTypes.object
};