- added btn 'add to favourites;

This commit is contained in:
Vitalii Kiiko
2024-11-11 14:16:33 +01:00
parent cff391ae9c
commit a42806c0f0
3 changed files with 58 additions and 28 deletions

View File

@@ -355,8 +355,8 @@
.appPageSection__tableActions {
display: flex;
gap: 24px;
padding: 0;
gap: 10px;
align-items: center;
flex-wrap: wrap;
}
@@ -368,12 +368,18 @@
justify-content: center;
border-radius: 50%;
border: none;
background-color: var(--message-info-color);
color: white;
background-color: transparent;
color: var(--global-textColor);
padding: 0;
&:hover {
cursor: pointer;
color: var(--message-info-color);
}
&[data-active="true"] {
background-color: var(--message-info-color);
color: white;
}
&[disabled] {

View File

@@ -102,7 +102,9 @@ const AllBandiAccordion = () => {
const actionsBodyTemplate = (rowData) => {
return <div className="appPageSection__tableActions">
<button type="button" className="appPageSection__addToFavourites" onClick={addToFavourites} disabled={true}>
<button type="button"
className="appPageSection__addToFavourites"
onClick={() => addToFavourites(rowData.id)}>
<i className="pi pi-heart" style={{ fontSize: '1rem' }}></i>
</button>
</div>
@@ -151,8 +153,9 @@ const AllBandiAccordion = () => {
<Column field="status" header={__('Stato', 'gepafin')} filterMenuStyle={{ width: '14rem' }}
style={{ width: '120px' }} body={statusBodyTemplate} filter sortable
filterElement={statusFilterTemplate}/>
{/*<Column header={__('Azioni', 'gepafin')}
body={actionsBodyTemplate}/>*/}
<Column header={__('Azioni', 'gepafin')}
style={{ width: '120px' }}
body={actionsBodyTemplate}/>
</DataTable>
</div>
)

View File

@@ -55,6 +55,10 @@ const LatestBandiTable = () => {
storeSet.main.unsetAsyncRequest();
}
const addToFavourites = (id) => {
}
const getFormattedData = (data) => {
return [...(data || [])].map((d) => {
d.start_date = new Date(d.dates[0]);
@@ -89,9 +93,18 @@ const LatestBandiTable = () => {
const initFilters = () => {
setFilters({
global: { value: null, matchMode: FilterMatchMode.CONTAINS },
name: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }] },
start_date: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }] },
end_date: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }] },
name: {
operator: FilterOperator.AND,
constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }]
},
start_date: {
operator: FilterOperator.AND,
constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }]
},
end_date: {
operator: FilterOperator.AND,
constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }]
},
status: { operator: FilterOperator.OR, constraints: [{ value: null, matchMode: FilterMatchMode.EQUALS }] }
});
setGlobalFilterValue('');
@@ -100,10 +113,12 @@ const LatestBandiTable = () => {
const renderHeader = () => {
return (
<div className="appTableHeader">
<Button type="button" icon="pi pi-filter-slash" label={__('Pulisci', 'gepafin')} outlined onClick={clearFilter} />
<Button type="button" icon="pi pi-filter-slash" label={__('Pulisci', 'gepafin')} outlined
onClick={clearFilter}/>
<IconField iconPosition="left">
<InputIcon className="pi pi-search"/>
<InputText value={globalFilterValue} onChange={onGlobalFilterChange} placeholder={__('Cerca', 'gepafin')} />
<InputText value={globalFilterValue} onChange={onGlobalFilterChange}
placeholder={__('Cerca', 'gepafin')}/>
</IconField>
</div>
);
@@ -118,26 +133,31 @@ const LatestBandiTable = () => {
};
const dateFilterTemplate = (options) => {
return <Calendar value={options.value} onChange={(e) => options.filterCallback(e.value, options.index)} dateFormat="mm/dd/yy" placeholder="mm/dd/yyyy" mask="99/99/9999" />;
return <Calendar value={options.value} onChange={(e) => options.filterCallback(e.value, options.index)}
dateFormat="mm/dd/yy" placeholder="mm/dd/yyyy" mask="99/99/9999"/>;
};
const statusBodyTemplate = (rowData) => {
return <ProperBandoLabel status={rowData.status}/>;
};
const statusItemTemplate = (option) => {
return <Tag value={getBandoLabel(option)} severity={getBandoSeverity(option)} />;
};
const actionsBodyTemplate = (rowData) => {
return rowData.confidi
return <div className="appPageSection__tableActions">
<button type="button"
className="appPageSection__addToFavourites"
onClick={() => addToFavourites(rowData.id)}>
<i className="pi pi-heart" style={{ fontSize: '1rem' }}></i>
</button>
{rowData.confidi
? <Link to={`/bandi/${rowData.id}`}>
<Button severity="info" label={__('Mostra', 'gepafin')} icon="pi pi-eye" size="small" iconPos="right"/>
<Button severity="info" label={__('Mostra', 'gepafin')} icon="pi pi-eye" size="small"
iconPos="right"/>
</Link>
: <Link to={`/bandi/${rowData.id}`}>
<Button severity="info" label={__('Partecipa', 'gepafin')} icon="pi pi-arrow-right" size="small"
iconPos="right"/>
</Link>
</Link>}
</div>
}
const header = renderHeader();
@@ -150,7 +170,8 @@ const LatestBandiTable = () => {
header={header}
emptyMessage={__('Nessun dato disponibile', 'gepafin')}
onFilter={(e) => setFilters(e.filters)}>
<Column field="name" header={__('Nome Bando', 'gepafin')} filter filterPlaceholder={__('Cerca il nome', 'gepafin')}
<Column field="name" header={__('Nome Bando', 'gepafin')} filter
filterPlaceholder={__('Cerca il nome', 'gepafin')}
style={{ minWidth: '8rem' }}/>
<Column header={__('Data Pubblicazione', 'gepafin')} filterField="start_date" dataType="date"
style={{ minWidth: '8rem' }}