WeChat Mini Program Cloud Showroom: AI-Powered Product Display Platform

Project Overview

This project is a WeChat mini program DEMO for a clothing product cloud showroom, consisting of mini program frontend, Node.js backend service, and Vue admin dashboard. The system implements product display, membership management, time-based reminders, and explores AI image generation for product showcasing.

System Components

Subsystem	Tech Stack	Responsibility
Mini Program Frontend	uni-app (Vue 3)	Product browsing, member features
Backend Service	Node.js + Express + sql.js	Data API, AI image proxy
Admin Dashboard	Vue 3 + Element Plus	Product & user management, dashboard

Core Features

Product Display: Clothing product list and detail view
VIP Permissions: Tiered access control for regular and VIP members
Time-based Reminders: Product display time window management
AI Image Generation: Generate product display images via Alibaba Cloud Bailian API
Data Dashboard: Statistics and visualization in admin panel

Technical Architecture

Backend Service

// Express + sql.js local database
const express = require('express')
const sqlite3 = require('sql.js')
 
const app = express()
 
// AI image generation proxy
app.post('/api/ai/generate', async (req, res) => {
  const { prompt, productId } = req.body
  const result = await generateImage(prompt)
  res.json({ imageUrl: result.url })
})

Mini Program Frontend

// uni-app product list
export default {
  data() {
    return {
      products: [],
      vipLevel: 0
    }
  },
  async onLoad() {
    this.products = await this.fetchProducts()
    this.vipLevel = await this.checkVip()
  }
}

Demo Accounts

Type	Username	Password
Regular Member	user	123456
VIP Member	vip	123456

Current Status

Core features completed, serving as a reference case for WeChat mini program + AI integration.