Bank list

1. What This Page Does

The Bank list screen is used to enable or disable financial institutions supported by the website, organize the display order in which banks appear when players bind accounts or initiate transactions in the lobby, and upload custom bank logos for your website instead of using default platform graphics. Master bank records are maintained centrally by the platform, meaning website administrators do not need to add or delete bank entities manually, but can freely toggle, reorder, and brand them to match the site's design.

---

2. Before You Begin

• Required Permissions: You must have the 'Bank list' permission in your assigned system role to toggle banks on or off, reorder priorities, and update bank pictures.
• Prerequisites & Preparation:
  • Prepare custom bank logo files if you wish to override the system default (supports PNG, JPG, or WebP square image format, recommended 256 × 256 px, max file size 2 MB).
• Core Rules to Note:
  • Website administrators cannot add or delete bank records from the master catalog; the platform central authority manages all master bank definitions.
  • Turning off a bank here prevents players from selecting it in the lobby and automatically pauses all website receiving and paying accounts belonging to that bank under Bank accounts.

---

3. Screen Layout

When opening the page, you will see the following key areas from top to bottom:

1. Page Header: Displays the title Banks with a descriptive subtitle.
2. Section Card:
   • 3 Status Filter Cards: All, On, and Off filter cards with live count badges.
   • Search Bar: Input field to search by bank name, abbreviation, or bank code.
   • Toolbar Line: Displays total bank count and a Refresh button.
3. Data Table: Displays the order number, bank logo, bank name and code, picture badge, last edited timestamp, on/off switch, and action buttons (rendered as cards on mobile devices).

---

4. Search and Filters

Field / Filter	Type	Options / How to Use	Result When Selected
Search bank, short name or code	Text input	Type the bank name, English abbreviation (e.g. KBANK, SCB), or 3-digit bank code (e.g. 004, 014)	Filters the table to display only matching banks immediately
Status Filter Cards	3 clickable cards	Select All, On, or Off	Filters banks by active state and displays live counters on each card
Clear filters	Button	Click the clear button next to search	Clears search input and restores the complete bank list
Refresh	Icon button	Click the rotating arrow button	Immediately reloads the bank list from the server

---

5. Data Table

Columns in the Table

Column	What You See	Meaning	Colors / Badges
Order	Number in circle with Up/Down arrows	Display priority ranking shown to players in the lobby (rank 1 appears at the top)	- Circle number: click to jump directly to a target position - Up/Down arrows: step up or down 1 position
Bank	Bank logo, localized bank name, short name, and bank code	Primary bank identification details (e.g., Kasikornbank with KBANK · 004)	Logo graphic with localized name and system identifiers
Picture	Badge indicating graphic origin	Shows whether the bank uses a custom site picture or the default system graphic	- Blue badge: Your picture (custom image uploaded for this site) - Grey badge: System picture (standard platform logo) - Orange badge: No picture (shows short text abbreviation on theme background)
Last edited	Timestamp and updater name	Audit tracking of the most recent change	Formatted date and staff username
On/Off	Toggle switch or system notice badge	Operational availability of the bank for player selection	- Green switch: enabled for players - Grey switch: disabled for players - Grey badge reading Off by the system: disabled globally by the platform (switch is locked)
Actions	Action buttons at the end of the row	Commands to change picture and reorder	See action buttons table below

Row Action Buttons (Actions Column)

Button	Icon / Color	What Happens When Clicked	Notes / Conditions
Change picture	Image icon (ImageIcon)	Opens the Bank picture dialog to upload a custom logo or revert to the system logo	Requires 'Bank list' permission
⋮ menu	Vertical three-dots icon	Opens reorder commands: Move to place…, Move to top, Move to bottom	Fast-jump repositioning shortcuts
Up / Down arrows (in Order column)	Up / Down arrows	Moves the bank up or down 1 position immediately	Enabled when no search filter is active

---

6. Step-by-Step Instructions

1. Enabling or Disabling a Bank for Your Website

1. Navigate to Payment setup > Bank list.
2. Locate the bank in the table.
3. Click the toggle switch in the On/Off column:
   • Toggle to On (Green) to allow players to bind and transact with this bank.
   • Toggle to Off (Grey) to hide this bank from player selection.
4. The system updates the bank state and displays a green success notification immediately.

2. Reordering Banks Using Step Arrows

1. Ensure the search input is cleared and the status card is set to All.
2. Locate the bank you wish to reposition.
3. Click the Up arrow to move the bank up 1 spot, or click the Down arrow to move it down 1 spot.
4. The banks swap places immediately, updating the display order in the player lobby.

3. Moving a Bank Directly to a Specific Order Number (Move To)

1. Click the order number circle on the target bank row (or open the three-dots menu ⋮ and select Move to place…).
2. In the Move to place popup dialog, type the desired destination rank number (e.g., type 1 to place it at the very top).
3. Click Move.
4. The bank is inserted into the specified rank and other banks shift their order automatically.

4. Uploading a Custom Website Bank Logo

1. Click the image icon button in the Actions column of the target bank.
2. In the Bank picture popup dialog, click the upload box and select an image file from your computer (PNG, JPG, or WebP up to 2 MB).
3. Preview the new logo in the dialog.
4. Click Save.
5. The badge updates to Your picture (Blue) and players immediately see the custom logo in the lobby.

5. Reverting to the Default System Logo

1. Click the image icon button on a bank displaying the Your picture badge.
2. In the popup dialog, click Reset to system picture at the bottom left.
3. In the confirmation dialog, click Reset to system picture again.
4. The custom image is removed and the badge switches back to System picture (Grey).

---

7. Add or Edit Form

This screen does not have a separate bank creation page because all master bank entities are governed centrally by the platform. The dedicated customization form is the bank picture dialog:

Bank Picture Fields

Field	Required?	What to Enter	Example	Constraints
Upload bank logo	Required to save	Image file for the bank logo	kbank-custom.png	Square PNG, JPG, or WebP format, recommended 256 × 256 px, max file size 2 MB

---

8. Popups and Dialogs

1. Move to Place Dialog

• Triggered By: Clicking the order number circle in the table, or selecting Move to place… from the three-dots menu (⋮).
• What You See: Bank name, current rank, and target order number input.
• What to Do: Enter the destination position (between 1 and the total number of banks) and click Move (or click Cancel).
• Result: Repositions the bank to the selected rank immediately.

2. Bank Picture Dialog

• Triggered By: Clicking the image icon in the Actions column.
• What You See:
  • Current logo preview with image origin status (Your picture, System picture, or No picture).
  • Compact image upload dropzone.
  • Reset to system picture button (shown only when a custom logo is active).
  • Save and Cancel buttons.
• What to Do: Choose a new image file from disk and click Save.
• Result: Uploads the custom logo and updates the lobby graphic.

3. Confirm Logo Reset Modal

• Triggered By: Clicking Reset to system picture in the picture dialog.
• What You See: Confirmation notice stating that the custom image will be discarded and the default platform logo restored.
• What to Do: Click Reset to system picture to confirm.
• Result: Deletes the custom logo file and activates the system default graphic.

---

9. Statuses and Color Badges

Badge / Symbol	Color	Meaning	Action Required
On switch	Green	Bank is active; players can bind accounts and conduct transactions	Normal operation; no action needed
Off switch	Grey	Bank is inactive; hidden from player selection	Toggle on when ready to accept
Off by the system	Grey	Bank is disabled globally across all platform sites; switch is locked	Await central platform maintenance completion
Your picture	Blue	Bank uses a custom graphic uploaded specifically for this site	Visible to players in the lobby
System picture	Grey	Bank uses the default platform logo graphic	Normal appearance; upload custom image if desired
No picture	Orange	Bank has no graphic; short abbreviation is rendered on theme background	Click picture button to upload a logo

---

10. Frequently Asked Questions and Troubleshooting

• If the bank switch cannot be toggled and shows "Off by the system":
  • The central platform team has suspended this bank for maintenance across all websites. Local administrators cannot turn it on until the central service restores it.
• If turning off a bank pauses your site receiving or paying accounts:
  • Disabling a bank in this screen automatically suspends all company accounts under that bank in the Bank accounts screen. Re-enable the bank switch if you need those accounts to continue processing payments.
• If the Up/Down reorder arrows are disabled:
  • Check whether text is typed in the search box. Reordering is only allowed when viewing the complete unfiltered list. Click Clear filters to restore order controls.
• If an uploaded bank logo appears distorted or blurry:
  • Prepare a perfectly square image file (e.g., 256 × 256 pixels) with a transparent background (PNG format). This ensures optimal presentation across all device resolutions.