1. Descripción general
Este proyecto es un conjunto completo de **sistema de plataforma de tareas de comercio electrónico**, que adopta una arquitectura de separación de front-end y back-end. El front-end se basa en React + Vite + Ant Design Mobile para crear una aplicación H5 móvil, y el back-end se basa en el marco ThinkPHP 5.1 para desarrollar una interfaz API RESTful. El sistema admite la internacionalización en varios idiomas e incluye módulos funcionales básicos completos, como gestión de usuarios, gestión de pedidos, recarga de pagos, nivel VIP y promoción de equipos.
2. Arquitectura técnica
Pila de tecnología front-end
– **Marco**: Reaccionar 18.2.0
– **Herramientas de compilación**: Vite 7.3.1
– **Biblioteca de componentes de interfaz de usuario**: Ant Design Mobile 5.35.0
– **Enrutamiento**: React Router DOM 6.22.3
– **Solicitud HTTP**: Axios 1.6.8
– **Internacionalización**: i18next + reaccionar-i18next (admite más de 20 idiomas)
– **Otros**: generación de QRCode, operación por gestos, verificación de formularios, etc.
#### Pila de tecnología backend
– **Marco**: ThinkPHP 5.1 (versión LTS)
– **Versión de PHP**: >= 5.6, compatible con PHP 8.0
– **Base de datos**: MySQL
– **Caché**: Redis (Predis)
– **Integración de pagos**: Admite pagos con criptomonedas como TRC20/USDT
– **Servicios de terceros**: Alibaba Cloud OSS, Qiniu Cloud Storage, ubicación geográfica GeoIP
3. Módulos funcionales principales
1.Sistema de usuario
– **Registro e inicio de sesión de usuario**: admite inicio de sesión con número de teléfono móvil/nombre de usuario, almacenamiento cifrado con contraseña
– **Centro de usuarios**: gestión de información personal, carga de avatar, gestión de direcciones
– **Sistema de niveles VIP**: sistema de membresía VIP de varios niveles, diferentes niveles disfrutan de diferentes derechos e intereses
– **Seguridad de la cuenta**: Contraseña de transacción, administración del estado de inicio de sesión, bloqueo de error de contraseña
2. Sistema de gestión de pedidos
– **Función de captura de pedidos**: los usuarios pueden capturar pedidos de productos, admitiendo múltiples categorías de productos
– **Lista de pedidos**: consulta del estado del pedido (pendiente, en curso, completado)
– **Procesamiento de pedidos**: enviar pedido, cancelar pedido, ver detalles del pedido
– **Estadísticas de pedidos**: estadísticas de comisiones de hoy, estadísticas de finalización de pedidos
3.Sistema de recarga de pagos
– **Función de recarga**: Admite múltiples métodos de pago (tarjeta bancaria, USDT, etc.)
– **Función de retiro**: admite retiro con tarjeta bancaria y retiro de USDT
– **Administración de billetera**: Soporta TRC20, BTC, ETH y otras redes de billetera
– **Registros de fondos**: registros de recarga, registros de retiro y consultas de flujo de fondos
– **Gestión de tarifas**: Relación de tarifa de retiro configurable
4. Sistema de promoción de equipos
– **Función de invitación**: generar código de invitación/enlace de invitación
– **Gestión de equipos**: vea los equipos subordinados y las estadísticas de ingresos del equipo
– **Comisión compartida**: mecanismo de distribución de comisiones multinivel
– **Estadísticas de promoción**: Estadísticas sobre el tamaño del equipo, ingresos por promoción, etc.
5. Internacionalización multilingüe
El sistema tiene soporte integrado para más de 20 idiomas, incluidos:
– Chino simplificado/tradicional
– Inglés, Español, Francés, Alemán
– Japonés, coreano, indonesio
– Ruso, turco, árabe
– y muchos más idiomas europeos
6.Sistema de gestión de fondo
– **Gestión de usuarios**: lista de usuarios, gestión de estado de usuario, configuración de nivel de usuario
– **Gestión de pedidos**: revisión de pedidos, estadísticas de pedidos, exportación de pedidos
– **Gestión de productos**: clasificación de productos, lista de productos, gestión de inventario
– **Gestión financiera**: revisión de depósitos, revisión de retiros, flujo de capital
– **Configuración del sistema**: configuración de parámetros del sistema, configuración de pago, configuración de reglas de nivel
– **Gestión de permisos**: sistema de control de permisos basado en nodos
4. Diseño de base de datos
Las principales tablas de datos del sistema incluyen:
– `xy_users`: tabla de información del usuario
– `xy_convey`: formulario de pedido
– `xy_goods_list`: tabla de lista de productos
– `xy_level`: tabla de niveles VIP
– `xy_recharge`: tabla de registros de recarga
– `xy_deposit`: tabla de registro de retiros
– `xy_balance_log`: tabla de flujo de fondos
– `xy_bankinfo`: tabla de información de tarjetas bancarias
– `user_wallet`: tabla de billetera de usuario
– `xy_banner`: gráfico de carrusel
– `xy_index_msg`: tabla de mensajes de la página de inicio
5. Diseño de interfaz API
El sistema adopta especificaciones de diseño RESTful API y los principales módulos de interfaz son:
Interfaz relacionada con el usuario
– `/api/user/login` – inicio de sesión de usuario
– `/api/user/register` – Registro de usuario
– `/api/user/info` – Obtener información del usuario
Interfaz relacionada con el pedido
– `/api/order/order_list` – Obtener la lista de pedidos
– `/api/order/order_info` – Obtener detalles del pedido
– `/api/rotorder/submit_order` – Enviar un pedido
– `/api/order/do_order` – Procesar pedidos
Interfaz relacionada con el pago
– `/api/pay/recharge` – Interfaz de recarga
– `/api/withdraw/withdraw` – Interfaz de retiro
– `/api/wallet/saveWallet` – guarda la información de la billetera
Interfaces relacionadas con la página de inicio
– `/api/index/home` – Obtener datos de la página de inicio
– `/api/index/get_msg` – Obtener información gráfica de la página de inicio
6. Estructura de la página de inicio
“`
src/
├── vistas/# Componentes de la página
│ ├── Index.jsx # Página de inicio
│ ├── Login.jsx # Página de inicio de sesión
│ ├── Register.jsx # Página de registro
│ ├── Order.jsx # Página de pedido
│ ├── Trade.jsx # Página de comercio
│ ├── Team.jsx # Página del equipo
│ ├── User.jsx # Centro de Usuario
│ ├── Withdraw.jsx # Página de retiro
│ ├── Pagar/# Páginas relacionadas con pago
│ └── Registro/# Registro de páginas relacionadas
├── solicitud/ # encapsulación de solicitud API
├── idioma/ # Configuración multilingüe
└── utils/ # Función de utilidad
“`
7. Funciones de seguridad
1.**Autenticación de token JWT**: use Firebase JWT para la autenticación de interfaz
2. **Cifrado de contraseña**: SHA1 + doble cifrado Salt
3. **Contraseña de transacción**: Una contraseña de transacción independiente protege la seguridad de los fondos.
4. **Gestión del estado de inicio de sesión**: evita inicios de sesión repetidos
5. **Procesamiento entre dominios**: soporte de solicitudes CORS entre dominios
6. **Verificación de datos**: doble verificación de datos de front-end y back-end
8. Instrucciones de implementación
Implementación de front-end
# Instalar dependencias
instalación npm
# Operación del entorno de desarrollo
npm rundev
#Construir entorno de producción
npm ejecutar compilación: lanzamiento
Implementación de back-end
1. Requisitos del entorno PHP: PHP >= 5.6
2. Configurar la información de conexión de la base de datos.
3. Configurar la conexión de Redis
4. Establecer permisos del directorio de carga de archivos
5.Configurar reglas pseudoestáticas (Nginx/Apache)
9. Escenarios aplicables
– Plataforma de tareas de comercio electrónico
– Centro comercial móvil H5
– Sistema social de comercio electrónico
– Plataforma de recompensas de misión
– Plataforma de comercio electrónico basada en miembros
– Comercio electrónico transfronterizo multilingüe
10. Características del código fuente
1. **Funciones completas**: Contiene código completo de front-end y back-end, listo para usar de inmediato.
2. **Mobile First**: Diseñado específicamente para dispositivos móviles H5, diseño responsivo
3. **Soporte multilingüe**: Más de 20 idiomas integrados, fácil de expandir
4. **Diseño modular**: estructura de código clara, fácil de mantener y desarrollo secundario
5. **Seguro y confiable**: Mecanismo de seguridad completo para proteger los datos y fondos del usuario.
6. **Optimización del rendimiento**: optimización de la compresión del código front-end, carga diferida de rutas, almacenamiento en caché de la interfaz, etc.
11. Soporte técnico
Este código fuente contiene una estructura de base de datos completa, comentarios de código detallados y documentación API completa. Es adecuado para desarrollo secundario y personalización por parte de desarrolladores con cierta experiencia en desarrollo.
