@myparcel-dev/pdk-admin-js 1.13.0

package/dist/ShipmentTableBox-BJ8Qq7Gf.js

@@ -0,0 +1,258 @@
+import { r as ref, c as computed, w as watch, d as defineComponent, k as toRefs, h as useAdminConfig, l as useLocalizedFormatter, n as useQueryStore, p as useShipmentData, q as useVModel, F as Format, s as resolveComponent, o as openBlock, a as createBlock, v as withCtx, x as createVNode, b as unref, y as isRef, z as _sfc_main$3, B as _sfc_main$4, C as createBaseVNode, D as toDisplayString, E as normalizeClass, G as useOrderData, t as toValue, H as useLanguage, I as _sfc_main$5, J as createTextVNode, K as createElementBlock, L as Fragment, M as renderList, O as instantiateActions, P as toRaw, Q as shipmentActions, R as AdminIcon, e as createCommentVNode, S as isDef } from "./index-Btt7GCnO.js";
+const useBulkSelectCheckbox = (options, emit) => {
+  const selected = ref({});
+  const bulkModel = computed({
+    get() {
+      return selected.value;
+    },
+    set(values) {
+      selected.value = values;
+    }
+  });
+  watch(
+    bulkModel,
+    (value) => {
+      emit("select", value);
+    },
+    { deep: true }
+  );
+  return {
+    bulkModel,
+    bulkOptions: options
+  };
+};
+const createClasses = (param) => {
+  return param.reduce((acc, { key, value }) => {
+    if (key && value) {
+      acc[key] = value;
+    }
+    return acc;
+  }, {});
+};
+const _hoisted_1 = ["title", "textContent"];
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  __name: "OrderShipmentsTableRow",
+  props: {
+    shipmentId: {},
+    modelValue: { type: Boolean }
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const { shipmentId } = toRefs(props);
+    const emit = __emit;
+    const config = useAdminConfig();
+    const formatter = useLocalizedFormatter();
+    const queryStore = useQueryStore();
+    queryStore.registerShipmentQueries(shipmentId);
+    const { loading, actions, shipment } = useShipmentData(shipmentId);
+    const selected = useVModel(props, void 0, emit);
+    const checkboxElement = {
+      id: `shipment_${shipmentId.value}`,
+      ref: selected,
+      form: {
+        name: `shipment-${shipmentId.value}`
+      }
+    };
+    const shipmentUpdatedAt = computed(() => {
+      return shipment.value.updated ? formatter.format(Format.DateRelative, shipment.value.updated) : "–";
+    });
+    const classes = computed(() => {
+      var _a;
+      return createClasses([
+        {
+          key: (_a = config == null ? void 0 : config.cssUtilities) == null ? void 0 : _a.animationLoading,
+          value: loading.value
+        }
+      ]);
+    });
+    return (_ctx, _cache) => {
+      const _component_PdkCheckboxInput = resolveComponent("PdkCheckboxInput");
+      const _component_PdkTableCol = resolveComponent("PdkTableCol");
+      const _component_PdkDropdownButton = resolveComponent("PdkDropdownButton");
+      const _component_PdkTableRow = resolveComponent("PdkTableRow");
+      return openBlock(), createBlock(_component_PdkTableRow, {
+        class: normalizeClass(classes.value)
+      }, {
+        default: withCtx(() => [
+          createVNode(_component_PdkTableCol, null, {
+            default: withCtx(() => [
+              createVNode(_component_PdkCheckboxInput, {
+                modelValue: unref(selected),
+                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(selected) ? selected.value = $event : null),
+                element: checkboxElement,
+                value: unref(shipmentId)
+              }, null, 8, ["modelValue", "value"])
+            ]),
+            _: 1
+          }),
+          createVNode(_component_PdkTableCol, null, {
+            default: withCtx(() => [
+              createVNode(unref(_sfc_main$3), { "shipment-id": unref(shipmentId) }, null, 8, ["shipment-id"])
+            ]),
+            _: 1
+          }),
+          createVNode(_component_PdkTableCol, null, {
+            default: withCtx(() => [
+              createVNode(unref(_sfc_main$4), { "shipment-id": unref(shipmentId) }, null, 8, ["shipment-id"])
+            ]),
+            _: 1
+          }),
+          createVNode(_component_PdkTableCol, null, {
+            default: withCtx(() => {
+              var _a;
+              return [
+                createBaseVNode("span", {
+                  title: (_a = unref(shipment).updated) == null ? void 0 : _a.date,
+                  textContent: toDisplayString(shipmentUpdatedAt.value)
+                }, null, 8, _hoisted_1)
+              ];
+            }),
+            _: 1
+          }),
+          createVNode(_component_PdkTableCol, { align: "right" }, {
+            default: withCtx(() => [
+              createVNode(_component_PdkDropdownButton, { actions: unref(actions) }, null, 8, ["actions"])
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      }, 8, ["class"]);
+    };
+  }
+});
+const translationPrefix = "order_labels_column_";
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "OrderShipmentsTable",
+  emits: ["select"],
+  setup(__props, { emit: __emit }) {
+    var _a, _b;
+    const emit = __emit;
+    const { query } = useOrderData();
+    const data = computed(() => toValue(query.data));
+    const { bulkModel, bulkOptions } = useBulkSelectCheckbox(((_b = (_a = query.data.value) == null ? void 0 : _a.shipments) == null ? void 0 : _b.map(({ id }) => id)) ?? [], emit);
+    const { translate } = useLanguage();
+    return (_ctx, _cache) => {
+      const _component_PdkTableCol = resolveComponent("PdkTableCol");
+      const _component_PdkTableRow = resolveComponent("PdkTableRow");
+      const _component_PdkTable = resolveComponent("PdkTable");
+      return openBlock(), createBlock(_component_PdkTable, { class: "mb-0" }, {
+        header: withCtx(() => [
+          createVNode(_component_PdkTableRow, null, {
+            default: withCtx(() => [
+              createVNode(_component_PdkTableCol, { component: "th" }, {
+                default: withCtx(() => [
+                  createVNode(unref(_sfc_main$5), {
+                    modelValue: unref(bulkModel),
+                    "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(bulkModel) ? bulkModel.value = $event : null),
+                    options: unref(bulkOptions)
+                  }, null, 8, ["modelValue", "options"])
+                ]),
+                _: 1
+              }),
+              createVNode(_component_PdkTableCol, { component: "th" }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(unref(translate)(`${translationPrefix}track_trace`)), 1)
+                ]),
+                _: 1
+              }),
+              createVNode(_component_PdkTableCol, { component: "th" }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(unref(translate)(`${translationPrefix}status`)), 1)
+                ]),
+                _: 1
+              }),
+              createVNode(_component_PdkTableCol, { component: "th" }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(unref(translate)(`${translationPrefix}last_update`)), 1)
+                ]),
+                _: 1
+              }),
+              createVNode(_component_PdkTableCol, {
+                align: "right",
+                component: "th"
+              }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(unref(translate)(`${translationPrefix}actions`)), 1)
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          })
+        ]),
+        default: withCtx(() => {
+          var _a2;
+          return [
+            (openBlock(true), createElementBlock(Fragment, null, renderList((_a2 = data.value) == null ? void 0 : _a2.shipments, (shipment) => {
+              return openBlock(), createBlock(_sfc_main$2, {
+                key: `row_${shipment.id}_${shipment.updated}`,
+                modelValue: unref(bulkModel)[shipment.id],
+                "onUpdate:modelValue": ($event) => unref(bulkModel)[shipment.id] = $event,
+                "shipment-id": shipment.id
+              }, null, 8, ["modelValue", "onUpdate:modelValue", "shipment-id"]);
+            }), 128))
+          ];
+        }),
+        _: 1
+      });
+    };
+  }
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ShipmentTableBox",
+  setup(__props) {
+    const { order } = useOrderData();
+    const selectedLabels = ref([]);
+    const bulkActions = computed(() => {
+      var _a;
+      return instantiateActions(shipmentActions, {
+        orderIds: (_a = toValue(order)) == null ? void 0 : _a.externalIdentifier,
+        shipmentIds: toRaw(selectedLabels.value)
+      });
+    });
+    const setSelectedLabels = (labels) => {
+      selectedLabels.value = Object.keys(labels).filter((id) => isDef(labels[id]));
+    };
+    const { translate } = useLanguage();
+    return (_ctx, _cache) => {
+      const _component_PdkIcon = resolveComponent("PdkIcon");
+      const _component_PdkBadge = resolveComponent("PdkBadge");
+      const _component_PdkDropdownButton = resolveComponent("PdkDropdownButton");
+      const _component_PdkBox = resolveComponent("PdkBox");
+      return openBlock(), createBlock(_component_PdkBox, null, {
+        header: withCtx(() => [
+          createVNode(_component_PdkIcon, {
+            icon: unref(AdminIcon).Shipment
+          }, null, 8, ["icon"]),
+          createTextVNode(" " + toDisplayString(unref(translate)("order_labels_header")), 1)
+        ]),
+        default: withCtx(() => [
+          createVNode(_sfc_main$1, { onSelect: setSelectedLabels })
+        ]),
+        footer: withCtx(() => [
+          createVNode(_component_PdkDropdownButton, {
+            actions: bulkActions.value,
+            disabled: !selectedLabels.value.length
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(unref(translate)("bulk_actions")) + " ", 1),
+              selectedLabels.value.length ? (openBlock(), createBlock(_component_PdkBadge, { key: 0 }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(selectedLabels.value.length), 1)
+                ]),
+                _: 1
+              })) : createCommentVNode("", true)
+            ]),
+            _: 1
+          }, 8, ["actions", "disabled"])
+        ]),
+        _: 1
+      });
+    };
+  }
+});
+export {
+  _sfc_main as default
+};