const store = require('../../utils/store.js'); const api = require('../../utils/api.js'); const upload = require('../../utils/upload.js'); const { toastErr } = require('../../utils/ui.js'); const GENDERS = ['男孩', '女孩', '不确定']; // 阶段列表和划分标准都从后端来。原来这里写死 4 个,后端细分成 5 段 // (而且狗还按体型走不同阈值)之后就对不上了 —— 而且不会报错,只是少两个选项。 // 「刚到家 0-30 天」在后端列表的第一个,它和年龄正交,是叠加层 function pad2(n) { return n < 10 ? '0' + n : '' + n; } function ymd(d) { return d.getFullYear() + '-' + pad2(d.getMonth() + 1) + '-' + pad2(d.getDate()); } function monthsSince(bday) { const b = new Date(String(bday).slice(0, 10) + 'T00:00:00'); if (isNaN(b.getTime())) return -1; const n = new Date(); const m = (n.getFullYear() - b.getFullYear()) * 12 + (n.getMonth() - b.getMonth()); return m < 0 ? 0 : m; } function ageLabel(bday) { const m = monthsSince(bday); if (m < 0) return ''; return m < 24 ? m + '个月' : Math.floor(m / 12) + '岁'; } // 和后端 service.StageFromBirthday 一套口径:<12 月幼年,>=7 年老年,其余成年。 // 前端算是为了在用户填完生日时就给出建议值,最终仍以用户选的为准 function stageFromBirthday(bday) { const m = monthsSince(bday); if (m < 0) return ''; if (m < 12) return '幼年期'; if (m >= 84) return '老年期'; return '成年期'; } Page({ data: { editing: false, petId: '', step: 0, steps: ['名字', '品种', '资料', '方案'], genders: GENDERS, stages: [], stageRules: [], stageBasis: '', sizeLabel: '', today: '', stageAuto: '', form: { name: '', avatar_file_id: '', avatar_url: '', species: 'cat', breed: '', gender: '不确定', birthday: '', arrived_at: '', weight: '', color: '', stage: '', // 第四步挑的方案。'' 是「先空着自己排」,不是「没选」—— // 所以初始值给 null,用来区分「还没走到第四步」 template_id: null, }, tplOptions: [], breedShow: false, breedGroups: [], breedAnchor: '', saving: false, }, onLoad(q) { this.setData({ today: ymd(new Date()) }); this.loadStages(); const id = (q && q.id) || ''; if (!id) return; // 编辑:不分步,一屏全放开——用户是来改某一项的,不该被按顺序走一遍 store .ready() .then(() => { const p = (store.getPets() || []).find((x) => x.id === id) || store.getPet() || {}; this.setData({ editing: true, petId: id, form: { name: p.name || '', avatar_file_id: '', avatar_url: p.avatar_url || '', species: p.type === '狗狗' ? 'dog' : 'cat', breed: p.breed || '', gender: GENDERS.indexOf(p.gender) >= 0 ? p.gender : '不确定', birthday: p.birthday ? String(p.birthday).slice(0, 10) : '', arrived_at: p.arrived_at ? String(p.arrived_at).slice(0, 10) : '', weight: (p.weight || '').replace('kg', ''), color: p.color || '', stage: p.stage || '', }, }); }) .catch((e) => toastErr(e)); }, onName(e) { this.setData({ 'form.name': e.detail.value }); }, pickAvatar() { upload .chooseAndUploadImage() .then((f) => this.setData({ 'form.avatar_file_id': f.id, 'form.avatar_url': f.url })) .catch((e) => { if (e && e.canceled) return; toastErr(e, '上传失败'); }); }, pickSpecies(e) { const sp = e.currentTarget.dataset.sp; if (sp === this.data.form.species) return; // 换了物种,原来选的品种一定不对了 this.setData({ 'form.species': sp, 'form.breed': '', breedGroups: [] }); this.loadStages(); }, pickGender(e) { this.setData({ 'form.gender': e.currentTarget.dataset.v }); }, pickStage(e) { const v = e.currentTarget.dataset.v; this.setData({ 'form.stage': v, stageBasis: this.basisOf(v) }); }, basisOf(stage) { const r = (this.data.stageRules || []).find((x) => x.stage === stage); return r ? r.range + ' · ' + r.basis : ''; }, // 阶段的划分标准要按物种和体型取:同样 10 个月,吉娃娃已经是青年期, // 大丹犬还在幼年期。体型从选中品种的 size_class 来 loadStages() { const f = this.data.form; let size = ''; (this.data.breedGroups || []).forEach((g) => g.items.forEach((b) => { if (b.name === f.breed) size = b.size_class || ''; }), ); api .lifeStages(f.species, size) .then((d) => { const rules = (d && d.stages) || []; this.setData({ stageRules: rules, // 阶段选项 = 「刚到家」+ 五个年龄段。刚到家是叠加层,后端的 // CareStages 里也在第一个,这里保持一致 stages: ['刚到家 0-30 天'].concat(rules.map((r) => r.stage)), sizeLabel: (d && d.sizes && d.sizes[size]) || '', stageBasis: this.basisOf(f.stage), }); }) .catch(() => {}); }, onBirthday(e) { const v = e.detail.value; const auto = stageFromBirthday(v); const patch = { 'form.birthday': v, stageAuto: auto }; // 用户还没手选过阶段就跟着生日走;选过就不动他的选择 if (auto && !this.data.form.stage) { patch['form.stage'] = auto; patch.stageBasis = this.basisOf(auto); } this.setData(patch); }, onArrived(e) { this.setData({ 'form.arrived_at': e.detail.value }); }, onWeight(e) { this.setData({ 'form.weight': e.detail.value }); }, onColor(e) { this.setData({ 'form.color': e.detail.value }); }, // ── 品种选择器 ── openBreed() { this.setData({ breedShow: true }); if (this.data.breedGroups.length) return; api .breeds(this.data.form.species) .then((groups) => this.setData({ breedGroups: groups || [] })) .catch((e) => toastErr(e)); }, closeBreed() { this.setData({ breedShow: false }); }, noop() {}, pickBreed(e) { this.setData({ 'form.breed': e.currentTarget.dataset.name, breedShow: false }); this.loadStages(); // 换了品种可能换了体型,阶段阈值跟着变 }, clearBreed() { // 「不确定」要留:领养的串串确实说不出品种,逼着选一个只会得到假数据 this.setData({ 'form.breed': '', breedShow: false }); }, jumpInitial(e) { this.setData({ breedAnchor: 'bi-' + e.currentTarget.dataset.i }); }, loadTemplates() { const f = this.data.form; api .careTemplates(f.species, f.stage) .then((opts) => { const list = opts || []; this.setData({ tplOptions: list, // 默认选第一套:多数用户是新手,给一个合理默认比让他面对空白好。 // 但「先空着」就在下面,一眼能看到,不是藏起来的 'form.template_id': list.length ? list[0].id : '', }); }) .catch(() => this.setData({ tplOptions: [], 'form.template_id': '' })); }, pickTemplate(e) { this.setData({ 'form.template_id': e.currentTarget.dataset.id }); }, // ── 分步 ── prev() { if (this.data.step > 0) this.setData({ step: this.data.step - 1 }); }, // 每一步只校验这一步的东西。三步全填完才校验的话,用户在第三步才被告知 // 第一步没填名字,还得翻回去 stepError() { const f = this.data.form; if (this.data.step === 0 && !f.name.trim()) return '先给它起个名字'; if (this.data.step === 1 && !f.species) return '选一下是猫还是狗'; if (this.data.step === 2 && !f.stage) return '选一下现在是哪个阶段 —— 方案是按阶段配的'; return ''; }, next() { if (this.data.saving) return; if (!this.data.editing) { const err = this.stepError(); if (err) return wx.showToast({ title: err, icon: 'none' }); if (this.data.step < 3) { const next = this.data.step + 1; this.setData({ step: next }); if (next === 3) this.loadTemplates(); // 方案按阶段取,得等第三步填完 return; } } else if (!this.data.form.name.trim()) { return wx.showToast({ title: '名字不能空', icon: 'none' }); } this.submit(); }, body() { const f = this.data.form; const isDog = f.species === 'dog'; const body = { name: f.name.trim(), type: isDog ? '狗狗' : '猫猫', // emoji 是老字段,列表和海报还在用它兜底;有头像时它不显示 emoji: isDog ? '🐶' : '🐱', gender: f.gender, birthday: f.birthday, arrived_at: f.arrived_at, weight: f.weight, color: f.color.trim(), breed: f.breed, stage: f.stage || stageFromBirthday(f.birthday) || '成年期', age: ageLabel(f.birthday), }; // 没重新传头像就不带这个字段,别把已有头像覆盖成空 if (f.avatar_file_id) body.avatar_file_id = f.avatar_file_id; return body; }, submit() { this.setData({ saving: true }); const b = this.body(); const tplID = this.data.form.template_id; const req = this.data.editing ? api.updatePet(this.data.petId, b) : api.createPet(b); req // 套方案要等档案建出来才有 pet id。套用失败不算建档失败—— // 档案已经建好了,方案之后在计划页还能套,不该把用户退回表单 .then((pet) => { if (this.data.editing || !tplID || !pet || !pet.id) return; return api.applyTemplate(pet.id, tplID, 0).catch(() => {}); }) .then(() => store.loadPets()) .then(() => { this.setData({ saving: false }); wx.showToast({ title: this.data.editing ? '已保存' : '建好啦', icon: 'success' }); setTimeout(() => wx.navigateBack(), 700); }) .catch((e) => { this.setData({ saving: false }); toastErr(e, '保存失败'); }); }, });