- added stats to dashboard;

- improved form builder;
This commit is contained in:
Vitalii Kiiko
2024-10-14 16:17:30 +02:00
parent 7751e3a745
commit 49765c98e6
10 changed files with 177 additions and 28 deletions

View File

@@ -3,7 +3,7 @@ import { useDrag, useDrop } from 'react-dnd'
import { ItemTypes } from '../ItemTypes';
// store
import { storeSet } from '../../../../store';
import { storeSet, useStore } from '../../../../store';
// components
import { Button } from 'primereact/button';
@@ -11,6 +11,7 @@ import { Tag } from 'primereact/tag';
import BuilderElementProperLabel from '../BuilderElementProperLabel';
const BuilderElement = ({ id, name, label, index }) => {
const draggingElementId = useStore().main.draggingElementId();
const ref = useRef(null);
const [{ handlerId }, drop] = useDrop({
@@ -20,6 +21,10 @@ const BuilderElement = ({ id, name, label, index }) => {
handlerId: monitor.getHandlerId(),
}
},
drop(item, monitor) {
storeSet.main.draggingElementId(0);
return item;
},
hover(item, monitor) {
if (!ref.current) {
return
@@ -92,17 +97,37 @@ const BuilderElement = ({ id, name, label, index }) => {
drag(drop(ref));
return (
<div ref={ref} className="formBuilder__element" style={{ opacity }} data-handler-id={handlerId}>
<div className="meta">
<Tag value={name} severity="info"/>
<BuilderElementProperLabel id={id} defaultLabel={label}/>
draggingElementId === id
? <div ref={ref} className="formBuilder__elementNew"></div>
: <div ref={ref} className="formBuilder__element" style={{ opacity }} data-handler-id={handlerId}>
<div className="meta">
<Tag value={name} severity="info"/>
<BuilderElementProperLabel id={id} defaultLabel={label}/>
</div>
<div className="actions">
<Button icon="pi pi-cog" onClick={() => openSettings(id)} outlined severity="info"/>
<Button icon="pi pi-trash" onClick={() => remove(id)} outlined severity="danger"/>
</div>
</div>
<div className="actions">
<Button icon="pi pi-cog" onClick={() => openSettings(id)} outlined severity="info" />
<Button icon="pi pi-trash" onClick={() => remove(id)} outlined severity="danger" />
</div>
</div>
)
/*return (
<div ref={ref} className="formBuilder__element" style={{ opacity }} data-handler-id={handlerId}>
{draggingId === id
? <div className="formBuilder__elementNew"></div>
: <>
<div className="meta">
<Tag value={name} severity="info"/>
<BuilderElementProperLabel id={id} defaultLabel={label}/>
</div>
<div className="actions">
<Button icon="pi pi-cog" onClick={() => openSettings(id)} outlined severity="info"/>
<Button icon="pi pi-trash" onClick={() => remove(id)} outlined severity="danger"/>
</div>
</>
}
</div>
)*/
}
export default BuilderElement;