feat: 完善电影记录系统源码与项目文档

功能模块：
- 观影记录：列表（瀑布流）/ 添加 / 编辑 / 详情 / 删除，删除时同步清理图片文件
- 首页快捷搜索 + 高级搜索（片名、影院、观影人、日期区间组合筛选）
- 影院管理：三段式信息 + 50 种预设配色，删除已引用影院时二次确认
- 观影人管理：头像裁剪上传 + 专属配色，已引用者禁止删除
- 图片处理：Cropper.js 裁剪票根/海报/观影照片/头像，多图上传，首字母 SVG 头像兜底
- OMDb 自动获取影片信息（fetch_movie.php 代理，返回 JSON）
- CSV 批量导入：UTF-8/GBK 自动识别，影院去重，事务保护，逐行错误报告
- 统计仪表板：总览 + 按影院/观影人/年份/近 12 个月排行
- 年度报告：按账号关联的观影人视角生成，含 Chart.js 月度与星期分布图
- 多用户：账号增删改、账号与观影人绑定、修改自己的用户名与密码
- 登录鉴权：Session + password_hash，全站页面登录校验

文档：
- 重写 README：功能特性、技术栈、目录结构、数据库结构、部署与使用指南、接口说明、CSV 格式、安全注意事项、已知限制
- 新增 .gitignore，排除 db/ 与 uploads/ 等运行时数据

edit.php

@@ -0,0 +1,634 @@
+<?php
+// ============================================
+// 文件: edit.php (完整可用)
+// 说明: 支持海报、票根、合影裁剪，观影人管理
+// ============================================
+
+require_once 'config.php';
+checkLogin();
+
+$id = isset($_GET['id']) ? (int)$_GET['id'] : 0;
+if ($id <= 0) {
+    header('Location: index.php');
+    exit;
+}
+
+$movie = getMovie($id);
+if (!$movie) {
+    header('Location: index.php');
+    exit;
+}
+
+$admin = getCurrentAdmin();
+$cinemas = getCinemas();
+
+// 获取所有观影人
+$db = getDB();
+$stmt = $db->query("SELECT * FROM persons ORDER BY name");
+$all_persons = $stmt->fetchAll();
+
+$error = '';
+
+if ($_SERVER['REQUEST_METHOD'] === 'POST') {
+    $title = trim($_POST['title'] ?? '');
+    $info = trim($_POST['info'] ?? '');
+    $watch_date = $_POST['watch_date'] ?? '';
+    $cinema_id = $_POST['cinema_id'] ?? '';
+    $viewer_selects = $_POST['viewer_select'] ?? [];
+    $viewer_news = $_POST['viewers_new'] ?? [];
+    
+    $poster_crop = $_POST['poster_crop'] ?? '';
+    $ticket_crop = $_POST['ticket_crop'] ?? '';
+    $photo_crops = $_POST['photo_crop'] ?? [];
+    
+    // 新建电影院
+    $new_cinema_place = trim($_POST['new_cinema_place'] ?? '');
+    $new_cinema_name = trim($_POST['new_cinema_name'] ?? '');
+    $new_cinema_address = trim($_POST['new_cinema_address'] ?? '');
+    
+    if ($cinema_id === 'new' && !empty($new_cinema_name)) {
+        $stmt = $db->prepare("INSERT INTO cinemas (place, name, address) VALUES (?, ?, ?)");
+        $stmt->execute([$new_cinema_place, $new_cinema_name, $new_cinema_address]);
+        $cinema_id = $db->lastInsertId();
+    } elseif ($cinema_id === 'new') {
+        $cinema_id = null;
+    } elseif (!empty($cinema_id) && is_numeric($cinema_id)) {
+        $cinema_id = (int)$cinema_id;
+    } else {
+        $cinema_id = null;
+    }
+    
+    if (empty($title)) {
+        $error = '请输入电影名称';
+    } elseif (empty($watch_date)) {
+        $error = '请选择观影日期';
+    } else {
+        // ----- 处理海报裁剪/上传 -----
+        $poster_path = $movie['poster_path'];
+        if (!empty($poster_crop)) {
+            $new_path = saveBase64Image($poster_crop, POSTER_DIR, 'poster');
+            if ($new_path) {
+                if ($poster_path && file_exists(__DIR__ . '/' . $poster_path)) {
+                    unlink(__DIR__ . '/' . $poster_path);
+                }
+                $poster_path = $new_path;
+            } else {
+                $error = '海报裁剪保存失败，请重试';
+            }
+        } elseif (isset($_FILES['poster']) && $_FILES['poster']['error'] === UPLOAD_ERR_OK) {
+            // 上传新海报替换
+            $ext = strtolower(pathinfo($_FILES['poster']['name'], PATHINFO_EXTENSION));
+            if (in_array($ext, ['jpg', 'jpeg', 'png', 'gif', 'webp'])) {
+                $filename = uniqueFilename($_FILES['poster']['name']);
+                $target = POSTER_DIR . $filename;
+                if (move_uploaded_file($_FILES['poster']['tmp_name'], $target)) {
+                    if ($poster_path && file_exists(__DIR__ . '/' . $poster_path)) {
+                        unlink(__DIR__ . '/' . $poster_path);
+                    }
+                    $poster_path = 'uploads/posters/' . $filename;
+                }
+            }
+        }
+        
+        // ----- 处理票根裁剪/上传 -----
+        $ticket_path = $movie['ticket_path'];
+        if (!empty($ticket_crop)) {
+            $new_path = saveBase64Image($ticket_crop, TICKET_DIR, 'ticket');
+            if ($new_path) {
+                if ($ticket_path && file_exists(__DIR__ . '/' . $ticket_path)) {
+                    unlink(__DIR__ . '/' . $ticket_path);
+                }
+                $ticket_path = $new_path;
+            } else {
+                $error = '票根裁剪保存失败，请重试';
+            }
+        } elseif (isset($_FILES['ticket']) && $_FILES['ticket']['error'] === UPLOAD_ERR_OK) {
+            $ext = strtolower(pathinfo($_FILES['ticket']['name'], PATHINFO_EXTENSION));
+            if (in_array($ext, ['jpg', 'jpeg', 'png', 'gif', 'webp'])) {
+                $filename = uniqueFilename($_FILES['ticket']['name']);
+                $target = TICKET_DIR . $filename;
+                if (move_uploaded_file($_FILES['ticket']['tmp_name'], $target)) {
+                    if ($ticket_path && file_exists(__DIR__ . '/' . $ticket_path)) {
+                        unlink(__DIR__ . '/' . $ticket_path);
+                    }
+                    $ticket_path = 'uploads/tickets/' . $filename;
+                }
+            }
+        }
+        
+        // 如果前面处理没有错误，继续更新数据库
+        if (empty($error)) {
+            // 更新电影基本信息
+            $stmt = $db->prepare("
+                UPDATE movies 
+                SET title = ?, info = ?, poster_path = ?, ticket_path = ?, cinema_id = ?, watch_date = ?
+                WHERE id = ?
+            ");
+            $stmt->execute([$title, $info, $poster_path, $ticket_path, $cinema_id, $watch_date, $id]);
+            
+            // ----- 处理合影裁剪 -----
+            if (!empty($photo_crops)) {
+                foreach ($photo_crops as $photo_id => $base64_data) {
+                    if (empty($base64_data)) continue;
+                    $stmt = $db->prepare("SELECT photo_path FROM movie_photos WHERE id = ? AND movie_id = ?");
+                    $stmt->execute([$photo_id, $id]);
+                    $old = $stmt->fetch();
+                    if ($old) {
+                        $new_path = saveBase64Image($base64_data, PHOTO_DIR, 'photo');
+                        if ($new_path) {
+                            if ($old['photo_path'] && file_exists(__DIR__ . '/' . $old['photo_path'])) {
+                                unlink(__DIR__ . '/' . $old['photo_path']);
+                            }
+                            $stmt = $db->prepare("UPDATE movie_photos SET photo_path = ? WHERE id = ?");
+                            $stmt->execute([$new_path, $photo_id]);
+                        }
+                    }
+                }
+            }
+            
+            // ----- 新增合影照片 -----
+            if (isset($_FILES['new_photos']) && is_array($_FILES['new_photos']['tmp_name'])) {
+                $photo_files = $_FILES['new_photos'];
+                for ($i = 0; $i < count($photo_files['tmp_name']); $i++) {
+                    if ($photo_files['error'][$i] === UPLOAD_ERR_OK) {
+                        $ext = strtolower(pathinfo($photo_files['name'][$i], PATHINFO_EXTENSION));
+                        if (in_array($ext, ['jpg', 'jpeg', 'png', 'gif', 'webp'])) {
+                            $filename = uniqueFilename($photo_files['name'][$i]);
+                            $target = PHOTO_DIR . $filename;
+                            if (move_uploaded_file($photo_files['tmp_name'][$i], $target)) {
+                                $photo_path = 'uploads/photos/' . $filename;
+                                $stmt = $db->prepare("INSERT INTO movie_photos (movie_id, photo_path) VALUES (?, ?)");
+                                $stmt->execute([$id, $photo_path]);
+                            }
+                        }
+                    }
+                }
+            }
+            
+            // ----- 处理观影人 -----
+            $stmt = $db->prepare("DELETE FROM viewers WHERE movie_id = ?");
+            $stmt->execute([$id]);
+            $person_ids = [];
+            foreach ($viewer_selects as $idx => $val) {
+                if ($val === 'new') {
+                    $new_name = trim($viewer_news[$idx] ?? '');
+                    if (!empty($new_name)) {
+                        $chk = $db->prepare("SELECT id FROM persons WHERE name = ?");
+                        $chk->execute([$new_name]);
+                        $existing = $chk->fetch();
+                        if ($existing) {
+                            $person_ids[] = $existing['id'];
+                        } else {
+                            $ins = $db->prepare("INSERT INTO persons (name) VALUES (?)");
+                            $ins->execute([$new_name]);
+                            $person_ids[] = $db->lastInsertId();
+                        }
+                    }
+                } elseif (is_numeric($val) && $val > 0) {
+                    $person_ids[] = (int)$val;
+                }
+            }
+            $person_ids = array_unique($person_ids);
+            if (!empty($person_ids)) {
+                $stmt = $db->prepare("INSERT INTO viewers (movie_id, person_id, name) VALUES (?, ?, ?)");
+                foreach ($person_ids as $pid) {
+                    $stmt->execute([$id, $pid, '']);
+                }
+            }
+            
+            header('Location: detail.php?id=' . $id);
+            exit;
+        }
+    }
+}
+
+// 准备观影人数据
+$current_person_ids = array_column($movie['viewers'], 'person_id');
+$current_person_ids = array_filter($current_person_ids, function($v) { return $v > 0; });
+if (empty($current_person_ids)) {
+    $current_person_ids = [0];
+}
+?>
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>编辑电影 - 电影日志</title>
+    <link rel="stylesheet" href="css/style.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.13/cropper.min.css">
+    <style>
+        /* ===== 全局样式 ===== */
+        .form-container { max-width: 720px; margin: 0 auto; padding: 20px; }
+        .form-card { background: var(--card-bg); border-radius: 16px; padding: 32px 36px; box-shadow: var(--shadow); }
+        .form-card h2 { font-size: 24px; font-weight: 700; margin: 0 0 8px; }
+        .form-card .sub { color: var(--text-secondary); font-size: 14px; margin-bottom: 24px; }
+        .form-group { margin-bottom: 20px; }
+        .form-group label { display: block; font-weight: 600; font-size: 14px; color: var(--text-primary); margin-bottom: 6px; }
+        .form-group input, .form-group textarea, .form-group select {
+            width: 100%; padding: 12px 16px; border: 1px solid var(--border-color); border-radius: 10px;
+            font-size: 15px; font-family: inherit; background: var(--input-bg); color: var(--text-primary);
+            transition: border-color 0.2s, box-shadow 0.2s; box-sizing: border-box;
+        }
+        .form-group input:focus, .form-group textarea:focus, .form-group select:focus {
+            outline: none; border-color: var(--primary); box-shadow: 0 0 0 4px rgba(230,126,34,0.12);
+        }
+        .form-group textarea { min-height: 100px; resize: vertical; }
+        .form-group input[type="file"] { padding: 10px 12px; background: var(--bg-secondary); border: 1px dashed var(--border-color); }
+        .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
+        .form-hint { font-size: 13px; color: var(--text-secondary); margin-top: 4px; }
+        .viewer-input-group { display: flex; gap: 10px; align-items: center; margin-bottom: 8px; }
+        .viewer-input-group select, .viewer-input-group input { flex: 1; }
+        .viewer-input-group select { width: 60%; }
+        .viewer-input-group input[type="text"] { width: 40%; }
+        .btn-remove-viewer { background: none; border: none; color: #e74c3c; font-size: 20px; cursor: pointer; padding: 0 8px; line-height: 1; transition: transform 0.2s; }
+        .btn-remove-viewer:hover { transform: scale(1.2); }
+        .btn-add-viewer { background: var(--bg-secondary); border: 1px dashed var(--border-color); border-radius: 8px; padding: 8px 16px; color: var(--text-secondary); cursor: pointer; font-size: 14px; transition: all 0.2s; width: 100%; }
+        .btn-add-viewer:hover { border-color: var(--primary); color: var(--primary); background: rgba(230,126,34,0.05); }
+        .form-actions { display: flex; gap: 12px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--border-color); }
+        .form-actions .btn { padding: 12px 32px; font-size: 16px; }
+        .btn-secondary { background: var(--bg-secondary); color: var(--text-primary); border: 1px solid var(--border-color); }
+        .btn-secondary:hover { background: var(--border-color); }
+        .error-box { background: rgba(231,76,60,0.08); border: 1px solid rgba(231,76,60,0.2); color: #e74c3c; padding: 12px 16px; border-radius: 10px; margin-bottom: 20px; font-size: 14px; }
+        .cinema-new-group { margin-top: 12px; padding: 16px 18px; background: var(--bg-secondary); border-radius: 10px; border: 1px solid var(--border-color); }
+        .cinema-new-group .form-group:last-child { margin-bottom: 0; }
+        .current-files { font-size: 13px; color: var(--text-secondary); margin-top: 4px; }
+        .current-files a { color: var(--primary); text-decoration: none; }
+        .current-files a:hover { text-decoration: underline; }
+        .crop-btn {
+            display: inline-block;
+            padding: 4px 12px;
+            background: #3498db;
+            color: #fff;
+            border: none;
+            border-radius: 4px;
+            font-size: 12px;
+            cursor: pointer;
+            margin-top: 4px;
+        }
+        .crop-btn:hover { background: #2980b9; }
+        .image-preview {
+            max-width: 120px;
+            max-height: 120px;
+            border-radius: 4px;
+            border: 1px solid var(--border-color);
+        }
+        .photo-item {
+            display: inline-block;
+            margin: 4px;
+            text-align: center;
+        }
+        .modal-overlay {
+            display: none;
+            position: fixed;
+            top: 0; left: 0; right: 0; bottom: 0;
+            background: rgba(0,0,0,0.6);
+            z-index: 999;
+            justify-content: center;
+            align-items: center;
+        }
+        .modal-overlay.active { display: flex; }
+        .modal-content {
+            background: var(--card-bg);
+            max-width: 600px;
+            width: 90%;
+            padding: 24px;
+            border-radius: 16px;
+            box-shadow: 0 20px 60px rgba(0,0,0,0.5);
+            max-height: 90vh;
+            overflow-y: auto;
+        }
+        .modal-header {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-bottom: 16px;
+        }
+        .modal-header h3 { margin: 0; }
+        .modal-header .close-btn {
+            background: none;
+            border: none;
+            font-size: 28px;
+            cursor: pointer;
+            color: var(--text-secondary);
+        }
+        .modal-body img { max-width: 100%; display: block; }
+        .modal-footer {
+            margin-top: 16px;
+            display: flex;
+            gap: 12px;
+            justify-content: flex-end;
+        }
+        @media (max-width: 600px) {
+            .form-card { padding: 20px 16px; }
+            .form-row { grid-template-columns: 1fr; }
+            .form-actions { flex-direction: column; }
+            .form-actions .btn { width: 100%; text-align: center; }
+        }
+    </style>
+</head>
+<body>
+    <!-- 导航栏 -->
+<?php include 'nav.php'; ?>
+
+    <main class="main-content">
+        <div class="form-container">
+            <div class="form-card">
+                <h2>✏️ 编辑电影</h2>
+                <p class="sub">修改「<?= h($movie['title']) ?>」的信息</p>
+
+                <?php if ($error): ?><div class="error-box"><?= h($error) ?></div><?php endif; ?>
+
+                <form method="POST" action="" enctype="multipart/form-data" id="editForm">
+                    <!-- 电影名称 -->
+                    <div class="form-group">
+                        <label>电影名称 <span class="hint">*必填</span></label>
+                        <input type="text" name="title" value="<?= h($movie['title']) ?>" required>
+                    </div>
+
+                    <!-- 电影信息 -->
+                    <div class="form-group">
+                        <label>电影信息</label>
+                        <textarea name="info"><?= h($movie['info']) ?></textarea>
+                    </div>
+
+                    <!-- 观影日期 -->
+                    <div class="form-group">
+                        <label>观影日期 <span class="hint">*必填</span></label>
+                        <input type="date" name="watch_date" value="<?= $movie['watch_date'] ?>" required>
+                    </div>
+
+                    <!-- 电影院 -->
+                    <div class="form-group">
+                        <label>电影院</label>
+                        <select name="cinema_id" id="cinemaSelect" onchange="toggleNewCinema()">
+                            <option value="">-- 不选择 --</option>
+                            <?php foreach ($cinemas as $c): ?>
+                                <option value="<?= $c['id'] ?>" <?= ($movie['cinema_id'] == $c['id']) ? 'selected' : '' ?>>
+                                    <?= h($c['place']) ?> · <?= h($c['name']) ?>
+                                </option>
+                            <?php endforeach; ?>
+                            <option value="new">➕ 新建电影院</option>
+                        </select>
+                    </div>
+                    <div class="cinema-new-group" id="newCinemaGroup" style="display: none;">
+                        <div class="form-group">
+                            <label>所在地方 <span class="hint">如: 万达广场</span></label>
+                            <input type="text" name="new_cinema_place" placeholder="如: 万达广场">
+                        </div>
+                        <div class="form-group">
+                            <label>电影院名称 <span class="hint">*必填</span></label>
+                            <input type="text" name="new_cinema_name" placeholder="如: 万达影城(IMAX店)">
+                        </div>
+                        <div class="form-group">
+                            <label>详细地址</label>
+                            <input type="text" name="new_cinema_address" placeholder="详细地址">
+                        </div>
+                    </div>
+
+                    <!-- 观影人 -->
+                    <div class="form-group">
+                        <label>一起看的人</label>
+                        <div id="viewerContainer"></div>
+                        <button type="button" class="btn-add-viewer" onclick="addViewerRow()">➕ 添加一位</button>
+                        <div class="form-hint">选择已有观影人，或选择“新增”后输入姓名</div>
+                    </div>
+
+                    <!-- 海报 -->
+                    <div class="form-group">
+                        <label>电影海报</label>
+                        <div>
+                            <?php if ($movie['poster_path'] && file_exists(__DIR__ . '/' . $movie['poster_path'])): ?>
+                                <img src="/<?= $movie['poster_path'] ?>" class="image-preview" id="posterPreview">
+                                <br>
+                                <button type="button" class="crop-btn" onclick="openCrop('poster', '/<?= $movie['poster_path'] ?>')">✂️ 裁剪海报</button>
+                                <input type="hidden" name="poster_crop" id="poster_crop">
+                            <?php else: ?>
+                                <span style="color:var(--text-secondary);font-size:14px;">暂无海报</span>
+                            <?php endif; ?>
+                        </div>
+                        <div style="margin-top:6px;">
+                            <label style="font-weight:400;font-size:13px;">或上传新海报：</label>
+                            <input type="file" name="poster" accept="image/*">
+                        </div>
+                    </div>
+
+                    <!-- 票根 -->
+                    <div class="form-group">
+                        <label>电影票扫描件</label>
+                        <div>
+                            <?php if ($movie['ticket_path'] && file_exists(__DIR__ . '/' . $movie['ticket_path'])): ?>
+                                <img src="/<?= $movie['ticket_path'] ?>" class="image-preview" id="ticketPreview">
+                                <br>
+                                <button type="button" class="crop-btn" onclick="openCrop('ticket', '/<?= $movie['ticket_path'] ?>')">✂️ 裁剪票根</button>
+                                <input type="hidden" name="ticket_crop" id="ticket_crop">
+                            <?php else: ?>
+                                <span style="color:var(--text-secondary);font-size:14px;">暂无票根</span>
+                            <?php endif; ?>
+                        </div>
+                        <div style="margin-top:6px;">
+                            <label style="font-weight:400;font-size:13px;">或上传新票根：</label>
+                            <input type="file" name="ticket" accept="image/*">
+                        </div>
+                    </div>
+
+                    <!-- 观影照片 -->
+                    <div class="form-group">
+                        <label>观影照片</label>
+                        <div>
+                            <?php if (!empty($movie['photos'])): ?>
+                                <?php foreach ($movie['photos'] as $photo): ?>
+                                    <div class="photo-item" id="photo_<?= $photo['id'] ?>">
+                                        <img src="/<?= $photo['photo_path'] ?>" class="image-preview" style="display:block;">
+                                        <button type="button" class="crop-btn" onclick="openCrop('photo_<?= $photo['id'] ?>', '/<?= $photo['photo_path'] ?>')">✂️ 裁剪</button>
+                                        <input type="hidden" name="photo_crop[<?= $photo['id'] ?>]" id="photo_crop_<?= $photo['id'] ?>">
+                                    </div>
+                                <?php endforeach; ?>
+                            <?php else: ?>
+                                <span style="color:var(--text-secondary);font-size:14px;">暂无观影照片</span>
+                            <?php endif; ?>
+                        </div>
+                        <div style="margin-top:6px;">
+                            <label style="font-weight:400;font-size:13px;">新增照片（可多选）：</label>
+                            <input type="file" name="new_photos[]" accept="image/*" multiple>
+                        </div>
+                    </div>
+
+                    <div class="form-actions">
+                        <button type="submit" class="btn btn-primary">💾 保存修改</button>
+                        <a href="detail.php?id=<?= $id ?>" class="btn btn-secondary">取消</a>
+                    </div>
+                </form>
+            </div>
+        </div>
+    </main>
+
+    <!-- 裁剪模态框 -->
+    <div class="modal-overlay" id="cropModal">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h3>✂️ 裁剪图片</h3>
+                <button class="close-btn" onclick="closeCrop()">&times;</button>
+            </div>
+            <div class="modal-body">
+                <img id="cropImage" src="">
+            </div>
+            <div class="modal-footer">
+                <button class="btn btn-outline" onclick="closeCrop()">取消</button>
+                <button class="btn btn-primary" onclick="cropSave()">✅ 确认裁剪</button>
+            </div>
+        </div>
+    </div>
+
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.13/cropper.min.js"></script>
+    <script>
+        // ============================================================
+        // 完整 JavaScript
+        // ============================================================
+
+        // ---------- 观影人 ----------
+        var allPersons = <?= json_encode($all_persons) ?>;
+        var selectedPersonIds = <?= json_encode($current_person_ids) ?>;
+
+        function createViewerRow(value) {
+            var container = document.getElementById('viewerContainer');
+            var div = document.createElement('div');
+            div.className = 'viewer-input-group';
+            var selectHtml = '<select name="viewer_select[]" onchange="toggleNewViewer(this)" class="viewer-select" style="flex:1;padding:8px;border:1px solid #ddd;border-radius:6px;">';
+            selectHtml += '<option value="">-- 选择 --</option>';
+            allPersons.forEach(function(p) {
+                var selected = (p.id == value) ? 'selected' : '';
+                selectHtml += '<option value="' + p.id + '" ' + selected + '>' + p.name + '</option>';
+            });
+            selectHtml += '<option value="new" ' + (value === 'new' ? 'selected' : '') + '>➕ 新增</option>';
+            selectHtml += '</select>';
+            var inputHtml = '<input type="text" name="viewers_new[]" placeholder="输入新姓名" style="flex:1;display:' + (value === 'new' ? 'block' : 'none') + ';padding:8px;border:1px solid #ddd;border-radius:6px;">';
+            var removeBtn = '<button type="button" class="btn-remove-viewer" onclick="removeViewerRow(this)">×</button>';
+            div.innerHTML = selectHtml + inputHtml + removeBtn;
+            container.appendChild(div);
+        }
+
+        function toggleNewViewer(select) {
+            var parent = select.parentElement;
+            var input = parent.querySelector('input[name="viewers_new[]"]');
+            if (select.value === 'new') {
+                input.style.display = 'block';
+                input.required = true;
+            } else {
+                input.style.display = 'none';
+                input.required = false;
+                input.value = '';
+            }
+        }
+
+        function addViewerRow(value) {
+            value = value || '';
+            createViewerRow(value);
+        }
+
+        function removeViewerRow(btn) {
+            var container = document.getElementById('viewerContainer');
+            if (container.children.length > 1) {
+                btn.parentElement.remove();
+            }
+        }
+
+        document.addEventListener('DOMContentLoaded', function() {
+            var container = document.getElementById('viewerContainer');
+            container.innerHTML = '';
+            if (selectedPersonIds.length > 0) {
+                selectedPersonIds.forEach(function(pid) {
+                    if (pid === 0) createViewerRow('');
+                    else createViewerRow(pid);
+                });
+            } else {
+                createViewerRow('');
+            }
+            toggleNewCinema();
+        });
+
+        // ---------- 电影院 ----------
+        function toggleNewCinema() {
+            var select = document.getElementById('cinemaSelect');
+            var group = document.getElementById('newCinemaGroup');
+            group.style.display = select.value === 'new' ? 'block' : 'none';
+        }
+
+        // ---------- 裁剪 ----------
+        let cropper = null;
+        let currentTarget = '';
+
+        function openCrop(target, imgSrc) {
+            currentTarget = target;
+            var img = document.getElementById('cropImage');
+            img.src = imgSrc;
+            document.getElementById('cropModal').classList.add('active');
+            if (cropper) {
+                cropper.destroy();
+                cropper = null;
+            }
+            setTimeout(function() {
+                cropper = new Cropper(img, {
+                    aspectRatio: NaN,
+                    viewMode: 1,
+                    dragMode: 'move',
+                    autoCropArea: 0.8,
+                    responsive: true,
+                    restore: false,
+                });
+            }, 150);
+        }
+
+        function closeCrop() {
+            document.getElementById('cropModal').classList.remove('active');
+            if (cropper) {
+                cropper.destroy();
+                cropper = null;
+            }
+        }
+
+        function cropSave() {
+            if (!cropper) {
+                alert('请先加载图片');
+                return;
+            }
+            try {
+                var canvas = cropper.getCroppedCanvas({
+                    width: 600,
+                    height: 600,
+                    imageSmoothingQuality: 'high',
+                });
+                if (!canvas) {
+                    alert('裁剪失败，请重试');
+                    return;
+                }
+                var base64 = canvas.toDataURL('image/jpeg', 0.9);
+                if (currentTarget === 'poster') {
+                    document.getElementById('poster_crop').value = base64;
+                    var preview = document.getElementById('posterPreview');
+                    if (preview) preview.src = base64;
+                } else if (currentTarget === 'ticket') {
+                    document.getElementById('ticket_crop').value = base64;
+                    var preview = document.getElementById('ticketPreview');
+                    if (preview) preview.src = base64;
+                } else if (currentTarget.startsWith('photo_')) {
+                    var photoId = currentTarget.replace('photo_', '');
+                    document.getElementById('photo_crop_' + photoId).value = base64;
+                    var preview = document.querySelector('#photo_' + photoId + ' .image-preview');
+                    if (preview) preview.src = base64;
+                }
+                closeCrop();
+            } catch (e) {
+                alert('裁剪失败：' + e.message);
+            }
+        }
+
+        // 点击模态框外部关闭
+        document.getElementById('cropModal').addEventListener('click', function(e) {
+            if (e.target === this) {
+                closeCrop();
+            }
+        });
+    </script>
+</body>
+</html>