feat(freight): shop freight templates, server-side checkout fees, company dictionary (add-freight-templates)

apps/mall/pages/checkout/pay.vue

@@ -9,6 +9,8 @@ const { locale, t } = useI18n();
 const { currency } = usePrefs();
 const router = useRouter();
 const pendingOrderIds = useState<string[]>("checkout-orders", () => []);
+/** Carried to the success page so it can show each paid order's money. */
+const paidOrders = useState<Order[]>("checkout-paid-orders", () => []);
 // Shared with the store directory; orders carry only a shop id.
 const { data: shops } = await useAsyncData("shops", () => $api.listShops(), { default: () => [] });
 
@@ -68,6 +70,7 @@ async function confirmPayment(): Promise<void> {
   error.value = "";
   try {
     for (const order of orders.value) await $api.payOrder(order.id);
+    paidOrders.value = orders.value;
     pendingOrderIds.value = [];
     await router.push("/checkout/success");
   } catch {
@@ -125,6 +128,12 @@ onMounted(() => void loadOrders());
               /></strong>
             </div>
             <footer class="flex flex-wrap items-center justify-end gap-3 px-4 py-3 text-sm">
+              <span class="text-muted">{{ t("checkout.shippingFee") }}</span>
+              <span v-if="order.shipping_fee_minor > 0"
+                ><PriceText
+                  :amount-minor="order.shipping_fee_minor"
+                  :currency="order.currency" /></span
+              ><span v-else>{{ t("checkout.freeShipping") }}</span>
               <template v-if="order.discount_minor > 0"
                 ><span>{{ t("checkout.couponDiscount") }}</span
                 ><span class="text-danger"