06 · 开发 · 四种失败
接口说了原因，页面只剩一个失败
前端工程师把待办、错误和状态做成操作者能看懂的界面，业务拒绝不能只显示失败。他不在浏览器里改库存。
前端工程师对「人能否看懂下一步」负责
后端返回错误码和状态，前端工程师把它变成操作者能行动的界面。岗位特点不是把设计稿还原那么简单，而是不吞信息。业务拒绝、系统故障、无权限、列表为空，四种情况如果都显示「失败」或「暂无数据」，人只能打电话。达希的前端要求错误原文或约定的人话出现在任务旁边，并保留单据还停在哪个状态。
他不在浏览器里改数量账。输入可以先改本地，提交结果必须以服务端为准。乐观更新如果让界面先显示已提交、刷新后变回去，现场会出现两个人重复点。权限同样不能只靠隐藏按钮。按钮可以藏，但直接访问地址时要显示无权限，而不是空白页。扫码枪把字符打进哪一格，由兼容性用验收设备证明，前端按缺陷改焦点，不把那把枪写成自己的主实验。
列表、详情和提交是三种任务
订货列表要能按门店和状态筛，默认把待办放在最前，截单被拒的单不能沉到分页最后。详情里主按钮只有一个，次要动作收起。加载中要挡住重复提交。转圈时按钮如果还能点，连点会变成后端的幂等问题。前端防重复是体验，后端幂等是正确性，两层都要有，前端不能声称自己防过了所以服务端不用做。
订货列表把截单画成失败的那次
订货接口对截单后提交返回了明确原因和「已锁定」状态。页面捕获异常后统一提示「提交失败」，列表仍显示待提交。店长又点了一次。前端工程师按接口契约改了四处，对应四种失败：截单是业务拒绝，行内显示原因和已锁定，不再当异常吞掉；服务超时显示系统故障，允许按同一张单重试；无权限看别店时给无权限，不给空列表；今日无单才是空状态，并说明不是权限问题。提交中按钮禁用直到返回；成功只改状态条，不弹必须点掉的窗。
设计走查时 UI 要求原因用危险色。前端从设计系统的令牌取色，不写死一个红色值。后端工程师改错误结构时，前端用契约测试拦住字段消失。列表按待办优先级排：待修改、待提交、已锁定。已完成默认收起。店长打开页面第一眼看见的是要动手的单。没有权限的人不能从空列表里创建别店的草稿。提交中被刷新打断，重新打开要问服务端这张单的状态，不从浏览器内存里恢复一个过期的成功。截单前十分钟，列表顶部要能看见本店还剩多久，而不是点提交才告诉人已锁定。倒计时取服务端时间，不取手机时钟。弱网下先出骨架再出原因，不先出空白再出失败。店长横屏看订货时，行内原因不能被挤到屏外。已锁定的行不允许再点提交。按钮还在，会有人连点；按钮消失却不写原因，店长会以为是自己的网。前端把原因钉在这一行，分页翻走再回来还在。契约测试只拦字段，拦不住把原因藏进必须点开的详情。本岗的完成是列表上就能行动。