547 lines
37 KiB
Markdown
547 lines
37 KiB
Markdown
# 网站首页修订版 Plan（v2）
|
||
|
||
> 本文件在 `plan.txt` 基础上修订：补全缺失说明、澄清歧义、统一各处术语。
|
||
> 凡原 plan 未说明而本文给出默认值的，均已标注 **【决策】**，可自行调整。
|
||
> 本版以"可直接指导编码实现"为标准编写，页面清单、数据模型、布局规格均已明确。
|
||
|
||
---
|
||
|
||
## 1. 修订要点总览（原 plan 问题 → 本版处理）
|
||
|
||
| # | 原 plan 问题 | 本版处理 |
|
||
| --- | -------------------------------------------------------------------------------------- | --------------------------------------------------------------------------- |
|
||
| 1 | 页面体系与跳转关系未定义 | §2 站点地图，明确首页为最前置页，三大知识库各有独立导航区，工具库跳转功能区 |
|
||
| 2 | 首页百分比布局自相矛盾（60% 主内容 / 20% 展示栏 / 40% 导航 / 剩余 40% 里"中部主内容"） | §4 重构为自洽的分区模型，保留 20% 展示栏 + 40% 板块区意图 |
|
||
| 3 | 技术栈表述笼统 | §3 确定 PHP + SQLite(PDO) + 原生 HTML/CSS/JS，可加 layui |
|
||
| 4 | 导航区"留白 10% / 上半部 20%"表述含糊 | §5 给出明确高度计算规则 |
|
||
| 5 | "按钮上分蹦出来一个语言栏"（疑似笔误） | §5 定义为悬浮气泡 tooltip 显示备注 |
|
||
| 6 | 导航块数据来源、后台归属、超量排布未定义 | §5.3 + §7 数据模型 + §6.4 分栏规则 |
|
||
| 7 | 功能区首页布局缺失、顶部组件关系不清 | §6 定义功能区首页网格布局 + 三类顶部组件分工 |
|
||
| 8 | 后台"顺序排布 / 内容设计"对象空泛 | §7.3 拆解为可操作的具体配置项 |
|
||
| 9 | 登录会话 / 初始管理员 / 越权访问缺失 | §7.1、§7.2 补齐 |
|
||
| 10 | quota.txt、avlist.js 格式未约定 | §10 明确格式 |
|
||
| 11 | 备案号、版权文本来源未说明 | §7.3.2 后台可配置 + 默认占位 |
|
||
| 12 | 移动端适配规则不全 | §9 响应式断点表 |
|
||
| 13 | 目录结构缺失 | §8 目录规划 |
|
||
| 14 | "上次更新时间"无定义 | §4.5 定义数据来源与刷新逻辑 |
|
||
| 15 | 密码"base64+md5"安全局限 | §7.1 注明局限（按需求实现） |
|
||
| 16 | 板块 hover 展开交互描述绕口 | §4.6 重写为实现级规格 |
|
||
|
||
---
|
||
|
||
## 2. 站点地图与页面跳转关系
|
||
|
||
站点逻辑结构（已确认）：
|
||
|
||
```
|
||
首页区（index）
|
||
├─ 科普库 → 科普导航页
|
||
├─ 红队库 → 红队导航页
|
||
├─ 蓝队库 → 蓝队导航页
|
||
└─ 工具库 → 功能区
|
||
功能区首页
|
||
├─ 编码/加解密页
|
||
├─ 随机密码生成页
|
||
├─ 二维码生成器
|
||
└─ 杀软识别页
|
||
后台区（/admin，需登录）
|
||
```
|
||
|
||
页面清单：
|
||
|
||
| 区域 | 页面 | 文件（建议） | 说明 |
|
||
| -------- | ------------------------ | --------------------- | ----------------------------------------------------------------------------- |
|
||
| 首页区 | 首页 | `index.php` | 最前置页面 |
|
||
| 导航区 | 科普库导航页 | `nav.php?cat=popular` | 科普 / 红队 / 蓝队 三个导航页共用同一模板，按分类参数取数，等价于三个独立页面 |
|
||
| 导航区 | 红队库导航页 | `nav.php?cat=red` | 同上 |
|
||
| 导航区 | 蓝队库导航页 | `nav.php?cat=blue` | 同上 |
|
||
| 功能区 | 功能区首页 | `func/index.php` | 工具入口列表 |
|
||
| 功能区 | 编码/加解密 | `func/codec.php` | |
|
||
| 功能区 | 随机密码生成 | `func/password.php` | |
|
||
| 功能区 | 二维码生成器 | `func/qrcode.php` | |
|
||
| 功能区 | 杀软识别 | `func/av.php` | |
|
||
| 后台区 | 登录页 | `admin/login.php` | |
|
||
| 后台区 | 导航内容管理（增删改查） | `admin/nav.php` | 含排序 |
|
||
| 后台区 | 功能区管理（工具入口） | `admin/tools.php` | 工具增删改/排序/启停，见 §6.2 |
|
||
| 后台区 | 顺序排布 / 内容设计 | `admin/content.php` | 见 §7.3 |
|
||
| 数据接口 | JSON 输出 | `api/nav.php` 等 | 供页面 JS 取导航数据 |
|
||
|
||
> **【决策】文件全部采用 `.php`**：便于统一 include 顶部栏/页脚、做导航数据渲染、后台鉴权；
|
||
> 纯前端静态页若要读 sqlite 也必须走后端接口，统一为 PHP 最省事。
|
||
|
||
---
|
||
|
||
## 3. 技术栈与运行环境
|
||
|
||
- 后端：**PHP ≥ 7.4 + PDO_SQLITE 扩展**，数据库 `data/homepage.db`（SQLite3 文件）。
|
||
- 前端：原生 HTML5 + CSS3 + 原生 JS；允许引入 layui 或轻量库（见 §6 工具页选型）。
|
||
- 编码类算法：优先原生 Web Crypto（SHA）；UTF-8 编解码用 `TextEncoder`/`TextDecoder`；如需统一兼容 IE 类场景才引入 `crypto-js`。**【决策：现代浏览器优先，不兼容老 IE】**
|
||
- 二维码：引入 `qrcodejs`（单文件 JS 库）。
|
||
- 部署形态：最终放置于服务器（Apache/Nginx + PHP），文档根目录即本工程目录。
|
||
|
||
> 实现约束：编码/加解密、密码生成等均为纯前端 JS 计算，不产生请求；仅导航数据与后台写库走 PHP。
|
||
|
||
---
|
||
|
||
## 4. 首页区规格（index.php）
|
||
|
||
### 4.1 整体分区（自洽版布局）
|
||
|
||
页面允许纵向滚动（**不用 JS 死锁 100vh**，避免小屏挤压）。各区块高度按"视口高度比例（vh）+ 自然内容高度"混用，规格如下：
|
||
|
||
| 区块 | 顺序 | 高度规格 | 内容 |
|
||
| ------------- | ---- | ----------------------------------- | ----------------- |
|
||
| A. 顶部展示栏 | 1 | 约 20vh（自适应，最小不低于 120px） | 见 §4.2 |
|
||
| B. 名言条 | 2 | 内容自适应（约占 10% 视口） | 随机名言，见 §4.3 |
|
||
| C. 四大板块区 | 3 | 约 40vh 起，内容超高可自然延伸 | 见 §4.4 / §4.6 |
|
||
| D. 页脚 | 4 | 内容自适应 | 见 §4.7 |
|
||
|
||
> 原 plan"主内容占 60%（20% 展示栏 + 40% 板块）+ 剩余 40% 内 10% 名言 + 下部备案"存在加总冲突，
|
||
> 本版将"20% 展示栏 + 40% 板块 + 10% 名言"作为主要视口内规划（合计约 70%，留有余量），备案等落入页脚区块，不再要求凑满 100vh。
|
||
|
||
### 4.2 顶部展示栏（首页版）
|
||
|
||
- 整体居中布局，内部水平分布：
|
||
- **左侧**：站点 Logo + 站点名称/副标题。
|
||
- **右侧**：当前时间（实时刷新，格式 `YYYY-MM-DD HH:mm:ss`）+ 上次更新时间（见 §4.5）。
|
||
- **下方居中**：天气区块：`<iframe width="500" height="40" src="https://i.tianqi.com/?c=code&a=getcode&id=173&icon=1" frameborder="0"></iframe>`（在移动端可改为宽度 100% 居中，iframe 原样保留尺寸缩放）。
|
||
- 展示栏背景与整体风格统一（§4.8）。
|
||
|
||
### 4.3 名言条（B 区块）
|
||
|
||
- 内容源：`data/quota.txt`，每次**刷新页面随机取一条**（也可用 JS 刷新按钮换一条）。
|
||
- 文件格式见 §10.1。
|
||
- 名言为空/文件缺失时显示默认文案，页面不报错。
|
||
|
||
### 4.4 四大板块区（C 区块）
|
||
|
||
- 四个板块横排均分，按后台 categories 顺序渲染：
|
||
**科普库 → 科普导航页**、**红队库 → 红队导航页**、**蓝队库 → 蓝队导航页**、**工具库 → 功能区首页**。
|
||
- 板块区上方不再显示“四大板块”大标题，改为**快捷站点胶囊条**（数据表 `quick_links`，后台“内容与顺序”维护）：
|
||
- 用于放置本域名下其它网站，点击 `target="_blank"` 新标签页打开且保留本页；
|
||
- 无配置时不显示该条，板块区保持居中填满布局。
|
||
- 每个板块卡片内容：图标 + 名称 + 一句话简介（文案后台可配，见 §7.3.2）。
|
||
- 点击行为：科普/红/蓝打开对应导航页；工具库打开功能区首页。
|
||
- 基础悬停：变色/放大反馈；高级展开说明见 §4.6。
|
||
|
||
### 4.5 "上次更新时间"定义（【决策】）
|
||
|
||
含义 = **导航库内容最近一次被后台修改的时间**。
|
||
|
||
- 后台任何写库操作成功后，同步写入 `settings` 表键 `last_updated`（格式时间戳）。
|
||
- 页面通过 PHP 端直接输出该值；无记录时显示"暂无更新记录"。
|
||
- 不跟随"站点上线时间"，只代表内容数据新鲜度。
|
||
|
||
### 4.6 板块 hover 展开说明（高级要求，实现级规格）
|
||
|
||
目的：鼠标悬停某板块时，弹出**只读说明层**，覆盖在板块区上方，用于解释该库是什么；该层**不可点击、不参与布局**（position: absolute 叠层）。
|
||
|
||
规则：
|
||
|
||
1. 悬停任一板块 → 生成该板块说明浮层，覆盖其上方并向外**延展**，延展优先方向：
|
||
- 处于最左侧板块：向右延展；处于最右侧板块：向左延展；
|
||
- 处于中间板块时：浮层**移位显示到距其最近的边缘空白侧**（第 2 块→吸附左侧边缘展开，第 3 块→吸附右侧边缘展开）。
|
||
2. 所有板块的**实际位置在展开过程中不移动**（视觉上"旁侧浮现"由浮层绝对定位实现，不做网格挤压）。
|
||
3. 鼠标移出四大板块整体区域 → 浮层消失。
|
||
4. 鼠标从一块移到另一块 → 浮层内容与吸附位置即时切换为该板块。
|
||
5. 浮层 z-index 高于板块卡片；浮层 pointer-events 不拦截，防止遮挡后无法移动鼠标。
|
||
|
||
> 说明文案来源：categories.description，可在后台"内容设计"中编辑。**【决策：文案每块 1~3 句】**
|
||
|
||
### 4.7 页脚（D 区块）
|
||
|
||
内容：ICP 备案号（`备案号`占位，后台可配）、公安备案号（后台可配，含图标）、版权声明（默认 `© 2026 <站点名> 版权所有`，后台可配）、站点名/其他自定义文本（后台可配，见 §7.3.2）。底部同时放一个低调的"后台管理"入口链接（指向 `admin/login.php`）。
|
||
|
||
### 4.8 统一视觉规范（全局）
|
||
|
||
| 项 | 约定 | 备注 |
|
||
| ------------ | --------------------------------------------- | ---------------------- |
|
||
| 主色 | 深空蓝 `#1f3a5f` + 强调蓝 `#2563eb` | 各页统一 |
|
||
| 背景 | 浅灰 `#f5f7fa`，卡片白底 | |
|
||
| 字体 | 系统字体栈 + 中文回退（`Microsoft YaHei` 等） | 由 CSS 变量统一 |
|
||
| 圆角/阴影 | 卡片统一 8px 圆角、轻投影 | |
|
||
| 全局公共样式 | 独立 `assets/css/common.css` | 各页引入，保证风格一致 |
|
||
| favicon/标题 | 站点名作为 `<title>` 统一后缀 | 后台可改站点名 |
|
||
|
||
---
|
||
|
||
## 5. 导航区规格（nav.php，科普/红队/蓝队共用）
|
||
|
||
### 5.1 页面纵向结构
|
||
|
||
自顶向下依次为：
|
||
|
||
| 区块 | 规则 | 备注 |
|
||
| ---------- | ---------------------------------------------------- | ------------------------------------------------ |
|
||
| 顶部留白 | 约 **10vh**（不小于 60px） | 纯背景留白，不做内容 |
|
||
| 搜索栏 | 位于留白之下，高度 **20vh**（下限 72px、上限 160px） | 即原 plan"上半部 20% + 最上方留白 10%"的明确算法 |
|
||
| 导航内容区 | 占据剩余空间，内容超高时**整页纵向滚动** | 见 5.3 |
|
||
|
||
### 5.2 搜索栏规格（高级要求）
|
||
|
||
- 结构（水平一行，居中，定宽容器内）：**引擎切换按钮（左）｜输入框（中）｜搜索按钮（右）**。
|
||
- 引擎切换：点击循环切换或下拉选择，引擎列表默认：`bing / baidu / github / google`（**【决策】可通过后端接口/常量维护，便于增删**）。
|
||
- 搜索 URL 模板（选中引擎后拼 `关键词` 后 `target="_blank"` 新开页）：
|
||
- bing: `https://www.bing.com/search?q={kw}`
|
||
- baidu: `https://www.baidu.com/s?wd={kw}`
|
||
- github: `https://github.com/search?q={kw}`
|
||
- google: `https://www.google.com/search?q={kw}`
|
||
- 输入框**有内容**时，最右侧出现"清除（×）"按钮；点击清空并聚焦。
|
||
- 触发方式：点击搜索按钮或**回车**。
|
||
- 关键词需 `encodeURIComponent` 处理。
|
||
|
||
### 5.3 导航内容区（主体）
|
||
|
||
- 桌面（≥1200px）：
|
||
- 页面左右两侧各留白 **15%**；
|
||
- 中间 70% 区域划分为**三大列**（列宽相等、列间有间距）；
|
||
- 大列**无标题**，仅是布局容器。
|
||
- 导航块（最小管理单元）：
|
||
- 每个块 = **1 个块标题（加粗居左）+ 内部 3 小列 × 5 行**（即每块最多 15 个按钮位）；
|
||
- 块标题、按钮是否填满不限制（3 列 5 行是最大学位，不足则留空）。
|
||
- 块尺寸固定（宽度=所在列宽，高度固定，各按钮行高统一）。
|
||
- 分列规则（【决策】）：取当前分类下所有导航块（按 sort 排序），**按序轮转填充三列**（第 1 块→列1，第 2 块→列2，第 3 块→列3，第 4 块→列1……），保证三列块数均衡；列内纵向堆叠，超高则整页滚动。
|
||
- 按钮交互：
|
||
- 鼠标移上 → 按钮变色（统一高亮样式）；
|
||
- 该按钮存在备注信息时 → **浮出悬浮气泡 tooltip** 显示备注，移出消失；无备注仅变色；
|
||
- 点击 → `target="_blank"` 新标签页打开链接（加 `rel="noopener noreferrer"`）。
|
||
- 链接规范：允许完整 URL（http/https）；后台录入时为空则按钮置灰不可点。
|
||
- 内容来源：按当前 `cat`（popular/red/blue）读取 `nav_blocks`、`nav_items`（§7.4）。
|
||
- 空状态：无任何块时显示占位提示，不报错。
|
||
|
||
### 5.4 移动端
|
||
|
||
见 §9 响应式；核心：中间区域改单列，导航块铺满屏宽，块内 3 小列在 ≥600px 保持 3 列、<600px 折叠为 1 列或 2 列（【决策：<600px 时单小列显示，即一行一个按钮】）。导航块标题列布局保留。
|
||
|
||
---
|
||
|
||
## 6. 功能区规格
|
||
|
||
### 6.1 页面清单与公共头部（功能区统一）
|
||
|
||
功能区包含 1 个入口首页 + 4 个工具页。所有功能区页面使用统一的**功能页头部条**（区别于首页展示栏）：
|
||
|
||
```
|
||
[ ← 返回功能区首页 ] 本功能页标题（居中） [ 首页 ]
|
||
```
|
||
|
||
- 最左侧按钮 → 返回 `func/index.php`（功能子页上）；在功能区首页本身时该按钮隐藏或置灰。
|
||
- 最右侧按钮 → 返回站点首页 `index.php`。
|
||
- 中间标题 → 当前功能页名称。
|
||
- 功能区首页的头部条中间显示"功能区"。
|
||
|
||
### 6.2 功能区首页（func/index.php）
|
||
|
||
- 顶部为风格统一的大展示横幅（复用首页视觉，可含功能区简介）。
|
||
- 主体为工具**卡片网格**：每张卡片 = 图标 + 工具名 + 一句话说明，点击进入对应子页。
|
||
- 工具卡片列表**由 `func_tools` 表驱动，后台“功能区管理”（admin/tools.php）可增删改/排序/启停**：
|
||
- 站内工具（如 codec.php）：需先在 `func/` 下开发对应页面，再到后台登记入口；
|
||
- 外链工具：填写完整 http(s) 地址，作为新窗口卡片直接使用，无需写代码；
|
||
- 默认预置：编码/加解密、随机密码生成、二维码生成器、杀软识别四张卡片。
|
||
|
||
### 6.3 编码/加解密页（func/codec.php）
|
||
|
||
- **布局**：左侧算法/方向选择区 + 上下（或左右）两个**自由编辑**文本区（输入区、输出区）。
|
||
- 两个文本区都允许用户自由编辑；输出区不设只读。
|
||
- 两个文本区均支持 **右下角拖拽竖向放大（resize: vertical），横向宽度不变**。
|
||
- 提供"交换 / 回填"便捷操作：将输出内容一键放回输入、或将输入/输出一键互换（【决策】）。
|
||
- **支持算法与方向**：
|
||
|
||
| 算法 | 编码方向 | 解码方向 | 实现要求 |
|
||
| --------------------- | -------------------- | -------------------- | --------------------------------------------------------------------------- |
|
||
| Base64 | 编码 | 解码 | 支持中文等 Unicode：先 UTF-8 再 Base64 |
|
||
| Base32 | 编码 | 解码 | 同上 |
|
||
| MD5 | — | 不可逆 | 输出 32 位十六进制小写 |
|
||
| SHA-1/224/256/384/512 | — | 不可逆 | 输出十六进制小写 |
|
||
| URL | `encodeURIComponent` | `decodeURIComponent` | 整段处理 |
|
||
| Unicode | 中→`\uXXXX` 序列 | `\uXXXX`→文本 | 需支持中文；emoji/增补字符按 UTF-16 代理对编码成两个 `\uXXXX`，解码正确还原 |
|
||
|
||
- 交互模型：选算法 + 选方向（编码/解码/加密哈希等按需）→ 点击"执行" → 结果写入输出区；错误（非法输入等）以页面内提示展示，不弹窗。
|
||
- 执行按钮文案随方向变化（如"编码""解码""加密"）。
|
||
|
||
### 6.4 随机密码生成页（func/password.php）
|
||
|
||
- 字符集选项（多选/开关）：
|
||
- 大写字母 `A-Z`、小写字母 `a-z`、数字 `0-9`、特殊符号（建议默认 `!@#$%^&*()-_=+[]{};:,.<>?`）；
|
||
- **自定义字符集输入框**：勾选后启用，用户自定义任意字符（去重）；勾选"自定义"时以自定义为准，忽略其余开关。
|
||
- 长度：滑块或数字输入，范围 **4~64**，默认 16。
|
||
- 生成：一次生成 **多组（默认 5 条）**【决策】，逐条显示在可编辑文本区/列表，每条后带"复制"按钮。
|
||
- 结果文本区同样支持竖向拖拽放大。
|
||
- 至少选一个字符集且长度合法才可生成，否则提示。
|
||
|
||
### 6.5 二维码生成器（func/qrcode.php）
|
||
|
||
- 输入框 + "生成"按钮；使用 `qrcodejs` 渲染。
|
||
- **放大预览**：提供尺寸滑块（如 128~512px）或点击图片弹出大图预览（大图可在新层中查看）；**下载**：提供下载按钮，导出为 PNG（canvas 转 dataURL 或库的 toDataURL）。
|
||
- 边界处理：内容为空禁止生成；内容过长超出二维码容量时提示（库报错或预检测）。
|
||
- 空白页签、无输入时不展示二维码区。
|
||
|
||
### 6.6 杀软识别页（func/av.php）
|
||
|
||
- 输入：粘贴 `tasklist` 命令输出文本的 textarea（支持竖向放大，横向不可变）。
|
||
- 匹配库：`data/avlist.js`（§10.2）。
|
||
- 解析规则：
|
||
- 按行读取，忽略表头行（含"映像名称/Image Name/PID/==="）、空行；
|
||
- 每行取**首个 token** 为进程名（空格/制表分隔）；
|
||
- 与 `avList` 键匹配，**大小写不敏感**；key 若不带扩展名，比较时双方都去掉扩展名后再比一次（【决策】兼容两类写法）。
|
||
- 输出：匹配结果**表格**，列：`进程名 | 匹配结果 | 产品/说明`；未匹配的行结果列显示"未识别"，说明列留空。
|
||
- 附加统计：总进程数、匹配数、未识别数。
|
||
- 前端直接 `<script src="../data/avlist.js">` 引入全局 `avList` 对象即可，无需后端。
|
||
|
||
---
|
||
|
||
## 7. 后台区规格（/admin）
|
||
|
||
### 7.1 登录与会话
|
||
|
||
- 登录页：用户名 + 密码；错误统一提示"用户名或密码错误"。
|
||
- 密码存储算法：**按需求：`md5(base64(明文密码))`**。
|
||
- ⚠️ 注明局限：该方案是弱单向哈希（无盐），仅用于低安全要求的个人站；不用于高价值系统。若后期可接受，建议换 `password_hash()`（bcrypt）升级，本版实现严格按需求算法。
|
||
- 会话管理：PHP `session`，登录成功后写入 `$_SESSION['admin']`；后台所有页面（除 login 外）在顶部做鉴权：
|
||
- 未登录访问后台页 → 302 跳转 `login.php`；
|
||
- 退出登录 → `logout.php`（销毁 session 并跳登录页）；
|
||
- 会话空闲超时（**【决策】30 分钟**）后失效，需重新登录。
|
||
- 初始管理员：首次启动数据库不存在用户时，由 `install` 逻辑自动创建默认账号（**【决策】默认账号 `admin` / 密码 `admin123`，首次登录后引导修改**）。
|
||
- CSRF 防护：后台写操作表单带一次性 token（session 存），提交校验（低成本基础防护）。
|
||
- 登录尝试不做复杂限流，仅简单延时提示（个人站可接受）。
|
||
|
||
### 7.2 后台整体布局
|
||
|
||
- 后台顶部导航条：后台名称 + 快捷入口（导航内容管理 / 顺序排布与内容设计 / 返回前台首页）+ 当前管理员 + 退出。
|
||
- 后台页面自身不引入首页天气/名言等前台组件，保持简洁（风格色板仍与前台统一）。
|
||
- 所有表单保存成功后给反馈（保存成功条/提示），失败显示原因（如 SQL 错误信息可折叠展示，便于排查）。
|
||
|
||
### 7.3 后台功能拆解（原 plan 空泛项的落地）
|
||
|
||
原 plan 只写了"1.顺序排布 2.内容设计 3.导航内容增删改查"，本版将其拆成可操作模块：
|
||
|
||
#### 7.3.1 导航内容管理（admin/nav.php）
|
||
|
||
- 顶部先选择操作分类：**科普库 / 红队库 / 蓝队库**（工具库对应功能区，不在导航内容范围内）。
|
||
- 块级操作（针对 nav_blocks）：新增块、删除块、编辑块标题、块上移/下移（调整在页面中的先后）；
|
||
- 按钮位操作（针对 nav_items）：在每个块内新增/编辑/删除按钮，字段：
|
||
- 文字（必填）、URL（必填）、备注（可空，空则不显示 tooltip）、序号；
|
||
- 按钮在块内"3 小列 × 5 行"中的位置可由排序决定（**【决策】按 sort 顺序自动排列，不足位留空，不做拖拽定位到格**）；
|
||
- 前端交互：用可展开的块列表展示，每个块内按钮表格行式管理，保存按钮批量提交（一次提交当前分类全部变更）。
|
||
- 删除块/按钮需二次确认。
|
||
|
||
#### 7.3.2 内容设计（admin/content.php）
|
||
|
||
统一为一个"站点内容与设置"页，按分组编辑并保存到 `settings` 表：
|
||
|
||
| 分组 | 可编辑项 | 存储 | 用途 |
|
||
| -------- | ------------------------------------------------------------ | ---------------------------------- | ------------------------------- |
|
||
| 站点信息 | 站点名、副标题 | settings | 首页展示栏、`<title>` 后缀 |
|
||
| 板块文案 | 四大板块各自的图标选择/文案/一句话简介 | settings 或 categories.description | 首页四大板块卡片与 hover 说明层 |
|
||
| 底部信息 | ICP 备案号、公安备案号、版权行、自定义底部文本 | settings | 首页/全站页脚 |
|
||
| 名言库 | 名言**新增 / 删除 / 清空**（文本框逐行维护，写回 quota.txt） | data/quota.txt | 首页名言条 |
|
||
| 其他 | 上次更新时间说明（只读展示） | — | — |
|
||
|
||
- 底部自定义文本支持纯文本与单条链接（安全起见只允许 http(s) 开头的 `<a>` 形态，**不做富文本/HTML 注入**）。
|
||
|
||
#### 7.3.3 顺序排布（admin/content.php 或独立区）
|
||
|
||
明确排序对象与层级（自外向内）：
|
||
|
||
1. **分类（四大板块）顺序** → 决定首页四大板块横排顺序；
|
||
2. **块顺序**（每个分类内）→ 决定导航页块的前后；
|
||
3. **块内按钮顺序** → 决定按钮在块内 3×5 格中的先后。
|
||
|
||
排序交互统一提供"上移/下移 + 序号输入"两种方式（拖拽列为可选项）。
|
||
|
||
### 7.4 数据模型（SQLite DDL）
|
||
|
||
```sql
|
||
-- 管理员表
|
||
CREATE TABLE users (
|
||
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||
username TEXT UNIQUE NOT NULL,
|
||
password_hash TEXT NOT NULL -- md5(base64(明文))
|
||
);
|
||
|
||
-- 键值设置表（站点名、备案号、版权、板块文案、last_updated 等）
|
||
CREATE TABLE settings (
|
||
key TEXT PRIMARY KEY,
|
||
value TEXT
|
||
);
|
||
|
||
-- 四大板块分类（popular/red/blue/tool）
|
||
CREATE TABLE categories (
|
||
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||
key TEXT UNIQUE NOT NULL, -- popular/red/blue/tool
|
||
name TEXT NOT NULL, -- 科普库/红队库/蓝队库/工具库
|
||
description TEXT DEFAULT '', -- 首页卡片一句话简介 + hover 说明文案
|
||
sort INTEGER DEFAULT 0
|
||
);
|
||
|
||
-- 导航块（仅 popular/red/blue 三类使用）
|
||
CREATE TABLE nav_blocks (
|
||
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||
cat_id INTEGER NOT NULL REFERENCES categories(id),
|
||
title TEXT NOT NULL,
|
||
sort INTEGER DEFAULT 0
|
||
);
|
||
|
||
-- 块内按钮位（每块最多 3×5=15，由 sort 顺序占位）
|
||
CREATE TABLE nav_items (
|
||
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||
block_id INTEGER NOT NULL REFERENCES nav_blocks(id),
|
||
label TEXT NOT NULL,
|
||
url TEXT NOT NULL,
|
||
note TEXT DEFAULT '', -- 备注；空则按钮 hover 不弹气泡
|
||
sort INTEGER DEFAULT 0
|
||
);
|
||
|
||
-- 功能区工具入口（后台“功能区管理”维护）
|
||
CREATE TABLE func_tools (
|
||
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||
name TEXT NOT NULL,
|
||
icon TEXT DEFAULT '', -- 字符/emoji 图标
|
||
description TEXT DEFAULT '', -- 一句话说明
|
||
url TEXT NOT NULL DEFAULT '', -- 站内相对地址 或 外链 http(s)
|
||
is_external INTEGER NOT NULL DEFAULT 0,-- 1=外链（新窗口）
|
||
enabled INTEGER NOT NULL DEFAULT 1,-- 1=前台展示
|
||
sort INTEGER NOT NULL DEFAULT 0
|
||
);
|
||
|
||
-- 首页快捷站点（本域名其它网站，target=_blank；后台“内容与顺序”维护）
|
||
CREATE TABLE quick_links (
|
||
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||
name TEXT NOT NULL,
|
||
url TEXT NOT NULL DEFAULT '', -- 完整 http(s) 地址
|
||
icon TEXT DEFAULT '', -- 字符/emoji 图标
|
||
enabled INTEGER NOT NULL DEFAULT 1,
|
||
sort INTEGER NOT NULL DEFAULT 0
|
||
);
|
||
```
|
||
|
||
> 名言不建表（保持 quota.txt 为数据源）；`categories` 四行 + `settings` 基础键在首次运行时自动初始化（install 脚本）。
|
||
|
||
---
|
||
|
||
## 8. 目录结构规划
|
||
|
||
```
|
||
HomePage/ # 网站根（部署时即站点根）
|
||
├── index.php # 首页区
|
||
├── nav.php # 导航区模板（?cat=popular|red|blue）
|
||
├── func/
|
||
│ ├── index.php # 功能区首页
|
||
│ ├── codec.php # 编码/加解密
|
||
│ ├── password.php # 随机密码
|
||
│ ├── qrcode.php # 二维码
|
||
│ └── av.php # 杀软识别
|
||
├── admin/
|
||
│ ├── login.php # 后台登录
|
||
│ ├── logout.php
|
||
│ ├── nav.php # 导航内容管理 + 排序
|
||
│ ├── tools.php # 功能区工具入口管理
|
||
│ ├── content.php # 内容设计 / 站点设置
|
||
│ └── _guard.php # 鉴权 include（require 到各后台页顶部）
|
||
├── api/
|
||
│ └── nav.php # 输出导航 JSON（前台导航页/首页读取用）
|
||
├── includes/
|
||
│ ├── db.php # PDO + SQLite 连接与 install 初始化
|
||
│ ├── auth.php # 登录/校验/session 工具
|
||
│ └── settings.php # settings 读写封装
|
||
├── assets/
|
||
│ ├── css/common.css # 全局样式（统一风格、响应式断点）
|
||
│ ├── js/common.js # 通用组件（tooltip、竖向 resize 类等）
|
||
│ ├── js/codec.js # 编码算法（base64/base32/url/unicode）
|
||
│ ├── js/sha.js # SHA 系列
|
||
│ ├── js/qrcode.min.js # qrcodejs
|
||
│ └── img/ # logo/图标
|
||
├── data/
|
||
│ ├── homepage.db # SQLite（运行时自动创建）
|
||
│ ├── quota.txt # 名人名言（行式，后台可编辑）
|
||
│ └── avlist.js # 杀软进程映射表
|
||
└── plan.txt # 原始 plan（保留存档）
|
||
```
|
||
|
||
---
|
||
|
||
## 9. 响应式断点规划
|
||
|
||
| 断点 | 首页 | 导航区 | 功能区 |
|
||
| ------------------ | ------------------------------------- | --------------------------------------------------------------------------- | ----------------------------------- |
|
||
| ≥1200px（桌面） | 四板块横排；天气 iframe 500×40 原尺寸 | 左右各留白 15%，中间三列 | 工具卡片多列；编码页输入/输出可并排 |
|
||
| 768–1199px（平板） | 四板块两行两列或自适应横排 | 左右留白收窄至 5%，仍三列（列宽收紧） | 卡片两列 |
|
||
| <768px（手机） | 板块单列或 2×2 网格；名言条自然换行 | **单列**：中间区全宽，导航块一列、块内小列 1 列显示（原要求）；搜索栏自适应 | 卡片单列 |
|
||
|
||
补充规则：
|
||
|
||
- 顶部展示栏/搜索栏/功能页头部条在移动端自动收缩高度与内边距，天气 iframe 宽度等比缩放居中。
|
||
- 编码/二维码等页面在 <768px 时输入输出区改为上下堆叠。
|
||
- 底部备案等信息移动端居中换行。
|
||
|
||
---
|
||
|
||
## 10. 数据文件格式约定
|
||
|
||
### 10.1 data/quota.txt（名人名言）
|
||
|
||
- 编码：UTF-8（无 BOM）。
|
||
- 每行一条名言，**空行或 `#` 开头为注释**（后台编辑时自动忽略）。
|
||
- 首次实现时预置 5~10 条示例。
|
||
- 读取：后端 PHP 读取并随机输出一条（首页渲染），避免名言文件被直接下载的路径泄露问题不在此列（公开文件无碍）。
|
||
|
||
示例：
|
||
|
||
```
|
||
# 示例名言
|
||
知彼知己，百战不殆。
|
||
知识就是力量。
|
||
```
|
||
|
||
### 10.2 data/avlist.js（杀软进程映射表）
|
||
|
||
- 全局对象写法（沿用原示例结构），首次实现预置若干常见条目：
|
||
|
||
```js
|
||
var avList = {
|
||
"360tray.exe": "360 安全卫士 - 实时保护",
|
||
"360safe.exe": "360 安全卫士",
|
||
"QQPCRTP.exe": "QQ电脑管家",
|
||
"kxescore.exe": "金山毒霸",
|
||
"ekrn.exe": "ESET NOD32",
|
||
"MsMpEng.exe": "Windows Defender",
|
||
};
|
||
```
|
||
|
||
- 约定：value 统一为 `产品名 - 组件描述` 风格；key 含扩展名；匹配时忽略大小写。
|
||
- 该文件由实现时创建，**不进后台管理**（如需可扩展）。
|
||
|
||
---
|
||
|
||
## 11. 部署与初始化说明
|
||
|
||
1. 环境要求：PHP ≥ 7.4（启用 PDO_SQLITE）、Apache/Nginx；无需额外安装数据库服务。
|
||
2. 将工程目录整体上传至服务器站点根目录；`data/` 目录需 PHP 可写（用于创建/写入 `homepage.db` 与 `quota.txt`）。
|
||
3. 首次访问任意页面触发自动初始化：建库建表、写入 `categories` 四行、默认 settings、默认管理员 `admin / admin123`、生成 quota.txt/avlist.js 示例（若不存在）。
|
||
4. 首登后台后请修改默认密码（后台导航条提供修改密码入口）。
|
||
5. 天气 iframe 依赖外网（`i.tianqi.com`），离线环境下该区块显示占位不阻塞页面。
|
||
|
||
---
|
||
|
||
## 12. 实施顺序与验收要点（供编码阶段使用）
|
||
|
||
| 阶段 | 交付物 | 验收标准 |
|
||
| ----------- | ------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
|
||
| 1. 框架 | 目录结构、common.css/common.js、includes/db.php、install 初始化、数据示例 | 首次运行自动建库建表成功；首页可展示默认数据 |
|
||
| 2. 首页 | index.php：展示栏/名言条/四板块 hover 展开/页脚 | 四板块正确跳转四大目标；hover 展开规则与 §4.6 一致；时间刷新、名言随机；布局符合 §4 |
|
||
| 3. 导航区 | nav.php 三分类 + 搜索栏 + tooltip + 分列 | bing/baidu/github 搜索新开页；回车/清除按钮可用；导航块 hover 变色/tooltip 正确；三列轮转正确；空态正常 |
|
||
| 4. 功能区 | func 五个页面 | 中文字符 Base64/Base32/Unicode 编解码正确；SHA/MD5 输出正确；密码可自定义生成；二维码生成/放大/下载；杀软识别匹配与统计正确；textarea 竖向可拉伸 |
|
||
| 5. 后台 | 登录/导航管理/内容设计/排序 | 默认账号可登录；未登录访问被拦截；分类/块/按钮 CRUD 与排序即时反映到前台；备案/名言等设置生效；last_updated 更新并展示到首页 |
|
||
| 6. 联调打磨 | 响应式与细节 | 三档断点符合 §9；外链新开页；风格一致；无 500/JS 报错 |
|
||
|
||
---
|
||
|
||
## 13. 仍建议你确认的开放点（不影响启动开发）
|
||
|
||
1. 功能区头部条是否也带天气 iframe —— 本版默认**仅首页展示栏带天气**，功能页不带（避免重复加载）。
|
||
2. 首页名言是否允许点击换一条 —— 默认刷新页面换一条。
|
||
3. 导航页大列块超多时是否允许整页纵向滚动 —— 默认允许。
|
||
4. 二维码是否提供"滚轮缩放" —— 默认提供尺寸滑块 + 点击放大预览两种。
|
||
|
||
> 若以上默认与你设想不同，修改对应【决策】标注即可，其余规格不受影响。
|