.env.product
@@ -8,7 +8,7 @@ # 京师e课正式服图书部署配置文件 VUE_APP_API_URL = "https://jsek.bnuic.com" VUE_APP_RESOURCE_CTX = 'https://jsek.bnuic.com/books/resource/' VUE_APP_PUBLIC_PATH = 'https://jsek.bnuic.com/books/book/UAVTechIntro' VUE_APP_PUBLIC_PATH = 'https://jsek.bnuic.com/books/book/textToddlerSportsSafetyProtection' # 旅游社图书部署配置文件 @@ -16,5 +16,5 @@ # VUE_APP_RESOURCE_CTX = 'https://www.tepcb.com/books/resource/' # VUE_APP_PUBLIC_PATH = 'https://www.tepcb.com/books/book/policiesAndRegulations' VUE_APP_BOOK_LIST = "childHealth/lifeCare/sportsAndHealth/embedded/english/artAndDance/artAndDrama/mathBook/botany/civilAviation/civilServices/meetingPlanners/aviationBasicSkills/aviationEtiquette/aviationSafety/toddlerGameImplementation/childcareInstitutionsManagement/preschoolGameGuidance/kindergartenLanguageActivity/preschoolEvaluation/preschoolBasicKnowledge/practicalCareChildrenManual/OralAndBroadcasting/aurturingAndEducationAged0to3/policiesAndRegulations/kindergartenActivitiesDesignGuidance/toddlerSportsSafetyProtection/artInitiationForAges0to3/childIllnessPreventionCare/behaviorObserveAndGuid/cognitiveLanDevEduAges0to3/aviationPassengerTransport6th/hotelEnglishTrainingBrochure2nd/hydraulicTransmission/MMVRTCMP/foodSensoryInspection/civilPassengerTransport/UAVTechIntro" VUE_APP_BOOK_ID = 'UAVTechIntro' VUE_APP_BOOK_LIST = "childHealth/lifeCare/sportsAndHealth/embedded/english/artAndDance/artAndDrama/mathBook/botany/civilAviation/civilServices/meetingPlanners/aviationBasicSkills/aviationEtiquette/aviationSafety/toddlerGameImplementation/childcareInstitutionsManagement/preschoolGameGuidance/kindergartenLanguageActivity/preschoolEvaluation/preschoolBasicKnowledge/practicalCareChildrenManual/OralAndBroadcasting/aurturingAndEducationAged0to3/policiesAndRegulations/kindergartenActivitiesDesignGuidance/toddlerSportsSafetyProtection/artInitiationForAges0to3/childIllnessPreventionCare/behaviorObserveAndGuid/cognitiveLanDevEduAges0to3/aviationPassengerTransport6th/hotelEnglishTrainingBrochure2nd/hydraulicTransmission/MMVRTCMP/foodSensoryInspection/civilPassengerTransport/UAVTechIntro/textToddlerSportsSafetyProtection" VUE_APP_BOOK_ID = 'textToddlerSportsSafetyProtection' src/App.vue
@@ -46,6 +46,7 @@ <MMVRTCMP v-if="activeBook.name == 'MMVRTCMP'"></MMVRTCMP> <civilPassengerTransport v-if="activeBook.name == 'civilPassengerTransport'"> </civilPassengerTransport> <UAVTechIntro v-if="activeBook.name == 'UAVTechIntro'"></UAVTechIntro> <textToddlerSportsSafetyProtection v-if="activeBook.name == 'textToddlerSportsSafetyProtection'"></textToddlerSportsSafetyProtection> </div> </template> <script> @@ -131,7 +132,10 @@ MMVRTCMP: () => import("./books/MMVRTCMP/view/index.vue"), civilPassengerTransport: () => import("./books/civilPassengerTransport/view/index.vue"), UAVTechIntro: () => import("./books/UAVTechIntro/view/index.vue") UAVTechIntro: () => import("./books/UAVTechIntro/view/index.vue"), textToddlerSportsSafetyProtection:() => import( "./books/textToddlerSportsSafetyProtection/view/index.vue" ) }, data() { return { @@ -177,7 +181,7 @@ // botany // 植物学（农大社） // childcareInstitutionsManagement // 托育机构管理与实务 // toddlerGameImplementation // 婴幼儿游戏活动实施 // preschoolGameGuidance // 学前游戏指导 // preschoolGameGuidance // 幼儿游戏与指导 // kindergartenLanguageActivity // 幼儿园语言教育与活动指导 // kindergartenActivitiesDesignGuidance // 幼儿园教育活动设计与指导 // aurturingAndEducationAged0to3 // 0~3岁婴幼儿抚育与教育 @@ -198,11 +202,12 @@ // MMVRTCMP // 视觉手册 // civilPassengerTransport // 民航旅客运输 // UAVTechIntro // 无人机应用技术导论 // textToddlerSportsSafetyProtection // 测试图书 this.activeBook = await this.config.getBookConfig( process.env.VUE_APP_RESOURCE_CTX + (process.env.VUE_APP_ENV == "product" ? process.env.VUE_APP_BOOK_ID : "UAVTechIntro") : "textToddlerSportsSafetyProtection") ); // 测试试读30页 // this.activeBook.tryPageCount = 10; @@ -211,6 +216,7 @@ // 旅游社处理跨域问题 // this.activeBook = this.config.activeBook; this.config.activeBook = this.activeBook; console.log(this.activeBook, "this.activeBook"); this.config.goodsStore = this.activeBook.storeRefcode; } }, src/assets/js/config.js
@@ -1,5 +1,44 @@ import axios from "axios"; export let activeBook = {}; // 资源请求地址 export let ceShiActiveBook = { name: "toddlerSportsSafetyProtection", rootCmsItemId: "68651", storeRefcode: "defaultGoodsStore3", bookId: "3845", bookName: "婴幼儿运动安全与保护", textbookOwnership: "北京师范大学出版社", bookThemeColor: "#7ACAB4", chapterThemeColor: { 1: "#7ACAB4", 2: "#7ACAB4", 3: "#7ACAB4", }, pageThemeColor: { 1: "#7ACAB4", 2: "#7ACAB4", 3: "#7ACAB4", }, resourceUrl: "https://jsek.bnuic.com/books/resource/toddlerSportsSafetyProtection", requestCtx: "https://jsek.bnuic.com/", textbookComponents: [ "1E16353F", "B7C5B45D", "A3298FCF", "A04689E6", "CB0EACEC", "CF2E1400", "395B91FC", "229EC161", "BC9B0CBD", "7D5594B3", "C05AA457", "94FF5E48", "E30C0843", "86F0A1B8", "D2D30448", ], }; // 测试图书资源请求地址 export let goodsStore = ""; // 请求教材配置信息 const getBookConfig = async (ctx) => { @@ -8,7 +47,7 @@ }; // 请求教材资源信息 const getBookResources = async (ctx) => { const getBookResources = async (ctx) => { const response = await axios.get(ctx + "/bookResources.json"); return response.data; }; @@ -20,6 +59,7 @@ const config = { activeBook, ceShiActiveBook, requestTimeOut, tokenKey, goodsStore, src/books/TextbookReader
New file @@ -0,0 +1 @@ Subproject commit 6754eddf2b9d166e32c7bdcfffe09b75b8bb970b src/books/preschoolGameGuidance/view/components/index.vue
@@ -173,7 +173,7 @@ // 测试页面跳转 setTimeout(() => { this.gotoPage(8, 183); this.gotoPage(1, 1); // setTimeout(() => { // this.renderSign("Highlight", { // id: "2ACA9359", src/books/textToddlerSportsSafetyProtection/assets/Fonts/FZNBSK.TTFBinary files differ
src/books/textToddlerSportsSafetyProtection/assets/Fonts/hyg6gjm.ttfBinary files differ
src/books/textToddlerSportsSafetyProtection/assets/examinationList.js
New file @@ -0,0 +1,11 @@ const testData = { 2: { 185: [ 95057, 96460, 96675, 96866, 97048, 97222, 97351, 97469, 97581, 97684, 101474, 101475, 101476, 102404, 102437, 102458, 102483, 103818, 104121, 104132, 104142, 104150, 104158, 104165, 104171, ], }, }; export default testData; src/books/textToddlerSportsSafetyProtection/assets/images/0013-03.jpg
New file @@ -0,0 +1,1921 @@ .toddlerSportsSafetyProtection { width: 100%; height: 100%; // 自定义内容 .page-box { box-sizing: border-box; min-height: 1128px; margin-bottom: 20px; box-shadow: 0 3px 6px 1px rgba(0, 0, 0, 0.15); background-color: #fff; } .special-box { box-sizing: border-box; min-height: 500px !important; margin-bottom: 0 !important; background-color: #fff; } .wh-no { white-space: nowrap; } .c-g { color: green; } .c-r { color: red; } .t-right { text-align: right; } .mr-0 { margin: 0; } .mt-10 { margin-top: 10px !important; } .mt-20 { margin-top: 20px !important; } .table-pad { padding: 1em 0.7em !important; } .mt-30 { margin-top: 30px !important; } .mt-70 { margin-top: 70px; } .mb-10 { margin-bottom: 10px; } .mb-30 { margin-bottom: 30px !important; } .ma-l { margin-left: 8%; } .ma-0 { margin: 0% !important; } .pd-5 { padding: 0 5px; } .w100 { width: 100%; } .w80 { width: 80%; } .w70 { width: 70%; } .w25 { width: 25%; } .w20 { width: 20%; } .fz-13 { font-size: 13px !important; } .fz-14 { font-size: 14px !important; } .fz-16 { font-size: 16px !important; } .fz-18 { font-size: 18px !important; } .fz-20 { font-size: 20px; } .img-0 { width: 100%; } .img-c { width: 70%; } .pt-20 { padding-top: 20px; } .td-0 { text-indent: 0em !important; } .td-1 { text-indent: 1em !important; } td { padding: 5px 10px; } .fl { display: flex; } .ju-cn { justify-content: center; } .ju-ev { justify-content: space-evenly; } .jc-fs { justify-content: flex-start; } .fw-w { flex-wrap: wrap; } .fd-c { flex-direction: column; } .fd-r { flex-direction: row-reverse; } .al-c { align-items: center; } .al-fe { align-items: flex-end; } .ac-f { align-content: flex-end; } .jc-fe { justify-content: flex-end; } .jc-c { justify-content: center; } .jc-sa { justify-content: space-around } .ml-40 { margin-left: 40px; } .mr-70 { margin-right: 70px; } .mr-10 { margin-right: 10px; } .pad-t-55 { padding-top: 55px; } .ma-t-30 { margin-top: 30px; } .ma-t-20 { margin-top: 20px; } .pad-l-60 { padding-left: 60px; } .pad-l-80 { padding-left: 80px; } .mb-45 { margin-bottom: 45px; } .mb-20 { margin-bottom: 20px !important; } .mb-30 { margin-bottom: 30px !important; } .page-father { display: flex; width: 100%; } .header-left { min-width: 12%; padding: 0 !important; margin: 0 !important; img { margin-left: 70%; width: 30%; height: auto; } } .headerText { width: 17%; margin-left: 75%; padding: 80px 0px 5px 0px; background-color: #7acab4; color: #fff; font-size: 12px; text-align: center; border-radius: 0 0 10px 10px; margin-bottom: 10px; line-height: 15px; } .headerNumber { font-size: 12px; border: 1px solid #7acab4; border-radius: 0 5px 5px 0; border-left: none; padding: 5px 10px; text-align: right; color: #7acab4; } .header-right { min-height: 100%; overflow: hidden; min-width: 12%; padding: 0 !important; margin: 0 !important; position: relative; } .header-right-imgBottom { position: absolute; bottom: -2%; } .header-right-img { width: 100%; display: inline-block; justify-content: center; padding-top: 40%; height: 59%; min-height: 600px; img { width: 35%; height: auto; } } .header-right-imgTop { width: 22%; margin-bottom: -5px; margin-left: 10px; } .header-right-Text { color: #7acab4; font-family: "方正细圆"; font-size: 14px; padding: 5px 0; width: 17%; margin-left: 10%; margin-right: 70%; background-color: transparent; border: 1px solid #7acab4; border-radius: 3px; font-size: 12px; text-align: center; } .header-right-Text-bottom { line-height: 15px; width: 17%; padding: 5px 0px 80px 0px; background-color: #7acab4; color: #fff; font-size: 12px; text-align: center; border-radius: 5px 5px 0px 0px; margin-bottom: 10px; margin-left: 11.5%; margin-top: 5%; } .header-right-Number { border: 1px solid #7acab4; border-radius: 5px 0 0 5px; border-right: none; padding: 5px 10px; text-align: left; color: #7acab4; margin-bottom: 10px; font-size: 12px; span { font-family: "方正细圆"; font-size: 12px; position: absolute; left: 25%; bottom: 20%; } } /*二级标题章标*/ .secondsubHead-1 { text-align: left; line-height: 1.1em; font-size: 1em; text-indent: 0em; margin: 20% auto 0.3em auto; color: #888888; } .secondsubHead-2 { font-family: "方正新报宋"; background-color: #7acab4; display: inline-block; align-items: center; text-align: left; color: #fff; border-radius: 10px; padding: 0px 10px; text-indent: 0em; font-size: 22px; line-height: 28px; } .tipes { background-color: #e2f2ed; border: 2px solid #96d3c1; padding: 10px; } table { border-color: none !important; } .table-th-bc { background-color: #FEDDB4; color: #000; } .table-tr-bc { background-color: #FEF4E4; color: #000; } .table-textarea { font-size: 14px; font-family: "Times New Roman", "宋体"; resize: none; &:focus { outline: none; } } // 文本框 .textarea-question { border-color: #7acab4 !important; } .textarea-question:focus { outline: none; /* 移除默认的焦点轮廓 */ } .textarea-box { border: none; text-align: center; width: 84px; height: 36px; overflow: auto; word-break: break-all; resize: none; } .b0 { border: 0; } .task { width: 16%; margin-bottom: 5em; margin-top: 0; border-top: 0.7em solid #5192C6; } .task2 { width: 16%; margin-bottom: 5em; margin-top: 0; border-top: 0.7em solid #F89C1C; } .task3 { width: 16%; margin-bottom: 5em; margin-top: 0; border-top: 0.7em solid #448D9C; } .task4 { width: 16%; margin-bottom: 5em; margin-top: 0; border-top: 0.7em solid #9EAA60; } .p-odd { padding-right: 8%; } .p-even { padding-left: 8%; } .pt-30 { padding-top: 30px !important; } .p-continued { text-align: right; font-size: 14px; margin-bottom: 10px; } .img-float { width: 310px; float: left; height: auto; margin: auto; margin-right: 20px; img { width: 100%; } p { margin: 0; } } .img-rights { width: 310px; float: right; height: auto; margin: auto; margin-left: 20px; img { width: 100%; } p { margin: 0 !important; } } .w430 { width: 430px; } .w395 { width: 395px; } .w350 { width: 350px; } .w290 { width: 290px; } .w280 { width: 280px; } .w275 { width: 275px; } .w270 { width: 270px; } .w250 { width: 250px; } .w230 { width: 230px; } .w220 { width: 220px; } .w210 { width: 210px; } .w200 { width: 200px; } .w180 { width: 180px; } .w150 { width: 150px; } .w115 { width: 115px; } .pdf-text { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; margin-bottom: 20px; p { margin: 0; margin-right: 10px; } .pdf-con { display: flex; justify-content: flex-start; align-items: center; padding: 10px 0; box-sizing: border-box; border-radius: 10px; .pdf-view { min-width: 160px; display: flex; justify-content: center; align-items: center; border: 0.15em dashed #895B2E; margin-right: 15px; padding: 0 15px; border-radius: 5px; margin-top: 15px; span { font-size: 14px; text-align: center; font-family: 'FZLTXIHJW'; display: flex; align-items: center; justify-content: flex-start; svg { fill: #895B2E; } } span:nth-child(2) { padding-top: 5px; box-sizing: border-box; } span:hover { color: #895B2E; cursor: pointer; text-decoration: underline; -webkit-user-select: none; /* Safari 3.1+ */ -moz-user-select: none; /* Firefox 2+ */ -ms-user-select: none; /* IE 10+ */ user-select: none; /* 标准语法 */ } } } .pdf-con-15 { margin-top: -20px; } } .fm-hyzh { font-family: "汉仪中黑"; font-weight: 500; } .fm-kt { font-family: "kaiti" !important; font-weight: 500; } .fm-hyss { font-family: "汉仪书宋"; } div.bk-ztgs { border: 0.15em dotted #5192c6; padding: 0.5em; margin-bottom: 2em; margin-top: 2em; border-radius: 1em; position: relative; } p.bj1-ztgs { background-color: #5192c6; color: #ffffff; display: inline-block; font-size: 1em; padding: 0.1em 0.7em 0.12em 0.7em; font-weight: bold; border-radius: 0em; margin-left: 0em; text-align: center; text-indent: 0em; position: absolute; top: -2em; } .link-float { width: 150px; float: left; height: auto; margin: auto; margin-right: 20px; } .imgBox-003 { width: 100%; height: 280px; margin-bottom: 18px; } .imgBox { display: flex !important; flex-direction: column-reverse !important; position: relative !important; .img { color: #7acab4; margin: 0 !important; font-size: 14px !important; position: absolute !important; left: 50% !important; transform: translateX(-50%); bottom: -2% !important; } img { height: 80%; } } // 题目 .textarea-main { background-color: transparent; max-width: 95%; min-width: 95%; outline: none; } .textarea-focused { border-color: #5192c6 !important; box-shadow: #5192c6 !important; } .select-border { width: 60px; border: 0; border-bottom: 1px solid #767676; &:focus { outline: none; } } .btn-border { border-radius: 6px; border-color: #5192C6; } .btn-w { cursor: pointer; font-size: 14px; border-width: 1px; width: 80px; height: 30px; background-color: #fff; &:hover { background-color: #5192C6; color: #fff; } } .parimary-btn { cursor: pointer; min-width: 80px; height: 30px; font-size: 14px; margin-left: 5px; background-color: #5192C6; border-color: #5192C6; border-width: 1px; color: #fff; border-radius: 6px; &:hover { background-color: #a1afc8; border-color: #a1afc8; } } .event-header-text-bc { background-color: #bbd4ec; } .video-box { margin: 20px 0 20px 0; border: 1px solid #96d3c1; padding: 2% 2%; } .video-box-left { margin: 20px 8% 20px 0; border: 1px dashed #895B2E; padding: 2% 2%; } .videoname { display: flex; justify-content: center; } .collect-btn { cursor: pointer; width: 20px; height: 20px; margin-left: 10px; margin-top: 0.8%; } .collect-btn1 { cursor: pointer; width: 10px; height: 10px; margin-left: 10px; margin-top: 0.8%; } .unitImg { position: relative; z-index: 1; } .unitBox { z-index: 99; position: absolute; top: -5px; left: 40px; } .unit2Box { z-index: 99; position: absolute; top: -200px; left: 40px; } .unitGraphic { display: inline-block; width: 10px; height: 10px; background-color: #5192C6; border-radius: 50%; margin-right: 15px; } .unit2Graphic { display: inline-block; width: 10px; height: 10px; background-color: #F89C1C; border-radius: 50%; margin-right: 15px; } .unit3Graphic { display: inline-block; width: 10px; height: 10px; background-color: #448D9C; border-radius: 50%; margin-right: 15px; } .unit4Graphic { display: inline-block; width: 10px; height: 10px; background-color: #9EAA60; border-radius: 50%; margin-right: 15px; } .unitText { color: #5192C6; font-size: 18px; } .unit2Text { color: #F89C1C; font-size: 16px; } .unit3Text { color: #448D9C; font-size: 16px; } .unit4Text { color: #9EAA60; font-size: 16px; } // 迁移 .bk-bwh { min-height: 800px; background-color: #DFEBF7; font-size: 1.2em; padding: 25px; border: 4px dotted #197ABF; } ul { list-style-type: none; } li { list-style-type: none; } .custom_tag2 { background-color: #F1BE49; color: #FFFFFF; display: inline-block; padding: 0.5px; border-radius: 1.5em; font-size: 1.1em; padding: 2px 10px 2px 10px; font-weight: bold; margin: 0; text-indent: 0em; margin-bottom: 0.5em; } .custom_tag1 { background-color: #35ACD6; color: #FFFFFF; display: inline-block; padding: 1px; font-size: 1.1em; padding: 3px 10px 3px 10px; font-weight: bold; box-shadow: 15px 0px 0px 0px #F5D83E, -15px 0px 0px 0px #F5D83E; margin: 0; text-indent: 0em; margin-bottom: 0.5em; } .custom_tag { background-color: #35509F; color: #FFFFFF; display: inline-block; padding: 1px; border-radius: 1.5em; font-size: 1.1em; padding: 10px 20px 10px 20px; font-weight: bold; box-shadow: 30px 0px 0px 0px #F5D83E; margin: 0; text-indent: 0em; margin-bottom: 0.5em; } span.under1 { border-bottom: 2px solid #F0BD4A; border-width: 2px; } div.bodycontent-div-center { font-family: "DK-HEITI", "方正兰亭黑简体", "黑体"; margin: 1em 1em 1em 1em; font-weight: normal; border-width: 1.5px; border-color: #dfb27d; padding: 1em; } img.bodycontent-divcenter-image { float: center; clear: both; height: 140px; margin: 15px; } .module_block { display: flex; font-size: 1.1em; position: relative; padding-left: 90px; justify-content: center; align-items: center; margin-right: 91px; } .module_block .custom1 { background-color: #9ACC77; padding: 10px 20px; color: #FFFFFF; /* position: absolute; */ /* left:0; */ /* top: 50%; */ border-radius: 0.5em 0em 0em 0.5em; /* transform: translateY(-50%); */ } .module_block .custom2 { background-color: #E9F3E0; padding: 10px 20px; color: #75A64E; font-weight: bold; border-radius: 0em 0.5em 0.5em 0em; } div.bodycontent-div-left1 { font-family: "DK-HEITI", "方正兰亭黑简体", "黑体"; margin: 1em 1em 1em 1em; font-weight: normal; border-width: 1.5px; border-color: #dfb27d; padding: 1em; background-color: #F0F8FF; } div.bodycontent-div-left { font-family: "DK-HEITI", "方正兰亭黑简体", "黑体"; margin: 1em 1em 1em 1em; font-weight: normal; border-width: 1.5px; border-color: #dfb27d; padding: 1em; } img.bodycontent-divright-image { float: right; clear: both; height: 140px; margin: 15px; } img.bodycontent-divleft-image { float: left; clear: both; height: 110px; margin: 15px; } div.bodystyle { text-align: justify; padding: 13% 13% 10% 3%; line-height: 30px; min-width: 70%; } div.bodystyle-left { text-align: justify; padding: 13% 3% 10% 13%; line-height: 30px; min-width: 70%; } .special-bodystyle-top { padding: 80px 15% 0 15%; line-height: 30px; padding-bottom: 2px; position: relative; } .special-bodystyle-bottom { padding: 0 15% 80px 15%; line-height: 30px; position: relative; } .special-bodystyle { padding: 0 15%; padding-top: 5px; padding-bottom: 2px; line-height: 30px; position: relative; } .page-header { width: 50px; text-align: center; position: absolute; padding-right: 30px; border: 1px solid #7acab4; color: #7acab4; border-radius: 10px 0 0 10px; border-right: #7acab4; right: 0; top: 0; font-size: 14px; } .UnitCover { margin: 0 13%; padding-top: 10%; padding-bottom: 80px; } .unit-title-parent { text-align: center; margin: 10% 0; } .unit-title { font-family: "方正正黑"; display: inline-block; font-size: 1.6em; font-weight: 500; border-bottom: 1px solid #0082D4; padding: 10px 0; } span.zt-0 { color: #0087AF; } p.pzt-0 { color: #0087AF; font-size: 18px; } p.pzt-0-right { font-size: 18px; color: #0087AF; text-align: right; } p.pzt-1 { font-weight: bold; color: #0087AF; font-size: 18px; } div.sgc-toc-title { font-size: 2em; font-weight: bold; margin-bottom: 1em; text-align: center; } .block { font-family: "kaiTi"; text-indent: 2em; line-height: 30px; font-size: 17px; text-align: justify; } .tl-c { text-align: center; } .img { font-family: 'FZLTXIHJW'; text-align: center; font-size: 14px; margin-left: 0%; margin-right: 0%; text-indent: 0em; } .img1 { font-family: 'FZLTXIHJW'; text-align: right; font-size: 0.85em; margin-left: 0%; margin-right: 2em; text-indent: 0em; } p { font-family: "方正新报宋"; margin-top: 0em; margin-bottom: 0.2em; text-indent: 2em; line-height: 30px; text-align: justify; } .cover { width: 100%; padding: 0px; } .center { text-align: center; margin-left: 0%; margin-right: 0%; text-indent: 0em; } .center-ss { text-align: center; color: #EF8472; font-weight: bold; margin-left: 0%; margin-right: 0%; text-indent: 0em; } .left { text-indent: 0em; margin-bottom: 0px; line-height: 20px; } .img-0 { width: 100%; } .img-a { width: 95%; } .img-b { width: 70%; } .img-c { width: 60%; } .img-d { width: 50%; } .img-e { width: 45%; } .img-f { width: 40%; } .img-g { width: 30%; } .img-h { width: 20%; } .img-h { width: 20%; } .img-15 { width: 15%; } .img-i { width: 10%; } .img-j { width: 5%; } // epub中自带的样式 .foreword { padding: 30% 12%; height: 100%; background: #b0ddcf } .editorialBoard { background-color: #fff; border-radius: 50%; /* 顶部和底部为0，左右两侧为50% */ padding: 5% 10% 20% 10%; } .series { padding: 12% 15% } .seriesTitle { display: inline-block; font-size: 1.5em; color: #fff; font-weight: 400; padding-left: 1%; padding-right: 8%; background: linear-gradient(135deg, #7acab4, #7acab4 80%, transparent 50%, transparent 100%); margin-bottom: 5px; margin-top: 5px; span { width: auto; } } .rotate-up { text-indent: 0; font-size: 16px; color: #7acab4; line-height: 10px; margin-bottom: 20px; } .rotate-down { text-indent: 0; font-size: 12.5px; color: #7acab4; line-height: 10px; } .g-pic { height: 2.5em; vertical-align: middle; } .content { line-height: 25px; } .titleQuot-c { font-family: "汉仪楷体", "ETrump KaiTi", "方正仿宋", "FZFSJW--GB1-0"; font-size: 1.2em; line-height: 1.3em; margin: 1em auto; text-align: center; font-weight: bold; } div.bk3 { background-color: #d6ece5; border: 1px solid #7acab4; padding: 2em 19px 20px 19px; margin-bottom: 1em; position: relative; } .bk3-titOne { position: absolute; top: -18px; left: 20%; } .bk3-titTwo { position: absolute; top: -18px; left: 38%; } .bk3-titThree { position: absolute; top: -18px; right: 38%; } .bk3-titFour { position: absolute; top: -18px; right: 20%; } .bk3-top { width: 25px; height: 25px; border-radius: 50%; background-color: #fff; border-radius: 0 25px 0 0; transform: rotate(90deg); border-top: 1px solid #7acab4; border-right: 1px solid #7acab4; position: absolute; top: -2px; left: -2px; /* 旋转形成扇形 */ } .bk3-top-right { width: 25px; height: 25px; border-radius: 50%; background-color: #fff; border-radius: 0 25px 0 0; transform: rotate(180deg); border-top: 1px solid #7acab4; border-right: 1px solid #7acab4; position: absolute; top: -2px; right: -2px; /* 旋转形成扇形 */ } .bk3-bottom { width: 25px; height: 25px; border-radius: 50%; background-color: #fff; border-radius: 0 25px 0 0; transform: rotate(360deg); border-top: 1px solid #7acab4; border-right: 1px solid #7acab4; position: absolute; bottom: -5.5px; left: -2px; /* 旋转形成扇形 */ } .bk3-bottom-right { width: 25px; height: 25px; border-radius: 50%; background-color: #fff; border-radius: 0 25px 0 0; transform: rotate(270deg); border-top: 1px solid #7acab4; border-right: 1px solid #7acab4; position: absolute; bottom: -5.5px; right: -2px; /* 旋转形成扇形 */ } h1.firstTitle { padding: 0% 0 10% 0; text-align: center; font-size: 2em; line-height: 1.2em; text-indent: 0em; color: #b0ddcf; font-weight: 400; font-family: "方正正黑"; } .preface { font-family: "汉仪特细等线"; text-indent: 2em; color: #000; } .right-info { font-family: "kaiti"; text-align: right; margin-bottom: 0.5em; } .imgdescript-l { margin-left: -5%; } .titleQuot-l { text-indent: 0em; margin: 15px 0 10px 0; font-size: 1.2em; font-weight: bold; } .poemtitle-l { font-family: "方正兰亭纤细"; font-size: 1.1em; margin: 15px 0 10px 0; font-weight: bold; } .quotation { font-family: "汉仪楷体", "ETrump KaiTi", "方正仿宋", "FZFSJW--GB1-0"; font-size: 0.95em; text-align: left; text-indent: 2em; margin: 0.1em auto; color: #5A5A5A; line-height: 30px; } .titleQuot-1 { font-family: "方正书宋"; color: #7acab4; font-size: 1.1em; } /*底色*/ .bgColor { padding: 10px 20px; background: #e1f4fc; border: 2px solid #008cb7; border-radius: 10px; margin: 1em auto; .bgColor-title { font-family: "方正细圆"; font-weight: bold; } } // 拓展学习 .ExpandLearning { padding: 40px 20px 20px 20px; background: #e1f4fc; border-top: 2px solid #008cb7; margin: 1em auto; position: relative; } .ExpandLearning-title { text-indent: 0; position: absolute; top: -16px; left: 0px; span { background-color: #e1f4fc; height: 20px; width: 30px; padding: 5px; border: 1px solid #008cb7; border-radius: 50%; margin-right: 1px; } } .imgdescript { color: #7acab4; font-size: 13px; text-indent: 0em; text-align: center; } .imgdescript-title { color: #7acab4; font-size: 15px; text-indent: 0em; text-align: center; } .learningDetection { font-family: "汉仪正黑"; background-color: #6bcff6; font-weight: bold; margin: 30px 0 20px 0; } .poemtitle { text-align: center; font-weight: bold; font-family: "方正兰亭细黑"; } .bold { // color: #b0ddcf; font-weight: bold; font-family: "方正书宋"; } .noteContent { font-size: 13.5px; word-break: break-all; margin: 0 !important; line-height: 25px; .noteContent-title { font-size: 13.5px; font-weight: bold; margin: 0 !important; } } sup { cursor: pointer; } } .dialogQuestion { background-color: #7ed0aa; height: 80px; width: 100%; display: flex; align-items: center; justify-content: space-between; cursor: pointer; span { color: #fff; font-size: 16px; padding: 0 40px 0 20px; } } .pdfModal { width: 100%; height: 90vh; .pdfBox-component { width: 100%; height: 100%; position: relative; .preview { width: 100%; height: 100%; .imageBox { height: calc(100% - 30px); overflow-x: hidden; overflow-y: auto; background: #ccc; box-sizing: border-box; } .imageBox:hover { cursor: zoom-in !important; } ::v-deep .el-dialog__header { background-color: rgba(0, 0, 0, 0.8); .header_title { display: flex; justify-content: space-between; align-items: center; color: #fff; font-weight: 900; font-size: 16px; font-family: 'FZLTXIHJW'; span:nth-child(2):hover { cursor: pointer; } } ::v-deep .el-dialog__title, ::v-deep .el-dialog__headerbtn .el-dialog__close { color: #fff; font-weight: 900; font-size: 16px; font-family: 'FZLTXIHJW'; } } .bottom_tool { height: 30px; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: flex-end; align-items: center; svg { margin-right: 15px; fill: #d1d1d1; } svg:hover { fill: #fff; cursor: pointer; } } } .notBox { position: absolute; top: 0; left: 0; width: 100%; height: calc(100% - 30px); min-height: 300px; } } } .custom-dialog { overflow: hidden !important; .el-dialog__body { padding: 0; } .el-dialog__header { background-color: rgba(0, 0, 0, 0.8); .header_title { display: flex; justify-content: space-between; align-items: center; color: #fff; font-weight: 900; font-size: 16px; font-family: 'FZLTXIHJW'; span:nth-child(2):hover { cursor: pointer; } } .el-dialog__title, .el-dialog__headerbtn .el-dialog__close { color: #fff; font-weight: 900; font-size: 16px; font-family: 'FZLTXIHJW'; } } } .examination { height: calc(100% - 50px); overflow-x: hidden; overflow-y: auto; box-sizing: border-box; } .header_title { display: flex; justify-content: space-between; align-items: center; // color: #fff; font-weight: 900; font-size: 16px; font-family: 'FZLTXIHJW'; span:nth-child(2):hover { cursor: pointer; } } // 表格样式 table { border-collapse: collapse; //表格的边框合并，如果相邻，则共用一个边框。 border-spacing: 0px; //设置行与单元格边框的间距。 } @font-face { font-family: '汉仪特细等线'; src: url('./Fonts/hyg6gjm.ttf'); } @font-face { font-family: '方正新报宋'; src: url('./Fonts/FZNBSK.TTF'); } // @font-face { // font-family: '汉仪书宋'; // src: url('./Fonts/hya1gjm.ttf'); // } // @font-face { // font-family: '汉仪楷体'; // src: url('./Fonts/hyc1gjm.ttf'); // } // @font-face { // font-family: '方正书宋'; // src: url('./Fonts/FZSSK.TTF'); // } // @font-face { // font-family: '方正正黑'; // src: url('./Fonts/FZZHJW.TTF'); // } // @font-face { // font-family: '方正细圆'; // src: url('./Fonts/FZY1JW.TTF'); // } // @font-face { // font-family: '方正兰亭纤细'; // src: url('./Fonts/FZLTXHK.TTF'); // } // @font-face { // font-family: 'FZLTXIHJW'; // src: url('./Fonts/FZLTXIHJW.ttf'); // } // @font-face { // font-family: 'FZHTJW'; // src: url('./Fonts/FZHTJW.ttf'); // } // 隐藏页面 .hidePage { min-height: 0 !important; height: 0 !important; box-shadow: none !important; } /* 媒体查询做基础响应式布局 */ @media screen and (max-width: 1024px) { .pdfModal { width: 100%; height: 80vh; } .custom-dialog { .el-dialog { width: 90vw !important; } } } @media screen and (max-width: 800px) { .pdfModal { width: 100%; height: 60vh; } .custom-dialog { .el-dialog { width: 90vw !important; } } } @media (max-width: 660px) { .toddlerSportsSafetyProtection { .pad-l-80 { padding-left: 10px; } .mr-70 { margin-right: 15px; } /* 分页padding */ .padding-93 { padding: 0 20px; } .padding-102 { padding: 0 20px; } .img-float { width: 130px; } .img-rights { width: 130px; } .btn-w { width: 42px; } .unitText { color: #5192C6; font-size: 10px; } .unit2Text { color: #F89C1C; font-size: 10px; } .wh-no { white-space: wrap; } td { padding: 5px 10px; } } } @media (min-width: 660px) { .toddlerSportsSafetyProtection { .padding-93 { padding: 0 93px 0px 93px; } .padding-102 { padding: 0 102px 0 102px; } } } ::-webkit-scrollbar { width: 8px; height: 10px; } ::-webkit-scrollbar-track-piece { background-color: rgba(0, 0, 0, 0.1); -webkit-border-radius: 6px; } ::-webkit-scrollbar-thumb:vertical { height: 5px; background-color: rgba(125, 125, 125, 0.3); -webkit-border-radius: 6px; } ::-webkit-scrollbar-thumb:horizontal { width: 5px; background-color: rgba(125, 125, 125, 0.3); -webkit-border-radius: 6px; } src/books/textToddlerSportsSafetyProtection/view/components/chapter001.vue
New file @@ -0,0 +1,247 @@ <template> <div class="chapter" num="1"> <!-- 1页 --> <div class="page-box" page="10"> <div v-if="showPageList.indexOf(10) > -1"> <div class="UnitCover"> <h1 class="seriesTitle">第一章 </h1> <h1 class="seriesTitle mb-20">婴幼儿运动安全与保护概述 </h1> <p class="rotate-up">^</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down mb-20">v</p> <p class="content"> <img class="g-pic" src="../../assets/images/0013_01.jpg" alt="" /> </p> <p class="quotation">1．理解婴幼儿运动安全与保护的意义。</p> <p class="quotation">2．掌握婴幼儿运动安全与保护的目标与内容。</p> <p class="quotation">3．理解婴幼儿运动风险的影响因素。</p> <p class="content"> <img class="g-pic" src="../../assets/images/0013_02.jpg" alt="" /> </p> <div class="bodyPic openImgBox"> <img src="../../assets/images/0013-03.jpg" style="width: 100%" alt="" active="true" /> </div> <p class="content"> <img class="g-pic" src="../../assets/images/0013_04.jpg" alt="" /> </p> <p class="quotation"> 每到户外活动时间，某幼儿园教师不愿意组织幼儿进行户外运动，认为幼儿在运动时，判断危险和自我保护能力都较弱，容易发生运动伤害。园长以及家长也非常关注幼儿的安全，担心幼儿在运动中如果出现意外伤害不能及时处理，会造成不必要的麻烦。因此能不出去就不出去，能少活动就少活动，抱着多动多危险、少动少危险、不动不危险的心态。 </p> <p class="content"> 这种现象存在于不少幼教机构。教师不能正确理解婴幼儿运动与婴幼儿成长的关系，不能正确理解婴幼儿运动安全与保护的意义以及影响因素，本章将重点讨论这些内容。 </p> </div> </div> </div> <!-- 2页 --> <div class="page-box" page="11"> <div v-if="showPageList.indexOf(11) > -1"> <div class="page-father"> <ul class="header-left"> <li class="headerText"> 婴<br />幼<br />儿<br />运<br />动<br />安<br />全<br />与<br />保<br />护 </li> <li class="headerNumber">2</li> <img src="../../assets/images/a1.jpg" alt="" /> </ul> <div class="bodystyle"> </div> </div> </div> </div> <!-- 3页 --> <div class="page-box" page="12"> <div v-if="showPageList.indexOf(12) > -1"> <div class="page-father"> <div class="bodystyle-left"> </div> <ul class="header-right"> <li class="header-right-img"> <img src="../../assets/images/a2.jpg" alt="" /> </li> <img class="header-right-imgTop" src="../../assets/images/a3.jpg" alt="" /> <li class="header-right-Number">3</li> <li class="header-right-Text"> 第<br />一<br />章 </li> <li class="header-right-Text-bottom"> 婴<br />幼<br />儿<br />运<br />动<br />安<br />全<br />与<br />保<br />护 </li> </ul> </div> </div> </div> </div> </template> <script> import { getResourcePath } from "@/assets/methods/resources"; import { getCollectResource, setCollectResource, } from "@/assets/methods/resources"; import preView from "@/components/pdfview/index.vue"; export default { name: "chapterOne", props: { showPageList: { type: Array, }, }, components: { preView, }, data() { return { dialogVisible: false, pdfDialogRef: "", somePdfTitleValue: "", p_md5: "", collectResourceList: [], chapter001: { pdfMd5: { 1: { md5: "6a7118abdc38a24995f26c164d63648c", name: "拓展学习：从罗恩菲尔德的艺术教育思想", }, 2: { md5: "cfac1cfc4b845032d35937a0f6f201e1", name: "拓展学习：快乐童谣，帮助宝宝轻松学说话", }, }, }, collectImg: require("../../assets/images/icon/heart.png"), collectCheck: require("../../assets/images/icon/heart-check.png"), videoPathOne: "", audioPathOne: "", chapterData: { isCollectVideoOne: false, }, videoQuestionData: { one: "", }, }; }, async mounted() { const videoData = localStorage.getItem( "artInitiationForAges0to3-book-chapter001-video" ); if (videoData) { this.chapterData = JSON.parse(videoData); } const videoQuestionData = localStorage.getItem( "artInitiationForAges0to3-book-chapter001-videoQuestionData" ); if (videoQuestionData) { this.videoQuestionData = JSON.parse(videoQuestionData); } this.getVidoePath(); this.collectResourceList = await getCollectResource( this.config.activeBook.bookId ); }, methods: { async getVidoePath() { this.audioPathOne = await getResourcePath( "c19b26c585aecc086a286aa0829c9e3b" ); this.videoPathOne = await getResourcePath( "afebf048dd2bf2cb09004976ea818dc4" ); }, toUrl(val) { if (val) { this.p_md5 = this.chapter001.pdfMd5[val].md5; this.somePdfTitleValue = this.chapter001.pdfMd5[val].name; this.$refs.pdfDialogRef.openDialog(); } }, handleCollect(e) { if (e == "video-01") { this.handleCollectResource( "afebf048dd2bf2cb09004976ea818dc4", "afebf048dd2bf2cb09004976ea818dc4", "", "视频", "bits", "活动视频：宝宝发现美" ); this.chapterData.isCollectVideoOne = !this.chapterData.isCollectVideoOne; } this.saveVideoStatus(); }, saveVideoStatus() { localStorage.setItem( "artInitiationForAges0to3-book-chapter001-video", JSON.stringify(this.chapterData) ); }, saveVideoQuestionData() { localStorage.setItem( "artInitiationForAges0to3-book-chapter001-videoQuestionData", JSON.stringify(this.videoQuestionData) ); }, //资源收藏事件 // resourcePath 文件路径， // resourceType 文件类型 // source 文件来源 handleCollectResource( id, md5, resourcePath, resourceType, source, resourceName ) { let list = this.collectResourceList; if (list.findIndex((item) => item.id == id) > -1) { list = list.filter((item) => item.id != id); } else { list.push({ id, md5, resourcePath, resourceType, source, resourceName, }); } this.collectResourceList = list; setCollectResource( this.config.activeBook.bookId, this.collectResourceList ); }, }, }; </script> <style lang="less" scoped> hr { margin-left: 0; margin-bottom: 25px; width: 25%; border: none; height: 1px; background-color: #000; } </style> src/books/textToddlerSportsSafetyProtection/view/components/chapter005.vue
New file @@ -0,0 +1,1506 @@ <template> <div class="chapter" num="5"> <!-- 154页 --> <div class="page-box special-box mb-20" page="163"> <div v-if="showPageList.indexOf(163) > -1"> <div class="special-bodystyle"> <div class="seriesTitle"> <span style="margin-right: 0px;">第五章</span> </div> <br /> <div class="seriesTitle mb-20"> <span style="margin-right: 70px;">婴幼儿常见运动伤害的处理与急救</span> </div> <p class="rotate-up">^</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down mb-20">v</p> <p class="content td-0"> <img class="g-pic" src="../../assets/images/0013_01.jpg" alt="" /> </p> <p class="quotation">1．理解运动伤害处理的原则。</p> <p class="quotation">2．掌握运动伤害的判断与处理方法。</p> <p class="content td-0"> <img class="g-pic" src="../../assets/images/0013_02.jpg" alt="" /> </p> <div class="bodyPic openImgBox"> <img src="../../assets/images/0013-03.jpg" style="width: 100%" alt="" active="true" /> </div> <p class="content td-0"> <img class="g-pic" src="../../assets/images/0013_04.jpg" alt="" /> </p> <p class="quotation"> 在户外活动时，幼儿依次进行助跑跨跳活动。只见圆圆小朋友摔倒了，教师过去询问、查看，圆圆说：“没事，没事。”教师听到圆圆这么说，就组织大家继续活动。教师发现圆圆在活动中动作没有那么自然，走路很别扭。于是教师把圆圆带到保健室进一步观察，发现圆圆的右脚肿了起来。在保健室做了简单处理后，圆圆被送去医院就诊。 </p> <p class="quotation"> 婴幼儿身体的各个器官、系统处于不断发育的过程，机能不够完善，易受损伤、易感染疾病。遇到婴幼儿受伤情况教师往往害怕、不知所措。如果教师正确理解并掌握了运动损伤的判断与处理方法就能够减少婴幼儿的痛苦，并能及时给予救治，避免更大的伤害。 </p> </div> </div> </div> <!-- 155页 --> <div class="page-box special-box" page="164"> <div v-if="showPageList.indexOf(164) > -1"> <div class="special-bodystyle"> <div class="page-header"> 155 </div> <h2 class="secondsubHead-2">第一节 运动伤害处理的概述</h2> <p class="titleQuot-1">一、运动伤害急救的原则</p> <p class="content"> 急救是对意外或突然发生的伤病事故进行紧急的临时性处理。其目的是保护伤病者的生命安全，避免再度伤害，减轻伤病者痛苦，预防并发症，并为伤病者的转运和进一步治疗创造条件。因此，无论何种急性损伤，做好现场急救都是十分重要的。 </p> <p class="content"> 急救时必须抓住主要矛盾，救命在先，做好休克的防治。骨折、关节脱位、严重软组织损伤或其他器官损伤时，伤者常因出血、疼痛而发生休克。在现场急救时，首先要注意预防休克，若发生休克，必须优先抢救休克。其次，急救必须分秒必争，力求迅速、准确、有效，做到快救、快送医院处理。 </p> <p class="content"> 为了更好地完成这一任务，还必须遵守以下六条原则。 </p> <p class="content"> 1．先复后固的原则：是指遇有心跳呼吸骤停又有骨折者，应首先用口对口呼吸和胸外按压等技术使心肺复苏，直到心跳呼吸恢复后，再进行固定骨折的原则。 </p> <p class="content"> 2．先止后包的原则：是指遇到大出血又有伤口者，首先立即用指压、止血带或药物等方法止血，接着再消毒伤口进行包扎的原则。 </p> <p class="content"> 3．先重后轻的原则：是指遇到垂危的和较轻的伤者时，优先抢救危重者，后抢救较轻的伤者的原则。 </p> <p class="content"> 4．先救后送的原则：过去遇到伤者，多数是先送后救，这样常贻误了抢救时机，致使不应死亡者丧失了性命。应颠倒过来，先救后送。在送伤者到医院途中，不要停顿抢救措施，应继续观察伤病变化，少颠簸，注意保暖，平安到达目的地。 </p> <p class="content"> 5．急救与呼救并重的原则：在遇到成批伤者时，又有多人在场的情况下，应较快地争取到急救外援。 </p> <p class="content"> 6．搬运与医护的一致原则：在许多情况下，协调配合不好，途中应该继续抢救却没有得到保障，加之车辆严重颠簸等情况，结果增加了伤者不应有的痛苦和死亡。医护和抢救应在任务要求一致、协调一致、完成任务一致的情况下进行，在运送危重伤者时，就能减少痛苦，减少死亡，安全到达目的地。 </p> <p class="titleQuot-1">二、运动伤害的判断与处理流程</p> <p class="content"> 运动伤害事件出现后正确的判断和处理流程对救护的效果起着决定性作用。幼教机构和家长应熟悉正确的处理流程，为应对紧急情况做好准备。幼教机构应提前制订运动伤害事件紧急处理程序预案。预案里应包括不同运动伤害事件的类型、疏散、急救常识和处理流程等。在出现运动伤害事件后可以按照以下流程处理。 </p> </div> </div> </div> <!-- 156页 --> <div class="page-box special-box mb-20" page="165"> <div v-if="showPageList.indexOf(165) > -1"> <div class="special-bodystyle"> <div class="page-header"> 156 </div> <p class="content"> 第一步：患儿制动，停止运动，评估环境，确保安全。观察现场环境是否存在危险，对异常情况做出初步的快速判断，确保施救过程中的安全。施救过程中要保持冷静，安抚患儿情绪，帮助他们消除恐惧；同时不指责、责怪伤害者，避免其心理负担。 </p> <p class="content"> 第二步：检查病情，初步处理。迅速判断患儿的意识、呼吸、脉搏、知觉、瞳孔反应等，时刻注意患儿的反应和需求。程度轻的，先做简单处理；若出现丧失意识、停止呼吸或濒死呼吸、脉搏消失时，应立即采取心肺复苏。 </p> <p class="content"> 第三步：紧急呼救，寻求帮助。对现场病情初步检查后，如果情况严重应立即拨打急救电话呼救，或招呼周围人帮忙拨打医疗急救电话，要清晰地提供所有重要信息。同时可寻求周围人帮助，参与急救措施，维持现场秩序，疏散围观人群，保护患儿隐私。 </p> <p class="content"> 第四步：进一步检查和处置。在救护车到达前，可就地取材，或尽其所能实施救治。对无意识但有呼吸的患儿可置于复原卧位（侧卧位），对伤口进行止血等措施。 </p> <p class="content"> 第五步：如运动伤害事件发生在幼教机构，应及时通报家长，与家长及时沟通，及时做好家长的安抚工作。诚恳、客观、坦诚、详细地说明事件过程，以获取家长的理解，同时换位思考，体谅家长的心情感受，及时调整与家长的沟通策略。 </p> <p class="content"> 第六步：及时形成书面报告，事故报告。幼教机构要认真、全面分析事件发生原因，分清责任，从中获取经验和教训，从而反思安全管理漏洞，加强安全管理，避免此类事件的再次发生。 </p> <p class="titleQuot-1">小贴士</p> <div class="tipes"> <p class="content"> 根据婴幼儿身体发展年龄特点，设计趣味性活动，合理安排训练内容和时长，提高婴幼儿的专注程度，充分做好热身和整理活动。 </p> <p class="content"> 运动太多和太少，同样损伤体力；饮食过多与过少，同样损害健康；唯有适度才可以增强体力和保持健康。 </p> <p class="content"> 自我保护意识是预防受伤的重要保证。要引导幼儿充分了解损伤带来的后果，使其在进行体育活动和日常生活时集中注意力以正确完成运动，必要时佩戴适当的护具以预防骨折等损伤的发生。思想上的高度重视，可以有效减少运动伤害的发生。 </p> </div> </div> </div> </div> <!-- 157页 --> <div class="page-box special-box" page="166"> <div v-if="showPageList.indexOf(166) > -1"> <div class="special-bodystyle"> <div class="page-header"> 157 </div> <h2 class="secondsubHead-2"> 第二节 常见的运动伤害类型的处理与急救 </h2> <p class="titleQuot-1">一、软组织的处理与急救</p> <p class="poemtitle-l">（一）闭合性软组织损伤</p> <div class="img-float w115 openImgBox"> <img src="../../assets/images/0169-01.jpg" style="width: 100%" alt="" active="true" /> <p class="imgdescript">图5-1 钝挫伤</p> </div> <span> <p class="content ma-0"> 局部皮肤或黏膜完好，无裂口与外界相通，损伤时的出血积聚在组织内，称为闭合性软组织损伤。常见的闭合性软组织包括：肌肉、肌腱、筋膜、韧带和关节囊的拉伤、扭伤、钝挫伤。婴幼儿运动损伤中，膝关节、踝关节损伤最为常见，由于膝、踝 </p> </span> <div class="img-rights w250 openImgBox"> <img src="../../assets/images/0169-02.jpg" style="width: 100%" alt="" active="true" /> <p class="imgdescript">图5-2 踝关节扭伤</p> </div> <span> <p class="content td-0 mb-30"> 关节结构复杂，损伤后患儿一般会出现疼痛、肿胀、损伤部位活动受限，甚至损伤部位出现畸形等症状，给患儿身体造成很大的伤害（见图5-1、图5-2）。 </p> </span> <p class="content td-0"> <img class="img-h" src="../../assets/images/0015_01.jpg" alt="" /> </p> <p class="imgdescript-title"> 急性运动伤害遵循PRICE原则（见图5-3） </p> <div class="img-rights w210 openImgBox`"> <img src="../../assets/images/0169-03.jpg" style="width: 100%" alt="" active="true" /> <p class="imgdescript">图5-3 PRICE原则</p> </div> <span> <p class="quotation"> 1．保护（Protection）：停止运动，避免受伤的肢体再次受伤。 </p> <p class="quotation"> 2．休息（Rest）：受伤部位休息24～48小时不要活动。 </p> <p class="quotation"> 3．冰敷（Ice）：冷敷，受伤区域可用冰块或冰袋，皮肤与冰块之间可隔一毛巾，每次敷15分钟以免冻伤，或用毛巾浸湿冷水，稍挤出过多的水，折叠成块状敷于伤处20～30分钟，每天6～8次。若有专用冷冻镇痛喷雾剂也可直接喷于伤处，形成一薄层液体即可。48小时内以冰敷为主，不做热敷和揉捏治疗。 </p> <p class="quotation"> 4．压迫（Compression）：可用布带、布条、毛巾或绷带稍用力加压包扎受伤处，不要太紧，以免导致神经受压和血液回流障碍。 </p> <p class="quotation"> 5．抬高（Elevation）：无论是坐着还是躺着，都应将受伤区域置于枕上抬高，增加伤处的血液回流减轻肿胀，一般需要受伤肢体高于心脏平面。 </p> </span> </div> </div> </div> <!-- 158页 --> <div class="page-box special-box" page="167"> <div v-if="showPageList.indexOf(167) > -1"> <div class="special-bodystyle"> <div class="page-header"> 158 </div> <p class="content"> 受伤后应首先让婴幼儿停止活动，安静休息，减轻痛苦，并防止损伤继续加重。冰敷使血管收缩，减少伤处的血液渗出及疼痛，伤后能否立即使用冰敷将直接影响后期功能恢复的快慢。冰袋置于受伤部位，受伤后48小时内，每隔2～3小时冰敷15～20分钟。在冰敷的同时，可以用弹力绷带或其他胶带等包扎固定冰袋。这样，冰敷和加压包扎两个目的同时达到，非常实用。建议从伤处远端开始往近心端包，大约以一半做叠瓦重叠，稍微加压，伤处则较松些。露出脚趾或手指以观察颜色，如皮肤变色、麻木、刺痛等症状出现，表示包太紧，应及时解开弹性绷带重包，用弹性绷带包扎24～48小时，中间可解开适当放松。把患肢放置于稍高于心脏的位置，且尽可能在伤后一周内，都抬高患肢。这个简单的措施可以有效地改善静脉回流以促进消肿、减轻患肢胀痛不适。 </p> <p class="content"> 近年来，国外学者提出适当负重（Optimal Loading）概念，即让肌肉不能因为受伤而“休息”，48小时后，可让患肢适当着地负重，开始早期活动，而不是一味躺着休息。早期适当负重，尽早开始活动，可使患儿尽快恢复功能，尽早回归正常生活。 </p> <p class="content"> 挫伤、瘀青、轻度肌肉拉伤、韧带扭伤，经由上面几种方式处理，以及适当的方法治疗，都能够在短时间内恢复健康。严重的肌肉拉伤（断裂）、韧带扭伤（断裂）、骨折，则必须由专科医师手术治疗。 </p> <p class="content td-0 mt-20"> <img class="img-h" src="../../assets/images/0015_01.jpg" alt="" /> </p> <p class="quotation fm-kt"> 1．冰块不能直接放于患儿损伤部位，可用毛巾包裹冰块再处理；没有冰块时可用冷毛巾代替。 </p> <p class="quotation fm-kt">2．抬高患肢前要注意检查是否骨折等。</p> <p class="quotation fm-kt"> 3．冰敷还是热敷？一般热敷可以刺激血液流动，放松肌肉，总体上能产生镇静的作用，从而促进治疗。但是受伤后立刻热敷会使肿胀更严重、增强疼痛感、延缓伤口愈合过程。所以受伤处理方式是先冰敷，48小时后肿胀和疼痛感减轻后，再使用热敷的方法。 </p> <p class="poemtitle-l">（二）开放性软组织损伤</p> <div class="img-rights w200 openImgBox"> <img src="../../assets/images/0170-01.jpg" style="width: 100%" alt="" active="true" /> <p class="imgdescript">图5-4 擦伤</p> </div> <span> <p class="content"> 在婴幼儿运动过程中，常见的开放性软组织损伤包括皮肤擦伤、裂伤、切割伤、刺伤。通常局部皮肤或黏膜破损，伤口与外界相通，常有组织液渗出或血液从创口流出，称为开放性软组织损伤。这些损伤的共同特点就是有伤口和出血。其中擦伤是身体表面与粗糙物相互摩擦造成的皮肤组织损伤（见图5-4）。 </p> </span> </div> </div> </div> <!-- 159页 --> <div class="page-box special-box" page="168"> <div v-if="showPageList.indexOf(168) > -1"> <div class="special-bodystyle"> <div class="page-header"> 159 </div> <p class="content"> 一般的表皮擦伤后，可涂碘伏消毒，避免使用龙胆紫和红汞，以免色素沉积。若伤口有泥沙，用双氧水或清水冲洗，而后涂抹碘伏或酒精，注意面部不用碘伏涂抹，酒精涂抹时会产生疼痛刺激。 </p> <p class="content"> 稍大或稍深的伤口，包扎前伤口可先用碘伏或酒精沿伤口边缘由内向外涂擦，要避免消毒液滴入伤口内。若伤口内可见异物如钉子、玻璃碎片则要慎重处理，大而表浅的容易取出的异物可以取出，小而深且不易取出的则不硬性取出，以免造成大血管及神经损伤，增加出血或增加伤口再感染的机会，应立刻送医院治疗。对于造成皮肤及软组织出血的，正确包扎可使伤口流血减少，感染机会减少，疼痛减轻。包扎时动作要轻柔敏捷、部位准确，包扎松紧适当。 </p> <p class="content ma-0 td-0"> <img class="img-h" src="../../assets/images/0015_01.jpg" alt="" /> </p> <p class="quotation mb-20"> 医用酒精浓度为75%，主要用于消毒、杀菌。轻度擦伤时应进行伤口表面消毒，并注意保持伤口卫生，严重时应结合抗菌药物，甚至注射破伤风抗毒素。 </p> <div class="img-rights w250 openImgBox mt-20"> <img src="../../assets/images/0171-01.jpg" style="width: 100%" alt="" active="true" /> <p class="imgdescript">图5-5 外伤出血分类示意图</p> </div> <span> <p class="titleQuot-1">二、出血的处理与急救</p> <p class="content"> 婴幼儿在生活中和运动时，经常会出现出血的情况，小到划破、擦伤，大到撞伤、刀伤，如果不及时加以处理，很有可能会引起更严重的后果。由于运动外伤引起的大出血，如不及时予以止血与包扎，会严重地威胁婴幼儿的健康，乃至生命安全。 </p> <p class="content"> 外伤出血可分为毛细血管出血、静脉出血和动脉出血（见图5-5）。 </p> <p class="content"> 毛细血管出血：出血时，血液呈水珠样流出，多能自动凝固止血。通常用碘伏或酒精消毒伤口周围皮肤后，以消毒纱布和棉垫盖在伤口上缠以绷带，即可止血。 </p> <p class="content"> 静脉出血：出血时缓缓不断地外流，呈紫红色。如大静脉出血，往往受呼吸运动的影响，吸气时流出较缓，呼气时流出较快。如不是大静脉出血，止血方法与毛细血管类似，消毒后，用消毒纱布和棉垫覆盖，稍加压力缠敷绷带。 </p> <p class="content"> 动脉出血：由于动脉血管内压力较高，所以出血时呈泉涌、搏动性，尤其是大的动脉血管破裂，血液呈喷射状，颜色鲜红，常在短时内造成大量失血，易引起生命危险。 </p> </span> </div> </div> </div> <!-- 160页 --> <div class="page-box special-box" page="169"> <div v-if="showPageList.indexOf(169) > -1"> <div class="special-bodystyle"> <div class="page-header"> 160 </div> <p class="poemtitle-l">（一）止血方法</p> <div class="video-box"> <p class="center text td-0"> <video :src="videoPathOne" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true" x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls controlslist="nodownload" class="w100 video" style="border-radius: 10px"></video> </p> <p class="center videoname"> <span>视频：婴幼儿出血处理</span> <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideoOne ? '点击取消' : '点击收藏' " placement="top-start"> <img :src="collectResourceList.findIndex( (item) => item.id == '758EFE380803FE03E335BBBE8204F0BC' ) > -1 ? collectCheck : collectImg " alt="" class="collect-btn" @click="handleCollect('video-01')" /> </el-tooltip> </p> </div> <p class="content">1．指压止血法</p> <p class="content"> 在伤口的上方，即近心端，找到跳动的血管，用手指紧紧压住。在不能使用止血带的部位，在身边没有器材或紧急情况下，可暂用指压止血法。此法为紧急的临时止血法，与此同时，应准备材料换用其他止血方法。采用此法，救护人必须熟悉各部位血管出血的压迫点。 </p> <p class="content">各压迫点如下：</p> <p class="content"> （1）面部出血：用拇指压迫下颌角与颏结节之间的面动脉，用于腮部及颜面部出血（见图5-6）。 </p> <p class="content"> （2）头顶及头前部出血：压迫耳前下颌关节上方的颞浅动脉（太阳穴附近）（见图5-7）。 </p> <p class="content"> （3）头后部出血：压住耳后突起下面稍外侧的耳后动脉（见图5-8）。 </p> <div class="fl al-c openImgBox"> <div class="tl-c"> <img src="../../assets/images/0172-02.jpg" style="width: 70%" alt="" active="true" /> <p class="imgdescript">图5-6 面动脉止血</p> </div> <div class="tl-c"> <img src="../../assets/images/0172-03.jpg" style="width: 70%" alt="" active="true" /> <p class="imgdescript">图5-7 颞浅动脉止血</p> </div> <div class="tl-c"> <img src="../../assets/images/0172-04.jpg" style="width: 70%" alt="" active="true" /> <p class="imgdescript">图5-8 耳后动脉止血</p> </div> </div> <p class="content"> （4）腋窝和肩部出血：在锁骨上凹，胸锁乳突肌外缘向下内后方，对准第一肋骨，压住锁骨下动脉（见图5-9）。 </p> <p class="content"> （5）前臂出血：将上肢外展外旋，屈肘抬高上肢，在上臂肱二头肌内侧沟处，施以压力，将肱动脉压于肱骨上（测血压的地方）（见图5-10）。 </p> <p class="content"> （6）手掌和手背出血：在腕关节内，腕横纹上方，按到跳动的尺桡动脉血管压住，即我们通常摸脉搏的地方（见图5-11）。 </p> <p class="content"> （7）手指出血：用健侧的手指，使劲捏住伤手的手指根部，即可止血（见图5-12）。 </p> <p class="content"> （8）大腿出血：屈曲大腿，使肌肉放松，用大拇指压住股动脉搏动点（大腿根部的腹股沟中点），用力向后压，为增强压力，另一手的拇指可重叠压力（见图5-13）。 </p> </div> </div> </div> <!-- 161页 --> <div class="page-box special-box" page="170"> <div v-if="showPageList.indexOf(170) > -1"> <div class="special-bodystyle"> <div class="page-header"> 161 </div> <p class="content"> （9）足部出血：用两手食指或拇指分别压迫足背中间近脚腕处（足背动脉）和足跟内侧与内踝之间（胫后动脉）止血（见图5-14）。 </p> <div class="fl al-c openImgBox mb-20"> <div class="tl-c"> <img src="../../assets/images/0173-01.jpg" style="width: 70%" alt="" active="true" /> <p class="imgdescript">图5-9 锁骨下动脉止血</p> </div> <div class="tl-c"> <img src="../../assets/images/0173-02.jpg" style="width: 70%" alt="" active="true" /> <p class="imgdescript">图5-10 肱动脉止血</p> </div> <div class="tl-c"> <img src="../../assets/images/0173-03.jpg" style="width: 70%" alt="" active="true" /> <p class="imgdescript">图5-11 尺桡动脉止血</p> </div> </div> <div class="fl al-fe openImgBox"> <div class="tl-c"> <img src="../../assets/images/0173-04.jpg" style="width: 70%" alt="" active="true" /> <p class="imgdescript">图5-12 手指止血</p> </div> <div class="tl-c"> <img src="../../assets/images/0173-05.jpg" style="width: 70%" alt="" active="true" /> <p class="imgdescript">图5-13 股动脉止血</p> </div> <div class="tl-c"> <img src="../../assets/images/0173-06.jpg" style="width: 70%" alt="" active="true" /> <p class="imgdescript">图5-14 足部止血</p> </div> </div> <p class="content">2．加压包扎止血法</p> <p class="content"> 用消毒的纱布、棉花做成软垫放在伤口上，再用力加以包扎，以增大压力达到止血的目的。此法应用普遍，效果也佳。 </p> <p class="content">3．直接压迫止血法</p> <p class="content"> 主要用于小动脉、静脉、毛细血管的出血。将伤口用无菌纱布、清洁的毛巾、衣物或手帕覆盖后，用手指或手掌直接用力压迫5～10分钟，出血往往可以停止，然后再选用加压包扎止血法。 </p> <p class="content">4．填塞止血法</p> <p class="content"> 用于腹股沟、腋窝、鼻腔出血或一些大而深的伤口。应先用无菌纱布或洁净的布料填塞伤口，再选用加压包扎止血法。 </p> </div> </div> </div> <!-- 162页 --> <div class="page-box special-box" page="171"> <div v-if="showPageList.indexOf(171) > -1"> <div class="special-bodystyle"> <div class="page-header"> 162 </div> <p class="content">5．止血带止血法</p> <p class="content"> 此法是用于四肢大动脉破裂大出血时的重要救命方法，当其他止血方法不能止血时可用此方法。使用止血带时，应先用三角巾、毛巾等平整地垫在伤口处，再结扎止血带。结扎止血带的部位应在伤口近端，上肢结扎在上臂的上1/3段，不要结扎在中1/3段（以防损伤桡神经），下肢结扎在大腿中段。止血带以橡皮带、布带为宜，禁用无弹性的铁丝、电线、绳子等，止血带的松紧以停止出血或远端动脉搏动消失为度。结扎止血带的时间不宜超过3小时，应每隔40～50分钟松解5～10分钟，以暂时恢复远端肢体的供血。如此时仍有出血，应用指压止血法。松解两三分钟后，应在比原结扎部位稍低的位置重新结扎止血带。 </p> <p class="titleQuot-1">三、骨折的处理与急救</p> <p class="content"> 婴幼儿活泼好动，运动过程中，难免出现躲避不及时或意外撞伤摔倒等情况，造成骨折。骨折分为闭合性骨折、开放性骨折和复杂性骨折，主要由直接暴力、间接暴力造成。病理征象有疼痛、肿胀及皮下淤血、功能丧失、畸形、压痛和震痛、假关节活动，经X线检查可见有骨折线等（见表5-1、图5-15、图5-16）。 </p> <p class="imgdescript">表5-1 婴幼儿常见骨折</p> <div class="bodyPic openImgBox"> <img src="../../assets/images/0174-01.jpg" style="width: 100%" alt="" active="true" /> </div> </div> </div> </div> <!-- 163页 --> <div class="page-box special-box" page="172"> <div v-if="showPageList.indexOf(172) > -1"> <div class="special-bodystyle"> <div class="page-header"> 163 </div> <div class="qrbodyPic openImgBox mt-20 tl-c"> <img src="../../assets/images/0175-02.jpg" style="width: 80%" alt="" active="true" /> <p class="imgdescript">图5-15 头面部位置图</p> </div> <p class="poemtitle-l">（一）处置流程</p> <p class="content"> 开放性骨折后需要立即用干净的衣物临时给予包扎，防止软组织、血管和神经进一步损伤，骨折外露的患儿要在保证生命体征稳定的前提下进行处理，止血要采用局部压迫止血。同时给予补充液体，保证生命体征的平稳，纠正休克及低血容量。可采用木板、木条、树枝等物体进行固定，防止骨折进一步移位，损伤局部的血管和神经，具体处置流程如下。 </p> </div> </div> </div> <!-- 164页 --> <div class="page-box special-box" page="173"> <div v-if="showPageList.indexOf(173) > -1"> <div class="special-bodystyle"> <div class="page-header"> 164 </div> <div class="qrbodyPic openImgBox tl-c"> <img src="../../assets/images/0176-01.jpg" style="width: 100%" alt="" active="true" /> <p class="imgdescript">图5-16 头面部骨骼</p> </div> <p class="content"> 1．固定：把患肢用木板、树枝、枪托或者使用夹板石膏进行简单的外固定，防止骨折断端在搬运过程中造成血管神经内脏新的损伤。 </p> <p class="content"> 2．止血：有伤口出血者要采用加压包扎，或者在肢体的近端用橡皮筋绑扎止血，防止出血过多引起失血性休克。 </p> <p class="content"> 3．抗休克：如果已经发生了失血性休克，要及时地输液补充血容量，抗休克治疗。 </p> <p class="content"> 4．平托搬运：脊柱骨折搬运患儿的过程中要采用三人平托搬运，防止脊髓损伤造成截瘫。 </p> <p class="content">5．安全护送至医院，尽快就医。</p> <p class="poemtitle-l">（二）固定方法</p> <p class="content"> 医院外急救骨折固定时，常常就地取材，如各种2～3厘米厚的木板、竹竿、竹片、树枝、木棍、硬纸板、枪托，以及患儿健（下）肢等，均可作为固定代用品。 </p> <p class="content"> 1．颈椎骨折固定：使患儿的头颈与躯干保持直线位置，将木板放置于头至臀下，用棉布、衣物等，将患儿颈、头两侧垫好，防止左右摆动；然后用绷带或布带将额部、肩和上胸、臀部固定于木板上，使之稳固（见图5-17）。 </p> </div> </div> </div> <!-- 165页 --> <div class="page-box special-box" page="174"> <div v-if="showPageList.indexOf(174) > -1"> <div class="special-bodystyle"> <div class="page-header"> 165 </div> <!-- 轮播图 --> <div class="imgBox-003 openImgBox"> <div class="swiper-container swiper-img"> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img src="../../assets/images/0174-1.jpg" /> <p class="img">图5-17 颈椎骨折固定</p> </div> </div> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img src="../../assets/images/0174-2.jpg" /> <p class="img">图5-17 颈椎骨折固定</p> </div> </div> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img src="../../assets/images/0174-3.jpg" /> <p class="img">图5-17 颈椎骨折固定</p> </div> </div> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img src="../../assets/images/0174-4.jpg" /> <p class="img">图5-17 颈椎骨折固定</p> </div> </div> </div> <div class="swiper-button-next"></div> <div class="swiper-button-prev"></div> </div> </div> <p class="content"> 2．锁骨骨折固定：用绷带在肩背做“8”字形固定，并用三角巾或宽布条系于颈部吊托前臂（见图5-18）。 </p> <!-- 轮播图 --> <div class="imgBox-003 openImgBox"> <div class="swiper-container swiper-img"> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img src="../../assets/images/0174-5.jpg" /> <p class="img">图5-18 锁骨骨折固定</p> </div> </div> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img src="../../assets/images/0174-6.jpg" /> <p class="img">图5-18 锁骨骨折固定</p> </div> </div> </div> <div class="swiper-button-next"></div> <div class="swiper-button-prev"></div> </div> </div> <div class="img-rights w150"> <img src="../../assets/images/0177-03.jpg" style="width: 100%" alt="" active="true" /> <p class="imgdescript">图5-19 肱骨骨折固定</p> </div> <span> <p class="content"> 3．肱骨骨折固定：用代用夹板2～3块固定患肢，并用三角巾、布条将其悬吊于颈部（见图5-19）。 </p> <p class="content"> 4．前臂骨折固定：选用两块木板，长度要超过肘关节，分别置于前臂的掌、背两侧，然后用布带或三角巾捆绑托起（见图5-20）。 </p> <p class="content"> 5．股骨骨折固定：选用长木板两块，将大腿小腿连同腰部齐平，一起固定。置于大腿前后长达腰部，并将踝关节一起固定，以防这两部位活动引起骨折错位（见图5-21、图5-22）。 </p> </span> </div> </div> </div> <!-- 166页 --> <div class="page-box special-box" page="175"> <div v-if="showPageList.indexOf(175) > -1"> <div class="special-bodystyle"> <div class="page-header"> 166 </div> <div class="fl al-fe openImgBox"> <div class="tl-c"> <img src="../../assets/images/0178-01.jpg" style="width: 50%" alt="" active="true" /> <p class="imgdescript">图5-20 前臂骨骨折固定</p> </div> <div class="tl-c"> <img src="../../assets/images/0178-02.jpg" style="width: 50%" alt="" active="true" /> <p class="imgdescript">图5-21 股骨骨折固定顺序</p> </div> </div> <!-- 轮播图 --> <div class="imgBox-003 openImgBox"> <div class="swiper-container swiper-img"> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img style="width: 60%" src="../../assets/images/0175-1.jpg" /> <p class="img">图5-22 股骨骨折固定</p> </div> </div> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img src="../../assets/images/0175-2.jpg" /> <p class="img">图5-22 股骨骨折固定</p> </div> </div> </div> <div class="swiper-button-next"></div> <div class="swiper-button-prev"></div> </div> </div> <p class="content"> 6．小腿骨折固定：用两块木板加垫后，放在小腿的内侧和外侧，关节处垫置软物，用五条三角巾或布带分段扎牢固定。首先固定小腿骨折的上下两端，然后，固定大腿中部、膝关节、踝关节并使小腿与脚掌呈垂直，用“8”字形固定。小腿骨折中固定腓骨骨折，在没有固定材料的情况下，可将患肢固定在健肢上（见图5-23）。 </p> <!-- 轮播图 --> <div class="imgBox-003 openImgBox"> <div class="swiper-container swiper-img"> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img style="width: 60%" src="../../assets/images/0175-3.jpg" /> <p class="img">图5-23 小腿骨折固定</p> </div> </div> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img src="../../assets/images/0175-4.jpg" /> <p class="img">图5-23 小腿骨折固定</p> </div> </div> </div> <div class="swiper-button-next"></div> <div class="swiper-button-prev"></div> </div> </div> <div class="video-box"> <p class="center text td-0"> <video :src="videoPathTwo" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true" x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls controlslist="nodownload" class="w100 video" style="border-radius: 10px"></video> </p> <p class="center videoname"> <span>视频： 婴幼儿骨折处理流程</span> <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideoTwo ? '点击取消' : '点击收藏' " placement="top-start"> <img :src="collectResourceList.findIndex( (item) => item.id == '672F54E4542A0BB15AE6DAD12C1AA74C' ) > -1 ? collectCheck : collectImg " alt="" class="collect-btn" @click="handleCollect('video-02')" /> </el-tooltip> </p> </div> <p class="poemtitle-l">（三）脊柱损伤搬运方法</p> <p class="content"> 只要怀疑有脊柱损伤就应按脊柱损伤情况处理，将脊柱不稳定的患儿仰卧固定在一块坚硬长背板上并将其放置在中心直线位置，即头部、颈部、躯干、骨盆应以中心直线位置逐一固定，保持脊柱伸直位，严禁弯曲或扭转。 </p> <p class="content"> 1．现场评估：观察周围环境安全后，急救员正面走向患儿表明身份；告知患儿不要做任何动作，初步判断伤情，简要说明急救目的；先稳定自己再固定患儿，避免加重脊柱损伤。 </p> <p class="content"> 2．体位：仰卧位，头部、颈部、躯干、骨盆应保持直线，脊柱不能屈曲或扭转。 </p> </div> </div> </div> <!-- 167页 --> <div class="page-box special-box" page="176"> <div v-if="showPageList.indexOf(176) > -1"> <div class="special-bodystyle"> <div class="page-header"> 167 </div> <p class="content"> 3．操作方法：用脊柱板、担架等。三人至患儿同侧跪下插手，将双手臂置于患儿身下的颈肩、腰臀、下肢水平；同时抬高，换单腿，起立，搬运，换单腿，下跪，换双腿；同时施以平托法将患儿放于硬质担架上，禁用搂抱或一人抬头、一人抬足的搬运方法。在伤处垫一薄枕，使此处脊柱稍向上突，然后用四条带子把患儿固定在木板或硬质担架上（一般用带子固定胸与肱骨水平、前臂与腰水平、大腿水平、小腿水平，将患儿绑在硬质担架上），使患儿不能左右转动。如果伴有颈椎损伤，患儿的搬运除上述三人外，另一个辅助检查的人应站在患儿头部，用手托扶住患儿头颈部，先用颈托固定颈部，如无颈托用“头锁或肩锁”手法固定头颈部，其余人协调一致用力将患儿平直地抬到担架上或木板上，然后头部的左右两侧用软枕或衣服等物固定（见图5-24）。 </p> <p class="content"> 4．监测与转运：检查固定带，观察患儿生命体征，选择合适转运工具，保证患儿安全。 </p> <div class="qrbodyPic tl-c openImgBox"> <img src="../../assets/images/0179-02.jpg" style="width: 60%" alt="" active="true" /> <p class="imgdescript">图5-24 脊柱损伤搬运</p> </div> <div class="video-box"> <p class="center text td-0"> <video :src="videoPathThree" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true" x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls controlslist="nodownload" class="w100 video" style="border-radius: 10px"></video> </p> <p class="center videoname"> <span>视频： 婴幼儿脊柱损伤搬运方法</span> <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideoThree ? '点击取消' : '点击收藏' " placement="top-start"> <img :src="collectResourceList.findIndex( (item) => item.id == '52D13E40E39BA98987EC269C1F41C16E' ) > -1 ? collectCheck : collectImg " alt="" class="collect-btn" @click="handleCollect('video-03')" /> </el-tooltip> </p> </div> <p class="content td-0"> <img class="img-h" src="../../assets/images/0015_01.jpg" alt="" /> </p> <p class="quotation"> 由于外力的作用，破坏了骨的完整性和连接性，造成的损伤叫“骨折”，可分为闭合性骨折、开放性骨折、复杂性骨折，骨折主要由直接暴力、间接暴力造成。 </p> <p class="quotation"> 皮肤不破，没有伤口，断骨不与外界相通，称为闭合性骨折；骨头的尖端穿过皮肤，有伤口与外界相通，称为开放性骨折。 </p> <p class="titleQuot-1">四、心跳呼吸骤停的处理与急救</p> <p class="content"> 心脏骤停一旦发生，如得不到即刻及时地抢救复苏，4～6分钟后会造成患儿脑和其他人体重要器官组织的不可逆的损害，因此心脏骤停后的心肺复苏必须在现场立即进行。心脏复苏通俗地讲就是当患儿停止呼吸和心停时，用人工呼吸和闭胸按压进行抢救的一种技术。人在心脏病、溺水、车祸、药物中毒、高血压、触电、异物堵塞时都可能会心脏骤停，呼吸停止，均可用心肺复苏术来抢救。其处置流程如下。 </p> </div> </div> </div> <!-- 168页 --> <div class="page-box special-box" page="177"> <div v-if="showPageList.indexOf(177) > -1"> <div class="special-bodystyle"> <div class="page-header"> 168 </div> <p class="poemtitle-l">（一）处置流程</p> <p class="content"> 1．评估和现场安全。急救者在确认现场安全的情况下，使患儿处于去枕仰卧位，放在质地较硬的平台、地面或床上。轻拍患儿的肩膀，并大声呼喊“小朋友，你还好吗？”，判断患儿神智是否清醒，有无自主呼吸，检查有无颈动脉搏动。判断有无脉搏时触摸颈动脉不能用力过大，以免颈动脉受压妨碍头部供血，检查时间不可超过10秒。如果没有呼吸或者没有正常呼吸（即只有喘息），立刻启动应急反应系统，开始闭胸心脏按压。 </p> <p class="content"> 2．闭胸心脏按压。如果患儿已经没有脉搏，则需进行闭胸心脏按压。施救者先要找到按压的部位。患儿两乳头连线中点。施救者以一手叠放于另一手手背，十指交叉，将掌根部置于刚才找到的位置，依靠上半身的力量垂直向下压，胸骨的下陷距离为4～5厘米，双手臂必须伸直，不能弯曲，压下后迅速抬起，频率控制在每分钟80～100次。注意事项：按压1岁以下婴儿时，使用两根手指；按压1—8岁幼儿时，使用一只手的手掌；按压8岁以上儿童时，使用两只手的手掌。按压过程必须控制力道，不可太过用劲，因为力道太大容易引起肋骨骨折，从而造成肋骨刺破心肺肝脾等重要脏器（见图5-25）。 </p> <div class="qrbodyPic tl-c openImgBox mt-20"> <img src="../../assets/images/0180-01.jpg" style="width: 100%" alt="" active="true" /> <p class="imgdescript">图5-25 闭胸心脏按压</p> </div> <p class="content"> 3．开放气道。将患儿置于平躺的仰卧位，昏迷的人常常会因舌后坠而造成气道堵塞，这时施救人员要跪在患儿身体的一侧，一手按住其额头向下压，另一手托起其下巴向上抬，标准是下颌与耳垂的连线垂直于地平线，这样就说明气道已经被打开。在开放气道的同时应注意清理患儿口中异物或呕吐物。开放气道用仰头举颌法时，注意手指不要压迫患儿颈前部、颌下软组织，也不要使颈过度伸长（见图5-26）。 </p> </div> </div> </div> <!-- 169页 --> <div class="page-box special-box" page="178"> <div v-if="showPageList.indexOf(178) > -1"> <div class="special-bodystyle"> <div class="page-header"> 169 </div> <p class="content"> 4．人工呼吸。如患儿无呼吸，立即进行口对口人工呼吸两次，然后摸颈动脉，如果能感觉到搏动，那么仅做人工呼吸即可。方法：最好能找一块干净的纱布或手巾，盖在患儿的口部，防止细菌感染。施救者一手捏住患儿鼻子，大口吸气，屏住气，迅速俯身，用嘴包住患儿的嘴，快速将气体吹入。与此同时，施救者的眼睛需观察患儿的胸廓是否因气体的灌入而扩张，气吹完后，松开捏着鼻子的手，让气体呼出，这样就完成了一次呼吸过程。对婴儿及幼儿复苏，可将其头部稍后仰，把口唇封住患儿的嘴和鼻子，轻微吹气入患儿肺部。单人心脏按压与人工呼吸比例为30∶2。进行口对口人工呼吸时，每次吹气量不要过大，否则易造成胃内大量充气（见图5-27）。 </p> <div class="fl al-c openImgBox mb-20"> <div class="tl-c"> <img src="../../assets/images/0181-01.jpg" style="width: 80%" alt="" active="true" /> <p class="imgdescript">图5-26 开放气道</p> </div> <div class="tl-c"> <img src="../../assets/images/0181-02.jpg" style="width: 80%" alt="" active="true" /> <p class="imgdescript">图5-27 人工呼吸</p> </div> </div> <p class="content"> 5．停止心肺复苏的指征。在施救的同时也要时刻观察患儿的生命体征。触摸患儿的手足，若温度有所回升，则进一步触摸颈动脉，发现有搏动即可停止心肺复苏，尽快把患儿送往医院进行进一步的治疗。 </p> <div class="video-box"> <p class="center text td-0"> <video :src="videoPathFour" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true" x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls controlslist="nodownload" class="w100 video" style="border-radius: 10px"></video> </p> <p class="center videoname"> <span>视频： 婴幼儿心跳呼吸骤停处理</span> <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideoFour ? '点击取消' : '点击收藏' " placement="top-start"> <img :src="collectResourceList.findIndex( (item) => item.id == '1DA74ED152C683BF7716A53EAAF304E9' ) > -1 ? collectCheck : collectImg " alt="" class="collect-btn" @click="handleCollect('video-04')" /> </el-tooltip> </p> </div> <p class="content td-0 mt-20"> <img class="img-h" src="../../assets/images/0015_01.jpg" alt="" /> </p> <p class="quotation"> 1．胸外心脏按压用力应平稳、有规律地进行，不能间断，也不能忽快忽慢，禁止做冲击式猛压，按压时手指不要压在胸壁上，否则易引起肋骨或肋软骨骨折。 </p> <p class="quotation"> 2．按压时用力应垂直向下（特别是肘关节要伸直），不要左右摆动，双手掌要重叠放置，不可交叉放置，按压后放松时定位的手掌根部不可离开胸骨定位点。 </p> <p class="quotation"> 3．如发现患儿无反应无呼吸，急救者应拨打120，取来自动体外除颤仪（AED，如果有条件），对患儿实施心肺复苏（CPR），需要时立即进行除颤。 </p> <p class="quotation"> 4．如有多名急救者在现场，其中一名急救者按步骤进行CPR，另一名急救者应拨打120，取来AED（如果有条件）。 </p> <p class="quotation"> 5．在救助淹溺或窒息性心脏骤停患儿时，急救者应先进行5个周期（2分钟）的CPR，然后拨打120。 </p> <p class="quotation"> 6．对于婴儿和幼儿，双人CPR时可采用15∶2的比率。即如双人或多人施救，应每2分钟或5个周期CPR（每个周期包括15次按压和2次人工呼吸）更换按压者，并在5秒钟内完成转换。因为研究表明，在按压开始1～2分钟后，操作者按压的质量就开始下降（表现为频率和幅度以及胸壁复位情况均不理想）。 </p> </div> </div> </div> <!-- 170页 --> <div class="page-box special-box" page="179"> <div v-if="showPageList.indexOf(179) > -1"> <div class="special-bodystyle"> <div class="page-header"> 170 </div> <p class="titleQuot-1">五、关节脱位的处理与急救</p> <p class="content"> 在外力作用下，使关节面彼此失去正常的连接关系，称为关节脱位，关节脱位一般都会引起关节囊撕裂和关节周围的韧带肌腱及其附着组织的损伤。婴幼儿受伤后脱位的关节会疼痛、肿胀、出现畸形，活动功能丧失。严重者，有时可能使血管、神经受损甚至伴有骨折。 </p> <p class="content"> 婴幼儿常见肩关节、肘关节脱位，多为跌倒时手掌着地或暴力所致。 </p> <p class="content"> 肩关节脱位表现为伤肩肿胀、疼痛，主动和被动活动受限，手掌不能搭在对侧肩部，患肢弹性固定于轻度外展位，常以健手托患臂，头和躯干向患侧倾斜，肩三角肌塌陷，呈方肩畸形，在腋窝，喙突下或锁骨下可触及移位的肱骨头，关节盂空虚。 </p> <!-- 轮播图 --> <div class="imgBox-003 openImgBox"> <div class="swiper-container swiper-img"> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img style="width: 60%" src="../../assets/images/0179-1.jpg" /> <p class="img">1.后方脱位</p> </div> </div> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img src="../../assets/images/0179-2.jpg" /> <p class="img">2.后方脱位</p> </div> </div> <div class="swiper-slide"> <div class="imgBox" style="width: 100%; height: 100%"> <img src="../../assets/images/0179-3.jpg" /> <p class="img">1.后方脱位</p> </div> </div> </div> <div class="swiper-button-next"></div> <div class="swiper-button-prev"></div> </div> </div> <p class="imgdescript">图5-28 肘关节脱位</p> <p class="content"> 肘关节脱位，表现为肘关节肿痛，关节置于半屈曲状，伸屈活动受限。如肘后脱位，则肘后方空虚，鹰嘴部向后明显突出；侧方脱位，肘部呈现肘内翻或外翻畸形。肘窝部充盈饱满。肱骨内、外侧髁及鹰嘴构成的倒等腰三角形关系改变（见图5-28）。 </p> <p class="content"> 婴幼儿关节脱位后，固定脱位关节，不得使之移动，更不得随意使用整复手法，迅速护送到医院进行整复、治疗。 </p> <p class="content"> 如肩部脱位，可把患儿肘部弯成直角，再用三角巾把前臂和肘部托起，挂在颈上，再用一条宽带缠过脑部，在对侧脑作结。如髋部脱位，则应立即让患儿躺在平板上送往医院。 </p> <div class="video-box"> <p class="center text td-0"> <video :src="videoPathFive" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true" x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls controlslist="nodownload" class="w100 video" style="border-radius: 10px"></video> </p> <p class="center videoname"> <span>视频： 婴幼儿关节脱位处理</span> <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideoFive ? '点击取消' : '点击收藏' " placement="top-start"> <img :src="collectResourceList.findIndex( (item) => item.id == '439863064461BF97467E94EA53280FBF' ) > -1 ? collectCheck : collectImg " alt="" class="collect-btn" @click="handleCollect('video-05')" /> </el-tooltip> </p> </div> <p class="content td-0 mt-20"> <img class="img-h" src="../../assets/images/0015_01.jpg" alt="" /> </p> <p class="quotation"> 一般关于脱位后均表现出关节畸形，这可作为判断依据之一。 </p> </div> </div> </div> <!-- 171页 --> <div class="page-box special-box" page="180"> <div v-if="showPageList.indexOf(180) > -1"> <div class="special-bodystyle"> <div class="page-header"> 171 </div> <p class="titleQuot-1">六、脑震荡的处理与急救</p> <p class="content"> 头部受到外力打击或碰撞以后脑功能发生暂时性障碍，叫作脑震荡。婴幼儿如发生脑震荡后，会立即出现暂时的意识障碍，如哭不出、意识迷糊等情况，历时约半小时。受伤轻者仅有意识恍惚（神志迷糊），重者可发生意识丧失（昏迷不醒）、烦躁不安、轻度休克、面色苍白或恶心呕吐。有的嗜睡，在数小时或过夜以后清醒，在意识恢复后仍可伴有头痛（婴幼儿用手敲头部）、烦躁不安、呕吐或眩晕等现象，有的甚至可长时间失去知觉。如出现这类现象，则可能是颅骨骨折、头部血肿、脑出血等，应及时就医。 </p> <p class="content"> 婴幼儿头部着地受到损伤时，教师、家长应给予足够的重视。情况较轻者，可卧床休息1～2天，如无特殊表现才可以下床活动，并应持续观察一周。如发现头部伴有血肿，应去医院拍片检查，判明有无颅骨骨折。凡有明显意识障碍，伴有休克的，应立即平卧、固定头部，紧急送往三级医院抢救。严禁摇动、牵扯，更不要随意移动位置，头部两侧用衣物填塞，以免左右摇晃，同时用毛巾浸湿冷敷头部，身体衣着要保暖。对神志不清者可用手指掐人中、合谷等穴，使其苏醒。 </p> <div class="video-box"> <p class="center text td-0"> <video :src="videoPathSix" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true" x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls controlslist="nodownload" class="w100 video" style="border-radius: 10px"></video> </p> <p class="center videoname"> <span>视频： 婴幼儿脑震荡处理</span> <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideoSix ? '点击取消' : '点击收藏' " placement="top-start"> <img :src="collectResourceList.findIndex( (item) => item.id == 'D85245AAC0CFCBDB8287FD5BEBFBBB51' ) > -1 ? collectCheck : collectImg " alt="" class="collect-btn" @click="handleCollect('video-06')" /> </el-tooltip> </p> </div> <p class="content td-0 mt-20"> <img class="img-h" src="../../assets/images/0015_01.jpg" alt="" /> </p> <p class="quotation"> 竞技性运动造成重型颅脑损伤后死亡或持久残疾的情况相对少见，但轻型颅脑损伤（脑震荡）相当常见，且发生率在逐年上升。美国国家运动损伤与疾病报告系统在1975年开始追踪各种体育运动中的损伤，资料显示，橄榄球运动中发生轻型颅脑损伤的可能性为2%～6%，而其他运动的发生率一般少于2%。在很多情况下，运动员没有意识到他们存在轻型颅脑损伤的症状，或者勉强告诉同伴和教练员只是微不足道的问题，而没有退出比赛。 </p> <p class="quotation"> 运动相关性脑震荡（Sports-Related Cerebral Concussion，SRCC）又称轻型头部损伤（Mild Head Injury，MHI），是常见运动损伤类型之一。SRCC的严重程度与性格、年龄有关，女性比男性严重，儿童和青少年比成人严重。那些发生过SRCC的运动员更容易再次发生SRCC，经常是短时间内发生多次，且症状严重。足球、跆拳道、曲棍球、篮球、冰球、美式橄榄球、拳击、散打等身体接触较多、对抗性强、比赛激烈的项目容易发生脑震荡。 </p> </div> </div> </div> <!-- 172页 --> <div class="page-box special-box" page="181"> <div v-if="showPageList.indexOf(181) > -1"> <div class="special-bodystyle"> <div class="page-header"> 172 </div> <p class="titleQuot-1">七、牙外伤的处理与急救</p> <div class="img-rights w200 openImgBox"> <img src="../../assets/images/0184-01.jpg" style="width: 100%" alt="" active="true" /> <p class="imgdescript">图5-29 牙外伤</p> </div> <span> <p class="content"> 婴幼儿在户外活动时，发生碰撞，经常会殃及牙齿，而婴幼儿牙齿外伤中以前牙齿外伤最为多见，尤以上颌前牙最多。因为上颌前牙在面部的最前端，所以发生意外时婴幼儿的上颌前牙即大门牙最容易受到伤害，造成门牙松动、移位、折断、脱落等情况。8—10岁是恒前牙外伤的高发年龄，此时新长出的门牙牙根尚未完全发育完成，根管壁薄，外伤后及时治疗尤为重要（见图5-29）。 </p> </span> <p class="poemtitle-l">（一）牙齿发生松动</p> <p class="content"> 1．牙齿叩痛和松动，此类情况牙齿受到碰撞力不大，主要让受伤牙得到休息，两周内不用患牙咬东西。 </p> <p class="content"> 2．如牙齿松动明显，请到医院就诊，医生会给牙齿做结扎固定。 </p> <p class="poemtitle-l">（二）乳牙因外伤脱落</p> <p class="content"> 1．尽快与牙医联系，迅速采取行动，这样可以减轻婴幼儿的不适并预防感染。 </p> <p class="content">2．用水冲洗口腔，同时冷敷以减少肿胀。</p> <p class="content"> 3．好好安抚婴幼儿，不必到处找牙。乳牙不应被再植，因为这有可能对继承恒牙生长造成潜在损伤。 </p> <p class="poemtitle-l">（三）恒牙因外伤脱落</p> <p class="content"> 1．找到牙齿，将其在凉水中慢慢冲洗，禁止擦洗或使用肥皂。 </p> <p class="content"> 2．将牙齿放回牙槽窝中，并让幼儿咬住纱布或毛巾以固位。如发现无法将牙齿放回牙槽窝，记住一定要把牙齿放在干净的容器里，最好用冷牛奶浸泡。如没有牛奶，用生理盐水、隐形眼镜护理液、幼儿的唾液浸泡，或含在舌下也可，尽可能保存牙周膜活力。 </p> <p class="content">3．立即将幼儿和湿润保存的脱落牙齿送往牙医处。</p> <p class="poemtitle-l">（四）牙齿发生折断</p> <div class="img-rights w200 openImgBox"> <div class="tipes"> <p class="content"> 幼儿活动时，如存在跌倒、碰撞或接触坚硬表面及设备的风险，应让幼儿佩戴防护牙托。 </p> </div> </div> <span> <p class="content"> 1．尽快与牙医联系，快速采取行动，保存牙齿，预防感染并减少更大范围的口腔治疗。 </p> <p class="content">2．用水冲洗口腔，同时冷敷以减少肿胀。</p> <p class="content"> 3．如能找到牙折断片，带上牙折断片，湿润保存，前往牙医处。 </p> </span> </div> </div> </div> <!-- 173页 --> <div class="page-box special-box" page="182"> <div v-if="showPageList.indexOf(182) > -1"> <div class="special-bodystyle"> <div class="page-header"> 173 </div> <p class="titleQuot-1">八、运动性腹痛的处理与急救</p> <p class="content"> 运动性腹痛是指由于运动引起或诱发的腹部疼痛，多发生在运动过程中或结束时，严重时常使运动者被迫中止运动。幼儿运动性腹痛多见于中长跑、跳跃活动中。疼痛的程度多与运动量、运动强度和运动的速度等因素有关。运动性腹痛可分为以下几种： </p> <p class="content">1．心血管系统的血液动力学障碍</p> <p class="content"> 部分幼儿平日体育锻炼基础较差，心血管系统的机能相对较弱，运动前又未认真做好准备活动，在剧烈运动中，心血管系统的机能水平就难以适应运动的负荷和强度，肝脾静脉回流受阻，血液淤积在肝、脾内，增大了肝脾的张力，使其膜上的神经受到牵扯，而产生疼痛。 </p> <p class="content">疼痛性质：胀痛或牵扯痛。</p> <p class="content">疼痛部位：两侧肋部。</p> <p class="content">2．呼吸肌痉挛</p> <p class="content"> 幼儿在运动、比赛中情绪高度紧张，运动时，未掌握好或注意不到呼吸节律及动作的协调，以致呼吸肌活动紊乱，呼吸急促而浅，致使呼吸肌疲劳，发生痉挛或细微的损伤。运动速度或强度增加太快，心肺机能赶不上肌肉工作的需要，也会促使呼吸肌痉挛，产生疼痛的反应。 </p> <p class="content">疼痛性质：锐痛。</p> <p class="content">疼痛位置：上腹部。</p> <p class="content">3．胃肠道局部血循环障碍</p> <p class="content"> 饭后过早参加运动，运动前喝得过多、吃得过饱或吃了难消化的食物（如豆类、薯类、牛肉）、喝了易产气的饮料、空腹锻炼（胃酸和冷空气对胃的刺激）等是胃肠受机械牵引容易引起胃肠道痉挛，从而引起腹痛的原因。 </p> <div class="tipes mt-20"> <p class="content"> 1．遵守科学训练原则，循序渐进地增加运动量，加强身体全面训练，提高心肺机能。 </p> <p class="content"> 2．合理安排饮食，运动前不宜进食、饮水过多，进餐后休息1.5～2小时方可进行运动。 </p> <p class="content"> 3．运动前准备活动要充分，运动中要注意呼吸节奏，中长跑时要合理分配速度。 </p> <p class="content"> 4．幼儿腹痛有多种原因，腹腔内外疾患的病理性因素仅是发病机理中的一个方面，排除疾病因素，健康幼儿出现运动中腹痛多为循环、消化、痉挛这三种原因。 </p> <p class="content"> 5．教师可提前与家长了解幼儿身体情况，对于各种引起腹痛的疾患，应及时诊治，并在医生指导下，进行适宜的体育锻炼。 </p> </div> </div> </div> </div> <!-- 174页 --> <div class="page-box special-box" page="183"> <div v-if="showPageList.indexOf(183) > -1"> <div class="special-bodystyle"> <div class="page-header"> 174 </div> <p class="content">疼痛性质：钝痛、胀痛甚至是绞痛。</p> <p class="content">疼痛位置：上腹部。</p> <p class="content"> 对于幼儿运动性腹痛的处理与急救，教师不要紧张，应安抚学生情绪，可采取以下措施： </p> <p class="content"> 1．应降低运动强度，如减慢速度，及时调整呼吸节奏，加深呼吸。 </p> <p class="content"> 2．用手按压疼痛部位并弯腰跑一段距离，做几次深呼吸，疼痛会减轻或消失。 </p> <p class="content"> 3．如因胃肠道局部血循环障碍原因产生疼痛，可降低运动强度，散步慢跑，揉搓腹部，加速食物消化排出气体。 </p> <p class="content"> 4．上述处理效果不理想，应该立刻停止运动。有条件的话可以口服阿托品、十滴水，并饮用少量的温盐水，一般来说腹部疼痛可以减轻或消失。 </p> <p class="content"> 5．若通过上述处理腹部疼痛仍然没有好转，应及时将伤员送到医院做进一步的检查。 </p> <p class="titleQuot-1">九、运动性休克的处理与急救</p> <div class="video-box"> <p class="center text td-0"> <video :src="videoPathSeven" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true" x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls controlslist="nodownload" class="w100 video" style="border-radius: 10px"></video> </p> <p class="center videoname"> <span>视频： 幼儿运动性休克处理</span> <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideoSeven ? '点击取消' : '点击收藏' " placement="top-start"> <img :src="collectResourceList.findIndex( (item) => item.id == '558BD52BD08066945D05B243F61772B6' ) > -1 ? collectCheck : collectImg " alt="" class="collect-btn" @click="handleCollect('video-07')" /> </el-tooltip> </p> </div> <p class="content"> 运动性休克是指在特定的运动环境中，因受到各种不利因素的侵袭，而迅速出现循环系统及其他系统功能急剧下降的一种病理生理状态。多见于平素体育锻炼较少的人，尤以少年儿童为多见。过分紧张、激动或带病参加运动为其诱因。有时少年儿童剧烈奔跑或赛跑后，如果立即站立不动，会使下肢的毛细血管和静脉失去肌肉收缩时产生的挤压作用，血液由于重力作用而淤积于下肢扩张的静脉和毛细血管里，也会产生休克。 </p> <p class="content"> 对于幼儿运动性休克的处理与急救，可采取如下办法（见图5-30）。 </p> <p class="content"> 1．出现休克早期等症状时，应立即搀扶，尽可能让其继续行走，使下肢肌肉收缩，促使血液回流，使症状消失。 </p> <div class="qrbodyPic tl-v openImgBox"> <img src="../../assets/images/0186-02.jpg" style="width: 80%" alt="" active="true" /> <p class="imgdescript">图5-30 运动性休克处理</p> </div> </div> </div> </div> <!-- 175页 --> <div class="page-box special-box" page="184"> <div v-if="showPageList.indexOf(184) > -1"> <div class="special-bodystyle"> <div class="page-header"> 175 </div> <p class="content"> 2．若无能力行走或已经昏倒，出现中度休克时，应将患儿平卧，头部放低，两下肢抬高，或由同伴二人抬其双下肢，由小腿向大腿做按摩或揉搓，以使血液尽早回流入心。在知觉恢复以前，不可给任何饮料或服药。 </p> <p class="content"> 3．如有呕吐，应将其头偏向一侧，防止呕吐物堵塞气道。必要时可给血管收缩药，如皮下注射麻黄素或肾上腺素。 </p> <p class="content"> 4．如呼吸停止，应做人工呼吸或皮下注射呼吸中枢兴奋剂，也可做50%葡萄糖静脉注射等抗休克处理。 </p> <p class="content">5．病情较重者，经现场急救后，急需转医院抢救。</p> <p class="titleQuot-1">十、运动性脱水的处理与急救</p> <p class="content"> 在运动时，尤其是在热环境中运动时出汗率增加，如果没有足够饮水，就会造成纯体液的丢失以及过度缺水状态。脱水常常伴有电解质平衡的破坏和电解质通过汗液和尿液的丢失，影响细胞和系统的功能，而且还会降低人体的运动能力。轻度脱水（失水量为体重的2%）时，感觉不适，口渴，食欲下降，尿量减少，运动能力受到影响。中度失水（失水量为体重的4%）时，表现为严重的口渴，心率加快，皮肤出汗减少，头痛，头晕，无力，心血管系统压力也会增加，使心率的变化与运动强度不协调，并且限制人体从收缩肌肉传送热量到体表散热的能力，致使体温升高，进而导致运动能力下降，发生热损伤的可能性也相应增加。重度脱水（失水量为体重的6%）时，除中度脱水表现外，还可能出现呼吸频率增加，血压下降，甚至休克，肌肉抽搐。 </p> <p class="content"> 对运动性脱水的处理与急救，最主要的措施就是及时补充丢失的液体，按照丢失1千克补充1000毫升液体计算。 </p> <p class="content td-0 openImgBox mt-20"> <img class="img-h" src="../../assets/images/0015_01.jpg" alt="" /> </p> <p class="quotation"> 1．在运动过程中采取适宜的补液措施，可以帮助幼儿消除和减轻水、电解质平衡紊乱对机体生理功能和运动能力的影响。 </p> <p class="quotation"> 2．准备活动前20～30分钟，按每千克体重补充7～8毫升的液体就能达到这个目的（即25千克的幼儿补充200毫升）。 </p> <p class="quotation"> 3．运动时：每15分钟喝少量的液体（每千克体重2～3毫升，25千克的青少年喝50～75毫升）、鼓励幼儿在口渴之前补充水分。 </p> <p class="quotation"> 4．幼儿会比成人丢失的钠和氯化物少，因而补充水分的饮料要比成人的稀薄一点。 </p> </div> </div> </div> <!-- 176页 --> <div class="page-box special-box" page="185"> <div v-if="showPageList.indexOf(185) > -1"> <div class="special-bodystyle pt-30"> <div class="page-header"> 176 </div> <div class="bk3"> <img class="bk3-titOne img-j" src="../../assets//images/bk3-bg.png" alt="" /> <img class="bk3-titTwo img-j" src="../../assets//images/bk3-bg.png" alt="" /> <img class="bk3-titThree img-j" src="../../assets//images/bk3-bg.png" alt="" /> <img class="bk3-titFour img-j" src="../../assets//images/bk3-bg.png" alt="" /> <p class="bk3-top"></p> <p class="bk3-top-right"></p> <p class="bk3-bottom"></p> <p class="bk3-bottom-right"></p> <div> <p class="titleQuot-c center">小 结</p> <p class="content"> 本章详细阐述了婴幼儿常见运动伤害的种类、症状、处理与急救方法，有利于教师学习掌握，并应用于实际工作中，从而可以降低运动伤害对婴幼儿的影响，加快其康复进程，使婴幼儿尽早回归正常生活和运动中。 </p> </div> </div> <p class="content td-0 mb-10 mt-30"> <img class="img-15" src="../../assets/images/0027_02.jpg" alt="" /> </p> <p class="content"> 软组织损伤 骨折 脑震荡 运动性腹痛 心肺复苏 运动性脱水 </p> <p class="content td-0 mb-10 mt-30"> <img class="img-15" src="../../assets/images/0028_01.jpg" alt="" /> </p> <p class="content"><span class="bold">一、简单题</span></p> <p class="content">1．婴幼儿运动伤害的判断与处理流程是什么？</p> <textarea v-model="videoQuestionData.one" placeholder="请输入内容" rows="5" style="max-width: 100%; width: 90%" class="fz-16 fm-son ml-40 textarea-question" @change="saveVideoQuestionData"></textarea> <p class="content">2．急性运动伤害的PRICE原则是什么？</p> <textarea v-model="videoQuestionData.two" placeholder="请输入内容" rows="5" style="max-width: 100%; width: 90%" class="fz-16 fm-son ml-40 textarea-question" @change="saveVideoQuestionData"></textarea> <p class="content">3．外伤出血的处理方法是什么？</p> <textarea v-model="videoQuestionData.three" placeholder="请输入内容" rows="5" style="max-width: 100%; width: 90%" class="fz-16 fm-son ml-40 textarea-question" @change="saveVideoQuestionData"></textarea> <p class="content">4．骨折的处置流程是什么？</p> <textarea v-model="videoQuestionData.four" placeholder="请输入内容" rows="5" style="max-width: 100%; width: 90%" class="fz-16 fm-son ml-40 textarea-question" @change="saveVideoQuestionData"></textarea> <p class="content">5．心肺复苏的操作流程有哪些？</p> <textarea v-model="videoQuestionData.five" placeholder="请输入内容" rows="5" style="max-width: 100%; width: 90%" class="fz-16 fm-son ml-40 textarea-question" @change="saveVideoQuestionData"></textarea> <p class="content">6．牙外伤后的处理方法是什么？</p> <textarea v-model="videoQuestionData.six" placeholder="请输入内容 " rows="5" style="max-width: 100%; width: 90%" class="fz-16 fm-son ml-40 textarea-question" @change="saveVideoQuestionData"></textarea> <p class="content">7．运动性腹痛的处理方法是什么？</p> <textarea v-model="videoQuestionData.seven" placeholder="请输入内容" rows="5" style="max-width: 100%; width: 90%" class="fz-16 fm-son ml-40 textarea-question" @change="saveVideoQuestionData"></textarea> <p class="content">8．运动性休克的处理方法是什么？</p> <textarea v-model="videoQuestionData.eight" placeholder="请输入内容" rows="5" style="max-width: 100%; width: 90%" class="fz-16 fm-son ml-40 textarea-question" @change="saveVideoQuestionData"></textarea> <p class="content">9．运动性脱水的表现及预防方法是什么？</p> <textarea v-model="videoQuestionData.nine" placeholder="请输入内容" rows="5" style="max-width: 100%; width: 90%" class="fz-16 fm-son ml-40 textarea-question" @change="saveVideoQuestionData"></textarea> <p class="content"><span class="bold">二、实践与练习</span></p> <p class="content"> 三个人为一组，一人扮演患儿，两人扮演教师，练习踝关节扭伤后的急救处理和心肺复苏操作方法。 </p> <p class="content td-0 mb-10 mt-30"> <img class="img-15" src="../../assets/images/0028_02.jpg" alt="" /> </p> <p class="content"> 王国祥、王虎主编：《体育运动伤害防护》，苏州，苏州大学出版社，2017。该书从运动损伤的发生机制、症状体征以及处理方法与措施等方面，对人体各部位常见运动损伤进行了详细介绍，着重介绍了头部、躯干和四肢主要关节部位的120多种急、慢性损伤，能满足进一步深入研究的需求。 </p> <p class="dialogQuestion" @click="openQuestion(1)"> <span class="td-0">【本节测试】</span> <span class="td-0"> <svg t="1736157124915" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2536" xmlns:xlink="http://www.w3.org/1999/xlink" width="28" height="28"> <path d="M798.72 76.8H947.2v145.92h51.2V25.6h-199.68zM947.2 798.72v145.92h-148.48v51.2H998.4v-197.12zM66.56 222.72V76.8h148.48V25.6H12.8v197.12zM215.04 944.64H66.56v-145.92H12.8v197.12h202.24z" fill="#fff" p-id="2537"></path> <path d="M826.88 522.24L512 207.36c0-2.56-2.56-2.56-7.68-2.56-2.56 0-5.12 0-7.68 2.56L184.32 524.8c-2.56 2.56-5.12 7.68-2.56 10.24 2.56 5.12 5.12 7.68 10.24 7.68h58.88V793.6c0 12.8 10.24 25.6 25.6 25.6 12.8 0 25.6-10.24 25.6-25.6V504.32c0-5.12-5.12-10.24-10.24-10.24h-2.56l217.6-220.16 220.16 222.72c-5.12 0-10.24 5.12-10.24 10.24V793.6c0 12.8 10.24 25.6 25.6 25.6 12.8 0 25.6-10.24 25.6-25.6v-250.88h51.2c5.12 0 10.24-5.12 10.24-10.24 2.56-5.12 0-7.68-2.56-10.24z" fill="#fff" p-id="2538"></path> <path d="M386.56 762.88h240.64c10.24 0 17.92 7.68 17.92 17.92 0 10.24-7.68 17.92-17.92 17.92h-240.64c-10.24 0-17.92-7.68-17.92-17.92 0-10.24 7.68-17.92 17.92-17.92z m0-69.12h240.64c10.24 0 17.92 7.68 17.92 17.92 0 10.24-7.68 17.92-17.92 17.92h-240.64c-10.24 0-17.92-7.68-17.92-17.92 0-10.24 7.68-17.92 17.92-17.92z m0-71.68h240.64c10.24 0 17.92 7.68 17.92 17.92 0 10.24-7.68 17.92-17.92 17.92h-240.64c-10.24 0-17.92-7.68-17.92-17.92 0-7.68 7.68-17.92 17.92-17.92zM514.56 535.04h-20.48c-5.12 0-7.68-2.56-7.68-7.68v-2.56c0-17.92 5.12-30.72 23.04-46.08 17.92-15.36 23.04-23.04 23.04-33.28s-7.68-20.48-20.48-20.48c-15.36 0-25.6 7.68-30.72 25.6 0 5.12-5.12 5.12-10.24 5.12l-25.6-5.12c-5.12 0-7.68-5.12-5.12-10.24 10.24-38.4 33.28-53.76 79.36-53.76 38.4 0 61.44 25.6 61.44 51.2 0 20.48-7.68 35.84-33.28 53.76-20.48 15.36-23.04 20.48-23.04 33.28-2.56 7.68-7.68 10.24-10.24 10.24zM481.28 588.8v-28.16c0-5.12 2.56-7.68 7.68-7.68h30.72c5.12 0 7.68 2.56 7.68 7.68V588.8c0 5.12-2.56 7.68-7.68 7.68h-30.72c-5.12 0-7.68-5.12-7.68-7.68z" fill="#fff" p-id="2539"></path> </svg> </span> </p> </div> </div> </div> <dialogExaminations :isClear="dialogVisibleOne" :primaryColor="themeColor" :cardList="interfaceQuestion[questionNum]" v-if="interfaceQuestion" :chapter="2" :page="questionNum" :questionTitle="questionTitleMain" ref="dialogRef"> </dialogExaminations> </div> </template> <script> import { getResourcePath } from "@/assets/methods/resources"; import { getCollectResource, setCollectResource, } from "@/assets/methods/resources"; import dialogExaminations from "@/components/dialogExaminations/index.vue"; export default { name: "chapterOne", props: { showPageList: { type: Array, }, interfaceQuestion: { type: Object, }, }, components: { dialogExaminations, }, data() { return { collectImg: require("../../assets/images/icon/heart.png"), collectCheck: require("../../assets/images/icon/heart-check.png"), videoPathOne: "", videoPathTwo: "", videoPathThree: "", videoPathFour: "", videoPathFive: "", videoPathSix: "", videoPathSeven: "", chapterData: { isCollectVideoOne: false, isCollectVideoTwo: false, isCollectVideoThree: false, isCollectVideoFour: false, isCollectVideoFive: false, isCollectVideoSix: false, isCollectVideoSeven: false, }, videoQuestionData: { one: "", two: "", three: "", four: "", five: "", six: "", seven: "", eight: "", nine: "", }, collectResourceList: [], // 题目相关 dialogVisibleOne: false, themeColor: "#7acab4", questionNum: 0, questionTitleMain: "", chapter001: { question: { 1: { questionTitleMain: "第五章 婴幼儿常见运动伤害的处理与急救", questionNum: 185, }, }, }, }; }, async mounted() { const videoData = localStorage.getItem( "toddlerSportsSafetyProtection-book-chapter001-video" ); if (videoData) { this.chapterData = JSON.parse(videoData); } const videoQuestionData = localStorage.getItem( "toddlerSportsSafetyProtection-book-chapter001-videoQuestionData" ); if (videoQuestionData) { this.videoQuestionData = JSON.parse(videoQuestionData); } this.getVidoePath(); this.collectResourceList = await getCollectResource( this.config.activeBook.bookId ); }, methods: { async getVidoePath() { this.videoPathOne = await getResourcePath( "758EFE380803FE03E335BBBE8204F0BC" ); this.videoPathTwo = await getResourcePath( "672F54E4542A0BB15AE6DAD12C1AA74C" ); this.videoPathThree = await getResourcePath( "52D13E40E39BA98987EC269C1F41C16E" ); this.videoPathFour = await getResourcePath( "1DA74ED152C683BF7716A53EAAF304E9" ); this.videoPathFive = await getResourcePath( "439863064461BF97467E94EA53280FBF" ); this.videoPathSix = await getResourcePath( "D85245AAC0CFCBDB8287FD5BEBFBBB51" ); this.videoPathSeven = await getResourcePath( "558BD52BD08066945D05B243F61772B6" ); }, handleCollect(e) { if (e == "video-01") { this.handleCollectResource( "758EFE380803FE03E335BBBE8204F0BC", "758EFE380803FE03E335BBBE8204F0BC", "", "视频", "bits", "活动视频：婴幼儿出血处理" ); this.chapterData.isCollectVideoOne = !this.chapterData.isCollectVideoOne; } else if (e == "video-02") { this.handleCollectResource( "672F54E4542A0BB15AE6DAD12C1AA74C", "672F54E4542A0BB15AE6DAD12C1AA74C", "", "视频", "bits", "活动视频：婴幼儿骨折处理流程" ); this.chapterData.isCollectVideoTwo = !this.chapterData.isCollectVideoTwo; } else if (e == "video-03") { this.handleCollectResource( "52D13E40E39BA98987EC269C1F41C16E", "52D13E40E39BA98987EC269C1F41C16E", "", "视频", "bits", "活动视频：婴幼儿脊柱损伤搬运方法" ); this.chapterData.isCollectVideoThree = !this.chapterData.isCollectVideoThree; } else if (e == "video-04") { this.handleCollectResource( "1DA74ED152C683BF7716A53EAAF304E9a", "1DA74ED152C683BF7716A53EAAF304E9a", "", "视频", "bits", "活动视频：婴幼儿心跳呼吸骤停处理" ); this.chapterData.isCollectVideoFour = !this.chapterData.isCollectVideoFour; } else if (e == "video-05") { this.handleCollectResource( "439863064461BF97467E94EA53280FBF", "439863064461BF97467E94EA53280FBF", "", "视频", "bits", "活动视频：婴幼儿关节脱位处理" ); this.chapterData.isCollectVideoFive = !this.chapterData.isCollectVideoFive; } else if (e == "video-06") { this.handleCollectResource( "D85245AAC0CFCBDB8287FD5BEBFBBB51", "D85245AAC0CFCBDB8287FD5BEBFBBB51", "", "视频", "bits", "活动视频：婴幼儿脑震荡处理" ); this.chapterData.isCollectVideoSix = !this.chapterData.isCollectVideoSix; } else if (e == "video-07") { this.handleCollectResource( "558BD52BD08066945D05B243F61772B6", "558BD52BD08066945D05B243F61772B6", "", "视频", "bits", "活动视频：幼儿运动性休克处理" ); this.chapterData.isCollectVideoSeven = !this.chapterData.isCollectVideoSeven; } this.saveVideoStatus(); }, saveVideoStatus() { localStorage.setItem( "toddlerSportsSafetyProtection-book-chapter001-video", JSON.stringify(this.chapterData) ); }, saveVideoQuestionData() { localStorage.setItem( "toddlerSportsSafetyProtection-book-chapter001-videoQuestionData", JSON.stringify(this.videoQuestionData) ); }, //资源收藏事件 // resourcePath 文件路径， // resourceType 文件类型 // source 文件来源 handleCollectResource( id, md5, resourcePath, resourceType, source, resourceName ) { let list = this.collectResourceList; if (list.findIndex((item) => item.id == id) > -1) { list = list.filter((item) => item.id != id); } else { list.push({ id, md5, resourcePath, resourceType, source, resourceName, }); } this.collectResourceList = list; setCollectResource( this.config.activeBook.bookId, this.collectResourceList ); }, openQuestion(num) { if (num) { this.questionNum = this.chapter001.question[num].questionNum; this.questionTitleMain = this.chapter001.question[num].questionTitleMain; this.$refs.dialogRef.openDialogQuestion(); } }, }, }; </script> <style lang="less" scoped> hr { margin-left: 0; margin-bottom: 25px; width: 25%; border: none; height: 1px; background-color: #000; } .header-right-img { width: 100%; display: inline-block; justify-content: center; padding-top: 40%; min-height: 600px !important; img { width: 35%; height: auto; } } </style> src/books/textToddlerSportsSafetyProtection/view/components/header.vue
New file @@ -0,0 +1,269 @@ <template> <div class="chapter" num="1"> <!-- 封面 --> <div class="page-box mt-20" page="1" style="padding-bottom: 0px"> <div v-if="showPageList.indexOf(1) > -1"> <img class="img-0" alt="" src="../../assets/images/Cover.jpg" /> </div> </div> <div class="page-box mt-20" page="2" style="padding-bottom: 0px"> <div v-if="showPageList.indexOf(2) > -1"> <img class="img-0" alt="" src="../../assets/images/feiYe.jpg" /> </div> </div> <!-- 介绍页面 --> <div class="page-box" page="3"> <div v-if="showPageList.indexOf(3) > -1"> <div style="max-width: 400px; margin: 0 auto; padding: 10% 0"> <hr /> <p class="td-1 fm-hyzh fz-16">图书在版编目（CIP）数据</p> <p class="left3 mr-0 td-1 fm-hyss fz-14"> 婴幼儿运动安全与保护/闫俊涛，张首文，孙璐主编.-北京:北京师范大学出版社，2022.1 </p> <p class="left3 td-1 fm-hyss fz-14">ISBN 978-7-303-27698-1</p> <p class="left3 fm-hyss fz-14 mt-20 mb-20"> I.①婴… Ⅱ.①闫… ②张… ③孙… Ⅲ,①婴幼儿-运动训练 I.G613.7 </p> <p class="left3 fm-hyss fz-14"> 中国版本图书馆CIP数据核字(2021)第272797号 </p> <hr /> <p><br /></p> <p><br /></p> <p><br /></p> <p class="left fz-13 fm-hyss"> <span class="fm-hyzh fz-14">图书意见反馈:</span> gaozhifk@bnupgcom 010-58805079 </p> <p class="left fz-13 fm-hyss"> <span class="fm-hyzh fz-14">营销中心电话:</span> 010-58802755 58801876 </p> <hr /> <p class="left fm-hyss fz-14">YINGYOUER YUNDONG ANOUAN YU BAOHU</p> <p class="left fm-hyss fz-14"> 出版发行：北京师范大学出版社 www.bnupg.com </p> <p class="left fm-hyss fz-14"> 北京市西城区新街口外大街12-3号 </p> <p class="left fm-hyss fz-14"> 邮政编码：100088</p> <p class="left fm-hyss fz-14">印 刷：北京玺诚印务有限公司</p> <p class="left fm-hyss fz-14">经 销：全国新华书店</p> <p class="left fm-hyss fz-14">开 本：787mmx1092mm 1/16</p> <p class="left fm-hyss fz-14">印 张：12</p> <p class="left fm-hyss fz-14">字 数：217千字</p> <p class="left fm-hyss fz-14">版 次：2023年7月第1版</p> <p class="left fm-hyss fz-14">印 次：2023年7月第1次印刷</p> <p class="left fm-hyss fz-14">定 价：34.80元</p> <hr /> <p class="left fm-hyss fz-14"> 策划编辑：王 超 罗佩珍 责任编辑：李春生 </p> <p class="left fm-hyss fz-14"> 美术编辑：焦 丽 装帧设计：焦 丽 </p> <p class="left fm-hyss fz-14"> 责任校对：段立超 责任印制：陈 涛 </p> <p class="center mt-20"><b>版权所有 侵权必究</b></p> <p class="left center block">反盗版、侵权举报电话：010-58808104</p> <p class="left center block">北京读者服务部电话：010-58808104</p> <p class="left center block">外埠邮购电话：010-58808083</p> <p class="left center block"> 本书如有印装质量问题，请与印制管理部联系调换。 </p> <p class="left center block">印制管理部电话：010-58808284</p> <p class="left center block">编辑部电话:010-58802682</p> </div> </div> </div> <!-- 编委会 --> <div class="page-box" page="4"> <div v-if="showPageList.indexOf(4) > -1"> <div class="foreword"> <div class="editorialBoard"> <h1 class="firstTitle" style="color: #b0ddcf">编委会</h1> <p class="preface"><span class="bold">丛书主编</span></p> <p class="preface mb-30">叶平枝</p> <p class="preface"><span class="bold">本书主编</span></p> <p class="preface mb-30">闫俊涛 张首文 孙 璐</p> <p class="preface"><span class="bold">本书副主编</span></p> <p class="preface mb-30">毕中情 李 徽 李迎春</p> <p class="preface"> <span class="bold">本书参编（姓氏笔画排序）</span> </p> <p class="preface"> 田佳欣 刘晓曦 闫俊倩 李 娜 吴升扣 吴梦晗 </p> <p class="preface mb-30">宋 琳 孟 莉 胡国森 袁 伟 龚琪雯</p> </div> </div> </div> </div> <!-- 丛书序 --> <div class="page-box" page="5"> <div v-if="showPageList.indexOf(5) > -1"> <div class="series"> <h1 class="seriesTitle">丛书序</h1> <p class="rotate-up">^</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p><br /></p> <p><br /></p> <p><br /></p> <p class="preface"> 大力发展职业教育对于降低失业率、解决就业结构的矛盾，提高生产力和劳动者的整体素质，减少贫富差距、树立劳动者尊严，激发劳动者热情和创造力，推动我国民族复兴都具有重要意义。如果说德国经济腾飞的秘密武器是其双元制的职业教育体系，那么，我国职业教育的纵深发展也将成为撬动我国经济、社会发展的重要力量。进入“十四五”，我国职业教育又有了新起点、新变化：中等职业教育从“就业导向”到“就业与升学导向”，毕业生既可以直接就业，也可以继续升学到专科和本科职业院校，因而成为高等教育的生源基础，有着多元的发展路径；高职专科进入提质培优、增值赋能、以质图强，加快迈进现代化的新阶段；高职本科坚持理论先行、“高举高打”，充分发挥其在职业教育中的龙头地位。 </p> <p class="preface"> 2021年3月教育部印发《职业教育专业目录（2021年）》（教职成〔2021〕2号），首次对中职、高职专科和高职本科三个层次专业目录进行一体化修（制）订，建立了统一的分类框架和上下衔接的专业名称，使职业教育类型特征更为凸显。通过中职、高职专科、高职本科一体化专业设置，为学生职业发展打开通路。 </p> <p class="preface"> 根据这些职业教育发展趋势和国家《“十四五”职业教育规划教材建设实施方案》，本系列教材聚焦于婴幼儿照护类专业，通过不同梯度的内容设计，为学前教育、婴幼儿托育服务与管理、早期教育、婴幼儿发展与健康管理等专业提供专业教材，同时，也为实现“幼有所育、幼有优育、幼有善育”奠定基础。 </p> <p class="preface"> 在编写过程中，编写组努力体现如下原则：（1）坚持正确的政治方向和价值导向；（2）以培养德智体美劳全面发展的社会主义建设者和接班人、未来的“四有好老师”为目标；（3）体现“培根铸魂、启智增慧”；（4）遵循职业教育教学规律和人才成长规律；（5）科学合理编排教材内容。 </p> </div> </div> </div> <!-- 丛书序 --> <div class="page-box" page="6"> <div v-if="showPageList.indexOf(6) > -1"> <div class="page-father"> <ul class="header-left"> <li class="headerText"> 婴<br />幼<br />儿<br />运<br />动<br />安<br />全<br />与<br />保<br />护 </li> <li class="headerNumber">2</li> <img src="../../assets/images/a1.jpg" alt="" /> </ul> <div class="bodystyle"> <p class="preface">本系列教材努力体现如下特色。</p> <p class="preface"> （1）医养教结合，适用性强。本系列教材聚焦健康和保育，着重补充了婴幼儿照护类专业紧缺的课程教材。教材主要涵盖三个方面：一是婴幼儿卫生保健，包括《幼儿园食育》《婴幼儿感觉统合发展与训练》《婴幼儿常见疾病预防与护理》；二是婴幼儿体育，包括《婴幼儿体质健康与动作发展测评》《婴幼儿运动安全与保护》《婴幼儿运动处方设计与应用》；三是婴幼儿心理健康，包括《婴幼儿发展评价》《婴幼儿行为观察与指导》《婴幼儿常见发展问题与矫正》《婴幼儿亲职教育》《学前特殊儿童融合教育》。 </p> <p class="preface"> （2）行业专家领衔，专业度高。教材编写队伍多元，理论和实践专家相结合。本系列教材的编写者既有来自普通高校、职业院校、科研机构的教学研究人员，也有来自医疗机构、保教机构和婴幼儿保育实践的教研员；编写工作既有博导、教授等资深专家领衔，也有中青年新锐积极参与。编写队伍专业水平高，具有使命感、责任感和良好的师德，保证了教材的政治方向、权威性、科学性和前瞻性。 </p> <p class="preface"> （3）理实一体，可操作性突出。本系列教材为“岗课赛证”融通教材，内容根据职业院校学生的学习特点和职业发展需求编写，既有理论的指导，又有结合岗位需求的实践案例；既体现最新、最前沿学科发展，又深入浅出、可读性强、易于理解。 </p> <p class="preface"> （4）融媒体教材，立体化呈现。本系列教材将图文并茂的纸媒与数字化的微课、案例视频、在线习题等相结合，根据不同内容的具体需求，立体化呈现各门课程的学习要点、知识难点、核心技能等。设置各类情境中的互动实操环节，帮助学生形成个性化的学习方案和自主学习习惯，注重课程评价的过程性和形成性。 </p> <p class="preface"> 相信本系列教材的出版，将有利于促进相关专业人才培养的开展和质量的提升，从而有力推动我国婴幼儿照护事业健康地、高质量地、持续地发展。同时，也希望通过本系列教材的推广和使用，进一步吸纳一线教师、科研人员及其他使用者的智慧与经验，使教材不断发展和完善，持续为广大师生提供高品质教材。 </p> <p class="right-info mt-20">叶平枝</p> </div> </div> </div> </div> <!-- 前言 --> <div class="page-box" page="7"> <div v-if="showPageList.indexOf(7) > -1"> <div class="series"> <h1 class="seriesTitle">前 言</h1> <p class="rotate-up">^</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p class="rotate-down">v</p> <p><br /></p> <p><br /></p> <p><br /></p> <p class="preface"> 近年来，婴幼儿的运动安全问题成为社会关注的热点问题。当婴幼儿发生运动伤害事故时，无论对婴幼儿还是对家庭都是沉重的打击，甚至带来不可挽回的损失。随着人们越来越重视婴幼儿的身体健康问题，并逐步意识到体育活动与婴幼儿健康和整体发展之间的密切关系，加强婴幼儿体育运动安全教育和管理，预防运动伤害事故的发生就成了亟待解决的问题。党的二十大报告指出，要“建成教育强国、科技强国、人才强国、文化强国、体育强国、健康中国，国家文化软实力显著增强”。体育强国、健康中国、儿童健康是中国健康的基石。2019年国务院办公厅发布了《国务院办公厅关于促进3岁以下婴幼儿照护服务发展的指导意见》，国家卫生健康委也组织编写了《儿童伤害预防与控制工作指南》和《托育机构婴幼儿伤害预防指南（试行）》，健全了0—3岁阶段相关安全制度，规范和加强了对婴幼儿的照护。而《3—6岁儿童学习与发展指南》的发布则明确了3—6岁幼儿发展的目标，依据儿童身心发展特点建立了科学系统的内容体系，着重强调了要充分认识生活和体育游戏对幼儿成长的教育价值，建议幼儿每天户外活动不少于2小时，体育游戏不少于1小时，为幼儿运动提供了科学的指引。《幼儿园教育指导纲要（试行）》也指出：“幼儿园必须把保护幼儿的生命和促进幼儿的健康放在工作的首位。”以上文件都进一步明确了体育运动和婴幼儿安全的重要性。鉴于此，根据当前社会关注的热点问题和相关政策的引领，我们特组织多所高校的婴幼儿教育领域专家和教学经验丰富的幼教机构教师完成了本教材的编写。 </p> </div> </div> </div> <!-- 丛书序 --> <div class="page-box" page="8"> <div v-if="showPageList.indexOf(8) > -1"> <div class="page-father"> <ul class="header-left"> <li class="headerText"> 婴<br />幼<br />儿<br />运<br />动<br />安<br />全<br />与<br />保<br />护 </li> <li class="headerNumber">2</li> <img src="../../assets/images/a1.jpg" alt="" /> </ul> <div class="bodystyle"> <p class="preface"> 婴幼儿体育运动属于有目的、有计划的教育性活动。一方面，婴幼儿体育运动具有趣味性、自由性和创造性的特点，和婴幼儿好玩、好动、想象力丰富的特点相吻合，是婴幼儿喜欢的活动。另一方面，婴幼儿体育运动能提高动作技能、学习和认知能力，增强积极的情绪，有利于婴幼儿的身心健康。因此，幼教机构应通过各种形式组织多种多样的体育活动。但是，婴幼儿在运动中又存在很多的不安全因素：一方面，婴幼儿自我保护能力不足，认知事物能力有限；另一方面，教师缺少安全事故防范与保护的正规培训。尽管婴幼儿因自身的原因会有发生运动伤害的可能性，但很多时候婴幼儿的运动伤害都是由于教师或者家长的疏忽大意、运动安全相关教育的缺失，特别是对婴幼儿运动安全与保护知识的缺乏等因素造成的。考虑到当前婴幼儿照护与教育相关专业对这方面知识迫切的需要，我们特编写了本书。本书聚焦婴幼儿运动的安全与保护这一主题，具有较强的操作性和应用价值，既适用于职业教育婴幼儿照护与教育相关专业（包括婴幼儿发展与健康管理专业、学前教育专业、婴幼儿托育服务与管理专业、早期教育专业）学生的学习，也适用于幼教机构（包括幼儿园、托育园、早教机构等）的一线教师参考借鉴，还可为广大家长科学指导婴幼儿的体育活动提供指导。 </p> <p class="preface"> 《婴幼儿运动安全与保护》一书共五章，分别为婴幼儿运动安全与保护概述、婴幼儿运动安全的预防工作、婴幼儿常见运动的安全与保护、婴幼儿运动伤害、婴幼儿常见运动伤害的处理与急救。本书具有以下特点。 </p> <p class="preface"> 1．内容的针对性。本书分别对婴幼儿的发育特性、常见运动类型、婴幼儿常见运动伤害及原理、康复治疗等方面进行了有针对性的详细描述，帮助幼教工作者和家长在婴幼儿进行体育运动时给予必要的保护和在婴幼儿发生运动伤害事故时做出紧急的处理和急救。 </p> <p class="preface"> 2．编写的特色性。本书设置小贴士、想一想、知识链接等栏目，以浅显易懂的方式为减少婴幼儿在运动中潜在的安全问题提供科学的指导，适合本专业学生、幼教工作者和婴幼儿家长阅读和参考。 </p> <p class="preface"> 3．内容的实用性。本书注重实践能力的培养，通过添加许多生动的婴幼儿体育活动图片资料，帮助本专业学生、幼教工作者和家长了解常见运动类型、常见运动伤害以及有效的急救手段，提高其解决问题的能力。 </p> <p class="preface"> 4．内容的科学性。参编人员都具有丰富的婴幼儿运动理论与实践经验，严控每个章节的质量，力求满足本专业学生、幼教工作者和家长对相关知识的广度与深度的需求。 </p> </div> </div> </div> </div> <div class="page-box" page="9"> <div v-if="showPageList.indexOf(9) > -1"> <div class="page-father"> <div class="bodystyle-left"> <p class="preface"> 本书编写具体分工如下：第一章由北京体育大学闫俊涛负责；第二章由晋中学院毕中情、首都师范大学张首文、北京市朝阳区教师发展学院刘晓曦、北京市通州区教师研修中心龚琪雯负责；第三章由首都师范大学张首文、北京市石景山区实验幼儿园李徽、北京体育大学闫俊涛和吴梦晗、北京十一晋元幼儿园田佳欣、北京市通州区张家湾镇牛堡屯中心幼儿园胡国森和袁伟负责；第四章由北京教育科学研究院孙璐、河北省邯郸幼儿师范高等专科学校李娜、中国人民大学吴升扣、北京市石景山区实验幼儿园孟莉负责；第五章由北京体育大学宋琳、北京市昌平区工业幼儿园李迎春负责。全书由闫俊涛统稿。此外，本书案例主要由北京市石景山区实验幼儿园的多位教师提供，北京体育大学的研究生张子琳、郭颖、段志勇参与了本书的资料整理工作。 </p> <p class="preface"> 本书编写得到了北京师范大学出版社、北京体育大学、首都师范大学学前教育学院、北京教育学院通州分院研修中心、北京市石景山区实验幼儿园、北京市昌平区工业幼儿园、北京市通州区牛堡屯幼儿园等单位的大力支持，谨此一并致谢。 </p> <p class="preface"> 在本书编写过程中，我们参考了许多专家学者的著作和成果，引用了许多婴幼儿运动安全事故的经典案例和婴幼儿运动的图片资料，在此向相关作者表示衷心感谢。由于编写人员水平有限，本书难免存在疏漏和错误，在此，恳请同行专家和读者朋友批评指正。 </p> <p class="right-info mt-20">编者</p> </div> <ul class="header-right"> <li class="header-right-img"> <img src="../../assets/images/a2.jpg" alt="" /> </li> <img class="header-right-imgTop" src="../../assets/images/a3.jpg" alt="" /> <li class="header-right-Number">3</li> <li class="header-right-Text"> 前<br />言 </li> </ul> </div> </div> </div> </div> </template> <script> export default { name: "pageHeader", props: { showPageList: { type: Array, }, }, data() { return {}; }, }; </script> <style lang="less" scoped></style> src/books/textToddlerSportsSafetyProtection/view/components/index.vue
New file @@ -0,0 +1,970 @@ <template> <div class="page-main" @scroll="throttledScrollHandler"> <div id="searchDomBox" style="display: none"> <div id="searchContent"></div> </div> <div class="page-content" :style="{ fontSize: fontSize + 'px', transform: `scale(${pageZoom})`, transformOrigin: 'center top', }"> <pageHeader v-if="showCatalogList.indexOf(1) > -1" :showPageList="loadPageList"></pageHeader> <!-- <chapterOne v-if="showCatalogList.indexOf(2) > -1" :showPageList="loadPageList" ></chapterOne> --> <!-- <chapterTwo v-if="showCatalogList.indexOf(3) > -1" :showPageList="loadPageList" ></chapterTwo> <chapterThree v-if="showCatalogList.indexOf(4) > -1" :showPageList="loadPageList" ></chapterThree> <chapterFour v-if="showCatalogList.indexOf(5) > -1" :showPageList="loadPageList" ></chapterFour>--> <chapterFive v-if="showCatalogList.indexOf(2) > -1" :showPageList="loadPageList" :interfaceQuestion="questionDataMap"></chapterFive> </div> </div> </template> <script> import pageHeader from "./header.vue"; // import chapterOne from "./chapter001.vue"; // import chapterTwo from "./chapter002.vue"; // import chapterThree from "./chapter003.vue"; // import chapterFour from "./chapter004.vue"; import chapterFive from "./chapter005.vue"; import NoteIcon from "@/assets/images/biji.png"; import getQuestionList from "@/assets/methods/examination"; import testData from "../../assets/examinationList"; import _ from "lodash"; import Swiper from "swiper/bundle"; import "swiper/swiper-bundle.css"; import Viewer from "viewerjs"; import "viewerjs/dist/viewer.css"; export default { name: "pageContent", data() { return { catalogLength: 2, // 总章节数 showCatalogList: [], // 显示的章节 loadThreshold: 300, // 触发加载阈值 throttleThreshold: 100, // 节流阈值 previousScrollTop: 0, throttledScrollHandler: null, observer: null, loadPageObserver: null, loadPageList: [], questionDataMap: {}, renderSignMap: {}, highlightData: null, audioPath: "", currentTime: null, videoList: [], }; }, computed: { fontSize() { this.transformDom(this.$store.state.qiankun.fontSize); return this.$store.state.qiankun.fontSize ? this.$store.state.qiankun.fontSize : 16; }, pageZoom() { return this.$store.state.qiankun.scale ? this.$store.state.qiankun.scale / 100 : 1; }, }, watch: { showCatalogList: { handler(newVal, oldVal) { if ( this.$store.state.qiankun && this.$store.state.qiankun.catalogChange ) { // 调用父层方法 this.$store.state.qiankun.catalogChange({ showCatalogList: newVal, }); } // 启动页码观察 setTimeout(() => { this.initObservation(); this.initThemeColor(); }, 500); }, }, loadPageList: { handler(newVal, oldVal) { setTimeout(() => { this.transformDom(this.$store.state.qiankun.fontSize); this.initSwiper(); this.initViewer(); this.closeAudio(); this.closeVideo(); }, 200); }, }, pageZoom: { handler(newVal, oldVal) { const scrollBox = ( this.container ? this.container : document ).querySelector(".page-main"); scrollBox.scrollTop = (scrollBox.scrollTop / oldVal) * newVal; }, }, }, mounted() { // 默认加载章节 this.showCatalogList = [1]; // 滚动监听节流 this.throttledScrollHandler = _.throttle( this.scrollFun, this.throttleThreshold, { leading: true, trailing: false } ); // 定义子层方法 if (this.setGlobalState) { // 提供页面跳转功能 this.setGlobalState({ gotoPage: (catalog, page) => { this.gotoPage(catalog, page); }, // 渲染笔记、高亮、划线 renderSign: (type, data) => { // 因为调整为页面懒加载，所以渲染标记也需要按照页面进行处理，先储存数据，页面加载完成再渲染对应的标记； this.handelSignData(type, data); // this.renderSign(type, data); }, // 删除笔记、高亮、划线 delSign: (data) => { this.delSign(data); }, // 全文检索 searchBookByKeyword: (keyword) => { return this.searchTextByPage(keyword); }, // 跳转检索结果位置 jumpSearchItem: (data) => { this.searchItemLocation(data); }, }); } // 创建一个新的 Intersection Observer 实例，用于观察目标元素和执行相应的回调函数。 // new IntersectionObserver(callback, options)：使用之前定义的 callback 回调函数和 options 配置选项来初始化 Intersection Observer 实例。 this.observer = new IntersectionObserver(this.pageChangeCallback, { root: null, // 指定根元素，这里设为 null，表示选取整个视窗作为根元素。 rootMargin: "0px", // 指定根元素的边界，这里设为 "0px"，表示根元素的边界和视窗的边界重合 threshold: 0.5, // 指定交叉比例，这里设为 0.5，表示当目标元素一半或更多显示在视窗中时触发回调函数。 }); this.loadPageObserver = new IntersectionObserver(this.loadPageCallback, { root: null, // 指定根元素，这里设为 null，表示选取整个视窗作为根元素。 rootMargin: "0px", // 指定根元素的边界，这里设为 "0px"，表示根元素的边界和视窗的边界重合 threshold: 0, // 指定交叉比例，这里设为 0.5，表示当目标元素一半或更多显示在视窗中时触发回调函数。 }); // 启动页码观察 setTimeout(() => { this.initObservation(); this.initThemeColor(); }, 500); // 测试页面跳转 // setTimeout(() => { // this.gotoPage(2, 163); // }, 500); // const pageDom = (this.container ? this.container : document) // .querySelector("#app") // .querySelectorAll(".page-box"); // 检索 // console.log(this.searchTextByPage("保护内脏器官"), "searchTextByPage"); // 检索跳转 // this.searchItemLocation({ // catalog: 2, // page: 10, // txt: " 运动系统是由骨、骨连结和骨骼肌三部分组成的。全身的骨通过骨连结组成人体骨骼（见图1-1）。骨骼是人体的支架，具有保护内脏器官、供肌肉附着和作为肌肉运动的杠杆等作用。在神经系统的支配下，肌肉收缩牵动所附着的骨绕着关节转动，使身体产生各种动作。所以，运动系统具有运动、支持和保护等功能，幼年时期的骨骼还具有造血功能。 ", // txtIndex: 57 // }); // }, 500); }, methods: { // setZoom1() { // let scale = this.$store.state.qiankun.scale + 10; // const scrollBox = ( // this.container ? this.container : document // ).querySelector(".page-main"); // this.$store.commit("setZoom", scale); // }, // setZoom2() { // let scale = this.$store.state.qiankun.scale - 10; // const scrollBox = ( // this.container ? this.container : document // ).querySelector(".page-main"); // this.$store.commit("setZoom", scale); // }, // 滚动监听 scrollFun(event) { this.handleVideoPicture(); // 判断向上滚动还是向下滚动 if (event.target.scrollTop > this.previousScrollTop) { this.getAduio(); // 向下 const currentScrollTop = event.target.scrollTop + event.target.offsetHeight; if ( currentScrollTop >= event.target.scrollHeight - this.loadThreshold ) { console.log(1); // 到达阈值 if ( this.showCatalogList[this.showCatalogList.length - 1] < this.catalogLength ) { // 加载下一章 this.showCatalogList.push( this.showCatalogList[this.showCatalogList.length - 1] + 1 ); if (this.showCatalogList.length > 3) { // 超过三章隐藏顶部一章 this.showCatalogList.shift(); } } } } else if (event.target.scrollTop < this.previousScrollTop) { this.handleAudio(); // 向上 const currentScrollTop = event.target.scrollTop; if (currentScrollTop <= this.loadThreshold) { // 到达阈值 if (this.showCatalogList[0] > 0) { // 加载上一章 this.showCatalogList.unshift(this.showCatalogList[0] - 1); if (this.showCatalogList.length > 3) { // 超过三章隐藏底部一章 this.showCatalogList.pop(); } } } } // showCatalogList 当前显示的三个章节，watch监听传递给主应用 // 更新上一次滚动的位置 this.previousScrollTop = event.target.scrollTop; }, // 章节、页面跳转 gotoPage(catalog, page) { if (catalog >= 0 && catalog <= this.catalogLength) { // 处理渲染章节 if (catalog == 0) { this.showCatalogList = [0, 1]; } else if (catalog == this.catalogLength) { this.showCatalogList = [ this.catalogLength - 2, this.catalogLength - 1, this.catalogLength, ]; } else { this.showCatalogList = [catalog - 1, catalog, catalog + 1]; } setTimeout(() => { // 跳转页码 const pageDom = ( this.container ? this.container : document ).querySelector(`[page="${page}"]`); if (pageDom) { pageDom.scrollIntoView(); } else { console.log("页码错误！"); } }, 500); } else { console.log("章节错误！"); } }, // 处理标记数据 handelSignData(type, data) { if (this.loadPageList.indexOf(Number(data.page)) > -1) { // 立即渲染 this.renderSign(type, data); } // 储存数据 if (!this.renderSignMap[type]) this.renderSignMap[type] = {}; if (!this.renderSignMap[type][data.page]) this.renderSignMap[type][data.page] = []; this.renderSignMap[type][data.page].push(data); }, // 渲染标记 renderSign(type, data) { // 父层设置禁止渲染标记时不再进行渲染 if (this.$store.state.qiankun.disableSign) { return false; } const existence = ( this.container ? this.container : document ).querySelector(`[dataid="${data.id}"]`); // 去重 if (!existence) { const pageDom = ( this.container ? this.container : document ).querySelector(`[page="${data.page}"]`); // 创建 createTreeWalker 迭代器，用于遍历文本节点，保存到一个数组 const treeWalker = document.createTreeWalker( pageDom, NodeFilter.SHOW_TEXT ); const allTextNodes = []; let currentNode = treeWalker.nextNode(); while (currentNode) { allTextNodes.push(currentNode); currentNode = treeWalker.nextNode(); } for (let i = 0; i < allTextNodes.length; i++) { const textDom = allTextNodes[i]; if (textDom.textContent.indexOf(data.txt) > -1) { let reg = new RegExp(`${data.txt}`, "ig"); switch (type) { case "Highlight": // 高亮 textDom.parentNode.innerHTML = textDom.parentNode.innerHTML.replace( reg, `<span datatype="Highlight" dataid="${data.id}" style="background: ${data.color};" class="highLight" onclick="signClick('Highlight','${data.id}','${data.chapterNum}')">${data.txt}</span>` ); break; case "Dashing": // 划线 textDom.parentNode.innerHTML = textDom.parentNode.innerHTML.replace( reg, `<span datatype="Dashing" dataid="${data.id}" style="text-decoration-color:${data.color};" class="underline" onclick="signClick('Dashing','${data.id}','${data.chapterNum}')">${data.txt}</span>` ); break; case "Note": // 笔记 textDom.parentNode.innerHTML = textDom.parentNode.innerHTML.replace( reg, `<span datatype="Note" dataid="${data.id}" style="border-bottom-color:${data.color}" class="notesline" onclick="signClick('Note','${data.id}','${data.chapterNum}')" onmouseover="noteHover('Note','${data.id}','${data.chapterNum}')" onmouseout="noteOut('Note')">${data.txt}<img src="${NoteIcon}"/></span>` ); break; } } } } }, // 删除标记渲染 delSign({ ids, type }) { if (ids && ids.length) { for (let i = 0; i < ids.length; i++) { const id = ids[i]; const dom = ( this.container ? this.container : document ).querySelector(`[dataid="${id}"]`); dom.parentNode.innerHTML = dom.parentNode.innerHTML.replace( dom.outerHTML, dom.outerText ); } } if (type) { const doms = ( this.container ? this.container : document ).querySelectorAll(`[datatype="${type}"]`); for (let i = 0; i < doms.length; i++) { const dom = doms[i]; dom.parentNode.innerHTML = dom.parentNode.innerHTML.replace( dom.outerHTML, dom.outerText ); } } }, initObservation() { const sections = ( this.container ? this.container : document ).querySelectorAll(".page-box"); sections.forEach((section) => { if (this.config.activeBook && this.config.activeBook.tryPageCount) { const page = section.getAttribute("page"); if (Number(page) > this.config.activeBook.tryPageCount) { let chapterDom = this.getParentWithClass(section, "chapter"); const chapterNum = chapterDom.getAttribute("num"); this.catalogLength = Number(chapterNum) - 1; section.remove(); return false; } } // observer 观察每个元素，以便在它们进入或离开视窗时触发回调函数。 const isObserver = section.getAttribute("observer"); const isLoadObserver = section.getAttribute("loadObserver"); if (!isObserver) { this.observer.observe(section); section.setAttribute("observer", "1"); } if (!isLoadObserver) { this.loadPageObserver.observe(section); section.setAttribute("loadObserver", "1"); } }); }, initThemeColor() { // 获取各种需要主题色的节点 const colorDom = ( this.container ? this.container : document ).querySelectorAll(".theme-color"); const backgroundColorDom = ( this.container ? this.container : document ).querySelectorAll(".theme-back"); const borderColorDom = ( this.container ? this.container : document ).querySelectorAll(".theme-border"); // 获取配置的主题色 const bookThemeColor = this.config.activeBook && this.config.activeBook.bookThemeColor ? this.config.activeBook.bookThemeColor : null; const chapterThemeColor = this.config.activeBook && this.config.activeBook.chapterThemeColor ? this.config.activeBook.chapterThemeColor : null; const pageThemeColor = this.config.activeBook && this.config.activeBook.pageThemeColor ? this.config.activeBook.pageThemeColor : null; colorDom.forEach((domItem) => { // 获取章节、页码 let pageDom = this.getParentWithClass(domItem, "page-box"); let chapterDom = this.getParentWithClass(domItem, "chapter"); let page, chapterNum; if (pageDom) page = pageDom.getAttribute("page"); if (chapterDom) chapterNum = chapterDom.getAttribute("num"); // 向上匹配主题色 const themeColor = page && pageThemeColor && pageThemeColor[page] ? pageThemeColor[page] : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum] ? chapterThemeColor[chapterNum] : bookThemeColor; if (themeColor) { domItem.style.color = themeColor; } }); backgroundColorDom.forEach((domItem) => { // 获取章节、页码 let pageDom = this.getParentWithClass(domItem, "page-box"); let chapterDom = this.getParentWithClass(domItem, "chapter"); let page, chapterNum; if (pageDom) page = pageDom.getAttribute("page"); if (chapterDom) chapterNum = chapterDom.getAttribute("num"); // 向上匹配主题色 const themeColor = page && pageThemeColor && pageThemeColor[page] ? pageThemeColor[page] : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum] ? chapterThemeColor[chapterNum] : bookThemeColor; if (themeColor) { domItem.style.backgroundColor = themeColor; } }); borderColorDom.forEach((domItem) => { // 获取章节、页码 let pageDom = this.getParentWithClass(domItem, "page-box"); let chapterDom = this.getParentWithClass(domItem, "chapter"); let page, chapterNum; if (pageDom) page = pageDom.getAttribute("page"); if (chapterDom) chapterNum = chapterDom.getAttribute("num"); // 向上匹配主题色 const themeColor = page && pageThemeColor && pageThemeColor[page] ? pageThemeColor[page] : chapterNum && chapterThemeColor && chapterThemeColor[chapterNum] ? chapterThemeColor[chapterNum] : bookThemeColor; if (themeColor) { domItem.style.borderColor = themeColor; } }); }, getParentWithClass(element, className) { while (element.parentElement) { element = element.parentElement; if (element.classList.contains(className)) { return element; } } }, pageChangeCallback(entries, observer) { //entries：代表观察到的目标元素的集合。 observer：代表观察者对象。 entries.forEach((entry) => { //entry.isIntersecting：检查当前目标元素是否与根元素相交。 if (entry.isIntersecting) { const target = entry.target; //entry.target：获取当前目标元素 const page = target.getAttribute("page"); const catalogDom = this.tool.getParentNodeByClassName( target, "chapter" ); const catalog = catalogDom.getAttribute("num"); let text = null; if (target.querySelector("p")) { text = target.querySelector("p").textContent.substring(0, 50); } // 返回页码和章节信息 if (this.$store.state.qiankun && this.$store.state.qiankun.pageChange) this.$store.state.qiankun.pageChange({ page: page, catalog: catalog, text, }); // const sections = Array.from(document.querySelectorAll(".section")); //sections：获取所有具有 .section 类名的元素，并转换为数组。 // let index = sections.findIndex((section) => section === target) + 1; //index：查找当前目标元素在 sections 数组中的索引，并加 1，用于确定当前页码。 } }); }, loadPageCallback(entries, observer) { entries.forEach(async (entry) => { if (entry.isIntersecting) { const target = entry.target; const page = target.getAttribute("page"); if (this.loadPageList.indexOf(Number(page)) == -1) { const catalogDom = this.tool.getParentNodeByClassName( target, "chapter" ); // 添加页码 this.loadPageList.push(Number(page)); const catalog = catalogDom.getAttribute("num"); if (!this.questionDataMap[page]) { if (testData && testData[catalog]) { if (testData[catalog][page]) { if (Array.isArray(testData[catalog][page])) { this.questionDataMap[page] = await getQuestionList( page, testData[catalog][page], this.config.ceShiActiveBook ); } else { const obj = {}; for (let key in testData[catalog][page]) { obj[key] = await getQuestionList( [], testData[catalog][page][key], this.config.ceShiActiveBook ); } this.questionDataMap[page] = obj; } console.log("题目", this.questionDataMap); } } } // 渲染这一页的标记 for (const key in this.renderSignMap) { if (this.renderSignMap[key][page]) { this.renderSignMap[key][page].forEach((item) => { this.renderSign(key, item); }); } } // 处理高亮 if (this.highlightData) { // 高亮行 setTimeout(() => { // 获取页面所有text节点 const pageTextList = document.createTreeWalker( target, NodeFilter.SHOW_TEXT ); // 匹配关键字 const allPageTextNodes = []; let currentNode = pageTextList.nextNode(); while (currentNode) { allPageTextNodes.push(currentNode); currentNode = pageTextList.nextNode(); } for (let i = 0; i < allPageTextNodes.length; i++) { const textDom = allPageTextNodes[i]; let txtIndex = textDom.textContent.indexOf( this.highlightData.txt ); if (txtIndex > -1) { textDom.parentNode.style.transition = "background-color 0.8s"; textDom.parentNode.scrollIntoView(); textDom.parentNode.style.backgroundColor = "#79bbf0"; setTimeout(() => { textDom.parentNode.style.backgroundColor = ""; }, 1000); } } }, 100); } if (this.loadPageList.length > 5) { // 超过5页 this.loadPageList.shift(); } } } }); }, initSwiper() { const doms = ( this.container ? this.container : document ).querySelectorAll(".swiper-img"); for (let i = 0; i < doms.length; i++) { const dom = doms[i]; new Swiper(dom, { loop: false, // 无缝 autoplay: { //自动开始 delay: 3000, //时间间隔 disableOnInteraction: false, //*手动操作轮播图后不会暂停* }, paginationClickable: true, slidesPerView: 1, // 一组三个 spaceBetween: 30, // 间隔 // 如果需要前进后退按钮 navigation: { nextEl: dom.querySelector(".swiper-button-next"), prevEl: dom.querySelector(".swiper-button-prev"), }, // 窗口变化,重新init,针对F11全屏和放大缩小,必须加 // observer: true, // observeParents: true // // 如果需要分页器 // pagination: { // el: (this.container ? this.container : document).querySelector( // ".swiper-pagination" // ), // clickable: true // 分页器可以点击 // } }); } const pptDoms = ( this.container ? this.container : document ).querySelectorAll(".swiper_ppt"); for (let i = 0; i < pptDoms.length; i++) { const dom = pptDoms[i]; new Swiper(dom, { loop: false, // 无缝 autoplay: false, paginationClickable: true, slidesPerView: 1, // 一组三个 spaceBetween: 30, // 间隔 // 如果需要前进后退按钮 navigation: { nextEl: dom.querySelector(".swiper-button-next"), prevEl: dom.querySelector(".swiper-button-prev"), }, // 窗口变化,重新init,针对F11全屏和放大缩小,必须加 observer: true, observeParents: true, on: { init: (value) => { let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数） let totalPages = value.slides.length; // 获取总页数 var paginationInfoEl = dom.querySelector(".pageBox"); if (paginationInfoEl) paginationInfoEl.textContent = currentPage + "/" + totalPages; }, slideChange: (value) => { let currentPage = value.activeIndex + 1; // 获取当前页（从1开始计数） let totalPages = value.slides.length; // 获取总页数 var paginationInfoEl = dom.querySelector(".pageBox"); if (paginationInfoEl) paginationInfoEl.textContent = currentPage + "/" + totalPages; }, }, }); } }, initViewer() { const doms = ( this.container ? this.container : document ).querySelectorAll(".openImgBox"); for (let i = 0; i < doms.length; i++) { const dom = doms[i]; new Viewer(dom, { container: this.container ? this.container.querySelector("#app") : "body", navbar: true, // 显示导航栏 toolbar: true, // 显示工具栏 title: true, // 显示标题 }); } }, // 根据关键字全文检索 searchTextByPage(keyword) { const searchResult = []; let catalogIndex = 0; // 所有章节组件（每本书制作时单独配置） const pageData = { pageHeader, // chapterOne, // chapterTwo, // chapterThree, // chapterFour, chapterFive, }; // 遍历所有章节文件 for (const key in pageData) { catalogIndex++; let pageComponent, pageExample; // 先渲染一次当前章节文件（这时页面的内容为空），获取页码信息 pageComponent = Vue.extend(pageData[key]); pageExample = new pageComponent({ propsData: { showPageList: [], questionData: {}, isSearch: true, }, }); pageExample.$mount( (this.container ? this.container : document).querySelector( "#searchContent" ) ); // 获取页码 const pageDom = (this.container ? this.container : document) .querySelector("#searchDomBox") .querySelectorAll(".page-box"); const pages = []; for (let i = 0; i < pageDom.length; i++) { const pageDomItem = pageDom[i]; pages.push(Number(pageDomItem.getAttribute("page"))); } // 获取页面结束，卸载销毁 pageExample.$destroy(); (this.container ? this.container : document).querySelector( "#searchDomBox" ).innerHTML = '<div id="searchContent"></div>'; // 遍历页码 if (pages.length) { for (let i = 0; i < pages.length; i++) { const pageNum = pages[i]; // 动态渲染对应章节的页码 pageComponent = Vue.extend(pageData[key]); pageExample = new pageComponent({ propsData: { showPageList: [pageNum], questionData: {}, isSearch: true, }, }); pageExample.$mount( (this.container ? this.container : document).querySelector( "#searchContent" ) ); // 获取对应页面dom const thisPageDom = (this.container ? this.container : document) .querySelector("#searchDomBox") .querySelector(`[page="${pageNum}"]`); if (thisPageDom) { // 获取页面所有text节点 const pageTextList = document.createTreeWalker( thisPageDom, NodeFilter.SHOW_TEXT ); // 匹配关键字 const allPageTextNodes = []; let currentNode = pageTextList.nextNode(); while (currentNode) { allPageTextNodes.push(currentNode); currentNode = pageTextList.nextNode(); } for (let i = 0; i < allPageTextNodes.length; i++) { const textDom = allPageTextNodes[i]; let txtIndex = textDom.textContent.indexOf(keyword); if (txtIndex > -1) { // 记录关键字所在页码、章节以及匹配到的段落 searchResult.push({ page: pageNum, catalog: catalogIndex, txt: textDom.textContent, txtIndex: txtIndex, }); } } // 结束，卸载销毁 pageExample.$destroy(); (this.container ? this.container : document).querySelector( "#searchDomBox" ).innerHTML = '<div id="searchContent"></div>'; } } } } // 输出搜索结果 console.log(searchResult); return searchResult; }, // 根据检索结果跳转对应位置并高亮 searchItemLocation(data) { // 记录高亮信息 this.highlightData = data; // 跳转 this.gotoPage(data.catalog, data.page, () => { }); }, // 页面向下滚动，音频小窗播放功能 getAduio() { let allVideo = ( this.container ? this.container : document ).querySelectorAll(".audio"); allVideo = Array.from(allVideo); this.videoList = allVideo; if (allVideo.length) { // 查找播放状态的最后一条音频 const playAudio = allVideo .reverse() .find((item) => item.paused == false); if (playAudio) { const bottomGap = playAudio.getBoundingClientRect().bottom; if (bottomGap < 0) { playAudio.pause(); this.audioPath = playAudio.src; this.currentTime = playAudio.currentTime; } } } }, // 页面向上滚动，音频小窗回收 handleAudio() { if (!this.audioPath) return false; let allVideo = ( this.container ? this.container : document ).querySelectorAll(".audio"); allVideo = Array.from(allVideo); if (allVideo.length) { //查找与小窗播放音频同源的页面audio DOM const playAudio = allVideo.find((item) => item.src == this.audioPath); if (playAudio) { const bottomGap = playAudio.getBoundingClientRect().bottom; if (bottomGap >= 0) { if (this.$refs.audioPlayer) { const playerState = this.$refs.audioPlayer.getVideoPlayer(); this.audioPath = ""; playAudio.currentTime = playerState.currentTime; if (!playerState.paused) playAudio.play(); } } } } }, // 关闭mini video closeMiniAudio() { this.audioPath = ""; }, // 点击音频播放，关闭其他音频 closeAudio() { let allAudio = ( this.container ? this.container : document ).querySelectorAll(".audio"); for (let index = 0; index < allAudio.length; index++) { const item = allAudio[index]; item.addEventListener("play", () => { const audioList = Array.from(allAudio); for (let cindex = 0; cindex < audioList.length; cindex++) { const citem = audioList[cindex]; if (citem.currentSrc != item.src) { citem.pause(); } } this.closeMiniAudio(); }); } }, // 点击视频关闭其他 closeVideo() { let allVideo = ( this.container ? this.container : document ).querySelectorAll(".video"); for (let index = 0; index < allVideo.length; index++) { const item = allVideo[index]; item.addEventListener("playing", (item) => { const path = item.srcElement.src; const videoList = Array.from(allVideo); for (let cindex = 0; cindex < videoList.length; cindex++) { const citem = videoList[cindex]; if (citem.currentSrc != path && path) { citem.pause(); } } }); } }, // 视频小窗 handleVideoPicture() { let doms = (this.container ? this.container : document).querySelectorAll( ".video" ); doms = Array.from(doms); if (!doms.length) return false; const playVudio = doms.reverse().find((item) => item.paused == false); if (playVudio) { const bottomGap = playVudio.getBoundingClientRect().bottom; const topGap = playVudio.getBoundingClientRect().top; if (bottomGap < 0 || topGap > window.innerHeight) { try { if (playVudio.readyState) playVudio.requestPictureInPicture(); } catch (error) { console.log(error, "小窗错误error"); } } } }, //其他类名下字体大小变化 transformDom(fs) { if (!fs) return; let doms = (this.container ? this.container : document).querySelectorAll( ".block" ); if (!doms.length) return; for (let index = 0; index < doms.length; index++) { const dom = doms[index]; dom.style.fontSize = fs + "px"; } }, }, components: { pageHeader, // chapterOne, // chapterTwo, // chapterThree, // chapterFour, chapterFive, }, }; </script> <style lang="less" scoped> .page-main { width: 100% !important; height: 100% !important; overflow: auto; .page-content { max-width: 816px; min-width: 375px; margin: 0 auto; padding-bottom: 100px; } } </style> src/books/textToddlerSportsSafetyProtection/view/index.vue
New file @@ -0,0 +1,80 @@ <template> <div class="toddlerSportsSafetyProtection" @mouseup="handleMouseUp"> <pageContent></pageContent> </div> </template> <script> import pageContent from "./components/index.vue"; export default { name: "toddlerSportsSafetyProtection", components: { pageContent, }, computed: { fontSize() { return this.$store.state.qiankun.fontSize; }, pageZoom() { return this.$store.state.qiankun.scale / 100; }, }, methods: { getParentWithClass(element, className) { while (element.parentElement) { element = element.parentElement; if (element.classList.contains(className)) { return element; } } }, handleMouseUp(e) { const selection = ( this.container ? this.container : window ).getSelection(); const txt = selection.toString(); if (selection.type != "none" && txt) { let node = selection.anchorNode.parentNode; let pageHtml = this.getParentWithClass( selection.anchorNode, "page-box" ); let chapterDom = this.getParentWithClass( selection.anchorNode, "chapter" ); let chapterNum; if (chapterDom) chapterNum = chapterDom.getAttribute("num"); if (pageHtml) { const page = pageHtml.getAttribute("page"); // 监听选中文本事件，并触发父层方法 if (this.$store.state.qiankun.windowSelection) { this.$store.state.qiankun.windowSelection({ chapterNum, txt, page, x: e.x, y: e.y, }); } } } else { if (this.$store.state.qiankun.windowSelection) { this.$store.state.qiankun.windowSelection({ chapterNum: "", txt: "", page: "", x: e.x, y: e.y, }); } } }, }, }; </script> <style lang="less"> @import "../assets/main.less"; </style> src/books/toddlerSportsSafetyProtection/view/components/index.vue
@@ -186,22 +186,9 @@ }, 500); // 测试页面跳转 // setTimeout(() => { // this.gotoPage(2, 185); // setTimeout(() => { // this.renderSign("Highlight", { // id: "2ACA9359", // txt: "题一学习主题一 运动", // page: "10", // type: "Highlight", // color: "#F5E12A" // }); // setTimeout(() => { // this.delSign({ // ids: ["2ACA9359"] // }); // }, 2000); // }, 500); setTimeout(() => { this.gotoPage(2, 184); }, 500); // const pageDom = (this.container ? this.container : document) // .querySelector("#app") @@ -581,6 +568,7 @@ testData[catalog][page], this.config.activeBook ); debugger } else { const obj = {}; for (let key in testData[catalog][page]) {
