筛选在列表→详情→编辑之间保留,修复编辑页翻页丢筛选,收拾移动端触控与字号

- 新增 ?back= 贯穿链路:列表页(地点库 / 时间线 / 统计 / 专题地图 / 主页)生成详情链接时
  带上当前完整地址,详情页的「返回」「编辑」与编辑页的返回按钮据此回到原来那份筛选结果。
  只放行站内路径(挡 //host、伪协议、控制字符),参数编码走 template.URL 避免二次转义。
- 修 EditData.PageLink 把 & 手工写成 & 又被模板转义一次的 bug(&)——
  参数名会变成 amp;vpage,表现为「带筛选时翻页没反应、筛选还丢了」(既有问题)。
- 编辑页三个筛选表单与三个「重置」带上 back(重置改走 EditData.EditLink,各清各的,
  顺带修掉搜索词含 & 或空格时重置链接被拆坏)。
- 详情页「在地图中查看」的地点名改走 QueryEscape(名字含 & / # 会拆坏地址)。
- 窄屏修正:把被基础规则压掉的 .chip / .btn / .check 覆盖挪到最后;
  checkbox 20px、select 44px、file/color 字号 16px(iOS 聚焦不再自放大整页)、
  .tag 12px、导航 logo 触摸区 44×44。
- 新增回归 internal/web/pagelink_test.go(翻页链接、返回文案、地图链接)。
This commit is contained in:
tamakyi
2026-09-18 19:03:50 +08:00
parent dbc5f173ef
commit 002755129d
13 changed files with 305 additions and 22 deletions
+29 -3
View File
@@ -128,9 +128,8 @@ h1, h2, h3, h4 { margin: 0; font-weight: 600; letter-spacing: -.01em; }
@media (max-width: 620px) {
.nav-links a, .btn, .btn.sm, .chip { min-height: 44px; }
.nav-links a { display: inline-flex; align-items: center; padding: 8px 9px; }
.chip { padding: 9px 12px; }
.btn, .btn.sm { padding: 10px 14px; }
.check input { width: 20px; height: 20px; }
/* 内边距与控件尺寸的窄屏覆盖在文件末尾(那几组选择器的基础规则在下面,
写在这里会被它们盖掉);这里只放基础规则里没有的属性。 */
/* iOS 聚焦字号小于 16px 的控件时会自动放大整页——用户点完输入框页面突然变大,
还要手动缩回去。窄屏统一提到 16px 规避(桌面端不受影响,保持紧凑)。 */
:root { --field-fs: 16px; }
@@ -968,3 +967,30 @@ label.f > span.span-actions { display: flex; align-items: center; justify-conten
/* 照片导入的进度/结果提示:脚本直接往元素里写文本,空的时候自己收起 */
#parse-status { margin: 12px 0 0; }
#parse-status:empty { display: none; }
/* ---------- 窄屏触控与控件字号(必须放在最后) ----------
这几组选择器(.chip / .btn / .check input)的基础规则写在文件中部,
而 CSS 同特异性下靠后的赢 —— 把它们写在前面那份「窄屏触控」块里是被盖掉的
(实测 .check input 的 20px 一直没生效,量出来还是 15px)。所以统一放这里。
量法与判据见技能 rond-web-verify 的 audit/mobile.js:触控目标 ≥44px、
输入框字号 ≥16px(否则 iOS 聚焦时会自放大整页)。 */
@media (max-width: 620px) {
.chip { padding: 9px 12px; }
.btn, .btn.sm { padding: 10px 14px; }
/* 勾选框:原来 15px,手指很难点中(尤其后台设置页一屏几十个开关)。
有效目标仍是外面那圈 label,但控件本身大一点更好瞄。 */
.check input, input[type=checkbox], input[type=radio] { width: 20px; height: 20px; }
/* 下拉框 39px 差 5px 到 44px,补齐 */
select { min-height: 44px; }
/* 表格里的控件保持紧凑:那张表列多、行密,抬到 44px 会让整张表膨胀;
.photo-table input[type=checkbox]{width:auto} 是既有约定,别覆盖。 */
table.tb select, .photo-table select { min-height: 0; }
/* file / color 这两种被基础规则排除在外(不套文本框外观),也就没吃到
--field-fs,窄屏仍是 13.3px ⇒ iOS 一聚焦就放大。单独提上来。 */
input[type=file], input[type=color] { font-size: 16px; }
/* 11.5px 的标签在手机上偏小(/stats 一页 29 处、/ 15 处) */
.tag { font-size: 12px; }
/* 导航左上角那个 logo 是回首页的入口,原来只有 25×29:给它撑到 44 高,
横向也补到 44(.brand .t 在窄屏被隐藏,加内边距就够了)。 */
.brand { min-width: 44px; min-height: 44px; justify-content: center; }
}
+8 -1
View File
@@ -10,6 +10,11 @@
var PI = 3.1415926535897932384626, A = 6378245.0, EE = 0.00669342162296594323;
var DATA_CRS = 'gcj02';
// 地图弹窗里「查看详情」要带回的返回地址(?back=):地图页有自己的筛选,点进详情再回来时
// 要回到那份筛选,而不是裸地点库。值是服务端编码好的参数值,直接拼,别再转义一次。
var backQS = '';
function backSuffix() { return backQS ? '?back=' + backQS : ''; }
// 交通方式图例:轨迹开启时告诉用户颜色含义
function modeLegendControl(modes) {
var Ctl = L.Control.extend({
@@ -341,7 +346,7 @@
// 备注只读直出,省得多点一次详情页
if (p.note) parts.push('<div class="mp-note">' + esc(p.note) + '</div>');
if (p.t) parts.push('<div class="mp-m">最近一次 ' + esc(p.t) + '</div>');
parts.push('<div class="mp-foot"><a href="/places/' + p.id + '">查看详情 →</a></div>');
parts.push('<div class="mp-foot"><a href="/places/' + p.id + backSuffix() + '">查看详情 →</a></div>');
wrap.innerHTML = parts.join('');
if (vote && p.sp) {
// 无论如何都挂上,交给 paintVote 决定显不显示;
@@ -530,6 +535,7 @@
preview: function (opts) {
var points = opts.points || [];
var vote = opts.vote === true;
backQS = opts.back || '';
// 同一个容器画第二次(照片导入页反查完画一次、点「重新反查」又画一次):
// Leaflet 不允许对已经有地图的容器再 L.map(),会抛
// "Map container is already initialized."——那个错会被调用方的 catch 接住,
@@ -624,6 +630,7 @@
// 底图版权(© 高德地图 / © OpenStreetMap)必须留着——那是上游的使用条款要求。
L.control.attribution({ prefix: false, position: 'bottomright' }).addTo(map);
var points = opts.points || [];
backQS = opts.back || '';
// 窄屏筛选面板占满宽度,控件改挂右下角(该尺寸下图例已隐藏)
var corner = window.matchMedia('(max-width: 620px)').matches ? 'bottomright' : 'topright';
L.control.zoom({ position: corner }).addTo(map);