Order Management

The Order Management page is used to view and manage all orders you have placed on the XOProxy platform.
Here you can search orders, filter by time and status, select multiple orders, and delete them in bulk, as well as view the detailed IP information for each order.

---

1. Page overview

The page is mainly divided into three areas:

1. Search & filter area – Enter conditions to quickly locate the orders you care about.
2. Order list area – Displays order details in a table and lets you select and operate on orders.
3. Pagination area – Switch between multiple pages of orders.

---

2. Search & filter area

This section is at the top of the page and contains several filters and action buttons.

2.1 Order number search

• Input placeholder text: Please enter the order number
• How to use:
  1. Enter the full or partial order number in the input box (for example: 202511200001).
  2. Click the Search button on the right to display only orders that match the criteria.

This is useful when you already know the order number and want to quickly locate a specific order.

2.2 Payment time range (date range filter)

• Uses an Element Plus date range picker.
• Display format: YYYY-MM-DD to YYYY-MM-DD
• Placeholder text (automatically translated based on language settings), for example:
  • Start date: Start date (mapped to t('date-picker.start-date'))
  • End date: End date (mapped to t('date-picker.end-date'))

How to use:

1. Click the date input and select a start date and end date.
2. Once selected, the list will only show orders with payment times within this range.
3. To clear the date filter, you can:
   • Click the clear icon in the date picker, or
   • Click the Reset button (which also clears other filters).

The system automatically includes the entire end date (orders paid before 23:59:59 on that day are counted).

2.3 Order status dropdown

• Dropdown placeholder: Select order status
• In a real environment, common statuses might include:
  • Pending payment
  • Paid
  • Cancelled
  • Refund in progress
  • Refunded

How to use:

1. Click the dropdown and select an order status.
2. Click Search to display only orders with that status.

You can combine status, order number, and time range to perform precise multi-condition filtering.

2.4 Action buttons

To the right of the filters, there are three buttons:

• Search
  Runs a new query based on the current conditions (order number, date range, order status).

• Reset
  Clears all search and filter conditions and shows all orders again.

• Delete (red, “plain” style)
  Used to bulk-delete the orders you have selected (the actual behavior depends on back-end logic).
  Make sure you have selected the correct orders before using it.

---

3. Order list area

3.1 Table header

From left to right, the table header includes:

1. Checkbox

   • Used for bulk operations (select all / range selection, depending on implementation).
   • When checked, it automatically selects multiple orders within a preset range.

2. Order number

3. Order amount

4. Discount amount

5. Paid amount

6. Country/Region – IP quantity – Plan (days)

   • For example: United States / New York – 1 IP – 30 days

7. Payment method

   • For example: Credit card, PayPal, etc.

8. Order status

   • For example: Paid, Pending payment, etc.

9. Payment time

   • For example: 2025-11-20 10:00

10. Actions

    • View IP details for this order, delete the order, etc.

3.2 Single order row

Each row corresponds to one order and includes:

• Checkbox

  • Select or deselect the order, for use with bulk operations such as delete.

• Order information

  • Displays the values for each column, for example:
    • Order number: 202511200001
    • Order amount: 99.9
    • Discount amount: 10
    • Paid amount: 89.9
    • Package summary: United States / New York – 1 IP – 30 days
    • Payment method: Credit card
    • Order status: Paid
    • Payment time: 2025-11-20 10:00

• Action column

  • IP details button:
    • Click to go to the IP detail list for this order (IP address, port, expiry time, etc.).
  • Delete link:
    • Used to delete this order (actual behavior depends on backend implementation).

Tip: If an order is associated with IPs that are still in use, please confirm that deleting it will not disrupt your business.

3.3 Selection and bulk operations

• Header checkbox

  • When checked, selects multiple orders within a preset range (for example, rows 0–10) and sets selected = true for them.
  • When unchecked, clears the selection for those orders.

• Row-level checkbox

  • Lets you control selection for each order individually, useful for fine-grained bulk operations.

• Used with the “Delete” button

  • First select the orders you want to delete.
  • Then click Delete in the action area above to perform a bulk delete.

---

4. Pagination controls

At the bottom of the list is the pagination component:

• Typical display: Previous, page numbers, Next
• total: For example, 1000, indicating there are 1000 order records in total (the actual number is returned by the backend).

How to use:

• Click a page number to switch directly to that page.
• Click Previous / Next to go to the previous or next page.
• When you switch pages, the order list above will update to show the corresponding page of data.

---

5. Common usage scenarios

Scenario 1: Find an order and view its IP details

1. In the order number field, enter all or part of the order number.
2. If necessary, also select a payment date range and order status.
3. Click Search.
4. In the results, find the target order and click IP details on the right.
5. On the IP details page, view all IP information under this order.

Scenario 2: Filter paid orders from the last week

1. Use the date range picker to select the last 7 days.
2. In the order status dropdown, select Paid.
3. Click Search to show only paid orders from the last week.

Scenario 3: Bulk delete multiple invalid orders

1. Use the checkboxes on the left side to select the orders you want to delete (you can select all first and then adjust).
2. After confirming the selection, click the Delete button in the filter area.
3. Follow the system prompts to complete the deletion.

---

If you encounter any issues while using the Order Management page (for example, abnormal order status, amount mismatch, or failure to view IP details), we recommend:

• First refreshing the page or adjusting the filter conditions to search again;
• If the issue persists, contact online support or our support email, and provide the order number so we can quickly help you investigate.