返回首页

程序员技师 · 码力SPA

表面是按摩预约,实际是程序员上门服务

uni-app Vue 3 H5 / 小程序 / App

🚀 立即下载体验

下载 Android 安装包,在手机上体验完整预约流程

当前仅提供 Android APK,iOS 暂未开放

安装时如提示「未知来源」,请在系统设置中允许来自此浏览器的应用安装

💡 产品理念

码力SPA 借鉴上门按摩/SPA 类 App 的交互与视觉,将「技师」替换为「程序员」,将「按摩项目」替换为「编程技术服务」,用轻松幽默的方式呈现完整的预约下单流程。

按摩 App 概念码力SPA 真实含义
技师程序员(全栈、前端、后端、架构师等)
肩颈放松、足疗代码 Review、Bug 排查、架构梳理
预约上门预约远程/现场技术支持
服务套餐按小时计费的编程服务包

适合作为 uni-app 练手项目、创意 Demo,或团队内部趣味展示。

核心功能

🏠 首页

定位与搜索、活动轮播、服务项目九宫格(Bug 排查、性能优化、代码 Review 等)、热门套餐横向滑动、推荐技师快捷入口。

👨‍💻 技师(程序员列表)

按姓名、技能搜索;按前端/后端/全栈/架构/运维/AI 筛选;支持综合、可预约、好评、价格排序。卡片展示评分、接单量、技能标签、时薪与预约状态。

📋 技师详情 & 预约

个人简介与擅长项目、服务项目选择(按摩名与真实服务名对照)、用户评价、收藏技师。预约弹窗支持选时间、填地址、写备注并确认下单。

📦 订单

全部/待服务/服务中/已完成 Tab;取消预约、联系技师、再来一单、星级评价;订单详情含状态、服务信息与进度展示。

👤 我的

个人资料与会员、预约/消费/积分统计、收藏技师、优惠券、服务地址管理(增删改、默认地址)、设置中心等。

🧑‍💻 内置技师示例

  • 张全栈 — 全栈开发,擅长 Bug 排查与代码 Review
  • 李前端 — Vue / 小程序 / UI 还原
  • 王架构 — 系统架构与技术选型
  • 赵后端 — Java / MySQL / 接口开发
  • 陈运维 — DevOps / 部署上线 / 故障恢复
  • 刘算法 — Python / AI / 算法优化

🛠 技术栈简介

  • 核心框架:uni-app + Vue 3 (Composition API)
  • 样式: 原生 CSS(rpx 适配)
  • 数据: 本地 Mock + uni.storage
  • 运行端: H5 / Android / iOS / 微信等小程序

🎨 界面风格

主色深紫 #1a1a2e + 品牌紫 #6c5ce7,强调色珊瑚橙 #e17055。卡片式列表 + 底部 Tab(首页 / 技师 / 订单 / 我的)。

码力SPA = 按摩 App 的皮 + 程序员服务的骨。下单肩颈放松,来的却是帮你改 Bug 的工程师。

常见问题

为什么导航栏写的是「技师」?

刻意保留按摩 App 的文案风格;列表与详情中会有提示说明技师实为程序员。

订单数据会同步到云端吗?

当前为纯前端 Demo,数据仅存本机。清除应用数据后订单会丢失。

如何清空数据重新体验?

在「我的 → 设置」中清除缓存,或卸载重装 App。

🤖 AI助手
唱片封面