# 电影购票选座表空间规划方案
## 一、基础布局设计
1. **影厅座位分布**
- 按实际影厅比例还原座位排列(阶梯式/平层式)
- 标注屏幕位置(顶部居中)
- 区分不同区域(普通座/情侣座/VIP区)
2. **坐标体系**
- 行号:字母标识(A-Z)
- 列号:数字标识(1-N)
- 示例:`B12` = 第B行第12列
## 二、空间适配原则
1. **响应式设计**
- PC端:固定宽高比例(建议16:9)
- 移动端:自适应屏幕宽度
- 最小可操作单元:≥30×30px
2. **缩放机制**
- 支持手势/滚轮缩放
- 默认显示完整座位表
- 局部放大保留相邻3排座位可见
## 三、视觉优化方案
1. **状态标识系统**
diff
+ 可选座位:绿色边框
- 已售座位:红色填充
! 锁定座位:灰色斜线
* 选中座位:金色高亮
2. **辅助视觉元素**
- 最佳观影区虚线框标注
- 过道标识(浅灰色条纹)
- 实时座位计数显示
## 四、交互逻辑设计
1. **操作流程**
加载座位表 → 缩放调整 → 点选座位 → 确认选择 → 生成订单
2. **容错机制**
- 误触撤销功能(双击取消)
- 跨区选座警示提示
- 10秒未操作自动复位
## 五、数据结构映射
javascript
// 示例数据结构
{
"screen": "IMAX厅",
"layout": [
{
"row": "A",
"seats": [
{"col": 1, "type": "normal", "status": "available"},
{"col": 2, "type": "disabled", "status": "sold"}
]
}
]
}
> **特殊场景处理**:
> - 情侣座合并单元格处理
> - 残障席位特殊标识
> - 临时加座动态插入逻辑