1. Project Overview

naiveui-form-generate

A form generator based on Naive UI and TypeScript, supporting commonly used components such as complex tables and Tree.

NaiveUi Form Generate, a form generator built with Vue3.0, Vite, and Naive UI.

2. Open Source License

Licensed under MIT

3. Screenshots

4. Feature Overview

Features / Roadmap

🕙 Planned 🔲 Preparing 🚧 In Progress ✅ Completed

Supports common component events (Properties that can be configured online for components can also be dynamically modified within events, such as visibility, required status, validation rules, styles, and more.)

• ✅ Click Event

• ✅ Change Event

• 🔲 Focus Event

• 🔲 Hover Event

• 🔲 Blur Event

• 🚧 Select Event

• 🔲 Update Event

• 🔲 Before Form Submission Event

• 🔲 After Form Save Event

Basic Components

• ✅ Single-Line / Multi-Line / Password Input Component

• ✅ Number Component

• ✅ Radio Button

• ✅ Checkbox

• ✅ Time Picker

• ✅ Date Picker (Year, Month, Quarter, etc.)

• ✅ Rating

• ✅ Switch

• ✅ Slider (Horizontal and Vertical)

• ✅ Color Picker

Advanced Components

• ✅ Tree Select

• ✅ File Upload

• ✅ Transfer Selector

• ✅ Cascader

• ✅ Tree Component

• ✅ Rich Text Editor

• ✅ Dynamic Tags

• 🕙 Dynamic Table (Primarily used for child tables, supporting multiple styles such as popup, drawer, and inline editing)

Layout Components

• ✅ New Grid Layout in Naive UI

• 🚧 Static Table (Native styles can be enabled to achieve an identical appearance to online and offline contract forms)

• 🕙 Tabs

Other Components

• ✅ Plain Text

• ✅ Alert Component

• ✅ Divider

• ✅ Button

Other Improvements

• 🚀 Individual Component Encapsulation (TypeScript)

• 🚀 Detail Optimizations

• More......

5. Tech Stack

Build

# Clone the project
Visit Yifei Open Source: https://code.exmay.com/ Download

# Enter the project directory
cd naiveui-form-generate

# Install dependencies
pnpm i # or npm i

# Start
npm run dev

Deployment

# Build Test Environment
npm run build:test

# Build GitHub Pages Environment
npm run build:github

# Build for production
npm run build