react-antd-admin-panel
Version:
Easy prototyping admin panel using React and Antd
67 lines • 2.69 kB
JavaScript
import React from "react";
import { Checkbox, CheckboxItem, Conditions, ConditionsItem, Input, Item, ListHeader, Multiple, Section as SectionModel, Select, Space, Title, } from "../../typescript";
import Section from "../Section";
const setConditions = (conditions) => {
let multiple = () => {
return new Multiple()
.key('items')
.label('Default')
.headers([
new ListHeader()
.key('value')
.title('Value')
.editable()
]);
};
let template = () => {
return new SectionModel()
.add(new Title().style({ paddingLeft: 10 }).level(4).label('Settings'))
.add(new Input().key('label').label('Label'))
.add(new Space().top(12))
.add(new Input().key('text').label('Text'))
.add(new Space().top(12))
.add(new Checkbox().key('required').add(new CheckboxItem().value(1).label('This field is required')).style({ paddingLeft: 10 }))
.add(new Space().top(12));
};
conditions
.add(new ConditionsItem()
.condition((value) => value === 'input')
.content((next) => next(template())))
.add(new ConditionsItem()
.condition((value) => value === 'radio')
.content((next) => next(template().add(multiple()))))
.add(new ConditionsItem()
.condition((value) => value === 'select')
.content((next) => next(template().add(multiple()))))
.add(new ConditionsItem()
.condition((value) => value === 'checkbox')
.content((next) => next(template().add(multiple()))))
.add(new ConditionsItem()
.condition((value) => value === 'multiple')
.content((next) => next(template().add(multiple()))));
return conditions;
};
const Creator = (props) => {
let model = props.model;
let section = new SectionModel();
let conditions = new Conditions();
conditions = setConditions(conditions);
conditions.default(model._default);
section.add(new Select()
.key('type')
.default(model._default)
.clearable(false)
.add(new Item('input'))
.add(new Item('radio'))
.add(new Item('select'))
.add(new Item('checkbox'))
.add(new Item('multiple'))
.onChange((v) => {
conditions.checkCondition(v);
}));
section.add(conditions);
section.add(new Space().top(24));
return React.createElement(Section, { main: props.main, section: section, parent: model });
};
export default Creator;
//# sourceMappingURL=Creator.js.map