mirror of
https://github.com/KenanZhu/AutoLibrary.git
synced 2026-06-17 23:13:03 +08:00
847 lines
32 KiB
HTML
847 lines
32 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>AutoLibrary 操作手册</title>
|
||
<style>
|
||
* {
|
||
margin: 0;
|
||
padding: 0;
|
||
box-sizing: border-box;
|
||
font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;
|
||
}
|
||
|
||
:root {
|
||
--primary: #2c3e50;
|
||
--secondary: #3498db;
|
||
--accent: #e74c3c;
|
||
--light: #f8f9fa;
|
||
--dark: #2c3e50;
|
||
--gray: #6c757d;
|
||
--border: #dee2e6;
|
||
}
|
||
|
||
body {
|
||
background-color: #c0c0c0a4;
|
||
color: #333;
|
||
line-height: 1.6;
|
||
}
|
||
|
||
.manual-container {
|
||
display: flex;
|
||
max-width: 1400px;
|
||
margin: 0 auto;
|
||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
|
||
min-height: 100vh;
|
||
}
|
||
|
||
.sidebar {
|
||
width: 280px;
|
||
background: var(--primary);
|
||
color: rgba(255, 255, 255, 0.7);
|
||
padding: 2rem 1rem;
|
||
position: sticky;
|
||
top: 0;
|
||
height: 100vh;
|
||
overflow-y: auto;
|
||
}
|
||
|
||
.sidebar-header {
|
||
padding-bottom: 1.5rem;
|
||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||
margin-bottom: 1.5rem;
|
||
transition: all 0.2s ease;
|
||
}
|
||
|
||
.sidebar-header:hover {
|
||
color: white;
|
||
}
|
||
|
||
.sidebar h1 {
|
||
font-size: 1.5rem;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
|
||
.sidebar-nav {
|
||
list-style: none;
|
||
}
|
||
|
||
.sidebar-nav li {
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
|
||
.sidebar-nav a {
|
||
color: rgba(255, 255, 255, 0.8);
|
||
text-decoration: none;
|
||
display: block;
|
||
padding: 0.7rem 1rem;
|
||
border-radius: 5px;
|
||
transition: all 0.2s ease;
|
||
}
|
||
|
||
.sidebar-nav a:hover,
|
||
.sidebar-nav a.active {
|
||
background: rgba(255, 255, 255, 0.1);
|
||
color: white;
|
||
}
|
||
|
||
.content {
|
||
flex: 1;
|
||
background: rgb(245, 245, 245);
|
||
padding: 2rem 3rem;
|
||
overflow-y: auto;
|
||
max-height: 100vh;
|
||
}
|
||
|
||
.section {
|
||
margin-bottom: 1rem;
|
||
padding-bottom: 2rem;
|
||
border-bottom: 1px solid var(--border);
|
||
}
|
||
|
||
h2 {
|
||
color: var(--primary);
|
||
margin-bottom: 1.5rem;
|
||
padding-bottom: 0.5rem;
|
||
border-bottom: 2px solid var(--secondary);
|
||
}
|
||
|
||
h3 {
|
||
color: var(--dark);
|
||
margin: 1.5rem 0 1rem;
|
||
}
|
||
|
||
.intro-box {
|
||
background: #e3f2fd;
|
||
border-left: 4px solid var(--secondary);
|
||
padding: 1.5rem;
|
||
margin-bottom: 2rem;
|
||
border-radius: 0 5px 5px 0;
|
||
}
|
||
|
||
.step-container {
|
||
counter-reset: step-counter;
|
||
}
|
||
|
||
.step {
|
||
display: flex;
|
||
margin-bottom: 2rem;
|
||
background: var(--light);
|
||
border-radius: 8px;
|
||
padding: 1.5rem;
|
||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
|
||
position: relative;
|
||
}
|
||
|
||
.step-number {
|
||
counter-increment: step-counter;
|
||
background: var(--secondary);
|
||
color: white;
|
||
width: 36px;
|
||
height: 36px;
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-weight: bold;
|
||
margin-right: 1.5rem;
|
||
flex-shrink: 0;
|
||
font-size: 1.1rem;
|
||
}
|
||
|
||
.step-number::before {
|
||
content: counter(step-counter);
|
||
}
|
||
|
||
.step-content {
|
||
flex: 1;
|
||
}
|
||
|
||
.step-image {
|
||
background: #e9ecef;
|
||
border-radius: 5px;
|
||
height: 180px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: var(--gray);
|
||
margin: 1rem 0;
|
||
font-style: italic;
|
||
}
|
||
|
||
.note {
|
||
background: #fff3cd;
|
||
border-left: 4px solid #ffc107;
|
||
padding: 1rem;
|
||
margin: 1rem 0;
|
||
border-radius: 0 5px 5px 0;
|
||
}
|
||
|
||
.warning {
|
||
background: #f8d7da;
|
||
border-left: 4px solid #dc3545;
|
||
padding: 1rem;
|
||
margin: 1rem 0;
|
||
border-radius: 0 5px 5px 0;
|
||
}
|
||
|
||
.code-block {
|
||
background: #2d2d2d;
|
||
color: #f8f8f2;
|
||
border: 1px solid #444;
|
||
border-left: 4px solid var(--secondary);
|
||
padding: 1rem;
|
||
margin: 1rem 0;
|
||
font-family: 'Consolas', monospace;
|
||
white-space: pre-wrap;
|
||
border-radius: 0 5px 5px 0;
|
||
font-size: 0.9rem;
|
||
overflow-x: auto;
|
||
line-height: 1.4;
|
||
}
|
||
.code-block .key { color: #2b997f; }
|
||
.code-block .string { color: #9acf65; }
|
||
.code-block .number { color: #3dd942; }
|
||
.code-block .boolean { color: #24e9ff; }
|
||
.code-block .null { color: #ff79c6; }
|
||
.code-block .property { color: #8be9fd; }
|
||
.code-block .punctuation { color: #f8f8f2; }
|
||
|
||
.feature-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||
gap: 1.5rem;
|
||
margin-top: 1.5rem;
|
||
}
|
||
|
||
.feature-card {
|
||
background: white;
|
||
border: 1px solid var(--border);
|
||
border-radius: 8px;
|
||
padding: 1.5rem;
|
||
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||
}
|
||
|
||
.feature-card:hover {
|
||
transform: translateY(-5px);
|
||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
|
||
}
|
||
|
||
.feature-icon {
|
||
font-size: 2rem;
|
||
color: var(--secondary);
|
||
margin-bottom: 1rem;
|
||
}
|
||
|
||
.config-tabs {
|
||
display: flex;
|
||
margin-bottom: 1rem;
|
||
border-bottom: 1px solid var(--border);
|
||
}
|
||
|
||
.config-tab {
|
||
padding: 0.8rem 1.5rem;
|
||
cursor: pointer;
|
||
border: none;
|
||
background: none;
|
||
font-size: 1rem;
|
||
color: var(--gray);
|
||
border-bottom: 3px solid transparent;
|
||
transition: all 0.3s ease;
|
||
}
|
||
|
||
.config-tab.active {
|
||
color: var(--secondary);
|
||
border-bottom: 3px solid var(--secondary);
|
||
}
|
||
|
||
.tab-content {
|
||
background: white;
|
||
border-radius: 0 5px 5px 5px;
|
||
padding: 1.5rem;
|
||
border: 1px solid var(--border);
|
||
border-top: none;
|
||
}
|
||
|
||
.tab-pane {
|
||
display: none;
|
||
}
|
||
|
||
.tab-pane.active {
|
||
display: block;
|
||
}
|
||
|
||
.download-section {
|
||
text-align: center;
|
||
padding: 2rem;
|
||
background: var(--light);
|
||
border-radius: 8px;
|
||
margin-top: 2rem;
|
||
}
|
||
|
||
.btn {
|
||
display: inline-block;
|
||
background: var(--secondary);
|
||
color: white;
|
||
padding: 0.8rem 1.5rem;
|
||
border-radius: 3px;
|
||
text-decoration: none;
|
||
font-weight: bold;
|
||
transition: all 0.3s ease;
|
||
border: none;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.btn:hover {
|
||
background: #2980b9;
|
||
transform: translateY(-2px);
|
||
}
|
||
|
||
.faq-item {
|
||
margin-bottom: 1.5rem;
|
||
border: 1px solid var(--border);
|
||
border-radius: 5px;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.faq-question {
|
||
padding: 1rem 1.5rem;
|
||
background: var(--light);
|
||
font-weight: bold;
|
||
cursor: pointer;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
|
||
.faq-answer {
|
||
padding: 1rem 1.5rem;
|
||
display: none;
|
||
}
|
||
|
||
.faq-item.active .faq-answer {
|
||
display: block;
|
||
}
|
||
|
||
.browser-drivers {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
gap: 1.5rem;
|
||
margin: 1.5rem 0;
|
||
}
|
||
|
||
.browser-card {
|
||
flex: 1;
|
||
background: white;
|
||
border: 1px solid var(--border);
|
||
border-radius: 8px;
|
||
padding: 1.5rem;
|
||
text-align: center;
|
||
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||
}
|
||
|
||
.browser-card:hover {
|
||
transform: translateY(-5px);
|
||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
|
||
}
|
||
|
||
.browser-logo {
|
||
width: 80px;
|
||
height: 80px;
|
||
margin: 0 auto 1rem;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-radius: 8px;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.browser-logo img {
|
||
max-width: 100%;
|
||
max-height: 100%;
|
||
}
|
||
|
||
.browser-card h4 {
|
||
margin-bottom: 1rem;
|
||
color: var(--primary);
|
||
}
|
||
|
||
.browser-card .btn {
|
||
margin-top: 1rem;
|
||
}
|
||
|
||
@media (max-width: 992px) {
|
||
.manual-container {
|
||
flex-direction: column;
|
||
}
|
||
|
||
.sidebar {
|
||
width: 100%;
|
||
height: auto;
|
||
position: relative;
|
||
}
|
||
|
||
.content {
|
||
padding: 1.5rem;
|
||
}
|
||
|
||
.feature-grid {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="manual-container">
|
||
<aside class="sidebar">
|
||
<div class="sidebar-header">
|
||
<h1>AutoLibrary</h1>
|
||
<p>操作手册 v0.01</p>
|
||
</div>
|
||
<ul class="sidebar-nav">
|
||
<li><a href="#intro" class="active">工具简介</a></li>
|
||
<li><a href="#preparation">准备工作</a></li>
|
||
<li><a href="#usage">使用步骤</a></li>
|
||
<li><a href="#configuration">配置说明</a></li>
|
||
<li><a href="#features">功能详解</a></li>
|
||
<li><a href="#interface">用户界面</a></li>
|
||
<li><a href="#troubleshooting">故障排除</a></li>
|
||
<li><a href="#faq">常见问题</a></li>
|
||
<li><a href="#download">下载安装</a></li>
|
||
</ul>
|
||
</aside>
|
||
|
||
<main class="content">
|
||
<section id="name" class="section">
|
||
<h1>AutoLibrary</h1>
|
||
</section>
|
||
|
||
<section id="intro" class="section">
|
||
<h2>工具简介</h2>
|
||
<div class="step">
|
||
<div class="step-content">
|
||
<div class="intro-box">
|
||
<p>AutoLibrary 是一款专为北京建筑大学图书馆设计的自动化工具,旨在帮助学生简化图书馆座位操作流程,节省宝贵时间。</p>
|
||
</div>
|
||
<p>本工具模拟人工操作,通过简单的界面交互使用。</p>
|
||
|
||
<h3>工具特点</h3>
|
||
<ul>
|
||
<p>模拟人工操作,不干扰图书馆系统正常运行</p>
|
||
<p>支持多种预约模式,满足不同使用场景</p>
|
||
<p>支持多账号批量预约</p>
|
||
<p>自动处理验证码,减少人工干预</p>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="preparation" class="section">
|
||
<h2>准备工作</h2>
|
||
<div class="step-container">
|
||
<div class="step">
|
||
<div class="step-number"></div>
|
||
<div class="step-content">
|
||
<h3>下载浏览器驱动</h3>
|
||
<p>工具需要通过浏览器驱动来控制浏览器,请根据您使用的浏览器下载对应版本的驱动:</p>
|
||
|
||
<div class="browser-drivers">
|
||
<div class="browser-card">
|
||
<div class="browser-logo">
|
||
<img src="https://edgestatic.azureedge.net/welcome/static/favicon.png" alt="Microsoft Edge">
|
||
</div>
|
||
<h4>Microsoft Edge</h4>
|
||
<p>适用于Windows 10/11系统</p>
|
||
<a href="https://developer.microsoft.com/en-us/microsoft-edge/tools/webdriver/" target="_blank" class="btn">下载驱动</a>
|
||
</div>
|
||
|
||
<div class="browser-card">
|
||
<div class="browser-logo">
|
||
<img src="https://www.gstatic.cn/devrel-devsite/prod/v154b6c17f7870ab2939b3d571919274f806798dc59971188e1f4183601ea7775/chrome/images/touchicon-180.png" alt="Google Chrome">
|
||
</div>
|
||
<h4>Google Chrome</h4>
|
||
<p>最常用的浏览器</p>
|
||
<a href="https://developer.chrome.google.cn/docs/chromedriver/downloads" target="_blank" class="btn">下载驱动</a>
|
||
</div>
|
||
|
||
<div class="browser-card">
|
||
<div class="browser-logo">
|
||
<img src="https://www.firefox.com/media/img/favicons/firefox/browser/favicon-196x196.59e3822720be.png" alt="Mozilla Firefox">
|
||
</div>
|
||
<h4>Mozilla Firefox</h4>
|
||
<p>开源浏览器</p>
|
||
<a href="https://github.com/mozilla/geckodriver/releases" target="_blank" class="btn">下载驱动</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="note">
|
||
<strong>注意:</strong> 浏览器驱动版本必须与您的浏览器版本兼容,否则工具无法正常工作。
|
||
</div>
|
||
<div class="step-image">
|
||
浏览器驱动下载页面截图区域
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="step">
|
||
<div class="step-number"></div>
|
||
<div class="step-content">
|
||
<h3>确认驱动路径</h3>
|
||
<p>下载驱动后,将浏览器驱动程序的路径(如'C:\Users\Administrator\Downloads\msedgedriver.exe')输入到AutoLibrary配置界面中。</p>
|
||
<div class="step-image">
|
||
驱动文件放置位置截图区域
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="usage" class="section">
|
||
<h2>使用步骤</h2>
|
||
<div class="step-container">
|
||
<div class="step">
|
||
<div class="step-number"></div>
|
||
<div class="step-content">
|
||
<h3>编辑配置文件</h3>
|
||
<p>使用文本编辑器(如记事本、Visual Studio Code等)打开config.json和users.json文件,按照您的需求修改参数。</p>
|
||
<div class="warning">
|
||
<strong>重要:</strong> 请勿使用Microsoft Word等富文本编辑器,这可能导致文件格式错误。
|
||
</div>
|
||
<div class="step-image">
|
||
配置文件编辑截图区域
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="step">
|
||
<div class="step-number"></div>
|
||
<div class="step-content">
|
||
<h3>运行工具</h3>
|
||
<p>双击运行main.exe文件,工具将自动开始预约流程。</p>
|
||
<div class="step-image">
|
||
工具运行界面截图区域
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="step">
|
||
<div class="step-number"></div>
|
||
<div class="step-content">
|
||
<h3>监控运行状态</h3>
|
||
<p>如果headless模式设置为false,您将看到浏览器窗口自动操作。请勿手动干预浏览器窗口。</p>
|
||
<div class="step-image">
|
||
浏览器自动操作截图区域
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="step">
|
||
<div class="step-number"></div>
|
||
<div class="step-content">
|
||
<h3>查看结果</h3>
|
||
<p>工具运行完成后,查看生成的日志文件确认预约结果。</p>
|
||
<div class="step-image">
|
||
运行日志截图区域
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="configuration" class="section">
|
||
<h2>配置说明</h2>
|
||
<p>AutoLibrary通过两个配置文件来控制工具行为:config.json(工具设置)和users.json(用户信息)。</p>
|
||
|
||
<div class="config-tabs">
|
||
<button class="config-tab active" data-tab="config-tab">config.json</button>
|
||
<button class="config-tab" data-tab="users-tab">users.json</button>
|
||
</div>
|
||
|
||
<div class="tab-content">
|
||
<div id="config-tab" class="tab-pane active">
|
||
<h3>工具配置文件</h3>
|
||
<p>config.json文件控制工具的基本运行参数:</p>
|
||
<div class="code-block">
|
||
{
|
||
<span class="property">"library"</span>: {
|
||
<span class="property">"lib_host_url"</span>: <span class="string">"http://10.1.20.7"</span>,
|
||
<span class="property">"lib_login_url"</span>: <span class="string">"/login"</span>
|
||
},
|
||
<span class="property">"mode"</span>: {
|
||
<span class="property">"run_mode"</span>: <span class="number">1</span>
|
||
},
|
||
<span class="property">"login"</span>: {
|
||
<span class="property">"auto_captcha"</span>: <span class="key">true</span>,
|
||
<span class="property">"login_attempt"</span>: <span class="number">3</span>
|
||
},
|
||
<span class="property">"web_driver"</span>: {
|
||
<span class="property">"driver_type"</span>: <span class="string">"edge"</span>,
|
||
<span class="property">"driver_path"</span>: <span class="string">"msedgedriver.exe"</span>,
|
||
<span class="property">"headless"</span>: <span class="key">false</span>
|
||
}
|
||
}
|
||
</div>
|
||
|
||
<h4>参数说明</h4>
|
||
<ul>
|
||
<li><strong>run_mode</strong>: 运行模式,可组合使用(1+4+8=13)</li>
|
||
<li><strong>auto_captcha</strong>: 自动验证码识别,建议保持true</li>
|
||
<li><strong>login_attempt</strong>: 登录尝试次数,默认3次</li>
|
||
<li><strong>driver_type</strong>: 浏览器类型(edge/chrome/firefox)</li>
|
||
<li><strong>driver_path</strong>: 驱动文件路径</li>
|
||
<li><strong>headless</strong>: 无头模式,false会显示浏览器窗口</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div id="users-tab" class="tab-pane">
|
||
<h3>用户配置文件</h3>
|
||
<p>users.json文件包含用户账号和预约信息:</p>
|
||
<div class="code-block">
|
||
{
|
||
<span class="property">"users"</span>: [
|
||
{
|
||
<span class="property">"username"</span>: <span class="string">"您的学号"</span>,
|
||
<span class="property">"password"</span>: <span class="string">"您的密码"</span>,
|
||
<span class="property">"reserve_info"</span>: {
|
||
<span class="property">"date"</span>: <span class="string">"2025-10-30"</span>,
|
||
<span class="property">"start_time"</span>: <span class="string">"09:30"</span>,
|
||
<span class="property">"end_time"</span>: <span class="string">"17:00"</span>,
|
||
<span class="property">"place"</span>: <span class="string">"1"</span>,
|
||
<span class="property">"floor"</span>: <span class="string">"4"</span>,
|
||
<span class="property">"room"</span>: <span class="string">"5"</span>,
|
||
<span class="property">"seat_id"</span>: <span class="string">"31A"</span>,
|
||
<span class="property">"expect_duration"</span>: <span class="number">6</span>
|
||
}
|
||
}
|
||
]
|
||
}
|
||
</div>
|
||
|
||
<h4>参数说明</h4>
|
||
<ul>
|
||
<li><strong>username</strong>: 学号</li>
|
||
<li><strong>password</strong>: 密码</li>
|
||
<li><strong>date</strong>: 预约日期(格式:YYYY-MM-DD)</li>
|
||
<li><strong>start_time/end_time</strong>: 预约时间段</li>
|
||
<li><strong>place/floor/room</strong>: 图书馆位置信息</li>
|
||
<li><strong>seat_id</strong>: 座位编号(重要)</li>
|
||
<li><strong>expect_duration</strong>: 期望使用时长(小时)</li>
|
||
</ul>
|
||
<div class="note">
|
||
<strong>提示:</strong> 可以添加多个用户,工具会按顺序处理每个用户的预约请求。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="features" class="section">
|
||
<h2>功能详解</h2>
|
||
<div class="feature-grid">
|
||
<div class="feature-card">
|
||
<div class="feature-icon">⏰</div>
|
||
<h3>自动预约(模式 +1)</h3>
|
||
<p>当您当前没有有效预约时,工具会自动为您预约指定座位。</p>
|
||
<div class="note">
|
||
<strong>适用场景:</strong> 提前预约第二天的座位
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-card">
|
||
<div class="feature-icon">✅</div>
|
||
<h3>自动签到(模式 +4)</h3>
|
||
<p>如果您已有预约,且在可签到时间范围内,工具会自动完成签到。</p>
|
||
<div class="note">
|
||
<strong>适用场景:</strong> 避免因忘记签到而失去座位
|
||
</div>
|
||
</div>
|
||
|
||
<div class="feature-card">
|
||
<div class="feature-icon">🔄</div>
|
||
<h3>自动续约(模式 +8)</h3>
|
||
<p>当您正在使用座位且到达可续约时间时,工具会自动延长使用时间。</p>
|
||
<div class="note">
|
||
<strong>适用场景:</strong> 需要长时间使用座位的情况
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<h3>模式组合使用</h3>
|
||
<p>运行模式可以组合使用,只需将对应模式的数值相加:</p>
|
||
<ul>
|
||
<li>自动预约 + 自动签到 + 自动续约 = 13(推荐)</li>
|
||
<li>自动预约 = 1</li>
|
||
<li>自动预约 + 自动签到 = 5</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<section id="troubleshooting" class="section">
|
||
<h2>故障排除</h2>
|
||
<h3>常见问题及解决方法</h3>
|
||
|
||
<div class="faq-item">
|
||
<div class="faq-question">工具启动时报错"无法找到驱动"</div>
|
||
<div class="faq-answer">
|
||
<p>这是因为浏览器驱动未正确安装或版本不匹配。</p>
|
||
<ul>
|
||
<li>检查驱动文件是否放置在正确位置</li>
|
||
<li>确认驱动版本与浏览器版本完全匹配</li>
|
||
<li>尝试重新下载并安装驱动</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="faq-item">
|
||
<div class="faq-question">登录失败,提示账号密码错误</div>
|
||
<div class="faq-answer">
|
||
<p>请检查users.json文件中的账号密码是否正确。</p>
|
||
<ul>
|
||
<li>确认学号和密码无误</li>
|
||
<li>检查是否有特殊字符需要转义</li>
|
||
<li>尝试手动登录图书馆系统确认账号可用</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="faq-item">
|
||
<div class="faq-question">预约失败,提示座位不可用</div>
|
||
<div class="faq-answer">
|
||
<p>目标座位可能已被他人预约或不在可预约时间。</p>
|
||
<ul>
|
||
<li>确认座位编号是否正确</li>
|
||
<li>检查预约时间是否符合图书馆规定</li>
|
||
<li>尝试预约其他座位或调整预约时间</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="faq" class="section">
|
||
<h2>常见问题</h2>
|
||
|
||
<div class="faq-item">
|
||
<div class="faq-question">使用AutoLibrary是否安全?</div>
|
||
<div class="faq-answer">
|
||
<p>AutoLibrary完全模拟人工操作,不干扰图书馆系统正常运行。工具不会收集或上传您的个人信息,所有数据仅保存在本地配置文件中。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="faq-item">
|
||
<div class="faq-question">可以同时预约多个座位吗?</div>
|
||
<div class="faq-answer">
|
||
<p>根据图书馆规定,每个账号同一时间段只能预约一个座位。但您可以在users.json中添加多个账号,工具会依次处理每个账号的预约请求。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="faq-item">
|
||
<div class="faq-question">工具运行期间可以操作电脑吗?</div>
|
||
<div class="faq-answer">
|
||
<p>可以正常使用电脑,但请勿操作工具自动打开的浏览器窗口,否则可能会干扰工具的正常运行。</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="download" class="section">
|
||
<h2>下载安装</h2>
|
||
<div class="download-section">
|
||
<h3>获取AutoLibrary</h3>
|
||
<p>点击下方按钮下载最新版本的AutoLibrary工具包:</p>
|
||
<a href="#" class="btn">下载 AutoLibrary v0.01</a>
|
||
<div class="note" style="margin-top: 1.5rem;">
|
||
<p>文件大小:约15MB</p>
|
||
<p>系统要求:Windows 10/11,支持Edge/Chrome/Firefox浏览器</p>
|
||
</div>
|
||
</div>
|
||
|
||
<h3>安装步骤</h3>
|
||
<ol>
|
||
<li>下载压缩包并解压到任意文件夹</li>
|
||
<li>根据您使用的浏览器下载对应版本的驱动</li>
|
||
<li>将驱动文件放置到工具文件夹中</li>
|
||
<li>按照本手册说明编辑配置文件</li>
|
||
<li>双击main.exe运行工具</li>
|
||
</ol>
|
||
</section>
|
||
</main>
|
||
</div>
|
||
|
||
<script>
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
document.querySelectorAll('.sidebar-nav a').forEach(link => {
|
||
link.addEventListener('click', function(e) {
|
||
e.preventDefault();
|
||
|
||
document.querySelectorAll('.sidebar-nav a').forEach(a => {
|
||
a.classList.remove('active');
|
||
});
|
||
this.classList.add('active');
|
||
|
||
const targetId = this.getAttribute('href');
|
||
const targetSection = document.querySelector(targetId);
|
||
|
||
if (targetSection) {
|
||
targetSection.scrollIntoView({
|
||
behavior: 'smooth',
|
||
block: 'start'
|
||
});
|
||
}
|
||
});
|
||
});
|
||
|
||
document.querySelectorAll('.config-tab').forEach(tab => {
|
||
tab.addEventListener('click', function() {
|
||
const tabId = this.getAttribute('data-tab');
|
||
|
||
document.querySelectorAll('.config-tab').forEach(t => {
|
||
t.classList.remove('active');
|
||
});
|
||
this.classList.add('active');
|
||
|
||
document.querySelectorAll('.tab-pane').forEach(pane => {
|
||
pane.classList.remove('active');
|
||
});
|
||
|
||
document.getElementById(tabId).classList.add('active');
|
||
});
|
||
});
|
||
|
||
document.querySelectorAll('.faq-question').forEach(question => {
|
||
question.addEventListener('click', function() {
|
||
const faqItem = this.parentElement;
|
||
faqItem.classList.toggle('active');
|
||
});
|
||
});
|
||
|
||
const sections = document.querySelectorAll('.section');
|
||
const navLinks = document.querySelectorAll('.sidebar-nav a');
|
||
|
||
const observerOptions = {
|
||
root: null,
|
||
rootMargin: '0px 0px -50% 0px',
|
||
threshold: 0.2
|
||
};
|
||
|
||
const observer = new IntersectionObserver((entries) => {
|
||
entries.forEach(entry => {
|
||
if (entry.isIntersecting) {
|
||
const id = entry.target.getAttribute('id');
|
||
|
||
navLinks.forEach(link => {
|
||
link.classList.remove('active');
|
||
});
|
||
|
||
const activeLink = document.querySelector(`.sidebar-nav a[href="#${id}"]`);
|
||
if (activeLink) {
|
||
activeLink.classList.add('active');
|
||
}
|
||
}
|
||
});
|
||
}, observerOptions);
|
||
|
||
sections.forEach(section => {
|
||
observer.observe(section);
|
||
});
|
||
});
|
||
</script>
|
||
</body>
|
||
</html> |