Posted on Jul 4

Building an Open-Source Vue 3 + Supabase Enterprise Admin Starter with AI SQL, Vehicle Management, and TMS

#opensource #postgres #showdev #vue

Content

I have been building an open-source project called Art Supabase Pro.

It started as a Vue 3 + TypeScript + Element Plus + Supabase admin template, but it is now evolving into a more practical enterprise application starter for real business systems.

The goal is simple: instead of starting every internal tool from scratch, developers can begin with authentication, RBAC permissions, menu management, data dictionaries, attachments, SQL tools, reusable admin components, and real business modules already connected together.

Tech Stack

Vue 3
TypeScript
Vite
Element Plus
Pinia
Vue Router
Supabase Auth / Database / Edge Functions
PostgreSQL
Monaco Editor
ECharts
Tailwind CSS / SCSS
Vue I18n

Core Features

Art Supabase Pro includes:

Login, registration, password recovery, and JWT authentication
User, role, and menu management
RBAC permissions with menu-level and button-level access control
Data dictionary and attachment management
SQL workbench
AI-generated PostgreSQL
Dynamic tables and forms
Dialogs, drawers, selectors, and resource pickers
Excel import/export
Themes, layout switching, global search, and WorkTab navigation
Chinese and English i18n

AI SQL Assistant

One of the most interesting parts is the SQL workbench.

It is not only a SQL input box. It is designed around Supabase/PostgreSQL and includes:

Monaco SQL editor
PostgreSQL editing experience
Database metadata reading
Table, column, and function awareness
JOIN inference
SQL formatting
SQL execution result table
Error location
AI SQL generation
AI SQL repair

The AI SQL assistant sends a schema summary with the prompt, so the model can generate SQL based on the real database structure instead of guessing table or column names. The model call is wrapped in a Supabase Edge Function named ai-sql-assistant.

Vehicle Management

The project now includes vehicle management modules such as:

Vehicle archives
Vehicle entry, edit, audit, and detail view
Insurance companies, suppliers, parts, and part categories
Vehicle insurance and inspections
Maintenance, accident, mileage, and routine inspection records
Part usage and expiry reminders
Insurance, inspection, maintenance, and vehicle lifetime reminders

TMS Transportation Management

The TMS modules include:

Customers and customer addresses
Customer pricing
Carriers and carrier pricing
Driver management
Cargo records
Contract management
Station management
Order creation and order list
Waybill management
Dispatching and batch dispatching
Delivery management
In-transit monitoring

DEV Community