From 97eb19017a3f43d3fa1210b8be54807d1ec9de81 Mon Sep 17 00:00:00 2001 From: zhongshujie <2862698242@qq.com> Date: 星期三, 23 十月 2024 18:16:18 +0800 Subject: [PATCH] 字体更改 --- src/books/civilAviationServices/assets/images/fengdi.png | 0 src/books/civilAviation/view/components/header.vue | 64 src/books/civilAviationServices/view/components/header.vue | 195 ++++ src/books/civilAviationServices/assets/Fonts/FZLTZHJW.ttf | 0 src/books/civilAviationServices/assets/Fonts/FZHTJW.ttf | 0 src/books/civilAviationServices/assets/main.less | 1358 ++++++++++++++++++++++++++++++ src/App.vue | 5 src/books/civilAviationServices/assets/Fonts/FZLTXIHJW.ttf | 0 src/books/civilAviationServices/view/components/index.vue | 950 +++++++++++++++++++++ src/books/civilAviation/assets/main.less | 19 src/books/civilAviationServices/assets/images/feiye.png | 0 src/books/civilAviationServices/assets/images/fengmian.png | 0 12 files changed, 2,558 insertions(+), 33 deletions(-) diff --git a/src/App.vue b/src/App.vue index 980e04b..4603252 100644 --- a/src/App.vue +++ b/src/App.vue @@ -10,6 +10,7 @@ <mathBook v-if="activeBook.name == 'mathBook'"></mathBook> <botany v-if="activeBook.name == 'botany'"></botany> <civilAviation v-if="activeBook.name == 'civilAviation'"></civilAviation> + <civilAviationServices v-if="activeBook.name == 'civilAviationServices'"></civilAviationServices> </div> </template> @@ -26,7 +27,8 @@ mathBook: () => import("./books/mathBook/view/index.vue"), artAndDrama: () => import("./books/artAndDrama/view/index.vue"), botany: () => import("./books/botany/view/index.vue"), - civilAviation: () => import("./books/civilAviation/view/index.vue") + civilAviation: () => import("./books/civilAviation/view/index.vue"), + civilAviationServices: () =>import("./books/civilAviationServices/view/index.vue"), }, data() { return { @@ -64,6 +66,7 @@ // artAndDrama // mathBook // civilAviation + // civilAviationServices this.activeBook = await this.config.getBookConfig( process.env.VUE_APP_RESOURCE_CTX + (process.env.VUE_APP_ENV == "product" diff --git a/src/books/civilAviation/assets/main.less b/src/books/civilAviation/assets/main.less index 8a16174..4a9ceb5 100644 --- a/src/books/civilAviation/assets/main.less +++ b/src/books/civilAviation/assets/main.less @@ -28,7 +28,11 @@ } .mt-20 { - margin-top: 30px; + margin-top: 20px !important; + } + + .mt-30 { + margin-top: 30px ; } .mb-10 { @@ -695,6 +699,19 @@ text-indent: 0em; } + + + .left{ + text-indent: 0em; + margin: 0 !important; + line-height: 20px; + } + + .left3{ + margin: 20 0 0 0 !important; + line-height: 20px; + } + .left2 { font-size: 1.3em; text-indent: 0em; diff --git a/src/books/civilAviation/view/components/header.vue b/src/books/civilAviation/view/components/header.vue index cb28251..dabe112 100644 --- a/src/books/civilAviation/view/components/header.vue +++ b/src/books/civilAviation/view/components/header.vue @@ -1,7 +1,7 @@ <template> <div class="chapter" num="1"> <!-- 灏侀潰 --> - <div class="page-box mt-20" page="1" style="min-height: auto"> + <div class="page-box mt-30" page="1" style="min-height: auto"> <div v-if="showPageList.indexOf(1) > -1"> <img class="img-0" alt="" src="../../assets/images/fengmian.png" /> </div> @@ -17,38 +17,40 @@ <div v-if="showPageList.indexOf(3) > -1"> <div style="max-width: 400px; margin: 0 auto; padding: 10% 0;"> <hr /> - <p><b>鍥句功鍦ㄧ増缂栫洰锛圕IP锛夋暟鎹�</b></p> - <p>姘戣埅姒傝/榄忓叏鏂屼富缂�.鈥�2鐗�.鈥斿寳浜細鍖椾含甯堣寖澶у鍑虹増绀撅紝2024.8</p> - <p>ISBN 978-7-303-29412-1</p> - <p>鈪�.鈶犳皯鈥� 鈪�.鈶犻瓘鈥� 鈪�.鈶犳皯鐢ㄨ埅绌�-鏁欐潗 鈪�.鈶燰2鈶56</p> - <p>涓浗鍥藉鐗堟湰棣咰IP鏁版嵁鏍稿瓧锛�2023锛夌195092鍙�</p> + <p class=""><b>鍥句功鍦ㄧ増缂栫洰锛圕IP锛夋暟鎹�</b></p> + <p class="left3 block mr-0">姘戣埅姒傝/榄忓叏鏂屼富缂�.鈥�2鐗�.鈥斿寳浜細鍖椾含甯堣寖澶у鍑虹増绀撅紝2024.8</p> + <p class="left3 block">ISBN 978-7-303-29412-1</p> + <p class="left3 block mt-20">鈪�.鈶犳皯鈥� 鈪�.鈶犻瓘鈥� 鈪�.鈶犳皯鐢ㄨ埅绌�-鏁欐潗 鈪�.鈶燰2鈶56</p> + <p class="left3 block">涓浗鍥藉鐗堟湰棣咰IP鏁版嵁鏍稿瓧锛�2023锛夌195092鍙�</p> <hr /> <p><br /></p> - <p class="left">鏁欐潗鎰忚鍙嶉銆�zhijiao@bnupg.com</p> - <p class="left">钀ラ攢涓績鐢佃瘽銆�010-58802755 58800035</p> - <p class="left">缂栬緫閮ㄧ數璇濄��銆�010-58802751</p> + <p><br /></p> + <p><br /></p> + <p class="left block mt-20">鏁欐潗鎰忚鍙嶉銆�zhijiao@bnupg.com</p> + <p class="left block">钀ラ攢涓績鐢佃瘽銆�010-58802755 58800035</p> + <p class="left block">缂栬緫閮ㄧ數璇濄��銆�010-58802751</p> <hr /> - <p class="left">鍑虹増鍙戣锛氬寳浜笀鑼冨ぇ瀛﹀嚭鐗堢ぞ www.bnupg.com</p> - <p class="left">銆�銆�銆�銆�銆�鍖椾含甯傝タ鍩庡尯鏂拌鍙e澶ц12-3鍙�</p> - <p class="left">銆�銆�銆�銆�銆�閭斂缂栫爜锛�100088</p> - <p class="left">鍗般��銆�鍒凤細浼樺浠曞嵃鍒锋渤鍖楁湁闄愬叕鍙�</p> - <p class="left">缁忋��銆�閿�锛氬叏鍥芥柊鍗庝功搴�</p> - <p class="left">寮�銆�銆�鏈細889mm脳1194mm銆�1/16</p> - <p class="left">鍗般��銆�寮狅細14.5</p> - <p class="left">瀛椼��銆�鏁帮細245鍗冨瓧</p> - <p class="left">鐗堛��銆�娆★細2024骞�8鏈堢2鐗�</p> - <p class="left">鍗般��銆�娆★細2024骞�8鏈堢1娆″嵃鍒�</p> - <p class="left">瀹氥��銆�浠凤細45.00鍏�</p> + <p class="left block">鍑虹増鍙戣锛氬寳浜笀鑼冨ぇ瀛﹀嚭鐗堢ぞ www.bnupg.com</p> + <p class="left block">銆�銆�銆�銆�銆�鍖椾含甯傝タ鍩庡尯鏂拌鍙e澶ц12-3鍙�</p> + <p class="left block">銆�銆�銆�銆�銆�閭斂缂栫爜锛�100088</p> + <p class="left block">鍗般��銆�鍒凤細浼樺浠曞嵃鍒锋渤鍖楁湁闄愬叕鍙�</p> + <p class="left block">缁忋��銆�閿�锛氬叏鍥芥柊鍗庝功搴�</p> + <p class="left block">寮�銆�銆�鏈細889mm脳1194mm銆�1/16</p> + <p class="left block">鍗般��銆�寮狅細14.5</p> + <p class="left block">瀛椼��銆�鏁帮細245鍗冨瓧</p> + <p class="left block">鐗堛��銆�娆★細2024骞�8鏈堢2鐗�</p> + <p class="left block">鍗般��銆�娆★細2024骞�8鏈堢1娆″嵃鍒�</p> + <p class="left block">瀹氥��銆�浠凤細45.00鍏�</p> <hr /> - <p class="left">绛栧垝缂栬緫锛氱帇浜戣嫳銆�璐d换缂栬緫锛氬畨銆�鍋�</p> - <p class="left">缇庢湳缂栬緫锛氱劍銆�涓姐��瑁呭抚璁捐锛氱劍銆�涓�</p> - <p class="left">璐d换鏍″锛氶檲銆�姘戙��璐d换鍗板埗锛氶┈銆�娲併��璧点��榫�</p> - <p class="center"><b>鐗堟潈鎵�鏈夈��渚垫潈蹇呯┒</b></p> - <p class="center"><b>鍙嶇洍鐗堛�佷镜鏉冧妇鎶ョ數璇濓細010-58800697</b></p> - <p class="center">鍖椾含璇昏�呮湇鍔¢儴鐢佃瘽锛�010-58808104</p> - <p class="center">澶栧煚閭喘鐢佃瘽锛�010-58808083</p> - <p class="center">鏈功濡傛湁鍗拌璐ㄩ噺闂锛岃涓庡嵃鍒剁鐞嗛儴鑱旂郴璋冩崲銆�</p> - <p class="center">鍗板埗绠$悊閮ㄧ數璇濓細010-58808284</p> + <p class="left block">绛栧垝缂栬緫锛氱帇浜戣嫳銆�銆�銆�璐d换缂栬緫锛氬畨銆�鍋�</p> + <p class="left block">缇庢湳缂栬緫锛氱劍銆�涓姐��銆�銆�瑁呭抚璁捐锛氱劍銆�涓�</p> + <p class="left block">璐d换鏍″锛氶檲銆�姘戙��銆�銆�璐d换鍗板埗锛氶┈銆�娲併��璧点��榫�</p> + <p class=" center mt-20"><b>鐗堟潈鎵�鏈夈��渚垫潈蹇呯┒</b></p> + <p class="left center"> <b>鍙嶇洍鐗堛�佷镜鏉冧妇鎶ョ數璇濓細</b><span class="block">010-58808104</span></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> </div> </div> @@ -63,11 +65,11 @@ <p class="center"><span class="zt-ls1">涓汇��浠�</span></p> <p class="block fz-14">榄忓叏鏂屻��鍥涘窛瑗垮崡鑸┖鑱屼笟瀛﹂櫌 鑽h獕闄㈤暱銆佺爺绌跺憳</p> <p class="block fz-14">銆�銆�銆�銆�鍥涘窛娉涚編鏁欒偛鎶曡祫闆嗗洟鏈夐檺璐d换鍏徃 钁d簨闀�</p> - <p class="center mt-20"><span class="zt-ls1">鍓富浠�</span></p> + <p class="center mt-30"><span class="zt-ls1">鍓富浠�</span></p> <p class="block fz-14">鏉ㄦ柊婀︺��涓浗姘戣埅澶у 鍓牎闀裤�佹暀鎺�</p> <p class="block fz-14">鍙躲��鑰掋��涓浗鍟嗙敤椋炴満鏈夐檺璐d换鍏徃鍥涘窛鍒嗗叕鍙� 鎬荤粡鐞嗗姪鐞嗐�佷汉鍔涜祫婧愰儴閮ㄩ暱</p> <p class="block fz-14">鐜嬫捣娑涖��鎴愰兘鑸┖鏈夐檺鍏徃 浜哄姏璧勬簮閮ㄦ�荤粡鐞�</p> - <p class="center mt-20"><span class="zt-ls1">濮斻��鍛�</span></p> + <p class="center mt-30"><span class="zt-ls1">濮斻��鍛�</span></p> <p class="block fz-14">閮鼎澶忋��涓浗姘戣埅澶у 鏁欐巿</p> <p class="block fz-14">闄堢帀鍗庛��鎴愰兘鑸┖鑱屼笟鎶�鏈闄� 鏁欐巿</p> <p class="block fz-14">瑁存槑瀛︺��鍥涘窛瑗垮崡鑸┖鑱屼笟瀛﹂櫌 闄㈤暱銆佺爺绌跺憳</p> diff --git a/src/books/civilAviationServices/assets/Fonts/FZHTJW.ttf b/src/books/civilAviationServices/assets/Fonts/FZHTJW.ttf new file mode 100644 index 0000000..0e8a216 --- /dev/null +++ b/src/books/civilAviationServices/assets/Fonts/FZHTJW.ttf Binary files differ diff --git a/src/books/civilAviationServices/assets/Fonts/FZLTXIHJW.ttf b/src/books/civilAviationServices/assets/Fonts/FZLTXIHJW.ttf new file mode 100644 index 0000000..e3c7f7c --- /dev/null +++ b/src/books/civilAviationServices/assets/Fonts/FZLTXIHJW.ttf Binary files differ diff --git a/src/books/civilAviationServices/assets/Fonts/FZLTZHJW.ttf b/src/books/civilAviationServices/assets/Fonts/FZLTZHJW.ttf new file mode 100644 index 0000000..ef5ec15 --- /dev/null +++ b/src/books/civilAviationServices/assets/Fonts/FZLTZHJW.ttf Binary files differ diff --git a/src/books/civilAviationServices/assets/images/feiye.png b/src/books/civilAviationServices/assets/images/feiye.png new file mode 100644 index 0000000..8af8387 --- /dev/null +++ b/src/books/civilAviationServices/assets/images/feiye.png Binary files differ diff --git a/src/books/civilAviationServices/assets/images/fengdi.png b/src/books/civilAviationServices/assets/images/fengdi.png new file mode 100644 index 0000000..c4e989d --- /dev/null +++ b/src/books/civilAviationServices/assets/images/fengdi.png Binary files differ diff --git a/src/books/civilAviationServices/assets/images/fengmian.png b/src/books/civilAviationServices/assets/images/fengmian.png new file mode 100644 index 0000000..a56c983 --- /dev/null +++ b/src/books/civilAviationServices/assets/images/fengmian.png Binary files differ diff --git a/src/books/civilAviationServices/assets/main.less b/src/books/civilAviationServices/assets/main.less index e69de29..afaf281 100644 --- a/src/books/civilAviationServices/assets/main.less +++ b/src/books/civilAviationServices/assets/main.less @@ -0,0 +1,1358 @@ +.civilAviationServices-book { + width: 100%; + height: 100%; + + // 鑷畾涔夊唴瀹� + .page-box { + box-sizing: border-box; + min-height: 1128px; + margin-bottom: 20px; + box-shadow: 0 3px 6px 1px #00000029; + background-color: #fff; + } + + .c-g{ + color: green; + } + + .c-r{ + color: red; + } + + .t-right { + text-align: right; + } + + .mr-0 { + margin: 0 !important; + } + + .mt-20 { + margin-top: 30px; + } + + .mb-10 { + margin-bottom: 10px; + } + + .pd-5 { + padding: 0 5px; + } + + .w100 { + width: 100%; + } + + .w80 { + width: 80%; + } + + .fz-13 { + font-size: 13px !important; + } + + .fz-14 { + font-size: 14px !important; + } + + .fz-16 { + font-size: 16px !important; + } + + .fz-18 { + font-size: 18px !important; + } + + + .img-0 { + width: 100%; + } + + .img-c { + width: 70%; + } + + .pt-20 { + padding-top: 20px; + } + + .td-0 { + text-indent: 0em; + } + + .fl { + display: flex; + } + + .ju-cn { + justify-content: center; + } + + .ju-ev { + justify-content: space-evenly; + } + + .fd-c { + flex-direction: column; + } + + .fd-r { + flex-direction: row-reverse; + } + + .al-c { + align-items: center; + } + + .ac-f { + align-content: flex-end; + } + + .jc-fe { + justify-content: flex-end; + } + + .jc-c { + justify-content: center; + } + + .jc-sa{ + justify-content: space-around + } + + .mr-70 { + margin-right: 70px; + } + + .mr-10 { + margin-right: 10px; + } + + .pad-t-55 { + padding-top: 55px; + } + + .pad-l-60 { + padding-left: 60px; + } + + .mb-45 { + margin-bottom: 45px; + } + + .headerImg { + width: 30px; + } + + .headerText { + font-size: 12px; + padding: 0 8px; + color: #B98C64; + } + + .headerNumber { + color: #231F20; + font-size: 12px; + padding: 0 8px; + border-left: 1px solid #231F20; + } + + .header-left-Number { + color: #231F20; + font-size: 12px; + padding-right: 8px; + border-right: 1px solid #000; + } + + .header-left-text { + margin-left: 8px; + font-size: 12px; + color: #fff; + background-color: #0082D4; + } + + .table-tr-bc { + color: #fff; + } + + .task { + width: 12%; + margin-bottom: 5em; + margin-top: 0; + border-top: 0.7em solid #5192C6; + } + + .p-odd { + padding-right: 10%; + } + + .p-even { + padding-left: 10%; + } + + .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; + } + } + + .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; + } + } + + 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: 120px; + float: left; + height: auto; + margin: auto; + margin-top: 12px; + margin-right: 20px; + } + + .imgBox-003 { + width: 100%; + height: 280px; + margin-bottom: 18px; + } + + // 棰樼洰 + .textarea-box { + background-color: transparent; + margin-left: 80px; + max-width: 85%; + min-width: 85%; + 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; + } + + // 杩佺Щ + .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 { + font-family: 'FZLTXIHJW'; + text-align: justify; + margin: 0 82px; + padding-bottom: 80px; + line-height: 30px; + } + + // .bodystyle-left{ + // margin: 0 120px 0 82px; + // padding-bottom: 80px; + // } + + // .bodystyle-right{ + // font-family: 'FZLTXIHJW'; + // font-size: 18px; + // text-align: justify; + // margin: 0 82px 0 120px; + // padding-bottom: 80px; + // line-height: 30px; + // } + + 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; + } + + div.sgc-toc-level-1 { + margin-left: 0em; + } + + div.sgc-toc-level-2 { + margin-left: 2em; + } + + div.sgc-toc-level-3 { + margin-left: 2em; + } + + div.sgc-toc-level-4 { + margin-left: 2em; + } + + div.sgc-toc-level-5 { + margin-left: 2em; + } + + div.sgc-toc-level-6 { + margin-left: 2em; + } + + .imz { + height: 96%; + text-align: center; + + + } + + .note { + font-size: 0.85em; + } + + + .block { + font-family: "瀹嬩綋"; + margin-top: 0.2em; + margin-bottom: 0.2em !important; + text-indent: 2em; + line-height: 30px; + font-size: 16px; + text-align: justify; + } + + .block1 { + text-align: center; + } + + .img { + font-family: 'FZLTXIHJW'; + text-align: center; + font-size: 0.85em; + 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: 0.2em; + margin-bottom: 0.2em !important; + text-indent: 2em; + line-height: 30px; + // font-size: 18px; + 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; + line-height: 20px; + } + + .left2 { + font-size: 1.3em; + text-indent: 0em; + font-weight: bold; + margin-left: 0%; + margin-right: 0%; + } + + .right { + text-align: right; + margin-left: 0%; + margin-right: 0%; + } + + .left1 { + text-indent: 0em; + margin-left: 0%; + margin-right: 0%; + } + + .center1 { + text-align: center; + margin-left: 0%; + margin-right: 0%; + font-size: 1.2em; + text-indent: 0em; + font-weight: bold; + } + + .right1 { + text-align: right; + margin-left: 0%; + margin-right: 0%; + } + + .quote { + margin-top: 0%; + margin-bottom: 0%; + margin-left: 1em; + margin-right: 1em; + text-align: justify; + font-family: "cnepub", serif; + } + + h1 { + font-family: 'FZLTZHJW'; + font-weight: 100; + font-size: 2em; + color: #F0855B; + margin-top: 0.2em; + margin-bottom: 0.2em; + text-indent: 0em; + } + + .front { + font-family: 'FZLTZHJW'; + font-weight: 400; + font-size: 1.1em; + color: #000; + margin-top: 1.5em; + margin-bottom: 3em; + text-indent: 0em; + text-align: center; + } + + + h2 { + font-family: 'FZLTZHJW'; + line-height: 2em; + font-weight: bold; + color: #5192C6; + font-size: 1.3em; + margin-bottom: 0.5cm; + margin-top: 0.5cm; + } + + h3 { + font-family: 'FZHTJW'; + color: #5192C6; + font-weight: 300; + font-size: 1.2em; + margin-top: 1.5em; + margin-bottom: 5px; + text-indent: 0em; + } + + h4 { + font-family: 'FZHTJW'; + color: #5192C6; + font-weight: 400; + font-size: 1.1em; + margin-bottom: 1.2em; + margin-top: 1.2em; + margin-left: 0em; + text-indent: 0em; + } + + h5 { + font-family: 'FZHTJW'; + color: #5192C6; + text-align: left; + font-weight: 400; + margin-bottom: 0.5em; + margin-top: 0.5em; + font-size: 0.9em; + text-indent: 0em; + } + + h6 { + + font-family: 'FZHTJW'; + font-weight: bold; + margin-bottom: 0.5em; + margin-top: 2em; + font-size: 1em; + text-indent: 2em; + } + + .zt-h6 { + + font-family: 'FZHTJW'; + color: #65C097; + margin-bottom: 0.5em; + margin-top: 1em; + font-size: 1.15em; + text-indent: 2em; + } + + .bb { + + font-family: "cnepub", serif; + font-family: 'FZHTJW'; + color: #66CCCC; + font-size: 1.1em; + margin-top: 10px; + text-indent: 2em; + margin-bottom: 10px; + border-bottom: 5px dotted #F4C388; + margin-left: 2em; + margin-bottom: 0.5em; + text-indent: 0em; + } + + .u { + + text-decoration: underline; + } + + .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-i { + width: 10%; + } + + .img-j { + width: 5%; + } + + .img-zt { + height: 6em; + margin-top: -1.5em; + margin-bottom: -0.4em; + margin-left: 15%; + } + + .inline { + height: 1em; + margin-bottom: -0.3em; + } + + .inline1 { + height: 2.5em; + margin-top: 0.5em; + margin-bottom: -0.5em; + } + + .inline4 { + height: 2em; + margin-left: -2em; + margin-right: 0.5em; + margin-bottom: -0.6em; + } + + .img-qj { + height: 7.5em; + margin-bottom: -3.4em; + margin-right: 0.5em; + } + + .zt-ls1 { + color: #000; + font-size: 16px; + font-weight: bold; + } + + span.lsyq-1 { + background-color: #0082D4; + padding: 0.2em 0.4em 0.2em 0.4em; + border-radius: 1.5em; + margin-right: 0.5em; + color: #FFFFFF; + font-weight: bold; + font-size: 1.5em; + } + + span.hsyq-1 { + background-color: #FFB7D4; + padding: 0.2em 0.4em 0.2em 0.4em; + border-radius: 1.5em; + margin-right: 0.5em; + color: #FFFFFF; + font-weight: bold; + font-size: 1.5em; + + } + + .zt-hs1 { + font-weight: 500; + color: #000; + font-size: 1em; + } + + .h2-zt1 { + padding: 5px 25px 5px 25px; + border-radius: 10px 0px 0px 10px; + background-color: #5392C7; + font-size: 1.2em; + color: #FFFFFF; + } + + .h2-zt2 { + padding: 10px; + background-color: #B1DDE0; + margin-right: 2em; + color: #FFFFFF; + padding: 5px 50px 5px 25px; + border-radius: 0px 5px 80px 0px; + font-size: 1.2em; + } + + .bk { + border: 0.15em dotted #5593C6; + padding: 0.5em; + margin-bottom: 2em; + margin-top: 0.5em; + border-radius: 1em; + position: relative; + } + + + p.bj1-qjms { + background-color: #5392C7; + color: #FFFFFF; + display: inline-block; + font-size: 1em; + padding: 0.1em 0.7em 0.12em 0.7em; + font-weight: bold; + border-radius: 1.5em; + margin-left: 0em; + text-align: center; + text-indent: 0em; + position: absolute; + top: -2em; + } + + .bj { + background-color: #E1E7F3; + padding: 0.2em 0.8em 0.2em 0.8em; + } + + .bj2 { + background-color: #3D8B9F; + padding: 0.2em 0.8em 0.2em 0.8em; + font-size: 1.3em; + font-weight: bold; + border-radius: 0.5em; + color: #FFFFFF; + } + + .bj3 { + background-color: #FDE6BC; + padding: 20px; + border-radius: 1.5em; + margin-bottom: 2em; + margin-top: 2.5em; + } + + span.bj3-xyx { + background-color: #F5A101; + color: #FFFFFF; + box-shadow: 0.3em 0.3em 0px 0px #FDF0D8; + border-radius: 1.5em; + padding: 5px 20px 5px 20px; + font-size: 1em; + font-weight: bold; + + } + + div.bj3-xyx { + margin-top: -3em; + margin-bottom: 1.5em; + margin-left: -3em; + } + + .ts-1 { + font-weight: bold; + } + + .zt-h4 { + background-color: #F0BD40; + padding: 10px; + color: #FFFFFF; + margin-left: -2em; + border-radius: 1.5em; + } + + .qyls-h4 { + font-family: "HiFont Hei GB"; + color: #6CB26C; + font-weight: bold; + padding: 0.2em; + text-indent: 0em; + margin-left: 0%; + } + + .bj4 { + background-color: #D7E2F0; + padding: 10px 20px; + border-radius: 0.1em; + margin-bottom: 2em; + margin-top: 1em; + } + + div.bj4-xyx { + font-size: 18px; + color: #fff; + line-height: 20px; + padding: 12.5px 15px 12.5px 15px; + margin-right: 10px; + background-color: #5192C6; + border-radius: 5px; + } + + .bj4-xyx-icon { + color: #5192C6; + } + + .bj5 { + background-color: #F0F3E2; + padding: 20px; + border-radius: 0.1em; + margin-bottom: 2em; + margin-top: 2.5em; + } + + span.bj5-xyx { + background-color: #95B321; + color: #FFFFFF; + border-radius: 1.5em; + padding: 5px 20px 5px 20px; + font-size: 1em; + font-weight: bold; + + } + + div.bj5-xyx { + margin-top: -3em; + margin-bottom: 1.5em; + margin-left: -2.5em; + } + + .zt-lvs1 { + color: #95B321; + } + + div.bj-1 { + color: #fff; + border-radius: 2em; + margin-bottom: 1.5em; + margin-top: 1.5em; + } + + .bj-1-zt { + color: #fff; + font-weight: 400; + font-size: 1.2em; + line-height: 1.8em; + } + +} + +.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'; + } + } +} + +.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; + } +} + + +@font-face { + font-family: 'FZLTZHJW'; + src: url('./Fonts/FZLTZHJW.ttf'); +} + +@font-face { + font-family: 'FZLTXIHJW'; + src: url('./Fonts/FZLTXIHJW.ttf'); +} + +@font-face { + font-family: 'FZHTJW'; + src: url('./Fonts/FZHTJW.ttf'); +} + +/* 濯掍綋鏌ヨ鍋氬熀纭�鍝嶅簲寮忓竷灞� */ + +@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) { + .civilAviationServices-book { + + /* 鍒嗛〉padding */ + .padding-93 { + padding: 0 20px; + } + + .padding-102 { + padding: 0 20px; + } + + + .img-float { + width: 130px; + } + .img-rights { + width: 130px; + } + .btn-w{ + width: 42px; + } + } +} + +@media (min-width: 660px) { + .civilAviationServices-book { + .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; +} \ No newline at end of file diff --git a/src/books/civilAviationServices/view/components/header.vue b/src/books/civilAviationServices/view/components/header.vue index e69de29..d387090 100644 --- a/src/books/civilAviationServices/view/components/header.vue +++ b/src/books/civilAviationServices/view/components/header.vue @@ -0,0 +1,195 @@ +<template> + <div class="chapter" num="1"> + <!-- 灏侀潰 --> + <div class="page-box mt-20" page="1" style="min-height: auto"> + <div v-if="showPageList.indexOf(1) > -1"> + <img class="img-0" alt="" src="../../assets/images/fengmian.png" /> + </div> + </div> + <!-- 鎵夐〉 --> + <div class="page-box" page="2" style="min-height: auto"> + <div v-if="showPageList.indexOf(2) > -1"> + <img class="img-0" alt="" src="../../assets/images/feiye.png" /> + </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; font-size: 16px;"> + <hr /> + <p><b>鍥句功鍦ㄧ増缂栫洰锛圕IP锛夋暟鎹�</b></p> + <p>姘戣埅鏈嶅姟蹇冪悊涓庡疄鍔�/璐虹户鏄庯紝浣曟涓荤紪.鈥�2鐗�.鈥斿寳浜細鍖椾含甯堣寖澶у鍑虹増绀撅紝2024.8</p> + <p>ISBN 978-7-303-29413-8</p> + <p>鈪�.鈶犳皯鈥� 鈪�.鈶犺春鈥︹憽浣曗�� 鈪�.鈶犳皯鐢ㄨ埅绌�-鏃呭杩愯緭-鍟嗕笟蹇冪悊瀛�-楂樼瓑鑱屼笟鏁欒偛-鏁欐潗 鈪�.鈶燜560.9</p> + <p>涓浗鍥藉鐗堟湰棣咰IP鏁版嵁鏍稿瓧锛�2023锛夌203791鍙�</p> + <hr /> + <p><br /></p> + <p class="left mr-0">鏁欐潗鎰忚鍙嶉銆�zhijiao@bnupg.com</p> + <p class="left mr-0">钀ラ攢涓績鐢佃瘽銆�010-58802755 58800035</p> + <p class="left mr-0">缂� 杈� 閮� 鐢� 璇濄��010-58802751</p> + <hr /> + <p class="left">MINHANG FUWU XINLI YU SHIWU</p> + <p class="left">鍑虹増鍙戣锛氬寳浜笀鑼冨ぇ瀛﹀嚭鐗堢ぞ www.bnupg.com</p> + <p class="left">銆�銆�銆�銆�銆�鍖椾含甯傝タ鍩庡尯鏂拌鍙e澶ц12-3鍙�</p> + <p class="left">銆�銆�銆�銆�銆�閭斂缂栫爜锛�100088</p> + <p class="left">鍗般��銆�鍒凤細鍞愬北甯傜幒璇氬嵃鍔℃湁闄愬叕鍙�</p> + <p class="left">缁忋��銆�閿�锛氬叏鍥芥柊鍗庝功搴�</p> + <p class="left">寮�銆�銆�鏈細889mm脳1194mm銆�1/16</p> + <p class="left">鍗般��銆�寮狅細13</p> + <p class="left">瀛椼��銆�鏁帮細199鍗冨瓧</p> + <p class="left">鐗堛��銆�娆★細2024骞�8鏈堢2鐗�</p> + <p class="left">鍗般��銆�娆★細2024骞�8鏈堢1娆″嵃鍒�</p> + <p class="left">瀹氥��銆�浠凤細45.00鍏�</p> + <hr /> + <p class="left">绛栧垝缂栬緫锛氱帇浜戣嫳銆�銆�璐d换缂栬緫锛氭湵鍐夊唹</p> + <p class="left">缇庢湳缂栬緫锛氱劍銆�涓姐��銆�瑁呭抚璁捐锛氱劍銆�涓�</p> + <p class="left">璐d换鏍″锛氶檲銆�鑽熴��銆�璐d换鍗板埗锛氶┈銆�娲併��璧点��榫�</p> + <p class="center"><b>鐗堟潈鎵�鏈� 渚垫潈蹇呯┒</b></p> + <p class="center"><b>鍙嶇洍鐗堛�佷镜鏉冧妇鎶ョ數璇濓細010-58800697</b></p> + <p class="center">鍖椾含璇昏�呮湇鍔¢儴鐢佃瘽锛�010-58808104</p> + <p class="center">澶栧煚閭喘鐢佃瘽锛�010-58808083</p> + <p class="center">鏈功濡傛湁鍗拌璐ㄩ噺闂锛岃涓庡嵃鍒剁鐞嗛儴鑱旂郴璋冩崲銆�</p> + <p class="center">鍗板埗绠$悊閮ㄧ數璇濓細010-58808284</p> + </div> + + </div> + </div> + <!-- 浠嬬粛椤甸潰 --> + <div class="page-box" page="4"> + <div v-if="showPageList.indexOf(4) > -1"> + <div style="max-width: 600px; margin: 0 auto;padding: 10% 0;"> + <div class="bk-bwh"> + <h1 id="a003" class="front">鑱屼笟鏁欒偛鑸┖杩愯緭绫讳笓涓氣�滀骇鏁欒瀺鍚堚�濇柊褰㈡�佹暀鏉愪笓瀹舵寚瀵煎鍛樹細</h1> + <p class="center"></p> + <p class="center"><span class="zt-ls1">涓汇��浠�</span></p> + <p class="block fz-14">榄忓叏鏂屻��鍥涘窛瑗垮崡鑸┖鑱屼笟瀛﹂櫌 鑽h獕闄㈤暱銆佺爺绌跺憳</p> + <p class="block fz-14">銆�銆�銆�銆�鍥涘窛娉涚編鏁欒偛鎶曡祫闆嗗洟鏈夐檺璐d换鍏徃 钁d簨闀�</p> + <p class="center mt-20"><span class="zt-ls1">鍓富浠�</span></p> + <p class="block fz-14">鏉ㄦ柊婀︺��涓浗姘戣埅澶у 鍓牎闀裤�佹暀鎺�</p> + <p class="block fz-14">鍙躲��鑰掋��涓浗鍟嗙敤椋炴満鏈夐檺璐d换鍏徃鍥涘窛鍒嗗叕鍙� 鎬荤粡鐞嗗姪鐞嗐�佷汉鍔涜祫婧愰儴閮ㄩ暱</p> + <p class="block fz-14">鐜嬫捣娑涖��鎴愰兘鑸┖鏈夐檺鍏徃 浜哄姏璧勬簮閮ㄦ�荤粡鐞�</p> + <p class="center mt-20"><span class="zt-ls1">濮斻��鍛�</span></p> + <p class="block fz-14">閮鼎澶忋��涓浗姘戣埅澶у 鏁欐巿</p> + <p class="block fz-14">闄堢帀鍗庛��鎴愰兘鑸┖鑱屼笟鎶�鏈闄� 鏁欐巿</p> + <p class="block fz-14">瑁存槑瀛︺��鍥涘窛瑗垮崡鑸┖鑱屼笟瀛﹂櫌 闄㈤暱銆佺爺绌跺憳</p> + <p class="block fz-14">榫欍��寮恒��鍥涘窛娉涚編鏁欒偛鎶曡祫闆嗗洟鏈夐檺璐d换鍏徃 鐗硅仒涓撳</p> + <p class="block fz-14">鍒樸��妗︺��鍥涘窛娉涚編鏁欒偛鎶曡祫闆嗗洟鏈夐檺璐d换鍏徃 鍓�昏銆佺壒绾ф暀甯�</p> + <p class="block fz-14">鏇捐繙蹇椼��鍥涘窛娉涚編鏁欒偛鎶曡祫闆嗗洟鏈夐檺璐d换鍏徃 鍓�昏</p> + </div> + </div> + </div> + </div> + <div class="page-box" page="5"> + <div v-if="showPageList.indexOf(5) > -1"> + <div style="padding: 136px 95px"> + <div class="fl fd-r"> + <div class="fl fd-c al-c" style="margin: 100px 0;"> + <h1 id="a004">鍓嶈█</h1> + <p class="td-0">PREFACE</p> + <p class="zt-hs1 td-0">锛堢 2 鐗堬級</p> + </div> + </div> + <p>銆婃皯鑸璁猴紙绗�2鐗堬級銆嬫槸鍦ㄧ1鐗堢殑鍩虹涓婏紝浠ヤ範杩戝钩鏂版椂浠d腑鍥界壒鑹茬ぞ浼氫富涔夋�濇兂鍜屽厷鐨勪簩鍗佸ぇ绮剧涓烘寚瀵艰繘琛岀紪鍐欑殑锛屾柊鐗堟暀鏉愯惤瀹炩�滅珛寰锋爲浜衡�濇牴鏈换鍔★紝閬靛惊鏁欐潗寤鸿瑙勫緥銆佽亴涓氭暀鑲叉暀瀛﹁寰嬶紝绗﹀悎鑱屼笟闄㈡牎瀛︾敓鐨勮鐭ョ壒鐐广�傛暀鏉愬叡鍒嗕负浜斾釜椤圭洰锛屽垎鍒槸璧拌繘鑸┖涓氥�佽璇嗘皯鐢ㄨ埅绌哄櫒銆侀鑸笌姘旇薄銆佺┖涓氦閫氱鐞嗐�佺┖娓鐞嗐�傛柊鐗堟暀鏉愭湁浠ヤ笅鐗圭偣銆� + </p> + <p>绗竴锛屼骇鏁欒瀺鍚堬紝鍙屽厓寮�鍙戙�傛暀鏉愮敱鍥涘窛瑗垮崡鑸┖鑱屼笟瀛﹂櫌缁勭粐缂栧啓锛岀敱娉涚編鑸┖鑱屾暀闆嗗洟鍜屽晢鐢ㄩ鏈鸿涓氫骇鏁欒瀺鍚堝叡鍚屼綋鍚堜綔瀹屾垚锛屾眹鑱氫簡涓浗姘戣埅澶у銆佸洓宸濊タ鍗楄埅绌鸿亴涓氬闄€�佹垚閮借埅绌鸿亴涓氭妧鏈闄㈢殑涓�绾挎暀甯堜笌涓浗鍟嗙敤椋炴満鏈夐檺璐d换鍏徃鍥涘窛鍒嗗叕鍙搞�佹垚閮借埅绌烘湁闄愬叕鍙哥瓑浼佷笟涓撳锛屽洟闃熸垚鍛樼殑涓板瘜鏁欏缁忛獙銆佸鏈�犺浠ュ強琛屼笟缁忛獙纭繚浜嗘暀鏉愮殑绉戝鎬с�佸疄鐢ㄦ�т笌閫傜敤鎬с�� + </p> + <p>绗簩锛屾�濇斂铻嶅叆锛屼环鍊煎鍚戙�傛暀鏉愬叏闈㈣惤瀹炶绋嬫�濇斂鐨勮姹傦紝閫氳繃瀛︿範姘戣埅鍙戝睍鍘嗙▼鍜岃埅绌轰笓涓氱煡璇嗭紝鍩瑰吇瀛︾敓宕囧皻瀹硶銆侀伒绾畧娉曘�佸磭寰峰悜鍠勩�佽瘹瀹炲畧淇°�佸皧閲嶇敓鍛姐�佺儹鐖卞姵鍔ㄧ殑鍝佽川锛屽煿鍏诲鐢熺殑绀句細璐d换鎰熷拰绀句細鍙備笌鎰忚瘑锛涜返琛屸�滃繝璇氭媴褰撶殑鏀挎不鍝佹牸锛屼弗璋ㄧ瀛︾殑涓撲笟绮剧锛屽洟缁撳崗浣滅殑宸ヤ綔浣滈锛屾暚涓氬鐚殑鑱屼笟鎿嶅畧鈥濈殑褰撲唬姘戣埅绮剧锛涘叿鏈夊畨鍏ㄦ剰璇嗗拰鑹ソ鐨勬湇鍔℃剰璇嗭紱寮曞瀛︾敓鏍戠珛姝g‘鐨勪笘鐣岃銆佷汉鐢熻鍜屼环鍊艰銆� + </p> + <p>绗笁锛屽唴瀹圭瀛︼紝浣撲緥鍒涙柊銆傛柊鐗堟暀鏉愪緷鎹亴涓氭暀鑲插浗瀹舵暀瀛︽爣鍑嗕綋绯伙紝瀵规帴鑱屼笟鏍囧噯鍜屽矖浣嶈兘鍔涜姹傦紝浣撶幇浜т笟鍙戝睍鐨勬柊鎶�鏈�佹柊宸ヨ壓銆佹柊瑙勮寖銆佹柊鏍囧噯锛屾繁鍏ユ寲鎺樻皯鑸紒涓氱殑瀹為檯宸ヤ綔闇�姹傚拰宀椾綅瑕佹眰锛岀‘淇濇暀鏉愬唴瀹逛笌瀹為檯宀椾綅闇�瑕佺殑鏃犵紳琛旀帴銆傛暀鏉愪互椤圭洰浠诲姟涓鸿浇浣擄紝浣撶幇浜嗚亴涓氭暀鑲茬殑绫诲瀷鐗圭偣锛涙彁渚涗簡澶ч噺鐨勬渚嬪垎鏋愬拰瀹為檯鎯呭锛岃瀛︾敓鑳藉皢鎵�瀛︾悊璁烘洿濂藉湴杩佺Щ鍒板疄闄呭伐浣滈渶姹備腑銆傜粨鍚堝鐢熺壒鐐癸紝缂栧啓鍔涙眰鏂囧瓧绠�娲併�侀�氫織鏄撴噦銆傛暀鏉愪綋鐜扳�滆创杩戠ぞ浼� + </p> + </div> + </div> + </div> + <div class="page-box" page="6"> + <div v-if="showPageList.indexOf(6) > -1"> + <ul class="fl al-c pad-t-55 pad-l-60 mb-45"> + <li class="header-left-Number">020</li> + <li class="header-left-text">姘戣埅姒傝锛堢 2 鐗堬級</li> + </ul> + <div class="bodystyle"> + <p class="td-0"> + 鐢熸椿銆佽创杩戝伐浣滃疄闄呫�佽创杩戝鐢熺壒鐐光�濃�滀笌鑱屼笟宀椾綅缇ゅ鎺ャ�佷笌鑱屼笟璧勬牸鏍囧噯瀵规帴銆佷笌瀹為檯宸ヤ綔杩囩▼瀵规帴鈥濈殑鈥滀笁璐磋繎鈥濃�滀笁瀵规帴鈥濆師鍒欙紝娉ㄩ噸瀛︾敓鑱屼笟鏍稿績鑳藉姏鐨勫煿鍏伙紝浣撶幇鈥滃矖璇捐禌璇佲�濊瀺閫氱殑鐞嗗康銆�</p> + <p>绗洓锛岃祫婧愪赴瀵岋紝鏂板舰鎬佹暀鏉愩�傚湪淇杩囩▼涓紝鑱斿悎琛屼笟銆佷紒涓氫笓瀹讹紝鏀堕泦鐪熷疄宸ヤ綔妗堜緥锛岄厤濂椾赴瀵岀殑鏁欏璧勬簮銆傛暀鏉愮殑璁捐鍜屽憟鐜板厖鍒嗕綋鐜拌亴涓氭暀鑲叉柊褰㈡�佹暀鏉愮殑鐞嗗康锛岀粨鍚堣瀺濯掍綋鍜屾暟瀛楀寲鎶�鏈紝閫傚簲瀛︿範鑰呯殑闇�姹傘�� + </p> + <p>绗�2鐗堟暀鏉愮敱榄忓叏鏂屾媴浠讳富缂栵紝璐熻矗鏁翠綋鎬濊矾鐨勭鍒掞紝鎷熷畾鍏蜂綋鐨勭紪鍐欐柟妗堛�傝4鏄庡銆佸紶涔夊厜銆佸懆浼熴�佸鏂囩惓鎷呬换鍓富缂栵紝鐜嬩笘缇ゃ�佸緪涓瑰弬涓庣紪鍐欍�傞粍濠夊┓涔熷鏈暀鏉愮殑鍑虹増浣滃嚭浜嗚础鐚�備腑鍥芥皯鑸ぇ瀛﹀紶鏅撶憸瀵规湰鏁欐潗杩涜浜嗗璇伙紝鎴愰兘鑸┖鏈夐檺鍏徃楂樼骇鎶�甯堛�侀珮绾х粡娴庡笀褰己鍦ㄦ湰鏁欐潗浣撶幇鏂版妧鏈�佹柊宸ヨ壓銆佹柊瑙勮寖銆佹柊鏍囧噯鏂归潰鎻愪緵浜嗕紭绉�鐨勫缓璁紝鏈夋晥鍦颁繚璇佷簡鏈暀鏉愮殑绉戝鎬с�佷笓涓氭�с�佸疄鐢ㄦ�с�侀�傜敤鎬э紝鍦ㄦ琛ㄧず琛峰績鐨勬劅璋€�� + </p> + <p>鏈暀鏉愪笉浠呴�傜敤浜庤埅绌鸿繍杈撶被鐩稿叧涓撲笟鏁欏锛屼篃鍙互浣滀负鑸┖鍏徃鐨勫煿璁暀鏉愩�傚彈缂栬�呮按骞虫墍闄愶紝鏁欐潗闅惧厤瀛樺湪涓�瀹氫笉褰撲箣澶勶紝鎭宠骞垮ぇ璇昏�呮彁鍑哄疂璐垫剰瑙侊紝浠ヤ究鎴戜滑浣滆繘涓�姝ョ殑淇瀹屽杽銆�</p> + </div> + </div> + </div> + <div class="page-box" page="7"> + <div v-if="showPageList.indexOf(7) > -1"> + <div style="padding: 136px 95px"> + <div class="fl fd-r"> + <div class="fl fd-c al-c" style="margin: 100px 0;"> + <h1 id="a004">鍓嶈█</h1> + <p class="td-0">PREFACE</p> + <p class="zt-hs1 td-0">锛堢 1 鐗堬級</p> + </div> + </div> + <p>銆婂浗瀹朵腑闀挎湡鏁欒偛鏀归潻鍜屽彂灞曡鍒掔翰瑕侊紙2010鈥�2020骞达級銆嬫槑纭彁鍑猴細涓瓑鑱屼笟鏁欒偛涓庨珮绛夎亴涓氭暀鑲插崗璋冨彂灞曪紝鏋勫缓鐜颁唬鑱屼笟鏁欒偛浣撶郴銆傝亴涓氭暀鑲蹭负绀句細銆佺粡娴庡拰浜虹殑鍙戝睍鏈嶅姟鎴愪负鑱屼笟鏁欒偛鐞嗚宸ヤ綔鑰呬笌瀹炶返宸ヤ綔鑰呯殑鍏辫瘑銆� + </p> + <p>杩戝勾鏉ワ紝闅忕潃绀句細銆佺粡娴庣殑杩涙锛屾皯鑸笟寰楀埌绌哄墠鐨勫彂灞曘�傛皯鑸笟鐨勫ぇ鍙戝睍闇�瑕佸ぇ閲忛亾寰烽珮灏氥�佺礌璐ㄤ紭鑹�佹妧鑳藉ù鐔熺殑涓�涓撳鑳界殑浜烘墠銆傛鍥犱负濡傛锛屼竴鎵瑰姙瀛︾悊蹇靛厛杩涖�佹暀瀛︿笌瀹炰範瀹炶璁惧绮捐壇銆佸笀璧勫姏閲忛泟鍘氱殑瀛︽牎鎴栦笓涓氬簲杩愯�岀敓锛屼负淇冭繘姘戣埅涓氱殑鍙戝睍浣滃嚭浜嗛噸瑕佽础鐚�� + </p> + <p>瑕佸煿鍏婚珮绱犺川鐨勪汉鎵嶏紝绂讳笉寮�楂樿川閲忕殑瀛︽牎锛岀涓嶅紑楂樻按骞崇殑鏁欏笀锛屾洿绂讳笉寮�鐞嗗康鍏堣繘銆佸唴瀹逛赴瀵屻�佸舰寮忔柊棰栫殑绮惧搧鏁欐潗銆備负姝わ紝鎴戜滑缁勭粐鍏ㄥ浗琛屼笟鑱屼笟鏁欒偛鏁欏鎸囧濮斿憳浼氥�佸叏鍥戒腑绛夎亴涓氭暀鑲叉暀瀛︽敼闈╁垱鏂版寚瀵煎鍛樹細銆佽亴涓氭暀鑲叉暀瀛︾爺绌舵満鏋勭殑涓撳锛屽叏鍥借繎20瀹朵紒涓氱殑琛屽浠ュ強鍏锋湁涓板瘜鐨勬暀瀛︿笌鏁欐潗缂栧啓缁忛獙鐨勪紭绉�鏁欏笀缇ょ瓥缇ゅ姏缂栧啓浜嗘湰濂楁暀鏉愩�� + </p> + <p>鏈鏁欐潗绔嬭冻鍥藉唴杩�20瀹朵紒涓氱浉鍏冲伐浣滃矖浣嶅浜烘墠绱犺川涓庤兘鍔涚殑瑕佹眰锛岄拡瀵瑰鐢熻亴涓氱敓娑彂灞曠殑闇�姹傜紪鍐欍�傚湪浣撶郴缁撴瀯涓婏紝鏈鏁欐潗涓殑鍚勫唽鏁欐潗鏈夋満琛旀帴锛屼綋绯诲畬鏁淬�傚湪鍐呭涓婏紝鏈鏁欐潗娑电洊浜嗗吀鍨嬪伐浣滀换鍔★紝浣撶幇浜嗏�滆创杩戠ぞ浼氱敓娲汇�佽创杩戝伐浣滃疄闄呫�佽创杩戝鐢熺壒鐐光�濃�滀笌鑱屼笟宀椾綅缇ゅ鎺ャ�佷笌鑱屼笟璧勬牸鏍囧噯瀵规帴銆佷笌瀹為檯宸ヤ綔杩囩▼瀵规帴鈥濈殑鈥滀笁璐磋繎鈥濃�滀笁瀵规帴鈥濈殑鐗圭偣锛屾敞閲嶅鐢熻亴涓氭牳蹇冭兘鍔涚殑鍩瑰吇銆傚湪褰㈠紡涓婏紝鏈鏁欐潗鎸夌収鈥滃叿浣撯�旀娊璞♀�斿疄璺碘�濈殑閫昏緫椤哄簭锛岃璁′簡鈥滅浉鍏抽摼鎺モ�濃�滄兂涓�鎯斥�濃�滅粌涓�缁冣�濃�滄�濊�冧笌缁冧範鈥濈瓑鏍忕洰锛岃鏂囦腑鍥炬枃骞惰寕锛岀獊鍑轰簡鏁欐潗鐨勫彲璇绘�т笌浜掑姩鎬э紝鏃㈡柟渚挎暀甯堢殑鏁欙紝涔熸柟渚垮鐢熺殑瀛︺�傛湰濂楁暀鏉愭棦鍙緵鑱屼笟闄㈡牎鑸┖杩愯緭绫讳笓涓氬鐢熶娇鐢紝涔熷彲浣滀负姘戣埅浼佷笟鍛� + </p> + </div> + + </div> + </div> + <div class="page-box" page="8"> + <div v-if="showPageList.indexOf(8) > -1"> + <ul class="fl al-c pad-t-55 pad-l-60 mb-45"> + <li class="header-left-Number">020</li> + <li class="header-left-text">姘戣埅姒傝锛堢 2 鐗堬級</li> + </ul> + <div class="bodystyle"> + <p class="td-0">宸ュ煿璁暀鏉愭垨鍙傝�冭祫鏂欍��</p> + <p>鏈暀鏉愮敱鑱屼笟鏁欒偛涓撳榄忓叏鏂屾媴浠讳富缂栵紝鐢遍檰寤哄崕銆佹潹鐪佽吹銆佹鍓戦攱銆佹浘杩滃織銆佸紶涔夊厜鎷呬换鍓富缂栥�傚弬鍔犳湰鏁欐潗缂栧啓鐨勪汉鍛樻湁锛氫腑鍥芥皯鑸琛屽闄㈤檲鏂帮紝鍥涘窛瑗垮崡鑸┖涓撲慨瀛﹂櫌鍒樻ˇ銆佸紶鑿茶彶銆佹潹娲厜銆佺帇寤哄锛屾垚閮借埅绌烘梾娓歌亴涓氬鏍$▼鍐层�佷綑纾婄瓑銆傚叏涔︾敱涓浗姘戣埅椋炶瀛﹂櫌鏉ㄧ渷璐电粺绋裤�� + </p> + <p>鍦ㄧ紪鍐欐湰鏁欐潗杩囩▼涓紝寰楀埌浜嗕笂娴锋満鍦鸿吹瀹炬湇鍔″叕鍙告�荤粡鐞嗙帇鍩圭珛銆佹繁鍦冲疂瀹夊浗闄呮満鍦哄畨妫�绔欑珯闀胯档钀嶃�佹垚閮藉弻娴佸浗闄呮満鍦哄畨妫�绔欏壇绔欓暱澶忛潤銆佹繁鍦宠埅绌哄叕鍙哥淮淇伐绋嬮儴鎬荤粡鐞嗗姪鐞嗙帇缁ц惀銆佸洓宸濇柊鍔涜埅绌烘妧鏈湁闄愬叕鍙革紙鏈哄姟锛夋�荤粡鐞嗘潕鍏冦�佷竴姹藉ぇ浼椾汉鍔涜祫婧愰儴閮ㄩ暱鍗㈣崈绛夎埅绌轰紒涓氱殑涓撲笟鐨勬寚瀵硷紱鍚哥撼浜嗗洓宸濊タ鍗楄埅绌轰笓淇闄€�佹垚閮借埅绌烘梾娓歌亴涓氬鏍°�佹垚閮界ぜ浠亴涓氫腑瀛︺�佹垚閮借储璐歌亴涓氫腑涓撳鏍°�佹垚閮界幇浠h亴涓氭妧鏈鏍$瓑鑱屼笟闄㈡牎楠ㄥ共鏁欏笀鐨勫疂璐靛缓璁紱灏ゅ叾鏄紝鐢卞叏鍥藉悇澶ц埅绌哄叕鍙搞�佹満鍦烘湇鍔′紒涓氱煡鍚嶇殑涓撳鍜岄瀵肩粍鎴愮殑鈥滆亴涓氶櫌鏍¤埅绌烘湇鍔′笓涓氭暀鏉愬缓璁句紒涓氫笓瀹舵寚瀵煎鍛樹細鈥濈殑涓撳瀵规暀鏉愮殑鍐呭銆佺紪鍐欎綋渚嬬瓑鎻愪緵浜嗗ぇ閲忕殑寤鸿锛屾湁鏁堝湴淇濊瘉浜嗘湰鏁欐潗涓庢皯鑸湇鍔′紒涓氱殑瀹為檯宸ヤ綔瑕佹眰鐩稿惢鍚堬紝鍦ㄦ涓�骞惰〃绀鸿》蹇冪殑鎰熻阿銆傚湪缂栧啓鏈暀鏉愮殑杩囩▼涓紝鎴戜滑鍙傞槄浜嗙浉鍏宠钁楀拰璧勬枡锛屽紩鐢ㄤ簡涓�浜涙渶鏂扮殑鐮旂┒鎴愭灉锛屼絾鐢变簬鑱旂郴鏂瑰紡涓嶅噯纭瓑鍘熷洜锛屾湭鑳戒竴涓�寰佸緱鍘熸垚鏋滀綔鑰呯殑鍚屾剰锛屾暚璇峰師鎴愭灉浣滆�呰皡瑙e苟涓庢垜浠仈绯伙紝鎴戜滑灏嗗瀵勭閰拰鏍蜂功锛屽苟鍦ㄩ噸鍗版垨鍐嶇増鏃舵牴鎹師鎴愭灉浣滆�呯殑瑕佹眰杩涜鐩稿簲鐨勮皟鏁淬�� + </p> + <p>鏁欐潗涓毦鍏嶆湁涓嶅敖濡備汉鎰忎箣澶勶紝鎭宠骞垮ぇ璇昏�呮彁鍑哄疂璐电殑鎰忚锛屼互渚挎垜浠慨璁㈡椂鍔犱互瀹屽杽銆�</p> + </div> + </div> + </div> + </div> +</template> + +<script> +export default { + name: "pageHeader", + props: { + showPageList: { + type: Array, + }, + }, + data() { + return { + }; + }, +}; +</script> + +<style lang="less" scoped> +.box { + max-width: 400px; + margin: 0 auto; +} + +.preface { + height: 224px; + background: linear-gradient(to right, #8fc58c, #fff); +} + +.preface-text { + font-size: 26px !important; + color: #000 !important; +} + +.mt-100 { + margin-top: 100px !important; +} +</style> \ No newline at end of file diff --git a/src/books/civilAviationServices/view/components/index.vue b/src/books/civilAviationServices/view/components/index.vue index e69de29..48ac4c4 100644 --- a/src/books/civilAviationServices/view/components/index.vue +++ b/src/books/civilAviationServices/view/components/index.vue @@ -0,0 +1,950 @@ +<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> --> + </div> + </div> + </template> + + <script> + import pageHeader from "./header.vue"; +// import chapterOne from "./chapter001.vue"; + import NoteIcon from "@/assets/images/biji.png"; + 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: 1, // 鎬荤珷鑺傛暟 + 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 : 18; + }, + 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]; + // 婊氬姩鐩戝惉鑺傛祦 + debugger + 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(6, 30); + // setTimeout(() => { + // this.renderSign("Highlight", { + // id: "2ACA9359", + // txt: "棰樹竴瀛︿範涓婚涓� 杩愬姩", + // page: "10", + // type: "Highlight", + // color: "#F5E12A" + // }); + // setTimeout(() => { + // this.delSign({ + // ids: ["2ACA9359"] + // }); + // }, 2000); + // }, 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); + + debugger + // 鍒拌揪闃堝�� + 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.activeBook + // ); + // } else { + // const obj = {}; + // for (let key in testData[catalog][page]) { + // obj[key] = await getQuestionList( + // [], + // testData[catalog][page][key], + // this.config.activeBook + // ); + // } + // 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(() => { + // 鑾峰彇椤甸潰鎵�鏈塼ext鑺傜偣 + 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, + }; + // 閬嶅巻鎵�鏈夌珷鑺傛枃浠� + 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) { + // 鑾峰彇椤甸潰鎵�鏈塼ext鑺傜偣 + 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) { + playVudio.requestPictureInPicture(); + } + } + }, + //鍏朵粬绫诲悕涓嬪瓧浣撳ぇ灏忓彉鍖� + transformDom(fs) { + console.log('瀛椾綋澶у皬',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, + }, + }; + </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> + \ No newline at end of file -- Gitblit v1.9.1