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

Improved: order details page UI and behaviour. #334

Merged
merged 5 commits into from
Nov 3, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
4 changes: 3 additions & 1 deletion src/locales/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@
"Configuration updated": "Configuration updated",
"Confirm": "Confirm",
"Copied": "Copied { text }",
"Copied to clipboard": "Copied to clipboard",
"Copy": "Copy",
"Depending on the reason you select for not fulfulling an item, an inventory variance will be recorded and all sales channels will be updated with new inventory levels. For example, by selecting “Not in stock” HotWax Commerce will stop routing orders for it to your store and customers will not be able to place BOPIS orders for it at your store on Shopify.": "Depending on the reason you select for not fulfulling an item, an inventory variance will be recorded and all sales channels will be updated with new inventory levels.{ space } For example, by selecting “Not in stock” HotWax Commerce will stop routing orders for it to your store and customers will not be able to place BOPIS orders for it at your store on Shopify.",
"Delivery address": "Delivery address",
Expand Down Expand Up @@ -90,6 +91,7 @@
"Order details": "Order details",
"Order edit permissions": "Order edit permissions",
"Order is now ready to handover.": "Order is now ready to handover.",
"Order is now ready to be shipped.": "Order is now ready to be shipped.",
"Order is successfully handed over to customer.": "Order is successfully handed over to customer.",
"Order is successfully shipped.": "Order is successfully shipped.",
"Order has been rejected.": "Order has been rejected.",
Expand Down Expand Up @@ -125,7 +127,7 @@
"Reason": "Reason",
"Report an issue": "Report an issue",
"Resend customer email": "Resend customer email",
"Resend ready for pickup email": "Resend ready for pickup email",
"Resend email": "Resend email",
"Search": "Search",
"Search Orders": "Search Orders",
"Search time zones": "Search time zones",
Expand Down
4 changes: 3 additions & 1 deletion src/locales/es.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@
"Configuration updated": "Configuración actualizada",
"Confirm": "Confirmar",
"Copied": "Copiado { text }",
"Copied to clipboard": "Copied to clipboard",
"Copy": "Copiar",
"Depending on the reason you select for not fulfilling an item, an inventory variance will be recorded and all sales channels will be updated with new inventory levels. For example, by selecting “Not in stock” HotWax Commerce will stop routing orders for it to your store and customers will not be able to place BOPIS orders for it at your store on Shopify.": "Dependiendo de la razón que selecciones para no cumplir con un artículo, se registrará una variación de inventario y se actualizarán todos los canales de ventas con nuevos niveles de inventario. { space } Por ejemplo, al seleccionar “No disponible en el inventario” HotWax Commerce dejará de dirigir los pedidos para él a tu tienda y los clientes no podrán hacer pedidos BOPIS para él en tu tienda en Shopify.",
"Delivery address": "Dirección de entrega",
Expand Down Expand Up @@ -89,6 +90,7 @@
"Order details": "Detalles de la orden",
"Order edit permissions": "Permisos de edición de la orden",
"Order is now ready to handover.": "Order is now ready to handover.",
"Order is now ready to be shipped.": "Order is now ready to be shipped.",
"Order is successfully handed over to customer.": "Order is successfully handed over to customer.",
"Order is successfully shipped.": "Order is successfully shipped.",
"Order has been rejected.": "Order has been rejected.",
Expand Down Expand Up @@ -124,7 +126,7 @@
"Reason": "Razón",
"Report an issue": "Report an issue",
"Resend customer email": "Resend customer email",
"Resend ready for pickup email": "Reenviar correo electrónico de listo para recoger",
"Resend email": "Resend email",
"Search": "Buscar",
"Search Orders": "Buscar pedidos",
"Search time zones": "Buscar zonas horarias",
Expand Down
4 changes: 3 additions & 1 deletion src/locales/ja.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@
"Configuration updated": "設定の更新",
"Confirm": "決定",
"Copied": "コピーされた{ text }",
"Copied to clipboard": "Copied to clipboard",
"Copy": "コピー",
"Depending on the reason you select for not fulfulling an item, an inventory variance will be recorded and all sales channels will be updated with new inventory levels. For example, by selecting “Not in stock” HotWax Commerce will stop routing orders for it to your store and customers will not be able to place BOPIS orders for it at your store on Shopify.": "アイテムをフルフィルメントしないために選択した理由に応じて、在庫差異が記録され、すべての販売チャネルが新しい在庫レベルで更新されます。{ space } たとえば、[在庫なし] を選択すると、HotWax Commerce はストアへの注文のルーティングを停止し、顧客は 貴方の Shopify のストアで BOPIS 注文を行うことができなくなります。",
"Delivery address": "お届け先住所",
Expand Down Expand Up @@ -89,6 +90,7 @@
"Order details": "注文詳細",
"Order edit permissions": "注文の編集権限",
"Order is now ready to handover.": "Order is now ready to handover.",
"Order is now ready to be shipped.": "Order is now ready to be shipped.",
"Order is successfully handed over to customer.": "Order is successfully handed over to customer.",
"Order is successfully shipped.": "Order is successfully shipped.",
"Order has been rejected.": "Order has been rejected.",
Expand Down Expand Up @@ -124,7 +126,7 @@
"Reason": "理由",
"Report an issue": "Report an issue",
"Resend customer email": "Resend customer email",
"Resend ready for pickup email": "受取準備完了メールの再送",
"Resend email": "Resend email",
"Search": "検索",
"Search Orders": "注文の検索",
"Search time zones": "タイムゾーンの検索",
Expand Down
10 changes: 7 additions & 3 deletions src/store/modules/order/actions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -398,7 +398,7 @@
return resp;
},

async packDeliveryItems ({ commit }, shipmentId) {

Check warning on line 401 in src/store/modules/order/actions.ts

View workflow job for this annotation

GitHub Actions / call-workflow-in-another-repo / reusable_workflow_job (16.x)

'commit' is defined but never used
const params = {
shipmentId: shipmentId,
statusId: 'SHIPMENT_PACKED'
Expand Down Expand Up @@ -478,9 +478,13 @@
}
})
}
// Added ready to handover because we need to show the user that the order has moved to the packed tab (ready to handover)
await dispatch('updateCurrent', { order : { ...payload.order, readyToHandover: true } })

// Adding readyToHandover or readyToShip because we need to show the user that the order has moved to the packed tab
if(payload.order.part.shipmentMethodEnum.shipmentMethodEnumId === 'STOREPICKUP'){
payload.order = { ...payload.order, readyToHandover: true }
}else {
payload.order = { ...payload.order, readyToShip: true }
}
await dispatch('updateCurrent', { order : payload.order })
showToast(translate("Order packed and ready for delivery"))
} else {
showToast(translate("Something went wrong"))
Expand Down Expand Up @@ -510,7 +514,7 @@
}).catch(err => err);
},

async rejectOrderItems ({ commit }, order) {

Check warning on line 517 in src/store/modules/order/actions.ts

View workflow job for this annotation

GitHub Actions / call-workflow-in-another-repo / reusable_workflow_job (16.x)

'commit' is defined but never used
const payload = {
'orderId': order.orderId
}
Expand Down
8 changes: 6 additions & 2 deletions src/utils/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,17 @@ const showToast = async (message: string) => {
return toast.present();
}

const copyToClipboard = async (text: any) => {
const copyToClipboard = async (text: any, showCopiedValue = true) => {
const { Clipboard } = Plugins;

await Clipboard.write({
string: text,
}).then(() => {
showToast(translate("Copied", { text }));
if(showCopiedValue) {
showToast(translate("Copied", { text }));
} else {
showToast(translate("Copied to clipboard"));
}
});
}

Expand Down
14 changes: 12 additions & 2 deletions src/views/AssignPickerModal.vue
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@
</ion-button>
</ion-buttons>
<ion-title>{{ translate("Assign Pickers") }}</ion-title>
<ion-button fill="clear" slot="end" @click="readyForPickup()">{{ part.shipmentMethodEnum?.shipmentMethodEnumId === 'STOREPICKUP' ? translate("Ready for pickup") : translate("Ready to ship") }}</ion-button>
</ion-toolbar>
</ion-header>

Expand Down Expand Up @@ -38,13 +37,21 @@
/>
</ion-infinite-scroll>
</ion-content>

<ion-fab vertical="bottom" horizontal="end" slot="fixed">
<ion-fab-button @click="readyForPickup()">
<ion-icon :icon="saveOutline" />
</ion-fab-button>
</ion-fab>
</template>

<script>
import {
IonButtons,
IonButton,
IonContent,
IonFab,
IonFabButton,
IonHeader,
IonIcon,
IonItem,
Expand All @@ -60,7 +67,7 @@ import {
IonInfiniteScrollContent,
modalController } from "@ionic/vue";
import { defineComponent } from "vue";
import { closeOutline } from "ionicons/icons";
import { closeOutline, saveOutline } from "ionicons/icons";
import { useStore } from "vuex";
import { showToast } from "@/utils";
import { hasError } from '@/adapter'
Expand All @@ -73,6 +80,8 @@ export default defineComponent({
IonButtons,
IonButton,
IonContent,
IonFab,
IonFabButton,
IonHeader,
IonIcon,
IonItem,
Expand Down Expand Up @@ -191,6 +200,7 @@ export default defineComponent({

return {
closeOutline,
saveOutline,
store,
translate
};
Expand Down
25 changes: 15 additions & 10 deletions src/views/OrderDetail.vue
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
<ion-button :disabled="!order?.orderId" @click="openOrderItemRejHistoryModal()">
<ion-icon slot="icon-only" :icon="timeOutline" />
</ion-button>
<ion-button v-if="orderType === 'open'" class="ion-hide-md-up" :disabled="!order?.orderId || !hasPermission(Actions.APP_ORDER_UPDATE) || order.readyToHandover || order.rejected" @click="rejectOrder()">
<ion-button v-if="orderType === 'open'" class="ion-hide-md-up" :disabled="!order?.orderId || !hasPermission(Actions.APP_ORDER_UPDATE) || order.readyToHandover || order.readyToShip || order.rejected" @click="rejectOrder()">
<ion-icon slot="icon-only" color="danger" :icon="bagRemoveOutline" />
</ion-button>
<ion-button v-else-if="orderType === 'packed' && showPackingSlip" :class="order.part?.shipmentMethodEnum?.shipmentMethodEnumId !== 'STOREPICKUP' ? 'ion-hide-md-up' : ''" :disabled="!order?.orderId || !hasPermission(Actions.APP_ORDER_UPDATE) || order.handovered || order.shipped" @click="order.part?.shipmentMethodEnum?.shipmentMethodEnumId === 'STOREPICKUP' ? printPackingSlip(order) : printShippingLabelAndPackingSlip(order)">
Expand All @@ -28,10 +28,15 @@
</div>
<main v-else>
<aside>
<ion-item v-if="order.readyToHandover || order.rejected" color="light" lines="none">
<ion-icon :icon="order.readyToHandover ? checkmarkCircleOutline : closeCircleOutline" :color="order.readyToHandover ? 'success' : 'danger'" slot="start" />
<ion-label class="ion-text-wrap">{{ order.readyToHandover ? translate("Order is now ready to handover.") : translate("Order has been rejected.") }}</ion-label>
<ion-item v-if="order.readyToHandover || order.readyToShip" color="light" lines="none">
<ion-icon :icon="checkmarkCircleOutline" color="success" slot="start" />
<ion-label class="ion-text-wrap">{{ order.readyToHandover ? translate("Order is now ready to handover.") : translate("Order is now ready to be shipped.") }}</ion-label>
</ion-item>
<ion-item v-else-if="order.rejected" color="light" lines="none">
<ion-icon :icon="closeCircleOutline" color="danger" slot="start" />
<ion-label class="ion-text-wrap">{{ translate("Order has been rejected.") }}</ion-label>
</ion-item>

<ion-item v-if="order.handovered || order.shipped" color="light" lines="none">
<ion-icon :icon="checkmarkCircleOutline" color="success" slot="start" />
<ion-label class="ion-text-wrap">{{ order.handovered ? translate("Order is successfully handed over to customer.") : translate("Order is successfully shipped.") }}</ion-label>
Expand All @@ -56,7 +61,7 @@
<ion-item v-if="customerEmail" lines="none">
<ion-icon :icon="mailOutline" slot="start" />
<ion-label>{{ customerEmail }}</ion-label>
<ion-button fill="clear" @click="copyToClipboard(customerEmail)">
<ion-button fill="clear" @click="copyToClipboard(customerEmail, false)">
<ion-icon color="medium" :icon="copyOutline"/>
</ion-button>
</ion-item>
Expand All @@ -73,10 +78,10 @@
</ion-item>
<div v-if="orderType === 'open'" class="ion-margin-top ion-hide-md-down">
<!-- TODO: implement functionality to change shipping address -->
<ion-button :disabled="!hasPermission(Actions.APP_ORDER_UPDATE) || order.readyToHandover || order.rejected" expand="block" @click="readyForPickup(order, order.part)">
<ion-button :disabled="!hasPermission(Actions.APP_ORDER_UPDATE) || order.readyToHandover || order.readyToShip || order.rejected" expand="block" @click="readyForPickup(order, order.part)">
{{ order?.part?.shipmentMethodEnum?.shipmentMethodEnumId === 'STOREPICKUP' ? translate("Ready for pickup") : translate("Ready to ship") }}
</ion-button>
<ion-button :disabled="!hasPermission(Actions.APP_ORDER_UPDATE) || order.readyToHandover || order.rejected" expand="block" color="danger" fill="outline" @click="rejectOrder()">
<ion-button :disabled="!hasPermission(Actions.APP_ORDER_UPDATE) || order.readyToHandover || order.readyToShip || order.rejected" expand="block" color="danger" fill="outline" @click="rejectOrder()">
{{ translate("Reject Order") }}
</ion-button>
</div>
Expand All @@ -95,7 +100,7 @@
<ProductListItem :item="item" />
<!-- Checking for true as a string as the settingValue contains a string and not boolean-->
<div v-if="orderType === 'open' && partialOrderRejectionConfig?.settingValue == 'true'" class="border-top">
<ion-button :disabled="order?.readyToHandover || order?.rejected" fill="clear" @click="openReportAnIssueModal(item)">
<ion-button :disabled="order?.readyToHandover || order.readyToShip || order?.rejected" fill="clear" @click="openReportAnIssueModal(item)">
{{ translate("Report an issue") }}
</ion-button>
</div>
Expand All @@ -105,7 +110,7 @@
</main>

<ion-fab v-if="orderType === 'open' && order?.orderId" class="ion-hide-md-up" vertical="bottom" horizontal="end" slot="fixed" @click="readyForPickup(order, order.part)">
<ion-fab-button :disabled="!hasPermission(Actions.APP_ORDER_UPDATE) || order.readyToHandover || order.rejected">
<ion-fab-button :disabled="!hasPermission(Actions.APP_ORDER_UPDATE) || order.readyToHandover || order.readyToShip || order.rejected">
<ion-icon :icon="order.part?.shipmentMethodEnum?.shipmentMethodEnumId === 'STOREPICKUP' ? bagHandleOutline : giftOutline" />
</ion-fab-button>
</ion-fab>
Expand Down Expand Up @@ -327,7 +332,7 @@ export default defineComponent({
}
},
async sendReadyForPickupEmail(order: any) {
const header = translate('Resend ready for pickup email')
const header = translate('Resend email')
const message = translate('An email notification will be sent to that their order is ready for pickup.', { customerName: order.customer.name });

const alert = await alertController
Expand Down
2 changes: 1 addition & 1 deletion src/views/Orders.vue
Original file line number Diff line number Diff line change
Expand Up @@ -417,7 +417,7 @@ export default defineComponent({
})
},
async sendReadyForPickupEmail(order: any) {
const header = translate('Resend ready for pickup email')
const header = translate('Resend email')
const message = translate('An email notification will be sent to that their order is ready for pickup.', { customerName: order.customer.name });

const alert = await alertController
Expand Down
2 changes: 1 addition & 1 deletion src/views/ShipToStoreOrders.vue
Original file line number Diff line number Diff line change
Expand Up @@ -357,7 +357,7 @@ export default defineComponent({
},

async sendReadyForPickupEmail(order: any) {
const header = translate('Resend ready for pickup email')
const header = translate('Resend email')
const message = translate('An email notification will be sent to that their order is ready for pickup.', { customerName: `${order.firstName} ${order.lastName}` })

const alert = await alertController
Expand Down
Loading