- added stats to dashboard;
- improved form builder;
This commit is contained in:
@@ -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;
|
||||
Reference in New Issue
Block a user