feat: add custom date-range calendar picker in performance filters

index.html

@@ -160,6 +160,13 @@
                     <label>按天</label>
                     <select id="perfDay"><option value="all">全部日期</option></select>
                 </div>
+                <div class="control-group">
+                    <label>自定义日期</label>
+                    <input type="date" id="perfStart" style="padding:6px 10px;border:1px solid #d1d5db;border-radius:8px;font-size:13px;color:#374151;">
+                    <span style="color:#9ca3af;">～</span>
+                    <input type="date" id="perfEnd" style="padding:6px 10px;border:1px solid #d1d5db;border-radius:8px;font-size:13px;color:#374151;">
+                    <button id="perfDateReset" style="padding:6px 12px;border:1px solid #d1d5db;border-radius:8px;background:#f8fafc;color:#374151;font-size:12px;cursor:pointer;">清除</button>
+                </div>
             </div>
 
             <!-- 模块1：核心指标概览 -->
@@ -364,8 +371,19 @@
         fillSelect('perfProduct', [...new Set(perfData.map(d => d.product))].sort());
         fillSelect('perfCountry', [...new Set(perfData.map(d => d.location))].filter(x=>x&&x!=='0').sort());
         fillSelect('perfDay', [...new Set(perfData.map(d => d.date))].sort().reverse());
-        ['perfChannel','perfProduct','perfCountry','perfRange','perfDay'].forEach(id =>
+        // 自定义日期选择器：限制可选范围为数据的最小/最大日期
+        const allD = [...new Set(perfData.map(d => d.date))].sort();
+        if (allD.length) {
+            const s = document.getElementById('perfStart'), e = document.getElementById('perfEnd');
+            s.min = e.min = allD[0]; s.max = e.max = allD[allD.length-1];
+        }
+        ['perfChannel','perfProduct','perfCountry','perfRange','perfDay','perfStart','perfEnd'].forEach(id =>
             document.getElementById(id).addEventListener('change', drawPerf));
+        document.getElementById('perfDateReset').addEventListener('click', () => {
+            document.getElementById('perfStart').value = '';
+            document.getElementById('perfEnd').value = '';
+            drawPerf();
+        });
         drawPerf();
     }
 
@@ -376,11 +394,16 @@
         const co = document.getElementById('perfCountry').value;
         const rg = document.getElementById('perfRange').value;
         const day = document.getElementById('perfDay').value;
+        const start = document.getElementById('perfStart').value;
+        const end = document.getElementById('perfEnd').value;
         if (ch !== 'all') d = d.filter(x => x.channel === ch);
         if (pr !== 'all') d = d.filter(x => x.product === pr);
         if (co !== 'all') d = d.filter(x => x.location === co);
-        // 选了具体某天则优先按天过滤（覆盖时间范围）；否则用时间范围
+        // 日期过滤优先级：自定义日期区间 > 按天 > 时间范围
-        if (day !== 'all') {
+        if (start || end) {
+            if (start) d = d.filter(x => x.date >= start);
+            if (end) d = d.filter(x => x.date <= end);
+        } else if (day !== 'all') {
             d = d.filter(x => x.date === day);
         } else if (rg !== 'all') {
             const allDates = [...new Set(perfData.map(x => x.date))].sort();