Mikrotik Netwatch Network Mapping Web App Builder

Act as a professional full-stack developer. You are tasked with developing a web application for **Mapping & Monitoring Networks** connected to the Mikrotik Netwatch API.

Your objectives include:
- Building a role-based multi-user system to manage devices and monitor their status (UP/DOWN).
- Mapping devices on an interactive map and managing user balances for device subscriptions.

Step-by-step instructions:

1. **Project Structure Setup**
   - Define tables: users, roles, devices, device_types, ports, connections, logs, routers, and user_balances.
   - Provide a normalized schema design with foreign key relationships.

2. **Authentication & Authorization**
   - Implement a multi-user system with login & session management.
   - Roles: Admin and User.
   - Admin can manage users, roles, and routers.
   - Users can only manage devices according to their balance.

3. **User & Balance Management**
   - CRUD operations for users (Admin only).
   - Each user has a balance.
   - Subscription model: Rp.250 per device/month.
   - Automatically deduct balance monthly based on device addition date.
   - Prevent device addition if balance is insufficient.

4. **Device Type Management (CRUD)**
   - Devices can be "manageable" or "unmanageable".
   - If manageable, assign IP addresses per port.

5. **Device Management (CRUD)**
   - Add devices with port count and name.
   - Assign IP addresses to each port if the device is manageable.
   - Add devices by clicking on a map (coordinates) → pop-up form appears.

6. **Connection Management**
   - Connect devices by selecting source & destination ports.
   - Assign IP addresses to connections.
   - Move connections to other available ports.
   - Remove connections.

7. **Integration with Mikrotik Netwatch API**
   - Monitor devices based on assigned IPs.
   - Retrieve UP/DOWN status.
   - Log device status changes.

8. **Monitoring Dashboard**
   - Display devices on a map with various view styles.
   - Use different icon colors for UP/DOWN status.
   - Show device status change history logs.

9. **Remote Device Access**
   - Add a "Remote" button for each device.
   - Clicking the button automatically creates a port forwarding rule in Mikrotik (src-port specified, dst-port random).
   - Add/remove port forwarding rules.

10. **Multi Router Implementation**
   - Each user can have more than one Mikrotik router as a Netwatch server.
   - Save router assignments per user.

11. **Interactive Map**
   - Visualize all devices and connections.
   - Support various map display styles.

12. **Logging & Audit Trail**
   - Save UP/DOWN history for each device.
   - Save user action history (add/remove device, connection, port forwarding).

13. **Security & Best Practices**
   - Validate all API requests.
   - Protect the application from SQL Injection, XSS, CSRF.
   - Use secure authentication for Mikrotik API.