我的资料: 预产期空值占位「- 年 - 月 - 日」(原生date不支持placeholder, 叠加文字层) (v26090729)

index.html

@@ -6,8 +6,8 @@
 <meta name="theme-color" content="#F4593C">
 <meta name="apple-mobile-web-app-capable" content="yes">
 <title>妈妈盒子 · 孕育陪伴</title>
-<!-- V:26090728 缓存版本标记：改 css/js 时同步 bump 该值，并给下方资源引用加 ?v= 以强制 webview 刷新子资源 -->
+<!-- V:26090729 缓存版本标记：改 css/js 时同步 bump 该值，并给下方资源引用加 ?v= 以强制 webview 刷新子资源 -->
-<link rel="stylesheet" href="mama-box.css?v=26090728">
+<link rel="stylesheet" href="mama-box.css?v=26090729">
 <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
 </head>
 <body>
@@ -1746,7 +1746,9 @@
     </div>
     <!-- 预产期排在孕周前面：它是「源」，填了才解锁下面两格。
          默认值不写死在标记里 —— 由 JS 按「打开这一刻 + 3 个月」现算 -->
-    <label class="fld"><span>预产期</span><input id="pgDue" type="date"></label>
+    <!-- 原生 date 空值时是一片空白（不支持 placeholder），叠一层文字占位：
+         有值由 JS 隐藏（fillProfileForm / pgDue change 都会调 syncDuePh） -->
+    <label class="fld fld-date"><span>预产期</span><input id="pgDue" type="date"><span class="date-ph" id="pgDuePh">- 年 - 月 - 日</span></label>
     <div class="fld-row">
       <!-- 孕周/天数由预产期自动算出，打开时按档案回填；新用户留空并锁定 -->
       <label class="fld"><span>当前孕周</span><input id="pgWeek" type="number" min="0" max="42" placeholder="—" disabled></label>
@@ -1769,8 +1771,8 @@
      加载失败/离线时 window.wx 为 undefined，goMall() 会降级为 toast 提示，
      不影响应用其余功能。 -->
 
-<script src="js/app.js?v=26090728"></script>
+<script src="js/app.js?v=26090729"></script>
-<!-- 页面版本号(排查 webview 缓存)：底部会显示 v26090728 -->
+<!-- 页面版本号(排查 webview 缓存)：底部会显示 v26090729 -->
-<div id="ver" style="position:fixed;left:0;right:0;bottom:10px;text-align:center;z-index:9999;pointer-events:none;color:#B3A69C;font-size:10px;letter-spacing:.5px">v26090728</div>
+<div id="ver" style="position:fixed;left:0;right:0;bottom:10px;text-align:center;z-index:9999;pointer-events:none;color:#B3A69C;font-size:10px;letter-spacing:.5px">v26090729</div>
 </body>
 </html>

js/app.js

@@ -1789,6 +1789,7 @@
       pgDay.value = '';
       lockWeekFields(true);
     }
+    syncDuePh();
     /* 头像预览跟随卡片（有正式头像才显示；新用户空圆 + ＋号） */
     const _me = $('#meAvatar');
     if (_me && _me.classList.contains('has-img') && meAvatarImg && meAvatarImg.src) {
@@ -1800,8 +1801,15 @@
     }
   }
 
+  /* 预产期占位层：空值显示「- 年 - 月 - 日」，选了值隐藏 */
+  function syncDuePh() {
+    const ph = $('#pgDuePh');
+    if (ph) ph.style.display = pgDue.value ? 'none' : 'block';
+  }
+
   /* 预产期一变，孕周 / 额外天数自动算出来 */
   pgDue.addEventListener('change', () => {
+    syncDuePh();
     const due = parseDay(pgDue.value);
     if (!due) { lockWeekFields(true); return; }
     const ga = gaFromDue(due);

mama-box.css

@@ -2652,3 +2652,7 @@ a.skip:focus{left:16px;top:16px}
 .empty-guide .eg-s{font-size:12.5px;color:var(--muted,#A79C95);margin-bottom:18px;line-height:1.6}
 .empty-guide .eg-btn{display:inline-block;padding:11px 34px;border:none;border-radius:12px;background:#F4593C;color:#fff;font-size:14px;font-weight:700;cursor:pointer}
 .empty-guide .eg-btn:active{transform:scale(.97)}
+
+/* 预产期 date 输入的空值占位（原生 date 不支持 placeholder） */
+.fld-date{position:relative}
+.fld-date .date-ph{position:absolute;left:16px;bottom:14px;font-size:14px;color:#C9B7AC;pointer-events:none;display:block}