本项目立足于传统文化与东方美学消费升级场景,旨在解决传统文房文创产品在线上销售时缺乏文化沉浸感与审美叙事的问题。平台定位于面向C端文房书法爱好者、文创收藏者的垂直电商商城,聚合文房四宝、案头清供、古籍复刻三大核心品类,通过卷轴叙事与水墨意境的UI交互设计,提供沉浸式鉴赏与便捷流畅的文创选购体验。
点击空白处退出提示
语言技术
React、TypeScript系统类型
Web行业分类
电商
本项目立足于传统文化与东方美学消费升级场景,旨在解决传统文房文创产品在线上销售时缺乏文化沉浸感与审美叙事的问题。平台定位于面向C端文房书法爱好者、文创收藏者的垂直电商商城,聚合文房四宝、案头清供、古籍复刻三大核心品类,通过卷轴叙事与水墨意境的UI交互设计,提供沉浸式鉴赏与便捷流畅的文创选购体验。
项目包含前台商城与掌柜后台两大核心模块:
1. 首页与分类:卷轴叙事风格Banner、核心分类直达卡片、商品多维筛选(支持一/二/三级分类联动、关键词搜索、价格区间与排序)。
2. 商品详情与品鉴:多SKU规格选择、库存展示、墨友品鉴评价板块(支持1-5星打分、晒图与评价列表)。
3. 购物车与结算:多选/全选结算、地址管理、文创立减与满减优惠券抵扣计算、订单状态流转(待付款/待发货/待收货/已完成)。
4. 个人中心与后台:订单列表查看、我的优惠券管理、掌柜工作台(商品/分类/订单/会员全流程管理)。
1. 技术栈与架构:采用 React 18 + TypeScript + Vite + Tailwind CSS + shadcn/ui 构建,基于 React Context 实现购物车、订单、优惠券与商品数据的全局状态管理。
2. 个人负责任务与实现亮点:
- 负责商品详情页「墨友品鉴」评价系统构建,支持评分统计分布与晒图展示。
- 负责结算页优惠券抵扣闭环逻辑,实现门槛动态校验与实付金额精确计算。
- 实现首页三大文房卡片的宣纸微浮与墨晕扩散动效,提升视觉质感。
3. 攻克难点:解决了顶部导航栏在路由子分类与全部分类状态下的高亮互斥逻辑,通过 URL 参数精准比对彻底修复了多项并列高亮的联动异常。







评论