feat: 建档改成三步向导页，品种改成后台可配的选择器
## pages/petform 三步向导
① 名字 + 传头像
② 猫还是狗 → 选品种
③ 性别 / 生日 / 到家日期 / 体重 / 毛色 / 阶段
**编辑时不分步**，一屏全放开：用户是来改某一项的，不该被按顺序走一遍。
同一个页面两种形态，靠 ?id= 区分。
每一步只校验这一步的东西。三步全填完才校验的话，用户在第三步才被告知
第一步没填名字，还得翻回去。
进度条没用 seg-tabs：那是「可以随意切」的语义，这里有顺序，
点第三步跳过前两步会拿到一份没名字的档案。
## 生日和到家日期分开
原来是一个「生日 / 到家时间」字段。领养的成年猫狗生日常常是不知道的，
而「一起生活了多少天」要按到家日算——合成一个字段两件事都说不准。
验过：到家 4 个月前 → 第 121 天；按生日算会是 801 天。
模型里 Birthday 和 ArrivedAt 本来就是两个字段，只是表单没露出来。
## 品种：自由文本 → 后台可配的选择器
原来品种是个输入框，用户手打「柯基」「柯基犬」「威尔士柯基」算三个品种，
以后想按品种做体重基准、常见病提示这类事就没法做。
新增 breeds 表，预置 34 种猫 + 45 种狗，按首字母分组、右侧 A-Z 索引跳转、
首字母吸顶。留了「不确定」——领养的串串确实说不出品种，逼着选一个只会
得到假数据。换物种会清掉已选品种（原来那个一定不对了）。
**首字母存字段不运行时算**：Go 没有标准拼音库，而多音字自动转常出错——
「藏獒」按 cang 还是 zang 分组、「柴犬」的柴，人来定比库来猜靠谱。
后台新增品种时手填这一位，服务端校验必须是单个 A-Z。
已有档案在用的品种不许删（删了那些档案的品种就变成查不到的字符串），
想隐藏用 enabled=false。同物种下不许重名——品种是统计口径，重名会把
同一种猫劈成两半。
预置数据自己填错了两条，实跑时看出来的：「苏格兰柯利犬」我按「柯利」
填了 K，应该按「苏格兰」算 S；「双血统边牧」根本不是品种，是血统描述。
seed 源和库里都改了。
## 弹层继续瘦
addPet/editPet 两支删掉，连带 10 个方法、ageFromBirthday/GENDERS/STAGES
和 5 个 add* 字段。累计（从记录表单搬走那次算起）：
js 1110 → 734 行
wxml 485 → 307 行
多宠管理里「点某只去编辑」原来是 setType('editPet')，那支没了会开一个
空白弹层——改成关弹层再跳页。8 个页面的入口全换完，grep 无残留。
## 验证（预生产库实跑）
品种接口 猫 34 种 16 个首字母、狗 45 种 17 个首字母；非法 species 返回 []
建档 生日 / 到家日期 分别落库，品种毛色阶段都对
编辑 只改名字，到家日期没被冲掉
修正 柯利犬 K→S、双血统边牧已删
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Blizzard
@@ -0,0 +1,86 @@
|
||||
.pf-body{padding-bottom:calc(200rpx + env(safe-area-inset-bottom))}
|
||||
|
||||
/* 三步进度条。不用 seg-tabs：那是「可以随意切」的语义，
|
||||
这里是有顺序的，点第三步跳过前两步会拿到一份没名字的档案 */
|
||||
.pf-steps{
|
||||
flex:none;display:flex;align-items:flex-start;justify-content:center;
|
||||
gap:var(--sp-6);padding:var(--sp-3) var(--pad-x) var(--sp-4);
|
||||
}
|
||||
.pf-step{display:flex;flex-direction:column;align-items:center;gap:6rpx}
|
||||
.pf-dot{
|
||||
width:48rpx;height:48rpx;border-radius:50%;
|
||||
display:flex;align-items:center;justify-content:center;
|
||||
background:#fff;border:1rpx solid var(--line);
|
||||
color:var(--muted2);font-size:var(--fs-sm);font-weight:var(--fw-b);
|
||||
}
|
||||
.pf-slabel{font-size:var(--fs-cap);color:var(--muted2)}
|
||||
.pf-step.on .pf-dot{background:var(--primary);border-color:var(--primary);color:#fff}
|
||||
.pf-step.on .pf-slabel{color:var(--primary-dark);font-weight:var(--fw-b)}
|
||||
|
||||
.pf-h{font-size:var(--fs-lg);font-weight:var(--fw-b);margin-bottom:var(--sp-4)}
|
||||
|
||||
/* 头像 */
|
||||
.pf-av-wrap{display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-5)}
|
||||
.pf-av{
|
||||
width:176rpx;height:176rpx;border-radius:50%;overflow:hidden;
|
||||
background:var(--primary-soft);color:var(--primary-dark);
|
||||
display:flex;align-items:center;justify-content:center;
|
||||
}
|
||||
.pf-av-img{width:100%;height:100%}
|
||||
.pf-av-tip{font-size:var(--fs-cap);color:var(--primary-dark)}
|
||||
|
||||
/* 猫 / 狗 */
|
||||
.pf-species{display:flex;gap:var(--sp-3);margin-bottom:var(--sp-4)}
|
||||
.pf-sp{
|
||||
flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);
|
||||
padding:var(--sp-5) 0;border-radius:var(--r-md);
|
||||
background:var(--surface-2);border:2rpx solid var(--line);
|
||||
color:var(--muted);font-size:var(--fs-md);
|
||||
}
|
||||
.pf-sp.on{background:var(--primary-soft);border-color:var(--primary);color:var(--primary-ink);font-weight:var(--fw-b)}
|
||||
.pf-empty{color:var(--muted2)}
|
||||
|
||||
/* 底部按钮 */
|
||||
.pf-foot{
|
||||
position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:var(--sp-3);
|
||||
padding:var(--sp-4) var(--pad-x) calc(var(--sp-4) + env(safe-area-inset-bottom));
|
||||
background:#fff;box-shadow:0 -12rpx 32rpx rgba(70,48,25,.06);
|
||||
}
|
||||
.pf-back{flex:none;width:200rpx}
|
||||
.pf-next{flex:1}
|
||||
.pf-busy{opacity:.6}
|
||||
|
||||
/* 品种选择器 */
|
||||
.pf-mask{position:fixed;inset:0;z-index:200;background:rgba(45,41,37,.45);display:flex;align-items:flex-end}
|
||||
.pf-sheet{
|
||||
width:100%;background:var(--bg2);border-radius:var(--r-lg) var(--r-lg) 0 0;
|
||||
padding:var(--sp-5) 0 calc(var(--sp-3) + env(safe-area-inset-bottom));
|
||||
box-shadow:var(--sd-3);
|
||||
}
|
||||
.pf-sheet-h{
|
||||
display:flex;align-items:center;justify-content:space-between;
|
||||
padding:0 var(--pad-x) var(--sp-4);
|
||||
font-size:var(--fs-lg);font-weight:var(--fw-b);
|
||||
}
|
||||
.pf-breed-wrap{display:flex;height:60vh}
|
||||
.pf-breed-list{flex:1;min-width:0;padding-left:var(--pad-x)}
|
||||
/* 首字母吸顶：滚长列表时得知道现在在哪一段 */
|
||||
.pf-bi{
|
||||
position:sticky;top:0;z-index:1;
|
||||
background:var(--bg2);color:var(--primary-dark);
|
||||
font-size:var(--fs-sm);font-weight:var(--fw-b);padding:var(--sp-2) 0;
|
||||
}
|
||||
.pf-brow{
|
||||
padding:var(--sp-3) 0;font-size:var(--fs-md);color:var(--text);
|
||||
border-bottom:1rpx solid var(--line);
|
||||
}
|
||||
.pf-brow.on{color:var(--primary-dark);font-weight:var(--fw-b)}
|
||||
/* 右侧 A-Z 索引 */
|
||||
.pf-index{
|
||||
flex:none;width:56rpx;display:flex;flex-direction:column;
|
||||
align-items:center;justify-content:center;gap:2rpx;
|
||||
}
|
||||
.pf-ichar{
|
||||
font-size:var(--fs-cap);color:var(--muted);
|
||||
padding:2rpx 8rpx;line-height:1.4;
|
||||
}
|
||||
Reference in New Issue
Block a user