> โญ **If you like this project, please click `Star` in the top-right corner to support us! Your Star is our greatest motivation for continuous open-source iteration!**
**LILISHOP** is an open-source e-commerce system built with Spring Boot, Vue 3, and uni-app. It supports B2B2C multi-vendor marketplaces, WeChat Mini Programs, H5, Android/iOS Apps, live-streaming e-commerce, affiliate distribution, and flash sales.
### โจ Why Choose Lilishop
- ๐ข **True Apache-2.0 License**: Free for commercial use and private secondary development without licensing concerns.
- ๐ **Modern Vue 3 Stack**: Built on `Vue 3.5 + Pinia 4 + Vue Router 4 + Element Plus`, leaving legacy Vue 2 templates behind.
- ๐งฉ **4-in-1 Production Suite**: Covers **PC Buyer Mall (`buyer`)**, **Seller Portal (`seller`)**, **Platform Admin Panel (`manager`)**, and **IM Customer Service Web (`im`)**, complete with drag-and-drop visual storefront decoration and rich analytics.
---
## 1. Overview
This repository (`lilishop-ui`) is the **Web Frontend Suite** of Lilishop, containing four standalone **Vue 3** web applications: **PC Buyer Mall, Seller Panel, Platform Admin Panel, and IM Customer Service Web**.
- **Official Website**:
- **Documentation**: [Product Documentation](https://bdwx2tfwwt.feishu.cn/wiki/space/7675179368632617952?ccm_open_type=lark_wiki_spaceLink&open_tab_from=wiki_home)
- **Gitee Repository**:
- **GitHub Main Repository**:
---
## 2. Online Demo
> **Note**: The verification code for the demo environment is `111111`.
| Portal | URL | Demo Credentials |
| :--- | :--- | :--- |
| **Platform Admin Panel (`manager`)** | | `admin` / `123456` |
| **Seller / Store Panel (`seller`)** | | `13011111111` / `111111` |
| **PC Buyer Mall (`buyer`)** | | SMS code: `111111` |
| **Mobile H5 (`uni-app`)** | | SMS code: `111111` |
| WeChat Mini Program | Mobile H5 ([Visit Directly](https://m-b2b2c.pickmall.cn)) |
| :---: | :---: |
|
|
|
| Scan with WeChat | Scan or visit |
---
## 3. Core Features & Tech Stack
### Core Features
- **Four-Portal Synergy**: Includes Platform Admin, Seller Panel, PC Buyer Mall, and IM Web Workbench with clear role boundaries.
- **Drag-and-Drop Visual Decoration**: Built-in visual floor editor (`vuedraggable`) for customizing both PC and mobile storefronts.
- **Multi-Vendor B2B2C Operations**: Merchant onboarding, product auditing, split-order fulfillment, promotions, and financial settlement ledgers.
- **Rich Business Analytics**: Powered by `@antv/g2` for sales overview, YoY/MoM product reports, member analytics, and distribution metrics.
- **IM Customer Service**: Integrated with Tencent Cloud IM / WebSocket customer service for real-time communication.
### Web Tech Stack
| Category | Technology | Description |
| :--- | :--- | :--- |
| Core Framework | `Vue 3.5` + `Vue Router 4` | Modern reactive frontend framework |
| State Management | `Pinia 4` | Official Vue 3 state management library |
| UI Library | `Element Plus 2.x` | Enterprise desktop UI component library |
| HTTP Client | `Axios 1.x` | Unified request/response interceptors & auth handling |
| Data Visualization | `@antv/g2` | Interactive charts and business analytics |
| Visual Decoration | `vuedraggable 4` | Drag-and-drop page floor builder |
| Messaging & IM | `@tencentcloud/chat` / `sockjs-client` | Real-time customer service messaging |
| Video Player | `dplayer` + `hls.js` | Product video and live streaming playback |
| Build & Styling | `Vue CLI 5` + `Webpack 5` + `Sass / Less` | Modular build pipeline and theme customization |
---
## 4. Directory Structure
```text
lilishop-ui
โโโ buyer/ # [PC Buyer Mall]
โ โโโ public/ # Static assets & global config (config.js)
โ โโโ src/
โ โโโ api/ # Buyer API modules (goods, cart, order, member, promotion)
โ โโโ components/ # Shared components (floor renderer, navbar, goods card)
โ โโโ pages/ # PC Mall pages (Home, Product Detail, Checkout, User Center)
โ โโโ router/ # Route definitions & guards
โ โโโ stores/ # Pinia stores
โ โโโ utils/ # Request interceptors & helpers
โโโ seller/ # [Seller / Store Management Portal]
โ โโโ public/ # Static assets & global config
โ โโโ src/
โ โโโ api/ # Seller API modules
โ โโโ components/ # Seller shared & decoration components
โ โโโ views/ # Seller views (goods, orders, after-sales, promotions, store settings)
โ โโโ router/ # Dynamic permission routes
โ โโโ stores/ # Pinia stores
โโโ manager/ # [Platform Admin Portal]
โ โโโ public/ # Static assets & global config
โ โโโ src/
โ โโโ api/ # Admin API modules
โ โโโ components/ # Admin components, rich-text editor, visual floor builder
โ โโโ views/ # Admin views (member, goods, order, seller, marketing, finance, stats, system)
โ โโโ router/ # Menu & permission routes
โ โโโ stores/ # Pinia stores
โโโ im/ # [IM Customer Service Web Client]
โ โโโ src/
โ โโโ api/ # Chat session & message APIs
โ โโโ components/ # Chat window, message list, product/order cards
โ โโโ im-server/ # WebSocket / IM connection manager
โ โโโ views/ # Customer service workbench
โโโ build.sh # Unified build script
โโโ docker-build.sh # Docker image build script
```
---
## 5. Related Repositories
| Repository | Description | Links |
| :--- | :--- | :--- |
| **`lilishop`** | Backend Services (Spring Boot 4 / Java 21) | [Gitee](https://gitee.com/beijing_hongye_huicheng/lilishop) ยท [GitHub](https://github.com/lilishop/lilishop) |
| **`lilishop-ui`** | PC Mall / Seller / Admin / IM Web Frontend | [Gitee](https://gitee.com/beijing_hongye_huicheng/lilishop-ui) |
| **`lilishop-uniapp`** | Mobile Buyer Client (H5 / Mini Program / App) | [Gitee](https://gitee.com/beijing_hongye_huicheng/lilishop-uniapp) |
| **`docker`** | Docker Compose, Images & SQL Init Scripts | [Gitee](https://gitee.com/beijing_hongye_huicheng/docker) ยท [MySQL Scripts](https://gitee.com/beijing_hongye_huicheng/docker/tree/master/init/mysql) |
---
## 6. License
Lilishop is licensed under the [Apache-2.0](./LICENSE) License. Copyright ยฉ 2020-2026 **Beijing Hongye Huicheng Technology Co., Ltd.**