805 lines
87 KiB
Vue
805 lines
87 KiB
Vue
<template>
|
||
<view v-show="visible" class="ia-root" @touchstart="handleTouchStart" @touchend="handleTouchEnd">
|
||
<!-- 顶部工具栏 -->
|
||
<view class="ia-toolbar">
|
||
<view class="ia-title">
|
||
<text class="ia-badge">PPT</text>
|
||
<view class="ia-title-copy">
|
||
<text class="ia-title-strong">{{ displayFilename }}</text>
|
||
<text class="ia-title-em">{{ slideStatusText }}</text>
|
||
</view>
|
||
</view>
|
||
<view class="ia-actions">
|
||
<view class="ia-icon-btn" @tap="onRefresh">
|
||
<text class="ia-icon">↻</text>
|
||
</view>
|
||
<view class="ia-icon-btn ia-close-btn" @tap="onClose">
|
||
<text class="ia-icon">✕</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 主舞台区域 -->
|
||
<view class="ia-canvas">
|
||
<!-- 空状态 -->
|
||
<view v-if="showEmptyState" class="ia-empty"
|
||
:class="{ 'is-loading': loading || isParsing, 'is-error': !!errorMessage }">
|
||
<text class="ia-empty-icon">{{ emptyIconText }}</text>
|
||
<text class="ia-empty-title">{{ emptyTitle }}</text>
|
||
<text class="ia-empty-desc">{{ emptyDescription }}</text>
|
||
</view>
|
||
|
||
<!-- 幻灯片内容 -->
|
||
<view v-else class="ia-slide-area">
|
||
<!-- 当前幻灯片 -->
|
||
<view class="ia-frame-shell" :key="frameKey">
|
||
<scroll-view class="ia-frame-scroll" scroll-y :show-scrollbar="false">
|
||
<view class="ia-frame" v-html="currentSlideHtml"></view>
|
||
</scroll-view>
|
||
<!-- 滑动提示 -->
|
||
<!-- <view class="ia-swipe-hint" v-if="canSwipe">
|
||
<text class="ia-swipe-hint-text">{{ swipeHintText }}</text>
|
||
</view> -->
|
||
</view>
|
||
|
||
<!-- 水平缩略图条 -->
|
||
<scroll-view v-if="canPresent && slides.length > 1" class="ia-thumb-strip" scroll-x
|
||
:show-scrollbar="false" :scroll-into-view="'thumb-' + currentSlideIndex">
|
||
<view class="ia-thumb-list">
|
||
<view v-for="(item, index) in slides" :key="item.id" :id="'thumb-' + index"
|
||
class="ia-thumb-item" :class="{ active: index === currentSlideIndex }"
|
||
@tap="goToSlide(index)">
|
||
<text class="ia-thumb-num">{{ String(index + 1).padStart(2, '0') }}</text>
|
||
<text class="ia-thumb-title">{{ item.title }}</text>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 底部导航栏 -->
|
||
<view class="ia-pager" v-if="canPresent">
|
||
<view class="ia-pager-shell">
|
||
<view class="ia-page-btn" :class="{ disabled: currentSlideIndex <= 0 }" @tap="prevSlide">
|
||
<text class="ia-nav-icon">❮</text>
|
||
</view>
|
||
<view class="ia-page-count">
|
||
<text class="ia-current-page">{{ currentPageLabel }}</text>
|
||
<text class="ia-page-divider">/</text>
|
||
<text class="ia-total-page">{{ totalPageLabel }}</text>
|
||
</view>
|
||
<view class="ia-page-btn ia-next-btn" :class="{ disabled: currentSlideIndex >= totalSlides - 1 }"
|
||
@tap="nextSlide">
|
||
<text class="ia-nav-icon">❯</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'IntuitiveAipptViewer',
|
||
props: {
|
||
visible: {
|
||
type: Boolean,
|
||
default: true
|
||
},
|
||
htmlContent: {
|
||
type: String,
|
||
default: "<html>\n <head><meta charset=\"utf-8\"></head>\n <body>\n <style>\n body{font-family:SimSun,宋体,serif;font-size:14pt;line-height:1.5;}h1{font-family:KaiTi,楷体,serif;font-size:22pt;color:#0000FF;font-weight:bold;}h2{font-family:SimHei,黑体,serif;font-size:16pt;color:#FF0000;font-weight:bold;}h3,h4,h5,h6{font-family:SimSun,宋体,serif;font-weight:bold;}table{border-collapse:collapse;width:100%;margin:.5em 0;}td,th{font-family:SimSun,宋体,serif;font-size:12pt;text-align:center;vertical-align:middle;border:1px solid #000;padding:4px 8px;}p{margin:.5em 0;}img,video{display:block;margin:0 auto;max-width:100%;}\n .wyxd-cover{aspect-ratio:610/959;display:flex;flex-direction:column;align-items:center;justify-content:center;}\n .wyxd-toc{padding:20px 20px;}\n .wyxd-toc .wyxd-toc-title{text-align:center;font-size:18pt;font-weight:bold;margin-bottom:30px;}\n .wyxd-toc ul{list-style:none;padding:0;}\n .wyxd-toc li{padding:8px 0;border-bottom:1px dashed #ccc;display:flex;justify-content:space-between;}\n .wyxd-toc .page-num{color:#888;}\n </style>\n <div class=\"wyxd-cover\" style=\"background:linear-gradient(180deg,#fdfbf7 0%,#f5efe6 100%);\">\n <!-- 顶部装饰 -->\n <div style=\"width:200px; height:2px; background:linear-gradient(90deg,transparent,#8B0000,transparent); margin-bottom:40px;\">\n </div>\n <!-- 主标题 -->\n <p style=\"font-size:48px; font-weight:bold; margin:0; color:#1a1a1a; font-family:SimSun,serif; letter-spacing:8px;\">\n 三國歷史\n </p>\n <!-- 副标题 -->\n <p style=\"font-size:20px; color:#8B0000; margin-top:25px; font-family:SimSun,serif; letter-spacing:4px;\">\n 從黃巾起義到三分歸晉\n </p>\n <!-- 分隔线 -->\n <div style=\"width:300px; height:1px; background:#ccc; margin:30px auto;\">\n </div>\n <!-- 简短描述 -->\n <p style=\"font-size:16px; color:#666; margin-top:25px; font-style:italic;\">\n 東漢末年 • 群雄並起 • 三分天下\n </p>\n <p style=\"font-size:15px; color:#999; margin-top:15px;\">\n 公元184年 — 280年\n </p>\n <!-- 底部装饰 -->\n <div style=\"width:200px; height:2px; background:linear-gradient(90deg,transparent,#8B0000,transparent); margin-top:60px;\">\n </div>\n </div>\n <page order=\"1\" num=\"0\"></page>\n <div class=\"wyxd-toc\">\n <p class=\"wyxd-toc-title\">\n 目 录\n </p>\n <ul>\n <li>\n <span>第一章 东汉末年与黄巾起义</span><span class=\"page-num\">3</span>\n </li>\n <li>\n <span>第二章 群雄割据与董卓乱政</span><span class=\"page-num\">5</span>\n </li>\n <li>\n <span>第三章 曹操崛起与官渡之战</span><span class=\"page-num\">8</span>\n </li>\n <li>\n <span>第四章 孙刘联盟与赤壁之战</span><span class=\"page-num\">12</span>\n </li>\n <li>\n <span>第五章 三分天下格局的形成</span><span class=\"page-num\">16</span>\n </li>\n <li>\n <span>第六章 蜀汉政权的建立与发展</span><span class=\"page-num\">20</span>\n </li>\n <li>\n <span>第七章 曹魏政权的巩固与传承</span><span class=\"page-num\">24</span>\n </li>\n <li>\n <span>第八章 东吴政权的繁荣与衰落</span><span class=\"page-num\">28</span>\n </li>\n <li>\n <span>第九章 诸葛亮北伐与三国相持</span><span class=\"page-num\">32</span>\n </li>\n <li>\n <span>第十章 三国归晋与历史终结</span><span class=\"page-num\">37</span>\n </li>\n <li>\n <span>附录 三国主要人物简介</span><span class=\"page-num\">42</span>\n </li>\n <li>\n <span>附录 三国时期著名战役</span><span class=\"page-num\">45</span>\n </li>\n <li>\n <span>附录 三国疆域与行政区划</span><span class=\"page-num\">48</span>\n </li>\n </ul>\n </div>\n <page order=\"2\" num=\"0\"></page>\n <h1>\n 第一章 东汉末年与黄巾起义\n </h1>\n <p style=\"text-align:center; margin:20px 0;\">\n <img src=\"/api/aippt/三/images/1.png\" alt=\"东汉末年形势图\" style=\"max-width:100%; height:auto;\">\n </p>\n <h2>\n 1.1 东汉王朝的衰落\n </h2>\n <p>\n 东汉王朝自光武帝刘秀建立以来，历经明帝、章帝的盛世，至和帝以后，外戚与宦官交替专权，政治日趋腐败。东汉后期，皇帝的寿命普遍较短，多为幼年即位，导致太后临朝称制，外戚势力趁机掌控朝政。桓灵二帝时期，宦官势力达到顶峰“十常侍”把持朝政，卖官鬻爵，横征暴敛，导致民不聊生。\n </p>\n <p>\n 东汉末年，中央政府的统治力急剧衰落。地方官员各自为政，中央对地方的控制力减弱。土地兼并严重，大量农民失去土地，成为流民。赋税沉重，徭役频繁，加上自然灾害频发，百姓生活陷入绝境。这种局面为后来的农民起义和社会动荡埋下了伏笔。\n </p>\n <page order=\"3\" num=\"1\"></page>\n <p>\n 此外，东汉的军事制度也出现了严重问题。边防军队逐渐废弛，地方军阀割据一方，中央对军队的控制力减弱。各州郡的太守、刺史不仅掌握行政权，还拥有相当规模的私人武装，形成了割据一方的势力。这些因素共同促成了东汉王朝的最终崩溃。\n </p>\n <h2>\n 1.2 黄巾起义的爆发\n </h2>\n <p>\n 中平元年（公元184年），张角、张梁、张宝三兄弟在冀州钜鹿（今河北巨鹿）发动了大规模农民起义。张角创立“太平道”，以道教为外衣，以治病救人为号召，在短短十余年间发展信徒数十万人，遍布东汉十三州。\n </p>\n <p>\n 黄巾军以“苍天已死，黄天当立，岁在甲子，天下大吉”为口号，头戴黄巾，象征对汉朝统治的否定。起义军分为十路，同时在全国各地发动进攻，短时间内攻克了许多郡县，东汉王朝的统治基础受到严重冲击。\n </p>\n <p>\n 面对来势汹汹的黄巾起义，东汉朝廷惊慌失措。灵帝急忙下诏各地募兵抵抗，并启用皇甫嵩、朱儁、卢植等名将率军镇压。同时，允许地方州郡自行组织军队，这为后来军阀割据提供了合法依据。\n </p>\n <h2>\n 1.3 黄巾起义的历史影响\n </h2>\n <p>\n 黄巾起义虽然最终被镇压，但它对东汉王朝的统治造成了致命打击。\n </p>\n <p>\n 首先，它彻底瓦解了东汉中央政府的权威，使得地方割据成为可能。其次，它消耗了东汉政府大量的军事和经济资源，国库空虚。再次，它打破了士族对仕途的垄断，为寒门子弟提供了上升通道。\n </p>\n <p>\n 更重要的是，黄巾起义锻炼出了一批军事人才。曹操、刘备、孙坚等人都是在镇压黄巾起义中崭露头角，逐渐成长为割据一方的军阀。可以说，没有黄巾起义，就没有后来的三国鼎立局面。\n </p>\n <p>\n 黄巾起义虽然失败了，但它揭开了三国时代的序幕，是中国历史上一次重要的农民起义。它的历史意义在于：打破了东汉末年的政治格局，为群雄逐鹿提供了舞台；促进了思想的解放，为各种政治势力的兴起创造了条件。\n </p>\n <h2>\n 1.4 董卓进京与废立\n </h2>\n <p>\n 中平六年（公元189年），汉灵帝刘辨去世，少帝刘辩即位。外戚何进与宦官十常侍的矛盾激化，双方展开激烈的权力斗争。何进为了对抗宦官，\n </p>\n <page order=\"4\" num=\"2\"></page>\n <p>\n 密召凉州军阀董卓率军入京。\n </p>\n <p>\n 董卓率军进入洛阳后，立即控制了朝政。他先设计诛杀了宦官集团，随后废黜少帝刘辩，改立陈留王刘协为帝，是为汉献帝。董卓自任相国，总揽朝政，权倾朝野。为了巩固权力，董卓还纵容军队烧杀抢掠，洛阳城陷入一片混乱。\n </p>\n <p>\n 董卓的倒行逆施引起了天下诸侯的强烈不满。曹操、袁绍、袁术、公孙瓒等十八路诸侯联合讨伐董卓，推举袁绍为盟主。虽然联军最终未能消灭董卓，但董卓被迫迁都长安，洛阳城被付之一炬。这次讨董战争标志着东汉王朝的正式分裂，群雄割据的时代正式开始。\n </p>\n <h1>\n 第二章 群雄割据与董卓乱政\n </h1>\n <h2>\n 2.1 董卓的暴政与灭亡\n </h2>\n <p>\n 董卓迁都长安后，更加骄横跋扈。他自封为“太师”，地位在诸侯王之上，佩剑上殿，目中无人。为了镇压反对意见，董卓滥杀无辜，残害忠良，朝野上下敢怒而不敢言。\n </p>\n <p>\n 初平三年（公元192年），司徒王允利用董卓与吕布之间的矛盾，设计除掉了董卓。王允先是拉拢吕布为内应，然后趁董卓入宫朝拜之时，\n </p>\n <p>\n 让吕布将其刺杀。董卓死后，他的部将李傕、郭汜率军攻入长安，杀死王允，挟持汉献帝，关中地区再次陷入混乱。\n </p>\n <p>\n 董卓的灭亡并没有结束混乱局面，反而使局势更加复杂。李傕、郭汜之间互相攻杀，长安城遭到严重破坏，汉献帝沦为傀儡，各地割据势力更加嚣张，东汉王朝名存实亡。\n </p>\n <h2>\n 2.2 曹操的初步崛起\n </h2>\n <p>\n 曹操（字孟德，沛国谯县人）是三国时期最重要的政治家、军事家和文学家。曹操的祖父曹腾是东汉末年的宦官，父亲曹嵩是曹腾的养子，曾任太尉。曹操少年时期就表现出非凡的才干，他机智过人，胸有大志。\n </p>\n <p>\n 中平元年，曹操参加镇压黄巾起义，因功升任济南相。后来董卓进京，曹操逃出洛阳，在陈留起兵讨伐董卓。曹操是少数几个真正出击董卓的诸侯之一，虽然战败，但名声大振。\n </p>\n <page order=\"5\" num=\"3\"></page>\n <p>\n 初平三年，曹操击破青州黄巾军，收降卒三十余万，人口百余万，创建了著名的“青州兵”。这是曹操第一支正规的私家军队，成为他逐鹿中原的主力。此后，曹操相继击败袁术、陶谦、吕布等割据势力，逐渐成为北方最强大的军阀。\n </p>\n <h2>\n 2.3 刘备的艰难创业\n </h2>\n <p>\n 刘备（字玄德，涿郡涿县人）是汉景帝之子中山靖王刘胜的后代，具有皇室血统。但到了刘备这一代，家道已经衰落，只能靠织席贩履为生。刘备仪表非凡，胸怀大志结交豪杰，在当地小有名气。\n </p>\n <p>\n 黄巾起义爆发后，刘备与关羽、张飞桃园结义，组成最早的创业团队。刘备率领义军参加镇压黄巾起义，因功被封为安喜县尉。此后，刘备先后依附于公孙瓒、陶谦、曹操、袁绍、刘表等诸侯，颠沛流离，寄人篱下。\n </p>\n <p>\n 建安六年（公元201年），刘备投奔荆州牧刘表，被安排在新野驻守。在荆州的七年里，刘备广招贤才，诸葛亮就在此时加入刘备集团。诸葛亮隆中对策，为刘备制定了夺取天下的大政方针，刘备的霸业从此开始起步。\n </p>\n <h2>\n 2.4 孙坚与孙策的基业\n </h2>\n <p>\n 孙坚（字文台，吴郡富春人）是东吴政权的奠基人之一。他出身寒门，但英勇善战，在镇压黄巾起义和讨伐董卓的战争中表现出色，\n </p>\n <p>\n 被封为长沙太守、乌程侯。\n </p>\n <p>\n 初平二年（公元191年），袁术派孙坚进攻荆州刘表。孙坚在襄阳之战中击败刘表部将黄祖，乘胜追击时中箭身亡，年仅三十七岁。孙坚死后，其部众由其侄孙贲率领，继续依附于袁术。\n </p>\n <p>\n 孙策（字伯符）是孙坚的长子，他继承父亲的遗志，在袁术麾下效力。建安五年（公元200年），孙策率军渡过长江，攻占江东地区，先后击败严白虎、王朗等地方势力，迅速占领了吴郡、会稽、豫章、庐江、丹阳等郡。孙策善用人才，周瑜、张昭等人纷纷来投，东吴基业初具规模。\n </p>\n <h2>\n 2.5 官渡之战前的北方局势\n </h2>\n <p>\n 建安五年（公元200年）前后，中国北方形成了曹操与袁绍两大集团对峙的局面。曹操占据兖州、豫州、徐州部分地区，挟天子以令诸侯，实力日益强盛。袁绍占据冀州、青州、并州、幽州，拥有精兵数十万，地广人多，\n </p>\n <page order=\"6\" num=\"4\"></page>\n <p>\n 势力最强大。\n </p>\n <p>\n 袁绍手下的谋士郭图、审配等人主张早日发动对曹操的进攻，而田丰、沮授则认为应该先巩固后方，等待时机。袁绍最终采纳了主战派的建议，决定发兵南下。与此同时，曹操也积极备战，在官渡一线构筑防线。\n </p>\n <p>\n 官渡之战是三国时期最关键的战役之一，此战决定了北方的归属，也奠定了三国鼎立的基础。战争的胜负虽然取决于许多因素，但曹操的军事才能和战略眼光无疑是决定性的。\n </p>\n <h1>\n 第三章 曹操崛起与官渡之战\n </h1>\n <h2>\n 3.1 曹操的政治举措\n </h2>\n <p>\n 曹操之所以能够在群雄中脱颖而出，不仅仅依靠军事才能，更重要的是他的政治举措。建安元年（公元196年），曹操迎接汉献帝迁都许昌，开始了“挟天子以令诸侯”的政治策略。\n </p>\n <p>\n 曹操挟持汉献帝后，打着皇帝的旗号征讨四方，取得了政治上的主动权。他先后消灭了袁术、吕布、刘表等割据势力，又迫使韩遂、马超等西北军阀臣服。在军事胜利的基础上，曹操推行了一系列政治改革。\n </p>\n <p>\n 在用人方面，曹操打破门第观念，实行“唯才是举”的政策。他多次下诏求贤，只要有才能的人，无论出身高低，都能得到重用。\n </p>\n <p>\n 这使得曹操麾下聚集了大量人才，谋士如荀彧、郭嘉、贾诩、荀攸、程昱等，武将如张辽、徐晃、于禁、乐进、李典等。\n </p>\n <h2>\n 3.2 曹操的经济与军事改革\n </h2>\n <p>\n 曹操在经济方面推行“屯田制”，让士兵和流民开垦荒地，生产粮食。屯田制分为军屯和民屯两种，有效地解决了粮食问题，为军事行动提供了充足的物资保障。\n </p>\n <p>\n 在军事上，曹操改革兵制，建立了一支训练有素、纪律严明的军队。他重视军队的训练和装备，注重发挥各将领的特长，形成了一套完整的军事指挥体系。曹操还著有《孙子略解》《兵书接要》等军事著作，展现了他深厚的军事理论素养。\n </p>\n <p>\n 曹操还善于利用政治和外交手段瓦解对手。他分化瓦解敌对势力，\n </p>\n <page order=\"7\" num=\"5\"></page>\n <p>\n 必要时使用离间计、反间计等计谋，以最小的代价换取最大的胜利。这些综合手段的运用，使曹操成为三国时期最杰出的政治家和军事家。\n </p>\n <h2>\n 3.3 官渡之战的背景\n </h2>\n <p>\n 建安五年（公元200年）二月，袁绍率十万大军南下攻打曹操。袁绍的军队人数众多，装备精良，士气旺盛。而曹操的兵力只有两三万，双方实力悬殊。\n </p>\n <p>\n 面对强敌，曹操采取了正确的战略战术。他先发制人，击败了刘备，消除了侧翼威胁，然后集中兵力在官渡一线设防。曹操知道自己的兵力不足以与袁绍正面对抗，因此采取了以逸待劳、坚壁不战的策略。\n </p>\n <p>\n 袁绍虽然兵力占优，但指挥失当，多次错失良机。他的谋士之间互相倾轧，不能形成统一的战略。而曹操则能够虚心纳谏，灵活应对战场变化。两军的对峙持续了半年多，战争进入相持阶段。\n </p>\n <h2>\n 3.4 官渡之战的经过\n </h2>\n <p>\n 建安五年八月，袁绍率军逼近官渡，两军在此展开决战。袁绍依仗兵力优势，采取强攻战术，但曹操防守严密，几次进攻都未能得逞。\n </p>\n <p>\n 九月，曹操率军袭击袁绍的运粮车队，烧毁了袁绍的大量粮草。十月，袁绍派淳于琼率万余人护送粮草，驻守在乌巢。曹操得知这一情报后，亲率五千精兵连夜突袭乌巢，一把火烧掉了袁绍的全部粮草。\n </p>\n <p>\n 乌巢失守后，袁绍军心动摇。曹操乘机发动总攻，大败袁绍。袁绍仓皇逃回冀州，其主力部队损失殆尽。这场战役，曹操以少胜多，创造了军事史上的经典战例。\n </p>\n <h2>\n 3.5 官渡之战的结果与影响\n </h2>\n <p>\n 官渡之战后，袁绍势力一蹶不振。建安七年（公元202年），袁绍病逝，他的两个儿子袁尚、袁谭互相攻击，最终被曹操各个击破。建安十二年（公元207年），曹操彻底平定北方，占据了幽州、冀州、青州、并州、兖州、豫州、徐州等广大地区。\n </p>\n <p>\n 官渡之战的胜利，使曹操成为北方实际的统治者，为他统一北方奠定了坚实基础。此战后，曹操将主要精力用于巩固后方、发展经济、扩充军队，为南下统一全国做准备。\n </p>\n <page order=\"8\" num=\"6\"></page>\n <p>\n 从历史角度看，官渡之战是中国古代军事史上的经典战例。曹操以少胜多、以弱胜强的成功经验，为后世军事家提供了宝贵的借鉴。此战也确立了曹操在三国鼎立格局中的主导地位。\n </p>\n <h2>\n 3.6 曹操统一北方\n </h2>\n <p>\n 击败袁绍后，曹操开始了统一北方的战争。建安九年（公元204年），曹操攻占邺城，吞并了袁尚的势力。建安十年（公元205年），曹操击败袁谭，收取青州。建安十一年（公元206年），曹操攻占并州，消灭了高干。\n </p>\n <p>\n 建安十二年（公元207年），曹操率军北征乌桓，在白狼山之战中大败乌桓军队，斩首蹋顿单于，彻底平定了北方边境。此战过后，北方地区获得了相对稳定的和平环境。\n </p>\n <p>\n 在平定北方的过程中，曹操注意招抚当地人才，北方社会经济得到了恢复和发展。曹操的统治为后来的曹魏政权奠定了基础，也为中国南北朝的统一创造了条件。\n </p>\n <h1>\n 第四章 孙刘联盟与赤壁之战\n </h1>\n <h2>\n 4.1 曹操南征与荆州之变\n </h2>\n <p>\n 建安十三年（公元208年），曹操平定北方后，率大军南下，目标是荆州和江东。荆州的刘表年老多病，其子刘琮继位。曹操大军压境时，刘琮在蒯越、韩嵩等人的劝说下投降曹操。\n </p>\n <p>\n 刘备当时驻守在新野，得知曹操南下的消息后，仓促撤退。曹操亲率五千精兵追击，在当阳长坂坡大败刘备。刘备被迫弃妻小而逃，在赵云的护卫下才得以脱险。\n </p>\n <p>\n 诸葛亮建议刘备联合孙权，共同抵抗曹操。当时孙权占据江东已有九年时间，根基牢固，兵精粮足。刘备派诸葛亮前往柴桑（今江西九江）说服孙权，促成孙刘联盟的形成。\n </p>\n <h2>\n 4.2 孙刘联盟的形成\n </h2>\n <p>\n 孙权接到曹操的劝降书后，犹豫不决。他的谋士鲁肃主张联合刘备抵抗曹操，而张昭等文臣则主张投降。鲁肃建议孙权召回周瑜，共同商讨对策。\n </p>\n <p>\n 周瑜从鄱阳湖赶回柴桑，与诸葛亮一起分析形势。周瑜认为，\n </p>\n <page order=\"9\" num=\"7\"></page>\n <p>\n 曹操虽然兵多，但北方军队不习水战，而且后方不稳，马超、韩遂等人还在关西虎视眈眈。孙刘联军有战胜的可能。\n </p>\n <p>\n 孙权采纳了周瑜的建议，决定联合刘备抵抗曹操。他任命周瑜为左都督，程普为右都督，鲁肃为赞军校尉，率三万大军与刘备汇合。孙刘联盟的建立，为赤壁之战的胜利奠定了基础。\n </p>\n <h2>\n 4.3 赤壁之战的准备\n </h2>\n <p>\n 建安十三年冬，周瑜率军与刘备在江夏汇合。两军加起来共有五万余人，在赤壁与曹操大军隔江对峙。曹操的北方军队不习水战，为了克服晕船问题，他们将战船用铁索连接起来，以减少风浪的颠簸。\n </p>\n <p>\n 周瑜的部将黄盖发现曹操战船相连的弱点，建议采用火攻。他亲自写信向曹操假投降，麻痹敌人。曹操信以为真，没有防备。\n </p>\n <p>\n 战前，周瑜进行了周密的部署。他派黄盖率十艘装满易燃物品的战船靠近曹军舰队，准备实施火攻。同时命令主力部队待命，随时准备出击。\n </p>\n <h2>\n 4.4 赤壁之战的经过\n </h2>\n <p>\n 建安十三年十一月的一个夜晚，江面上刮起了东南风。黄盖率领十艘满载柴草、油脂的战船，向曹军舰队驶去。接近曹军时，黄盖下令点火，然后率部跳上小船离开。\n </p>\n <p>\n 着火的战船顺风冲入曹军舰队，由于战船用铁索相连，无法分散，\n </p>\n <p>\n 火势迅速蔓延。曹操的战船和岸上营地陷入一片火海，士兵死伤无数。\n </p>\n <p>\n 周瑜趁势率军渡江发动总攻，曹操大军大败。曹操被迫率残部撤退，在华容道又遭到关羽的伏击，损失惨重。此战，曹操损失了大部分军队和战船，基本丧失了统一南方的能力。\n </p>\n <h2>\n 4.5 赤壁之战的结果与影响\n </h2>\n <p>\n 赤壁之战后，曹操退回北方，短期内无力南下。孙权和刘备各自发展势力，形成了三国鼎立的雏形。刘备趁机夺取了荆州的江南四郡有了立足之地。\n </p>\n <p>\n 赤壁之战是中国古代军事史上最著名的以少胜多的战例之一。周瑜和黄盖的火攻计策，成为军事史上的经典战例。此战改变了三国的历史走向，\n </p>\n <page order=\"10\" num=\"8\"></page>\n <p>\n 奠定了三国鼎立的格局。\n </p>\n <p>\n 从政治角度看，赤壁之战的胜利孙刘联盟的胜利，也是曹操“挟天子以令诸侯”战略的失败。此战后曹操不得不调整战略，转而巩固北方经营西北，为日后篡汉建魏做准备。\n </p>\n <h2>\n 4.6 赤壁之战后的局势\n </h2>\n <p>\n 赤壁之战后，刘备向孙权借荆州南郡，开始了建立蜀汉政权的进程。建安十四年（公元209年），周瑜率军攻占江陵，刘备表荐刘表长子刘琦为荆州刺史，自己以军师中郎将的身份治理荆州。\n </p>\n <p>\n 建安十五年（公元210年），周瑜病逝，孙权任命鲁肃为都督。鲁肃主张将荆州借给刘备，以共同对抗曹操。刘备得到荆州后，实力大增，开始向益州发展。\n </p>\n <p>\n 建安十六年（公元211年），刘璋邀请刘备入蜀对抗张鲁。刘备趁机率军入益州，拉开了夺取益州的序幕。建安十九年（公元214年），刘备包围成都，刘璋投降，刘备占据了益州。\n </p>\n <h1>\n 第五章 三分天下格局的形成\n </h1>\n <h2>\n 5.1 刘备取益州与汉中\n </h2>\n <p>\n 建安十六年（公元211年），益州牧刘璋听说曹操要攻打汉中张鲁，心中恐惧。谋士张松建议刘璋邀请刘备入蜀，共同抵御曹操。\n </p>\n <p>\n 刘璋采纳了这个建议，派法正迎请刘备。\n </p>\n <p>\n 刘备率军入蜀后，与刘璋的关系逐渐恶化。建安十七年（公元212年），刘备在葭萌关起兵，进攻成都。双方在涪城、绵竹等地展开激战，刘备进展顺利。\n </p>\n <p>\n 建安十九年（公元214年），刘备包围成都，刘璋被迫投降。刘备自领益州牧，封诸葛亮为军师将军，负责治理益州。从此，刘备拥有了荆州和益州两块根据地，三分天下有其一。\n </p>\n <p>\n 建安二十三年（公元218年），刘备率军进攻汉中，与曹操展开激战。建安二十四年（公元219年），刘备在定军山击败曹操，杀死曹操部将夏候渊，攻占汉中。刘备自称汉中王，实现了“隆中对”中跨有荆益的战略目标。\n </p>\n <page order=\"11\" num=\"9\"></page>\n <h2>\n 5.2 关羽失荆州\n </h2>\n <p>\n 建安二十四年（公元219年），关羽在刘备攻取汉中的同时，发动了北伐襄樊的战争。关羽率军围攻樊城的曹仁，曹操派于禁率七军前来救援。\n </p>\n <p>\n 秋天的连绵大雨导致汉水泛滥，于禁的七军被洪水淹没，于禁被迫投降。关羽乘势进攻，曹操的大将于禁被俘，庞德被杀，曹操震动。关羽威震华夏，曹操甚至一度考虑迁都以避其锋芒。\n </p>\n <p>\n 然而就在关羽北伐胜利之际，孙权派吕蒙白衣渡江，袭取了荆州。关羽得知后方失守后，仓促回撤，但为时已晚。关羽最终在麦城被孙权部将马忠擒杀，荆州落入东吴手中。\n </p>\n <p>\n 关羽失荆州是三国时期的重大事件，它打破了孙刘联盟，也使刘备失去了北伐的通道。蜀汉的势力范围从此被压缩在益州一地，难以对外发展。\n </p>\n <h2>\n 5.3 曹丕篡汉与曹魏建立\n </h2>\n <p>\n 建安二十五年（公元220年），曹操病逝于洛阳，终年六十五岁。曹操死后，其子曹丕继承魏王爵位，掌控了魏国的军政大权。\n </p>\n <p>\n 同年十月，曹丕迫使汉献帝禅让帝位，建立魏国，是为魏文帝。东汉王朝正式灭亡，三国时代正式开始。曹丕定都洛阳，改元黄初。\n </p>\n <p>\n 曹丕称帝后，追尊曹操为魏武帝，庙号太祖。曹魏政权控制了北方中原地区，拥有最广阔的土地和最多的人口，是三国中实力最强的政权。\n </p>\n <h2>\n 5.4 刘备称帝与蜀汉建立\n </h2>\n <p>\n 章武元年（公元221年），刘备在成都称帝，建立蜀汉政权，是为蜀汉昭烈帝。刘备定都成都，以诸葛亮为丞相，许靖为司徒。\n </p>\n <p>\n 刘备称帝后做的第一件事就是发兵伐吴，为关羽报仇。同年，刘备亲率大军进攻东吴，试图夺回荆州。孙权派陆逊率军抵御。\n </p>\n <p>\n 蜀汉与东吴的夷陵之战爆发于章武二年（公元222年）。刘备率军在夷陵一带扎营连营数百里，与吴军相持。陆逊采用火攻，大败蜀军。刘备逃回白帝城，蜀汉元气大伤。\n </p>\n <h2>\n 5.5 三国鼎立格局的正式形成\n </h2>\n <p>\n 夷陵之战后，刘备病逝于白帝城，终年六十三岁。诸葛亮辅佐后主刘禅，\n </p>\n <page order=\"12\" num=\"10\"></page>\n <p>\n 继续治理蜀汉。蜀汉与东吴重新修好，恢复了孙刘联盟。\n </p>\n <p>\n 黄初二年（公元221年），孙权也称王，建都建业，国号吴，但未正式称帝。直到黄龙元年（公元229年），孙权才正式称帝，建立东吴政权。\n </p>\n <p>\n 至此，三国鼎立的格局正式形成：曹魏占据北方中原地区，拥有洛阳、长安等大城市，人口众多，经济发达；蜀汉占据益州和汉中，地势险要，易守难攻；东吴占据江东六郡，经济繁荣，水军强大。三国之间形成了相对稳定的对峙局面。\n </p>\n <h2>\n 5.6 三国鼎立时期的特点\n </h2>\n <p>\n 三国鼎立时期，各国都注重发展经济、整军经武。曹魏实行九品中正制，蜀汉推行依法治国，东吴则大力发展海外贸易。三个政权都在各自的统治区域内建立了一套相对完整的政治制度。\n </p>\n <p>\n 在军事方面，三国都面临外部威胁。曹魏需要防御蜀汉和东吴的进攻，同时还要应对北方少数民族的侵扰；蜀汉和东吴则需要联合起来共同对抗曹魏。这种军事对峙持续了四十多年。\n </p>\n <p>\n 在文化方面，三国时期出现了许多杰出的文学家、艺术家和科学家。曹植的文学成就极高，诸葛亮的智慧成为后世楷模，东吴的航海技术领先世界。三国文化成为中国传统文化的重要组成部分。\n </p>\n <h1>\n 第六章 蜀汉政权的建立与发展\n </h1>\n <h2>\n 6.1 诸葛亮辅政\n </h2>\n <p>\n 章武三年（公元223年），刘备病逝于白帝城，临终前托孤于诸葛亮。刘备对诸葛亮说：“君才十倍于曹丕，必能安国，终定大事。若嗣子可辅，辅之；如其不才，君可自取。”诸葛亮感激涕零，表示“臣敢竭股肱之力，效忠贞之节，继之以死”。\n </p>\n <p>\n 诸葛亮被后主刘禅封为武乡侯，开府治事。实际上，诸葛亮成为蜀汉政权的最高执政者，总揽军政大权。他内修政治，外整军务，殚精竭虑，维护蜀汉政权的生存和发展。\n </p>\n <p>\n 在政治上，诸葛亮推行法治，注重选拔人才。他制定蜀科，依法治国，使得蜀汉政治较为清明。在经济上，诸葛亮重视农业生产，鼓励蚕桑，发展蜀锦等手工业。在军事上，诸葛亮训练军队，改进武器，\n </p>\n <page order=\"13\" num=\"11\"></page>\n <p>\n 提升蜀军的战斗力。\n </p>\n <h2>\n 6.2 蜀汉的内政与经济\n </h2>\n <p>\n 诸葛亮治理蜀汉期间，实行了一系列政治经济改革。在政治制度方面，诸葛亮完善了官制，建立了较为完整的官僚体系。他注重选拔人才，不看出身门第，只看才能德行。\n </p>\n <p>\n 在经济方面，诸葛亮推行屯田制，让士兵和民众开垦荒地，增加粮食产量。他重视水利建设，维护都江堰等水利工程，保障农业生产的顺利进行。蜀锦是蜀汉的重要特产，诸葛亮大力发展蜀锦生产，通过对外贸易换取曹魏和东吴的物资。\n </p>\n <p>\n 在民族政策方面，诸葛亮采取“以夷制夷”的策略，妥善处理与西南少数民族的关系。他七擒七纵孟获，获得了少数民族的拥护，确保了蜀汉后方的稳定。\n </p>\n <h2>\n 6.3 蜀汉的对外关系\n </h2>\n <p>\n 刘备去世后，诸葛亮派邓芝出使东吴，修复了孙刘联盟。邓芝不辱使命，说服孙权与蜀汉重新结盟，共同对抗曹魏。此后，蜀汉与东吴的关系一直保持良好，直到蜀汉灭亡。\n </p>\n <p>\n 对于曹魏，诸葛亮采取敌对态度，但同时也保持了表面的外交关系。他多次派人出使东吴和曹魏，了解两国情况，寻求有利的外交环境。\n </p>\n <p>\n 在处理与西南少数民族的关系方面，诸葛亮表现出了高超的政治智慧。他尊重少数民族的风俗习惯，任用当地首领为官，赢得了少数民族的拥护。这为蜀汉政权的稳定提供了重要保障。\n </p>\n <h2>\n 6.4 蜀汉的著名人物\n </h2>\n <p>\n 蜀汉政权人才济济，文武兼备。诸葛亮是蜀汉最重要的政治家和军事家，他上知天文，下知地理，足智多谋，被誉为“千古第一相”。\n </p>\n <p>\n 在文臣方面，蜀汉有法正、董和、蒋琬、费祎、姜维等人。法正善于奇谋，是刘备的得力谋士；蒋琬、费祎继承诸葛亮的事业，治理蜀汉；姜维是诸葛亮指定的接班人，继续坚持北伐。\n </p>\n <p>\n 在武将方面，蜀汉有关羽、张飞、赵云、马超、黄忠“五虎上将”，\n </p>\n <page order=\"14\" num=\"12\"></page>\n <p>\n 以及魏延、王平、廖化、向宠等将领。关羽、张飞是刘备的结义兄弟，英勇善战；赵云是刘备的护卫，多次救主于危难之中；马超、黄忠是后来归降的猛将。\n </p>\n <h2>\n 6.5 蜀汉的政治制度\n </h2>\n <p>\n 蜀汉的政体基本沿袭汉制，但也有所创新。刘禅虽然是皇帝，但实际权力掌握在丞相手中。诸葛亮开府治事，有自己的丞相府僚属，形成了与皇帝并列的行政体系。\n </p>\n <p>\n 蜀汉的官制分为中央和地方两级。中央有丞相、太尉、司徒、司空等官职，地方有州、郡、县三级。诸葛亮实行依法治蜀，制定了蜀科，作为基本法律。\n </p>\n <p>\n 蜀汉的选拔制度主要是察举和考试相结合。诸葛亮注重人才的选拔和培养，建立了完善的官员考核制度。他推荐的人才，大都德才兼备，为蜀汉的发展做出了贡献。\n </p>\n <h2>\n 6.6 蜀汉的社会文化\n </h2>\n <p>\n 蜀汉时期，成都成为西南地区的文化中心。诸葛亮重视教育，设立学校，培养人才。蜀汉的学术氛围浓厚，出现了许多著名的学者和文人。\n </p>\n <p>\n 蜀汉的文学艺术也有较高成就。陈寿的《三国志》是史学名著，记载了三国时期的历史。诸葛亮的前后《出师表》是千古名文，表达了他对国家的忠诚。\n </p>\n <p>\n 蜀汉的科技也有一定发展。诸葛亮发明了木牛流马、连弩等军事器械，提高了蜀军的战斗力。他还将先进的农业技术传授给西南少数民族，促进了当地经济社会的发展。\n </p>\n <h1>\n 第七章 曹魏政权的巩固与传承\n </h1>\n <h2>\n 7.1 曹丕的政治措施\n </h2>\n <p>\n 曹丕继位魏王后，实行了一系列政治改革来巩固自己的统治。他推行九品中正制，兼顾了士族和寒门的利益，暂时缓解了统治阶级内部的矛盾。这一制度成为魏晋南北朝时期的主要选官制度。\n </p>\n <p>\n 在军事方面，曹丕继续推行曹操的军事政策，加强中央对军队的控制。\n </p>\n <page order=\"15\" num=\"13\"></page>\n <p>\n 他多次率军伐吴，虽然没有取得重大胜利，但巩固了魏国在江淮地区的防线。\n </p>\n <p>\n 在经济方面，曹丕继续推行屯田制，重视农业生产。他下令兴修水利，鼓励垦荒，使得北方经济得到恢复和发展。曹丕还注重商业贸易，促进了物资流通。\n </p>\n <h2>\n 7.2 曹丕的对外战争\n </h2>\n <p>\n 黄初三年（公元222年），曹丕率军伐吴，发动了第一次濡须口之战。魏军与吴军相持数月，互有胜负，最终无功而返。\n </p>\n <p>\n 黄初五年（公元224年），曹丕第二次伐吴，这次他亲自率军进攻广陵（今江苏扬州），但因为长江水涨，无功而返。黄初六年（公元225年），曹丕第三次伐吴，再次失败。\n </p>\n <p>\n 三次伐吴的失败，使曹丕认识到短时间内无法消灭东吴。他调整了战略，将主要精力放在国内建设上，发展经济，整顿内政，为最终统一天下做准备。\n </p>\n <h2>\n 7.3 曹叡继位与辅政\n </h2>\n <p>\n 黄初七年（公元226年），曹丕病逝于洛阳，终年四十岁。曹丕死后，其子曹叡继位，是为魏明帝。曹叡继位时只有二十二岁，资历较浅，需要依靠老臣辅政。\n </p>\n <p>\n 曹叡继位后面临的主要问题是辅政大臣的选择。曹丕临终前指定曹真、\n </p>\n <p>\n 陈群、司马懿为辅政大臣，辅佐曹叡。这三人都是曹魏的重臣各有特长。\n </p>\n <p>\n 曹叡虽然年轻，但很有才能。他能够驾驭群臣，保持政局的稳定。在军事上，他多次击退蜀汉和东吴的进攻，保卫了魏国的安全。在内政上，他注重发展经济，使得魏国实力不断增强。\n </p>\n <h2>\n 7.4 司马懿的崛起\n </h2>\n <p>\n 司马懿（字仲达，河内温县人）是三国时期最重要的政治家和军事家之一，也是晋朝的奠基人。他出身于司马氏家族，是东汉末年的名士。\n </p>\n <p>\n 曹操时期，司马懿被征召为官，但长期得不到重用。曹丕继位后，司马懿开始受到重用，逐渐升任要职。曹叡时期，司马懿多次率军出征，\n </p>\n <page order=\"16\" num=\"14\"></page>\n <p>\n 屡立战功，成为魏国最重要的军事统帅之一。\n </p>\n <p>\n 司马懿曾多次抵御诸葛亮的北伐，功绩卓著。他采取的正确战略战术，有效地消耗了蜀汉的国力。司马懿还率军平定辽东，消灭了公孙渊的割据势力，为魏国解除了后顾之忧。\n </p>\n <h2>\n 7.5 曹魏后期的政治\n </h2>\n <p>\n 曹叡去世后，其养子曹芳继位，年仅八岁。曹爽和司马懿被任命为辅政大臣，两人共同执掌朝政。曹爽是曹真的儿子，代表曹氏宗亲的利益；司马懿代表士族集团的利益。\n </p>\n <p>\n 曹爽与司马懿之间存在尖锐的矛盾。曹爽排挤司马懿，将他明升暗降，剥夺了军权。司马懿假装生病，不问政事，暗中积蓄力量准备反击。\n </p>\n <p>\n 正始十年（公元249年），司马懿乘曹爽陪同曹芳出祭高平陵之机，发动政变，诛杀曹爽及其党羽。从此，司马家族掌控了曹魏的朝政大权，为后来的司马氏代魏建立了基础。\n </p>\n <h2>\n 7.6 曹魏的灭亡\n </h2>\n <p>\n 司马懿死后，其子司马师、司马昭继续执掌朝政。司马师废黜曹芳，改立曹奂为帝。司马昭弑杀魏帝曹髦，另立曹奂为帝。曹魏政权已经名存实亡。\n </p>\n <p>\n 咸熙二年（公元265年），司马昭之子司马炎代魏称帝，建立晋朝，是为晋武帝。曹魏政权至此灭亡。从曹丕称帝到曹魏灭亡，历时四十五年。\n </p>\n <p>\n 曹魏虽然灭亡了，但它为晋朝的统一奠定了基础。曹操、曹丕、曹叡祖孙三代经营北方，使得中原地区经济繁荣，社会稳定，为晋朝灭吴统一全国创造了条件。\n </p>\n <h1>\n 第八章 东吴政权的繁荣与衰落\n </h1>\n <h2>\n 8.1 孙权的统治政策\n </h2>\n <p>\n 孙权（字仲谋，吴郡富春人）是三国时期在位时间最长的君主之一。他从建安五年（公元200年）继承兄业，到太元二年（公元252年）去世，执政长达五十二年。\n </p>\n <p>\n 孙权善于用人，能够发挥各人的长处。他重用周瑜、鲁肃、吕蒙、\n </p>\n <page order=\"17\" num=\"15\"></page>\n <p>\n 陆逊等名将，形成了东吴的四大都督系统。在文臣方面，他重用张昭、顾雍、诸葛瑾等人，治理国家。\n </p>\n <p>\n 在经济方面，孙权大力发展江南经济，鼓励农民开垦荒地，推广先进的农业生产技术。他重视海上贸易，与辽东、东南亚等地有贸易往来。东吴的造船业和航海业在当时处于世界领先地位。\n </p>\n <h2>\n 8.2 东吴的对外扩张\n </h2>\n <p>\n 孙权在位期间，积极向外扩张领土。建安十三年（公元208年），东吴与刘备联军在赤壁击败曹操，解除了北方的威胁。此后，东吴开始向岭南地区扩张。\n </p>\n <p>\n 建安二十五年（公元220年），孙权派步骘率军平定岭南，占据了交州（今广东、广西、越南北部）。黄龙二年（公元230年），孙权派卫温、诸葛直率军一万出海，寻找夷洲（今台湾），虽然损失较大，但加强了对台湾的联系。\n </p>\n <p>\n 嘉禾六年（公元237年），东吴派陆胤率军平定海南岛的叛乱，将海南岛纳入东吴版图。东吴的疆域扩展到了极盛时期。\n </p>\n <h2>\n 8.3 东吴与蜀魏的关系\n </h2>\n <p>\n 东吴与蜀汉的关系经历了合作与冲突的过程。赤壁之战后，孙刘联盟共同抗曹，保持了较长时期的合作。但荆州问题一直是两国之间的矛盾焦点。\n </p>\n <p>\n 关羽失荆州后，刘备伐吴，夷陵之战爆发，东吴击败蜀汉。两败俱伤后，\n </p>\n <p>\n 双方重新修好。诸葛亮执政期间，蜀吴关系一直保持良好，共同对抗曹魏。\n </p>\n <p>\n 东吴与曹魏的关系则比较复杂。曹丕时期，东吴曾两次向魏称臣，接受魏国的封号。但孙权并不真正服从曹魏，只是利用魏国的支持来发展自己的势力。\n </p>\n <h2>\n 8.4 东吴的四大都督\n </h2>\n <p>\n 东吴历史上最著名的是四位都督：周瑜、鲁肃、吕蒙、陆逊。他们在不同的历史时期担任最高军事指挥官，为东吴的发展做出了重要贡献。\n </p>\n <p>\n 周瑜是东吴的开国元勋，他辅佐孙策平定江东，\n </p>\n <page order=\"18\" num=\"16\"></page>\n <p>\n 又在赤壁之战中击败曹操，奠定了东吴的基业。鲁肃是东吴的战略家，他主张联合刘备共同抗曹，为东吴制定了正确的战略方针。\n </p>\n <p>\n 吕蒙是东吴的名将，他白衣渡江，袭取荆州，杀死关羽，为东吴夺得了梦寐以求的荆州。陆逊是东吴后期的支柱，他火烧连营，击败刘备，又多次抵御曹魏的进攻，保卫了东吴的安全。\n </p>\n <h2>\n 8.5 东吴的经济与文化\n </h2>\n <p>\n 东吴时期，江南经济得到了快速发展。孙权推行一系列发展农业的措施，使得粮食产量大幅提高。江南的丝织业、制瓷业、造船业都有较大发展。\n </p>\n <p>\n 东吴的造船业在当时处于世界领先地位。东吴拥有当时世界上最庞大的船队，能够制造大型海船。东吴的航海家曾到达夷洲、澶洲等地，与东南亚诸国建立了贸易关系。\n </p>\n <p>\n 在文化方面，东吴出现了许多著名的学者和文人。虞翻、王朗、张温等人是当时的经学大师。东吴的书法、绘画艺术也有较高成就，对后世产生了深远影响。\n </p>\n <h2>\n 8.6 东吴的衰落与灭亡\n </h2>\n <p>\n 孙权去世后，东吴的政治开始混乱。孙亮的继位引发了内部的权力斗争，诸葛恪、孙峻、孙綝等人先后专权，政治腐败严重。\n </p>\n <p>\n 孙皓继位后，实行暴政，残害忠良，荒淫无道。他多次发动对晋的战争，但都以失败告终。天纪四年（公元280年），晋军南下，东吴灭亡。\n </p>\n <p>\n 从孙权称王到东吴灭亡，东吴历时五十九年。\n </p>\n <p>\n 东吴的灭亡标志着三国时代的结束。晋朝完成了对全国的统一，结束了自黄巾起义以来近一百年的分裂局面。\n </p>\n <h1>\n 第九章 诸葛亮北伐与三国相持\n </h1>\n <h2>\n 9.1 诸葛亮北伐的背景\n </h2>\n <p>\n 蜀汉建立后，诸葛亮制定了“北伐中原，复兴汉室”的战略方针。他认为，如果不主动出击，只会导致蜀汉与曹魏的差距越来越大，最终会被消灭。只有通过北伐，才能实现刘备“兴复汉室”的遗愿。\n </p>\n <p>\n 从客观条件看，北伐也具有一定的可行性。\n </p>\n <page order=\"19\" num=\"17\"></page>\n <p>\n 曹魏的主要敌人是蜀汉和东吴，需要两面作战。而蜀汉有汉中这个战略要地，可以威胁关中地区。诸葛亮认为，如果能够占领关中地区，就可以进而统一天下。\n </p>\n <p>\n 当然，北伐也面临着巨大的困难。蜀汉人口稀少，国力有限，难以支撑长期战争。从益州到关中道路险阻，运输困难。曹魏实力强大，不是轻易能够击败的。\n </p>\n <h2>\n 9.2 第一次北伐\n </h2>\n <p>\n 建兴六年（公元228年），诸葛亮发动了第一次北伐。他率军出祁山，攻击曹魏的陇右地区。蜀军进展顺利，天水、南安、安定三郡相继投降。\n </p>\n <p>\n 曹魏方面非常震惊，派出张郃率军抵御。诸葛亮派马谡驻守街亭，但马谡违反诸葛亮的部署，被张郃击败。街亭失守后，诸葛亮被迫退兵，第一次北伐失败。\n </p>\n <p>\n 第一次北伐虽然失败，但诸葛亮展示了自己的军事才能，也锻炼了蜀军。诸葛亮挥泪斩马谡，表明他执法严明，不徇私情。\n </p>\n <h2>\n 9.3 后续北伐\n </h2>\n <p>\n 建兴六年冬天，诸葛亮发动第二次北伐，攻击陈仓。但由于陈仓防守严密，蜀军久攻不下，最终退兵。建兴七年（公元229年），诸葛亮发动第三次北伐，攻占武都、阴平二郡。\n </p>\n <p>\n 建兴九年（公元231年），诸葛亮发动第四次北伐，包围祁山。司马懿率军抵御，但采取了守势，不与蜀军决战。诸葛亮因为粮尽退兵，\n </p>\n <p>\n 在退兵途中射杀了魏将张郃。\n </p>\n <p>\n 建兴十二年（公元234年），诸葛亮发动第五次北伐，这是他最后一次北伐。诸葛亮率军出斜谷，与司马懿相持于五丈原。诸葛亮积劳成疾，于同年八月病逝于五丈原，终年五十四岁。\n </p>\n <h2>\n 9.4 姜维北伐\n </h2>\n <p>\n 诸葛亮去世后，姜维继承了北伐的事业。姜维是蜀汉后期的军事统帅，他继承了诸葛亮的遗志，多次率军北伐。\n </p>\n <p>\n 从延熙十六年（公元253年）开始，姜维多次发动北伐战争，但胜少败多。\n </p>\n <page order=\"20\" num=\"18\"></page>\n <p>\n 蜀汉国力有限，无法支撑长期的战争。姜维的北伐虽然没有取得重大胜利，但也牵制了曹魏的兵力。\n </p>\n <p>\n 景耀六年（公元263年），曹魏发动灭蜀之战，钟会、邓艾率军进攻蜀汉。姜维在剑阁抵御钟会，但邓艾偷渡阴平，逼近成都。后主刘禅投降，蜀汉灭亡。姜维试图复国，但最终失败被杀。\n </p>\n <h2>\n 9.5 三国相持时期的战争\n </h2>\n <p>\n 诸葛亮去世后，三国进入了相持阶段。各方虽然时有战争，但都没有能力消灭对方。这种相持局面持续了四十多年。\n </p>\n <p>\n 在东线，曹魏与东吴之间战争不断。曹爽曾率军伐吴，但失败而归。司马懿父子也多次进攻东吴，但都没有取得决定性胜利。\n </p>\n <p>\n 在西线，蜀汉的北伐虽然失败，但有效地牵制了曹魏的兵力。曹魏需要部署大量军队防守西部边境，消耗了大量资源。\n </p>\n <h2>\n 9.6 三国相持时期的政治\n </h2>\n <p>\n 三国相持时期，各国内部都出现了一些政治问题。蜀汉方面，诸葛亮去世后，蒋琬、费祎先后执政，政治较为稳定。但后主刘禅宠信黄皓，朝廷政治开始腐败。\n </p>\n <p>\n 曹魏方面，司马氏逐渐掌控了朝政。司马懿、司马师、司马昭父子三人相继执掌大权，曹魏皇帝成为傀儡。曹魏后期的政治腐败严重，阶级矛盾尖锐。\n </p>\n <p>\n 东吴方面，孙权晚年立储问题处理不当，引发了严重的宫廷斗争。\n </p>\n <p>\n 孙皓继位后，政治更加腐败，民不聊生。这为东吴的灭亡埋下了伏笔。\n </p>\n <h2>\n 9.7 三国相持时期的经济\n </h2>\n <p>\n 三国相持时期，各国都比较注重发展经济。曹魏继续推行屯田制，中原地区的农业得到恢复。司马氏掌权后，实行了一些改革，促进了经济发展。\n </p>\n <p>\n 蜀汉在诸葛亮的治理下，经济有所发展。但蜀汉人口较少，国力有限，难以支撑长期的战争消耗。后期连年北伐，加重了民众的负担。\n </p>\n <p>\n 东吴的经济发展较快，江南地区的农业和商业都有较大发展。但东吴的赋税较重，民众负担较大，影响了经济的可持续发展。\n </p>\n <page order=\"21\" num=\"19\"></page>\n <h1>\n 第十章 三国归晋与历史终结\n </h1>\n <h2>\n 10.1 晋朝的建立\n </h2>\n <p>\n 司马懿发动高平陵政变后，司马氏逐渐掌控了曹魏的朝政大权。司马懿、司马师、司马昭父子三人相继执掌朝政，为代魏称帝做好了准备。\n </p>\n <p>\n 咸熙二年（公元265年），司马昭去世，其子司马炎继为晋王。同年十二月，司马炎代魏称帝，建立晋朝，是为晋武帝。晋朝定都洛阳，改元泰始。\n </p>\n <p>\n 晋武帝称帝后，追尊祖父司马懿为晋宣帝，父亲司马昭为晋文帝，伯父司马师为晋景帝。晋朝的建立，标志着三国时代的结束和中国历史上的西晋时期开始。\n </p>\n <h2>\n 10.2 晋灭蜀汉\n </h2>\n <p>\n 晋朝建立后，晋武帝开始准备统一天下。当时蜀汉已经衰落，后主刘禅宠信黄皓，朝廷政治腐败。姜维虽然多次北伐，但无功而返，国力消耗严重。\n </p>\n <p>\n 景耀六年（公元263年），晋武帝派钟会、邓艾率军伐蜀。钟会率主力进攻汉中，牵制姜维；邓艾率军偷渡阴平，直取成都。\n </p>\n <p>\n 姜维在剑阁抵御钟会，互有胜负。但邓艾偷渡阴平成功后，刘禅惊慌失措，不战而降。蜀汉灭亡，历时四十三年。姜维试图复国，但最终失败被杀。\n </p>\n <h2>\n 10.3 晋灭东吴\n </h2>\n <p>\n 蜀汉灭亡后，晋朝开始了灭吴的准备。晋武帝采纳羊祜的建议，积极准备灭吴战争。羊祜镇守荆州，与东吴名将陆抗相持，互有胜负。\n </p>\n <p>\n 羊祜去世后，杜预、张华等人继续推动灭吴战争。杜预镇守荆州，积极训练水军，准备渡江作战。天纪四年（公元280年），晋武帝下诏灭吴，派杜预、王浑率军进攻。\n </p>\n <p>\n 晋军分兵多路，全面进攻。王浑率军渡过长江，击败东吴主力。杜预率军攻占江陵，张悌率军渡江攻入建业。孙皓见大势已去，投降晋朝。东吴灭亡，历时五十九年。\n </p>\n <page order=\"22\" num=\"20\"></page>\n <h2>\n 10.4 三国归晋的历史意义\n </h2>\n <p>\n 三国归晋，结束了自黄巾起义以来近一百年的分裂局面，实现了中国的统一。这是中国历史上又一次重要的大统一，对中国社会的发展产生了深远影响。\n </p>\n <p>\n 晋朝的统一，为社会经济的恢复和发展创造了条件。战乱结束，人民得以休养生息，中原地区和江南地区都得到了开发。晋朝初期出现了“太康盛世”，经济繁荣，社会安定。\n </p>\n <p>\n 然而，晋朝的统一并没有持续太久。晋武帝死后，发生了“八王之乱”，中原地区陷入混乱。随后是“五胡乱华”，西晋灭亡，中国再次陷入分裂。\n </p>\n <h2>\n 10.5 三国时期的历史遗产\n </h2>\n <p>\n 三国时期虽然只有短短的四十多年，但留下了丰富的历史遗产。在政治制度方面，三国时期的选官制度、法律制度等对后世产生了影响。曹魏的九品中正制成为魏晋南北朝时期的主要选官制度。\n </p>\n <p>\n 在文学艺术方面，三国时期出现了许多杰出的人才。曹操、曹植父子是文学史上重要的人物，“建安风骨”成为中国文学的典范。诸葛亮的智慧成为后世推崇的楷模。\n </p>\n <p>\n 在军事方面，三国时期的许多战例成为军事教材。官渡之战、赤壁之战、夷陵之战等都是经典的以少胜多的战例，为后世军事家所借鉴。\n </p>\n <h2>\n 10.6 三国历史的后世影响\n </h2>\n <p>\n 三国历史对后世产生了深远影响。《三国演义》是中国的四大名著之一，塑造了许多深入人心的人物形象。诸葛亮、关羽、曹操、周瑜等人物成为家喻户晓的历史人物。\n </p>\n <p>\n 三国的故事在民间广为流传，形成了丰富的文化传统。桃园结义、借东风、空城计等故事成为人们茶余饭后的谈资。三国文化已经成为中国传统文化的重要组成部分。\n </p>\n <p>\n 在海外，三国文化也有广泛影响。日本、韩国、东南亚等地区都有三国故事的传播。三国文化成为中国软实力的重要组成部分，在世界范围内产生了影响。\n </p>\n <page order=\"23\" num=\"21\"></page>\n <h1>\n 附录一 三国主要人物简介\n </h1>\n <h2>\n 魏国主要人物\n </h2>\n <p>\n <strong>曹操</strong>（155年-220年），字孟德，沛国谯县人。三国时期最杰出的政治家、军事家、文学家。曹操挟天子以令诸侯，统一北方，为曹魏政权的建立奠定了基础。曹操还是杰出的文学家，与儿子曹丕、曹植并称“三曹”。\n </p>\n <p>\n <strong>曹丕</strong>（187年-226年），字子桓，曹操次子。220年代汉称帝，建立魏国，是为魏文帝。曹丕推行九品中正制，确立了魏晋南北朝时期的选官制度。\n </p>\n <p>\n <strong>曹叡</strong>（204年-239年），字元仲，曹丕之子。魏明帝，在位期间多次击退蜀汉和东吴的进攻，保卫了魏国的安全。\n </p>\n <p>\n <strong>司马懿</strong>（179年-251年），字仲达，河内温县人。三国时期最重要的政治家、军事家之一，晋朝的奠基人。司马懿辅佐曹魏四代，抵御诸葛亮北伐，平定辽东，最终掌握朝政大权。\n </p>\n <p>\n <strong>张辽</strong>（169年-222年），字文远，雁门马邑人。曹操麾下著名将领，合肥之战中大败孙权，威震江东。\n </p>\n <p>\n <strong>郭嘉</strong>（170年-207年），字奉孝，颍川阳翟人。曹操最重要的谋士之一，英年早逝，曹操曾感叹“郭奉孝在，不使孤至此”。\n </p>\n <h2>\n 蜀汉主要人物\n </h2>\n <p>\n <strong>刘备</strong>（161年-223年），字玄德，涿郡涿县人。汉景帝之后，\n </p>\n <p>\n 三国时期蜀汉政权的建立者。刘备以仁德著称，三顾茅庐请诸葛亮，形成三国鼎立的局面。\n </p>\n <p>\n <strong>诸葛亮</strong>（181年-234年），字孔明，琅琊阳都人。三国时期最杰出的政治家、军事家。诸葛亮辅佐刘备建立蜀汉，后又辅佐后主刘禅，实行依法治蜀，多次北伐。诸葛亮被誉为“千古第一相”。\n </p>\n <p>\n <strong>关羽</strong>（162年或160年-220年），字云长，河东解人。刘备的结义兄弟，蜀汉著名将领。关羽忠义无双，被后人尊为“武圣”。\n </p>\n <p>\n <strong>张飞</strong>（165年-221年），字益德，涿郡涿县人。刘备的结义兄弟，蜀汉著名将领。张飞勇猛异常，但性格暴躁。\n </p>\n <p>\n <strong>赵云</strong>（？-229年），字子龙，常山真定人。刘备的护卫，蜀汉著名将领。\n </p>\n <page order=\"24\" num=\"22\"></page>\n <p>\n 赵云英勇善战，多次救主于危难之中。\n </p>\n <p>\n <strong>姜维</strong>（202年-264年），字伯约，天水冀县人。诸葛亮之后的蜀汉军事统帅，继承诸葛亮北伐的事业，但最终失败被杀。\n </p>\n <h2>\n 东吴主要人物\n </h2>\n <p>\n <strong>孙权</strong>（182年-252年），字仲谋，吴郡富春人。三国时期东吴政权的建立者，在位五十三年，是三国时期在位时间最长的君主。\n </p>\n <p>\n <strong>周瑜</strong>（175年-210年），字公瑾，庐江舒县人。东吴开国元勋，赤壁之战中击败曹操，奠定东吴基业。\n </p>\n <p>\n <strong>鲁肃</strong>（172年-217年），字子敬，临淮东城人。东吴战略家，主张联合刘备共同抗曹，为东吴制定了正确的战略方针。\n </p>\n <p>\n <strong>吕蒙</strong>（178年-220年），字子明，汝南富陂人。东吴名将，白衣渡江袭取荆州，杀死关羽。\n </p>\n <p>\n <strong>陆逊</strong>（183年-245年），字伯言，吴郡吴县人。东吴后期支柱，火烧连营击败刘备，多次抵御曹魏进攻。\n </p>\n <p>\n <strong>张昭</strong>（156年-236年），字子布，彭城人。东吴重臣，孙策的托孤大臣之一，长期辅佐孙权。\n </p>\n <h1>\n 附录二 三国时期著名战役\n </h1>\n <h2>\n 官渡之战\n </h2>\n <p>\n 官渡之战发生在建安五年（公元200年），是曹操与袁绍之间决定北方归属的战争。曹操以少胜多，击败袁绍的十万大军，奠定了统一北方的基础。此战是三国时期最经典的以少胜多的战例之一。\n </p>\n <h2>\n 赤壁之战\n </h2>\n <p>\n 赤壁之战发生在建安十三年（公元208年），是孙刘联军与曹操大军之间的战争。孙刘联军在周瑜的指挥下，采用火攻，大败曹军，奠定了三国鼎立的格局。此战是中国古代军事史上最著名的战例之一。\n </p>\n <h2>\n 夷陵之战\n </h2>\n <p>\n 夷陵之战发生在章武二年（公元222年），是刘备伐吴的战争。\n </p>\n <page order=\"25\" num=\"23\"></page>\n <p>\n 陆逊采用火攻，大败刘备，蜀汉从此一蹶不振。此战与官渡之战、赤壁之战并称为三国三大战役。\n </p>\n <h2>\n 街亭之战\n </h2>\n <p>\n 街亭之战发生在建兴六年（公元228年），是诸葛亮第一次北伐中的关键战役。马谡违反诸葛亮的部署，被张郃击败，导致蜀军被迫退兵。此战成为诸葛亮挥泪斩马谡的典故。\n </p>\n <h2>\n 合肥之战\n </h2>\n <p>\n 合肥之战发生在建安二十年（公元215年），是孙权进攻曹操的战争。张辽以八百精兵大败孙权十万大军，差点活捉孙权。此战奠定了张辽“威震江东”的威名。\n </p>\n <h2>\n 石亭之战\n </h2>\n <p>\n 石亭之战发生在黄武七年（公元228年），是东吴与曹魏之间的战争。陆逊率军大败曹休，斩获万余人。此战巩固了东吴在江东的统治。\n </p>\n <h1>\n 附录三 三国疆域与行政区划\n </h1>\n <h2>\n 魏国疆域\n </h2>\n <p>\n 魏国占据北方中原地区，包括司隶、豫州、兖州、徐州、青州、冀州、幽州、并州、凉州、雍州等地区。魏国定都洛阳，后来迁都许昌，再迁回洛阳。魏国是三国中疆域最大、人口最多的政权。\n </p>\n <h2>\n 蜀汉疆域\n </h2>\n <p>\n 蜀汉占据益州和荆州部分地区，包括益州全境以及荆州的武陵、零陵、桂阳、长沙等郡。蜀汉定都成都。蜀汉是三国中疆域最小、人口最少的政权，但地势险要，易守难攻。\n </p>\n <h2>\n 东吴疆域\n </h2>\n <p>\n 东吴占据江东六郡以及荆州、扬州、交州等地，包括今江苏、浙江、安徽、江西、福建、广东、广西、海南以及越南北部等地区。东吴定都建业（今江苏南京）。东吴是三国中海岸线最长的政权，航海业发达。\n </p>\n <h2>\n 三国行政区划比较\n </h2>\n <page order=\"26\" num=\"24\"></page>\n <table class=\"iw-wyxd-table\" data-iw-table=\"1\">\n <thead>\n <tr class=\"iw-wyxd-tr\">\n <th class=\"iw-wyxd-cell\">\n 政权\n </th>\n <th class=\"iw-wyxd-cell\">\n 都城\n </th>\n <th class=\"iw-wyxd-cell\">\n 主要州郡\n </th>\n <th class=\"iw-wyxd-cell\">\n 人口（估计）\n </th>\n </tr>\n </thead>\n <tbody>\n <tr class=\"iw-wyxd-tr\">\n <td class=\"iw-wyxd-cell\">\n 曹魏\n </td>\n <td class=\"iw-wyxd-cell\">\n 洛阳/许昌\n </td>\n <td class=\"iw-wyxd-cell\">\n 司隶、豫州、兖州等\n </td>\n <td class=\"iw-wyxd-cell\">\n 约400万\n </td>\n </tr>\n <tr class=\"iw-wyxd-tr\">\n <td class=\"iw-wyxd-cell\">\n 蜀汉\n </td>\n <td class=\"iw-wyxd-cell\">\n 成都\n </td>\n <td class=\"iw-wyxd-cell\">\n 益州、荆州\n </td>\n <td class=\"iw-wyxd-cell\">\n 约100万\n </td>\n </tr>\n <tr class=\"iw-wyxd-tr\">\n <td class=\"iw-wyxd-cell\">\n 东吴\n </td>\n <td class=\"iw-wyxd-cell\">\n 建业\n </td>\n <td class=\"iw-wyxd-cell\">\n 扬州、交州、荆州\n </td>\n <td class=\"iw-wyxd-cell\">\n 约200万\n </td>\n </tr>\n </tbody>\n </table>\n <h2>\n 三国时期的地理概念\n </h2>\n <p>\n 三国时期的“州”与现代的省份概念不同，是一个较大的行政区划。三国时期的州数量比东汉时期有所减少，但每个州的管辖范围仍然很大。\n </p>\n <p>\n 三国时期，中原地区是经济最发达的地区，人口密集。江南地区虽然开发较晚，但在东吴的治理下，经济有了较大发展。西南地区地形复杂，交通不便，开发程度较低。\n </p>\n <h1>\n 结语\n </h1>\n <p>\n 三国时期是中国历史上一个非常重要的时期，从黄巾起义（184年）到东吴灭亡（280年），历时近百年。这段历史充满了英雄人物、经典战例和传奇故事，对后世产生了深远影响。\n </p>\n <p>\n 曹操、刘备、孙权三大枭雄在乱世中崛起各自建立了政权，形成了三国鼎立的局面。他们之间的政治斗争、军事较量、外交斡旋，构成了三国历史的主要内容。\n </p>\n <p>\n 诸葛亮、关羽、周瑜、司马懿等历史人物以其卓越的才能和高尚的品格，\n </p>\n <p>\n 成为后世楷模。他们的故事被后人传颂不衰，成为中国传统文化的重要组成部分。\n </p>\n <p>\n 《三国演义》是中国的四大名著之一，它以历史为素材，融入民间传说和文学创造，塑造了许多深入人心的人物形象。诸葛亮的多智近妖、关羽的忠义无双、曹操的奸雄形象，都对大众认知产生了深远影响。\n </p>\n <p>\n 三国历史虽然已经过去了一千多年，但它的影响仍在继续。三国文化已经成为中国文化的的重要组成部分，在文学、艺术、游戏、影视等各个领域都有广泛的应用。三国的故事将继续传承下去，影响着一代又一代的中国人。\n </p>\n <page order=\"27\" num=\"25\"></page>\n <p>\n 回顾三国历史，我们可以看到：在乱世中，人才是决定性的因素；\n </p>\n <p>\n 在竞争中，战略眼光至关重要；在治理中，民心向背决定了政权的兴衰。这些历史经验对于今天仍然具有借鉴意义。\n </p>\n <p style=\"text-align:center; margin-top:100px;\">\n —— 完 ——\n </p>\n <page order=\"28\" num=\"26\"></page>\n </body>\n</html>"
|
||
},
|
||
loading: {
|
||
type: Boolean,
|
||
default: false
|
||
},
|
||
errorMessage: {
|
||
type: String,
|
||
default: ''
|
||
},
|
||
filename: {
|
||
type: String,
|
||
default: ''
|
||
}
|
||
},
|
||
emits: ['close', 'refresh'],
|
||
data() {
|
||
return {
|
||
currentSlideIndex: 0,
|
||
pageTurnDirection: 1,
|
||
slides: [],
|
||
isParsing: false,
|
||
parseErrorMessage: '',
|
||
parsedHeadContent: '',
|
||
slideHtmlCache: {},
|
||
_vietualData: {
|
||
"success": true,
|
||
"message": "提取成功",
|
||
"html_content": "<html>\n <head><meta charset=\"utf-8\"></head>\n <body>\n <style>\n body{font-family:SimSun,宋体,serif;font-size:14pt;line-height:1.5;}h1{font-family:KaiTi,楷体,serif;font-size:22pt;color:#0000FF;font-weight:bold;}h2{font-family:SimHei,黑体,serif;font-size:16pt;color:#FF0000;font-weight:bold;}h3,h4,h5,h6{font-family:SimSun,宋体,serif;font-weight:bold;}table{border-collapse:collapse;width:100%;margin:.5em 0;}td,th{font-family:SimSun,宋体,serif;font-size:12pt;text-align:center;vertical-align:middle;border:1px solid #000;padding:4px 8px;}p{margin:.5em 0;}img,video{display:block;margin:0 auto;max-width:100%;}\n .wyxd-cover{aspect-ratio:610/959;display:flex;flex-direction:column;align-items:center;justify-content:center;}\n .wyxd-toc{padding:20px 20px;}\n .wyxd-toc .wyxd-toc-title{text-align:center;font-size:18pt;font-weight:bold;margin-bottom:30px;}\n .wyxd-toc ul{list-style:none;padding:0;}\n .wyxd-toc li{padding:8px 0;border-bottom:1px dashed #ccc;display:flex;justify-content:space-between;}\n .wyxd-toc .page-num{color:#888;}\n </style>\n <div class=\"wyxd-cover\" style=\"background:linear-gradient(180deg,#fdfbf7 0%,#f5efe6 100%);\">\n <div style=\"width:200px; height:2px; background:linear-gradient(90deg,transparent,#8B0000,transparent); margin-bottom:40px;\">\n </div>\n <p style=\"font-size:48px; font-weight:bold; margin:0; color:#1a1a1a; font-family:SimSun,serif; letter-spacing:8px;\">\n 三國歷史\n </p>\n <p style=\"font-size:20px; color:#8B0000; margin-top:25px; font-family:SimSun,serif; letter-spacing:4px;\">\n 從黃巾起義到三分歸晉\n </p>\n <div style=\"width:300px; height:1px; background:#ccc; margin:30px auto;\">\n </div>\n <p style=\"font-size:16px; color:#666; margin-top:25px; font-style:italic;\">\n 東漢末年 • 群雄並起 • 三分天下\n </p>\n <p style=\"font-size:15px; color:#999; margin-top:15px;\">\n 公元184年 — 280年\n </p>\n <div style=\"width:200px; height:2px; background:linear-gradient(90deg,transparent,#8B0000,transparent); margin-top:60px;\">\n </div>\n </div>\n <page order=\"1\" num=\"0\"></page>\n <div class=\"wyxd-toc\">\n <p class=\"wyxd-toc-title\">\n 目 录\n </p>\n <ul>\n <li>\n <span>第一章 东汉末年与黄巾起义</span><span class=\"page-num\">3</span>\n </li>\n <li>\n <span>第二章 群雄割据与董卓乱政</span><span class=\"page-num\">5</span>\n </li>\n <li>\n <span>第三章 曹操崛起与官渡之战</span><span class=\"page-num\">8</span>\n </li>\n <li>\n <span>第四章 孙刘联盟与赤壁之战</span><span class=\"page-num\">12</span>\n </li>\n <li>\n <span>第五章 三分天下格局的形成</span><span class=\"page-num\">16</span>\n </li>\n <li>\n <span>第六章 蜀汉政权的建立与发展</span><span class=\"page-num\">20</span>\n </li>\n <li>\n <span>第七章 曹魏政权的巩固与传承</span><span class=\"page-num\">24</span>\n </li>\n <li>\n <span>第八章 东吴政权的繁荣与衰落</span><span class=\"page-num\">28</span>\n </li>\n <li>\n <span>第九章 诸葛亮北伐与三国相持</span><span class=\"page-num\">32</span>\n </li>\n <li>\n <span>第十章 三国归晋与历史终结</span><span class=\"page-num\">37</span>\n </li>\n <li>\n <span>附录 三国主要人物简介</span><span class=\"page-num\">42</span>\n </li>\n <li>\n <span>附录 三国时期著名战役</span><span class=\"page-num\">45</span>\n </li>\n <li>\n <span>附录 三国疆域与行政区划</span><span class=\"page-num\">48</span>\n </li>\n </ul>\n </div>\n <page order=\"2\" num=\"0\"></page>",
|
||
"image_base_url": "/api/aippt/三"
|
||
},
|
||
touchStartX: 0,
|
||
touchStartY: 0,
|
||
touchEndX: 0,
|
||
touchEndY: 0,
|
||
slideAccents: ['#2563eb', '#23b9ad', '#d7b56b', '#4a93b8'],
|
||
parseJobId: 0,
|
||
parseTimer: null,
|
||
parseIdleTimer: null
|
||
}
|
||
},
|
||
computed: {
|
||
displayFilename() {
|
||
const raw = this.filename || '未命名 AIPPT'
|
||
return raw.replace(/\\/g, '/').split('/').pop()
|
||
},
|
||
totalSlides() {
|
||
return Math.max(this.slides.length, 1)
|
||
},
|
||
currentSlide() {
|
||
return this.slides[this.currentSlideIndex] || this.slides[0] || null
|
||
},
|
||
currentSlideHtml() {
|
||
if (!this.currentSlide) return ''
|
||
const key = this.currentSlide.id || 'slide-1'
|
||
if (!this.slideHtmlCache[key]) {
|
||
this.slideHtmlCache[key] = this.getSlideHtml(this.currentSlide)
|
||
}
|
||
return this.slideHtmlCache[key]
|
||
},
|
||
currentPageNumber() {
|
||
return Math.min(this.currentSlideIndex + 1, this.totalSlides)
|
||
},
|
||
currentPageLabel() {
|
||
return String(this.currentPageNumber).padStart(2, '0')
|
||
},
|
||
totalPageLabel() {
|
||
return String(this.totalSlides).padStart(2, '0')
|
||
},
|
||
currentSlideTitle() {
|
||
return this.currentSlide?.title || this.displayFilename || 'AIPPT'
|
||
},
|
||
frameKey() {
|
||
return `${this.currentSlide?.id || 'empty'}-${this.pageTurnDirection}`
|
||
},
|
||
canPresent() {
|
||
return !!this.htmlContent && !this.loading && !this.errorMessage && !this.isParsing && !!this
|
||
.currentSlideHtml
|
||
},
|
||
canSwipe() {
|
||
return this.slides.length > 1
|
||
},
|
||
swipeHintText() {
|
||
return '← 左右滑动翻页 →'
|
||
},
|
||
showEmptyState() {
|
||
return !this.canPresent
|
||
},
|
||
emptyTitle() {
|
||
if (this.errorMessage) return 'AIPPT 加载失败'
|
||
if (this.loading) return '正在提取 AIPPT'
|
||
if (this.isParsing) return '正在准备第一页'
|
||
if (this.parseErrorMessage) return 'AIPPT 解析失败'
|
||
return '暂无 AIPPT 内容'
|
||
},
|
||
emptyDescription() {
|
||
if (this.errorMessage) return this.errorMessage
|
||
if (this.loading) return '正在读取演示文件...'
|
||
if (this.isParsing) return '正在解析 PPT 内容...'
|
||
if (this.parseErrorMessage) return this.parseErrorMessage
|
||
return '打开 .aippt 文件后会在这里显示预览。'
|
||
},
|
||
emptyIconText() {
|
||
if (this.errorMessage || this.parseErrorMessage) return '⚠'
|
||
if (this.loading || this.isParsing) return '⏳'
|
||
return '📄'
|
||
},
|
||
slideStatusText() {
|
||
if (this.errorMessage) return '加载失败'
|
||
if (this.loading) return '正在提取...'
|
||
if (this.isParsing) return '正在准备...'
|
||
if (!this.htmlContent) return '等待打开文件'
|
||
return this.currentSlide?.fullDocument ?
|
||
'单页预览' :
|
||
`已识别 ${this.slides.length} 页`
|
||
}
|
||
},
|
||
watch: {
|
||
visible(newVal) {
|
||
if (newVal) {
|
||
this.$nextTick(() => {
|
||
this.loadVirtualData()
|
||
})
|
||
}
|
||
},
|
||
htmlContent: {
|
||
immediate: true,
|
||
handler(newVal) {
|
||
if (newVal) {
|
||
this.scheduleParseSlides(newVal)
|
||
}
|
||
}
|
||
},
|
||
slides() {
|
||
if (this.currentSlideIndex > this.slides.length - 1) {
|
||
this.currentSlideIndex = 0
|
||
}
|
||
}
|
||
},
|
||
mounted() {
|
||
this.loadVirtualData()
|
||
},
|
||
beforeDestroy() {
|
||
this.clearSchedules()
|
||
},
|
||
methods: {
|
||
loadVirtualData() {
|
||
if (!this.htmlContent && this._vietualData.html_content) {
|
||
// 自动加载内置测试数据
|
||
this.scheduleParseSlides(this._vietualData.html_content)
|
||
}
|
||
},
|
||
|
||
handleTouchStart(e) {
|
||
const touch = e.touches[0]
|
||
this.touchStartX = touch.clientX
|
||
this.touchStartY = touch.clientY
|
||
},
|
||
|
||
handleTouchEnd(e) {
|
||
const touch = e.changedTouches[0]
|
||
this.touchEndX = touch.clientX
|
||
this.touchEndY = touch.clientY
|
||
this.handleSwipe()
|
||
},
|
||
|
||
handleSwipe() {
|
||
const deltaX = this.touchEndX - this.touchStartX
|
||
const deltaY = this.touchEndY - this.touchStartY
|
||
|
||
// 水平滑动距离必须大于垂直距离
|
||
if (Math.abs(deltaX) < Math.abs(deltaY)) return
|
||
// 最小滑动距离 50px
|
||
if (Math.abs(deltaX) < 50) return
|
||
|
||
if (deltaX > 0) {
|
||
this.prevSlide()
|
||
} else {
|
||
this.nextSlide()
|
||
}
|
||
},
|
||
|
||
getHeadContent(html = '') {
|
||
const match = String(html).match(/<head[^>]*>([\s\S]*?)<\/head>/i)
|
||
return match ? match[1] : ''
|
||
},
|
||
|
||
getBodyContent(html = '') {
|
||
const match = String(html).match(/<body[^>]*>([\s\S]*?)<\/body>/i)
|
||
return match ? match[1] : html
|
||
},
|
||
|
||
getNodeTitle(html, fallbackIndex) {
|
||
const hMatch = html.match(/<h[1-6][^>]*>([\s\S]*?)<\/h[1-6]>/i)
|
||
if (hMatch) {
|
||
const text = hMatch[1].replace(/<[^>]+>/g, '').replace(/\s+/g, ' ').trim()
|
||
return text.slice(0, 36)
|
||
}
|
||
return `第 ${fallbackIndex + 1} 页`
|
||
},
|
||
|
||
isMeaningfulSlide(html) {
|
||
const text = html.replace(/<[^>]+>/g, '').replace(/\s+/g, '')
|
||
return text.length > 8 || /<img|<svg|<canvas|<video|<table/i.test(html)
|
||
},
|
||
|
||
parseSlides(html = '') {
|
||
const rawHtml = String(html || '').trim()
|
||
if (!rawHtml) return []
|
||
|
||
try {
|
||
// 提取 head 内容
|
||
const headContent = this.getHeadContent(rawHtml)
|
||
const bodyHtml = this.getBodyContent(rawHtml)
|
||
|
||
// 按 <page 标签分割幻灯片
|
||
const pageRegex = /<page\s[^>]*\/?>/gi
|
||
const pageTags = bodyHtml.match(pageRegex) || []
|
||
|
||
if (pageTags.length === 0) {
|
||
// 尝试按 h1 分割
|
||
const sections = bodyHtml.split(/(?=<h1\b)/i).filter(s => s.trim())
|
||
if (sections.length > 1) {
|
||
return sections.map((section, index) => ({
|
||
id: `slide-${index + 1}`,
|
||
title: this.getNodeTitle(section, index),
|
||
html: `<div class="ppt-slide">${section}</div>`,
|
||
headContent: headContent,
|
||
fullDocument: false
|
||
}))
|
||
}
|
||
|
||
// 单页模式
|
||
return [{
|
||
id: 'slide-1',
|
||
title: this.displayFilename,
|
||
html: `<div class="ppt-slide">${bodyHtml}</div>`,
|
||
headContent: headContent,
|
||
fullDocument: true
|
||
}]
|
||
}
|
||
|
||
// 按 page 标签分割
|
||
const parts = bodyHtml.split(pageRegex).filter(s => s.trim())
|
||
const slides = parts.map((part, index) => ({
|
||
id: `slide-${index + 1}`,
|
||
title: this.getNodeTitle(part, index),
|
||
html: `<div class="ppt-slide">${part.trim()}</div>`,
|
||
headContent: headContent,
|
||
fullDocument: false
|
||
}))
|
||
|
||
// 过滤掉空幻灯片
|
||
const meaningfulSlides = slides.filter(s => this.isMeaningfulSlide(s.html))
|
||
return meaningfulSlides.length > 0 ? meaningfulSlides : slides
|
||
} catch (error) {
|
||
console.warn('[AIPPT] slide parse failed:', error)
|
||
this.parseErrorMessage = error.message || 'AIPPT 解析失败'
|
||
return [{
|
||
id: 'slide-1',
|
||
title: this.displayFilename,
|
||
html: `<div class="ppt-slide">${rawHtml}</div>`,
|
||
headContent: this.getHeadContent(rawHtml),
|
||
fullDocument: true
|
||
}]
|
||
}
|
||
},
|
||
|
||
getSlideHtml(slide) {
|
||
if (!slide) return ''
|
||
const headStyle = slide.headContent ? `<style>${slide.headContent}</style>` : ''
|
||
return `
|
||
<div style="width:100%;background:#fff;padding:16rpx;box-sizing:border-box;min-height:100%;">
|
||
${headStyle}
|
||
${slide.html || ''}
|
||
</div>
|
||
`
|
||
},
|
||
|
||
clearSchedules() {
|
||
if (this.parseTimer) {
|
||
clearTimeout(this.parseTimer)
|
||
this.parseTimer = null
|
||
}
|
||
if (this.parseIdleTimer) {
|
||
clearTimeout(this.parseIdleTimer)
|
||
this.parseIdleTimer = null
|
||
}
|
||
},
|
||
|
||
scheduleParseSlides(html = '') {
|
||
const rawHtml = String(html || '')
|
||
const jobId = ++this.parseJobId
|
||
|
||
this.clearSchedules()
|
||
this.slideHtmlCache = {}
|
||
this.currentSlideIndex = 0
|
||
this.parseErrorMessage = ''
|
||
|
||
if (!rawHtml.trim()) {
|
||
this.isParsing = false
|
||
this.parsedHeadContent = ''
|
||
this.slides = []
|
||
return
|
||
}
|
||
|
||
this.isParsing = true
|
||
this.parsedHeadContent = this.getHeadContent(rawHtml)
|
||
this.slides = []
|
||
|
||
// 延迟解析，避免阻塞 UI
|
||
this.parseTimer = setTimeout(() => {
|
||
if (jobId !== this.parseJobId) return
|
||
try {
|
||
const nextSlides = this.parseSlides(rawHtml)
|
||
if (jobId !== this.parseJobId) return
|
||
this.slides = nextSlides
|
||
this.parsedHeadContent = nextSlides[0]?.headContent || this.parsedHeadContent
|
||
} catch (e) {
|
||
console.error('[AIPPT] parse error:', e)
|
||
} finally {
|
||
if (jobId === this.parseJobId) {
|
||
this.isParsing = false
|
||
}
|
||
}
|
||
}, 100)
|
||
},
|
||
|
||
pulseStage() {
|
||
// 简化的脉冲动画通过 CSS 实现
|
||
this.pageTurnDirection = this.pageTurnDirection >= 0 ? 1 : -1
|
||
},
|
||
|
||
goToSlide(index) {
|
||
if (!this.canPresent) return
|
||
const target = Math.max(0, Math.min(Number(index) || 0, this.slides.length - 1))
|
||
if (target === this.currentSlideIndex) return
|
||
this.pageTurnDirection = target >= this.currentSlideIndex ? 1 : -1
|
||
this.currentSlideIndex = target
|
||
this.pulseStage()
|
||
},
|
||
|
||
prevSlide() {
|
||
this.goToSlide(this.currentSlideIndex - 1)
|
||
},
|
||
|
||
nextSlide() {
|
||
this.goToSlide(this.currentSlideIndex + 1)
|
||
},
|
||
|
||
onRefresh() {
|
||
this.$emit('refresh')
|
||
},
|
||
|
||
onClose() {
|
||
this.$emit('close')
|
||
},
|
||
|
||
// 暴露给父组件的方法
|
||
exposedNextSlide() {
|
||
this.nextSlide()
|
||
},
|
||
exposedPrevSlide() {
|
||
this.prevSlide()
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.ia-root {
|
||
display: flex;
|
||
flex-direction: column;
|
||
height: 100vh;
|
||
width: 100%;
|
||
background: #f0f0f3;
|
||
font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei",
|
||
sans-serif;
|
||
font-size: 28rpx;
|
||
color: #0f172a;
|
||
overflow: hidden;
|
||
}
|
||
|
||
/* ===== 顶部工具栏 ===== */
|
||
.ia-toolbar {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 16rpx 24rpx;
|
||
background: #fff;
|
||
border-bottom: 2rpx solid rgba(15, 23, 42, 0.08);
|
||
flex-shrink: 0;
|
||
/* #ifdef H5 */
|
||
padding-top: calc(16rpx + env(safe-area-inset-top));
|
||
/* #endif */
|
||
}
|
||
|
||
.ia-title {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
|
||
.ia-badge {
|
||
flex-shrink: 0;
|
||
background: #eef4ff;
|
||
color: #2563eb;
|
||
font-size: 22rpx;
|
||
font-weight: 900;
|
||
padding: 6rpx 16rpx;
|
||
border-radius: 40rpx;
|
||
margin-right: 16rpx;
|
||
}
|
||
|
||
.ia-title-copy {
|
||
flex: 1;
|
||
min-width: 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.ia-title-strong {
|
||
font-size: 28rpx;
|
||
font-weight: 700;
|
||
color: #0f172a;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.ia-title-em {
|
||
font-size: 22rpx;
|
||
color: #94a3b8;
|
||
}
|
||
|
||
.ia-actions {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
flex-shrink: 0;
|
||
margin-left: 16rpx;
|
||
}
|
||
|
||
.ia-icon-btn {
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-left: 12rpx;
|
||
border-radius: 40rpx;
|
||
background: rgba(37, 99, 235, 0.06);
|
||
transition: background 0.15s;
|
||
}
|
||
|
||
.ia-icon-btn:active {
|
||
background: rgba(37, 99, 235, 0.15);
|
||
}
|
||
|
||
.ia-close-btn {
|
||
background: rgba(239, 68, 68, 0.06);
|
||
}
|
||
|
||
.ia-close-btn:active {
|
||
background: rgba(239, 68, 68, 0.15);
|
||
}
|
||
|
||
.ia-icon {
|
||
font-size: 36rpx;
|
||
color: #2563eb;
|
||
}
|
||
|
||
.ia-close-btn .ia-icon {
|
||
color: #ef4444;
|
||
}
|
||
|
||
/* ===== 主舞台 ===== */
|
||
.ia-canvas {
|
||
flex: 1;
|
||
min-height: 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
overflow: hidden;
|
||
background: linear-gradient(180deg, #f8fafc, #e9eef6);
|
||
}
|
||
|
||
/* ===== 空状态 ===== */
|
||
.ia-empty {
|
||
flex: 1;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 40rpx;
|
||
text-align: center;
|
||
}
|
||
|
||
.ia-empty-icon {
|
||
font-size: 80rpx;
|
||
margin-bottom: 24rpx;
|
||
}
|
||
|
||
.ia-empty-title {
|
||
font-size: 34rpx;
|
||
font-weight: 700;
|
||
color: #0f172a;
|
||
margin-bottom: 12rpx;
|
||
}
|
||
|
||
.ia-empty-desc {
|
||
font-size: 26rpx;
|
||
color: #64748b;
|
||
max-width: 400rpx;
|
||
line-height: 1.6;
|
||
}
|
||
|
||
/* ===== 幻灯片区域 ===== */
|
||
.ia-slide-area {
|
||
flex: 1;
|
||
display: flex;
|
||
flex-direction: column;
|
||
min-height: 0;
|
||
padding: 24rpx;
|
||
}
|
||
|
||
.ia-frame-shell {
|
||
flex: 1;
|
||
min-height: 0;
|
||
border-radius: 16rpx;
|
||
background: #fff;
|
||
box-shadow: 0 4rpx 20rpx rgba(15, 23, 42, 0.08);
|
||
overflow: hidden;
|
||
display: flex;
|
||
flex-direction: column;
|
||
position: relative;
|
||
}
|
||
|
||
.ia-frame-scroll {
|
||
flex: 1;
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.ia-frame {
|
||
width: 100%;
|
||
min-height: 100%;
|
||
}
|
||
|
||
/* 滑动提示 */
|
||
.ia-swipe-hint {
|
||
position: absolute;
|
||
bottom: 12rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
background: rgba(15, 23, 42, 0.55);
|
||
padding: 8rpx 24rpx;
|
||
border-radius: 40rpx;
|
||
}
|
||
|
||
.ia-swipe-hint-text {
|
||
color: #fff;
|
||
font-size: 22rpx;
|
||
}
|
||
|
||
/* ===== 缩略图条 ===== */
|
||
.ia-thumb-strip {
|
||
flex-shrink: 0;
|
||
margin-top: 16rpx;
|
||
width: 100%;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.ia-thumb-list {
|
||
display: flex;
|
||
flex-direction: row;
|
||
padding: 4rpx 0;
|
||
}
|
||
|
||
.ia-thumb-item {
|
||
flex-shrink: 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
min-width: 120rpx;
|
||
height: 80rpx;
|
||
padding: 8rpx 16rpx;
|
||
margin-right: 12rpx;
|
||
border-radius: 12rpx;
|
||
background: rgba(255, 255, 255, 0.7);
|
||
border: 2rpx solid rgba(15, 23, 42, 0.06);
|
||
transition: all 0.2s;
|
||
}
|
||
|
||
.ia-thumb-item.active {
|
||
background: linear-gradient(135deg, #2563eb, #23b9ad);
|
||
border-color: transparent;
|
||
}
|
||
|
||
.ia-thumb-num {
|
||
font-size: 22rpx;
|
||
font-weight: 900;
|
||
color: #1d4ed8;
|
||
}
|
||
|
||
.ia-thumb-item.active .ia-thumb-num {
|
||
color: #fff;
|
||
}
|
||
|
||
.ia-thumb-title {
|
||
font-size: 20rpx;
|
||
color: #64748b;
|
||
margin-top: 4rpx;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
max-width: 160rpx;
|
||
}
|
||
|
||
.ia-thumb-item.active .ia-thumb-title {
|
||
color: rgba(255, 255, 255, 0.85);
|
||
}
|
||
|
||
/* ===== 底部导航栏 ===== */
|
||
.ia-pager {
|
||
flex-shrink: 0;
|
||
padding: 16rpx 24rpx;
|
||
padding-bottom: calc(16rpx + env(safe-area-inset-bottom));
|
||
background: rgba(248, 251, 255, 0.92);
|
||
border-top: 2rpx solid rgba(15, 23, 42, 0.06);
|
||
}
|
||
|
||
.ia-pager-shell {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 24rpx;
|
||
}
|
||
|
||
.ia-page-btn {
|
||
width: 80rpx;
|
||
height: 72rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-radius: 40rpx;
|
||
background: rgba(37, 99, 235, 0.08);
|
||
transition: all 0.15s;
|
||
}
|
||
|
||
.ia-page-btn:active:not(.disabled) {
|
||
background: rgba(37, 99, 235, 0.18);
|
||
transform: scale(0.95);
|
||
}
|
||
|
||
.ia-page-btn.disabled {
|
||
opacity: 0.35;
|
||
}
|
||
|
||
.ia-next-btn {
|
||
background: linear-gradient(135deg, #2563eb, #23b9ad);
|
||
}
|
||
|
||
.ia-next-btn.disabled {
|
||
background: rgba(37, 99, 235, 0.08);
|
||
}
|
||
|
||
.ia-nav-icon {
|
||
font-size: 36rpx;
|
||
color: #1e40af;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.ia-next-btn .ia-nav-icon {
|
||
color: #fff;
|
||
}
|
||
|
||
.ia-next-btn.disabled .ia-nav-icon {
|
||
color: #1e40af;
|
||
}
|
||
|
||
.ia-page-count {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 12rpx 28rpx;
|
||
border-radius: 40rpx;
|
||
background: rgba(238, 244, 255, 0.78);
|
||
border: 2rpx solid rgba(37, 99, 235, 0.08);
|
||
}
|
||
|
||
.ia-current-page {
|
||
font-size: 40rpx;
|
||
font-weight: 900;
|
||
color: #1d4ed8;
|
||
font-family: "SFMono-Regular", Consolas, monospace;
|
||
}
|
||
|
||
.ia-page-divider {
|
||
font-size: 28rpx;
|
||
color: rgba(51, 65, 85, 0.5);
|
||
margin: 0 8rpx;
|
||
}
|
||
|
||
.ia-total-page {
|
||
font-size: 28rpx;
|
||
color: rgba(51, 65, 85, 0.5);
|
||
font-family: "SFMono-Regular", Consolas, monospace;
|
||
}
|
||
</style>
|