rooty/fab-manager
1
0
Fork 0
mirror of https://github.com/LaCasemate/fab-manager.git synced 2025-01-18 07:52:23 +01:00
Code Issues Releases Activity

(bug) product stock status and quantity min to cart

Browse Source
This commit is contained in:
Du Peng 2022-09-16 16:50:05 +02:00
parent 6fc0b935d9
commit 8c75b5fdd4
6 changed files with 23 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app/frontend/src/javascript/components/cart/store-cart.tsx
View File

@ -1,6 +1,7 @@
import React, { useState } from 'react';
import { useTranslation } from 'react-i18next';
import { react2angular } from 'react2angular';
import _ from 'lodash';
import { Loader } from '../base/loader';
import { IApplication } from '../../models/application';
import { FabButton } from '../base/fab-button';
@ -151,7 +152,7 @@ const StoreCart: React.FC<StoreCartProps> = ({ onSuccess, onError, currentUser,
<span>/ {t('app.public.store_cart.unit')}</span>
</div>
<select value={item.quantity} onChange={changeProductQuantity(item)}>
{Array.from({ length: 100 }, (_, i) => i + item.quantity_min).map(v => (
{_.range(item.quantity_min, item.orderable_external_stock + 1, 1).map(v => (
<option key={v} value={v}>{v}</option>
))}
</select>

2
app/frontend/src/javascript/components/store/product-item.tsx
View File

@ -49,7 +49,7 @@ export const ProductItem: React.FC<ProductItemProps> = ({ product, onEdit, onDel
* Returns CSS class from stock status
*/
const statusColor = (product: Product) => {
if (product.stock.external === 0 && product.stock.internal === 0) {
if (product.stock.external < 1 && product.stock.internal < 1) {
return 'out-of-stock';
}
if (product.low_stock_threshold && (product.stock.external < product.low_stock_threshold || product.stock.internal < product.low_stock_threshold)) {

6
app/frontend/src/javascript/components/store/store-product-item.tsx
View File

@ -53,10 +53,10 @@ export const StoreProductItem: React.FC<StoreProductItemProps> = ({ product, car
* Returns CSS class from stock status
*/
const statusColor = (product: Product) => {
if (product.stock.external === 0 && product.stock.internal === 0) {
if (product.stock.external < (product.quantity_min || 1)) {
return 'out-of-stock';
}
if (product.low_stock_alert) {
if (product.low_stock_threshold && product.stock.external < product.low_stock_threshold) {
return 'low';
}
return '';
@ -90,7 +90,7 @@ export const StoreProductItem: React.FC<StoreProductItemProps> = ({ product, car
<FabStateLabel status={statusColor(product)}>
{productStockStatus(product)}
</FabStateLabel>
{product.stock.external > 0 &&
{product.stock.external > (product.quantity_min || 1) &&
<FabButton icon={<i className="fas fa-cart-arrow-down" />} className="main-action-btn" onClick={addProductToCart}>
{t('app.public.store_product_item.add')}
</FabButton>

14
app/frontend/src/javascript/components/store/store-product.tsx
View File

@ -68,10 +68,10 @@ export const StoreProduct: React.FC<StoreProductProps> = ({ productSlug, current
* Returns CSS class from stock status
*/
const statusColor = (product: Product) => {
if (product.stock.external === 0 && product.stock.internal === 0) {
if (product.stock.external < (product.quantity_min || 1)) {
return 'out-of-stock';
}
if (product.low_stock_alert) {
if (product.low_stock_threshold && product.stock.external < product.low_stock_threshold) {
return 'low';
}
};
@ -80,7 +80,7 @@ export const StoreProduct: React.FC<StoreProductProps> = ({ productSlug, current
* Return product's stock status
*/
const productStockStatus = (product: Product) => {
if (product.stock.external === 0) {
if (product.stock.external < (product.quantity_min || 1)) {
return <span>{t('app.public.store_product_item.out_of_stock')}</span>;
}
if (product.low_stock_threshold && product.stock.external < product.low_stock_threshold) {
@ -95,7 +95,9 @@ export const StoreProduct: React.FC<StoreProductProps> = ({ productSlug, current
const setCount = (type: 'add' | 'remove') => {
switch (type) {
case 'add':
if (toCartCount < product.stock.external) {
setToCartCount(toCartCount + 1);
}
break;
case 'remove':
if (toCartCount > product.quantity_min) {
@ -116,10 +118,12 @@ export const StoreProduct: React.FC<StoreProductProps> = ({ productSlug, current
* Add product to cart
*/
const addToCart = () => {
if (toCartCount <= product.stock.external) {
CartAPI.addItem(cart, product.id, toCartCount).then(data => {
setCart(data);
onSuccess(t('app.public.store.add_to_cart_success'));
}).catch(onError);
}
};
if (product) {
@ -179,11 +183,13 @@ export const StoreProduct: React.FC<StoreProductProps> = ({ productSlug, current
<p>{FormatLib.price(product.amount)} <sup>TTC</sup></p>
<span>/ {t('app.public.store_product_item.unit')}</span>
</div>
{product.stock.external > 0 &&
{product.stock.external > (product.quantity_min || 1) &&
<div className='to-cart'>
<FabButton onClick={() => setCount('remove')} icon={<Minus size={16} />} className="minus" />
<input type="number"
value={toCartCount}
min={product.quantity_min}
max={product.stock.external}
onChange={evt => typeCount(evt)} />
<FabButton onClick={() => setCount('add')} icon={<Plus size={16} />} className="plus" />
<FabButton onClick={() => addToCart()} icon={<i className="fas fa-cart-arrow-down" />}

1
app/frontend/src/javascript/models/order.ts
View File

@ -32,6 +32,7 @@ export interface Order {
orderable_name: string,
orderable_ref?: string,
orderable_main_image_url?: string,
orderable_external_stock: number,
quantity: number,
quantity_min: number,
amount: number,

1
app/views/api/orders/_order.json.jbuilder
View File

@ -27,6 +27,7 @@ json.order_items_attributes order.order_items.order(created_at: :asc) do |item|
json.orderable_name item.orderable.name
json.orderable_ref item.orderable.sku
json.orderable_main_image_url item.orderable.main_image&.attachment_url
json.orderable_external_stock item.orderable.stock['external']
json.quantity item.quantity
json.quantity_min item.orderable.quantity_min
json.amount item.amount / 100.0