Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implemented: Functional UI to Display Inventory Computation for Order Items(#386) #392

Merged
merged 38 commits into from
May 24, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
38 commits
Select commit Hold shift + click to select a range
02f00ed
Updated: added searchbar functionality on the otherInventoryModal(#386)
R-Sourabh May 10, 2024
bcc09ee
Implemented: API for fetcting the minimumStock & lastInventoryCount(#…
R-Sourabh May 13, 2024
b2f2a07
Implemneted: Functional UI to Display Inventory Computation for Order…
R-Sourabh May 15, 2024
d1262c0
Merge remote-tracking branch 'upstream/main' into #386
R-Sourabh May 17, 2024
2f5f4d9
Update ProductDetail.vue
R-Sourabh May 17, 2024
e46378c
Updated: added check Order section on product details page(#386)
R-Sourabh May 17, 2024
e1e829c
Improved: changed indentations, nomenclature, locales, and code refac…
R-Sourabh May 20, 2024
e04bf31
Updated: the prop struture as the api is failing when popover opens(…
R-Sourabh May 20, 2024
564c59f
Updated: the alphabetical order of ion imports(#386)
R-Sourabh May 20, 2024
adc1639
Improved: the fetching logic of various inventory information(#386)
R-Sourabh May 20, 2024
62661cf
Updated: remove the optionals, update logic of Inventory Information …
R-Sourabh May 21, 2024
13c2edf
Update mutations.ts
R-Sourabh May 21, 2024
cad494f
Updated: usage of productId from currentVarient object(#386)
R-Sourabh May 21, 2024
8806923
Updated: the response logic for reservedQuantity(#386)
R-Sourabh May 21, 2024
66682cf
Update actions.ts
R-Sourabh May 21, 2024
5af5532
Updated: the position of loader in order/action(#386)
R-Sourabh May 21, 2024
3549586
Updated: removed the 'in progress' orders and update 'open' order che…
R-Sourabh May 21, 2024
a4f32c4
Updated: update static words & locale, added checks in stock actions(…
R-Sourabh May 21, 2024
b8ca631
Updated: remove the static color and size tag(#386)
R-Sourabh May 21, 2024
e615e5f
Updated: the api call in ProductListItem(#386)
R-Sourabh May 21, 2024
17e10a6
Improved: the logic for fetching the order and order items(#386)
R-Sourabh May 22, 2024
21cd134
Update actions.ts
R-Sourabh May 22, 2024
789ef84
Updated: change the service name and popover function(#386)
R-Sourabh May 22, 2024
042b566
Updated: added import, locales and change the productListItem logic(#…
R-Sourabh May 22, 2024
ea7c21a
Update ProductListItem.vue
R-Sourabh May 22, 2024
aa13a1f
Updated: added image src for other items in orders(#386)
R-Sourabh May 22, 2024
395aeb1
Updated: change fetching logic of brandName & virtualName(#386)
R-Sourabh May 22, 2024
b8352f6
Updated: optimise the logic of fetching productIds of orders(#386)
R-Sourabh May 23, 2024
f6cfa63
Updated: Added check on fulfillmentStatus while fetching orders & res…
R-Sourabh May 23, 2024
c54bcc6
Removed: order.ts file which previously returning order status(#386)
R-Sourabh May 23, 2024
a9817ad
Improved: action for fetching order and otherItems .Order card now co…
R-Sourabh May 23, 2024
7666910
Updated: added static ATP at OtherStoreInventory modal, change orders…
R-Sourabh May 23, 2024
3a2c3f6
Improved: the fetchOrderItems action of order(#386)
R-Sourabh May 23, 2024
8640777
Updated: catalog page products productIdentifier(#586)
R-Sourabh May 23, 2024
f6988af
Updated: remove the backdrop of inventoryInformation popover(#386)
R-Sourabh May 24, 2024
c207736
Updated: added locale, remove unwanted code, added some text(#386)
R-Sourabh May 24, 2024
79a6901
Updated: replace ATP count with QOH on ProductListItem(#386)
R-Sourabh May 24, 2024
157d75b
Updated: added slot property on ProductListItem's div(#386)
R-Sourabh May 24, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
61 changes: 30 additions & 31 deletions src/components/InventoryDetailsPopover.vue
Original file line number Diff line number Diff line change
Expand Up @@ -3,20 +3,20 @@
<ion-list>
<ion-list-header>{{ translate("Inventory computation")}}</ion-list-header>
<ion-item>
<ion-label class="ion-text-wrap">{{ translate("Quantity on hands")}}</ion-label>
<ion-note slot="end">52</ion-note>
<ion-label class="ion-text-wrap">{{ translate("Quantity on hand")}}</ion-label>
R-Sourabh marked this conversation as resolved.
Show resolved Hide resolved
<ion-note slot="end">{{ getProductStock(item.productId).quantityOnHandTotal ?? '0' }}</ion-note>
</ion-item>
<ion-item>
<ion-label class="ion-text-wrap">{{ translate("Safety stock")}}</ion-label>
<ion-note slot="end">4</ion-note>
<ion-note slot="end">{{ getInventoryInformation(item.productId).minimumStock ?? '0' }}</ion-note>
</ion-item>
<ion-item>
<ion-label class="ion-text-wrap">{{ translate("Order reservations")}}</ion-label>
<ion-note slot="end">1</ion-note>
<ion-note slot="end">{{ getInventoryInformation(item.productId).reservedQuantity ?? '0' }}</ion-note>
</ion-item>
<ion-item lines="none">
<ion-label class="ion-text-wrap">{{ translate("Online ATP")}}</ion-label>
<ion-badge slot="end" color="success">52</ion-badge>
<ion-badge slot="end" color="success">{{ getInventoryInformation(item.productId).onlineAtp ?? '0' }}</ion-badge>
</ion-item>
</ion-list>
</ion-content>
Expand All @@ -25,56 +25,55 @@
<script lang="ts">
import {
IonBadge,
IonButtons,
IonContent,
IonHeader,
IonItem,
IonLabel,
IonList,
IonNote,
IonTitle,
IonToolbar
IonListHeader,
IonNote
} from '@ionic/vue'

import { defineComponent } from 'vue';
import { useStore } from 'vuex';
import { useStore, mapGetters } from 'vuex';
import { translate } from '@hotwax/dxp-components';

export default defineComponent({
export default defineComponent({
name: 'InventoryDetailsPopover',
component:{
components:{
IonBadge,
IonButtons,
IonContent,
IonHeader,
IonItem,
IonLabel,
IonList,
IonListHeader,
IonNote,
IonTitle,
IonToolbar
},
props: {
},
data () {
return {

}
},
props: ['item'],
computed: {

...mapGetters({
product: "product/getCurrent",
getProductStock: 'stock/getProductStock',
getInventoryInformation: 'stock/getInventoryInformation',
currentFacility: 'user/getCurrentFacility',
})
},
async beforeMount () {
const productId = this.item?.productId;
await this.store.dispatch('stock/fetchInventoryCount', { productId });
this.fetchReservedQuantity( this.item.productId );
},
methods: {

async fetchReservedQuantity(productId: any){
R-Sourabh marked this conversation as resolved.
Show resolved Hide resolved
await this.store.dispatch('stock/fetchReservedQuantity', { productId });
},
},

setup () {
const store = useStore();
return {
store,
translate
};


store,
translate
}
}
})
</script>
42 changes: 17 additions & 25 deletions src/components/ProductListItem.vue
Original file line number Diff line number Diff line change
Expand Up @@ -6,22 +6,20 @@
<ion-label class="ion-text-wrap">
<h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) }}</h2>
<p class="ion-text-wrap">{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId)) }}</p>
<p>Color: color</p>
<p>Size: size</p>
</ion-label>
<!-- Only show stock if its not a ship to store order -->
<div v-if="!isShipToStoreOrder">
<ion-button v-if="!isFetchingStock && !showInfoIcon" fill="clear" @click.stop="fetchProductStock(item.productId)">
<ion-icon color="medium" slot="icon-only" :icon="cubeOutline" />
</ion-button>
<div v-else-if="showInfoIcon" class="atp-info">
<ion-note slot="end"> 50 ATP </ion-note>
<ion-button fill="clear" @click.stop="getInventoryComputationDetails($event)">
<div slot="end" v-if="!isShipToStoreOrder">
<ion-spinner v-if="isFetchingStock" color="medium" name="crescent" />
<div v-else-if="getProductStock(item.productId).quantityOnHandTotal >= 0" class="atp-info">
<ion-note slot="end"> {{ translate("on hand", { count: getProductStock(item.productId).quantityOnHandTotal ?? '0' }) }} </ion-note>
<ion-button fill="clear" @click.stop="openInventoryDetailPopover($event)">
<ion-icon slot="icon-only" :icon="informationCircleOutline" color="medium" />
</ion-button>
</div>
<ion-spinner v-else color="medium" name="crescent" />
</div>
<ion-button v-else fill="clear" @click.stop="fetchProductStock(item.productId)">
<ion-icon color="medium" slot="icon-only" :icon="cubeOutline" />
</ion-button>
</div>
</ion-item>
</template>

Expand Down Expand Up @@ -49,37 +47,31 @@ export default defineComponent({
return {
goodIdentificationTypeId: process.env.VUE_APP_PRDT_IDENT_TYPE_ID,
isFetchingStock: false,
showInfoIcon: false
}
},
props: {
item: Object,
isShipToStoreOrder: {
type: Boolean,
default: false
}
},
props: ['item', 'isShipToStoreOrder'],
computed: {
...mapGetters({
getProduct: 'product/getProduct',
getProductStock: 'stock/getProductStock'
product: "product/getCurrent",
getProductStock: 'stock/getProductStock',
currentFacility: 'user/getCurrentFacility',
})
},
methods: {
async fetchProductStock(productId: string) {
this.isFetchingStock = true
await this.store.dispatch('stock/fetchStock', { productId })
await this.store.dispatch('stock/fetchStock', { productId });
this.isFetchingStock = false
this.showInfoIcon = true;
},
async getInventoryComputationDetails(Event: any){
async openInventoryDetailPopover(Event: any){
const popover = await popoverController.create({
component: InventoryDetailsPopover,
event: Event,
// componentProps: { otherStoresInventory: this.otherStoresInventoryDetails }
showBackdrop: false,
componentProps: { item: this.item }
});
await popover.present();

},
updateColor(stock: number) {
return stock ? stock < 10 ? 'warning' : 'success' : 'danger';
Expand Down
9 changes: 7 additions & 2 deletions src/locales/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
"Are you sure you want to change the time zone to?": "Are you sure you want to change the time zone to?",
"Are you sure you want to update the notification preferences?": "Are you sure you want to update the notification preferences?",
"Arrived": "Arrived",
"ATP": "{ count } ATP",
"Available to promise": "Available to promise",
"Authenticating": "Authenticating",
"Assign Pickers": "Assign Pickers",
Expand Down Expand Up @@ -93,6 +94,7 @@
"On rejecting this item, will be sent an email with alternate fulfillment options and this order item will be removed from your dashboard.": "On rejecting this item, { customerName } will be sent an email with alternate fulfillment options and this order item will be removed from your dashboard.",
"On rejecting this order, will be sent an email with alternate fulfilment options and this order will be removed from your dashboard.": "On rejecting this order, { customerName } will be sent an email with alternate fulfilment options and this order will be removed from your dashboard.",
"Online ATP": "Online ATP",
"on hand": "{ count } on hand",
"Other stores inventory": "Other stores inventory",
"Order": "Order",
"Order delivered to": "Order delivered to { customerName }",
Expand All @@ -113,8 +115,9 @@
"Orders Not Found": "Orders Not Found",
"Order item rejection history": "Order item rejection history",
"Order reservations": "Order reservations",
"order reservtions at the store": "{ count } order reservtions at the store",
"order reservations at": "{ count } order reservations at { store }",
"Other stores": "Other stores",
"Other items": "Other items",
"Packed": "Packed",
"Packing Slip": "Packing Slip",
"Packing slips help customer reconcile their order against the delivered items.": "Packing slips help customer reconcile their order against the delivered items.",
Expand All @@ -128,7 +131,7 @@
"Product details": "Product details",
"Product not found": "Product not found",
"Products not found": "Products not found",
"Quantity on hands": "Quantity on hands",
"Quantity on hand": "Quantity on hand",
"Re-route Fulfillment": "Re-route Fulfillment",
"Ready for pickup": "Ready for pickup",
"Ready to create an app?": "Ready to create an app?",
Expand Down Expand Up @@ -197,6 +200,8 @@
"Worn Display": "Worn Display",
"This order will be removed from your dashboard. This action cannot be undone.": "This order will be removed from your dashboard.{ space } This action cannot be undone.",
"Update notification preferences": "Update notification preferences",
"units": "{ item } units",
"unit": "{ item } unit",
"View shipping orders along with pickup orders.": "View shipping orders along with pickup orders.",
"You do not have permission to access this page": "You do not have permission to access this page",
"Zipcode": "Zipcode"
Expand Down
9 changes: 7 additions & 2 deletions src/locales/es.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
"Are you sure you want to change the time zone to?": "¿Estás seguro de que quieres cambiar la zona horaria a?",
"Are you sure you want to update the notification preferences?": "¿Estás seguro de que deseas actualizar las preferencias de notificación?",
"Arrived": "Llegó",
"ATP": "{ count } ATP",
"Available to promise": "Available to promise",
"Authenticating": "Autenticación",
"Assign Pickers": "Asignar recolectores",
Expand Down Expand Up @@ -90,6 +91,7 @@
"On rejecting this item, will be sent an email with alternate fulfillment options and this order item will be removed from your dashboard.": "Al rechazar este artículo, se enviará a {customerName} un correo electrónico con opciones de cumplimiento alternativas y este artículo del pedido se eliminará de su panel de control.",
"On rejecting this order, will be sent an email with alternate fulfilment options and this order will be removed from your dashboard.": "Al rechazar este pedido, {customerName} recibirá un correo electrónico con opciones de cumplimiento alternativas y este pedido se eliminará de su panel.",
"Online ATP": "Online ATP",
"on hand": "{ count } on hand",
"Other stores inventory": "Inventario de otras tiendas",
"Order": "Orden",
"Order delivered to": "Orden entregada a {customerName}",
Expand All @@ -110,8 +112,9 @@
"Orders Not Found": "Órdenes no encontradas",
"Order item rejection history": "Historial de rechazo de artículos de pedido",
"Order reservations": "Order reservations",
"order reservtions at the store": "{ count } order reservtions at the store",
"order reservations at": "{ count } order reservations at { store }",
"Other stores": "Otras tiendas",
"Other items": "Other items",
"Packed": "Empacado",
"Packing Slip": "Remisión de embalaje",
"Packing slips help customer reconcile their order against the delivered items.": "Las remisiones de embalaje ayudan al cliente a conciliar su orden con los artículos entregados.",
Expand All @@ -125,7 +128,7 @@
"Product details": "Detalles del producto",
"Product not found": "Producto no encontrado",
"Products not found": "Productos no encontrados",
"Quantity on hands": "Quantity on hands",
"Quantity on hand": "Quantity on hand",
"Re-route Fulfillment": "Redireccionar cumplimiento",
"Ready for pickup": "Listo para recoger",
"Ready to create an app?": "¿Listo para crear una aplicación?",
Expand Down Expand Up @@ -195,6 +198,8 @@
"Worn Display": "Pantalla desgastada",
"This order will be removed from your dashboard. This action cannot be undone.": "Este pedido será eliminado de tu panel de control.{ space } Esta acción no se puede deshacer.",
"Update notification preferences": "Actualizar preferencias de notificación",
"units": "{ item } units",
"unit": "{ item } unit",
"View shipping orders along with pickup orders.": "Ver órdenes de envío junto con órdenes de recogida.",
"You do not have permission to access this page": "No tienes permiso para acceder a esta página",
"Zipcode": "Código postal",
Expand Down
9 changes: 7 additions & 2 deletions src/locales/ja.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
"Are you sure you want to change the time zone to?": "タイムゾーンを変更してもよろしいですか?",
"Are you sure you want to update the notification preferences?": "Are you sure you want to update the notification preferences?",
"Arrived": "到着",
"ATP": "{ count } ATP",
"Available to promise": "Available to promise",
"Authenticating": "Authenticating",
"Assign Pickers": "受け取り人の割当",
Expand Down Expand Up @@ -90,6 +91,7 @@
"On rejecting this item, will be sent an email with alternate fulfillment options and this order item will be removed from your dashboard.": "On rejecting this item, { customerName } will be sent an email with alternate fulfillment options and this order item will be removed from your dashboard.",
"On rejecting this order, will be sent an email with alternate fulfilment options and this order will be removed from your dashboard.": "On rejecting this order, { customerName } will be sent an email with alternate fulfilment options and this order will be removed from your dashboard.",
"Online ATP": "Online ATP",
"on hand": "{ count } on hand",
"Other stores inventory": "その他店舗在庫",
"Order": "注文",
"Order delivered to": "注文は { customerName }様 に配達されました",
Expand All @@ -110,8 +112,9 @@
"Orders Not Found": "注文が見つかりません",
"Order item rejection history": "Order item rejection history",
"Order reservations": "Order reservations",
"order reservtions at the store": "{ count } order reservtions at the store",
"order reservations at": "{ count } order reservations at { store }",
"Other stores": "Other stores",
"Other items": "Other items",
"Packed": "梱包済み",
"Packing Slip": "納品書",
"Packing slips help customer reconcile their order against the delivered items.": "内容明細票はお客様が注文と配送された商品を確認(照合)する際に役立ちます。",
Expand All @@ -125,7 +128,7 @@
"Product details": "商品詳細",
"Product not found": "商品が見つかりません",
"Products not found": "商品が見つかりません",
"Quantity on hands": "Quantity on hands",
"Quantity on hand": "Quantity on hand",
"Re-route Fulfillment": "リルート(受取方法や受取場所の変更)",
"Ready for pickup": "ピックアップの準備ができました",
"Ready to create an app?": "アプリを作成する準備はできましたか?",
Expand Down Expand Up @@ -194,6 +197,8 @@
"Worn Display": "すり切れたディスプレイ",
"This order will be removed from your dashboard. This action cannot be undone.": "この注文はダッシュボードから削除されます。{ space } この操作は元に戻せません。",
"Update notification preferences": "Update notification preferences",
"units": "{ item } units",
"unit": "{ item } unit",
"View shipping orders along with pickup orders.": "店舗受取の注文と一緒に配送注文を表示します",
"You do not have permission to access this page": "このページにアクセスする権限がありません",
"Zipcode": "郵便番号"
Expand Down
9 changes: 9 additions & 0 deletions src/services/OrderService.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,14 @@ const getOpenOrders = async (payload: any): Promise <any> => {
});
}

const fetchOrderItems = async (payload: any): Promise <any> => {
return api({
url: "solr-query",
method: "post",
data: payload
});
}

const getOrderDetails = async (payload: any): Promise <any> => {
return api({
url: "solr-query",
Expand Down Expand Up @@ -259,6 +267,7 @@ const getShippingPhoneNumber = async (orderId: string): Promise<any> => {
}

export const OrderService = {
fetchOrderItems,
fetchOrderPaymentPreferences,
getOpenOrders,
getOrderDetails,
Expand Down
11 changes: 10 additions & 1 deletion src/services/StockService.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,16 @@ const getInventoryAvailableByFacility = async (query: any): Promise <any> => {
});
}

const fetchInventoryCount = async (payload: any ): Promise<any> => {
return api({
url: 'performFind',
method: 'post',
data: payload
});
}

export const StockService = {
checkInventory,
getInventoryAvailableByFacility
getInventoryAvailableByFacility,
fetchInventoryCount
}
11 changes: 10 additions & 1 deletion src/services/UtilService.ts
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,18 @@ const resetPicker = async (payload: any): Promise<any> => {
})
}

const fetchReservedQuantity = async (query: any): Promise <any> => {
return api({
url: "solr-query",
method: "post",
data: query
});
}

export const UtilService = {
fetchPaymentMethodTypeDesc,
fetchRejectReasons,
fetchStatusDesc,
resetPicker
resetPicker,
fetchReservedQuantity
}
3 changes: 2 additions & 1 deletion src/store/modules/order/OrderState.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,5 +4,6 @@ export default interface OrderState {
current: any;
packed: any;
completed: any;
shipToStore: any
shipToStore: any;
orders: any;
}
Loading
Loading