nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-10-23 11:23:05 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add image/text to catalog pages

Browse Source
This commit is contained in:
Bill 2021-05-11 19:22:45 -04:00
parent 66cd4f3b21
commit e4c5a18fab
4 changed files with 40 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/views/catalog/reducers/CatalogReducer.tsx
View File

@ -65,6 +65,7 @@ export const CatalogReducer: Reducer<ICatalogState, ICatalogAction> = (state, ac
}
case CatalogActions.SET_CATALOG_PAGE_PARSER: {
const pageParser = action.payload.pageParser;
const activeOffer = null;
const searchResult = state.searchResult;
@ -73,7 +74,7 @@ export const CatalogReducer: Reducer<ICatalogState, ICatalogAction> = (state, ac
searchResult.furniture = null;
}
return { ...state, pageParser, searchResult };
return { ...state, pageParser, activeOffer, searchResult };
}
case CatalogActions.SET_CATALOG_ACTIVE_OFFER: {
const activeOffer = (action.payload.activeOffer || state.activeOffer || null);

25
src/views/catalog/utils/CatalogUtilities.ts
View File

@ -1,5 +1,6 @@
import { CatalogPageOfferData, ICatalogPageData, IFurnitureData } from 'nitro-renderer';
import { CatalogPageOfferData, ICatalogPageData, ICatalogPageParser, IFurnitureData } from 'nitro-renderer';
import { GetProductDataForLocalization } from '../../../api/nitro/session/GetProductDataForLocalization';
import { GetConfiguration } from '../../../utils/GetConfiguration';
export interface ICatalogOffers
{
@ -65,3 +66,25 @@ export function SetOffersToNodes(offers: ICatalogOffers, pageData: ICatalogPageD
for(const child of pageData.children) SetOffersToNodes(offers, child);
}
}
export function GetCatalogPageImage(page: ICatalogPageParser, index: number = 0): string
{
const imageName = page.localization.images && page.localization.images[index];
if(!imageName || !imageName.length) return null;
let assetUrl = GetConfiguration<string>('catalog.asset.image.url');
assetUrl = assetUrl.replace('%name%', imageName);
return assetUrl;
}
export function GetCatalogPageText(page: ICatalogPageParser, index: number = 0): string
{
let message = (page.localization.texts[index] || '');
if(message && message.length) message = message.replace(/\r\n|\r|\n/g, '<br />');
return (message || '');
}

9
src/views/catalog/views/page/layout/default/CatalogLayoutDefaultView.tsx
View File

@ -2,7 +2,7 @@ import { FC } from 'react';
import { LimitedEditionCompletePlateView } from '../../../../../limited-edition/complete-plate/LimitedEditionCompletePlateView';
import { RoomPreviewerView } from '../../../../../room-previewer/RoomPreviewerView';
import { useCatalogContext } from '../../../../context/CatalogContext';
import { GetOfferName } from '../../../../utils/CatalogUtilities';
import { GetCatalogPageImage, GetCatalogPageText, GetOfferName } from '../../../../utils/CatalogUtilities';
import { CatalogPageOffersView } from '../../offers/CatalogPageOffersView';
import { CatalogPurchaseView } from '../../purchase/CatalogPurchaseView';
import { CatalogLayoutDefaultViewProps } from './CatalogLayoutDefaultView.types';
@ -20,6 +20,13 @@ export const CatalogLayoutDefaultView: FC<CatalogLayoutDefaultViewProps> = props
<div className="col-7">
<CatalogPageOffersView offers={ pageParser.offers } />
</div>
{ !product &&
<div className="position-relative d-flex flex-column col justify-content-center align-items-center">
<div className="d-block mb-2">
<img alt="" src={ GetCatalogPageImage(pageParser, 1) } />
</div>
<span className="text-center text-black lh-sm">{ GetCatalogPageText(pageParser, 0) }</span>
</div> }
{ product &&
<div className="position-relative d-flex flex-column col">
<RoomPreviewerView roomPreviewer={ roomPreviewer } height={ 140 } />

13
src/views/catalog/views/page/offers/CatalogPageOffersView.tsx
View File

@ -1,6 +1,5 @@
import { FC, useEffect } from 'react';
import { useCatalogContext } from '../../../context/CatalogContext';
import { CatalogActions } from '../../../reducers/CatalogReducer';
import { CatalogPageOfferView } from '../offer/CatalogPageOfferView';
import { CatalogPageOffersViewProps } from './CatalogPageOffersView.types';
@ -14,12 +13,12 @@ export const CatalogPageOffersView: FC<CatalogPageOffersViewProps> = props =>
{
if(!offers || !offers.length) return;
dispatchCatalogState({
type: CatalogActions.SET_CATALOG_ACTIVE_OFFER,
payload: {
activeOffer: offers[0]
}
})
// dispatchCatalogState({
// type: CatalogActions.SET_CATALOG_ACTIVE_OFFER,
// payload: {
// activeOffer: offers[0]
// }
// });
}, [ offers, dispatchCatalogState ]);
return (