UNPKG

react-antd-admin-panel

Version:

Easy prototyping admin panel using React and Antd

129 lines 6.85 kB
import React, { useState } from "react"; import { Popconfirm, Space, Tooltip } from "antd"; import { QuestionCircleOutlined, CloseOutlined, UndoOutlined, SaveOutlined, EditOutlined, } from "@ant-design/icons/lib"; import { Access } from "../../../typescript"; const handleIcon = (r, props) => { if (r._icon) return React.createElement(r._icon, Object.assign({ className: 'action-icon' }, props)); switch (r._key) { case 'deleteFromList': case 'deleteConfirm': case 'delete': return React.createElement(Tooltip, { title: 'Slet' }, React.createElement(CloseOutlined, Object.assign({}, props))); default: return React.createElement(React.Fragment, null); } }; const onClick = ({ model, props, record, action }) => { switch (action._key) { default: action.click({ model, props, record }); break; } }; const Actions = ({ parentProps, parentModel, record }) => { const [state, setState] = useState({ deleted: false, editing: false }); const [actions, setActions] = useState(parentProps.model._actions); const [visible, setVisible] = useState(false); const setDeleted = (v) => setState({ deleted: v, editing: state.editing }); const setEditing = (v) => setState({ editing: v, deleted: state.deleted }); return (React.createElement(Space, { align: 'end', style: { display: 'flex', justifyContent: 'flex-end' } }, actions.map((r, i) => { if (r._key === 'component') { const Component = r._component; return (React.createElement(Component, Object.assign({ key: i, value: record, record: record }, parentProps))); } if (r._key === 'deleteFromList') { return (React.createElement("span", { key: i, style: { marginLeft: 12, fontSize: 14, width: 36, opacity: 0.75 } }, React.createElement(Tooltip, { title: 'Slet' }, React.createElement(CloseOutlined, { onClick: (e) => { e.stopPropagation(); parentModel.removeRecord(record); } })))); } if (r._key === 'deleteConfirm') { return (React.createElement(Popconfirm, { key: i, title: "Er du sikker p\u00E5 at du vil slette", okText: "Ja", cancelText: "Nej", icon: React.createElement(QuestionCircleOutlined, { style: { color: 'grey' } }), placement: 'left', visible: visible, onCancel: (e) => { e.stopPropagation(); setVisible(false); }, onConfirm: (e) => { e.stopPropagation(); setVisible(false); r._componentData = record; onClick({ action: r, record: record, props: parentProps, model: parentModel, }); } }, React.createElement("span", { style: { marginLeft: 12, fontSize: 14, width: 36, opacity: 0.75 } }, new Access(parentProps.main) .action(r, record) .render((v) => React.createElement(CloseOutlined, Object.assign({}, v))) .configs({ onClick: (e) => { e.stopPropagation(); setVisible(true); } })))); } if (r._key === 'delete') { return (React.createElement("span", { key: i, style: { marginLeft: 12, fontSize: 14, width: 36, opacity: 0.75 } }, state.deleted ? (React.createElement(Tooltip, { title: 'Fortryd' }, new Access(parentProps.main).action(r, record).render((v) => React.createElement(UndoOutlined, Object.assign({}, v))) .configs({ onClick: (e) => { e.stopPropagation(); setDeleted(!state.deleted); parentModel.deleteRecord(record); } }))) : (React.createElement(Tooltip, { title: 'Slet' }, new Access(parentProps.main).action(r, record).render((v) => React.createElement(CloseOutlined, Object.assign({}, v))) .configs({ onClick: (e) => { e.stopPropagation(); setDeleted(!state.deleted); parentModel.deleteRecord(record); } }))))); } if (r._key === 'edit') { return (React.createElement("span", { key: i, style: { marginLeft: 12, fontSize: 14, width: 36, opacity: 0.75 } }, state.editing ? (React.createElement(Tooltip, { title: 'Gem' }, new Access(parentProps.main).action(r, record).render((v) => React.createElement(SaveOutlined, Object.assign({}, v))) .configs({ onClick: (e) => { e.stopPropagation(); parentModel.editRecord(record); parentModel._onRecordWasSaved(record); setEditing(!state.editing); } }))) : (React.createElement(Tooltip, { title: 'Rediger' }, new Access(parentProps.main).action(r, record).render((v) => React.createElement(EditOutlined, Object.assign({}, v))) .configs({ onClick: (e) => { e.stopPropagation(); parentModel.editRecord(record); setEditing(!state.editing); } }))))); } return (React.createElement("span", { key: i, style: { marginLeft: 12, fontSize: 14, width: 36, opacity: 0.75 } }, handleIcon(r, { onClick: () => { r._componentData = record; onClick({ action: r, record: record, props: parentProps, model: parentModel }); } }))); }), React.createElement("span", { style: { marginRight: 8 } }))); }; const handleActionProps = ({ props, model }) => ({ key: 'action', title: '', width: '1%', align: 'right', render: (record) => { return React.createElement(Actions, { parentProps: props, parentModel: model, record: record }); } }); export default handleActionProps; //# sourceMappingURL=ListActions.js.map