better-staridc-MNBT
1<?php
2if (!defined('IN_CRONLITE')) {
3 exit;
4}
5mnbt_admin_include('head');
6
7$mode = mnbt_plugin_option_get('home_demo', 'mode', 'off');
8if (!in_array($mode, ['off', 'redirect', 'render'], true)) {
9 $mode = 'off';
10}
11$redirectTarget = mnbt_plugin_option_get('home_demo', 'redirect_target', '/user');
12$siteBase = '/';
13?>
14<style>
15.home-demo-mode-card{cursor:pointer;transition:all .2s;border:2px solid transparent;}
16.home-demo-mode-card.active{border-color:#4094f6;background:#f3f9ff;}
17.home-demo-mode-card:hover{background:#f8f9fa;}
18.home-demo-mode-card.active:hover{background:#f3f9ff;}
19</style>
20<div class="container-fluid p-t-15">
21 <div class="card">
22 <div class="card-header"><h4>首页接管示例</h4></div>
23 <div class="card-body">
24 <p class="text-muted">本插件演示如何接管站点根路径 <code>/</code> 的响应。下方三种模式择一启用后，访问 <a href="<?php echo htmlspecialchars($siteBase, ENT_QUOTES, 'UTF-8'); ?>" target="_blank">站点首页</a> 即可看到效果。</p>
25
26 <h5 class="mt-3">模式选择</h5>
27 <div class="row mt-2">
28 <div class="col-md-4 mb-3">
29 <div class="card home-demo-mode-card p-3" data-mode="off">
30 <div class="d-flex align-items-center">
31 <i class="mdi mdi-close-circle-outline mr-2" style="font-size:24px;color:#6c757d"></i>
32 <div>
33 <h6 class="mb-0">不接管</h6>
34 <small class="text-muted">回退到默认 /user 跳转</small>
35 </div>
36 </div>
37 </div>
38 </div>
39 <div class="col-md-4 mb-3">
40 <div class="card home-demo-mode-card p-3" data-mode="redirect">
41 <div class="d-flex align-items-center">
42 <i class="mdi mdi-redirect mr-2" style="font-size:24px;color:#4094f6"></i>
43 <div>
44 <h6 class="mb-0">重定向</h6>
45 <small class="text-muted">跳转到指定 URL</small>
46 </div>
47 </div>
48 </div>
49 </div>
50 <div class="col-md-4 mb-3">
51 <div class="card home-demo-mode-card p-3" data-mode="render">
52 <div class="d-flex align-items-center">
53 <i class="mdi mdi-monitor mr-2" style="font-size:24px;color:#28a745"></i>
54 <div>
55 <h6 class="mb-0">渲染首页</h6>
56 <small class="text-muted">直接输出自定义 HTML</small>
57 </div>
58 </div>
59 </div>
60 </div>
61 </div>
62
63 <div id="redirect-config" class="mt-3" style="display:none">
64 <label>重定向目标 URL</label>
65 <input type="text" class="form-control" id="redirect-target" value="<?php echo htmlspecialchars((string)$redirectTarget, ENT_QUOTES, 'UTF-8'); ?>" placeholder="/user 或 https://example.com" maxlength="500">
66 <small class="form-text text-muted">支持相对路径（如 <code>/user</code>、<code>/admin</code>）或绝对 URL。</small>
67 </div>
68
69 <div class="mt-4">
70 <button type="button" class="btn btn-primary" id="btn-save"><i class="mdi mdi-content-save mr-1"></i>保存配置</button>
71 <a href="<?php echo htmlspecialchars($siteBase, ENT_QUOTES, 'UTF-8'); ?>" target="_blank" class="btn btn-outline-secondary ml-2"><i class="mdi mdi-open-in-new mr-1"></i>测试首页</a>
72 </div>
73
74 <hr class="mt-4">
75 <h5>通用路由演示</h5>
76 <p class="text-muted">本插件还注册了两个示例路由（需 Web 服务器配置 rewrite，详见 <a href="../plugin.php?p=home_demo&page=index#">PLUGIN_DEV.md</a>）：</p>
77 <ul>
78 <li><code>GET /landing</code> — 活动落地页，<a href="<?php echo htmlspecialchars($siteBase . 'landing', ENT_QUOTES, 'UTF-8'); ?>" target="_blank">点击测试</a></li>
79 <li><code>GET /promo/{id}</code> — 带命名参数，<a href="<?php echo htmlspecialchars($siteBase . 'promo/mnbt2026', ENT_QUOTES, 'UTF-8'); ?>" target="_blank">点击测试</a></li>
80 </ul>
81
82 <div class="alert alert-info mt-3">
83 <i class="mdi mdi-information mr-1"></i>
84 <strong>提示：</strong>开发环境（<code>php -S localhost:8080 _router.php</code>）已自动支持路由；生产环境需配置 nginx/apache rewrite 把未命中文件的请求转发到 <code>index.php</code>。
85 </div>
86 </div>
87 </div>
88</div>
89<script>
90(function () {
91 var currentMode = <?php echo json_encode($mode); ?>;
92 var cards = document.querySelectorAll('.home-demo-mode-card');
93 var redirectBox = document.getElementById('redirect-config');
94
95 function refreshUI(mode) {
96 cards.forEach(function (c) {
97 c.classList.toggle('active', c.getAttribute('data-mode') === mode);
98 });
99 redirectBox.style.display = (mode === 'redirect') ? 'block' : 'none';
100 }
101 refreshUI(currentMode);
102
103 cards.forEach(function (c) {
104 c.addEventListener('click', function () {
105 refreshUI(c.getAttribute('data-mode'));
106 });
107 });
108
109 function getCurrentMode() {
110 var active = document.querySelector('.home-demo-mode-card.active');
111 return active ? active.getAttribute('data-mode') : 'off';
112 }
113
114 function parseRes(res) {
115 try { return typeof res === 'string' ? JSON.parse(res) : res; } catch (e) { return { code: res }; }
116 }
117 function notify(msg, ok) {
118 if (typeof $.notify === 'function') $.notify({ message: msg }, { type: ok ? 'success' : 'danger' });
119 else alert(msg);
120 }
121
122 document.getElementById('btn-save').addEventListener('click', function () {
123 var data = {
124 gn: 'p_home_demo_save',
125 mode: getCurrentMode(),
126 redirect_target: document.getElementById('redirect-target').value
127 };
128 $.post('ajax.php', data, function (res) {
129 var d = parseRes(res);
130 var msg = d.msg || d.code || '完成';
131 notify(msg, d.qk == 1 || d.success === true);
132 });
133 });
134})();
135</script>