laoyang
f9a624ef4b
交通字段 - 飞机只记航班号、火车只记车次，不再收座位号 / 线路 / 承运人 / 登机口 （多人同乘一趟时座位号本来就无意义） - trip_nodes 的历史列保留但不再写入也不再渲染，编辑一次即被显式清成 NULL - 节点表单按出行方式切换号码标签（航班号 / 车次 / 班次 / 线路 / 航次） 照片 - 一个节点可传多张照片，前端支持逐张裁剪（Cropper.js，只把裁过的走 base64） - MIME 由自建的 src/Mime.php 按内容识别：getimagesize → 魔数嗅探 → 扩展名映射， 刻意不依赖 fileinfo —— 线上同时装着 PHP 7.4（没装该扩展）与 8.1 - 单张体积上限、可传张数在设置页可调 双存储后端 - 本站 uploads/ 或阿里云 OSS，在「存储设置」页配 endpoint / 桶名 / 前缀 / 内网开关； OSS 配置不完整时静默回退本地，避免管理员填错就把上传整个弄挂 - OSS 鉴权支持 ECS 实例 RAM 角色换 STS 临时凭证（临时凭证缓存在 /tmp，不落 Web 目录）， 也支持直接填 AccessKey - OSS V1 签名手写实现，不引 SDK（本项目无 composer / 无 autoload） 媒体代理 - 照片与活动封面一律经 media/show、media/cover 代理输出，先校验家庭归属再吐字节 - 页面里不出现 OSS 域名，也不出现本地真实路径；桶保持私有 - 响应带 nosniff，并关闭 display_errors，免得 PHP 报错混进图片正文把图弄坏 数据库 - 新增迁移机制（src/Migrate.php + tools/migrate.php，仅 CLI 可跑） - 建 app_settings 表；attachments 增加 storage / object_key / mime_type / size_bytes / width / height / is_image 与 idx_storage - MySQL 8 不支持「加列时带 IF NOT EXISTS」，迁移一律先查 information_schema 界面 - 顶栏只留品牌与「新建活动」，其余入口收进右上角下拉菜单（details/summary，零 JS 可开合） - 新增「存储设置」页：当前生效存储、数据库结构版本、是否 ECS 运行环境三张状态卡， 外加测试连接与角色探测 - 样式表整体重写 验证 - 模板渲染检查 234 项、SQL 列名静态检查、模板到 CSS 的类覆盖检查、内联 JS 语法检查全通过 - 已部署到 trip.yangyq.net 并完成线上验证：双 PHP（8.1 / 7.4）14 条路由渲染字节数完全一致、 26 项内容断言全部通过、照片代理取件与磁盘原件逐字节一致（69/69 字节）
387 lines
16 KiB
PHP
387 lines
16 KiB
PHP
<?php
|
|
$isEdit = $isEdit ?? false;
|
|
$n = $node; // null=新建；数组=编辑
|
|
$curStatus = $n['status'] ?? ($category === 'plan' ? 'planned' : 'completed');
|
|
$statusLabels = [
|
|
'planned' => '待执行',
|
|
'ongoing' => '进行中',
|
|
'completed' => '已完成',
|
|
'cancelled' => '已取消',
|
|
];
|
|
// 计划节点不会有"进行中"，执行节点默认就是已完成
|
|
$statusOptions = $category === 'plan'
|
|
? ['planned', 'completed', 'cancelled']
|
|
: ['completed', 'ongoing', 'planned', 'cancelled'];
|
|
|
|
$dtLocal = static function ($value): string {
|
|
if (empty($value)) return '';
|
|
$ts = strtotime((string)$value);
|
|
return $ts ? date('Y-m-d\TH:i', $ts) : '';
|
|
};
|
|
$sLoc = json_decode_field($n['start_location'] ?? null);
|
|
$eLoc = json_decode_field($n['end_location'] ?? null);
|
|
|
|
/**
|
|
* 交通信息只留一个输入框：飞机只要航班号（航空公司是隐含的），火车只要车次。
|
|
* 座位号/登机口这类「一趟车多人同行」时根本没法记，所以不再收集。
|
|
*/
|
|
$tripField = [
|
|
'plane' => ['label' => '航班号', 'ph' => '例如：CA1234'],
|
|
'train' => ['label' => '车次', 'ph' => '例如：G1234'],
|
|
'bus' => ['label' => '班次', 'ph' => '例如：T108、8 路'],
|
|
'subway' => ['label' => '线路', 'ph' => '例如：地铁 10 号线'],
|
|
'ship' => ['label' => '航次', 'ph' => '例如：渤海轮渡 3 号'],
|
|
'taxi' => ['label' => '叫车备注', 'ph' => '例如：尾号 1234'],
|
|
'other' => ['label' => '车次 / 班次', 'ph' => '例如：G1234、CA1234'],
|
|
];
|
|
?>
|
|
<div class="page-header">
|
|
<div>
|
|
<h1><?= $isEdit ? '编辑' : '新建' ?><?= $category === 'plan' ? '计划' : '执行' ?>节点</h1>
|
|
<p class="muted">
|
|
活动：
|
|
<a href="<?= url('activities/show', ['id' => $activity['id']]) ?>"><?= e($activity['title']) ?></a>
|
|
<?php if ($isEdit && !empty($n['original_plan_node_id'])): ?>
|
|
· <span class="tag-default">由计划节点生成</span>
|
|
<?php endif; ?>
|
|
</p>
|
|
</div>
|
|
<a href="<?= url('activities/show', ['id' => $activity['id']]) ?>" class="btn">返回活动</a>
|
|
</div>
|
|
|
|
<form method="post" action="<?= url($isEdit ? 'nodes/update' : 'nodes/store') ?>" class="form">
|
|
<input type="hidden" name="_csrf" value="<?= e(csrf_token()) ?>">
|
|
<input type="hidden" name="activity_id" value="<?= (int)$activity['id'] ?>">
|
|
<input type="hidden" name="node_category" value="<?= e($category) ?>">
|
|
<?php if ($isEdit): ?>
|
|
<input type="hidden" name="id" value="<?= (int)$n['id'] ?>">
|
|
<?php endif; ?>
|
|
|
|
<?php if (!$isEdit && $category === 'reality' && !empty($planNodes)): ?>
|
|
<div class="form-row">
|
|
<label>关联计划节点（可选）</label>
|
|
<select name="original_plan_node_id">
|
|
<option value="">— 不关联，此为临时新增 —</option>
|
|
<?php foreach ($planNodes as $p): ?>
|
|
<option value="<?= (int)$p['id'] ?>">
|
|
<?= e($p['title'] ?: '（无标题）') ?> · <?= date('m-d H:i', strtotime($p['start_time'])) ?>
|
|
</option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
<div class="muted">关联后可以在计划卡片上看到「已成行」。</div>
|
|
</div>
|
|
<?php endif; ?>
|
|
|
|
<div class="form-row">
|
|
<label>节点类型 *</label>
|
|
<select name="node_type_id" required>
|
|
<?php foreach ($nodeTypes as $t): ?>
|
|
<option value="<?= (int)$t['id'] ?>"
|
|
<?= (int)($n['node_type_id'] ?? 0) === (int)$t['id'] ? ' selected' : '' ?>>
|
|
<?= e($t['icon'] . ' ' . $t['name']) ?>
|
|
</option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="form-row two-col">
|
|
<div>
|
|
<label>开始时间 *</label>
|
|
<input type="datetime-local" name="start_time" required value="<?= e($dtLocal($n['start_time'] ?? null)) ?>">
|
|
</div>
|
|
<div>
|
|
<label>结束时间 *</label>
|
|
<input type="datetime-local" name="end_time" required value="<?= e($dtLocal($n['end_time'] ?? null)) ?>">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-row">
|
|
<label>标题</label>
|
|
<input type="text" name="title" maxlength="200" placeholder="例如：出发去奥森"
|
|
value="<?= e($n['title'] ?? '') ?>">
|
|
</div>
|
|
|
|
<fieldset class="fieldset">
|
|
<legend>出行方式</legend>
|
|
|
|
<div class="form-row">
|
|
<label for="travel-mode-select">选择方式</label>
|
|
<select name="travel_mode_id" id="travel-mode-select">
|
|
<option value="" data-mode-type="">— 不使用 —</option>
|
|
<?php foreach ($travelModes as $tm): ?>
|
|
<option value="<?= (int)$tm['id'] ?>" data-mode-type="<?= e($tm['mode_type']) ?>"
|
|
<?= (int)($n['travel_mode_id'] ?? 0) === (int)$tm['id'] ? ' selected' : '' ?>>
|
|
<?= e(($modeLabels[$tm['mode_type']] ?? $tm['mode_type']) . (!empty($tm['plate_number']) ? ' · ' . $tm['plate_number'] : '')) ?>
|
|
</option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
<div class="muted">
|
|
没有合适的方式？在右上角菜单的「出行方式」里添加。
|
|
</div>
|
|
</div>
|
|
|
|
<?php /* 只有一个交通字段：飞机=航班号、火车=车次，标签随方式切换 */ ?>
|
|
<div class="form-row" id="field-trip-number" style="display:none;">
|
|
<label id="trip-number-label" for="trip-number-input">车次 / 航班号</label>
|
|
<input type="text" name="trip_number" id="trip-number-input" maxlength="50"
|
|
placeholder="例如：G1234、CA1234"
|
|
value="<?= e($n['trip_number'] ?? '') ?>">
|
|
<div class="muted" id="trip-number-hint"></div>
|
|
</div>
|
|
|
|
<div class="form-row" id="field-no-trip" style="display:none;">
|
|
<div class="muted" id="no-trip-hint"></div>
|
|
</div>
|
|
</fieldset>
|
|
|
|
<fieldset class="fieldset">
|
|
<legend>起点（可选）</legend>
|
|
<div class="form-row">
|
|
<label>起点名称（输入地址自动补全）</label>
|
|
<input type="text" name="start_location_name" id="start-location-input"
|
|
placeholder="输入关键词，如「北京南站」「奥森公园」"
|
|
autocomplete="off"
|
|
value="<?= e($sLoc['name'] ?? '') ?>">
|
|
<input type="hidden" name="start_location_address" id="start-location-address" value="<?= e($sLoc['address'] ?? '') ?>">
|
|
<input type="hidden" name="start_location_lat" id="start-location-lat" value="<?= e($sLoc['lat'] ?? '') ?>">
|
|
<input type="hidden" name="start_location_lng" id="start-location-lng" value="<?= e($sLoc['lng'] ?? '') ?>">
|
|
</div>
|
|
</fieldset>
|
|
|
|
<fieldset class="fieldset">
|
|
<legend>终点（可选）</legend>
|
|
<div class="form-row">
|
|
<label>终点名称（输入地址自动补全）</label>
|
|
<input type="text" name="end_location_name" id="end-location-input"
|
|
placeholder="输入关键词，如「国家大剧院」「三里屯」"
|
|
autocomplete="off"
|
|
value="<?= e($eLoc['name'] ?? '') ?>">
|
|
<input type="hidden" name="end_location_address" id="end-location-address" value="<?= e($eLoc['address'] ?? '') ?>">
|
|
<input type="hidden" name="end_location_lat" id="end-location-lat" value="<?= e($eLoc['lat'] ?? '') ?>">
|
|
<input type="hidden" name="end_location_lng" id="end-location-lng" value="<?= e($eLoc['lng'] ?? '') ?>">
|
|
</div>
|
|
</fieldset>
|
|
|
|
<div class="form-row">
|
|
<label>详细描述</label>
|
|
<textarea name="description" rows="4" placeholder="记录一些细节..."><?= e($n['description'] ?? '') ?></textarea>
|
|
</div>
|
|
|
|
<?php if ($isEdit): ?>
|
|
<fieldset class="fieldset">
|
|
<legend>执行状态</legend>
|
|
<div class="form-row">
|
|
<label for="status-select">状态</label>
|
|
<select name="status" id="status-select">
|
|
<?php foreach ($statusOptions as $st): ?>
|
|
<option value="<?= e($st) ?>" <?= $curStatus === $st ? ' selected' : '' ?>>
|
|
<?= e($statusLabels[$st]) ?>
|
|
</option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
</div>
|
|
<div class="form-row">
|
|
<label>取消原因（状态选「已取消」时填写）</label>
|
|
<input type="text" name="cancel_reason" maxlength="500" placeholder="例如：下雨，临时改行程"
|
|
value="<?= e($n['cancel_reason'] ?? '') ?>">
|
|
</div>
|
|
</fieldset>
|
|
<?php endif; ?>
|
|
|
|
<div class="form-actions">
|
|
<a href="<?= url('activities/show', ['id' => $activity['id']]) ?>" class="btn">取消</a>
|
|
<button type="submit" class="btn-primary">保存</button>
|
|
</div>
|
|
</form>
|
|
|
|
<script>
|
|
(function () {
|
|
// ===== 交通字段：只一个输入框，标签随出行方式变 =====
|
|
var TRIP = <?= json_encode($tripField, JSON_UNESCAPED_UNICODE) ?>;
|
|
// 这些方式不需要车次/航班号（自驾、步行、骑行）
|
|
var NO_TRIP = ['drive_own', 'drive_rental', 'walk', 'bike'];
|
|
|
|
var modeSelect = document.getElementById('travel-mode-select');
|
|
var tripRow = document.getElementById('field-trip-number');
|
|
var tripLabel = document.getElementById('trip-number-label');
|
|
var tripInput = document.getElementById('trip-number-input');
|
|
var tripHint = document.getElementById('trip-number-hint');
|
|
var noTripRow = document.getElementById('field-no-trip');
|
|
var noTripHint = document.getElementById('no-trip-hint');
|
|
|
|
function refreshTransport() {
|
|
if (!modeSelect || !tripRow) return;
|
|
var opt = modeSelect.options[modeSelect.selectedIndex];
|
|
var mode = opt ? (opt.getAttribute('data-mode-type') || '') : '';
|
|
|
|
if (mode === '') {
|
|
tripRow.style.display = 'none';
|
|
noTripRow.style.display = 'none';
|
|
return;
|
|
}
|
|
|
|
if (NO_TRIP.indexOf(mode) !== -1) {
|
|
tripRow.style.display = 'none';
|
|
noTripRow.style.display = '';
|
|
noTripHint.textContent = (mode === 'walk' || mode === 'bike')
|
|
? '步行 / 骑行不用填车次。'
|
|
: '自驾不用填车次，车牌已在出行方式里。';
|
|
return;
|
|
}
|
|
|
|
var cfg = TRIP[mode] || TRIP['other'];
|
|
noTripRow.style.display = 'none';
|
|
tripRow.style.display = '';
|
|
tripLabel.textContent = cfg.label;
|
|
tripInput.placeholder = cfg.ph;
|
|
tripHint.textContent = '只填这一个就够了' +
|
|
(mode === 'plane' ? '——航班号本身就包含了航空公司。'
|
|
: mode === 'train' ? '——车次就够，座位号对多人同行没意义。'
|
|
: '。');
|
|
}
|
|
|
|
if (modeSelect) {
|
|
modeSelect.addEventListener('change', refreshTransport);
|
|
refreshTransport();
|
|
}
|
|
|
|
// ===== 高德地址自动补全（自定义下拉） =====
|
|
var maxWait = 5000; // 最多等 5 秒
|
|
var waited = 0;
|
|
|
|
function waitForAmap(callback) {
|
|
if (window.__AMAP_LOADED && typeof AMap !== 'undefined' && AMap.AutoComplete) {
|
|
callback();
|
|
return;
|
|
}
|
|
if (window.__AMAP_ERROR) {
|
|
console.error('[AMap] 脚本加载失败：', window.__AMAP_ERROR);
|
|
return;
|
|
}
|
|
if (waited >= maxWait) {
|
|
console.error('[AMap] 等待超时。可能原因：Key 无效 / 未绑定域名 / 无法访问 webapi.amap.com');
|
|
return;
|
|
}
|
|
waited += 200;
|
|
setTimeout(function () { waitForAmap(callback); }, 200);
|
|
}
|
|
|
|
waitForAmap(function () {
|
|
setupAutoComplete('start-location-input', 'start');
|
|
setupAutoComplete('end-location-input', 'end');
|
|
});
|
|
|
|
function setupAutoComplete(inputId, prefix) {
|
|
var input = document.getElementById(inputId);
|
|
if (!input) return;
|
|
|
|
var addrField = document.getElementById(prefix + '-location-address');
|
|
var latField = document.getElementById(prefix + '-location-lat');
|
|
var lngField = document.getElementById(prefix + '-location-lng');
|
|
|
|
var dropdown = document.createElement('div');
|
|
dropdown.className = 'amap-dropdown';
|
|
dropdown.style.display = 'none';
|
|
var wrapper = input.closest('.form-row') || input.parentElement;
|
|
wrapper.style.position = 'relative';
|
|
wrapper.appendChild(dropdown);
|
|
|
|
var autoComplete = new AMap.AutoComplete({});
|
|
var currentIndex = -1;
|
|
var currentResults = [];
|
|
|
|
function escapeHtml(s) {
|
|
return String(s).replace(/[&<>"']/g, function (c) {
|
|
return { '&': '&', '<': '<', '>': '>', '"': '"', "'": ''' }[c];
|
|
});
|
|
}
|
|
|
|
function renderDropdown(results) {
|
|
currentResults = results || [];
|
|
currentIndex = -1;
|
|
if (!currentResults.length) {
|
|
dropdown.style.display = 'none';
|
|
return;
|
|
}
|
|
dropdown.innerHTML = currentResults.map(function (item, i) {
|
|
var sub = [item.district || '', item.address || ''].filter(Boolean).join(' ');
|
|
return '<div class="amap-dropdown-item" data-index="' + i + '">'
|
|
+ '<div class="amap-dropdown-name">' + escapeHtml(item.name || '') + '</div>'
|
|
+ (sub ? '<div class="amap-dropdown-sub">' + escapeHtml(sub) + '</div>' : '')
|
|
+ '</div>';
|
|
}).join('');
|
|
dropdown.style.display = 'block';
|
|
dropdown.querySelectorAll('.amap-dropdown-item').forEach(function (el) {
|
|
el.addEventListener('mousedown', function (ev) {
|
|
ev.preventDefault(); // 防止 input 失焦
|
|
selectItem(currentResults[parseInt(el.getAttribute('data-index'), 10)]);
|
|
});
|
|
});
|
|
}
|
|
|
|
function selectItem(item) {
|
|
if (!item) return;
|
|
input.value = item.name || '';
|
|
if (addrField) addrField.value = item.address || item.district || '';
|
|
if (item.location) {
|
|
if (latField) latField.value = item.location.lat;
|
|
if (lngField) lngField.value = item.location.lng;
|
|
}
|
|
dropdown.style.display = 'none';
|
|
}
|
|
|
|
var searchTimer = null;
|
|
input.addEventListener('input', function () {
|
|
var keyword = input.value.trim();
|
|
clearTimeout(searchTimer);
|
|
if (keyword.length < 2) {
|
|
dropdown.style.display = 'none';
|
|
return;
|
|
}
|
|
searchTimer = setTimeout(function () {
|
|
autoComplete.search(keyword, function (status, result) {
|
|
if (status === 'complete' && result && result.tips) {
|
|
renderDropdown(result.tips);
|
|
} else {
|
|
dropdown.style.display = 'none';
|
|
}
|
|
});
|
|
}, 300);
|
|
});
|
|
|
|
input.addEventListener('blur', function () {
|
|
setTimeout(function () { dropdown.style.display = 'none'; }, 200);
|
|
});
|
|
input.addEventListener('focus', function () {
|
|
if (currentResults.length) dropdown.style.display = 'block';
|
|
});
|
|
input.addEventListener('keydown', function (ev) {
|
|
if (dropdown.style.display === 'none') return;
|
|
var items = dropdown.querySelectorAll('.amap-dropdown-item');
|
|
if (!items.length) return;
|
|
|
|
function highlight() {
|
|
items.forEach(function (el, i) { el.classList.toggle('active', i === currentIndex); });
|
|
}
|
|
|
|
if (ev.key === 'ArrowDown') {
|
|
ev.preventDefault();
|
|
currentIndex = (currentIndex + 1) % items.length;
|
|
highlight();
|
|
} else if (ev.key === 'ArrowUp') {
|
|
ev.preventDefault();
|
|
currentIndex = (currentIndex - 1 + items.length) % items.length;
|
|
highlight();
|
|
} else if (ev.key === 'Enter') {
|
|
if (currentIndex >= 0 && currentResults[currentIndex]) {
|
|
ev.preventDefault();
|
|
selectItem(currentResults[currentIndex]);
|
|
}
|
|
} else if (ev.key === 'Escape') {
|
|
dropdown.style.display = 'none';
|
|
}
|
|
});
|
|
}
|
|
})();
|
|
</script>
|