# 0622

- () range picker 中的 input, 删除之后, 日期没有被删除 (和 date picker 行为不一样)
  - (x) where
    - (x) date picker => null ?
      - onClear
      - onCustomChange
        - changeValue
      - completeUserInput
      - getDerivedStateFromProps
    - (@) handleUserInputChange
      - trimmed
  - (x) range picker 也调用了啊?
    - [](/components/date-picker/src/inner-comps/range-input-utils/create-range-field-input.tsx)
    - [](/components/date-picker/src/inner-comps/create-range-input.tsx)
  - (x) end 应可以修改
    - (x) where
    - 目前无法更改
    - (x) value
      - start < end
      - start > end
        - start
          - set empty
            - control
            - uncontrol
        - end
          - not accept
      - start only
      - end only
    - (x) display
      - (x) re-use open status' displayed control ?
      - startD, endD, start, end
      - ch sd
        - sd < ed
        - s, !e
        - !s, e
      - ch ed
    - (x) refactor?
  - (x) 需要解决单一日期的 panel 显示问题
    - (x) display where
      - setOpenStatus ?
      - (-) 原 date = null 时, 使用的 dayjs() ( 而没有用 start of month)
        - 导致后面的调整出现问题
        - (@) 但实际上, 这么处理, 也不太完善
    - cases:
      - start, end
      - start
      - end
      - all null
    - (x) 仅 start, displayed 的 end 处理
    - (x) 仅 end
      - (x) displayed start 处理
    - (x) 显示独立
      - (x) where
        - UiItemLayout
        - renderContentItem
  - (x) test
    - (x) pass
    - (x) new test
- (-) start & end
  - (-) 可能需要对调 end / start (同上的位置)
  - 最后, 使用 "end 置空" 的处理

- () 奇妙的 2020-02-31

## test 梳理

- 控制型?
  - (x) Y
    - (x) 尝试改造 & 复用 N 的场景
      - (x) render ?
      - (x) value ?
      - (x) rerender 改造
  - (x) N
- start
  - (x) 初始
  - (x) 不触发 end 置空
  - (x) start 删除
  - (x) 触发 end 置空
- end
  - (x) 初始
  - (x) 不触发 end 置空
  - (x) 未 blur 前不置空
  - (x) end 删除
  - (x) end 重置
  - (x) end 置空
    - (x) blur 前
    - () blur 后的值?
- 确保最后 test ok
- (@) 将 expect 的 检测封装, 未必是好事情
- (@) 使用变量, 也未必是好的? (不易定位)

## 设计梳理

- 将 range picker 中的几个关键状态记为
  - sD => 面板开始区域显示时间
  - eD => 面板结束区域显示时间
  - S => 开始时间
  - E => 结束时间
  
- 那么, 理论上, 以上状态可能的更改状态应有如下几种可能
  - panel title 的切换 (如前一个月)
    - components/date-picker/src/modules/create-date-switcher.tsx
      - goBackwardYear 等...
    - => sD, eD
  - input (start / end) 中直接修改
    - => sD, eD, S, E
  - 面板中手选
    - => S, E
  - clear button 点击
    - => S, E
  - props 传入 S, E
    - => S, E, sD, eD
  - 打开面板时的信息同步 => 
    - 有值时, 需要保证 sD, eD 能覆盖到值, 
    - 但无值时, 在 v0.2 下, 可设置默认 range
    - => sD, eD
  - v0.2 props 传入面板默认显示
    - v0.1 暂不更新此能力
    - => sD, eD

### 关注 a. input 的输入同步

- 这个应该是出现的处理分支最多的场景
  - input 修改, 可能修改的是 : 
    - start
    - end
  - start, end 被修改之后, 应符合如下规则
    - E 不应小于 S
      - 如出现以上情况, 
        - 修改 start 时, 则 : 置空 E
        - 修改 end 时, 则 : 拒绝修改 (或考虑统一? 这样可以统一处理)
    - 否则, 按正常更新 S, E
    - sD, eD 应能显示 S, E
    - sD, eD 不能相同
    - sD, eD 顺序不能错乱, 必须 sD < eD
    - 如果 S && !E, 则 sD = S.startOf(month), eD = sD + 1 month
    - 如果 !S && E, 则 eD = E.startOf(month), sD = eD - 1 month
    - 如果 !S && !E, 则 :
      - v0.1 => sD = now.startOf(month), eD = sD + 1 month
      - v0.2 => 考虑默认的面板范围, 否则遵循 v0.1 的逻辑
      

### 关注 b. clear button

- 相对简单, 实际上, 不需要调整 sD, eD
  - 仅需要保证 S, E 设置为 null 即可

# future

- (@) 很有意思的点.. 0.1 => 0.2 ( api 兼容问题 )