UNPKG

@opendash/plugin-parse

Version:

Parse Server Plugin for open.DASH

101 lines 5.86 kB
import React from "react"; import { Modal, Form, Input, InputNumber, DatePicker, message, Checkbox, } from "antd"; import { Parse } from "parse-hooks"; import { useTranslation, useObjectState } from "opendash"; export default function AdminTableEditElement(_a) { var schema = _a.schema, config = _a.config, edit = _a.edit, create = _a.create, close = _a.close; var t = useTranslation(["parse", "parse-custom", "opendash"])[0]; var _b = useObjectState({}), state = _b[0], setState = _b[1], resetState = _b[2]; var mode = edit ? "edit" : "create"; var fields = React.useMemo(function () { var f = edit ? config.edit_fields : config.create_fields; return f.map(function (field) { var type = schema.fields[field] ? schema.fields[field].type : undefined; var label = "parse-custom:classes." + config.key + ".fields." + field; return { field: field, type: type, label: label, }; }); }, [create, edit]); React.useEffect(function () { if (create) { setState(Object.fromEntries(config.create_fields.map(function (field) { var _a; return [field, (_a = create) === null || _a === void 0 ? void 0 : _a.get(field)]; }))); } if (edit) { setState(Object.fromEntries(config.edit_fields.map(function (field) { return [field, edit.get(field)]; }))); } }, [create, edit]); var onSave = function (e) { e.preventDefault(); var classObject = Parse.Object.extend(config.className); var object = edit ? edit : new classObject(); if (create) { var acl = new Parse.ACL(); acl.setReadAccess(Parse.User.current(), true); acl.setWriteAccess(Parse.User.current(), true); object.setACL(acl); } fields.forEach(function (f) { var value = state[f.field]; if (f.type === "GeoPoint") { object.set(f.field, new Parse.GeoPoint(value)); return; } object.set(f.field, value); }); object.save().then(function (ok) { message.success(t("parse:admin." + mode + ".success")); close(true); }, function (error) { message.error(t("parse:admin." + mode + ".error")); }); }; return (React.createElement(Modal, { visible: !!create || !!edit, title: t("parse:admin." + mode + ".modal_title", { type: t("parse-custom:classes." + config.key + ".label"), }), onCancel: function (e) { return close(); }, onOk: onSave, okText: t("parse:admin." + mode + ".save"), children: React.createElement(AdminTableEditElementForm, { fields: fields, state: state, setState: setState, onSave: onSave }) })); } function AdminTableEditElementForm(_a) { var fields = _a.fields, state = _a.state, setState = _a.setState, onSave = _a.onSave; var t = useTranslation(["parse", "parse-custom", "opendash"])[0]; return (React.createElement(Form, { layout: "vertical", onSubmit: onSave }, fields.map(function (field) { var key = field.field; var type = field.type; return (React.createElement(Form.Item, { key: key, label: t(field.label) }, React.createElement(AdminTableEditElementFormInput, { field: key, type: type, value: state[key], setValue: function (v) { var _a; setState((_a = {}, _a[key] = v, _a)); } }))); }))); } function AdminTableEditElementFormInput(_a) { var field = _a.field, type = _a.type, value = _a.value, setValue = _a.setValue; var t = useTranslation(["parse", "opendash"])[0]; if (type === "String" && field === "password") { return (React.createElement(Input.Password, { placeholder: t("parse:admin.inputs.password_placeholder"), value: value, onChange: function (e) { return setValue(e.target.value); } })); } if (type === "String") { return (React.createElement(Input, { placeholder: t("parse:admin.inputs.string_placeholder"), value: value, onChange: function (e) { return setValue(e.target.value); } })); } if (type === "Boolean") { return (React.createElement(Checkbox, { checked: value, onChange: function (e) { return setValue(e.target.checked); } })); } if (type === "Number") { return (React.createElement(InputNumber, { placeholder: t("parse:admin.inputs.number_placeholder"), style: { width: "100%" }, parser: function (v) { return parseFloat(v) || 0; }, value: value, onChange: function (v) { return setValue(v); } })); } if (type === "GeoPoint") { value = value ? value : {}; return (React.createElement("div", null, React.createElement(InputNumber, { placeholder: t("parse:admin.inputs.latitude"), parser: function (v) { return parseFloat(v) || 0; }, value: value.latitude, onChange: function (v) { return setValue({ latitude: v, longitude: value.longitude }); }, style: { width: "calc(50% - 8px)", marginRight: 8 } }), React.createElement(InputNumber, { placeholder: t("parse:admin.inputs.longitude"), parser: function (v) { return parseFloat(v) || 0; }, value: value.longitude, onChange: function (v) { return setValue({ latitude: value.latitude, longitude: v }); }, style: { width: "calc(50% - 8px)", marginLeft: 8 } }))); } if (type === "Date") { return (React.createElement(DatePicker, { value: value, onChange: function (v) { return setValue(v); }, style: { width: "100%" } })); } return React.createElement("div", null, "Keine Eingabe f\u00FCr den Typ \"", type, "\" m\u00F6glich."); } //# sourceMappingURL=AdminTableEditElement.js.map