@pisell/private-materials 3.4.81 → 3.4.83

package/lib/plus/pisellSalesManagement/hooks/useOrderPerspective.js

@@ -0,0 +1,700 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/plus/pisellSalesManagement/hooks/useOrderPerspective.tsx
+var useOrderPerspective_exports = {};
+__export(useOrderPerspective_exports, {
+  useOrderPerspective: () => useOrderPerspective
+});
+module.exports = __toCommonJS(useOrderPerspective_exports);
+var import_react = __toESM(require("react"));
+var import_materials = require("@pisell/materials");
+var import_utils = require("@pisell/utils");
+var import_useEngineContext = __toESM(require("../../../hooks/useEngineContext"));
+var import_clientName = __toESM(require("../../clientName"));
+var import_order = require("../config/order");
+var import_config = require("../config");
+var import_perspectiveUtils = require("./perspectiveUtils");
+var import_BookingNotesPreview = __toESM(require("../components/BookingNotesPreview"));
+var import_serve = require("../serve");
+var useOrderPerspective = () => {
+  var _a, _b, _c, _d, _e;
+  const context = (0, import_useEngineContext.default)();
+  const app = (_c = (_b = (_a = context == null ? void 0 : context.appHelper) == null ? void 0 : _a.utils) == null ? void 0 : _b.getApp) == null ? void 0 : _c.call(_b);
+  const locale = (_e = (_d = context == null ? void 0 : context.engine) == null ? void 0 : _d.props) == null ? void 0 : _e.locale;
+  const staticData = (0, import_react.useMemo)(() => {
+    const PAYMENT_STATUS_LABEL_MAP = (0, import_order.getPaymentStatusMap)();
+    const PLATFORM_LABEL_MAP = (0, import_order.getPlatformMap)();
+    const ORDER_STATUS_LABEL_MAP = (0, import_order.getOrderStatusMap)();
+    const SHIPPING_STATUS_LABEL_MAP = (0, import_order.getShippingStatusMap)();
+    const DELIVERY_TYPE_LABEL_MAP = (0, import_order.getDeliveryTypeMap)();
+    const SHOP_SERVICE_TYPE_LABEL_MAP = (0, import_order.getShopServiceTypeMap)();
+    const BUSINESS_LABEL_MAP = (0, import_config.getBusinessLabelMap)();
+    const orderLabels = (0, import_order.getOrderHeaderLabels)();
+    const amountLabels = {
+      total: import_utils.locales.getText("pisell2.orderList.common.totalAmount"),
+      paid: import_utils.locales.getText("pisell2.orderList.common.paidAmount"),
+      due: import_utils.locales.getText("pisell2.orderList.common.dueAmount"),
+      refunded: import_utils.locales.getText("pisell2.orderList.common.refundedAmount"),
+      items: import_utils.locales.getText("pisell2.orderList.common.itemsCount")
+    };
+    return {
+      PAYMENT_STATUS_LABEL_MAP,
+      PLATFORM_LABEL_MAP,
+      ORDER_STATUS_LABEL_MAP,
+      SHIPPING_STATUS_LABEL_MAP,
+      DELIVERY_TYPE_LABEL_MAP,
+      SHOP_SERVICE_TYPE_LABEL_MAP,
+      BUSINESS_LABEL_MAP,
+      orderLabels,
+      amountLabels
+    };
+  }, [locale]);
+  const buildColumns = (0, import_react.useCallback)(
+    (ctx) => {
+      const {
+        PAYMENT_STATUS_LABEL_MAP,
+        PLATFORM_LABEL_MAP,
+        ORDER_STATUS_LABEL_MAP,
+        SHIPPING_STATUS_LABEL_MAP,
+        DELIVERY_TYPE_LABEL_MAP,
+        SHOP_SERVICE_TYPE_LABEL_MAP,
+        BUSINESS_LABEL_MAP,
+        orderLabels,
+        amountLabels
+      } = staticData;
+      return [
+        {
+          title: orderLabels.saleBrief,
+          key: "sale_brief",
+          width: 225,
+          // fixed: 'left',
+          render: (_, record) => {
+            const orderCode = record == null ? void 0 : record.shop_full_order_number;
+            const currencySymbol = record == null ? void 0 : record.currency_symbol;
+            const totalAmount = record == null ? void 0 : record.total_amount;
+            const paymentStatus = record == null ? void 0 : record.payment_status;
+            const orderNote = record == null ? void 0 : record.note;
+            const internalNotes = record == null ? void 0 : record.internal_note;
+            const noteApis = (0, import_serve.createNoteApis)(
+              (record == null ? void 0 : record.id) || (record == null ? void 0 : record.order_id) || (record == null ? void 0 : record.orderId)
+            );
+            const tags = (record == null ? void 0 : record.tag) || (record == null ? void 0 : record.tags) || [];
+            const paymentLabel = PAYMENT_STATUS_LABEL_MAP[paymentStatus] || paymentStatus || "-";
+            const paymentColor = import_order.PAYMENT_STATUS_COLOR_MAP[paymentStatus] || "";
+            return /* @__PURE__ */ import_react.default.createElement("div", { style: { display: "flex", flexDirection: "column" } }, /* @__PURE__ */ import_react.default.createElement(
+              "div",
+              {
+                style: {
+                  fontWeight: "bold",
+                  textDecoration: "underline",
+                  color: "var(--theme-color, #7f56d9)"
+                }
+              },
+              orderCode
+            ), Array.isArray(tags) && tags.length > 0 ? /* @__PURE__ */ import_react.default.createElement("div", { style: { display: "flex", gap: 4, flexWrap: "wrap" } }, tags.map((item) => /* @__PURE__ */ import_react.default.createElement(
+              import_perspectiveUtils.Tag,
+              {
+                key: `${item == null ? void 0 : item.id}`,
+                style: {
+                  margin: 0,
+                  maxWidth: 160,
+                  whiteSpace: "nowrap",
+                  overflow: "hidden",
+                  textOverflow: "ellipsis",
+                  fontWeight: 500
+                }
+              },
+              item == null ? void 0 : item.name
+            ))) : null, /* @__PURE__ */ import_react.default.createElement("div", { style: { fontWeight: "bold" } }, /* @__PURE__ */ import_react.default.createElement("span", { style: { marginRight: 6 } }, amountLabels.total, ":"), /* @__PURE__ */ import_react.default.createElement("span", null, (0, import_perspectiveUtils.formatAmount)(totalAmount, currencySymbol))), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
+              import_perspectiveUtils.Tag,
+              {
+                style: {
+                  backgroundColor: paymentColor,
+                  whiteSpace: "nowrap",
+                  border: "none",
+                  fontWeight: 500
+                }
+              },
+              paymentLabel
+            )), /* @__PURE__ */ import_react.default.createElement(
+              import_BookingNotesPreview.default,
+              {
+                dataSource: {
+                  note: orderNote,
+                  internalNotes,
+                  apis: noteApis,
+                  onChange: (value, type, noteType) => {
+                    ctx.refresh();
+                  }
+                },
+                labels: {
+                  orderNote: orderLabels.orderNote,
+                  internalNote: orderLabels.internalNote
+                },
+                style: {
+                  maxWidth: 160
+                }
+              }
+            ));
+          }
+        },
+        {
+          title: orderLabels.customer,
+          key: "customer",
+          align: "center",
+          width: 150,
+          uniformCompare: (value, record) => {
+            const customer = record == null ? void 0 : record.customer;
+            if (!customer) return "-";
+            const guestCode = customer == null ? void 0 : customer.guest_code;
+            if (guestCode) return `${guestCode}`;
+            if (customer.user_id === 1) return "walk-in";
+            return customer;
+          },
+          render: (_, record) => {
+            const customer = record == null ? void 0 : record.customer;
+            if (!customer) return "-";
+            const guestCode = customer == null ? void 0 : customer.guest_code;
+            if (guestCode) {
+              return /* @__PURE__ */ import_react.default.createElement(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    alignItems: "center",
+                    textAlign: "center"
+                  }
+                },
+                /* @__PURE__ */ import_react.default.createElement("div", { style: { fontWeight: "bold" } }, orderLabels.guest)
+              );
+            }
+            const phone = (0, import_perspectiveUtils.formatPhone)(
+              (customer == null ? void 0 : customer.phone) || (record == null ? void 0 : record.phone),
+              (customer == null ? void 0 : customer.country_calling_code) || (record == null ? void 0 : record.country_calling_code)
+            );
+            const lines = (0, import_perspectiveUtils.getDisplayLines)([phone, customer == null ? void 0 : customer.email]);
+            return /* @__PURE__ */ import_react.default.createElement(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  flexDirection: "column",
+                  alignItems: "center",
+                  textAlign: "center"
+                }
+              },
+              /* @__PURE__ */ import_react.default.createElement(import_clientName.default, { dataSource: customer, style: { fontSize: 14 } }),
+              lines.map((line, index) => /* @__PURE__ */ import_react.default.createElement("div", { key: `${line}-${index}`, style: import_perspectiveUtils.textStyles.text }, line))
+            );
+          }
+        },
+        {
+          title: orderLabels.contact,
+          dataIndex: "contacts_info",
+          key: "contacts_info",
+          align: "center",
+          width: 150,
+          uniformCompare: (value, record) => {
+            if (!value) return "-";
+            return value;
+          },
+          render: (value) => {
+            if (!value) return "-";
+            const info = (value == null ? void 0 : value.value) || {};
+            const phone = (0, import_perspectiveUtils.formatPhone)(info == null ? void 0 : info.phone);
+            const lines = (0, import_perspectiveUtils.getDisplayLines)([phone, info == null ? void 0 : info.email]);
+            return /* @__PURE__ */ import_react.default.createElement(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  flexDirection: "column",
+                  alignItems: "center",
+                  textAlign: "center"
+                }
+              },
+              /* @__PURE__ */ import_react.default.createElement(import_clientName.default, { dataSource: info, style: { fontSize: 14 } }),
+              lines.map((line, index) => /* @__PURE__ */ import_react.default.createElement("div", { key: `${line}-${index}`, style: import_perspectiveUtils.textStyles.text }, line))
+            );
+          }
+        },
+        {
+          title: orderLabels.paymentInfo,
+          key: "payment_info",
+          width: 124,
+          align: "center",
+          render: (_, record) => {
+            const value = record == null ? void 0 : record.payment_status;
+            const currencySymbol = record == null ? void 0 : record.currency_symbol;
+            const totalAmount = Number((record == null ? void 0 : record.total_amount) || 0);
+            const paidAmount = Number((record == null ? void 0 : record.paid_amount) || 0);
+            const refundedAmount = Number((record == null ? void 0 : record.total_refund_amount) || 0);
+            const dueAmount = totalAmount - paidAmount;
+            const amountStyles = {
+              due: {
+                fontWeight: "bold",
+                color: "#D92D20"
+              },
+              refunded: {
+                color: "#CA8504",
+                fontWeight: "bold"
+              }
+            };
+            const lines = [];
+            if (["payment_processing", "unpaid"].includes(value)) {
+              lines.push({
+                label: amountLabels.due,
+                value: (0, import_perspectiveUtils.formatAmount)(dueAmount, currencySymbol),
+                bold: true,
+                kind: "due"
+              });
+              lines.push({
+                label: amountLabels.total,
+                value: (0, import_perspectiveUtils.formatAmount)(totalAmount, currencySymbol),
+                kind: "total"
+              });
+            } else if (value === "partially_paid") {
+              lines.push({
+                label: amountLabels.due,
+                value: (0, import_perspectiveUtils.formatAmount)(dueAmount, currencySymbol),
+                bold: true,
+                kind: "due"
+              });
+              lines.push({
+                label: amountLabels.paid,
+                value: (0, import_perspectiveUtils.formatAmount)(paidAmount, currencySymbol),
+                kind: "paid"
+              });
+              lines.push({
+                label: amountLabels.total,
+                value: (0, import_perspectiveUtils.formatAmount)(totalAmount, currencySymbol),
+                kind: "total"
+              });
+            } else if (value === "paid") {
+              lines.push({
+                label: amountLabels.paid,
+                value: (0, import_perspectiveUtils.formatAmount)(paidAmount, currencySymbol),
+                bold: true,
+                kind: "paid"
+              });
+              lines.push({
+                label: amountLabels.total,
+                value: (0, import_perspectiveUtils.formatAmount)(totalAmount, currencySymbol),
+                kind: "total"
+              });
+            } else if (["partially_refunded", "refunded"].includes(value)) {
+              lines.push({
+                label: amountLabels.refunded,
+                value: (0, import_perspectiveUtils.formatAmount)(refundedAmount, currencySymbol),
+                bold: true,
+                kind: "refunded"
+              });
+              lines.push({
+                label: amountLabels.paid,
+                value: (0, import_perspectiveUtils.formatAmount)(paidAmount, currencySymbol),
+                kind: "paid"
+              });
+              lines.push({
+                label: amountLabels.total,
+                value: (0, import_perspectiveUtils.formatAmount)(totalAmount, currencySymbol),
+                kind: "total"
+              });
+            } else if (["voided", "authorized"].includes(value)) {
+              lines.push({
+                label: amountLabels.total,
+                value: (0, import_perspectiveUtils.formatAmount)(totalAmount, currencySymbol),
+                bold: true,
+                kind: "total"
+              });
+            } else {
+              lines.push({
+                label: amountLabels.total,
+                value: (0, import_perspectiveUtils.formatAmount)(totalAmount, currencySymbol),
+                bold: true,
+                kind: "total"
+              });
+            }
+            return /* @__PURE__ */ import_react.default.createElement(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  flexDirection: "column",
+                  gap: 4,
+                  alignItems: "flex-start"
+                }
+              },
+              lines.map((line) => /* @__PURE__ */ import_react.default.createElement("div", { key: line.label, style: import_perspectiveUtils.textStyles.text }, /* @__PURE__ */ import_react.default.createElement(
+                "span",
+                {
+                  style: {
+                    whiteSpace: "nowrap",
+                    ...line.kind && amountStyles[line.kind] ? amountStyles[line.kind] : {}
+                  }
+                },
+                line.label,
+                ": ",
+                line.value
+              )))
+            );
+          }
+        },
+        {
+          title: orderLabels.items,
+          key: "product_quantity",
+          align: "center",
+          width: 120,
+          render: (_, record) => {
+            const count = (record == null ? void 0 : record.product_quantity) || 0;
+            return /* @__PURE__ */ import_react.default.createElement("span", { style: { ...import_perspectiveUtils.textStyles.text, textAlign: "center" } }, count, amountLabels.items);
+          }
+        },
+        {
+          title: orderLabels.orderOrigin,
+          key: "order_origin",
+          width: 138,
+          align: "center",
+          render: (_, record) => {
+            const channel = PLATFORM_LABEL_MAP[record == null ? void 0 : record.order_sales_channel] || PLATFORM_LABEL_MAP[record == null ? void 0 : record.order_platform] || (record == null ? void 0 : record.order_sales_channel) || (record == null ? void 0 : record.order_platform);
+            const device = (record == null ? void 0 : record.device_name) || (record == null ? void 0 : record.device) || (record == null ? void 0 : record.terminal);
+            const time = (record == null ? void 0 : record.created_at) || (record == null ? void 0 : record.order_time);
+            const lines = (0, import_perspectiveUtils.getDisplayLines)([channel, device]);
+            if (lines.length === 0) {
+              return null;
+            }
+            const businessLabel = BUSINESS_LABEL_MAP[record.business_code];
+            return /* @__PURE__ */ import_react.default.createElement(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  flexDirection: "column",
+                  alignItems: "flex-start"
+                }
+              },
+              businessLabel ? /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
+                import_perspectiveUtils.Tag,
+                {
+                  color: import_config.BUSINESS_COLOR_MAP[record.business_code],
+                  style: {
+                    color: "black",
+                    fontWeight: 500
+                  }
+                },
+                businessLabel
+              )) : null,
+              lines.map((line, index) => /* @__PURE__ */ import_react.default.createElement("div", { key: `${line}-${index}`, style: import_perspectiveUtils.textStyles.text }, line)),
+              /* @__PURE__ */ import_react.default.createElement(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    whiteSpace: "nowrap"
+                  }
+                },
+                /* @__PURE__ */ import_react.default.createElement("span", null, orderLabels.createdBy, ":"),
+                /* @__PURE__ */ import_react.default.createElement(
+                  import_clientName.default,
+                  {
+                    dataSource: record.create_account,
+                    style: { fontSize: 14 }
+                  }
+                )
+              ),
+              /* @__PURE__ */ import_react.default.createElement(
+                import_materials.PisellDateTimeDisplay,
+                {
+                  value: time,
+                  layout: "inline",
+                  textAlign: "left",
+                  timeFormat: { padHour: true },
+                  dateFormat: {
+                    showYear: false,
+                    shortMonth: true,
+                    showRelativeDay: true,
+                    useCommaBeforeYear: false
+                  },
+                  fields: {
+                    fieldOrder: ["time", "weekday", "date"]
+                    // inlineSeparators: [' ', ', '],
+                  },
+                  style: {
+                    whiteSpace: "nowrap"
+                  }
+                }
+              )
+            );
+          }
+        },
+        {
+          title: orderLabels.paymentStatus,
+          dataIndex: "payment_status",
+          key: "payment_status",
+          align: "center",
+          width: 160,
+          render: (value) => {
+            const label = PAYMENT_STATUS_LABEL_MAP[value] || value || "-";
+            const color = import_order.PAYMENT_STATUS_COLOR_MAP[value] || "";
+            return /* @__PURE__ */ import_react.default.createElement("div", { style: { textAlign: "center" } }, /* @__PURE__ */ import_react.default.createElement(
+              import_materials.PisellTags,
+              {
+                style: {
+                  backgroundColor: color,
+                  whiteSpace: "nowrap"
+                }
+              },
+              label
+            ));
+          }
+        },
+        {
+          title: orderLabels.shippingMethod,
+          key: "delivery_type",
+          align: "center",
+          width: 160,
+          render: (_, record) => {
+            var _a2, _b2;
+            const deliveryType = record == null ? void 0 : record.delivery_type;
+            const serverType = (_b2 = (_a2 = record == null ? void 0 : record.metadata) == null ? void 0 : _a2.shop_service_type) == null ? void 0 : _b2.server_type;
+            if (!deliveryType && !serverType) return "-";
+            const isShopService = deliveryType === "shop_service";
+            const label = isShopService ? SHOP_SERVICE_TYPE_LABEL_MAP[serverType] : DELIVERY_TYPE_LABEL_MAP[deliveryType];
+            if (!label || !isShopService && deliveryType === "nil")
+              return "-";
+            const color = isShopService ? import_order.SHOP_SERVICE_TYPE_COLOR_MAP[serverType] : import_order.DELIVERY_TYPE_COLOR_MAP[deliveryType];
+            return /* @__PURE__ */ import_react.default.createElement("div", { style: { textAlign: "center" } }, /* @__PURE__ */ import_react.default.createElement(
+              import_perspectiveUtils.Tag,
+              {
+                style: { whiteSpace: "nowrap", fontWeight: 500 },
+                color
+              },
+              label
+            ));
+          },
+          uniformCompare: (_, record) => {
+            var _a2, _b2;
+            const deliveryType = (record == null ? void 0 : record.delivery_type) || "";
+            const serverType = ((_b2 = (_a2 = record == null ? void 0 : record.metadata) == null ? void 0 : _a2.shop_service_type) == null ? void 0 : _b2.server_type) || "";
+            return `${deliveryType}|${serverType}`;
+          }
+        },
+        {
+          title: orderLabels.orderStatus,
+          dataIndex: "status",
+          key: "status",
+          align: "center",
+          width: 150,
+          render: (value) => {
+            const color = import_order.ORDER_STATUS_COLOR_MAP[value];
+            const label = ORDER_STATUS_LABEL_MAP[value] || value || "-";
+            return /* @__PURE__ */ import_react.default.createElement("div", { style: { textAlign: "center" } }, /* @__PURE__ */ import_react.default.createElement(
+              import_materials.PisellTags,
+              {
+                style: {
+                  whiteSpace: "nowrap",
+                  borderColor: color == null ? void 0 : color.borderColor,
+                  color: color == null ? void 0 : color.textColor
+                }
+              },
+              label
+            ));
+          }
+        },
+        {
+          title: orderLabels.fulfillmentStatus,
+          dataIndex: "shipping_status",
+          key: "shipping_status",
+          align: "center",
+          width: 160,
+          render: (value) => {
+            const color = import_order.FULFILLMENT_STATUS_COLOR_MAP[value];
+            const label = SHIPPING_STATUS_LABEL_MAP[value] || value || "-";
+            return /* @__PURE__ */ import_react.default.createElement("div", { style: { textAlign: "center" } }, /* @__PURE__ */ import_react.default.createElement(
+              import_materials.PisellTags,
+              {
+                style: {
+                  whiteSpace: "nowrap",
+                  borderColor: color == null ? void 0 : color.borderColor,
+                  color: color == null ? void 0 : color.textColor
+                }
+              },
+              label
+            ));
+          }
+        },
+        {
+          title: orderLabels.updated,
+          key: "last_edit_account",
+          width: 132,
+          align: "center",
+          render: (_, record) => {
+            const editor = record == null ? void 0 : record.last_edit_account;
+            const time = (editor == null ? void 0 : editor.created_at) || (record == null ? void 0 : record.updated_at);
+            const channel = PLATFORM_LABEL_MAP[record == null ? void 0 : record.order_platform] || (record == null ? void 0 : record.order_platform);
+            const lines = (0, import_perspectiveUtils.getDisplayLines)([channel]);
+            return /* @__PURE__ */ import_react.default.createElement(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  flexDirection: "column",
+                  alignItems: "flex-start"
+                }
+              },
+              /* @__PURE__ */ import_react.default.createElement(
+                import_clientName.default,
+                {
+                  dataSource: editor || record.create_account,
+                  style: { fontSize: 14 }
+                }
+              ),
+              /* @__PURE__ */ import_react.default.createElement(
+                import_materials.PisellDateTimeDisplay,
+                {
+                  value: time,
+                  layout: "inline",
+                  textAlign: "left",
+                  timeFormat: { padHour: true },
+                  dateFormat: {
+                    showYear: false,
+                    shortMonth: true,
+                    showRelativeDay: true,
+                    useCommaBeforeYear: false
+                  },
+                  fields: {
+                    fieldOrder: ["time", "weekday", "date"]
+                    // inlineSeparators: [' ', ', '],
+                  },
+                  style: {
+                    whiteSpace: "nowrap"
+                  }
+                }
+              ),
+              lines.map((line, index) => /* @__PURE__ */ import_react.default.createElement("div", { key: `${line}-${index}`, style: import_perspectiveUtils.textStyles.text }, line))
+            );
+          }
+        },
+        {
+          title: orderLabels.orderId,
+          dataIndex: "id",
+          key: "id",
+          align: "center",
+          width: 100,
+          render: (value) => /* @__PURE__ */ import_react.default.createElement("span", { style: { ...import_perspectiveUtils.textStyles.text, textAlign: "center" } }, value)
+        }
+      ];
+    },
+    [staticData]
+  );
+  const _perspective = (0, import_react.useMemo)(
+    () => ({
+      key: "handle",
+      label: "Handle",
+      getChildComponentProps: (ctx) => ({
+        grid: {
+          bordered: true,
+          collapseUniformColumns: true,
+          columns: buildColumns(ctx),
+          defaultHiddenColumnKeys: [
+            "order_origin",
+            "payment_status",
+            "delivery_type",
+            "status",
+            "shipping_status",
+            "last_edit_account",
+            "id"
+          ],
+          scroll: {
+            x: "max-content",
+            autoCalc: true,
+            scrollToFirstRowOnChange: true
+          },
+          rowSelection: {
+            fixed: true,
+            columnWidth: 48
+          },
+          onRow: (record) => ({
+            onClick: () => {
+              var _a2, _b2, _c2, _d2;
+              const pathname = encodeURIComponent(
+                ((_c2 = (_b2 = (_a2 = app == null ? void 0 : app.history) == null ? void 0 : _a2.instance) == null ? void 0 : _b2.location) == null ? void 0 : _c2.pathname) || ""
+              );
+              (_d2 = app == null ? void 0 : app.history) == null ? void 0 : _d2.push(
+                `/order-detail?id=${record.id}&goback=${pathname}`
+              );
+            }
+          })
+        },
+        toolBar: {
+          search: { showConfirmButton: false },
+          sort: { list: (0, import_order.getSortList)() },
+          quickFilter: {
+            filterList: [
+              {
+                type: "rangePicker",
+                name: "orderDate",
+                key: "orderDate",
+                props: {
+                  placeholder: import_utils.locales.getText(
+                    "pisell2.orderList.quickFilter.orderDate.label"
+                  )
+                }
+              }
+            ]
+          },
+          filter: {
+            hiddenQuickFilter: true,
+            defaultFilterValue: {
+              quickFilter: [],
+              otherFilter: (0, import_order.getFilterButtonList)(),
+              values: {}
+            }
+          }
+        },
+        batchActionBar: {
+          overflowThreshold: 2,
+          defaultActions: {
+            showSelectAll: false,
+            showClear: false,
+            showInvert: false,
+            showDelete: false
+          }
+        }
+      })
+    }),
+    [buildColumns, app, locale]
+  );
+  return _perspective;
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useOrderPerspective
+});