diff --git a/index.html b/index.html index ff02c90..ce93b25 100644 --- a/index.html +++ b/index.html @@ -7,7 +7,7 @@ 兜爸心选 · 孕育陪伴 - + @@ -2038,6 +2038,8 @@ 加载失败/离线时 window.wx 为 undefined,goMall() 会降级为 toast 提示, 不影响应用其余功能。 --> + + diff --git a/js/app.js b/js/app.js index 8c1912b..8a1e34a 100644 --- a/js/app.js +++ b/js/app.js @@ -3,7 +3,7 @@ (function () { 'use strict'; /* 页面版本号(YYMMDD+序号):显示在「关于兜爸心选」页底部;bump 时同步 head 注释与 ?v= */ - var VER = '26101026'; + var VER = '26101027'; const $ = (s, c) => (c || document).querySelector(s); const $$ = (s, c) => Array.from((c || document).querySelectorAll(s)); @@ -1214,6 +1214,7 @@ }; } + let pickedAvatar = ''; /* 孕期档案里从头像面板选中的正式 URL,见 openAvatarPanel */ const pgName = $('#pgName'), pgDue = $('#pgDue'), pgWeek = $('#pgWeek'), pgDay = $('#pgDay'), pgHint = $('#pgHint'); @@ -1255,6 +1256,7 @@ /* 打开资料弹窗时的表单回填:全部以服务端档案为准(最后写入者胜)。 新用户(未完善资料):昵称/小名/预产期/孕周全空 + 孕周锁定,只留 placeholder。 */ function fillProfileForm() { + pickedAvatar = ''; $('#pfName').value = state.userName || ''; /* 方案A(2026-10-10):未授权 → 妈妈栏换成授权提示,旧昵称/头像不露出 */ var _ua = state.authorized === false; @@ -1870,12 +1872,29 @@ /* 点大圆 → 转交给隐藏的 file input。openModal 里会 focus 第一个输入框, 这里 avFile 排在 pfName 前面,所以 openModal 用的选择器只取 .modal-ta/input 可能命中 file input——用 :not([type=file]) 排除掉,见 openModal */ - avBig.addEventListener('click', e => { e.stopPropagation(); avFile.click(); }); + /* 2026-10-11 用户:点头像弹预设选项,也能从相册上传、用微信头像 → 走统一头像面板 avatarPicker + (/_bridge/avatar-picker.js:选完自己上传、写回共享资料、派发 mmbox:avatar)。 + 选中的是正式 URL,记在 pickedAvatar,保存时一起 PUT 进首页档案;面板没加载上才退回系统选图。 */ + function openAvatarPanel() { + if (window.avatarPicker && window.avatarPicker.open) { + window.avatarPicker.open({ + current: avBig.classList.contains('has-img') ? avPreview.src : '', + accent: '#F4593C', accentSoft: '#FDECE7', + onPick: function (url) { + pickedAvatar = url; + avFile.value = ''; + avPreview.src = url; avBig.classList.add('has-img'); + haptic(); + } + }); + } else avFile.click(); + } + avBig.addEventListener('click', e => { e.stopPropagation(); openAvatarPanel(); }); /* 孕期档案里头像是一整行,点行上任何地方都换头像 */ const pfMeRow = $('#pfMe'); if (pfMeRow) { - pfMeRow.addEventListener('click', e => { if (e.target !== avFile) avFile.click(); }); - pfMeRow.addEventListener('keydown', e => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); avFile.click(); } }); + pfMeRow.addEventListener('click', e => { if (e.target !== avFile) openAvatarPanel(); }); + pfMeRow.addEventListener('keydown', e => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); openAvatarPanel(); } }); } avFile.addEventListener('change', () => { @@ -1885,6 +1904,7 @@ if (f.size > 8 * 1024 * 1024) { toast('图片太大了,换一张小于 8MB 的'); return; } const r = new FileReader(); /* 读成 data URI 就地预览:产物是单文件、没有后端,不做真正的上传 */ + pickedAvatar = ''; r.onload = () => { avPreview.src = r.result; avBig.classList.add('has-img'); haptic(); }; r.onerror = () => toast('这张图读不出来,换一张试试'); r.readAsDataURL(f); @@ -1967,7 +1987,12 @@ }); } var newAvatarFile = (avFile.files && avFile.files[0]) || null; - if (newAvatarFile && avBig.classList.contains('has-img')) { + if (pickedAvatar && !_unauth) { + /* 头像面板选的已经是正式 URL(预设图 / 面板自己上传过),直接写 */ + $('#meAvatar').classList.add('has-img'); + _putProfile(pickedAvatar); + pickedAvatar = ''; + } else if (newAvatarFile && avBig.classList.contains('has-img')) { var fd = new FormData(); fd.append('file', newAvatarFile, newAvatarFile.name || 'avatar.png'); fetch('/api/upload', { method: 'POST', body: fd }) diff --git a/mama-box.css b/mama-box.css index 0b07e4e..0539f87 100644 --- a/mama-box.css +++ b/mama-box.css @@ -4838,9 +4838,12 @@ a.skip:focus{left:16px;top:16px} .pk-alt{margin-top:12px;font-size:12.5px;color:var(--muted);text-decoration:underline;text-underline-offset:3px} /* 「我的」页兜豆兑换条:余额右侧大号显示(2026-10-11),数字用品牌橘、单位淡色小字,后面跟箭头 */ -.ms-bal{flex:none;display:flex;align-items:baseline;gap:3px;color:var(--brand)} -.ms-bal b{font-size:24px;font-weight:900;letter-spacing:-.5px;line-height:1;font-variant-numeric:tabular-nums} -.ms-bal small{font-size:12px;font-weight:700;color:var(--ink-2)} -.ms-bal::after{content:"›";margin-left:4px;font-size:19px;line-height:1;color:#C9BFB8;align-self:center} +/* 兜豆条是半透明磨砂卡,压在「我的」页暖粉渐变上,橘色数字直接写会和底色糊在一起 → + 放进一颗实心品牌橘胶囊、白字,和背景拉开(2026-10-11 用户:「跟后面的背景色靠色了」) */ +.ms-bal{flex:none;display:flex;align-items:center;gap:4px;padding:6px 8px 6px 12px;border-radius:99px; + background:linear-gradient(135deg,#FF7A55,var(--brand));color:#fff;box-shadow:0 6px 14px rgba(244,89,60,.28)} +.ms-bal b{font-size:19px;font-weight:900;letter-spacing:-.3px;line-height:1;font-variant-numeric:tabular-nums} +.ms-bal small{font-size:11.5px;font-weight:700;color:rgba(255,255,255,.88)} +.ms-bal::after{content:"›";margin-left:2px;font-size:17px;line-height:1;color:rgba(255,255,255,.9)} .ms-bal.hide,.ms-go.hide{display:none}