地址: 账号:admin 密码:123456
艺创AI-聊天绘画系统「PHP源码版」,基于前后端分离架构以及Vue3、uni-app、ThinkPHP6.x、PHP8.0技术栈开发,包含PC端、H5端、小程序端、APP端。ChatAI聚合对接国内外知名主流大语言模型接口及中转平台,如ChatGLM、讯飞星火、文心一言、GPT3.5、GPT4.0、API2D、知数云。并且聚合对接MJ绘画、SD绘画、意间AI等多种绘画通道,实现了AI对话+AI绘画的融合使用。系统功能包括:AI智能对话、AI创作模型、AI绘画、分销推广、会员套餐、充值套餐、卡密兑换、模型计费、会员回流优惠券等丰富的营销功能。部分功能开发中,欢迎前往体验~。
1.已经搭建好前后端分离的底层,包含程序安装、登录、登出、工作台、菜单权限控制、角色、管理员、部门管理、岗位管理、素材管理、网站设置、图库管理等基础功能,无需重复造轮子。更有开发者工具功能,一键生成代码,大大节省开发时间。
2.可视化系统程序安装界面,可自定义安装数据,开发者可快速扩展发行自己的软件产品。
3.定位为通用的软件系统管理后台,方便开发者快速开发软件系统,文档清晰、代码易懂、简单易用。
4.集成通用的微信支付(API3)、微信小程序公众号登录、阿里云、腾讯云短信,阿里云OSS、腾讯云COS、七牛云OSS等通用模块。
1.服务端使用PHP8.0开发,性能有突破性的提升。
2.使用最新ThinkPHP6框架,目前国内最流行的PHP框架,高性能、简单易用、文档齐全、支持composer快速安装组件、支持Redis、支持PSR多种规范等。
1.使用最流性的前后端分离方案typescript、vue3、vite开发,保持了代码的简洁、一致和规范。
2.后台界面使用element-plus UI框架,简单精美的后台界面,丰富的组件库,方便快速开发,满足各种后台交互。
手机端uniapp前台,可以编译成手机H5网页、微信小程序、安卓App,苹果App等客户端。
PC端前台使用Nuxt.js,支持服务器端渲染(SSR),对SEO友好。
一键生成前后端业务代码,大大提示开发效率。
艺创AI是一款基于UniApp开发的跨平台AI聊天绘画系统,支持微信小程序、H5、APP等多端部署。系统集成了AI聊天对话、AI绘画创作、用户管理、支付系统、任务中心等完整功能模块。
- 前端框架: UniApp (Vue3 + TypeScript)
- 状态管理: Pinia
- 路由管理: uniapp-router-next
- UI组件库: uView Plus (vk-uview-ui)
- 样式方案: TailwindCSS + SCSS
- 构建工具: Vite
- 代码规范: ESLint + Prettier
- ✅ 微信小程序 (mp-weixin)
- ✅ H5网页 (h5)
- ✅ APP (Android/iOS)
- ✅ 支付宝小程序 (mp-alipay)
- ✅ 百度小程序 (mp-baidu)
- ✅ 抖音小程序 (mp-toutiao)
- ✅ QQ小程序 (mp-qq)
src/
├── api/ # API接口封装
│ ├── account.ts # 账户相关接口
│ ├── app.ts # 应用配置接口
│ ├── chat.ts # 聊天相关接口
│ ├── drawing.ts # AI绘画接口
│ ├── member.ts # 会员相关接口
│ ├── news.ts # 资讯接口
│ ├── pay.ts # 支付接口
│ ├── promotion.ts # 推广接口
│ ├── qrcode.ts # 二维码接口
│ ├── recharge.ts # 充值接口
│ ├── redeem_code.ts # 兑换码接口
│ ├── shop.ts # 商城接口
│ ├── square.ts # 广场接口
│ ├── task.ts # 任务接口
│ └── user.ts # 用户接口
├── components/ # 公共组件
│ ├── agreement/ # 协议组件
│ ├── audio-play/ # 音频播放组件
│ ├── avatar-upload/ # 头像上传组件
│ ├── chat-plugins/ # 聊天插件组件
│ ├── chat-record-item/ # 聊天记录项组件
│ ├── chat-scroll-view/ # 聊天滚动视图
│ ├── dialog-poster/ # 海报对话框组件
│ ├── dragon-button/ # 龙形按钮组件
│ ├── drop-down/ # 下拉菜单组件
│ ├── file-upload/ # 文件上传组件
│ ├── floating-menu/ # 浮动菜单组件
│ ├── guided-popup/ # 引导弹窗组件
│ ├── l-textarea/ # 增强文本域组件
│ ├── loading/ # 加载组件
│ ├── model-picker/ # 模型选择器组件
│ ├── network-switch/ # 网络切换组件
│ ├── notice-popup/ # 通知弹窗组件
│ ├── page-app/ # 应用页面组件
│ ├── page-status/ # 页面状态组件
│ ├── payment/ # 支付组件
│ ├── price/ # 价格显示组件
│ ├── recorder/ # 录音组件
│ ├── tabbar/ # 标签栏组件
│ ├── ua-markdown/ # Markdown渲染组件
│ └── widgets/ # 小部件组件
├── config/ # 配置文件
│ └── index.ts # 应用配置
├── enums/ # 枚举定义
│ ├── agreementEnums.ts # 协议枚举
│ ├── appEnums.ts # 应用枚举
│ ├── constantEnums.ts # 常量枚举
│ └── requestEnums.ts # 请求枚举
├── hooks/ # 自定义Hooks
│ ├── useAudio.ts # 音频Hook
│ ├── useAudioPlay.ts # 音频播放Hook
│ ├── useCaptchaEffect.ts # 验证码Hook
│ ├── useCopy.ts # 复制Hook
│ ├── useLockFn.ts # 函数锁定Hook
│ ├── usePolling.ts # 轮询Hook
│ ├── useRecorder.ts # 录音Hook
│ └── useShareMessage.ts # 分享Hook
├── lib/ # 第三方库
│ ├── fft.js # 音频处理库
│ └── html2canvas.esm.js # HTML转图片库
├── pages/ # 主包页面
│ ├── ai_creation/ # AI创作页面
│ ├── app/ # 应用页面
│ ├── empty/ # 空页面
│ ├── index/ # 首页
│ ├── login/ # 登录页面
│ ├── pc_login/ # PC登录页面
│ ├── skills/ # 技能大全页面
│ ├── user/ # 用户中心页面
│ └── webview/ # 网页视图页面
├── packages/ # 分包页面
│ └── pages/
│ ├── 404/ # 404页面
│ ├── agreement/ # 协议页面
│ ├── apply/ # 申请页面
│ ├── article_detail/ # 文章详情页面
│ ├── article_list/ # 文章列表页面
│ ├── as_us/ # 关于我们页面
│ ├── cancelaccount/ # 注销账户页面
│ ├── change_password/ # 修改密码页面
│ ├── chat/ # 聊天页面
│ ├── collection/ # 收藏页面
│ ├── create/ # 创作页面
│ ├── create_history/ # 创作历史页面
│ ├── customer_service/ # 客服页面
│ ├── distribution_order/ # 分销订单页面
│ ├── drawing/ # AI绘图页面
│ ├── earnings_detail/ # 收益详情页面
│ ├── enlarge_user/ # 扩大用户页面
│ ├── feedback/ # 反馈页面
│ ├── follow_official/ # 关注公众号页面
│ ├── forget_pwd/ # 忘记密码页面
│ ├── invite_poster/ # 邀请海报页面
│ ├── mind_map/ # 思维导图页面
│ ├── open_vip/ # 开通VIP页面
│ ├── promotion_center/ # 推广中心页面
│ ├── qrcode/ # 二维码页面
│ ├── recharge/ # 充值页面
│ ├── recharge_record/ # 充值记录页面
│ ├── redeem_code/ # 兑换码页面
│ ├── register/ # 注册页面
│ ├── square/ # 绘画广场页面
│ ├── task_center/ # 任务中心页面
│ ├── team_fans/ # 团队粉丝页面
│ ├── user_set/ # 用户设置页面
│ ├── withdraw/ # 提现页面
│ └── withdraw_record/ # 提现记录页面
├── plugins/ # 插件配置
│ ├── index.ts # 插件入口
│ └── modules/ # 插件模块
├── router/ # 路由配置
│ └── index.ts # 路由入口
├── static/ # 静态资源
│ └── images/ # 图片资源
├── stores/ # 状态管理
│ ├── androidPermissions.ts # Android权限状态
│ ├── app.ts # 应用状态
│ ├── navigationBarTitle.ts # 导航栏标题状态
│ ├── theme.ts # 主题状态
│ └── user.ts # 用户状态
├── styles/ # 样式文件
│ ├── index.scss # 主样式文件
│ ├── public.scss # 公共样式
│ ├── tailwind.css # Tailwind样式
│ └── var.scss # 样式变量
├── utils/ # 工具函数
│ ├── auth.ts # 认证工具
│ ├── cache.ts # 缓存工具
│ ├── client.ts # 客户端工具
│ ├── date.ts # 日期工具
│ ├── device/ # 设备相关工具
│ ├── download.ts # 下载工具
│ ├── env.ts # 环境工具
│ ├── file.ts # 文件工具
│ ├── html2canvas.ts # HTML转图片工具
│ ├── imgPath.js # 图片路径工具
│ ├── middleware.ts # 中间件工具
│ ├── pay/ # 支付相关工具
│ ├── request/ # 请求封装
│ ├── theme.ts # 主题工具
│ ├── util.ts # 通用工具
│ ├── validate.ts # 验证工具
│ └── wechat.ts # 微信相关工具
└── uni_modules/ # UniApp模块
├── lime-painter/ # 绘画组件
├── mp-html/ # HTML渲染组件
└── vk-uview-ui/ # uView UI组件库
- 智能对话: 支持多种AI模型的智能对话
- 上下文记忆: 支持对话上下文保持
- 语音输入: 支持语音转文字输入
- 语音播报: 支持AI回复语音播报
- 收藏管理: 支持对话记录收藏
- 分类管理: 支持对话分类管理
- 使用EventStream实现流式响应
- 集成Web Speech API实现语音识别
- 支持Markdown格式渲染
- 支持代码高亮显示
// 聊天相关接口
- chatSendText: 发送文本消息
- questionChat: 问题对话
- getChatRecord: 获取聊天记录
- cleanChatContext: 清空上下文
- cleanChatRecord: 清空会话
- collectChatRecord: 收藏对话- 文生图: 根据文字描述生成图片
- 图生图: 基于参考图生成新图片
- 图片放大: 支持图片高清放大
- 图片变体: 生成图片的变体版本
- 风格选择: 支持多种绘画风格
- 模型选择: 支持多种AI绘画模型
- DALL-E 3: OpenAI最新绘画模型
- Stable Diffusion: 开源绘画模型
- 意间绘画: 中文优化绘画引擎
- Midjourney: 高质量绘画模型
// 绘画相关接口
- drawing: 生成图片
- drawingDetail: 获取绘画详情
- drawingRecord: 获取绘画记录
- drawingDelete: 删除绘画记录
- keywordPromptTranslate: 关键词翻译- 多端登录: 支持微信、手机号、邮箱登录
- 用户信息: 完整的用户资料管理
- 会员系统: VIP会员等级管理
- 账户余额: 余额充值与消费记录
- 邀请机制: 邀请好友获得奖励
- 第三方绑定: 支持微信、支付宝绑定
// 用户相关接口
- getUserInfo: 获取用户信息
- userEdit: 编辑用户信息
- userBindEmail: 绑定邮箱
- userBindMobile: 绑定手机
- accountLog: 余额明细- 微信支付: 微信小程序、H5支付
- 支付宝支付: APP、H5支付
- 余额支付: 系统内余额支付
- 兑换码: 激活码兑换会员
- 套餐管理: 多种会员套餐选择
- 订单管理: 完整的订单流程
- 支付回调: 安全的支付结果处理
- 退款机制: 支持订单退款
- 每日签到: 连续签到获得奖励
- 邀请好友: 邀请新用户获得奖励
- 首次充值: 首次充值额外奖励
- 完善信息: 完善个人资料获得奖励
- 分享应用: 分享应用获得奖励
- 积分奖励: 完成任务获得积分
- 余额奖励: 直接获得余额
- 会员时长: 获得VIP会员时长
- 绘画次数: 获得免费绘画次数
- 邀请海报: 自动生成推广海报
- 邀请码: 个人专属邀请码
- 推广统计: 实时推广数据统计
- 分佣机制: 多级分佣系统
- 提现功能: 推广收益提现
# 基础配置
VITE_APP_BASE_URL=http://your-domain.com
VITE_APP_NAME=艺创AI# 基础配置
VITE_APP_BASE_URL=https://your-domain.com
VITE_APP_NAME=艺创AIconst config = {
version: "4.5.3", // 版本号
baseUrl: "https://api.xxx.com/", // API域名
urlPrefix: "api", // API前缀
timeout: 30000, // 请求超时时间(30秒)
}- 应用信息: 名称、描述、版本号
- 平台配置: 微信小程序、APP、H5等
- 权限配置: 相机、麦克风、存储等权限
- 支付配置: 微信、支付宝支付配置
- 分享配置: 微信分享配置
- TypeScript: 严格类型检查
- ESLint: 代码质量检查
- Prettier: 代码格式化
- 命名规范: 统一使用小写+连字符命名
- 页面文件:
xxx.vue - 组件文件:
xxx/xxx.vue - API文件:
xxx.ts - 工具文件:
xxx.ts - 样式文件:
xxx.scss
- 功能模块化: 按功能模块组织代码
- 组件复用: 公共组件统一放在components
- 状态管理: 统一使用Pinia管理状态
- 路由管理: 统一使用uniapp-router-next
- 配置appid: 修改
manifest.json中的mp-weixin.appid - 配置域名: 设置request合法域名
- 上传代码: 使用HBuilderX上传
- 提交审核: 微信官方审核
- 构建项目:
npm run build:h5 - 上传文件: 将dist/build/h5目录上传到服务器
- 配置域名: 配置nginx指向h5目录
- 配置SSL: 配置HTTPS证书
- Android打包:
npm run build:app - iOS打包: 使用HBuilderX云打包
- 应用签名: 配置应用签名证书
- 应用商店: 上传到各大应用商店
- 懒加载: 页面和组件懒加载
- 分包加载: 使用分包加载减少首屏加载时间
- 图片优化: 使用WebP格式,压缩图片大小
- 缓存策略: 合理使用本地缓存
- CDN加速: 静态资源使用CDN
- 接口缓存: 合理设置接口缓存
- 请求合并: 合并多个请求
- 错误重试: 网络错误自动重试
- HTTPS通信: 所有接口使用HTTPS
- 数据加密: 敏感数据加密传输
- 权限验证: 接口权限验证
- 输入验证: 前端输入验证
- 代码混淆: 生产环境代码混淆
- 防调试: 防止代码调试
- 防篡改: 防止应用篡改
- 权限管理: 合理申请系统权限
- 新增AI绘画功能
- 优化聊天体验
- 修复已知bug
- 提升系统稳定性
- 支持更多AI模型
- 增加语音对话功能
- 优化用户界面
- 增强数据分析能力
- 产品名称: 艺创AI
- 版本号: 4.5.3
- 技术栈: UniApp + Vue3 + TypeScript
- 支持平台: 微信小程序、H5、APP
本文档最后更新时间: 2024年10月1日













