From abc4b29e99f9c6cb74767dd6e3d5184834545459 Mon Sep 17 00:00:00 2001 From: zhongshujie <2862698242@qq.com> Date: 星期五, 16 五月 2025 14:34:51 +0800 Subject: [PATCH] 酒店英语实训活页教程(第2版)(旅游社) --- src/assets/js/config.js | 29 src/books/aviationPassengerTransport6th/assets/images/第9页-13.png | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/feiye.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/right-page.png | 0 src/books/cognitiveLanDevEduAges0to3/assets/main.less | 2 src/books/aviationPassengerTransport6th/assets/main.less | 1980 +++++++++++ src/books/hotelEnglishTrainingBrochure2nd/assets/images/0025-03.jpg | 0 src/books/aviationPassengerTransport6th/assets/images/第5页-9.png | 0 src/books/aviationPassengerTransport6th/view/components/header.vue | 27 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0008-01.jpg | 0 src/books/aviationPassengerTransport6th/assets/images/第9页-12.png | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0007-01.jpg | 0 src/books/aviationPassengerTransport6th/assets/images/第6页-10.png | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/a2.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/main.less | 2322 +++++++++++++ src/books/hotelEnglishTrainingBrochure2nd/view/index.vue | 80 src/books/aviationPassengerTransport6th/assets/images/icon/heart-check.png | 0 src/books/aviationPassengerTransport6th/assets/images/第7页-11.png | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/device_phone_frontcover.jpg | 0 src/books/childcareInstitutionsManagement/view/components/chapter001.vue | 4 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0003-01.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0005-01.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/a3.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0012-01.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0016-01.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/view/components/header.vue | 117 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0023-01.jpg | 0 src/books/aviationPassengerTransport6th/view/components/index.vue | 980 +++++ src/books/preschoolEvaluation/assets/main.less | 7 src/books/aviationPassengerTransport6th/assets/images/icon/heart.png | 0 src/books/aviationPassengerTransport6th/view/index.vue | 80 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0005-02.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/icon/heart-check.png | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/left-page.png | 0 src/books/aviationPassengerTransport6th/assets/images/pdfLogo.svg | 1 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0023-02.jpg | 0 src/books/aviationPassengerTransport6th/assets/images/header-left.png | 0 src/books/aviationPassengerTransport6th/assets/Fonts/FZFSK.TTF | 0 .env.product | 9 src/books/hotelEnglishTrainingBrochure2nd/assets/images/Cover.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0018-01.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0017-01.jpg | 0 src/books/aviationPassengerTransport6th/assets/images/Cover.jpg | 0 src/books/aviationPassengerTransport6th/assets/examinationList.js | 9 src/books/aviationPassengerTransport6th/assets/images/0002-01.jpg | 0 src/books/aviationPassengerTransport6th/assets/images/delectFile.svg | 1 src/books/aviationPassengerTransport6th/assets/Fonts/FZSSK.TTF | 0 src/books/aviationPassengerTransport6th/assets/images/uploadFiles.svg | 1 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0002-01.jpg | 0 src/books/aviationPassengerTransport6th/view/components/chapter001.vue | 1130 ++++++ src/books/hotelEnglishTrainingBrochure2nd/assets/images/icon/heart.png | 0 src/components/pdfview/index.vue | 198 .env | 8 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0020-01.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0022-01.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0013-01.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/a1.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/assets/images/0026-01.jpg | 0 src/books/hotelEnglishTrainingBrochure2nd/view/components/chapter001.vue | 2319 +++++++++++++ src/App.vue | 28 src/books/hotelEnglishTrainingBrochure2nd/view/components/index.vue | 978 +++++ 61 files changed, 10,189 insertions(+), 121 deletions(-) diff --git a/.env b/.env index de1e4ef..7351fce 100644 --- a/.env +++ b/.env @@ -1,7 +1,7 @@ VUE_APP_ENV = 'dev' -VUE_APP_API_URL = "https://jsek.bnuic.com" -# VUE_APP_API_URL = "https://www.tepcb.com" -VUE_APP_RESOURCE_CTX = 'https://jsek.bnuic.com/books/resource/' -# VUE_APP_RESOURCE_CTX = 'http://182.92.203.7:3007/books/resource/' +# VUE_APP_API_URL = "https://jsek.bnuic.com" +VUE_APP_API_URL = "https://www.tepcb.com" +# VUE_APP_RESOURCE_CTX = 'https://jsek.bnuic.com/books/resource/' +VUE_APP_RESOURCE_CTX = 'http://182.92.203.7:3007/books/resource/' # VUE_APP_RESOURCE_CTX = 'https://www.tepcb.com/books/resource/' VUE_APP_PUBLIC_PATH = '/books/book' \ No newline at end of file diff --git a/.env.product b/.env.product index 09a15be..b2adbd7 100644 --- a/.env.product +++ b/.env.product @@ -1,8 +1,9 @@ VUE_APP_ENV = 'product' -VUE_APP_API_URL = "https://jsek.bnuic.com" +# VUE_APP_API_URL = "https://jsek.bnuic.com" +VUE_APP_API_URL = "https://www.tepcb.com" # VUE_APP_RESOURCE_CTX = 'https://jsek.bnuic.com/books/resource/' # VUE_APP_PUBLIC_PATH = 'https://jsek.bnuic.com/books/book/meetingPlanners' VUE_APP_RESOURCE_CTX = 'http://182.92.203.7:3007/books/resource/' -VUE_APP_PUBLIC_PATH = 'http://182.92.203.7:3007/books/book/toddlerSportsSafetyProtection' -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" -VUE_APP_BOOK_ID = 'toddlerSportsSafetyProtection' +VUE_APP_PUBLIC_PATH = 'http://182.92.203.7:3007/books/book/aviationPassengerTransport6th' +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" +VUE_APP_BOOK_ID = 'aviationPassengerTransport6th' diff --git a/src/App.vue b/src/App.vue index 37de466..475884b 100644 --- a/src/App.vue +++ b/src/App.vue @@ -72,6 +72,12 @@ <cognitiveLanDevEduAges0to3 v-if="activeBook.name == 'cognitiveLanDevEduAges0to3'" ></cognitiveLanDevEduAges0to3> + <aviationPassengerTransport6th + v-if="activeBook.name == 'aviationPassengerTransport6th'" + ></aviationPassengerTransport6th> + <hotelEnglishTrainingBrochure2nd + v-if="activeBook.name == 'hotelEnglishTrainingBrochure2nd'" + ></hotelEnglishTrainingBrochure2nd> </div> </template> <script> @@ -146,6 +152,10 @@ import("./books/behaviorObserveAndGuid/view/index.vue"), cognitiveLanDevEduAges0to3: () => import("./books/cognitiveLanDevEduAges0to3/view/index.vue"), + aviationPassengerTransport6th: () => + import("./books/aviationPassengerTransport6th/view/index.vue"), + hotelEnglishTrainingBrochure2nd: () => + import("./books/hotelEnglishTrainingBrochure2nd/view/index.vue"), }, data() { return { @@ -199,26 +209,34 @@ // policiesAndRegulations //鏀跨瓥娉曞緥涓庢硶瑙剕鏃呮父绀� // practicalCareChildrenManual // 濠村辜鍎跨収鎶ゅ疄褰� // OralAndBroadcasting // 鑸┖鏈嶅姟鍙h浜ら檯涓庢挱闊虫妧宸� - // childIllnessPreventionCare // 0~3宀佸┐骞煎効鐤剧梾棰勯槻 + // childIllnessPreventionCare // 濠村辜鍎垮父瑙佺柧鐥呴闃蹭笌鎶ょ悊 // artInitiationForAges0to3 // 0~3宀佸┐骞煎効鑹烘湳鍚挋 // toddlerSportsSafetyProtection // 0~3宀佸┐骞煎効杩愬姩瀹夊叏涓庝繚鎶� // behaviorObserveAndGuid // 濠村辜鍎胯涓鸿瀵熶笌鎸囧 // cognitiveLanDevEduAges0to3 // 0锝�3宀佸┐骞煎効璁ょ煡涓庤瑷�鍙戝睍鍙婃暀鑲� + // aviationPassengerTransport6th // 姘戣埅鏃呭杩愯緭绗�6鐗�(鏃呮父绀�) + // hotelEnglishTrainingBrochure2nd // 閰掑簵鑻辫瀹炶娲婚〉鏁欑▼锛堢2鐗堬級锛堟梾娓哥ぞ锛� + console.log("debugger", process.env); this.activeBook = await this.config.getBookConfig( process.env.VUE_APP_RESOURCE_CTX + (process.env.VUE_APP_ENV == "product" ? process.env.VUE_APP_BOOK_ID - : "mathBook") + : "hotelEnglishTrainingBrochure2nd") ); + // this.activeBook = await this.config.getBookConfig( - // 'http://182.92.203.7:3007/books/resource/'+ + // 'https://jsek.bnuic.com/books/resource/'+ // (process.env.VUE_APP_ENV == "product" // ? process.env.VUE_APP_BOOK_ID - // : "botany") + // : "aviationSafety") // ); + // 娴嬭瘯璇曡30椤� // this.activeBook.tryPageCount = 10; - this.config.activeBook = this.activeBook; + // this.config.activeBook = this.activeBook; + + // 鏃呮父绀惧鐞嗚法鍩熼棶棰� + // this.activeBook = this.config.activeBook; this.config.goodsStore = this.activeBook.storeRefcode; } }, diff --git a/src/assets/js/config.js b/src/assets/js/config.js index cbe0a9a..dd4c667 100644 --- a/src/assets/js/config.js +++ b/src/assets/js/config.js @@ -1,22 +1,29 @@ import axios from "axios"; -// export const resourceCtx = "http://182.92.203.7:3007/books/resource/"; // 璧勬簮璇锋眰鍦板潃 +export const resourceCtx = "http://182.92.203.7:3007/books/resource/"; // 璧勬簮璇锋眰鍦板潃 // export const resourceCtx = "https://www.tepcb.com/books/resource/"; // 璧勬簮璇锋眰鍦板潃 -export const resourceCtx = "https://jsek.bnuic.com/books/resource/"; // 璧勬簮璇锋眰鍦板潃 -export const tinymceBaseUrl = 'https://jsek.bnuic.com/home/' -// export const tinymceBaseUrl = 'https://www.tepcb.com/home/' +// export const resourceCtx = "https://jsek.bnuic.com/books/resource/"; // 璧勬簮璇锋眰鍦板潃 +// export const tinymceBaseUrl = "https://jsek.bnuic.com/home/"; +export const tinymceBaseUrl = "https://www.tepcb.com/home/"; export let activeBook = {}; // 璧勬簮璇锋眰鍦板潃 + +// export let activeBook = { +// name: "aviationPassengerTransport6th", +// rootCmsItemId: "86281", +// storeRefcode: "defaultGoodsStore1", +// bookId: "5033", +// bookName: "姘戣埅鏃呭杩愯緭锛堢6鐗堬級", +// }; + export let goodsStore = ""; // 璇锋眰鏁欐潗閰嶇疆淇℃伅 const getBookConfig = async (ctx) => { - const response = await axios.get( - ctx + "/bookConfig.json" - ); + const response = await axios.get(ctx + "/bookConfig.json"); return response.data; }; -export const appId = 3; +export const appId = 1; export const requestTimeOut = 300000; // 璇锋眰瓒呮椂鏃堕棿 -export const tokenKey = "jsek-token"; -// export const tokenKey = "website-front-token" +//export const tokenKey = "jsek-token"; +export const tokenKey = "website-front-token"; const config = { resourceCtx, @@ -26,6 +33,6 @@ tokenKey, goodsStore, appId, - getBookConfig + getBookConfig, }; export default config; diff --git a/src/books/aviationPassengerTransport6th/assets/Fonts/FZFSK.TTF b/src/books/aviationPassengerTransport6th/assets/Fonts/FZFSK.TTF new file mode 100644 index 0000000..acc5291 --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/Fonts/FZFSK.TTF Binary files differ diff --git a/src/books/aviationPassengerTransport6th/assets/Fonts/FZSSK.TTF b/src/books/aviationPassengerTransport6th/assets/Fonts/FZSSK.TTF new file mode 100644 index 0000000..d4f6b93 --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/Fonts/FZSSK.TTF Binary files differ diff --git a/src/books/aviationPassengerTransport6th/assets/examinationList.js b/src/books/aviationPassengerTransport6th/assets/examinationList.js new file mode 100644 index 0000000..77f7ad9 --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/examinationList.js @@ -0,0 +1,9 @@ +const testData = { + 2: { + 16: [ + 144319, 144320, 144321, 144322, 144323, 144324, 144325, 144326, 144327, 144328 + ], + }, +}; + +export default testData; diff --git a/src/books/aviationPassengerTransport6th/assets/images/0002-01.jpg b/src/books/aviationPassengerTransport6th/assets/images/0002-01.jpg new file mode 100644 index 0000000..ad3a8a6 --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/images/0002-01.jpg Binary files differ diff --git a/src/books/aviationPassengerTransport6th/assets/images/Cover.jpg b/src/books/aviationPassengerTransport6th/assets/images/Cover.jpg new file mode 100644 index 0000000..95fa4e0 --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/images/Cover.jpg Binary files differ diff --git a/src/books/aviationPassengerTransport6th/assets/images/delectFile.svg b/src/books/aviationPassengerTransport6th/assets/images/delectFile.svg new file mode 100644 index 0000000..c7e64a7 --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/images/delectFile.svg @@ -0,0 +1 @@ +<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1746781749911" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3806" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M781.28 851.36a58.56 58.56 0 0 1-58.56 58.56H301.28a58.72 58.72 0 0 1-58.56-58.56V230.4h538.56z m-421.6-725.92a11.84 11.84 0 0 1 12-12h281.28a11.84 11.84 0 0 1 12 12V160H359.68zM956.8 160H734.72v-34.56a81.76 81.76 0 0 0-81.76-81.76H371.68a82.08 82.08 0 0 0-81.76 81.76V160H67.2a35.36 35.36 0 0 0 0 70.56h105.12v620.8a128.96 128.96 0 0 0 128.96 128.96h421.44a128.96 128.96 0 0 0 128.96-128.96V230.4H956.8a35.2 35.2 0 0 0 35.2-35.2 34.56 34.56 0 0 0-35.2-35.2zM512 804.16a35.2 35.2 0 0 0 35.2-35.36V393.92a35.2 35.2 0 1 0-70.4 0V768.8a35.2 35.2 0 0 0 35.2 35.36m-164.32 0a35.36 35.36 0 0 0 35.36-35.36V393.92a35.36 35.36 0 1 0-70.56 0V768.8a36.32 36.32 0 0 0 35.2 35.36m328.64 0a35.36 35.36 0 0 0 35.2-35.36V393.92a35.36 35.36 0 1 0-70.56 0V768.8a35.36 35.36 0 0 0 35.36 35.36" fill="#D81E06" p-id="3807"></path></svg> \ No newline at end of file diff --git a/src/books/aviationPassengerTransport6th/assets/images/header-left.png b/src/books/aviationPassengerTransport6th/assets/images/header-left.png new file mode 100644 index 0000000..29d211f --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/images/header-left.png Binary files differ diff --git a/src/books/aviationPassengerTransport6th/assets/images/icon/heart-check.png b/src/books/aviationPassengerTransport6th/assets/images/icon/heart-check.png new file mode 100644 index 0000000..74d469c --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/images/icon/heart-check.png Binary files differ diff --git a/src/books/aviationPassengerTransport6th/assets/images/icon/heart.png b/src/books/aviationPassengerTransport6th/assets/images/icon/heart.png new file mode 100644 index 0000000..7817ec4 --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/images/icon/heart.png Binary files differ diff --git a/src/books/aviationPassengerTransport6th/assets/images/pdfLogo.svg b/src/books/aviationPassengerTransport6th/assets/images/pdfLogo.svg new file mode 100644 index 0000000..74ab0de --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/images/pdfLogo.svg @@ -0,0 +1 @@ +<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1746602907831" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18597" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M704 960h-298.666667c-12.8 0-21.333333-8.533333-21.333333-21.333333v-149.333334h-106.666667c-12.8 0-21.333333-8.533333-21.333333-21.333333v-151.466667l-85.333333-40.533333c-4.266667-2.133333-8.533333-6.4-10.666667-12.8-2.133333-4.266667-2.133333-10.666667 0-17.066667l53.333333-115.2v-6.4c0-200.533333 149.333333-362.666667 330.666667-362.666666s330.666667 162.133333 330.666667 362.666666c0 121.6-55.466667 236.8-149.333334 302.933334v209.066666c0 14.933333-8.533333 23.466667-21.333333 23.466667z m-277.333333-42.666667h256v-198.4c0-6.4 4.266667-12.8 8.533333-17.066666l8.533333-6.4c83.2-59.733333 132.266667-160 132.266667-268.8 0-177.066667-130.133333-320-288-320s-288 142.933333-288 320v10.666666c0 4.266667 0 6.4-2.133333 8.533334l-46.933334 100.266666 78.933334 36.266667c8.533333 4.266667 12.8 10.666667 12.8 19.2v142.933333h106.666666c12.8 0 21.333333 8.533333 21.333334 21.333334v151.466666z" fill="#1C9E3A" p-id="18598"></path><path d="M682.666667 341.333333h-106.666667v-149.333333h106.666667v149.333333z m-64-42.666666h21.333333v-64h-21.333333v64z" fill="#1C9E3A" p-id="18599"></path><path d="M618.666667 480v-32h-170.666667c-23.466667 0-42.666667 19.2-42.666667 42.666667 0 12.8 4.266667 23.466667 12.8 29.866666-8.533333-8.533333-12.8-19.2-12.8-29.866666v-234.666667c0-12.8 8.533333-21.333333 21.333334-21.333333h192v245.333333z m-149.333334-202.666667v85.333334h85.333334v-85.333334h-85.333334z" fill="#1C9E3A" p-id="18600"></path><path d="M554.666667 362.666667h-85.333334v-85.333334h85.333334v85.333334z m-64-21.333334h42.666666v-42.666666h-42.666666v42.666666z" fill="#1C9E3A" p-id="18601"></path><path d="M576 533.333333c0 23.466667 19.2 42.666667 42.666667 42.666667s42.666667-19.2 42.666666-42.666667-19.2-42.666667-42.666666-42.666666v42.666666h-42.666667z" fill="#1C9E3A" p-id="18602"></path><path d="M618.666667 533.333333h-170.666667c-23.466667 0-42.666667-19.2-42.666667-42.666666s19.2-42.666667 42.666667-42.666667h170.666667v85.333333z m-170.666667-64c-12.8 0-21.333333 8.533333-21.333333 21.333334s8.533333 21.333333 21.333333 21.333333h149.333333v-42.666667h-149.333333z" fill="#1C9E3A" p-id="18603"></path></svg> \ No newline at end of file diff --git a/src/books/aviationPassengerTransport6th/assets/images/uploadFiles.svg b/src/books/aviationPassengerTransport6th/assets/images/uploadFiles.svg new file mode 100644 index 0000000..0a835b5 --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/images/uploadFiles.svg @@ -0,0 +1 @@ +<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1746781684475" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2838" id="mx_n_1746781684475" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M884.2 909.6H126.8c-38.6 0-70-31.4-70-70V204.6c0-38.6 31.4-70 70-70h328.6c38.6 0 70 31.4 70 70 0 11-9 20-20 20s-20-9-20-20c0-16.6-13.4-30-30-30H126.8c-16.6 0-30 13.4-30 30v635c0 16.6 13.4 30 30 30h757.4c11 0 20 9 20 20s-8.8 20-20 20z" fill="#1c9e3a" p-id="2839"></path><path d="M884.2 909.6c-11 0-20-9-20-20s9-20 20-20c16.6 0 30-13.4 30-30V428.2c0-16.6-13.4-30-30-30H292.6c-16.6 0-30 13.4-30 30v268.6c0 11-9 20-20 20s-20-9-20-20V428.2c0-38.6 31.4-70 70-70h591.6c38.6 0 70 31.4 70 70v411.4c0 38.6-31.4 70-70 70zM734 295h-178.2c-38.6 0-70-31.4-70-70v-10.4c0-11 9-20 20-20s20 9 20 20v10.4c0 16.6 13.4 30 30 30H734c11 0 20 9 20 20s-9 20-20 20z" fill="#1c9e3a" p-id="2840"></path><path d="M192.8 909.6h-15.8c-11 0-20-9-20-20s9-20 20-20h15.8c16.6 0 30-13.4 30-30v-168.6c0-11 9-20 20-20s20 9 20 20v168.6c-0.2 38.6-31.4 70-70 70zM818 398.4c-11 0-20-9-20-20v-53.2c0-16.6-13.4-30-30-30h-90.4c-11 0-20-9-20-20s9-20 20-20H768c38.6 0 70 31.4 70 70v53.2c0 11-9 20-20 20z" fill="#1c9e3a" p-id="2841"></path><path d="M598.2 764.6c-11 0-20-9-20-20V532.4c0-11 9-20 20-20s20 9 20 20v212.2c0 11-9 20-20 20z" fill="#1c9e3a" p-id="2842"></path><path d="M683.8 638c-5.2 0-10.2-2-14.2-5.8L584 546.6c-7.8-7.8-7.8-20.4 0-28.2 7.8-7.8 20.4-7.8 28.2 0L698 604c7.8 7.8 7.8 20.4 0 28.2-4 4-9 5.8-14.2 5.8z" fill="#1c9e3a" p-id="2843"></path><path d="M512.4 638c-5.2 0-10.2-2-14.2-5.8-7.8-7.8-7.8-20.4 0-28.2l85.8-85.8c7.8-7.8 20.4-7.8 28.2 0 7.8 7.8 7.8 20.4 0 28.2l-85.8 85.8c-3.8 4-8.8 5.8-14 5.8z" fill="#1c9e3a" p-id="2844"></path></svg> \ No newline at end of file diff --git "a/src/books/aviationPassengerTransport6th/assets/images/\347\254\2545\351\241\265-9.png" "b/src/books/aviationPassengerTransport6th/assets/images/\347\254\2545\351\241\265-9.png" new file mode 100644 index 0000000..824c2fe --- /dev/null +++ "b/src/books/aviationPassengerTransport6th/assets/images/\347\254\2545\351\241\265-9.png" Binary files differ diff --git "a/src/books/aviationPassengerTransport6th/assets/images/\347\254\2546\351\241\265-10.png" "b/src/books/aviationPassengerTransport6th/assets/images/\347\254\2546\351\241\265-10.png" new file mode 100644 index 0000000..674376e --- /dev/null +++ "b/src/books/aviationPassengerTransport6th/assets/images/\347\254\2546\351\241\265-10.png" Binary files differ diff --git "a/src/books/aviationPassengerTransport6th/assets/images/\347\254\2547\351\241\265-11.png" "b/src/books/aviationPassengerTransport6th/assets/images/\347\254\2547\351\241\265-11.png" new file mode 100644 index 0000000..cb824b9 --- /dev/null +++ "b/src/books/aviationPassengerTransport6th/assets/images/\347\254\2547\351\241\265-11.png" Binary files differ diff --git "a/src/books/aviationPassengerTransport6th/assets/images/\347\254\2549\351\241\265-12.png" "b/src/books/aviationPassengerTransport6th/assets/images/\347\254\2549\351\241\265-12.png" new file mode 100644 index 0000000..9caa3e4 --- /dev/null +++ "b/src/books/aviationPassengerTransport6th/assets/images/\347\254\2549\351\241\265-12.png" Binary files differ diff --git "a/src/books/aviationPassengerTransport6th/assets/images/\347\254\2549\351\241\265-13.png" "b/src/books/aviationPassengerTransport6th/assets/images/\347\254\2549\351\241\265-13.png" new file mode 100644 index 0000000..4d12735 --- /dev/null +++ "b/src/books/aviationPassengerTransport6th/assets/images/\347\254\2549\351\241\265-13.png" Binary files differ diff --git a/src/books/aviationPassengerTransport6th/assets/main.less b/src/books/aviationPassengerTransport6th/assets/main.less new file mode 100644 index 0000000..268e645 --- /dev/null +++ b/src/books/aviationPassengerTransport6th/assets/main.less @@ -0,0 +1,1980 @@ +.aviationPassengerTransport6th { + 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; + } + + .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; + } + + .header-left { + display: flex; + align-items: flex-end; + padding: 50px 0 0 0; + margin-left: 8%; + position: relative; + + img { + width: 30%; + height: auto; + object-fit: contain; + } + } + + .headerText { + position: absolute; + bottom: 10%; + left: 10%; + font-size: 16px; + padding-bottom: 5px; + } + + .header-left-box { + font-size: 14px; + margin-left: 8%; + padding-bottom: 7%; + } + + + + .header-right { + display: flex; + justify-content: flex-end; + align-items: flex-end; + padding: 50px 0 0 0; + margin-right: 10%; + margin-bottom: 30px; + + div { + width: 9%; + text-align: center; + + img { + width: 100%; + height: auto; + } + } + } + + .headerRight-Number { + text-align: right; + font-size: 14px; + margin-right: 10%; + padding-bottom: 7%; + } + + .headerRight-Text { + font-family: "kaiti"; + font-size: 16px; + padding-bottom: 2px; + position: relative; + margin-right: 10px; + } + + .headerRight-Text::after { + content: ''; + position: absolute; + bottom: 0; + left: 0; + right: 0; + height: 2px; + /* 杈规楂樺害 */ + background-image: linear-gradient(to right, rgba(136, 136, 136, 0), #1C9E3A); + /* 浠庨�忔槑鍒�#888888鐨勬笎鍙� */ + z-index: 1; + /* 纭繚娓愬彉灞傚湪鍐呭涓婃柟 */ + } + + .headerRight-box { + width: 10px; + height: 20px; + background-color: #1C9E3A; + } + + + /*浜岀骇鏍囬绔犳爣*/ + .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-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%; + } + + .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 .fm-zh { + font-family: "鏂规姝i粦" !important; + } + + .fm-kt { + font-family: "kaiti" !important; + font-weight: 500; + } + + .fm-fs { + font-family: "鏂规浠垮畫" !important; + } + + 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-question { + border-color: #1c9e3a !important; + } + + .textarea-question:focus { + outline: none; + /* 绉婚櫎榛樿鐨勭劍鐐硅疆寤� */ + } + + .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-title { + display: flex; + align-items: center; + + + span { + margin-left: 10px; + color: #1c9e3a !important; + font-weight: bold; + } + } + + .video-box { + margin: 10px 0 20px 0; + border: 2px dashed #1c9e3a; + padding: 3% 2% 2% 2%; + position: relative; + } + + + + .video-img { + position: absolute; + top: -20px; + left: -20px; + } + + + .video-box-left { + margin: 20px 8% 20px 0; + border: 1px dashed #895B2E; + padding: 2% 2%; + } + + .videoname { + display: flex; + justify-content: center; + align-items: center; + + span { + margin-right: 20px; + } + } + + .collect-btn { + cursor: pointer; + width: 20px; + height: 20px; + } + + .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; + } + + // pdf 鏌ョ湅鍣� + .pdf-box { + margin: 35px 0 20px 0; + border: 1px solid #48a65d; + } + + .pdf-title { + display: flex; + background-color: transparent; + min-height: 25px; + position: relative; + + .bg-img { + width: 12%; + position: absolute; + top: -29.5px; + } + } + + .pdf-title-name { + padding: 0 2%; + display: flex; + align-items: center; + text-indent: 0em; + margin: 0 !important; + border-right: 1px solid #259e40; + color: #259e40; + + img { + cursor: pointer; + margin-right: 10px; + } + + .icon { + fill: #078fb9; + } + } + + .pdf-title-img { + width: 75.4%; + text-indent: 1em; + padding-right: 2%; + display: flex; + align-items: center; + justify-content: space-between; + margin: 0; + color: #000; + + span { + text-align: center; + cursor: pointer; + overflow: hidden; + } + + img { + cursor: pointer; + } + + &:hover { + text-decoration: underline; + color: #259e40; + } + } + + .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; + margin: 0% 12% 0% 12%; + line-height: 30px; + min-height: 900px; + } + + // div.bodystyle-left { + // text-align: justify; + // margin: 13% 3% 10% 13%; + // line-height: 30px; + // } + + .UnitCover { + padding-top: 0; + padding-bottom: 80px; + } + + .Unit-title { + margin-left: 2%; + margin-bottom: 70px; + padding: 150px 30px 20px 0; + width: 75%; + color: #fff; + background-color: #1d9438; + position: relative; + overflow: hidden; + + p { + font-size: 30px; + text-align: right; + } + } + + + + + .Unit-title::after { + content: ''; + position: absolute; + right: -1px; + bottom: -1px; + width: 0; + height: 0; + border-style: solid; + border-width: 0px 0 50px 40px; + /* 璋冩暣杩欎釜鍊兼潵鏀瑰彉缂哄け涓夎褰㈢殑澶у皬 */ + border-color: #fff transparent #fff transparent; + /* 浣跨敤涓庤儗鏅浉鍚岀殑棰滆壊鏉モ�滃垏鎺夆�濊 */ + z-index: 2; + } + + .Unit-content { + margin: 0 12%; + } + + .Unit-title-box { + padding: 20px 3% 10px 3%; + margin-bottom: 60px; + border: 1px dashed #1C9E3A; + position: relative; + + span { + font-weight: bold; + } + } + + .box-title { + padding: 0px 15px; + color: #fff; + text-indent: 0em; + border-radius: 0 10px 0 0; + background-color: #1C9E3A; + position: absolute; + top: -15px; + left: 0; + } + + .uploadFiles { + display: flex; + align-items: flex-end; + color: #000; + + img { + cursor: pointer; + width: 25px; + margin-right: 10px; + } + + span { + + font-size: 14px; + line-height: 20px; + font-weight: 400; + cursor: pointer; + } + + &:hover { + color: #1C9E3A !important; + } + + } + + + + .ppt-box { + cursor: pointer; + display: flex; + align-items: center; + line-height: 25px; + font-family: "kaiti"; + + p { + text-indent: 0em; + font-size: 1em; + margin-right: 20px; + margin-bottom: 0; + + &:hover { + text-decoration: underline; + color: #1C9E3A; + } + } + + img { + cursor: pointer; + width: 25px; + } + + + } + + + + .unit-title-parent { + text-align: center; + margin: 10% 0; + } + + .unit-title { + font-family: "鏂规姝i粦"; + display: inline-block; + font-size: 1.6em; + font-weight: 500; + border-bottom: 1px solid #0082D4; + padding: 10px 0; + } + + .bodyPic { + position: relative; + } + + .bodyPic-text { + position: absolute; + top: 15%; + left: 8%; + + p { + font-family: kaiti; + font-size: 16px; + line-height: 25px; + } + + span { + color: #006e92; + } + } + + 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 { + 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%; + } + + + .foreword-img-box { + text-align: end; + padding: 12% 0 10% 0; + + img { + width: 30%; + } + } + + // epub涓嚜甯︾殑鏍峰紡 + .editorialBoard { + background-color: #fff; + border-radius: 50%; + /* 椤堕儴鍜屽簳閮ㄤ负0锛屽乏鍙充袱渚т负50% */ + padding: 5% 10% 20% 10%; + } + + .series { + padding: 12% 11%; + background-color: #e1f1fa; + } + + .openingScene { + + background-size: cover; + background-repeat: no-repeat; + + min-height: 100%; + } + + .quotation-box { + padding: 15% 10% 30% 32%; + } + + .firstTitle-l { + font-family: "鏂规姝i粦"; + padding: 5% 13%; + text-align: center; + font-weight: 400; + } + + + .seriesTitle { + font-size: 2em; + color: #000; + font-weight: 400; + text-align: center; + padding: 15% 0 10% 0; + } + + .g-pic { + height: 2.5em; + vertical-align: middle; + } + + .titleQuot-c { + font-family: "鏂规鍏颁涵缁嗛粦"; + color: #00aeef; + text-indent: 0em; + font-size: 1.7em; + line-height: 1.3em; + text-align: center; + font-weight: 400; + padding: 0 5%; + } + + + div.bk3 { + background-color: #d6ece5; + border: 1px solid #7acab4; + padding: 25px 19px 20px 19px; + margin-top: 2em; + 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 { + display: inline-block; + text-align: center; + background-color: #B4CFAC; + padding: 10px 20px; + margin: 60px 0 40px 0; + border-radius: 25px 0 25px 0; + font-size: 1.5em; + line-height: 1.2em; + text-indent: 0em; + font-weight: bold; + font-family: "鏂规姝i粦"; + } + + .firstLevel-t { + text-indent: 2em; + font-size: 1.1em; + font-weight: bold; + color: #1C9E3A; + margin-top: 50px; + margin-bottom: 20px; + } + + .Secondary-t { + text-indent: 2em; + font-size: 1.1em; + font-weight: bold; + color: #1C9E3A; + margin-top: 20px; + margin-bottom: 20px; + } + + h2 { + font-family: '鏂规瀹嬮粦'; + font-weight: 400; + margin: 30px 0; + } + + .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: "鏂规浠垮畫"; + text-align: left; + text-indent: 2em; + margin: 0.1em auto; + line-height: 35px; + } + + .titleQuot-1 { + margin-bottom: 15px; + font-family: "鏂规姝i粦"; + font-size: 1.1em; + margin: 20px 0; + } + + /*搴曡壊*/ + .bgColor { + padding: 2px 5px; + color: #000; + background: #aae0f9; + } + + // 鎷撳睍瀛︿範 + .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 { + 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: "姹変华姝i粦"; + background-color: #6bcff6; + font-weight: bold; + margin: 30px 0 20px 0; + } + + .poemtitle { + text-align: center; + font-weight: bold; + font-family: "鏂规鍏颁涵缁嗛粦"; + } + + .bold { + color: #00aeef; + font-weight: 400; + font-family: "鏂规涔﹀畫"; + margin: 10px 0; + } + + .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: #1c9e3a; + 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% - 15px); + 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/FZFSK.TTF'); +} + +@font-face { + font-family: '鏂规瀹嬩綋'; + src: url('./Fonts/FZSSK.TTF'); +} + +// @font-face { +// font-family: '鏂规瀹嬮粦'; +// src: url('./Fonts/FZSHJW.TTF'); +// } + +// @font-face { +// font-family: '鏂规浠垮畫'; +// src: url('./Fonts/FZFSK.TTF'); +// } + +// @font-face { +// font-family: '鏂规鍏颁涵缁嗛粦'; +// src: url('./Fonts/FZLTXIHK.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) { + .aviationPassengerTransport6th { + + .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) { + .aviationPassengerTransport6th { + .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/aviationPassengerTransport6th/view/components/chapter001.vue b/src/books/aviationPassengerTransport6th/view/components/chapter001.vue new file mode 100644 index 0000000..98a8d6a --- /dev/null +++ b/src/books/aviationPassengerTransport6th/view/components/chapter001.vue @@ -0,0 +1,1130 @@ +<template> + <div class="chapter" num="2"> + <!-- 2椤� --> + <div class="page-box mt-20" page="2" style="min-height: auto"> + <div v-if="showPageList.indexOf(2) > -1"> + <img class="img-0" alt="" src="../../assets/images/0002-01.jpg" /> + </div> + </div> + <!-- 3椤� --> + <div class="page-box" page="3"> + <div v-if="showPageList.indexOf(3) > -1"> + <div class="UnitCover"> + <div class="Unit-title"> + <p>椤圭洰涓�</p> + <p>姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍</p> + </div> + <div class="Unit-content"> + <div class="Unit-title-box"> + <p class="box-title">椤圭洰瀵艰</p> + <p class="fm-kt"> + 鏈」鐩綔涓哄叏涔︾殑寮�绡囷紝涓昏浠嬬粛涓栫晫浠ュ強涓浗姘戠敤鑸┖杩愯緭涓氫笉鍚屽巻鍙插彂灞曢樁娈电殑鐗圭偣锛岃鏄庝腑鍥芥皯鑸繍杈撲笟钃媰鍙戝睍鐨勭敓鏈哄拰娲诲姏銆� + </p> + </div> + <div class="Unit-title-box"> + <p class="box-title">瀛︿範鐩爣</p> + <p class="fm-kt"> + <span>鐭ヨ瘑鐩爣锛�</span + >浜嗚В涓栫晫浠ュ強涓浗姘戠敤鑸┖杩愯緭鐨勫彂灞曞巻鍙蹭互鍙婁笉鍚岄樁娈电殑鐗圭偣锛涚悊瑙f皯鐢ㄨ埅绌鸿繍杈撳彂灞曠殑瓒嬪娍銆� + </p> + <p class="fm-kt"> + <span>鎶�鑳界洰鏍囷細</span + >姣旇緝涓浗涓庝笘鐣屾皯鐢ㄨ埅绌鸿繍杈撳彂灞曞巻鍙诧紱鐞嗚В褰撲粖姘戠敤鑸┖杩愯緭鑱旂洘鍖栧彂灞曡秼鍔匡紝浠ュ強涓浗鐢辨皯鑸ぇ鍥藉悜姘戣埅寮哄浗鎺ㄨ繘鐨勬垬鐣ユ瀯鎯炽�� + </p> + <p class="fm-kt"> + <span>绱犺川鐩爣锛�</span>鏍戠珛鍏ㄦ皯鑸�佸ぇ姘戣埅鐨勮亴涓氳銆� + </p> + </div> + <p class="firstLevel-t center">涓哄叏鐞冭埅绌哄彂灞曟帹杩涘垱鏂�</p> + <p> + 1944骞�12鏈�7鏃ワ紝52涓浗瀹跺湪鑺濆姞鍝ョ缃蹭簡銆婂浗闄呮皯鐢ㄨ埅绌哄叕绾︺�嬶紙閫氱О銆婅姖鍔犲摜鍏害銆嬶級銆傛牴鎹�婅姖鍔犲摜鍏害銆嬬殑瑙勫畾锛�1947骞�4鏈�4鏃ワ紝鍥介檯姘戣埅缁勭粐锛圛CAO锛夋寮忔垚绔嬨��1992骞�9鏈堝彫寮�鐨勫浗闄呮皯鑸粍缁囩29灞婂ぇ浼氬仛鍑哄喅璁紝鑷姖鍔犲摜鍏害绛剧讲50鍛ㄥ勾鐨�1994骞磋捣锛屽皢姣忓勾鐨�12鏈�7鏃ュ畾涓衡�滃浗闄呮皯鑸棩鈥濄�� + </p> + </div> + </div> + <ul class="headerRight-Number"> + <li class="">路3路</li> + </ul> + </div> + </div> + <!-- 4椤� --> + <div class="page-box" page="4"> + <div v-if="showPageList.indexOf(4) > -1"> + <ul class="header-left"> + <img src="../../assets/images/header-left.png" alt="" /> + <li class="headerText">姘戣埅鏃呭杩愯緭</li> + </ul> + <div class="bodystyle"> + <p class="fm-fs"> + 1996骞�12鏈�6鏃ワ紝鑱斿悎鍥藉ぇ浼氭牴鎹浗闄呮皯鑸粍缁囩殑鍊¤锛岄�氳繃鍐宠锛堢51/33鍙峰喅璁級锛岃绔嬫瘡骞寸殑12鏈�7鏃ヤ负鈥滃浗闄呮皯鑸棩鈥濓紝鏃ㄥ湪甯姪寤虹珛鍜屽杩涘叏涓栫晫鐨勮璇嗭紝浜嗚В鍥介檯姘戠敤鑸┖瀵瑰悇鍥界ぞ浼氬拰缁忔祹鍙戝睍鐨勯噸瑕佹�э紝浠ュ強鍥介檯姘戣埅缁勭粐涓哄叏浜虹被鏈嶅姟銆佸府鍔╁悇鍥藉悎浣滃苟瀹炵幇鐪熸鐨勫叏鐞冨揩閫熻繃澧冪綉缁滄墍鍙戞尌鐨勭嫭鐗逛綔鐢ㄣ�� + </p> + <p class="fm-fs"> + 姣忛殧浜斿勾锛屽湪鍥介檯姘戣埅缁勭粐鍛ㄥ勾绾康涔嬮檯锛堝2014骞淬��2019骞淬��2024骞寸瓑锛夛紝鍥介檯姘戣埅缁勭粐鐞嗕簨浼氫负鍥介檯姘戣埅鏃ヨ瀹氫竴涓壒瀹氱殑鍛ㄥ勾涓婚锛岀悊浜嬩細浠h〃浠繕涓鸿繖浜涘懆骞寸邯蹇垫棩涔嬮棿鐨勬暣涓洓骞存湡閫夋嫨涓�涓浗闄呮皯鑸棩涓婚銆備负绾康鍥介檯姘戣埅缁勭粐鎴愮珛75鍛ㄥ勾锛岀悊浜嬩細涓�2019骞村簡绁濇椿鍔ㄩ�夋嫨鐨勪富棰樹负鈥滆繛閫氫笘鐣屼竷鍗佷簲杞斤紙75 + Years of Connecting the + World锛夆�濓紝2020骞磋嚦2023骞寸殑鍥介檯姘戣埅鏃ヤ富棰樻槸鈥滀负鍏ㄧ悆鑸┖鍙戝睍鎺ㄨ繘鍒涙柊锛圓dvancing + Innovation for Aviation Development锛夆�濄�� + </p> + <p class="fm-fs"> + 鍒涙柊灏嗘垚涓烘鍦ㄦ潵涓寸殑鑸┖鏂版椂浠g殑鏍稿績锛岃嚜涓昏埅绌哄櫒銆佸彲鍐嶇敓鑳芥簮鍜屾帹杩涜兘婧愩�佷簹杞ㄩ亾椋炶銆佷汉宸ユ櫤鑳姐�佸鏉愬埗閫犮�佸ぇ鏁版嵁銆佸尯鍧楅摼鍜岃澶氬叾浠栦护浜哄叴濂嬬殑鍙戝睍閮藉皢鏀瑰彉鎴戜滑鎵�鐭ョ殑椋炶闈㈣矊銆傚浗闄呮皯鑸粍缁囬噰鐢ㄧН鏋佷富鍔ㄧ殑鐩戠璇勪及鏂规硶锛岄紦鍔辨柊瓒嬪娍骞舵帹鍔ㄥ崗璋冿紝浠庤�屽湪鏀寔鑸┖鍒涙柊涓彂鎸ヤ富瑕佷綔鐢紝淇冧娇鑸┖涓氳兘澶熷埄鐢ㄨ繖浜涜秼鍔垮垱閫犳柊鎴愮哗鍙婅幏寰楁柊鑳藉姏銆� + </p> + <p class="right-info">锛堣祫鏂欐潵婧愶細鍥介檯姘戣埅缁勭粐銆佽仈鍚堝浗缃戠珯锛�</p> + <div class="fl jc-c"> + <h1>浠诲姟涓�銆�浜嗚В涓栫晫姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍</h1> + </div> + <p> + 鍦ㄥ箍闃旀棤鍨犵殑钃濆ぉ涓婅嚜鐢卞湴椋炵繑锛屾槸浜虹被鑷彜浠ユ潵鐨勬ⅵ鎯炽�備汉绫荤殑椋炲ぉ姊︽兂闆嗕腑鍙嶆槧鍦ㄤ腑澶栧彜浠i琛岀璇濅腑銆傚湪涓浗锛屾湁骞夸负娴佷紶鐨勭編涓界璇濓紝濡傚濞ュ鏈堛�佷粰濂充笅鍑°�佺墰閮庣粐濂筹紱鏈変箻榫欒法鍑ょ殑钀у彶銆佸紕鐜夛紱鏈夊ぉ瀹腑鐨勭帀鐨囧ぇ甯濄�佽剼韫鐏疆鐨勫摢鍚掍笁澶瓙鍙婇鏉ラ鍘荤殑浼楃浠欙紱鏈変竴涓瓔鏂楀崄涓囧叓鍗冮噷鐨勯綈澶╁ぇ鍦e瓩鎮熺┖锛涜繕鏈夐椈鍚嶄笘鐣岀殑鏁︾厡椋炲ぉ绛夛紝閮芥槸涓浗鍙や唬浜虹被鍗囩┖椋炵繑鎰挎湜鐨勭敓鍔ㄤ綋鐜般�傚湪澶栧浗锛屽彜浠i琛岀璇濅富瑕侀泦涓湪鍙ゅ笇鑵娿�佸焹鍙娿�佸嵃搴﹀強闃挎媺浼湴鍖恒�傚湪鍙ゅ笇鑵婄璇濅腑锛屼細椋炵殑绁炴湁寰堝锛屽澶槼绁為樋娉㈢綏銆佺埍绁炰笜姣旂壒绛夛紝閮介暱鐫�涓�鍙岀繀鑶�锛涢樋鎷変集椋炴鐨勭璇濇洿鏄鍠绘埛鏅撱�� + </p> + </div> + <ul class="header-left-box"> + <li class="">路4路</li> + </ul> + </div> + </div> + <!-- 5椤� --> + <div class="page-box" page="5"> + <div v-if="showPageList.indexOf(5) > -1"> + <ul class="header-right"> + <li class="headerRight-Text">椤圭洰涓�銆�姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍</li> + <span class="headerRight-box"></span> + </ul> + <div class="bodystyle"> + <p class="firstLevel-t">涓�銆佽埅绌轰笟鐨勮悓鑺�</p> + <p> + 浜虹被鐪熸椋炰笂澶╁紑濮嬩簬1783骞存硶鍥界殑钂欑壒鍝ヨ彶灏旓紙Montgol铿乪r锛夊厔寮熷埗閫犵殑鐑皵鐞冭浇浜哄崌绌猴紝闅忓悗寰峰浗浜哄張鐢ㄦ皵鐞冭繍閫侀偖浠跺拰涔樺锛岃繖鍙互璇存槸姘戠敤鑸┖鐨勫紑濮嬨��1852骞达紝鍦ㄦ硶鍥藉嚭鐜颁簡椋炶墖锛屽嚭鐜颁簡鍙互鐢变汉鎿嶇旱鐨勬湁鍔ㄥ姏鐨勯琛屽櫒銆傛暣涓�19涓栫邯鏄皵鐞冦�侀鑹囪繖浜涜交浜庣┖姘旂殑鑸┖鍣ㄤ富瀹拌埅绌虹殑鏃朵唬锛屽畠浠鍏堢敤浜庢皯鐢紝浣嗗緢蹇氨琚敤浜庢垬浜夛紝鑰屽啗浜嬬敤閫斿張淇冭繘浜嗚埅绌烘妧鏈殑鍙戝睍銆傝交浜庣┖姘旂殑椋炶鍣ㄤ綋绉ぇ銆侀�熷害鎱紝鎿嶇旱涔熶笉鏂逛究锛屽湪鍐涗簨涓婃槗鍙楁敾鍑伙紝鍥犺�屽畠浠殑鍑虹幇涓嶈鍦ㄦ皯鐢ㄥ拰鍐涚敤棰嗗煙涓兘涓嶄唬琛ㄧ湡姝g殑鑸┖鏃朵唬鐨勫埌鏉ャ�� + </p> + <p> + 鑸┖浜嬩笟鐨勭湡姝e紑鎷撴槸鍦ㄩ鏈鸿繖绉嶉噸浜庣┖姘旂殑鑸┖鍣ㄥ嚭鐜颁互鍚庯紝閲嶄簬绌烘皵鐨勯琛屽櫒鐨勮鎯冲嚭鐜板緱姣旇交浜庣┖姘旂殑椋炶鍣ㄨ繕瑕佹棭锛屼絾鐩村埌19涓栫邯锛屾硶鍏拌タ绉戝闄㈣繕鍦ㄤ簤璁烘槸鍚﹀彲鑳藉埗閫犲嚭閲嶄簬绌烘皵鐨勯琛屽櫒鐨勯棶棰樸�備笌姝ゅ悓鏃讹紝鑻卞浗绉戝瀹跺嚡鍒╋紙G. + Cayley锛夊拰寰峰浗绉戝瀹堕噷鏉庢灄杈惧皵锛圤. + Lilienthal锛夊婊戠繑鏈哄仛浜嗗ぇ閲忕殑鐮旂┒鍜屽疄璺碉紝鏉庢灄杈惧皵涓烘浠樺嚭浜嗙敓鍛斤紝浠栦滑鍜屽叾浠栦竴浜涚瀛﹀鐨勭爺绌跺湪绌烘皵鍔ㄥ姏鐨勭悊璁恒�侀鏈虹殑鏋勯�犲拰鎿嶇旱鐨勫疄璺典笂涓洪鏈虹殑鍑虹幇濂犲畾浜嗗熀纭�銆� + </p> + <p> + 1903骞�12鏈�17鏃ワ紝缇庡浗鐨勮幈鐗瑰厔寮熷彂鏄庝簡椋炴満锛屽鍥�1-1鎵�绀恒�傚湪姝ゅ悗涓嶅埌鍗佸勾鐨勬椂闂村唴锛屼汉浠氨宸茬粡寮�濮嬭瘯鍥炬妸椋炴満搴旂敤浜庤埅绌鸿繍杈撲簡銆� + </p> + <div class="fl fd-c al-c openImgBox mt-20"> + <img class="img-c" src="../../assets/images/绗�5椤�-9.png" alt="" /> + <p class="img">鍥� 1-1銆�鑾辩壒鍏勫紵鐨勨�滈琛岃�呭彿鈥�</p> + </div> + </div> + <ul class="headerRight-Number"> + <li class="">路5路</li> + </ul> + </div> + </div> + <!-- 6椤� --> + <div class="page-box" page="6"> + <div v-if="showPageList.indexOf(6) > -1"> + <ul class="header-left"> + <img src="../../assets/images/header-left.png" alt="" /> + <li class="headerText">姘戣埅鏃呭杩愯緭</li> + </ul> + <div class="bodystyle"> + <p> + 1910骞�11鏈�7鏃ワ紝缇庡浗椋炶鍛樿彶鍒╂櫘路甯曢┈鍒╋紙Philip + Parmalee锛夊彈鑾皵璞柉璨傜毊鍏徃鐨勫鎵橈紝椹鹃┒鑾辩壒B鍨嬪弻缈兼満锛屽皢涓�鎵逛笣缁囧搧浠庝唬椤匡紙Dayton锛夎繍寰�鍝ヤ鸡甯冿紙Columbus锛夛紝杩欏彲浠ョ畻浣滅涓�娆¢鏈鸿揣杩愩�� + </p> + <p> + 1911骞�2鏈�22鏃ワ紙涓�璇存槸20鏃ワ級锛岃嫳鍥界殗瀹舵捣鍐涗腑鏍℃俯寰峰锛圵alter G. + Windham锛夎娉曞浗椋炶鍛樹酣鍒┞蜂僵鍑紙Henry + Pequet锛夐┚鏈猴紝鎶婁竴鎵逛俊浠朵粠鍗板害鐨勯樋鎷夊搱宸村痉甯傦紙Allahabad锛夊甫寰�濂堝凹绔犲厠鐢筹紙Naini + Junction锛夈�傛瘡灏佷俊闄勫姞鑸┖閭垂绾﹀悎2.5渚垮+锛岃繖渚挎槸棣栨閭斂椋炶銆� + </p> + <p> + 1914骞�1鏈�1鏃ワ紝缇庡浗钁楀悕闀块�旈琛屽憳鎵樺凹路璐剧撼鏂紙Tony + Jannus锛夐┚椹垛�滀集鍔摝鈥濓紙Benoist锛夊彿姘翠笂椋炴満锛岃浇涓�鍚嶄箻瀹紝瀹屾垚浜嗕粠鍦e郊寰楁柉鍫★紙St. + Petersburg锛夊埌鍧﹀笗锛圱ampa锛夌殑绗竴娆¤埅鐝琛屻�傝埅绾垮叏闀�31鍏噷锛岃埅琛屾椂闂寸害20鍒嗛挓銆傝繖灏辨槸绗竴娆″杩愯埅鐝�� + </p> + <p> + 1909骞达紝娉曞浗浜哄竷鑾遍噷濂ワ紙Louis + Bleriot锛夋垚鍔熷湴椋炶繃浜嗚嫳鍚夊埄娴峰场锛屽紑鍒涗簡鍘嗗彶涓婄涓�娆″浗闄呴琛屻�傚湪闅忓悗鐨�10骞翠腑锛岄鏈哄緢蹇搴旂敤鍒板啗浜嬩笂锛�1914鈥�1918骞寸殑绗竴娆′笘鐣屽ぇ鎴橈紝鏋佸ぇ鍦版帹鍔ㄤ簡鑸┖鎶�鏈殑鍙戝睍锛岃繖涓�闃舵椋炴満鍑犱箮娌℃湁鐢ㄤ簬杩囬潪鍐涗簨鐢ㄩ�斻�� + </p> + <p> + 1919骞村勾鍒濓紝寰峰浗棣栧厛寮�濮嬩簡鍥藉唴鐨勬皯鑸繍杈擄紝鍚屽勾8鏈堬紝鑻卞浗鍜屾硶鍥藉紑閫氫簡瀹氭湡鐨勭┖涓湇鍔★紝姘戠敤鑸┖鐨勫巻鍙叉寮忔彮寮�浜嗐�� + </p> + <div class="img-float w350 openImgBox"> + <img class="img-c" src="../../assets/images/绗�6椤�-10.png" alt="" /> + <p class="img">鍥� 1-2銆�DC-3 瀹㈡満</p> + </div> + <span> + <p> + 浠�1919骞村埌1939骞寸殑20骞达紝鏄皯鐢ㄨ埅绌哄垵鍒涘苟鍙戝睍鐨勫勾浠o紝姘戠敤鑸┖杩呴�熶粠娆ф床鍙戝睍鍒板寳缇庯紝鐒跺悗鏅強鍒颁簹銆侀潪銆佹媺缇庡悇娲诧紝杩呴�熸墿灞曞埌鍏ㄧ悆鍚勫湴锛屼腑鍥戒篃鍦�1920骞村紑濮嬪缓绔嬩簡绗竴鏉¤埅绾裤��1933骞达紝缇庡浗浜烘灄鐧斤紙C. + A.Lindberg锛夋í瓒婂ぇ瑗挎磱椋炶鐨勬垚鍔燂紝鎶婅埅绌鸿繍杈撶敱娲插唴椋炶鎵╁睍鍒颁簡娲查檯椋炶銆傝繖涓勾浠f渶鍏蜂唬琛ㄦ�х殑姘戣埅瀹㈡満鏄編鍥界殑DC-3锛屽鍥�1-2鎵�绀恒�� + </p> + <p> + 1939骞达紝绗簩娆′笘鐣屽ぇ鎴樼殑寮�濮嬶紝涓柇浜嗘皯鑸彂灞曠殑姝e父杩涚▼銆傛垬浜夊鑸┖鐨勬帹鍔ㄥ姏杩滄瘮姘戣埅鑾峰彇鍟嗕笟鍒╂鼎鐨勬帹鍔ㄥ姏澶у緱澶氾紝鍦ㄥ叚骞寸殑鎴樹簤涓埅绌烘妧鏈彇寰椾簡椋炶穬寮忕殑鍙戝睍銆� + </p> + </span> + </div> + <ul class="header-left-box"> + <li class="">路6路</li> + </ul> + </div> + </div> + <!-- 7椤� --> + <div class="page-box" page="7"> + <div v-if="showPageList.indexOf(7) > -1"> + <ul class="header-right"> + <li class="headerRight-Text">椤圭洰涓�銆�姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍</li> + <span class="headerRight-box"></span> + </ul> + <div class="bodystyle"> + <div class="pdf-box"> + <div class="pdf-title"> + <p class="pdf-title-name"> + <img src="../../assets/images/pdfLogo.svg" alt="" /> + <span>鎷撳睍鐭ヨ瘑</span> + </p> + <p class="pdf-title-img"> + <span @click="toUrl(1)"> {{ chapter001.pdfMd5[1].name }}</span> + <el-tooltip + class="item" + effect="dark" + :content=" + chapterData.isCollectVideoOne ? '鐐瑰嚮鍙栨秷' : '鐐瑰嚮鏀惰棌' + " + placement="top-start" + > + <img + :src=" + collectResourceList.findIndex( + (item) => item.id == 'd26f73df690bb8de6781c40d049560e3' + ) > -1 + ? collectCheck + : collectImg + " + alt="" + class="collect-btn" + @click="handleCollect('pdf-01')" + /> + </el-tooltip> + </p> + </div> + </div> + <p class="firstLevel-t">浜屻�佹皯鐢ㄨ埅绌虹殑澶у彂灞曟椂鏈�</p> + <p> + 浠�1945骞寸浜屾涓栫晫澶ф垬缁撴潫鍒�1958骞达紝姘戠敤鑸┖缁忓巻浜嗘仮澶嶅拰澶у彂灞曠殑鏃舵湡銆傝繖涓�鏃舵湡鍐呮皯鐢ㄨ埅绌虹殑鍙戝睍涓昏浣撶幇鍦ㄤ互涓嬪嚑涓柟闈細 + </p> + <p> + 绗竴锛屽浗闄呰埅绌轰笟杩呴�熷彂灞曘��1944骞村湪缇庡浗鑺濆姞鍝ワ紝54涓浗瀹剁缃蹭簡銆婂浗闄呰埅绌鸿繍杈撳叕绾︺�嬶紝鍙茬О銆婅姖鍔犲摜鍏害銆嬶紝杩欎釜鍏害鐜板湪鎴愪负涓栫晫鍥介檯鑸┖娉曠殑鍩虹銆� + </p> + <p> + 绗簩锛屾満鍦哄拰鑸矾缃戠瓑鍩虹璁炬柦澶ч噺鍏村缓锛屼娇姘戠敤鑸┖鐢辫繃鍘荤殑鐐圭嚎缁撴瀯鍚戦潰涓婂彂灞曪紝閫愭褰㈡垚浜嗕竴涓叏鐞冭寖鍥寸殑鑸┖缃戙�� + </p> + <p> + 绗笁锛岀洿鍗囨満杩涘叆浜嗘皯鑸湇鍔★紝鎴愪负姘戣埅鐨勫張涓�绉嶄富瑕佽埅绌哄櫒锛屽紑杈熶簡姘戣埅鐨勬柊棰嗗煙銆� + </p> + <div class="img-rights w350 openImgBox"> + <img class="img-c" src="../../assets/images/绗�7椤�-11.png" alt="" /> + <p class="img">鍥�1-3銆�B707-220</p> + </div> + <span> + <p> + 绗洓锛屽柗姘斿紡姘戠敤椋炴満鐨勭爺鍒惰繘鍏ヤ簡瀹炵敤闃舵锛屼负姘戣埅绗簩涓樁娈电殑鍙戝睍鍑嗗浜嗘潯浠躲��1956骞达紝鍠锋皵寮忔皯鐢ㄩ鏈烘姇鍏ヤ娇鐢紝寮�濮嬩簡姘戠敤鑸┖鐨勪竴涓柊闃舵銆傝嫳鍥戒綔涓哄柗姘斿紡椋炴満鐨勫厛椹卞浗鍦ㄦ垬鍚庡氨鑷村姏浜庢皯鐢ㄥ柗姘斿紡椋炴満鐨勭爺鍙戙��1950骞达紝涓栫晫涓婄涓�鏋舵丁杞灪鏃嬫〃鍠锋皵瀹㈡満鈥斺�旇嫳鍥界殑鈥滃瓙鐖靛彿鈥濃�斺�旀姇鍏ヤ娇鐢ㄣ��1952骞达紝鑻卞浗寰仿峰搱缁村叞椋炴満鍒堕�犲叕鍙哥爺鍒剁殑銆佽閰�4娑¤疆鍠锋皵鍙戝姩鏈虹殑鈥滃綏鏄熷彿鈥濆鏈哄湪鑸嚎涓婂紑濮嬩娇鐢ㄣ�傚湪闅忓悗鐨勪袱骞村唴锛屸�滃綏鏄熷彿鈥濊繛缁笁娆$┖涓В浣擄紝浣垮柗姘斿紡椋炴満鍦ㄦ皯鑸殑搴旂敤鍙楀埌浜嗘尗鎶橈紝浣嗗柗姘斿紡姘戠敤椋炴満鐨勪紭瓒婃�у凡缁忔樉绀哄嚭鏉ャ�傚湪鎺ュ彈浜嗏�滃綏鏄熷彿鈥濆け璐ョ殑鏁欒鍚庯紝浜轰滑缁堜簬鍒ゆ柇鍑哄鑷粹�滃綏鏄熷彿鈥濆け浜嬬殑鍘熷洜鏄�滅柌鍔虫柇瑁傗�濓紝骞舵壘鍑轰簡瑙e喅鐨勬柟娉曘��1956骞达紝鑻忚仈鐨勫浘-104 + 鎶曞叆鑸嚎锛�1958骞达紝缇庡浗鐨勬尝闊�707锛堝浘1-3锛夊拰DC-8 + 杩涘叆鑸嚎锛屽柗姘旇埅绌虹殑鏂版椂浠e紑濮嬩簡銆備綔涓哄柗姘斿紡椋炴満鐨勪唬琛ㄦ満绉嶏紝娉㈤煶707鐨勯�熷害杈惧埌姣忓皬鏃�900~1000鍏噷锛岃埅绋嬪彲杈�12 + 000鍏噷锛屼箻瀹�158浜恒�備粠姝ゆ皯鐢ㄨ埅绌虹敱涓�涓浗瀹舵垨涓�涓湴鍖虹殑灏戦噺浜轰娇鐢ㄧ殑杩愯緭鎵嬫锛屽彉鎴愪竴涓叏鐞冩�х殑澶т紬鍖栫殑杩愯緭琛屼笟锛屾瀬澶у湴淇冭繘浜嗗叏鐞冧氦閫氳繍杈撶殑鍙戝睍锛屼篃浣胯埅绌鸿繍杈撴垚涓哄浗闄呰繍杈撳拰鍥藉唴杩愯緭鐨勯噸瑕佹柟寮忎箣涓�銆� + </p> + </span> + </div> + <ul class="headerRight-Number"> + <li class="">路7路</li> + </ul> + </div> + </div> + <!-- 8椤� --> + <div class="page-box" page="8"> + <div v-if="showPageList.indexOf(8) > -1"> + <ul class="header-left"> + <img src="../../assets/images/header-left.png" alt="" /> + <li class="headerText">姘戣埅鏃呭杩愯緭</li> + </ul> + <div class="bodystyle"> + <p class="firstLevel-t">涓夈�佹皯鐢ㄨ埅绌虹殑鍏ㄧ悆鍖栥�佸ぇ浼楀寲鏃舵湡</p> + <p> + 鍠锋皵寮忛鏈鸿繘鍏ユ皯鑸紝浣胯繙绋嬨�佸ぇ浼楀寲鍜屽粔浠风殑鑸┖杩愯緭鎴愪负鍙兘锛屽湪宸ㄥぇ鐨勯渶姹傚拰鍒╂鼎椹变娇涓嬶紝鑸┖鍏徃绉瀬鍦板紑鎷撳競鍦猴紝鍙傚姞鍥介檯绔炰簤銆傚湪鍙戣揪鍥藉鍑虹幇浜嗗ぇ閲忕殑鑸┖鍏徃锛屽苟鏈�鍚庡舰鎴愪簡鏁板崄涓ぇ鍨嬬殑鑸┖鍏徃銆傚彂灞曚腑鍥藉涔熸妸鍙備笌鍥介檯鑸┖甯傚満浣滀负鍥藉灏婁弗鍜屽湴浣嶇殑璞″緛锛屽叏鍔涙敮鎸佸浗瀹惰埅绌哄叕鍙哥殑鍙戝睍锛屼娇姘戣埅浜嬩笟涓�鐗囩箒鑽c�傜敱浜庡柗姘斿紡椋炴満鐨勫昂瀵搞�侀噸閲忋�佸櫔澹扮瓑甯︽潵鐨勯棶棰橈紝鏃х殑鏈哄満宸蹭笉閫傚悎鑸┖杩愯緭鐨勫彂灞曪紝浜庢槸鑸┖鍏徃寮�濮嬩笉鏂湴鏀归�犳棫鏈哄満锛屽叴寤烘柊鏈哄満锛屾弧瓒充笉鏂澶х殑瀹㈣揣娴併�傚浜庤埅琛岀鐞嗙郴缁熸潵璇达紝浠庤埅琛岀鍒躲�佽埅璺紑杈熴�佽埅琛屾儏鎶ョ瓑锛岄兘瑕侀�傚簲鍠锋皵鏃朵唬鐨勯�熷害鍜屽閲忕殑瑕佹眰锛屽洜鑰屾暣涓郴缁熼兘杩涜鐫�鏀归�犲拰鏇存柊銆傛�讳箣锛�1958骞村紑濮嬬殑姘戠敤鍠锋皵鏃朵唬鏄皯鑸彂灞曠殑涓�涓柊鐨勯樁娈碉紝瀹冩爣蹇楃潃姘戣埅杩涘叆浜嗗叏鐞冪殑澶т紬鍖栬繍杈撶殑鏂版椂浠c�� + </p> + <p> + 浠�20涓栫邯70骞翠唬涔嬪悗锛屾皯鑸户缁湞鐫�澶у瀷鍖栧拰楂橀�熷害鐨勬柟鍚戝彂灞曘��1970 + 骞达紝娉㈤煶747锛堝浘1-4锛夊浣撳鏈烘姇鍏ヨ埅绾挎槸澶у瀷鍖栫殑涓�涓噸瑕佹爣蹇楋紝鑰�1976 + 骞磋嫳銆佹硶鍚堝埗鐨勮秴闊抽�熷鏈衡�滃崗鍜屽彿鈥濓紙鍥�1-5锛夌殑鎶曞叆浣跨敤鍒欐槸姘戣埅鎻愰珮閫熷害鍦ㄧ粡娴庡拰鐜闂涓婁笉澶垚鍔熺殑涓�娆″皾璇曘�傜編鍥戒簬1978骞存斁鏉惧鑸┖鍏徃鐨勭鍒讹紝杩欏鑸┖杩愯緭鐨勫彂灞曡捣鍒颁簡绉瀬鐨勪綔鐢ㄣ�傜敱浜庤埅绌鸿繍杈撴秹鍙婂浗瀹跺畨鍏ㄥ拰鏃呭瀹夊叏锛屽洜鑰屽湪1978骞翠互鍓嶏紝鍚勪釜鍥藉瀵逛簬鑸┖鍏徃鐨勭粡钀ュ疄琛屼弗鏍肩殑鎺у埗锛屼富瑕佹槸瀵圭エ浠峰拰甯傚満鍑嗗叆鐨勬帶鍒讹紝寰堝鍥藉涓嶅厑璁哥浜轰紒涓氱粡钀ヨ埅绌哄叕鍙革紝鍙湁鍥借惀鐨勮埅绌哄叕鍙革紝鏈夌殑鐢氳嚦鎶婅埅绌轰紒涓氫綔涓哄浗瀹舵満鏋勬垨鍐涢槦鐨勪竴閮ㄥ垎銆� + </p> + <p> + 闅忕潃鑸┖杩愯緭鐨勮繀閫熷彂灞曪紝浜轰滑缁堜簬璁よ瘑鍒帮紝灏界鑸┖杩愯緭涓氭湁瀹冪壒娈婄殑瀹夊叏闇�瑕侊紝骞朵笖鎶�鏈瘑闆嗭紝椋庨櫓杈冨ぇ锛屼絾浠嶇劧鍙互閫氳繃涓�绯诲垪鐨勫畨鍏ㄦ硶瑙勪娇涔嬫寜甯傚満缁忔祹鐨勬硶鍒欏睍寮�绔炰簤锛岃繖鏍峰彲浠ヤ績浣胯埅绌鸿繍杈撲紒涓氬悎鐞嗗湴閰嶇疆璧勬簮锛岄檷浣庢垚鏈紝淇冭繘浼佷笟鐨勫彂灞曘�傛斁鏉剧鍒剁殑瓒嬪娍鎵╁睍鍒颁簡瑗挎銆佹棩鏈瓑鍦板尯锛屼娇姘戣埅甯傚満杩呴�熷叏鐞冨寲銆傚湪鏀炬澗绠″埗鍒濇湡鍑虹幇鐨勪腑銆佸皬鑸┖鍏徃鐢变簬瑙勬ā鏁堢泭浣庯紝缂轰箯绔炰簤鍔涳紝鎴栧�掗棴銆佹垨琚ぇ鍏徃鍏煎苟銆傜劧鑰岋紝鍦ㄤ笘鐣岃寖鍥村唴锛屽悇澶ц埅绌哄叕鍙镐负浜嗕簤鍙栨洿澶х殑甯傚満浠介锛屾墿灞曡嚜韬殑鑸嚎缃戠粶锛屽垎鍒�氳繃浠g爜鍏变韩绛夐�斿緞缁勬垚鍚勭鎴樼暐鎬ц仈鐩熸潵澧炲己鑷韩鐨勭珵浜夊姏銆傛椂鑷充粖鏃ワ紝姘戣埅宸茬粡鍙戝睍鎴愪负涓�涓法澶х殑鍥介檯鎬ц涓氾紝瀵逛笘鐣岀粡娴庢垨涓�涓浗瀹剁殑缁忔祹鍙戝睍鏈夌潃涓捐冻杞婚噸鐨勫奖鍝嶏紝鍚勫浗鏀垮簻鍜屼紒涓氶兘瀵规皯鑸繘琛屼簡澶ч噺鐨勬姇璧勶紝鎶婂畠浣滀负涓�涓湁宸ㄥぇ娼滃姏鐨勮涓氭潵寮�鎷撳彂灞曘�� + </p> + </div> + <ul class="header-left-box"> + <li class="">路8路</li> + </ul> + </div> + </div> + <!-- 9椤� --> + <div class="page-box" page="9"> + <div v-if="showPageList.indexOf(9) > -1"> + <ul class="header-right"> + <li class="headerRight-Text">椤圭洰涓�銆�姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍</li> + <span class="headerRight-box"></span> + </ul> + <div class="bodystyle"> + <div class="fl fd-c al-c openImgBox mt-20"> + <img class="img-c" src="../../assets/images/绗�9椤�-13.png" alt="" /> + <p class="img">鍥�1-4銆�B747鈥�</p> + </div> + <div class="fl fd-c al-c openImgBox mt-20"> + <img class="img-c" src="../../assets/images/绗�9椤�-12.png" alt="" /> + <p class="img">鍥�1-5銆�鍗忓拰椋炴満</p> + </div> + </div> + <ul class="headerRight-Number"> + <li class="">路9路</li> + </ul> + </div> + </div> + <!-- 10椤� --> + <div class="page-box" page="10"> + <div v-if="showPageList.indexOf(10) > -1"> + <ul class="header-left"> + <img src="../../assets/images/header-left.png" alt="" /> + <li class="headerText">姘戣埅鏃呭杩愯緭</li> + </ul> + <div class="bodystyle"> + <p class="firstLevel-t">鍥涖�佹皯鐢ㄨ埅绌哄叏鐞冩�ф垬鐣ヨ仈鐩�</p> + <p> + 闅忕潃缁忔祹鍏ㄧ悆鍖栫殑鍙戝睍锛屽悇鍥借埅绌哄叕鍙镐箣闂寸殑绔炰簤鏃ョ泭婵�鐑堬紝鍗曚釜鑸┖鍏徃涓嶄粎瓒婃潵瓒婇毦浠ュ紑杈熷競鍦猴紝鐢氳嚦涔熼毦浠ヤ繚浣忓師鏉ョ殑鍦扮洏銆傚洜姝よ埅绌哄叕鍙歌仈鐩熸垚浜嗗綋浠婁笘鐣岃埅绌鸿繍杈撳彂灞曠殑涓�绉嶉噸瑕佸舰寮忋�備簨瀹炰笂锛屼笘鐣岃埅绌哄叕鍙镐箣闂寸殑涓氬姟鑱旂洘骞朵笉鏄竴绉嶆柊鐜拌薄銆傛棭鍦�1993骞达紝缇庡浗瑗垮寳鑸┖鍏徃灏变笌鑽峰叞鐨囧鑸┖鍏徃缁撴垚浜嗕笘鐣岃埅绌虹晫棣栦釜鍏ㄧ悆鎬ц仈鐩熴�傛鍚庯紝缇庡浗鑱斿悎鑸┖鍏徃鍚屽痉鍥芥眽鑾庤埅绌哄叕鍙革紝缇庡浗寰峰皵濉斿叕鍙稿悓鐟炲+銆佽タ鐝墮銆佸ゥ鍦板埄涓夊浗鑸┖鍏徃锛岀編鍥藉ぇ闄嗗叕鍙稿悓鎰忓ぇ鍒╄埅绌哄叕鍙哥瓑閮芥浘鍏堝悗缁撴垚涓氬姟鑱旂洘銆�1997骞�5鏈�14鏃ワ紝寰峰浗姹夎帋鑸┖鍏徃銆佺編鍥借仈鍚堣埅绌哄叕鍙搞�佺憺鍏告柉鍫殑绾崇淮浜氳埅绌哄叕鍙搞�佸姞鎷垮ぇ鑸┖鍏徃鍜屾嘲鍥藉浗闄呰埅绌哄叕鍙哥殑钁d簨闀夸滑鍙堝湪寰峰浗鐨勬硶鍏板厠绂忔満鍦虹缃插崗璁紝缁勬垚浜嗗綋鏃朵笘鐣屼笂鏈�澶х殑鑸┖鍏徃鑱旂洘锛屼粠鑰屼娇澶ц妯$殑璺ㄥ浗鑱旂洘鎴愪负涓栫晫鑸┖鐣屼笟鍔¤仈鐩熺殑鏂拌秼鍔裤��1998骞�3鏈�9鏃ワ紝寰峰浗姹夎帋鑸┖鍏徃鍙堜笌浜氭床鏈�澶х殑鑸┖鍏徃鍙戣〃鑱斿悎澹版槑锛屽甯冪粨鎴愬痉鏃ユ垬鐣ヨ埅绌鸿仈鐩燂紝灏嗗痉銆佹棩鑸嚎寤烘垚杩炴帴娆ф床澶ч檰涓庝笢浜氫箣闂存渶閲嶈鐨勭┖涓氦閫氱嚎銆�1998骞�5鏈�16鏃ワ紝寰峰浗姹夎帋鑸┖鍏徃瀹e竷锛屾柊瑗垮叞鑸┖鍏徃鍜屾境澶у埄浜氬畨鎹疯埅绌哄叕鍙稿皢浜�1999骞磋捣鍔犲叆浜庘�滄槑鏄熻仈鐩熲�濓紝浠庤�屼娇鈥滄槑鏄熻仈鐩熲�濈殑鎴愬憳澧炲姞鍒颁竷瀹惰埅绌哄叕鍙搞�傗�滃瀹囦竴瀹垛�濇鏄湪杩欐牱涓�绉嶅ぇ鑳屾櫙涓嬩骇鐢熺殑銆� + </p> + <p> + 鑸┖鍏徃鑱旂洘瀵逛簬閲嶆柊纭畾鑸┖鍏徃鐨勫競鍦哄畾浣嶏紝閫氳繃缁撴垚鑸┖鍏徃闂寸殑涓氬姟鑱旂洘锛屽悇鑸┖鍏徃鑷冲皯鍙互淇冧娇鏃呭鏇村鍦伴�夋嫨缁撶洘浼欎即鑰屼笉鏄珵浜夊鎵嬬殑鑸彮锛屼粠鑰岃揪鍒板墛寮辩珵浜夊鎵嬬殑鐩殑锛涗笌姝ゅ悓鏃讹紝瀹冭繕鍙兘閫氳繃鍒╃敤缁撶洘浼欎即鐨勬湇鍔¤鏂藉拰鎶�鏈敮鎸佹潵鍓婂噺鎴愭湰锛屼互澧炲姞鍒╂鼎銆傜敱浜庡悇鍥借埅绌哄競鍦洪珮搴︿竴浣撳寲锛屽瑙備笂瑕佹眰鍚勮埅绌哄叕鍙稿湪鎶�鏈敮鎸併�佽埅鐝湇鍔°�佹梾瀹㈣浆鏈轰互鍙婃満绁ㄥ嚭鍞瓑鏂归潰鍚戞梾瀹㈡彁渚涗竴浣撳寲鐨勬爣鍑嗗寲瑙勮寖鏈嶅姟锛岃姹傚悇鑸┖鍏徃鍦ㄤ笟鍔℃爣鍑嗙瓑鏂归潰缁熶竴璧锋潵锛屼粠鑰屽舰鎴愪竴涓笘鐣岃埅绌哄競鍦轰笂缁熶竴鐨勬妧鏈爣鍑嗗拰鏈嶅姟鏍囧噯銆傚湪鑸┖甯傚満涓婂瓨鍦ㄧ潃澶氬鑸┖鍏徃骞朵笖甯傚満鏃犻檺缁嗗垎鐨勬儏鍐典笅锛岃鍋氬埌杩欎竴鐐规槸闈炲父鍥伴毦鐨勩�備粠杩欎釜鎰忎箟涓婃潵璇达紝鐩稿浜庤繀閫熸墿澶х殑鍏ㄧ悆鑸┖甯傚満鑰岃█锛岀幇鏈夌殑鑸┖鍏徃瑙勬ā鏄瘮杈冨皬鐨勶紝鍥犺�岃埅绌哄叕鍙镐箣闂寸殑涓氬姟鑱旂洘鑷冲皯鍙互鍦ㄤ竴瀹氱▼搴︿笂瑙e喅杩欎釜闂銆傝嫳鍥借埅绌哄叕鍙哥殑鎬昏鍗冲绉帮細鈥滄垜浠殑椤惧瑕佹眰鍚勮埅绌哄叕鍙镐竴璧峰姫鍔涙彁渚涗笘鐣岃寖鍥村唴鐨勬湇鍔℃爣鍑嗐�傚瀹囦竴瀹跺皢鍋氬埌杩欎竴鐐广�傗�� + </p> + </div> + <ul class="header-left-box"> + <li class="">路10路</li> + </ul> + </div> + </div> + <!-- 11椤� --> + <div class="page-box" page="11"> + <div v-if="showPageList.indexOf(11) > -1"> + <ul class="header-right"> + <li class="headerRight-Text">椤圭洰涓�銆�姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍</li> + <span class="headerRight-box"></span> + </ul> + <div class="bodystyle"> + <p> + 灞曟湜鏈潵锛屾皯鑸綔涓轰竴涓暣浣撶郴缁熷湪缁撴瀯涓婂拰杩愯惀涓婅缁х画閫傚簲鍏ㄧ悆涓�浣撳寲鐨勮姹傦紝涓嶆柇鍦版敼杩涘拰鍙戝睍锛岀户缁檷浣庝环鏍硷紝淇濊瘉鏃呭鐨勮垝閫傚畨鍏紝鎷撳睍鏇翠赴瀵岀殑鐗硅壊鏈嶅姟锛屽噺灏戝悇绉嶉檺鍒讹紝淇濇姢鐜锛屾皯鑸皢杩庢潵涓�涓洿绻佽崳鏄岀洓鐨勯樁娈点�� + </p> + <div class="fl jc-c"> + <h1>浠诲姟浜屻��浜嗚В涓浗姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍</h1> + </div> + <p class="firstLevel-t">涓�銆佷腑鍥芥皯鑸殑鍙戝睍姒傚喌</p> + <p> + 1949骞�11鏈�2鏃ワ紝涓浗姘戠敤鑸┖灞�鎴愮珛锛屾彮寮�浜嗘垜鍥芥皯鑸簨涓氬彂灞曠殑鏂扮瘒绔犮�備粠杩欎竴澶╁紑濮嬶紝鏂颁腑鍥芥皯鑸笟杩庣潃鍏卞拰鍥界殑鏈濋槼璧烽锛屼粠鏃犲埌鏈夛紝鐢卞皬鍒板ぇ锛岀敱寮卞埌寮猴紝缁忓巻浜嗕笉骞冲嚒鐨勫彂灞曞巻绋嬨�傜壒鍒槸鍗佷竴灞婁笁涓叏浼氫互鏉ワ紝鎴戝浗姘戣埅浜嬩笟鏃犺鍦ㄨ埅绌鸿繍杈撱�侀�氱敤鑸┖銆佹満缇ゆ洿鏂般�佹満鍦哄缓璁俱�佽埅绾垮竷灞�銆佽埅琛屼繚闅溿�侀琛屽畨鍏ㄣ�佷汉鎵嶅煿璁瓑鏂归潰閮芥寔缁揩閫熷彂灞曪紝鍙栧緱浜嗕妇涓栫灘鐩殑鎴愬氨銆傛皯鑸簨涓氱殑鍙戝睍涓庡浗瀹剁殑缁忔祹鍙戝睍锛屼笌鍏氫腑澶�佸浗鍔¢櫌鐨勭洿鎺ラ瀵煎拰鏀寔瀵嗕笉鍙垎锛屾槸鍑犱唬姘戣埅骞查儴鑱屽伐鍔辩簿鍥炬不銆佸洟缁撳鏂楃殑缁撴灉锛屼负绁栧浗钃濆ぉ浜嬩笟涔﹀啓浜嗗.涓界殑绡囩珷銆� + </p> + <p class="td-0 video-title mt-20"> + <svg + t="1729840629103" + class="icon" + viewBox="0 0 1365 1024" + version="1.1" + xmlns="http://www.w3.org/2000/svg" + p-id="34778" + xmlns:xlink="http://www.w3.org/1999/xlink" + width="34" + height="40" + > + <path + d="M531.117831 720.79677l341.333334-170.641145a42.673047 42.673047 0 0 0 0-76.566472L531.117831 303.20323a42.673047 42.673047 0 0 0-61.814665 38.130103v341.333334a42.673047 42.673047 0 0 0 61.814665 38.130103zM1237.724282 0H127.612523A128.376452 128.376452 0 0 0 0.001736 128.580629V895.317282a128.019142 128.019142 0 0 0 127.610787 128.682718h1110.111759a128.427496 128.427496 0 0 0 127.610787-128.682718V128.580629a127.968097 127.968097 0 0 0-127.610787-128.580629zM255.988974 895.572504a42.46887 42.46887 0 0 1-43.081401 43.081402H128.429232a42.46887 42.46887 0 0 1-43.081402-43.081402V811.094163a42.417826 42.417826 0 0 1 43.081402-43.132446h84.580429a42.417826 42.417826 0 0 1 42.979313 43.132446z m0-341.333333a42.46887 42.46887 0 0 1-43.081401 42.979313H128.429232a42.46887 42.46887 0 0 1-43.081402-43.081402V469.607697a42.366781 42.366781 0 0 1 43.081402-43.081402h84.580429A42.417826 42.417826 0 0 1 255.988974 469.607697z m0-341.333334a42.46887 42.46887 0 0 1-43.081401 43.081402H128.429232a42.46887 42.46887 0 0 1-43.081402-43.081402V128.427496a42.366781 42.366781 0 0 1 43.081402-43.081402h84.580429a42.417826 42.417826 0 0 1 42.979313 43.081402z m768.012762 725.748069H341.335069V85.346094H1023.950691v853.307812z m255.987238-43.081402a42.46887 42.46887 0 0 1-43.132446 43.081402h-84.529385a42.417826 42.417826 0 0 1-43.030357-43.081402V811.094163a42.46887 42.46887 0 0 1 43.081401-43.132446h84.58043a42.46887 42.46887 0 0 1 43.030357 43.132446z m0-341.333333a42.46887 42.46887 0 0 1-43.132446 43.081401h-84.529385a42.417826 42.417826 0 0 1-43.030357-43.081401V469.607697a42.417826 42.417826 0 0 1 43.081401-43.081402h84.58043a42.417826 42.417826 0 0 1 43.030357 43.081402z m0-341.333334a42.46887 42.46887 0 0 1-43.132446 43.081402h-84.529385a42.417826 42.417826 0 0 1-43.030357-43.081402V128.427496a42.417826 42.417826 0 0 1 43.081401-43.081402h84.58043a42.417826 42.417826 0 0 1 43.030357 43.081402z" + fill="#1c9e3a" + p-id="34779" + ></path> + </svg> + <span>瑙嗛寰</span> + </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" + ></video> + </p> + <p class="center videoname"> + <span>01 涓浗姘戠敤鑸┖杩愯緭鐨勫彂灞�</span> + <el-tooltip + class="item" + effect="dark" + :content=" + chapterData.isCollectVideoFive ? '鐐瑰嚮鍙栨秷' : '鐐瑰嚮鏀惰棌' + " + placement="top-start" + > + <img + :src=" + collectResourceList.findIndex( + (item) => item.id == '20915be5a2980251b3294f657fec5345' + ) > -1 + ? collectCheck + : collectImg + " + alt="" + class="collect-btn" + @click="handleCollect('video-01')" + /> + </el-tooltip> + </p> + </div> + <p class="firstLevel-t">浜屻�佷腑鍥芥皯鑸殑鍙戝睍闃舵</p> + <p>涓浗姘戣埅鍙戝睍鑷充粖涓昏缁忓巻浜嗗洓涓樁娈碉細</p> + <p class="Secondary-t">锛堜竴锛夌涓�闃舵锛�1949~1978锛�</p> + <p> + 1949骞�11鏈�2鏃ワ紝涓叡涓ぎ鏀挎不灞�浼氳鍐冲畾锛屽湪浜烘皯闈╁懡鍐涗簨濮斿憳浼氫笅璁炬皯鐢ㄨ埅绌哄眬锛屽彈绌哄啗鎸囧銆�11鏈�9 + 鏃ワ紝涓浗鑸┖鍏徃銆佷腑澶埅绌哄叕鍙告�荤粡鐞嗗垬鏁疁銆侀檲鍗撴灄鐜囦袱鍏徃鍦ㄩ娓殑鍛樺伐鍏夎崳璧蜂箟锛屽苟鐜囬12鏋堕鏈哄洖鍒板寳浜�佸ぉ娲ワ紝涓烘柊涓浗姘戣埅寤鸿鎻愪緵浜嗕竴瀹氱殑鐗╄川鍜屾妧鏈姏閲忋��1950骞达紝鏂颁腑鍥芥皯鑸垵鍒涙椂锛屼粎鏈�30澶氭灦灏忓瀷椋炴満锛屽勾鏃呭杩愯緭閲忎粎1涓囦汉锛岃繍杈撴�诲懆杞噺浠�157涓囧惃鍏噷銆� + </p> + </div> + <ul class="headerRight-Number"> + <li class="">路11路</li> + </ul> + </div> + </div> + <!-- 12椤� --> + <div class="page-box" page="12"> + <div v-if="showPageList.indexOf(12) > -1"> + <ul class="header-left"> + <img src="../../assets/images/header-left.png" alt="" /> + <li class="headerText">姘戣埅鏃呭杩愯緭</li> + </ul> + <div class="bodystyle"> + <p> + 1958骞�2鏈�27鏃ワ紝鍥藉姟闄㈠喅瀹氾紝涓浗姘戠敤鑸┖灞�鑷湰鏃ヨ捣鍒掑綊浜ら�氶儴棰嗗銆�1958骞�3鏈�19鏃ワ紝鍏ㄥ浗浜哄ぇ甯稿浼氱95娆′細璁壒鍑嗕腑鍥芥皯鐢ㄨ埅绌哄眬鏀逛负浜ら�氶儴鐨勯儴灞炲眬銆� + </p> + <p> + 1960骞�11鏈�17鏃ワ紝鍥藉姟闄㈢紪鍒跺鍛樹細璁ㄨ閫氳繃锛屽喅瀹氬皢涓浗姘戠敤鑸┖灞�鏀圭О鈥滀氦閫氶儴姘戠敤鑸┖鎬诲眬鈥濓紝涓洪儴灞炰竴绾х鐞嗗叏鍥芥皯鐢ㄨ埅绌轰簨涓氱殑缁煎悎鎬ф�诲眬锛岃礋璐g粡钀ョ鐞嗚繍杈撹埅绌哄拰涓撲笟鑸┖锛岀洿鎺ラ瀵煎湴鍖烘皯鐢ㄨ埅绌虹鐞嗗眬鐨勫伐浣溿�� + </p> + <p> + 1962骞�4鏈�13鏃ワ紝绗簩灞婂叏鍥戒汉姘戜唬琛ㄥぇ浼氬父鍔″鍛樹細绗�53娆′細璁喅瀹氾紝姘戣埅灞�鏇村悕涓衡�滀腑鍥芥皯鐢ㄨ埅绌烘�诲眬鈥濄�� + </p> + <p> + 1962骞�4鏈�15鏃ワ紝涓ぎ鍐冲畾灏嗘皯鐢ㄨ埅绌烘�诲眬鐢变氦閫氶儴灞炴敼涓哄浗鍔¢櫌鐩村睘灞�锛屽叾涓氬姟宸ヤ綔銆佸厷鏀垮伐浣溿�佸共閮ㄤ汉浜嬪伐浣滅瓑鍧囩洿褰掔┖鍐涜礋璐g鐞嗐�傝繖涓�鏃舵湡锛屾皯鑸敱浜庨瀵间綋鍒跺嚑缁忔敼鍙橈紝鑸┖杩愯緭鍙戝睍鍙楁斂娌汇�佺粡娴庡奖鍝嶈緝澶с��1978 + 骞达紝鑸┖鏃呭杩愯緭閲忎粎涓�231涓囦汉娆★紝杩愯緭鎬诲懆杞噺3浜垮惃鍏噷銆� + </p> + <div class="pdf-box"> + <div class="pdf-title"> + <p class="pdf-title-name"> + <img src="../../assets/images/pdfLogo.svg" alt="" /> + <span>鎷撳睍鐭ヨ瘑</span> + </p> + <p class="pdf-title-img"> + <span @click="toUrl(2)"> {{ chapter001.pdfMd5[2].name }}</span> + <el-tooltip + class="item" + effect="dark" + :content=" + chapterData.isCollectVideoTwo ? '鐐瑰嚮鍙栨秷' : '鐐瑰嚮鏀惰棌' + " + placement="top-start" + > + <img + :src=" + collectResourceList.findIndex( + (item) => item.id == 'ac8fc00ea84cb3504a5ad0c7c2025652' + ) > -1 + ? collectCheck + : collectImg + " + alt="" + class="collect-btn" + @click="handleCollect('pdf-02')" + /> + </el-tooltip> + </p> + </div> + </div> + <div class="pdf-box"> + <div class="pdf-title"> + <p class="pdf-title-name"> + <img src="../../assets/images/pdfLogo.svg" alt="" /> + <span>鎷撳睍鐭ヨ瘑</span> + </p> + <p class="pdf-title-img"> + <span @click="toUrl(3)"> {{ chapter001.pdfMd5[3].name }}</span> + <el-tooltip + class="item" + effect="dark" + :content=" + chapterData.isCollectVideoThree ? '鐐瑰嚮鍙栨秷' : '鐐瑰嚮鏀惰棌' + " + placement="top-start" + > + <img + :src=" + collectResourceList.findIndex( + (item) => item.id == 'df538ab7d44f8c73b7386a2584b84a68' + ) > -1 + ? collectCheck + : collectImg + " + alt="" + class="collect-btn" + @click="handleCollect('pdf-03')" + /> + </el-tooltip> + </p> + </div> + </div> + <p class="Secondary-t">锛堜簩锛夌浜岄樁娈碉紙1978~1987锛�</p> + <p> + 1978骞�10鏈�9鏃ワ紝閭撳皬骞冲悓蹇楁寚绀烘皯鑸鐢ㄧ粡娴庤鐐圭鐞嗐��1980骞�2鏈�14鏃ワ紝閭撳皬骞冲悓蹇楁寚鍑猴細鈥滄皯鑸竴瀹氳浼佷笟鍖栥�傗�濆悓骞�3鏈�5鏃ワ紝涓浗鏀垮簻鍐冲畾姘戣埅鑴辩鍐涢槦寤哄埗锛屾妸涓浗姘戣埅灞�浠庨毝灞炰簬绌哄啗鏀逛负鍥藉姟闄㈢洿灞炴満鏋勶紝瀹炶浼佷笟鍖栫鐞嗐�傝繖鏈熼棿涓浗姘戣埅灞�鏄斂浼佸悎涓�锛屾棦鏄富绠℃皯鑸簨鍔$殑鏀垮簻閮ㄩ棬锛屽張鏄互鈥滀腑鍥芥皯鑸紙CAAC锛夆�濆悕涔夌洿鎺ョ粡钀ヨ埅绌鸿繍杈撱�侀�氱敤鑸┖涓氬姟鐨勫叏鍥芥�т紒涓氾紝涓嬭鍖椾含銆佷笂娴枫�佸箍宸炪�佹垚閮姐�佸叞宸烇紙鍚庤縼鑷宠タ瀹夛級銆佹矆闃冲叚涓湴鍖虹鐞嗗眬銆�1980骞村叏鍥芥皯鑸彧鏈�140鏋惰繍杈撻鏈猴紝涓斿鏁版槸20涓栫邯50骞翠唬鎴�40 + 骞翠唬鐢熶骇鍒堕�犵殑鑻忓紡浼婂皵14銆侀噷浜屽瀷椋炴満锛岃浇瀹㈤噺浠�20澶氫汉鎴�40浜猴紝杞藉閲�100浜轰互涓婄殑涓ぇ鍨嬮鏈哄彧鏈� + 17鏋讹紱鏈哄満鍙湁79涓��1980骞达紝鎴戝浗姘戣埅鍏ㄥ勾鏃呭杩愯緭閲忎粎343涓囦汉娆★紱鍏ㄥ勾杩愯緭鎬诲懆杞噺4.29浜垮惃鍏噷锛屽眳鏂板姞鍧°�佸嵃搴︺�佽彶寰嬪銆佸嵃搴﹀凹瑗夸簹绛夊浗涔嬪悗锛屽垪涓栫晫姘戣埅绗�35浣嶃�� + </p> + </div> + <ul class="header-left-box"> + <li class="">路12路</li> + </ul> + </div> + </div> + <!-- 13椤� --> + <div class="page-box" page="13"> + <div v-if="showPageList.indexOf(13) > -1"> + <ul class="header-right"> + <li class="headerRight-Text">椤圭洰涓�銆�姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍</li> + <span class="headerRight-box"></span> + </ul> + <div class="bodystyle"> + <p> + 1985骞�1鏈�1鏃ワ紝涓浗姘戠敤鑸┖鏂扮枂缁村惥灏旇嚜娌诲尯绠$悊灞�鏇村悕涓轰腑鍥芥皯鐢ㄨ埅绌轰箤椴佹湪榻愮鐞嗗眬锛屾敼鐢辨皯鑸眬鐩存帴棰嗗锛岀粡鍥藉姟闄㈡壒鍑嗭紝鐢辨皯鑸眬鍜屾柊鐤嗙淮鍚惧皵鑷不鍖轰汉姘戞斂搴滆仈鍚堢粍寤虹殑鏂扮枂鑸┖鍏徃浜庡悓鏃ュ湪涔岄瞾鏈ㄩ綈姝e紡鎴愮珛銆備箤椴佹湪榻愮鐞嗗眬鍜屾柊鐤嗚埅绌哄叕鍙告槸涓ゅ潡鐗屽瓙涓�濂楁満鏋勶紝灞炰袱浣嶄竴浣撶殑缁勭粐褰㈠紡銆� + </p> + <p class="Secondary-t">锛堜笁锛夌涓夐樁娈碉紙1987~2002锛�</p> + <p> + 1987骞达紝涓浗鏀垮簻鍐冲畾瀵规皯鑸笟杩涜浠ヨ埅绌哄叕鍙镐笌鏈哄満鍒嗚涓虹壒寰佺殑浣撳埗鏀归潻銆備富瑕佸唴瀹规槸灏嗗師姘戣埅鍖椾含銆佷笂娴枫�佸箍宸炪�佽タ瀹夈�佹垚閮姐�佹矆闃冲叚涓湴鍖虹鐞嗗眬鐨勮埅绌鸿繍杈撳拰閫氱敤鑸┖鐩稿叧涓氬姟銆佽祫浜у拰浜哄憳鍒嗙鍑烘潵锛岀粍寤轰簡鍏釜鍥藉楠ㄥ共鑸┖鍏徃锛屽疄琛岃嚜涓荤粡钀ャ�佽嚜璐熺泩浜忋�佸钩绛夌珵浜夈�傝繖鍏釜鍥藉楠ㄥ共鑸┖鍏徃鏄細涓浗鍥介檯鑸┖鍏徃銆佷腑鍥戒笢鏂硅埅绌哄叕鍙搞�佷腑鍥藉崡鏂硅埅绌哄叕鍙搞�佷腑鍥借タ鍗楄埅绌哄叕鍙搞�佷腑鍥借タ鍖楄埅绌哄叕鍙搞�佷腑鍥藉寳鏂硅埅绌哄叕鍙搞�傛澶栵紝浠ョ粡钀ラ�氱敤鑸┖涓氬姟涓轰富骞跺吋钀ヨ埅绌鸿繍杈撲笟鍔$殑涓浗閫氱敤鑸┖鍏徃涔熶簬1989骞�7鏈堟垚绔嬨�� + </p> + <p> + 鍦ㄧ粍寤洪骞茶埅绌哄叕鍙哥殑鍚屾椂锛屽湪鍘熸皯鑸寳浜鐞嗗眬銆佷笂娴风鐞嗗眬銆佸箍宸炵鐞嗗眬銆佹垚閮界鐞嗗眬銆佽タ瀹夌鐞嗗眬鍜屾矆闃崇鐞嗗眬鎵�鍦ㄥ湴鐨勬満鍦洪儴鍒嗗熀纭�涓婏紝缁勫缓浜嗘皯鑸崕鍖椼�佸崕涓溿�佷腑鍗椼�佽タ鍗椼�佽タ鍖楀拰涓滃寳鍏釜鍦板尯绠$悊灞�浠ュ強鍖椾含棣栭兘鏈哄満銆佷笂娴疯櫣妗ユ満鍦恒�佸箍宸炵櫧浜戞満鍦恒�佹垚閮藉弻娴佹満鍦恒�佽タ瀹夎タ鍏虫満鍦猴紙鐜板凡杩佽嚦鍜搁槼锛屾敼涓鸿タ瀹夊捀闃虫満鍦猴級鍜屾矆闃虫浠欐満鍦恒�傚叚涓湴鍖虹鐞嗗眬鏃㈡槸绠$悊鍦板尯姘戣埅浜嬪姟鐨勬斂搴滈儴闂紝鍙堟槸浼佷笟锛岄瀵肩鐞嗗悇姘戣埅鐪侊紙鍖恒�佸競锛夊眬鍜屾満鍦恒�� + </p> + <p> + 鑸┖杩愯緭鏈嶅姟淇濋殰绯荤粺涔熸寜涓撲笟鍖栧垎宸ョ殑瑕佹眰杩涜浜嗙浉搴旂殑鏀归潻銆�1990 + 骞达紝鍦ㄥ師姘戣埅鍚勭骇渚涙补閮ㄩ棬鐨勫熀纭�涓婄粍寤轰簡涓撻棬浠庝簨鑸┖娌规枡渚涘簲淇濋殰涓氬姟鐨勪腑鍥借埅绌烘补鏂欐�诲叕鍙革紝璇ュ叕鍙搁�氳繃璁惧湪鍚勬満鍦虹殑鍒嗘敮鏈烘瀯涓鸿埅绌哄叕鍙告彁渚涙补鏂欎緵搴斻�傚睘浜庤繖绫绘�ц川鐨勫崟浣嶈繕鏈変粠浜嬭埅绌哄櫒鏉愶紙椋炴満銆佸彂鍔ㄦ満绛夛級杩涘嚭鍙d笟鍔$殑涓浗鑸┖鍣ㄦ潗鍏徃锛屼粠浜嬪叏鍥借绠楁満璁㈢エ閿�鍞郴缁熺鐞嗕笌寮�鍙戠殑璁$畻鏈轰俊鎭腑蹇冿紝涓哄悇鑸┖鍏徃鎻愪緵鑸┖杩愯緭鍥介檯缁撶畻鏈嶅姟鐨勮埅绌虹粨绠椾腑蹇冧互鍙婇鏈虹淮淇叕鍙搞�佽埅绌洪鍝佸叕鍙哥瓑锛屽叏姘戣埅鏀夸紒鍒嗗紑鐨勬柊鐨勭鐞嗕綋鍒跺拰鏍煎眬閫愭褰㈡垚銆� + </p> + <p> + 1993骞�4鏈�19鏃ワ紝涓浗姘戠敤鑸┖灞�鏀圭О涓浗姘戠敤鑸┖鎬诲眬锛屽睘鍥藉姟闄㈢洿灞炴満鏋勩�傚悓骞�12鏈�20鏃ワ紝涓浗姘戠敤鑸┖鎬诲眬鐨勬満鏋勮鏍肩敱鍓儴绾ц皟鏁翠负姝i儴绾с�� + </p> + </div> + <ul class="headerRight-Number"> + <li class="">路13路</li> + </ul> + </div> + </div> + <!-- 14椤� --> + <div class="page-box" page="14"> + <div v-if="showPageList.indexOf(14) > -1"> + <ul class="header-left"> + <img src="../../assets/images/header-left.png" alt="" /> + <li class="headerText">姘戣埅鏃呭杩愯緭</li> + </ul> + <div class="bodystyle"> + <p> + 20澶氬勾涓紝鎴戝浗姘戣埅杩愯緭鎬诲懆杞噺銆佹梾瀹㈣繍杈撻噺鍜岃揣鐗╄繍杈撻噺骞村潎澧為暱鍒嗗埆杈�18%銆�16%鍜�16%锛岄珮鍑轰笘鐣屽钩鍧囨按骞充袱鍊嶅銆�2002骞达紝姘戣埅琛屼笟瀹屾垚杩愯緭鎬诲懆杞噺165浜垮惃鍏噷銆佹梾瀹㈣繍杈撻噺8594涓囦汉娆°�佽揣閭繍杈撻噺202涓囧惃锛屽浗闄呮帓浣嶈繘涓�姝ヤ笂鍗囷紝鎴愪负浠や汉鐬╃洰鐨勬皯鑸ぇ鍥姐�� + </p> + <p class="Secondary-t">锛堝洓锛夌鍥涢樁娈碉紙2002~浠婏級</p> + <p> + 2002骞�3鏈堬紝涓浗鏀垮簻鍐冲畾瀵逛腑鍥芥皯鑸笟鍐嶆杩涜閲嶇粍銆備富瑕佸唴瀹规湁锛氶鍏堟槸鑸┖鍏徃涓庢湇鍔′繚闅滀紒涓氱殑鑱斿悎閲嶇粍銆傛皯鑸�诲眬鐩村睘鐨勮埅绌哄叕鍙稿強鏈嶅姟淇濋殰浼佷笟鍚堝苟鍚庯紝浜�2002骞�10鏈�11鏃ユ寮忔寕鐗屾垚绔嬶紝缁勬垚涓哄叚澶ч泦鍥㈠叕鍙革紝鍒嗗埆鏄細涓浗鑸┖闆嗗洟鍏徃銆佷笢鏂硅埅绌洪泦鍥㈠叕鍙搞�佸崡鏂硅埅绌洪泦鍥㈠叕鍙搞�佷腑鍥芥皯鑸俊鎭泦鍥㈠叕鍙搞�佷腑鍥借埅绌烘补鏂欓泦鍥㈠叕鍙搞�佷腑鍥借埅绌哄櫒鏉愯繘鍑哄彛闆嗗洟鍏徃銆傛垚绔嬪悗鐨勯泦鍥㈠叕鍙镐笌姘戣埅鎬诲眬鑴遍挬锛屼氦鐢变腑澶鐞嗐�� + </p> + <p> + 鍏舵鏄皯鑸斂搴滅洃绠℃満鏋勬敼闈┿�傛皯鑸�诲眬涓嬪睘涓冧釜鍦板尯绠$悊灞�锛堝崕鍖楀湴鍖虹鐞嗗眬銆佷笢鍖楀湴鍖虹鐞嗗眬銆佸崕涓滃湴鍖虹鐞嗗眬銆佷腑鍗楀湴鍖虹鐞嗗眬銆佽タ鍗楀湴鍖虹鐞嗗眬銆佽タ鍖楀湴鍖虹鐞嗗眬銆佹柊鐤嗙鐞嗗眬锛夊拰26涓渷绾у畨鍏ㄧ洃鐫g鐞嗗姙鍏锛堝ぉ娲ャ�佹渤鍖椼�佸北瑗裤�佸唴钂欏彜銆佸ぇ杩炪�佸悏鏋椼�侀粦榫欐睙銆佹睙鑻忋�佹禉姹熴�佸畨寰姐�佺寤恒�佹睙瑗裤�佸北涓溿�侀潚宀涖�佹渤鍗椼�佹箹鍖椼�佹箹鍗椼�佹捣鍗椼�佸箍瑗裤�佹繁鍦炽�侀噸搴嗐�佽吹宸炪�佷簯鍗椼�佺敇鑲冦�侀潚娴枫�佸畞澶忥級锛屽姘戣埅浜嬪姟瀹炴柦鐩戠銆� + </p> + <p> + 鏈�鍚庢槸鏈哄満瀹炶灞炲湴绠$悊銆傛寜鐓ф斂浼佸垎寮�銆佸睘鍦扮鐞嗙殑鍘熷垯锛屽93涓満鍦鸿繘琛屼簡灞炲湴鍖栫鐞嗘敼闈╋紝姘戣埅鎬诲眬鐩存帴绠$悊鐨勬満鍦轰笅鏀炬墍鍦ㄧ渷锛堝尯銆佸競锛夌鐞嗭紝鐩稿叧璧勪骇銆佽礋鍊哄拰浜哄憳涓�骞跺垝杞紱姘戣埅鎬诲眬涓庡湴鏂规斂搴滆仈鍚堢鐞嗙殑姘戠敤鏈哄満鍜屽啗姘戝悎鐢ㄦ満鍦猴紝灞炴皯鑸�诲眬绠$悊鐨勮祫浜с�佽礋鍊哄強鐩稿叧浜哄憳涓�骞跺垝杞墍鍦ㄧ渷锛堝尯銆佸競锛夌鐞嗐�傞閮芥満鍦恒�佽タ钘忚嚜娌诲尯鍖哄唴鐨勬皯鐢ㄦ満鍦虹户缁敱姘戣埅鎬诲眬绠$悊銆�2004骞�7鏈�8鏃ワ紝闅忕潃鐢樿們鏈哄満绉讳氦鍦版柟锛屾満鍦哄睘鍦板寲绠$悊鏀归潻鍏ㄩ潰瀹屾垚锛屼篃鏍囧織鐫�姘戣埅浣撳埗鏀归潻鍏ㄩ潰瀹屾垚銆� + </p> + <p> + 2004骞�10鏈�2鏃ワ紝鍦ㄥ浗闄呮皯鑸粍缁囩涓夊崄浜斿眾澶т細涓婏紝涓浗浠ラ珮绁ㄦ暟褰撻�夎缁勭粐涓�绫荤悊浜嬪浗銆� + </p> + <p> + 2005骞达紝鎴戝浗瀹氭湡鑸彮杩愯緭鎬诲懆杞噺鍦ㄥ浗闄呮皯鑸粍缁囩紨绾﹀浗涓殑鎺掑悕锛岀敱1978骞寸殑绗笁鍗佷竷浣嶄笂鍗囪嚦绗簩浣嶃�� + </p> + </div> + <ul class="header-left-box"> + <li class="">路14路</li> + </ul> + </div> + </div> + <!-- 15椤� --> + <div class="page-box" page="15"> + <div v-if="showPageList.indexOf(15) > -1"> + <ul class="header-right"> + <li class="headerRight-Text">椤圭洰涓�銆�姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍</li> + <span class="headerRight-box"></span> + </ul> + <div class="bodystyle"> + <p> + 2008骞�3鏈堬紝涓浗姘戠敤鑸┖鎬诲眬鏇村悕涓轰腑鍥芥皯鐢ㄨ埅绌哄眬锛屽綊浜ら�氳繍杈撻儴绠$悊銆� + </p> + <p> + 鎴嚦2019骞村勾搴曪紝鍏ㄨ涓氬畬鎴愯繍杈撴�诲懆杞噺1293.25浜垮惃鍏噷锛屽叾涓梾瀹㈠懆杞噺11 + 705.30浜夸汉鍏噷锛岃揣閭懆杞噺263.20浜垮惃鍏噷锛屽垎鍒瘮涓婂勾澧炲姞7.2%銆�9.3%鍜�0.3%銆傛垜鍥藉叡鏈夊畾鏈熻埅鐝埅绾�5521鏉★紝鍥藉唴閫氳埅鍩庡競234涓�(涓嶅惈棣欐腐銆佹境闂ㄣ�佸彴婀�)锛屽浗闄呭畾鏈熻埅鐝�氳埅65涓浗瀹剁殑167涓煄甯傦紝鍥藉唴鑸┖鍏徃瀹氭湡鑸彮浠�30涓唴鍦板煄甯傞�氳埅棣欐腐锛屼粠19涓唴鍦板煄甯傞�氳埅婢抽棬锛屽ぇ闄嗚埅绌哄叕鍙镐粠49涓ぇ闄嗗煄甯傞�氳埅鍙版咕鍦板尯銆傚叏姘戣埅鍦ㄥ唽椋炴満鎬绘灦鏁�3818鏋讹紝姣斾笂涓�骞村鍔�179鏋躲�傚叡鏈夐璇佽繍杈撴満鍦�238涓紝姣斾笂骞村鍔�3涓��2019骞村寳浜閮芥満鍦哄畬鎴愭梾瀹㈠悶鍚愰噺1.00浜夸汉娆★紝杩炵画10骞寸ǔ灞呬笘鐣岀浜岋紱涓婃捣娴︿笢鍥介檯鏈哄満瀹屾垚璐ч偖鍚炲悙閲�363.42涓囧惃锛岃繛缁�12骞翠綅灞呬笘鐣岀涓夈�� + </p> + <p> + 鎴戝浗宸茬粡褰㈡垚浜嗗浗鍐呭洓閫氬叓杈俱�佸浗闄呰繛鎺ヤ笘鐣屼富瑕佸浗瀹跺拰鍦板尯鐨勮埅绌鸿繍杈撶綉缁滐紝鏈嶅姟璐ㄩ噺鍜屾湇鍔℃按骞充篃鏈変簡寰堝ぇ鎻愰珮銆�2019骞村害SKYTRAX涓栫晫鍗佷匠鏈哄満鎺掑悕涓紝棣欐腐鍥介檯鏈哄満鍐嶆姒滀笂鏈夊悕銆�2019骞存捣鍗楄埅绌轰綔涓轰腑鍥藉唴鍦板敮涓�涓�瀹禨KYTRAX浜旀槦鑸┖鍏徃锛岀涔濇鑾疯瘎SKYTRAX鐨勪簲鏄熻埅绌哄叕鍙歌崳瑾夈�� + </p> + <p class="mb-30"> + 鏂颁腑鍥芥皯鑸殑鍙戝睍鍘嗙▼璇佹槑锛氬彂灞曟墠鏄‖閬撶悊銆備腑鍥芥皯鑸瀹炵幇浠庢皯鑸ぇ鍥藉埌姘戣埅寮哄浗鐨勮法瓒婏紝蹇呴』浠ユ寔缁畨鍏ㄤ负鍓嶆彁锛屼互鎻愬崌鍙戝睍璐ㄩ噺涓烘牳蹇冿紝浠ユ敼闈╁垱鏂颁负鍔ㄥ姏锛屼互纭珛姘戣埅涓氬湪鍥藉鍙戝睍涓殑鎴樼暐鍦颁綅涓虹獊鐮村彛锛屽姞蹇缓璁炬皯鑸熀纭�璁炬柦缃戠粶锛屽姞寮虹粺绛瑰崗璋冿紝鐞嗛『浣撳埗鏈哄埗锛屽姫鍔涙瀯寤哄叿鏈変腑鍥界壒鑹茬殑鐜颁唬姘戠敤鑸┖浣撶郴锛屽叏闈㈡彁鍗囨垜鍥芥皯鑸笟缁煎悎鍥介檯绔炰簤鍔涳紝淇冭繘鍥藉鐜颁唬缁煎悎浜ら�氳繍杈撲綋绯荤殑杩涗竴姝ュ畬鍠勶紝涓虹粡娴庣ぞ浼氬張濂藉張蹇彂灞曟湇鍔°�� + </p> + <div class="pdf-box"> + <div class="pdf-title"> + <p class="pdf-title-name"> + <img src="../../assets/images/pdfLogo.svg" alt="" /> + <span>鎷撳睍鐭ヨ瘑</span> + </p> + <p class="pdf-title-img"> + <span @click="toUrl(4)"> {{ chapter001.pdfMd5[4].name }}</span> + <el-tooltip + class="item" + effect="dark" + :content=" + chapterData.isCollectVideoFour ? '鐐瑰嚮鍙栨秷' : '鐐瑰嚮鏀惰棌' + " + placement="top-start" + > + <img + :src=" + collectResourceList.findIndex( + (item) => item.id == '9bfa634653b1c2a51aff13cedf1ccd2d' + ) > -1 + ? collectCheck + : collectImg + " + alt="" + class="collect-btn" + @click="handleCollect('pdf-04')" + /> + </el-tooltip> + </p> + </div> + </div> + <div class="Unit-title-box"> + <p class="box-title">椤圭洰灏忕粨</p> + <p class="fm-kt"> + 1.涓栫晫姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍缁忚繃浜嗚悓鑺芥椂鏈熴�佸ぇ鍙戝睍鏃舵湡銆佸叏鐞冨寲鍙婂ぇ浼楀寲鏃舵湡锛岀洰鍓嶆鍦ㄨ繘琛岀殑鏄叏鐞冩垬鐣ユ�ц仈鐩燂紝骞跺舰鎴愪簡涓嶅悓鐨勮仈鐩熷疄浣撱�� + </p> + </div> + </div> + <ul class="headerRight-Number"> + <li class="">路15路</li> + </ul> + </div> + </div> + <!-- 16椤� --> + <div class="page-box" page="16"> + <div v-if="showPageList.indexOf(16) > -1"> + <ul class="header-left"> + <img src="../../assets/images/header-left.png" alt="" /> + <li class="headerText">姘戣埅鏃呭杩愯緭</li> + </ul> + <div class="bodystyle"> + <div class="Unit-title-box"> + <p class="fm-kt"> + 2. + 涓浗姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍缁忓巻浜嗘棫涓浗鏃舵湡銆佽鍒掔粡娴庢椂鏈熴�佹敼闈╁紑鏀炬椂鏈熴�佷綋鍒舵敼闈╂椂鏈熶互鍙婅仈鍚堥噸缁勶紝鐩墠姝g敱姘戣埅澶у浗鍚戞皯鑸己鍥借繄杩涖�� + </p> + </div> + <div class="Unit-title-box"> + <p class="box-title">鎬濊�冧笌缁冧範</p> + <p class="fm-kt">1. 绠�杩颁笘鐣屾皯鐢ㄨ埅绌鸿繍杈撲笟鐨勫彂灞曘��</p> + <textarea + v-model="videoQuestionData.one" + placeholder="璇疯緭鍏ュ唴瀹�" + rows="5" + style="max-width: 90%; width: 90%" + class="fz-16 fm-son textarea-question ml-40" + @change="saveVideoQuestionData" + ></textarea> + <p class="fm-kt">2. 绠�杩颁腑鍥芥皯鐢ㄨ埅绌鸿繍杈撲笟鐨勫彂灞曘��</p> + <textarea + v-model="videoQuestionData.two" + placeholder="璇疯緭鍏ュ唴瀹�" + rows="5" + style="max-width: 90%; width: 90%" + class="fz-16 fm-son textarea-question ml-40" + @change="saveVideoQuestionData" + ></textarea> + <p class="fm-kt"> + 3. 姣旇緝涓浗姘戣埅浣撳埗鏀归潻鍓嶅悗锛屼腑鍥芥皯鐢ㄨ埅绌烘�诲眬鑱岃兘鐨勫彉鍖栥�� + </p> + <textarea + v-model="videoQuestionData.three" + placeholder="璇疯緭鍏ュ唴瀹�" + rows="5" + style="max-width: 90%; width: 90%" + class="fz-16 fm-son textarea-question ml-40" + @change="saveVideoQuestionData" + ></textarea> + <p class="fm-kt"> + 4. 鏌ヨ祫鏂欑粨鍚堟渚嬶紝浜嗚В涓浗姘戣埅鍙戝睍涓殑鈥滀袱鑸捣涔夆�濈殑鍘嗗彶銆� + </p> + <textarea + v-model="videoQuestionData.four" + placeholder="璇疯緭鍏ュ唴瀹�" + rows="5" + style="max-width: 90%; width: 90%" + class="fz-16 fm-son textarea-question ml-40" + @change="saveVideoQuestionData" + ></textarea> + <p class="fm-kt">5. 姣旇緝涓浗涓庝笘鐣岃埅绌鸿繍杈撶殑鍙戝睍銆�</p> + <textarea + v-model="videoQuestionData.five" + placeholder="璇疯緭鍏ュ唴瀹�" + rows="5" + style="max-width: 90%; width: 90%" + class="fz-16 fm-son textarea-question ml-40" + @change="saveVideoQuestionData" + ></textarea> + </div> + <div class="Unit-title-box"> + <p class="box-title">瀛︿範鏁堟灉鑷祴</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 class="Unit-title-box"> + <p class="box-title">瀹炶涓庡垎浜�</p> + <p class="fm-kt"> + 浠ュ皬缁勪负鍗曚綅锛屾敹闆嗕换鎰忎笁鍒欎笌鑸┖杩愯緭鐩稿叧鐨勬柊闂伙紝浠PT鏂瑰紡涓庡叾浠栧悓瀛﹀垎浜紝鍐呭褰㈠紡涓嶉檺銆� + </p> + <el-upload + ref="upload" + class="upload-demo" + action="'#'" + :limit="1" + :http-request="fileUpload" + :show-file-list="false" + > + <div class="uploadFiles"> + <img src="../../assets/images/uploadFiles.svg" alt="" /> + <span>涓婁紶PPT</span> + </div> + </el-upload> + <div + class="ppt-box" + v-if="pptData.pptName != ''" + v-loading="loading" + > + <p @click="openPPT()">{{ pptData.pptName }}.PPT</p> + <img + @click="deletePPT()" + src="../../assets/images/delectFile.svg" + alt="" + /> + </div> + </div> + </div> + <ul class="header-left-box"> + <li class="">路16路</li> + </ul> + </div> + </div> + <!-- 17椤� --> + <!-- <div class="page-box" page="5"> + <div v-if="showPageList.indexOf(5) > -1"> + <ul class="header-right"> + <li class="headerRight-Text">椤圭洰涓�銆�姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍</li> + <span class="headerRight-box"></span> + </ul> + <div class="bodystyle"></div> + <ul class="headerRight-Number"> + <li class="">路5路</li> + </ul> + </div> + </div> --> + <preView + :isClear="dialogVisible" + :md5="p_md5" + :pdfTitle="somePdfTitleValue" + ref="pdfDialogRef" + ></preView> + <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, uploadFilePath } from "@/assets/methods/resources"; +import { + getCollectResource, + setCollectResource, +} from "@/assets/methods/resources"; +import { Message } from "element-ui"; +import tool from "@/assets/js/toolClass.js"; +import preView from "@/components/pdfview/index.vue"; +import dialogExaminations from "@/components/dialogExaminations/index.vue"; +export default { + name: "chapterTwo", + props: { + showPageList: { + type: Array, + }, + interfaceQuestion: { + type: Object, + }, + }, + components: { + preView, + dialogExaminations, + }, + data() { + return { + collectImg: require("../../assets/images/icon/heart.png"), + collectCheck: require("../../assets/images/icon/heart-check.png"), + //pdf闃呰鍣� + dialogVisible: false, + pdfDialogRef: "", + somePdfTitleValue: "", + p_md5: "", + chapter001: { + pdfMd5: { + 1: { + md5: "d26f73df690bb8de6781c40d049560e3", + name: "鐭ヨ瘑鎷撳睍 1-1 涓浗绗竴浣嶉鏈鸿璁″笀鍐", + }, + 2: { + md5: "ac8fc00ea84cb3504a5ad0c7c2025652", + name: "鐭ヨ瘑鎷撳睍 1-2 涓よ埅绠�浠�", + }, + 3: { + md5: "df538ab7d44f8c73b7386a2584b84a68", + name: "妗堜緥鍒嗕韩 1-1 閲嶉鈥滀袱鑸捣涔夆�濅箣璺� 涓轰簡涓嶈兘蹇樺嵈鐨勭邯蹇�", + }, + 4: { + md5: "9bfa634653b1c2a51aff13cedf1ccd2d", + name: "鐭ヨ瘑鎷撳睍 1-3 C919 澶ч鏈�", + }, + }, + question: { + 1: { + questionTitleMain: "椤圭洰涓�銆�姘戠敤鑸┖杩愯緭涓氱殑鍙戝睍", + questionNum: 16, + }, + }, + }, + collectResourceList: [], + chapterData: { + isCollectVideoOne: false, + isCollectVideoTwo: false, + isCollectVideoThree: false, + isCollectVideoFour: false, + isCollectVideoFive: false, + }, + // 瑙嗛 + videoPathOne: "", + // 绠�绛旈 + videoQuestionData: { + one: "", + two: "", + three: "", + four: "", + five: "", + }, + // 棰樼洰鐩稿叧 + dialogVisibleOne: false, + themeColor: "#1c9e3a", + questionNum: 0, + questionTitleMain: "", + // ppt + pptData: { + pptMd5: "", + pptName: "", + }, + loading: false, + }; + }, + async mounted() { + const videoQuestionData = localStorage.getItem( + "aviationPassengerTransport6th-book-chapter001-videoQuestionData" + ); + if (videoQuestionData) { + this.videoQuestionData = JSON.parse(videoQuestionData); + } + + this.collectResourceList = await getCollectResource( + this.config.activeBook.bookId + ); + this.getVidoePath(); + + this.getPPtData(); + }, + + methods: { + //涓婁紶PPT + fileUpload(file) { + console.log(this.pptData.pptMd5, "this.pptData.pptMd5"); + if (this.pptData.pptMd5 != "") { + Message.error("璇峰厛鍒犻櫎褰撳墠鏂囦欢"); + return; + } + return new Promise((resolve, reject) => { + const isPPT = + file.file.type === "application/vnd.ms-powerpoint" || + file.file.type === + "application/vnd.openxmlformats-officedocument.presentationml.presentation"; + if (!isPPT) { + Message.error("涓婁紶鏂囦欢鍙兘鏄� ppt 鏍煎紡!"); + return reject(); + } + const FileName = file.file.name.split(".")[0]; + const Extension = file.file.name.split(".")[1]; + const FileType = file.file.type; + let size = 1024; + tool + .getFileMd5(file.file, size * 1024) + .then(async (e) => { + this.loading = true; + if (this.pptData.pptMd5 != e) { + const imgData = new FormData(); + imgData.append("Md5", e); + imgData.append("FileName", FileName); + imgData.append("Extension", Extension); + imgData.append("FileType", FileType); + imgData.append("MetaData", null); + imgData.append("file", file.file); + let rData = await uploadFilePath(imgData); + if (rData) { + this.pptData.pptMd5 = e; + this.pptData.pptName = FileName; + this.setPPtData(); + } + } else { + Message.error("褰撳墠鏂囦欢宸蹭笂浼狅紝璇峰嬁閲嶅鎿嶄綔锛�"); + } + this.loading = false; + }) + .catch((e) => { + console.error(e); + }); + }); + }, + // 瀛樺叆ppt + setPPtData() { + this.MG.identity + .setUserKey({ + setKeyRequests: [ + { + domain: "PPtData", + key: this.config.activeBook.bookId, + value: JSON.stringify(this.pptData), + }, + ], + }) + .then((res) => { + console.log("鏀惰棌/鍙栨秷鎴愬姛"); + }); + }, + + // 鑾峰彇ppt鏁版嵁 + getPPtData() { + const token = localStorage.getItem("token"); + if (!token) return false; + this.MG.identity + .getUserKey({ + domain: "PPTData", + keys: [this.config.activeBook.bookId], + }) + .then((res) => { + try { + const pptData = JSON.parse(res[0].value); + if (pptData) { + this.pptData = pptData; + } + } catch (error) { + console.log("鏆傛棤鏁版嵁"); + } + }) + .catch((res) => { + console.log("ppt鏁版嵁鎶ラ敊"); + }); + }, + + async getVidoePath() { + this.videoPathOne = await getResourcePath( + "20915be5a2980251b3294f657fec5345" + ); + }, + toUrl(val) { + if (val) { + this.p_md5 = this.chapter001.pdfMd5[val].md5; + this.somePdfTitleValue = this.chapter001.pdfMd5[val].name; + this.$refs.pdfDialogRef.openDialog(); + } + }, + + openPPT() { + this.p_md5 = this.pptData.pptMd5; + this.somePdfTitleValue = this.pptData.pptName; + this.$refs.pdfDialogRef.openDialog(); + }, + + deletePPT() { + this.pptData.pptMd5 = ""; + this.pptData.pptName = ""; + this.setPPtData(); + }, + + saveVideoQuestionData() { + localStorage.setItem( + "aviationPassengerTransport6th-book-chapter001-videoQuestionData", + JSON.stringify(this.videoQuestionData) + ); + }, + + handleCollect(e) { + if (e == "pdf-01") { + this.handleCollectResource( + "d26f73df690bb8de6781c40d049560e3", + "d26f73df690bb8de6781c40d049560e3", + "", + "鍏朵粬", + "bits", + "鐭ヨ瘑鎷撳睍 1-1 涓浗绗竴浣嶉鏈鸿璁″笀鍐" + ); + } else if (e == "pdf-02") { + this.handleCollectResource( + "ac8fc00ea84cb3504a5ad0c7c2025652", + "ac8fc00ea84cb3504a5ad0c7c2025652", + "", + "鍏朵粬", + "bits", + "鐭ヨ瘑鎷撳睍 1-2 涓よ埅绠�浠�" + ); + } else if (e == "pdf-03") { + this.handleCollectResource( + "df538ab7d44f8c73b7386a2584b84a68", + "df538ab7d44f8c73b7386a2584b84a68", + "", + "鍏朵粬", + "bits", + "妗堜緥鍒嗕韩 1-1 閲嶉鈥滀袱鑸捣涔夆�濅箣璺� 涓轰簡涓嶈兘蹇樺嵈鐨勭邯蹇�" + ); + } else if (e == "pdf-04") { + this.handleCollectResource( + "9bfa634653b1c2a51aff13cedf1ccd2d", + "9bfa634653b1c2a51aff13cedf1ccd2d", + "", + "鍏朵粬", + "bits", + "鐭ヨ瘑鎷撳睍 1-3 C919 澶ч鏈�" + ); + } else if (e == "video-01") { + this.handleCollectResource( + "20915be5a2980251b3294f657fec5345", + "20915be5a2980251b3294f657fec5345", + "", + "瑙嗛", + "bits", + "01 涓浗姘戠敤鑸┖杩愯緭鐨勫彂灞�" + ); + } + }, + //璧勬簮鏀惰棌浜嬩欢 + // 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> diff --git a/src/books/aviationPassengerTransport6th/view/components/header.vue b/src/books/aviationPassengerTransport6th/view/components/header.vue new file mode 100644 index 0000000..d6e2629 --- /dev/null +++ b/src/books/aviationPassengerTransport6th/view/components/header.vue @@ -0,0 +1,27 @@ +<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/Cover.jpg" /> + </div> + </div> + </div> + </template> + + <script> + export default { + name: "pageHeader", + props: { + showPageList: { + type: Array, + }, + }, + data() { + return {}; + }, + }; + </script> + + <style lang="less" scoped></style> + \ No newline at end of file diff --git a/src/books/aviationPassengerTransport6th/view/components/index.vue b/src/books/aviationPassengerTransport6th/view/components/index.vue new file mode 100644 index 0000000..c91c6aa --- /dev/null +++ b/src/books/aviationPassengerTransport6th/view/components/index.vue @@ -0,0 +1,980 @@ +<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" + :interfaceQuestion="questionDataMap" + ></chapterOne> + <!-- <chapterTwo + v-if="showCatalogList.indexOf(2) > -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 + : 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]; + // 婊氬姩鐩戝惉鑺傛祦 + 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, 16); + //}, 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.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, + // 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) { + // 鑾峰彇椤甸潰鎵�鏈塼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) { + 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> diff --git a/src/books/aviationPassengerTransport6th/view/index.vue b/src/books/aviationPassengerTransport6th/view/index.vue new file mode 100644 index 0000000..3682675 --- /dev/null +++ b/src/books/aviationPassengerTransport6th/view/index.vue @@ -0,0 +1,80 @@ +<template> + <div class="aviationPassengerTransport6th" @mouseup="handleMouseUp"> + <pageContent></pageContent> + </div> + </template> + + <script> + import pageContent from "./components/index.vue"; + export default { + name: "aviationPassengerTransport6th", + 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> \ No newline at end of file diff --git a/src/books/childcareInstitutionsManagement/view/components/chapter001.vue b/src/books/childcareInstitutionsManagement/view/components/chapter001.vue index 3dc4ca8..140c09d 100644 --- a/src/books/childcareInstitutionsManagement/view/components/chapter001.vue +++ b/src/books/childcareInstitutionsManagement/view/components/chapter001.vue @@ -174,7 +174,6 @@ </div> </div> </div> - <!-- P5 --> <div class="page-box" page="15"> <div v-if="showPageList.indexOf(15) > -1"> @@ -276,7 +275,6 @@ </div> </div> </div> - <!-- P7 --> <div class="page-box" page="17"> <div v-if="showPageList.indexOf(17) > -1"> @@ -323,7 +321,6 @@ </div> </div> </div> - <!-- P8 --> <div class="page-box" page="18"> <div v-if="showPageList.indexOf(18) > -1"> @@ -379,7 +376,6 @@ </div> </div> </div> - <!-- P9 --> <div class="page-box" page="19"> <div v-if="showPageList.indexOf(19) > -1"> diff --git a/src/books/cognitiveLanDevEduAges0to3/assets/main.less b/src/books/cognitiveLanDevEduAges0to3/assets/main.less index 11e2fc8..bb960ee 100644 --- a/src/books/cognitiveLanDevEduAges0to3/assets/main.less +++ b/src/books/cognitiveLanDevEduAges0to3/assets/main.less @@ -1217,8 +1217,6 @@ vertical-align: middle; } - .content {} - .titleQuot-c { font-family: "鏂规鍏颁涵缁嗛粦"; color: #00aeef; diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0002-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0002-01.jpg new file mode 100644 index 0000000..94d9a1a --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0002-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0003-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0003-01.jpg new file mode 100644 index 0000000..51d9ca0 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0003-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0005-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0005-01.jpg new file mode 100644 index 0000000..b5196ec --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0005-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0005-02.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0005-02.jpg new file mode 100644 index 0000000..72e4280 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0005-02.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0007-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0007-01.jpg new file mode 100644 index 0000000..c74bbf6 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0007-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0008-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0008-01.jpg new file mode 100644 index 0000000..2b7def6 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0008-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0012-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0012-01.jpg new file mode 100644 index 0000000..726e811 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0012-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0013-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0013-01.jpg new file mode 100644 index 0000000..a80a353 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0013-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0016-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0016-01.jpg new file mode 100644 index 0000000..85cab64 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0016-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0017-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0017-01.jpg new file mode 100644 index 0000000..aee7264 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0017-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0018-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0018-01.jpg new file mode 100644 index 0000000..43b9ae9 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0018-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0020-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0020-01.jpg new file mode 100644 index 0000000..1dd77df --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0020-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0022-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0022-01.jpg new file mode 100644 index 0000000..83e6c1a --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0022-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0023-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0023-01.jpg new file mode 100644 index 0000000..6bc386e --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0023-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0023-02.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0023-02.jpg new file mode 100644 index 0000000..0197b96 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0023-02.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0025-03.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0025-03.jpg new file mode 100644 index 0000000..03e4f76 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0025-03.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0026-01.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0026-01.jpg new file mode 100644 index 0000000..33a122a --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/0026-01.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/Cover.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/Cover.jpg new file mode 100644 index 0000000..06a7038 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/Cover.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/a1.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/a1.jpg new file mode 100644 index 0000000..b3787f5 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/a1.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/a2.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/a2.jpg new file mode 100644 index 0000000..32b2c47 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/a2.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/a3.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/a3.jpg new file mode 100644 index 0000000..0b1c6ab --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/a3.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/device_phone_frontcover.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/device_phone_frontcover.jpg new file mode 100644 index 0000000..5174538 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/device_phone_frontcover.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/feiye.jpg b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/feiye.jpg new file mode 100644 index 0000000..e488707 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/feiye.jpg Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/icon/heart-check.png b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/icon/heart-check.png new file mode 100644 index 0000000..74d469c --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/icon/heart-check.png Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/icon/heart.png b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/icon/heart.png new file mode 100644 index 0000000..7817ec4 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/icon/heart.png Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/left-page.png b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/left-page.png new file mode 100644 index 0000000..548564e --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/left-page.png Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/images/right-page.png b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/right-page.png new file mode 100644 index 0000000..7fd44ae --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/images/right-page.png Binary files differ diff --git a/src/books/hotelEnglishTrainingBrochure2nd/assets/main.less b/src/books/hotelEnglishTrainingBrochure2nd/assets/main.less new file mode 100644 index 0000000..0760098 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/assets/main.less @@ -0,0 +1,2322 @@ +.hotelEnglishTrainingBrochure2nd { + 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; + } + + .page-main { + width: 100% !important; + height: 100% !important; + overflow: auto; + position: relative; + } + + + .follow-box { + width: 500px; + height: 100px; + position: fixed; + background-color: #2ecc71; + color: white; + padding: 10px; + border-radius: 5px; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); + z-index: 1000; + display: none; + min-width: 150px; + } + + .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-2 { + text-indent: 2em !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; + } + + .header-left { + margin-left: 8%; + margin-top: 0; + font-size: 16px; + + img { + width: 30%; + height: auto; + object-fit: contain; + } + } + + .header-left-Text { + color: #00aeef; + + span:nth-child(1) { + font-weight: bold; + font-size: 18px; + padding-right: 10px; + line-height: 20px; + } + + span:nth-child(2) { + font-size: 16px; + padding-left: 10px; + border-left: 1px solid #000; + line-height: 20px; + } + } + + .header-right { + display: flex; + flex-direction: column; + justify-content: flex-end; + align-items: flex-end; + margin-right: 10%; + margin-top: 0; + font-size: 16px; + + div { + width: 9%; + text-align: center; + + img { + width: 100%; + height: auto; + } + } + } + + .header-right-Text { + color: #00aeef; + + span:nth-child(1) { + font-weight: bold; + font-size: 18px; + padding-right: 10px; + line-height: 20px; + } + + span:nth-child(2) { + font-size: 16px; + padding-left: 10px; + border-left: 1px solid #000; + line-height: 20px; + } + } + + /*浜岀骇鏍囬绔犳爣*/ + .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: #0dbff2; + color: #fff; + } + + .table-tr-bc { + background-color: #c6eafa; + color: #000; + font-family: "kaiti"; + } + + .table-textarea { + font-size: 14px; + font-family: "Times New Roman", "瀹嬩綋"; + resize: none; + + &: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%; + } + + .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 .fm-zh { + font-family: "鏂规姝i粦" !important; + } + + .fm-kt { + font-family: "kaiti" !important; + font-weight: 400; + } + + .fm-fs { + font-family: "鏂规浠垮畫" !important; + } + + 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-question { + border-color: #00aeef !important; + } + + .textarea-question:focus { + // outline: none; + /* 绉婚櫎榛樿鐨勭劍鐐硅疆寤� */ + } + + .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-title { + display: flex; + align-items: center; + + + span { + margin-left: 10px; + color: #1c9e3a !important; + font-weight: bold; + } + } + + .video-box { + margin: 10px 0 20px 0; + border: 2px solid #28c4f4; + padding: 3% 2% 2% 2%; + position: relative; + } + + + + .video-img { + position: absolute; + top: -20px; + left: -20px; + } + + + .video-box-left { + margin: 20px 8% 20px 0; + border: 1px dashed #895B2E; + padding: 2% 2%; + } + + .videoname { + display: flex; + justify-content: center; + align-items: center; + + span { + margin-right: 20px; + } + } + + .collect-btn { + cursor: pointer; + width: 20px; + height: 20px; + } + + .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; + } + + // pdf 鏌ョ湅鍣� + .pdf-box { + margin: 35px 0 20px 0; + border: 1px solid #48a65d; + } + + .pdf-title { + display: flex; + background-color: transparent; + min-height: 25px; + position: relative; + + .bg-img { + width: 12%; + position: absolute; + top: -29.5px; + } + } + + .pdf-title-name { + padding: 0 2%; + display: flex; + align-items: center; + text-indent: 0em; + margin: 0 !important; + border-right: 1px solid #259e40; + color: #259e40; + + img { + cursor: pointer; + margin-right: 10px; + } + + .icon { + fill: #078fb9; + } + } + + .pdf-title-img { + width: 75.4%; + text-indent: 1em; + padding-right: 2%; + display: flex; + align-items: center; + justify-content: space-between; + margin: 0; + color: #000; + + span { + text-align: center; + cursor: pointer; + overflow: hidden; + } + + img { + cursor: pointer; + } + + &:hover { + text-decoration: underline; + color: #259e40; + } + } + + .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; + margin: 0% 12% 0% 12%; + line-height: 30px; + min-height: 968px; + } + + // div.bodystyle-left { + // text-align: justify; + // margin: 13% 3% 10% 13%; + // line-height: 30px; + // } + + .UnitCover { + display: flex; + justify-content: space-between; + + .UnitCover-left { + min-height: 1128px; + min-width: 40%; + margin-right: 3px; + background-color: #c6eafa; + } + + .UnitCover-right { + min-height: 1128px; + min-width: 59.5%; + // background-color: #93d9f7; + + .UnitCover-right-top { + padding-top: 50%; + background-color: #93d9f7; + margin-bottom: 5px; + + div { + padding: 10px 10px; + background-color: #0dbff2; + } + } + + .UnitCover-right-bottom { + padding-bottom: 68%; + background-color: #93d9f7; + + div { + padding: 10px 10px 80px 10px; + background-color: #0dbff2; + + .content { + text-indent: 1em; + color: #fff; + font-size: 14px; + line-height: 25px; + } + } + } + } + + } + + .Unit-title { + margin-left: 2%; + margin-bottom: 70px; + padding: 150px 30px 20px 0; + width: 75%; + color: #fff; + background-color: #1d9438; + position: relative; + overflow: hidden; + + p { + font-size: 30px; + text-align: right; + } + } + + + + + .Unit-title::after { + content: ''; + position: absolute; + right: -1px; + bottom: -1px; + width: 0; + height: 0; + border-style: solid; + border-width: 0px 0 50px 40px; + /* 璋冩暣杩欎釜鍊兼潵鏀瑰彉缂哄け涓夎褰㈢殑澶у皬 */ + border-color: #fff transparent #fff transparent; + /* 浣跨敤涓庤儗鏅浉鍚岀殑棰滆壊鏉モ�滃垏鎺夆�濊 */ + z-index: 2; + } + + + .Unit-content { + margin: 0 12%; + } + + .unit-title-box { + display: flex; + align-items: flex-end; + width: 100%; + min-height: 40px; + + p:nth-child(1) { + display: inline-block; + width: 13%; + height: 45px; + background-color: #aae0f9; + margin-bottom: 25px; + } + + div { + width: 18%; + display: flex; + flex-direction: column; + align-items: center; + position: relative; + overflow: hidden; + + img { + display: inline-block; + width: 50%; + } + + p { + display: inline-block; + margin-top: 5px; + font-size: 30px; + color: #fff; + padding: 10px 5px; + background-color: #15c0f2; + padding-bottom: 30px; + + } + } + + + div::after { + content: ''; + position: absolute; + right: 0px; + bottom: 0px; + width: 0; + height: 0; + border-style: solid; + border-width: 0px 0 25px 150px; + /* 璋冩暣杩欎釜鍊兼潵鏀瑰彉缂哄け涓夎褰㈢殑澶у皬 */ + border-color: #fff transparent #fff transparent; + /* 浣跨敤涓庤儗鏅浉鍚岀殑棰滆壊鏉モ�滃垏鎺夆�濊 */ + z-index: 2; + } + + div::before { + content: ''; + position: absolute; + left: 0; + bottom: 0px; + width: 0; + height: 0; + border-style: solid; + border-width: 0px 150px 25px 0px; + /* 璋冩暣杩欎釜鍊兼潵鏀瑰彉缂哄け涓夎褰㈢殑澶у皬 */ + border-color: #fff transparent #fff transparent; + /* 浣跨敤涓庤儗鏅浉鍚岀殑棰滆壊鏉モ�滃垏鎺夆�濊 */ + z-index: 2; + } + + .unit-title-text { + color: #00aeef; + text-shadow: -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white; + padding: 0 5% 0 5px; + line-height: 45px; + font-size: 20px; + font-weight: bold; + margin-bottom: 25px; + background-image: linear-gradient(to right, #b6e4f9, transparent); + } + } + + .box-title { + padding: 0px 15px; + color: #fff; + + text-indent: 0em; + border-radius: 0 10px 0 0; + background-color: #1C9E3A; + position: absolute; + top: -15px; + left: 0; + } + + .uploadFiles { + display: flex; + align-items: flex-end; + color: #000; + + img { + cursor: pointer; + width: 25px; + margin-right: 10px; + } + + span { + + font-size: 14px; + line-height: 20px; + font-weight: 400; + cursor: pointer; + } + + &:hover { + color: #1C9E3A !important; + } + + } + + + + .ppt-box { + cursor: pointer; + display: flex; + align-items: center; + line-height: 25px; + font-family: "kaiti"; + + p { + text-indent: 0em; + font-size: 1em; + margin-right: 20px; + margin-bottom: 0; + + &:hover { + text-decoration: underline; + color: #1C9E3A; + } + } + + img { + cursor: pointer; + width: 25px; + } + + + } + + + + .unit-title-parent { + text-align: center; + margin: 10% 0; + } + + .unit-title { + font-family: "鏂规姝i粦"; + display: inline-block; + font-size: 1.6em; + font-weight: 500; + border-bottom: 1px solid #0082D4; + padding: 10px 0; + } + + .bodyPic { + position: relative; + } + + .bodyPic-text { + position: absolute; + top: 15%; + left: 8%; + + p { + font-family: kaiti; + font-size: 16px; + line-height: 25px; + } + + span { + color: #006e92; + } + } + + 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 { + 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: 0em; + 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: 25px; + } + + .left3 { + line-height: 25px; + + } + + .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%; + } + + .img-k { + width: 2%; + } + + + + + .foreword-img-box { + text-align: end; + padding: 12% 0 10% 0; + + img { + width: 30%; + } + } + + .copyright-left { + padding-right: 5%; + border-right: 1px solid #000; + margin-right: 5px; + + p { + font-size: 16px; + font-weight: bold; + } + } + + .copyright-right { + padding-right: 5%; + border-left: 1px solid #000; + + p { + text-indent: 1em; + font-size: 16px; + } + } + + .copyrightPage-top { + width: 100%; + height: 80px; + background-image: linear-gradient(to bottom, #7dd3f6, transparent); + /* 璁剧疆浠庝笂鍒颁笅鐨勬笎鍙� */ + } + + .copyrightPage-bottom { + width: 100%; + height: 80px; + background-image: linear-gradient(to top, #7dd3f6, transparent); + /* 璁剧疆浠庝笂鍒颁笅鐨勬笎鍙� */ + + position: relative; + + .copyrightPage-left-img { + width: 18%; + position: absolute; + left: 0; + bottom: 0; + } + + .copyrightPage-left-box { + background-color: #00aeef; + color: #fff; + padding: 10px 8px; + border-radius: 50%; + position: absolute; + left: 8%; + bottom: 45px; + } + + + .copyrightPage-right-img { + width: 18%; + position: absolute; + right: 0; + bottom: 0; + } + + .copyrightPage-right-box { + background-color: #00aeef; + color: #fff; + padding: 10px 8px; + border-radius: 50%; + position: absolute; + right: 8%; + bottom: 45px; + } + } + + // epub涓嚜甯︾殑鏍峰紡 + .editorialBoard { + background-color: #fff; + border-radius: 50%; + /* 椤堕儴鍜屽簳閮ㄤ负0锛屽乏鍙充袱渚т负50% */ + padding: 5% 10% 20% 10%; + } + + .border { + margin: 10px 0; + padding: 5px 10px; + border: 1px solid #00aeef; + } + + .border1 { + margin: 10px 20px; + padding: 5px 10px 0px 10px; + border: 1px solid #00aeef; + + p { + font-family: "kaiti"; + line-height: 20px; + } + + table { + border-color: none !important; + } + + .table-th-bc { + background-color: #fff; + color: #000; + } + + .table-tr-bc { + background-color: transparent; + color: #000; + font-family: "kaiti"; + } + + .table-textarea { + font-size: 14px; + font-family: "Times New Roman", "瀹嬩綋"; + resize: none; + + &:focus { + outline: none; + } + } + } + + .series { + padding: 12% 11%; + background-color: #e1f1fa; + } + + .openingScene { + + background-size: cover; + background-repeat: no-repeat; + + min-height: 100%; + } + + .quotation-box { + padding: 15% 10% 30% 32%; + } + + .sub-Title-l { + font-size: 3em; + color: #fff; + font-family: "鏂规姝i粦"; + font-weight: 800; + margin: 0 !important; + } + + .firstTitle-l { + font-size: 1.5em; + color: #fff; + font-family: "鏂规姝i粦"; + font-weight: 400; + margin: 0 !important; + } + + + .seriesTitle { + font-size: 2em; + color: #000; + font-weight: 400; + text-align: center; + padding: 15% 0 10% 0; + } + + .g-pic { + height: 2.5em; + vertical-align: middle; + } + + .titleQuot-c { + color: #00aeef; + text-indent: 0em; + font-size: 1.2em; + line-height: 1.3em; + text-align: center; + font-weight: 800; + padding: 0 5%; + } + + + div.bk3 { + background-color: #d6ece5; + border: 1px solid #7acab4; + padding: 25px 19px 20px 19px; + margin-top: 2em; + 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; + /* 鏃嬭浆褰㈡垚鎵囧舰 */ + } + + .view-translation { + position: relative; + z-index: 0; + + p { + color: #fff; + position: absolute; + top: 6%; + left: 8%; + cursor: pointer; + + &:hover { + text-decoration: underline; + } + } + } + + + + + .firstLevel-t { + text-indent: 2em; + font-size: 1.1em; + font-weight: bold; + color: #1C9E3A; + margin-top: 50px; + margin-bottom: 20px; + } + + .Secondary-t { + text-indent: 2em; + font-size: 1.1em; + font-weight: bold; + color: #1C9E3A; + margin-top: 20px; + margin-bottom: 20px; + } + + h2 { + font-family: '鏂规瀹嬮粦'; + font-weight: 400; + margin: 30px 0; + } + + .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: "鏂规浠垮畫"; + text-align: left; + text-indent: 2em; + margin: 0.1em auto; + line-height: 35px; + } + + .titleQuot-Unit { + color: #fff; + text-indent: 0em; + font-weight: bold; + font-size: 1.2em; + margin: 20px 0 0 0; + text-decoration: underline; + } + + + + .titleQuot-1 { + color: #0cbff1; + font-size: 20px; + font-weight: bold; + text-indent: 0em; + } + + /*搴曡壊*/ + .bgColor { + padding: 2px 5px; + color: #000; + background: #aae0f9; + } + + // 鎷撳睍瀛︿範 + .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 { + 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: "姹変华姝i粦"; + background-color: #6bcff6; + font-weight: bold; + margin: 30px 0 20px 0; + } + + .poemtitle { + text-align: center; + font-weight: bold; + font-family: "鏂规鍏颁涵缁嗛粦"; + } + + .bold { + color: #00aeef; + font-weight: bold; + cursor: pointer; + } + + + + .bold1 { + padding: 0px 0px 0px 58px; + color: #000; + font-weight: bold; + } + + .bold2 { + font-weight: bold; + } + + .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: #1c9e3a; + 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% - 15px); + 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/FZFSK.TTF'); +// } + +// @font-face { +// font-family: '鏂规瀹嬩綋'; +// src: url('./Fonts/FZSSK.TTF'); +// } + +// @font-face { +// font-family: '鏂规瀹嬮粦'; +// src: url('./Fonts/FZSHJW.TTF'); +// } + +// @font-face { +// font-family: '鏂规浠垮畫'; +// src: url('./Fonts/FZFSK.TTF'); +// } + +// @font-face { +// font-family: '鏂规鍏颁涵缁嗛粦'; +// src: url('./Fonts/FZLTXIHK.TTF'); +// } + +.input-bottom-border { + border: 0; + border-bottom: 1px solid #000000; + background-color: transparent; + + &:focus { + outline: none; + } +} + +.btn-box { + margin-left: 5px; + cursor: pointer; + text-indent: 0; + display: inline-block; + border: 1px solid #0cbff1; + height: 22px; + padding: 5px; + background-color: #0cbff1; + border-radius: 5px; + + svg { + fill: #fff; + } + + &:hover { + background-color: #fff; + + svg { + fill: #0cbff1; + } + } +} + +// 闅愯棌椤甸潰 +.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) { + .hotelEnglishTrainingBrochure2nd { + + .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; + } + + .copyright-left { + padding-right: 5%; + border-right: 1px solid #000; + margin-right: 5px; + + p { + text-indent: 0em; + font-size: 12px; + font-weight: bold; + text-wrap: nowrap; + } + } + + .copyright-right { + padding-right: 5%; + border-left: 1px solid #000; + + p { + text-indent: 1em; + font-size: 12px; + text-wrap: nowrap; + } + } + } +} + +@media (min-width: 660px) { + .hotelEnglishTrainingBrochure2nd { + .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/hotelEnglishTrainingBrochure2nd/view/components/chapter001.vue b/src/books/hotelEnglishTrainingBrochure2nd/view/components/chapter001.vue new file mode 100644 index 0000000..63fa220 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/view/components/chapter001.vue @@ -0,0 +1,2319 @@ +<template> + <div class="chapter" num="2"> + <!-- 295椤� --> + <div class="page-box" page="4"> + <div v-if="showPageList.indexOf(4) > -1"> + <div class="UnitCover"> + <div class="UnitCover-left"></div> + <div class="UnitCover-right"> + <div class="UnitCover-right-top"> + <div> + <h1 class="sub-Title-l">Project 12</h1> + <p><br /></p> + <h1 class="firstTitle-l">Cashier's Service<br />鏀堕摱鏈嶅姟</h1> + </div> + </div> + <div class="UnitCover-right-bottom"> + <div> + <p class="titleQuot-Unit">Project Goals</p> + <p class="content"> + After studying this project, you should be able to: + </p> + <p class="content"> + 鈥� tell the main duties of a cashier in a hotel; + </p> + <p class="content">鈥� check out the guests;</p> + <p class="content"> + 鈥� exchange foreign currency for the guests; + </p> + <p class="content"> + 鈥� help the guests to fi ll out a foreign currency exchange<br /> + memo; + </p> + <p class="content">鈥� know about online checkout;</p> + <p class="content">鈥� develop good professional qualities.</p> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- 296椤� --> + <div class="page-box" page="5"> + <div v-if="showPageList.indexOf(5) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="unit-title-box"> + <p></p> + <div> + <img class="" src="../../assets/images/0002-01.jpg" alt="" /> + <p class="td-0">Activity 1</p> + </div> + <p class="td-0 unit-title-text">Get to Know the Post 宀椾綅璁ょ煡</p> + </div> + <div class="bodystyle"> + <p class="titleQuot-1">1. Objectives锛堢洰鏍囷級</p> + <p class="content td-0"> + 鈥� To get to know the main responsibilities of a cashier; + </p> + <p class="content td-0"> + 鈥� To get to know the job requirements of a cashier. + </p> + <p class="titleQuot-1">2. Identify the Responsibility锛堟槑纭亴璐o級</p> + <p class="content td-0">Cashier:</p> + <div class="border"> + <p class="content td-0 fz-14"> + <img class="img-k" src="../../assets/images/a1.jpg" alt="" />Settle bills for the guests鈥� lodging + accommodations and any + other fees during their stay; + </p> + <p class="content td-0 fz-14"> + <img class="img-k" src="../../assets/images/a1.jpg" alt="" />Explain items charged on the bill; + </p> + <p class="content td-0 fz-14"> + <img class="img-k" src="../../assets/images/a1.jpg" alt="" />Complete check-out procedures; + </p> + <p class="content td-0 fz-14"> + <img class="img-k" src="../../assets/images/a1.jpg" alt="" />Operate computer billing system; + </p> + <p class="content td-0 fz-14"> + <img class="img-k" src="../../assets/images/a1.jpg" alt="" />Handle various methods of payment; + </p> + <p class="content td-0 fz-14"> + <img class="img-k" src="../../assets/images/a1.jpg" alt="" />Give + the guests their change; + </p> + <p class="content td-0 fz-14"> + <img class="img-k" src="../../assets/images/a1.jpg" alt="" />Convert foreign currency for hotel guests; + </p> + <p class="content td-0 fz-14"> + <img class="img-k" src="../../assets/images/a1.jpg" alt="" />Cash + traveler's checks and personal checks for hotel guests; + </p> + <p class="content td-0 fz-14"> + <img class="img-k" src="../../assets/images/a1.jpg" alt="" /> + Maintain related records and fi les regarding fi nancial + transactions; + </p> + <p class="content td-0 fz-14"> + <img class="img-k" src="../../assets/images/a1.jpg" alt="" />Answer guests鈥� inquiries regarding fees and + other related + services. + </p> + </div> + <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"></video> + </p> + <p class="center videoname"> + <span>Project 12-Activity 1-3</span> + <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideoOne ? '鐐瑰嚮鍙栨秷' : '鐐瑰嚮鏀惰棌' + " placement="top-start"> + <img :src="collectResourceList.findIndex( + (item) => item.id == '50ed3234d92cce02be3d277b0e1f88b2' + ) > -1 + ? collectCheck + : collectImg + " alt="" class="collect-btn" @click="handleCollect('video-01')" /> + </el-tooltip> + </p> + </div> + <p class="titleQuot-1"> + 3. Watch the Video on the Post锛堣鐪嬪矖浣嶈棰戯級 + </p> + <p class="content"> + to watch the video, listen to the introduction to the post as the + convention 锛� exhibition staff , and then fi ll in the blank with a + proper word given below. + </p> + <div class="border"> + <p class="contentc td-0 fz-14"> + financial銆�check-out銆�accommodations銆�accurately銆�banking銆�exchange銆�parking + </p> + </div> + <p class="content td-2"> + Cashier's service in hotels involves collecting money from guests + for their lodging (1) + <select class="select-border" :disabled="selectData.isComplete" @change="saveSelectData" + v-model="selectData.answerList[0].value" style="width: 20%"> + <option v-for="(item, index) in selectData.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="selectData.answerList[0].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="selectData.answerList[0].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + and any other fees during their stay, including (2) + <select class="select-border" :disabled="selectData.isComplete" @change="saveSelectData" + v-model="selectData.answerList[1].value" style="width: 20%"> + <option v-for="(item, index) in selectData.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="selectData.answerList[1].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="selectData.answerList[1].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> </span>, valet, room service and telephone use fees. It also needs to + maintain records and files regarding (3) + <select class="select-border" :disabled="selectData.isComplete" @change="saveSelectData" + v-model="selectData.answerList[2].value" style="width: 20%"> + <option v-for="(item, index) in selectData.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="selectData.answerList[2].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="selectData.answerList[2].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> </span>transactions at the front desk. Foreign currency (4) + <select class="select-border" :disabled="selectData.isComplete" @change="saveSelectData" + v-model="selectData.answerList[3].value" style="width: 20%"> + <option v-for="(item, index) in selectData.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="selectData.answerList[3].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="selectData.answerList[3].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> </span>also happens to serve foreign guests. + </p> + <p class="content td-2"> + The basic duties of hotel cashiers involve good communication + skills; settling guests鈥� accounts; completing guests鈥� (5) + <select class="select-border" :disabled="selectData.isComplete" @change="saveSelectData" + v-model="selectData.answerList[4].value" style="width: 20%"> + <option v-for="(item, index) in selectData.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="selectData.answerList[4].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="selectData.answerList[4].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + procedures; clarifying customers鈥� questions about the charges; + checking and following up on all bills on hold; performing various + (6) + <select class="select-border" :disabled="selectData.isComplete" @change="saveSelectData" + v-model="selectData.answerList[5].value" style="width: 20%"> + <option v-for="(item, index) in selectData.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="selectData.answerList[5].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="selectData.answerList[5].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> </span>services, such as check cashing (鍏戠幇) and foreign currency + exchange; managing safe-deposit boxes, etc. + </p> + <p class="content td-2"> + To perform mathematical calculations (璁$畻) (7) + <select class="select-border" :disabled="selectData.isComplete" @change="saveSelectData" + v-model="selectData.answerList[6].value" style="width: 20%"> + <option v-for="(item, index) in selectData.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="selectData.answerList[6].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="selectData.answerList[6].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> </span>is important for hotel cashiers. + </p> + <p class="event-header-text-bc pd-5 mb-20" style="width: 100%" v-if="showAnswerSelect"> + 绛旀锛�1.accommodations銆�2.parking銆�3.financial銆�4.exchange銆�5.check-out銆�6.banking銆�7.accurately + </p> + <div class="w100 fl ju-cn mb-20 mt-20"> + <div class="fl ju-ev mt-40" style="width: 80%"> + <button class="btn-border btn-w" @click="handleDropdown()"> + 鎻愪氦 + </button> + <button class="btn-border btn-w" @click="clearSelectData"> + 閲嶅仛 + </button> + <button @click="showAnswerSelect = !showAnswerSelect" class="parimary-btn"> + 鏌ョ湅绛旀 + </button> + </div> + </div> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">296</div> + </div> + </div> + </div> + <!-- 297椤� --> + <div class="page-box" page="6"> + <div v-if="showPageList.indexOf(6) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 2</span><span>Equip Yourself with the Serving Skills</span> + </li> + <li>鎶�鑳藉涔�</li> + </ul> + <div class="unit-title-box"> + <p></p> + <div> + <img class="" src="../../assets/images/0002-01.jpg" alt="" /> + <p class="td-0">Activity 2</p> + </div> + <p class="td-0 unit-title-text"> + Equip Yourself with the Serving Skills 鎶�鑳藉涔� + </p> + </div> + <div class="bodystyle"> + <p class="titleQuot-1">1. Objectives锛堢洰鏍囷級</p> + <p class="content"> + 鈥� To grasp basic procedures to check out the guests as a cashier; + </p> + <p class="content"> + 鈥� To grasp basic serving skills to check out the guests as a + cashier; + </p> + <p class="content">鈥� To learn about diff erent ways of payment.</p> + <p class="titleQuot-1"> + 2. Go Through the General Procedures锛堜簡瑙f湇鍔℃祦绋嬶級 + </p> + <p class="content">Checking out the guests:</p> + <p class="content"> + Step 1 鈥� Ask about the guest's name and room number; + </p> + <p class="content">Step 2 鈥� Get back the room card;</p> + <p class="content">Step 3 鈥� Prepare the bill;</p> + <p class="content">Step 4 鈥� Ask the guest to make the payment;</p> + <p class="content">Step 5 鈥� Say goodbye to the guest;</p> + <p class="content"> + Step 6 鈥� Update the room status and create a new record. + </p> + <p class="titleQuot-1">3. Note the Serving Skills锛堝叧娉ㄦ湇鍔¤鐐癸級</p> + <p class="content"> + As a cashier, you should note the following skill points when + checking out the guests. + </p> + <p class="content"> + (1) When the guest is checking out at the + <span class="bold" id="keyWords" @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave">cashier's + station,</span> the cashier should ask + about the guest's name and room number at first. Then remind the + guest to return the room card. + </p> + <p class="content"> + (2) When preparing the guest's bill, the cashier mainly figures out + the total amount of the bill and explains the items to the guest if + necessary. The cashier should make clear if the guest has signed any + last-minute bills for the mini-bar service or any other hotel + services. If the answer is 鈥測es鈥�, the cashier is supposed to call + the department <span class="bold">concerned</span>. After all the + fees are charged to the master account of the guest, the cashier + will <span class="bold">present</span> the bill to the guest and + tell him/her the total amount. + </p> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">297</div> + </div> + </div> + </div> + <!-- 298椤� --> + <div class="page-box" page="7"> + <div v-if="showPageList.indexOf(7) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"> + <p class="content"> + (3) Ask the guest to check the bill again before + <span class="bold">drawing up</span> the final bill to avoid any + errors. If any questions from the guest about the bill, you may + check all items again, check with the guest if he/she is + <span class="bold">entitled</span> to any discount, check it with + the department concerned and <span class="bold">calculate</span> the + bill again. If there were errors, offer to correct the bill + immediately and apologize to the guest. If there were no errors, + explain the items to the guest. + </p> + <div class="border"> + <p class="titleQuot-c">Special Tips</p> + <p class="content">Common items to be charged on a bill锛�</p> + <p class="content"> + <img class="img-k" src="../../assets/images/a2.jpg" alt="" />room + rent; + </p> + <p class="content"> + <img class="img-k" src="../../assets/images/a2.jpg" alt="" />telephone rate; + </p> + <p class="content"> + <img class="img-k" src="../../assets/images/a2.jpg" alt="" />laundry service charges; + </p> + <p class="content"> + <img class="img-k" src="../../assets/images/a2.jpg" alt="" />room + service charges; + </p> + <p class="content"> + <img class="img-k" src="../../assets/images/a2.jpg" alt="" />dining-hall bills; + </p> + <p class="content"> + <img class="img-k" src="../../assets/images/a2.jpg" alt="" />mini-bar service fees. + </p> + </div> + <p class="content"> + (4) When the bill is ready, tell the guest the total amount and ask + the guest how he/she will make the payment. The methods of payment + which are commonly accepted in hotels are 鈥渃ash鈥�, 鈥渃redit card鈥�, + 鈥�<span class="bold">debit card</span>鈥�,鈥渢raveler's check鈥�, 鈥�<span class="bold">gift certifi cate</span>鈥�, + etc. + </p> + <div class="border"> + <p class="titleQuot-c">Special Tips</p> + <p class="content"> + <img class="img-k" src="../../assets/images/a2.jpg" alt="" /> + Here are commonly accepted international credit cards: + <span class="bold">American Express (AE/AX), MasterCard (MC), Visa(VS), enRoute + (ER), Eurocard(EC), International Great Wall, International + Diner's Club, Federal Card.</span> + </p> + <p class="content"> + <img class="img-k" src="../../assets/images/a2.jpg" alt="" /> + When a guest is paying by credit card, be sure to check its valid + date which can be found at the front bottom of the card. + </p> + <p class="content"> + <img class="img-k" src="../../assets/images/a2.jpg" alt="" /> + Check if the total amount on the bill goes beyond the + <span class="bold">authorized credit limit</span> set by the + credit card offi ce. If it is beyond the limit, you may ask the + guest if he/she would like to pay in cash to settle the + difference. + </p> + </div> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">298</div> + </div> + </div> + </div> + <!-- 299椤� --> + <div class="page-box" page="8"> + <div v-if="showPageList.indexOf(8) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 2</span><span>Equip Yourself with the Serving Skills</span> + </li> + <li>鎶�鑳藉涔�</li> + </ul> + <div class="bodystyle"> + <div class="border"> + <p class="content"> + <img class="img-k" src="../../assets/images/a2.jpg" alt="" /> + Check if the total amount on the bill goes beyond the + <span class="bold">authorized credit limit</span> set by the + credit card offi ce. If it is beyond the limit, you may ask the + guest if he/she would like to pay in cash to settle the + difference. + </p> + </div> + <p class="content"> + (5) Many hotels have a check-out time, which is usually set at noon. + For a guest who checks out after 12:00 at noon, charge an extra half + of the room rate, and an extra full rate for a guest who checks out + after 6:00 p.m. + </p> + <p class="content"> + (6) The common way to show money amount is usually together with the + <span class="bold">currency</span> type. In English, the written + form is 鈥渃urrency type + amount number鈥�, but its oral form reads as + 鈥渁mount number + currency type鈥�. For example, + </p> + <div class="bodyPic center mt-10 mb-10"> + <img src="../../assets/images/0005-01.jpg" style="width: 80%" alt="" /> + </div> + <p class="content"> + (7) When finishing the checkout, say goodbye to the guest in the way + like鈥淲e look forward to serving you again鈥�.As the guest is departing + the hotel,extend your wishes to him/her in the way like鈥淲ish you a + pleasant journey鈥�. + </p> + <div class="view-translation"> + <img class="img-f" src="../../assets/images/0003-01.jpg" alt="" /> + <p @click="isDisolayTranslation = !isDisolayTranslation"> + 鐐瑰嚮鏌ョ湅鍙傝�冭瘧鏂� + </p> + </div> + <div class="event-header-text-bc pd-5 mb-20" style="width: 100%" v-if="isDisolayTranslation"> + <p>鍙傝�冭瘧鏂�:</p> + <p class="td-2"> + 浣滀负涓�鍚嶆敹閾跺憳锛屽湪涓哄浜哄姙鐞嗙粨璐︾搴楁墜缁椂搴旀敞鎰忓涓嬫湇鍔¤鐐�: + </p> + <p class="td-2"> + (1)瀹汉鍦ㄦ敹閾跺彴缁撹处绂诲簵鏃讹紝鏀堕摱鍛橀鍏堣璇㈤棶瀹汉鐨勫鍚嶅拰鎴块棿鍙风劧鍚庢彁閱掑浜哄綊杩樻埧鍗°�� + </p> + <p class="td-2"> + (2)鍑嗗瀹汉璐﹀崟鏃讹紝鏀堕摱鍛樹富瑕佸伐浣滄槸璁$畻璐﹀崟鎬婚锛屽繀瑕佺殑璇濊繕瑕佽В閲婅处鍗曘�傛敹閾跺憳瑕侀棶娓呮瀹汉鍦ㄤ复杩戠粨璐﹀墠鏈�鍚庢椂娈垫槸鍚︽湁杩蜂綘鍚ф垨鑰呭叾浠栭厭搴楁湇鍔$殑娑堣垂绛惧崟銆傚鏋滃浜烘湁绛惧崟锛屾敹閾跺憳瑕佸拰鐩稿叧閮ㄩ棬鑱旂郴銆傛墍鏈夎垂鐢ㄩ兘璁板埌瀹汉鎬昏处鍚庯紝鏀堕摱鍛樻妸璐﹀崟鎷跨粰瀹汉骞跺憡鐭ヨ处鍗曟�婚銆� + </p> + <p class="td-2"> + (3)鍦ㄥ噯澶囨渶缁堣处鍗曞墠锛屾敹閾跺憳瑕佷笌瀹汉鍐嶆鏍稿璐﹀崟锛岄伩鍏嶈处鍗曢敊璇鏋滃浜哄璐﹀崟鏈夌枒闂紝鍙互鍐嶆鏍稿鎵�鏈夋椤癸紝鏍稿疄瀹汉鏄惁浜彈浠讳綍鎶樻墸锛屽苟鑱旂郴鐩稿叧閮ㄩ棬锛岄噸鏂拌绠楄处鍗曘�傝嫢纭疄鏈夐敊璇紝涓诲姩鍙婃椂绾犳璐﹀崟骞跺悜瀹汉鑷存瓑;鑻ユ病鏈夐敊璇紝鍚戝浜鸿В閲婅处鍗曟椤广�� + </p> + <div class="border1"> + <p class="center">鐗瑰埆鎻愮ず</p> + <p class="td-2">璐﹀崟甯歌鐨勬敹璐规椤规湁:</p> + <p class="td-2">鎴块棿璐圭敤;</p> + <p class="td-2">鐢佃瘽璐圭敤;</p> + <p class="td-2">鎴块棿璐圭敤;</p> + <p class="td-2">娲楄。鏈嶅姟璐圭敤:</p> + <p class="td-2">瀹㈡埧閫侀璐圭敤:</p> + <p class="td-2">椁愬巺鐢ㄩ璐圭敤:</p> + <p class="td-2">杩蜂綘鍚ц祻鐢ㄣ��</p> + </div> + <p class="td-2"> + (4)璐﹀崟鍑嗗濂藉悗锛岃鍛婄煡瀹汉鎬婚骞惰闂浜烘敮浠樻柟寮忋�傞厭搴楅噷缁忓父浣跨敤鐨勬敮浠樻柟寮忔湁鈥滅幇閲戔�濃�滀俊鐢ㄥ崱鈥濃�滃�熻鍗♀�濃�滄梾琛屾敮绁ㄢ�濃�滆禒鍒糕�濈瓑銆� + </p> + <div class="border1"> + <p class="center">鐗瑰埆鎻愮ず</p> + <p class="td-2">鍥介檯涓婂父鐢ㄧ殑淇$敤鍗℃湁:</p> + <p class="td-2"> + 缇庡浗杩愰�氬崱銆佷竾浜嬭揪淇$敤鍗°�佺淮钀ㄥ崱銆佸湪閫斿崱銆佹娲插崱銆侀暱鍩庡崱銆佸浗闄呭ぇ鏉ヤ勘涔愰儴鍗°�佽仈閭﹀崱/鍙戣揪鍗°�� + </p> + <p class="td-2"> + 瀹汉鐢ㄤ俊鐢ㄥ崱鏀粯鏃讹紝涓�瀹氳鏍告煡淇$敤鍗℃闈笅閮ㄦ樉绀虹殑鏈夋晥鏈熴�� + </p> + <p class="td-2"> + 鏍告煡璐﹀崟鎬婚鏄惁瓒呭嚭浜嗕俊鐢ㄥ崱鐨勬巿鏉冩敮浠橀搴︺�傝嫢瓒呭嚭棰濆害锛屽彲浠ヨ闂浜烘槸鍚︽効鎰忕敤鐜伴噾鏀粯宸环銆� + </p> + </div> + <p class="td-2"> + (5)寰堝閰掑簵閫氬父灏嗕腑鍗�12:00璁剧疆涓虹粨璐︽椂闂淬�傚崍鍚�12:00鍚庣搴楃殑瀹汉锛岃棰濆鏀跺彇鍗婂ぉ鐨勬埧璐�;涓嬪崍6:00鍚庣搴楃殑瀹汉锛岃棰濆鏀跺彇涓�鏁村ぉ鐨勬埧璐广�� + </p> + <p class="td-2"> + (6)琛ㄨ揪閲戦鐨勪竴鑸柟寮忔槸鈥滄暟棰�+甯佺鈥濄�傝嫳璇腑锛岃〃杈鹃噾棰濈殑涔﹂潰褰㈠紡鏄�滃竵绉�+鏁伴鈥濓紝浣嗗彛澶磋〃杈惧嵈鏄�滄暟棰�+甯佺鈥濄�備緥濡�: + </p> + <div class="fl jc-c"> + <table border="1" cellpadding="10" cellspacing="0" style=" + border-color: #5192c6; + border-collapse: collapse; + margin: 0 20px; + " class="fz-16 w80"> + <tr class="table-tr-bc"> + <td class="center img-g">涔﹂潰褰㈠紡</td> + <td class="center img-g">鍙eご琛ㄨ揪</td> + </tr> + <tr class="table-tr-bc"> + <td class="center">US$ 106</td> + <td class="center">涓�鐧鹃浂鍏編鍏�</td> + </tr> + <tr class="table-tr-bc"> + <td class="center">RMB 锟�106</td> + <td class="center">涓�鐧鹃浂鍏汉姘戝竵</td> + </tr> + <tr class="table-tr-bc"> + <td class="center">锟� 106</td> + <td class="center">涓�鐧鹃浂鍏嫳闀�</td> + </tr> + </table> + </div> + <p class="td-2 mb-20"> + (7)缁撹处鍚庯紝瑕佽窡瀹汉鍛婂埆锛屽彲浠ヨ鈥滃笇鏈涘啀娆′负鎮ㄦ湇鍔°�傚洜涓哄浜鸿绂诲簵锛屾墍浠ヤ篃瑕佽〃杈惧瀹汉鐨勭鎰匡紝鍙互璇粹�滅鎮ㄦ梾閫旀剦蹇� + </p> + </div> + <p class="titleQuot-1" style="line-height: 25px"> + 4. Test Yourself锛堣嚜娴嬶級 + <!-- <span title="鏌ョ湅绛旀" class="btn-box" @click="showAnswerText = !showAnswerText"> + <svg + xmlns="http://www.w3.org/2000/svg" + width="20.501" + height="20.501" + viewBox="0 0 20.501 20.501" + > + <path + class="a" + d="M3344.717-15308.5H3337.4a10.186,10.186,0,0,1-7.25-3,10.185,10.185,0,0,1-3-7.25A10.262,10.262,0,0,1,3337.4-15329a10.26,10.26,0,0,1,10.249,10.248,10.129,10.129,0,0,1-2.2,6.341v3.177A.734.734,0,0,1,3344.717-15308.5Zm-9.606-7.29h4.493l.527,1.419c.071.182.156.386.254.608a2.428,2.428,0,0,0,.273.512.986.986,0,0,0,.315.262.971.971,0,0,0,.454.1,1.05,1.05,0,0,0,.773-.327,1.025,1.025,0,0,0,.319-.723,3.3,3.3,0,0,0-.277-1.051l-.062-.161-2.889-7.313c-.119-.321-.228-.607-.335-.873a2.972,2.972,0,0,0-.323-.616,1.56,1.56,0,0,0-.5-.469,1.552,1.552,0,0,0-.781-.181,1.535,1.535,0,0,0-.773.181,1.475,1.475,0,0,0-.5.477,3.674,3.674,0,0,0-.362.739l-.239.627-.054.135-2.824,7.355c-.095.229-.179.46-.25.688a1.529,1.529,0,0,0-.073.477.978.978,0,0,0,.323.72,1.039,1.039,0,0,0,.746.315.838.838,0,0,0,.716-.3,4.676,4.676,0,0,0,.466-.985l.062-.165.527-1.449Zm3.747-1.5h-3.293l1.812-5.124,1.481,5.123Z" + transform="translate(-3327.144 15329)" + /> + </svg> + </span> --> + </p> + <p class="poemtitle-l"> + Task 1 Retell the basic procedures to check out the guests as a + cashier. + </p> + <textarea v-model="questionData.one" placeholder="璇疯緭鍏ュ唴瀹�" rows="8" style="max-width: 100%; width: 100%" + class="fz-16 fm-son textarea-question" @change="saveQuestionData"></textarea> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">299</div> + </div> + </div> + </div> + <!-- 300椤� --> + <div class="page-box" page="9"> + <div v-if="showPageList.indexOf(9) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"> + <p class="poemtitle-l"> + Task 2 Give your understanding of Diff erent Ways of Payment. + </p> + <textarea v-model="questionData.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="15" style="max-width: 100%; width: 100%" + class="fz-16 fm-son textarea-question" @change="saveQuestionData"></textarea> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">300</div> + </div> + </div> + </div> + <!-- 301椤� --> + <div class="page-box" page="10"> + <div v-if="showPageList.indexOf(10) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 3</span><span>Build Your Language</span> + </li> + <li>璇█鍌ㄥ</li> + </ul> + <div class="unit-title-box"> + <p></p> + <div> + <img class="" src="../../assets/images/0002-01.jpg" alt="" /> + <p class="td-0">Activity 3</p> + </div> + <p class="td-0 unit-title-text">Build Your Language 璇█鍌ㄥ</p> + </div> + <div class="bodystyle"> + <p class="titleQuot-1">1. Objectives锛堢洰鏍囷級</p> + <p class="content">鈥� To grasp the key special terms;</p> + <p class="content">鈥� To grasp the useful expressions;</p> + <p class="content"> + 鈥� To improve your speaking and listening skills; + </p> + <p class="content"> + 鈥� To be familiar with the basic steps when checking out a guest. + </p> + <p class="titleQuot-1"> + 2. Learn the New Words and Special Terms锛堝涔犵敓璇嶅強鏈锛� + </p> + <h1 class="center"> + <audio :src="audioPathOne" controls controlslist="noplaybackrate nodownload" class="audio"></audio> + </h1> + <div class="bodyPic mt-10 mb-10"> + <img src="../../assets/images/0007-01.jpg" style="width: 60%" alt="" /> + </div> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">301</div> + </div> + </div> + </div> + <!-- 302椤� --> + <div class="page-box" page="11"> + <div v-if="showPageList.indexOf(11) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"> + <div class="bodyPic mt-10 mb-10"> + <img src="../../assets/images/0008-01.jpg" style="width: 50%" alt="" /> + </div> + <p class="titleQuot-1">3. Listen to the Conversation锛堝惉瀛︿細璇濓級</p> + <p class="poemtitle-l"> + Task 1 listen to the conversation between the cashier and the guest. + Pay special attention to what Julia, the cashier, says. + </p> + <p class="titleQuot-c">Checking Out the Guest</p> + <div class="border"> + <p class="content"> + Roles: Julia, the cashier; Richard Bush, the guest. + </p> + <p class="content">Scene: Julia is checking out the guest.</p> + </div> + <h1 class="center"> + <audio :src="audioPathTwo" controls controlslist="noplaybackrate nodownload" class="audio"></audio> + </h1> + <div class="content fl"> + <p class="bgColor mr-10"><span class="bold1">Julia:</span></p> + <p>Good morning. How can I help you?</p> + </div> + <p class="content td-0"> + <span class="bold2 mr-10">Richard Bush:</span> Good morning. I'd + like to settle my hotel bill now. + </p> + <div class="content fl"> + <p class="bgColor mr-10"><span class="bold1">Julia:</span></p> + <p> + Certainly, sir. Have you returned your room card to the reception + desk? + </p> + </div> + <p class="content"> + <span class="bold2 mr-10">Richard Bush:</span> Yes. + </p> + + <div class="content fl"> + <p class="bgColor mr-10"><span class="bold1">Julia:</span></p> + <p>May I know your name and your room number, please?</p> + </div> + <p class="content"> + <span class="bold2 mr-10">Richard Bush:</span> Richard Bush in Room + 1206. + </p> + + <div class="content fl"> + <p class="bgColor mr-10"><span class="bold1">Julia:</span></p> + <p> + Just a minute, please. Have you used any hotel service this + morning? + </p> + </div> + <div class="content fl"> + <p class="mr-10" style="text-wrap: nowrap"> + <span class="bold2">Richard Bush:</span> + </p> + <p> + Yes. I asked for room service this morning and used the mini-bar + service about 1 hour ago. + </p> + </div> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">302</div> + </div> + </div> + </div> + <!-- 303椤� --> + <div class="page-box" page="12"> + <div v-if="showPageList.indexOf(12) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 3</span><span>Build Your Language</span> + </li> + <li>璇█鍌ㄥ</li> + </ul> + <div class="bodystyle"> + <div class="content fl"> + <p class="bgColor mr-10"><span class="bold1">Julia:</span></p> + <p> + I'm afraid your fi nal bill hasn't reached here yet. I'll call the + departments concerned. Just a moment, please. + </p> + </div> + <p class="content">(After a while...)</p> + <div class="content fl"> + <p class="bgColor mr-10"><span class="bold1">Julia:</span></p> + <p> + Sorry to have kept you waiting. Here is your final bill.It totals + RMB 6,280 yuan,including your room rents, laundry service charges, + room service charges, dining-hall bills and the mini-bar service + fees. Please have a check. + </p> + </div> + <p class="content"> + <span class="bold2 mr-10">Richard Bush:</span> That's quite right. + </p> + <div class="content fl"> + <p class="bgColor mr-10"><span class="bold1">Julia:</span></p> + <p>How would you like to make the payment, sir?</p> + </div> + <p class="content"> + <span class="bold2 mr-10">Richard Bush:</span> By credit card. Do + you <span class="bold">honor</span> the American Express here? + </p> + <div class="content fl"> + <p class="bgColor mr-10"><span class="bold1">Julia:</span></p> + <p>Yes. Let me take a print of your card.</p> + </div> + <p class="content"> + <span class="bold2 mr-10">Richard Bush:</span> Here it is. + </p> + <div class="content fl"> + <p class="bgColor mr-10"><span class="bold1">Julia:</span></p> + <p>Thank you.</p> + </div> + <p class="content">(After printing the card...)</p> + <div class="content fl"> + <p class="bgColor mr-10"><span class="bold1">Julia:</span></p> + <p>Would you please sign your name here?</p> + </div> + <p class="content"> + <span class="bold2 mr-10">Richard Bush:</span> Sure. + </p> + <div class="content fl"> + <p class="bgColor mr-10"><span class="bold1">Julia:</span></p> + <p> + Thank you, sir. This is your card and the + <span class="bold">receipt</span>. We hope you have enjoyed your + stay in our hotel. + </p> + </div> + <p><br /></p> + <p class="poemtitle-l mt-20"> + Task 2 Listen to the above conversation again and try to find out + what expressions are used by the cashier when preparing the bill. + </p> + <p class="content"> + (1) + <input :disabled="testData.isComplete" v-model="testData.answerList[0].value" type="text" + class="input-bottom-border" style="width: 50%" @change="setTestData" /> + <span class="icon-box"> + <svg v-if="testData.answerList[0].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="testData.answerList[0].isRight == false" t="1716987085767" class="icon" viewBox="0 0 1024 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" + width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + any hotel service this morning? + </p> + <p class="content"> + (2) I'm afraid + <input :disabled="testData.isComplete" v-model="testData.answerList[1].value" type="text" + class="input-bottom-border" style="width: 40%" @change="setTestData" /> + <span class="icon-box"> + <svg v-if="testData.answerList[1].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="testData.answerList[1].isRight == false" t="1716987085767" class="icon" viewBox="0 0 1024 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" + width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> </span>. I'll call the departments concerned. + </p> + <p class="content"> + (3) Sorry to have kept you waiting. + <input :disabled="testData.isComplete" v-model="testData.answerList[2].value" type="text" + class="input-bottom-border" style="width: 50%" @change="setTestData" /> + <span class="icon-box"> + <svg v-if="testData.answerList[2].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="testData.answerList[2].isRight == false" t="1716987085767" class="icon" viewBox="0 0 1024 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" + width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> </span>. + </p> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">303</div> + </div> + </div> + </div> + <!-- 304椤� --> + <div class="page-box" page="13"> + <div v-if="showPageList.indexOf(13) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"> + <p class="content"> + (4)<input :disabled="testData.isComplete" v-model="testData.answerList[3].value" type="text" + class="input-bottom-border" style="width: 30%" @change="setTestData" /> + <span class="icon-box"> + <svg v-if="testData.answerList[3].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="testData.answerList[3].isRight == false" t="1716987085767" class="icon" viewBox="0 0 1024 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" + width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> </span>RMB 6,280 yuan,including<input :disabled="testData.isComplete" + v-model="testData.answerList[4].value" type="text" class="input-bottom-border" style="width: 30%" + @change="setTestData" /> + <span class="icon-box"> + <svg v-if="testData.answerList[4].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="testData.answerList[4].isRight == false" t="1716987085767" class="icon" viewBox="0 0 1024 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" + width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> </span>, laundry service charges, room service charges, dining-hall bills, + and the mini-bar service fees. Please + <input :disabled="testData.isComplete" v-model="testData.answerList[5].value" type="text" + class="input-bottom-border" style="width: 60%" @change="setTestData" /> + <span class="icon-box"> + <svg v-if="testData.answerList[5].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="testData.answerList[5].isRight == false" t="1716987085767" class="icon" viewBox="0 0 1024 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" xmlns:xlink="http://www.w3.org/1999/xlink" + width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> </span>. + </p> + <p class="event-header-text-bc pd-5 mb-20" style="width: 100%" v-if="showAnswerTestData"> + 绛旀锛�1.Have you used銆�2.your final bill hasn't reached here + yet銆�3.Here is your final bill銆�4.It totals銆�5.your room + rents銆�6.have a check + </p> + <div class="w100 fl ju-cn mb-20 mt-20"> + <div class="fl ju-ev mt-40" style="width: 80%"> + <button class="btn-border btn-w" @click="handleTestData()"> + 鎻愪氦 + </button> + <button class="btn-border btn-w" @click="clearTestData"> + 閲嶅仛 + </button> + <button @click="showAnswerTestData = !showAnswerTestData" class="parimary-btn"> + 鏌ョ湅绛旀 + </button> + </div> + </div> + <p class="titleQuot-1"> + 4. Refer to More Useful Expressions锛堝弬鐪嬫洿澶氳〃杈撅級 + </p> + <p class="content">(1) Good afternoon, sir. May I help you?</p> + <p class="quotation fm-kt">鍏堢敓锛屼笅鍗堝ソ銆傝闂偍鏈変粈涔堥渶瑕佸悧锛�</p> + <p class="content">(2) May I have your name and room number?</p> + <p class="quotation fm-kt">璇烽棶鎮ㄧ殑濮撳悕鍜屾埧闂村彿锛�</p> + <p class="content">(3) May I have your room card, please?</p> + <p class="quotation fm-kt">鎮ㄥ彲浠ユ妸鎴垮崱缁欐垜鍚楋紵</p> + <p class="content">(4) Do you enjoy your stay with us?</p> + <p class="quotation fm-kt">鎮ㄤ綇寰楄繕鎰夊揩鍚楋紵</p> + <p class="content"> + (5) Did you sign any bills in the last two hours? + </p> + <p class="quotation fm-kt">鎮ㄥ湪鏈�鍚庝袱涓皬鏃堕噷鏈夌鍗曞悧锛�</p> + <p class="content"> + (6) Did you used any hotel services this morning? + </p> + <p class="quotation fm-kt">浠婂ぉ涓婂崍鎮ㄧ敤杩囬厭搴楁湇鍔″悧锛�</p> + <p class="content"> + (7) I'm afraid your fi nal bill hasn't reached here yet. + </p> + <p class="quotation fm-kt">鎭愭�曟偍鐨勬渶鍚庤处鍗曡繕娌″埌銆�</p> + <p class="content">(8) I'll call and ask the department concerned.</p> + <p class="quotation fm-kt">鎴戣闂竴涓嬬浉鍏抽儴闂ㄣ��</p> + <p class="content">(9) I'll draw up the bill for you.</p> + <p class="quotation fm-kt">鎴戝府鎮ㄧ粨绠楄处鍗曘��</p> + <p class="content">(10) Here's your bill.</p> + <p class="quotation fm-kt">杩欐槸鎮ㄧ殑璐﹀崟銆�</p> + <p class="content">(11)It totals RMB 1000 yuan.</p> + <p class="quotation fm-kt">鎬婚鏄�1000鍏冧汉姘戝竵銆�</p> + <p class="content"> + (12) Please check the bill and see if there is any mistake. + </p> + <p class="quotation fm-kt">璇锋牳瀵逛竴涓嬭处鍗曪紝鐪嬬湅鏄惁鏈夎銆�</p> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">304</div> + </div> + </div> + </div> + <!-- 305椤� --> + <div class="page-box" page="14"> + <div v-if="showPageList.indexOf(14) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 3</span><span>Build Your Language</span> + </li> + <li>璇█鍌ㄥ</li> + </ul> + <div class="bodystyle"> + <p class="content"> + (13) This is for three dinners that you signed for. + </p> + <p class="quotation fm-kt">杩欐槸鎮ㄧ敤鐨勪笁娆℃櫄椁愮殑绛惧崟銆�</p> + <p class="content">(14) May I check the details for you, please?</p> + <p class="quotation fm-kt">鎴戞潵鏍告煡涓�涓嬭缁嗘椤癸紝濂藉悧?</p> + <p class="content"> + (15) Shall I explain the items on the bill for you? + </p> + <p class="quotation fm-kt">闇�瑕佹垜瑙i噴璐﹀崟涓婄殑鏀舵娆鹃」鍚楋紵</p> + <p class="content"> + (16) I'm sorry, but did you use the mini-bar this morning? + </p> + <p class="quotation fm-kt"> + 涓嶅ソ鎰忔�濓紝浣嗘槸鎮ㄤ粖鏃╀娇鐢ㄤ簡杩蜂綘鍚э紝瀵瑰悧锛� + </p> + <p class="content">(17) Here are your mini-bar expenses.</p> + <p class="quotation fm-kt">杩欐槸鎮ㄤ娇鐢ㄨ糠浣犲惂鐨勮垂鐢ㄣ��</p> + <p class="content"> + (18) I'm afraid that for late check-out we charge an extra 50% of + the room rate. + </p> + <p class="quotation fm-kt"> + 瀵逛簬鎮ㄧ殑寤惰繜绂诲簵锛屾亹鎬曟垜浠棰濆鏀跺彇50%鐨勬埧璐广�� + </p> + <p class="content">(19) Would you mind waiting for a minute?</p> + <p class="quotation fm-kt">鎮ㄤ粙鎰忕瓑涓�浼氬効鍚楋紵</p> + <p class="content">(20) I'm sorry, but the bill is right, sir.</p> + <p class="quotation fm-kt">鍏堢敓锛屽緢鎶辨瓑銆備絾鏄处鍗曟病鏈夐敊璇��</p> + <p class="content">(21) We'll correct your bill.</p> + <p class="quotation fm-kt">鎴戜滑鎶婅处鍗曠籂姝h繃鏉ャ��</p> + <p class="content fm-kt">(22) We do apologize for the error.</p> + <p class="quotation fm-kt">鎴戜滑涓烘垜浠殑澶辫娣辫〃姝夋剰銆�</p> + <p class="content">(23) How would you like to pay锛�</p> + <p class="quotation fm-kt">鎮ㄧ敤浠�涔堟柟寮忎粯娆撅紵</p> + <p class="content">(24) How would you like to settle your bill?</p> + <p class="quotation fm-kt">鎮ㄧ敤浠�涔堟柟寮忕粨璐︼紵</p> + <p class="content">(25) What kind of credit card have you got?</p> + <p class="quotation fm-kt">鎮ㄧ敤鐨勬槸鍝淇$敤鍗★紵</p> + <p class="content">(26) Could you sign here, please锛�</p> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">305</div> + </div> + </div> + </div> + <!-- 306椤� --> + <div class="page-box" page="15"> + <div v-if="showPageList.indexOf(15) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"> + <p class="quotation fm-kt">鎮ㄥ彲浠ュ湪杩欓噷绛惧悕鍚楋紵</p> + <p class="content">(27) Your bill is paid by ... company.</p> + <p class="quotation fm-kt">鎮ㄧ殑璐﹀崟鐢泵椕椕楀叕鍙告敮浠樸��</p> + <p class="content"> + (28) We accept American Express, MasterCard and Visa. + </p> + <p class="quotation fm-kt">鎴戜滑鎺ュ彈缇庡浗杩愰�氬崱銆佷竾浜嬭揪鍗″拰缁磋惃鍗°��</p> + <p class="content"> + (29) I'm sorry but we are not allowed to accept + <span class="bold">personal checks.</span> + </p> + <p class="quotation fm-kt">瀵逛笉璧凤紝鎴戜滑涓嶈兘鎺ュ彈涓汉鏀エ銆�</p> + <p class="content"> + (30) Your credit limit set by the Visa Card offi ce is 1,500 + dollars. + </p> + <p class="quotation fm-kt">鎮ㄧ淮钀ㄥ崱鐨勪俊鐢ㄩ檺棰濇槸1500缇庡厓銆�</p> + <p class="content"> + (31) Would you like to settle the diff erence in cash? + </p> + <p class="quotation fm-kt">鎮ㄧ敤鐜伴噾琛ュ樊棰濆彲浠ュ悧锛�</p> + <p class="content"> + (32) Here is your <span class="bold">change/</span>receipt/<span class="bold">invoice</span>. + </p> + <p class="quotation fm-kt">杩欐槸鎮ㄧ殑闆堕挶/鏀舵嵁/鍙戠エ銆�</p> + <p class="content">(33) Wish you a pleasant journey.</p> + <p class="quotation fm-kt">绁濇偍鏃呰鎰夊揩銆�</p> + <p class="content">(34) We hope you had enjoyed your stay.</p> + <p class="quotation fm-kt">甯屾湜鎮ㄥ湪杩欏効浣忓緱鎰夊揩銆�</p> + <p class="content">(35) We look forward to serving you again.</p> + <p class="quotation fm-kt">鎴戜滑鏈熷緟鑳藉啀娆′负鎮ㄦ湇鍔°��</p> + <p class="titleQuot-1">5. Test Yourself锛堣嚜娴嬶級</p> + <p class="poemtitle-l"> + Task 1 write down the words鈥� spelling forms and their equivalent + pronunciations according to what you hear. + </p> + <h1 class="center"> + <audio :src="audioPathThree" controls controlslist="noplaybackrate nodownload" class="audio"></audio> + </h1> + <table cellpadding="0" cellspacing="0" style=" + border-collapse: collapse; + margin: 0 20px; + " class="fz-16 mb-20"> + <tr class="table-th-bc"> + <td class="center">No.</td> + <td class="center">Word</td> + <td class="center">Pronunciation</td> + </tr> + <tr class="table-tr-bc"> + <td class="center">(1)</td> + <td class="center"> + <input v-model="tableData.one" type="text" class="input-bottom-border" style="width: 60%" + @change="saveTableData" /> + </td> + <td class="center"> + <input v-model="tableData.two" type="text" class="input-bottom-border" style="width: 70%" + @change="saveTableData" /> + </td> + </tr> + <tr class="table-tr-bc"> + <td class="center">(2)</td> + <td class="center"> + <input v-model="tableData.three" type="text" class="input-bottom-border" style="width: 60%" + @change="saveTableData" /> + </td> + <td class="center"> + <input v-model="tableData.four" type="text" class="input-bottom-border" style="width: 70%" + @change="saveTableData" /> + </td> + </tr> + <tr class="table-tr-bc"> + <td class="center">(3)</td> + <td class="center"> + <input v-model="tableData.five" type="text" class="input-bottom-border" style="width: 60%" + @change="saveTableData" /> + </td> + <td class="center"> + <input v-model="tableData.six" type="text" class="input-bottom-border" style="width: 70%" + @change="saveTableData" /> + </td> + </tr> + </table> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">306</div> + </div> + </div> + </div> + <!-- 307椤� --> + <div class="page-box" page="16"> + <div v-if="showPageList.indexOf(16) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 3</span><span>Build Your Language</span> + </li> + <li>璇█鍌ㄥ</li> + </ul> + <div class="bodystyle"> + <table cellpadding="0" cellspacing="0" style=" + border-collapse: collapse; + margin: 0 20px; + " class="fz-16 "> + <tr class="table-tr-bc"> + <td class="center">(4)</td> + <td class="center"> + <input v-model="tableData.seven" type="text" class="input-bottom-border" style="width: 60%" + @change="saveTableData" /> + </td> + <td class="center"> + <input v-model="tableData.eight" type="text" class="input-bottom-border" style="width: 70%" + @change="saveTableData" /> + </td> + </tr> + <tr class="table-tr-bc"> + <td class="center">(5)</td> + <td class="center"> + <input v-model="tableData.nine" type="text" class="input-bottom-border" style="width: 60%" + @change="saveTableData" /> + </td> + <td class="center"> + <input v-model="tableData.ten" type="text" class="input-bottom-border" style="width: 70%" + @change="saveTableData" /> + </td> + </tr> + <tr class="table-tr-bc"> + <td class="center">(6)</td> + <td class="center"> + <input v-model="tableData.eleven" type="text" class="input-bottom-border" style="width: 60%" + @change="saveTableData" /> + </td> + <td class="center"> + <input v-model="tableData.twelve" type="text" class="input-bottom-border" style="width: 70%" + @change="saveTableData" /> + </td> + </tr> + <tr class="table-tr-bc"> + <td class="center">(7)</td> + <td class="center"> + <input v-model="tableData.thirteen" type="text" class="input-bottom-border" style="width: 60%" + @change="saveTableData" /> + </td> + <td class="center"> + <input v-model="tableData.fourteen" type="text" class="input-bottom-border" style="width: 70%" + @change="saveTableData" /> + </td> + </tr> + <tr class="table-tr-bc"> + <td class="center">(8)</td> + <td class="center"> + <input v-model="tableData.fifteen" type="text" class="input-bottom-border" style="width: 60%" + @change="saveTableData" /> + </td> + <td class="center"> + <input v-model="tableData.sixteen" type="text" class="input-bottom-border" style="width: 70%" + @change="saveTableData" /> + </td> + </tr> + <tr class="table-tr-bc"> + <td class="center">(9)</td> + <td class="center"> + <input v-model="tableData.seventeen" type="text" class="input-bottom-border" style="width: 60%" + @change="saveTableData" /> + </td> + <td class="center"> + <input v-model="tableData.eighteen" type="text" class="input-bottom-border" style="width: 70%" + @change="saveTableData" /> + </td> + </tr> + <tr class="table-tr-bc"> + <td class="center">(10)</td> + <td class="center"> + <input v-model="tableData.nineteen" type="text" class="input-bottom-border" style="width: 60%" + @change="saveTableData" /> + </td> + <td class="center"> + <input v-model="tableData.twenty" type="text" class="input-bottom-border" style="width: 70%" + @change="saveTableData" /> + </td> + </tr> + </table> + <p class="poemtitle-l"> + Task 2 Choose proper expressions from what are given to you in the + following box and complete the following short dialogues. + </p> + <p class="content">(1)A:680 yuan in all,sir.</p> + <p class="content"> + B:680 yuan? + <select class="select-border" :disabled="activityThree.isComplete" @change="saveActiveThree" + v-model="activityThree.answerList[0].value" style="width: 20%"> + <option v-for="(item, index) in activityThree.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="activityThree.answerList[0].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[0].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + <p class="content">(2) A: How would you like to pay your bill?</p> + <p class="content"> + B: + <select class="select-border" :disabled="activityThree.isComplete" @change="saveActiveThree" + v-model="activityThree.answerList[1].value" style="width: 20%"> + <option v-for="(item, index) in activityThree.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="activityThree.answerList[1].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[1].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + <p class="content"> + (3) A: I'm leaving today. + <select class="select-border" :disabled="activityThree.isComplete" @change="saveActiveThree" + v-model="activityThree.answerList[2].value" style="width: 20%"> + <option v-for="(item, index) in activityThree.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="activityThree.answerList[2].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[2].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + <p class="content">B: Your name and room number, please?</p> + <p class="content"> + (4) A: One more thing, I never used the mini-bar. + </p> + <p class="content"> + B: + <select class="select-border" :disabled="activityThree.isComplete" @change="saveActiveThree" + v-model="activityThree.answerList[3].value" style="width: 20%"> + <option v-for="(item, index) in activityThree.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="activityThree.answerList[3].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[3].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + <p class="content"> + (5) A: Have you used any hotel services, Mr. Jackson? + </p> + <p class="content"> + B: Yes. + <select class="select-border" :disabled="activityThree.isComplete" @change="saveActiveThree" + v-model="activityThree.answerList[4].value" style="width: 20%"> + <option v-for="(item, index) in activityThree.options" :key="index" :value="item"> + {{ item }} + </option> + </select> + <span class="icon-box"> + <svg v-if="activityThree.answerList[4].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[4].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + <div class="border"> + <p class="content">A. May I have my bill?</p> + <p class="content">B. There must be a mistake.</p> + <p class="content">C. Oh, let me check with the Housekeeping.</p> + <p class="content">D. My friend and I just had breakfast.</p> + <p class="content">E. Sign it to my room, please.</p> + </div> + <p class="event-header-text-bc pd-5 mb-20" style="width: 100%" v-if="showAnswerActivityThree"> + 绛旀锛�1.B銆�2.E銆�3.A銆�4.C銆�5.D + </p> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">307</div> + </div> + </div> + </div> + <!-- 308椤� --> + <div class="page-box" page="17"> + <div v-if="showPageList.indexOf(17) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"> + <p class="poemtitle-l"> + Task 3 interpret what you hear from Chinese into English or from + English into Chinese. + </p> + <h1 class="center"> + <audio :src="audioPathFour" controls controlslist="noplaybackrate nodownload" class="audio"></audio> + </h1> + <p class="content"> + (1) + <input :disabled="activityThree.isComplete" v-model="activityThree.answerList[5].value" type="text" + class="input-bottom-border" style="width: 80%" @change="saveActiveThree" /> + <span class="icon-box"> + <svg v-if="activityThree.answerList[5].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[5].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + + <p class="content"> + (2) + <input :disabled="activityThree.isComplete" v-model="activityThree.answerList[6].value" type="text" + class="input-bottom-border" style="width: 80%" @change="saveActiveThree" /> + <span class="icon-box"> + <svg v-if="activityThree.answerList[6].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[6].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + + <p class="content"> + (3) + <input :disabled="activityThree.isComplete" v-model="activityThree.answerList[7].value" type="text" + class="input-bottom-border" style="width: 80%" @change="saveActiveThree" /> + <span class="icon-box"> + <svg v-if="activityThree.answerList[7].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[7].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + + <p class="content"> + (4) + <input :disabled="activityThree.isComplete" v-model="activityThree.answerList[8].value" type="text" + class="input-bottom-border" style="width: 80%" @change="saveActiveThree" /> + <span class="icon-box"> + <svg v-if="activityThree.answerList[8].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[8].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + + <p class="content"> + (5) + <input :disabled="activityThree.isComplete" v-model="activityThree.answerList[9].value" type="text" + class="input-bottom-border" style="width: 80%" @change="saveActiveThree" /> + <span class="icon-box"> + <svg v-if="activityThree.answerList[9].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[9].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + + <p class="content"> + (6) + <input :disabled="activityThree.isComplete" v-model="activityThree.answerList[10].value" type="text" + class="input-bottom-border" style="width: 80%" @change="saveActiveThree" /> + <span class="icon-box"> + <svg v-if="activityThree.answerList[10].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[10].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + + <p class="content"> + (7) + <input :disabled="activityThree.isComplete" v-model="activityThree.answerList[11].value" type="text" + class="input-bottom-border" style="width: 80%" @change="saveActiveThree" /> + <span class="icon-box"> + <svg v-if="activityThree.answerList[11].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[11].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + + <p class="content"> + (8) + <input :disabled="activityThree.isComplete" v-model="activityThree.answerList[12].value" type="text" + class="input-bottom-border" style="width: 80%" @change="saveActiveThree" /> + <span class="icon-box"> + <svg v-if="activityThree.answerList[12].isRight" t="1716986419862" class="icon" viewBox="0 0 1820 1024" + version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18767" xmlns:xlink="http://www.w3.org/1999/xlink" + width="40" height="20"> + <path + d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0" + fill="#1AFA29" p-id="18768"></path> + </svg> + <svg v-if="activityThree.answerList[12].isRight == false" t="1716987085767" class="icon" + viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25745" + xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20"> + <path + d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531" + fill="#d81e06" p-id="25746"></path> + </svg> + </span> + </p> + + <p class="event-header-text-bc pd-5 mb-20" style="width: 100%" v-if="showAnswerActivityThree"> + 绛旀锛�<br /> + (1)鏀堕摱鍙�<br /> + (2)涓囦簨杈惧崱<br /> + (3)缁撶畻璐﹀崟<br /> + (4)杩欐槸鎮ㄧ殑闆堕挶銆�<br /> + (5)Shall I explain the items on the billfor you?<br /> + (6)What kind of credit card have you got?<br /> + (7)We'll charge an extra 50%of the room rate.<br /> + (8)How would you like to settle the difference? + </p> + + <div class="w100 fl ju-cn mb-20 mt-20"> + <div class="fl ju-ev mt-40" style="width: 80%"> + <button class="btn-border btn-w" @click="handleActivityThree()"> + 鎻愪氦 + </button> + <button class="btn-border btn-w" @click="clearActivityThree"> + 閲嶅仛 + </button> + <button @click="showAnswerActivityThree = !showAnswerActivityThree" class="parimary-btn"> + 鏌ョ湅绛旀 + </button> + </div> + </div> + </div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">308</div> + </div> + </div> + </div> + <!-- 309椤� --> + <div class="page-box" page="18"> + <div v-if="showPageList.indexOf(18) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 4</span><span>Train Your Basic Skills </span> + </li> + <li>鎶�鑳藉疄璁�</li> + </ul> + <div class="unit-title-box"> + <p></p> + <div> + <img class="" src="../../assets/images/0002-01.jpg" alt="" /> + <p class="td-0">Activity 4</p> + </div> + <p class="td-0 unit-title-text">Train Your Basic Skills 鎶�鑳藉疄璁�</p> + </div> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">309</div> + </div> + </div> + </div> + <!-- 310椤� --> + <div class="page-box" page="19"> + <div v-if="showPageList.indexOf(19) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">310</div> + </div> + </div> + </div> + <!-- 311椤� --> + <div class="page-box" page="20"> + <div v-if="showPageList.indexOf(20) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 4</span><span>Train Your Basic Skills </span> + </li> + <li>鎶�鑳藉疄璁�</li> + </ul> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">311</div> + </div> + </div> + </div> + <!-- 312椤� --> + <div class="page-box" page="21"> + <div v-if="showPageList.indexOf(21) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">312</div> + </div> + </div> + </div> + <!-- 313椤� --> + <div class="page-box" page="22"> + <div v-if="showPageList.indexOf(22) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 5</span><span>Further Your Skills</span> + </li> + <li>鎶�鑳芥彁鍗�</li> + </ul> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">313</div> + </div> + </div> + </div> + <!-- 314椤� --> + <div class="page-box" page="23"> + <div v-if="showPageList.indexOf(23) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">314</div> + </div> + </div> + </div> + <!-- 315椤� --> + <div class="page-box" page="24"> + <div v-if="showPageList.indexOf(24) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 5</span><span>Further Your Skills</span> + </li> + <li>鎶�鑳芥彁鍗�</li> + </ul> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">315</div> + </div> + </div> + </div> + <!-- 316椤� --> + <div class="page-box" page="25"> + <div v-if="showPageList.indexOf(25) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">316</div> + </div> + </div> + </div> + <!-- 317椤� --> + <div class="page-box" page="26"> + <div v-if="showPageList.indexOf(26) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 5</span><span>Further Your Skills</span> + </li> + <li>鎶�鑳芥彁鍗�</li> + </ul> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">317</div> + </div> + </div> + </div> + <!-- 318椤� --> + <div class="page-box" page="27"> + <div v-if="showPageList.indexOf(27) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">318</div> + </div> + </div> + </div> + <!-- 319椤� --> + <div class="page-box" page="28"> + <div v-if="showPageList.indexOf(28) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-right"> + <li class="header-right-Text"> + <span>Activity 6</span><span>At the Smart Hotel</span> + </li> + <li>鏅烘収閰掑簵</li> + </ul> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-right-img" src="../../assets/images/right-page.png" alt="" /> + <div class="copyrightPage-right-box">319</div> + </div> + </div> + </div> + <!-- 320椤� --> + <div class="page-box" page="29"> + <div v-if="showPageList.indexOf(29) > -1"> + <div class="copyrightPage-top"></div> + <ul class="header-left"> + <li class="header-left-Text"> + <span>Project 12</span><span>Cashier鈥檚 Service</span> + </li> + <li>鏀堕摱鏈嶅姟</li> + </ul> + <div class="bodystyle"></div> + <div class="copyrightPage-bottom"> + <img class="copyrightPage-left-img" src="../../assets/images/left-page.png" alt="" /> + <div class="copyrightPage-left-box">320</div> + </div> + </div> + </div> + <div class="follow-box" :style="{ + display: isBoxVisible ? 'block' : 'none', + left: boxPosition.x + 'px', + top: boxPosition.y + 'px' + }"> + 璺熼殢榧犳爣鐨勭洅瀛� + </div> + </div> +</template> +<script> +import { getResourcePath } from "@/assets/methods/resources"; +import { + getCollectResource, + setCollectResource, +} from "@/assets/methods/resources"; +export default { + name: "chapterOne", + props: { + showPageList: { + type: Array, + }, + }, + data() { + return { + // 榧犳爣绉诲叆浜嬩欢 + isBoxVisible: false, + boxPosition: { x: 0, y: 0 }, + + + collectImg: require("../../assets/images/icon/heart.png"), + collectCheck: require("../../assets/images/icon/heart-check.png"), + // 闊抽 + audioPathOne: "", + audioPathTwo: "", + audioPathThree: "", + audioPathFour: "", + // 瑙嗛 + videoPathOne: "", + collectResourceList: [], + chapterData: { + isCollectVideoOne: false, + }, + // 绠�绛旈 + questionData: { + one: "", + two: "", + three: "", + four: "", + five: "", + }, + // select + showAnswerSelect: false, + selectData: { + isComplete: false, + //dropdown + options: [ + "financial", + "check-out", + "accommodations", + "accurately", + "banking", + "exchange", + "parking", + ], + answerList: [ + { + value: "", + isRight: null, + answer: "accommodations", + }, + { + value: "", + isRight: null, + answer: "parking", + }, + { + value: "", + isRight: null, + answer: "financial", + }, + { + value: "", + isRight: null, + answer: "exchange", + }, + { + value: "", + isRight: null, + answer: "check-out", + }, + { + value: "", + isRight: null, + answer: "banking", + }, + { + value: "", + isRight: null, + answer: "accurately", + }, + ], + }, + // 濉┖棰� + showAnswerTestData: false, + testData: { + isComplete: false, + answerList: [ + { + value: "", + isRight: null, + answer: "Have you used", + }, + { + value: "", + isRight: null, + answer: "your final bill hasn't reached here yet", + }, + { + value: "", + isRight: null, + answer: "Here is your final bill", + }, + { + value: "", + isRight: null, + answer: "It totals", + }, + { + value: "", + isRight: null, + answer: "your room rents", + }, + { + value: "", + isRight: null, + answer: "have a check", + }, + ], + }, + // 鍙傝�冭瘧鏂� + isDisolayTranslation: false, + + // Activity 3 Task 2~3 + showAnswerActivityThree: false, + activityThree: { + isComplete: false, + options: ["A", "B", "C", "D", "E"], + answerList: [ + { + value: "", + isRight: null, + answer: "B", + }, + { + value: "", + isRight: null, + answer: "E", + }, + { + value: "", + isRight: null, + answer: "A", + }, + { + value: "", + isRight: null, + answer: "C", + }, + { + value: "", + isRight: null, + answer: "D", + }, + { + value: "", + isRight: null, + answer: "鏀堕摱鍙�", + }, + { + value: "", + isRight: null, + answer: "涓囦簨杈惧崱", + }, + { + value: "", + isRight: null, + answer: "缁撶畻璐﹀崟", + }, + { + value: "", + isRight: null, + answer: "杩欐槸鎮ㄧ殑闆堕挶", + }, + { + value: "", + isRight: null, + answer: "Shall I explain the items on the bill for you?", + }, + { + value: "", + isRight: null, + answer: "What kind of credit card have you got?", + }, + { + value: "", + isRight: null, + answer: "We'll charge an extra 50% of the room rate.", + }, + { + value: "", + isRight: null, + answer: "How would you like to settle the diference?", + }, + ], + }, + + // 琛ㄦ牸鏁版嵁 + tableData: { + one: "", + two: "", + three: "", + four: "", + five: "", + six: "", + seven: "", + eight: "", + nine: "", + ten: "", + eleven: "", + twelve: "", + thirteen: "", + fourteen: "", + fifteen: "", + sixteen: "", + seventeen: "", + eighteen: "", + nineteen: "", + twenty: "", + } + }; + }, + async mounted() { + const questionData = localStorage.getItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-questionData" + ); + if (questionData) { + this.questionData = JSON.parse(questionData); + } + + const selectData = localStorage.getItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-selectData" + ); + if (selectData) { + this.selectData = JSON.parse(selectData); + } + + const testData = localStorage.getItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-testData" + ); + if (testData) { + this.testData = JSON.parse(testData); + } + + const activityThree = localStorage.getItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-activityThree" + ); + if (activityThree) { + this.activityThree = JSON.parse(activityThree); + } + + this.collectResourceList = await getCollectResource( + this.config.activeBook.bookId + ); + this.getVidoePath(); + }, + methods: { + async getVidoePath() { + this.videoPathOne = await getResourcePath( + "50ed3234d92cce02be3d277b0e1f88b2" + ); + this.audioPathOne = await getResourcePath( + "bd2987485c662cb6f36c92083e4094e2" + ); + this.audioPathTwo = await getResourcePath( + "1b5a381254352f9a03c6510bc9916768" + ); + this.audioPathThree = await getResourcePath( + "d91efc7a386e8a7b901742cf4ec4f0e1" + ); + this.audioPathFour = await getResourcePath( + "1f896412e668111c6793d1c60fe70ca8" + ); + }, + saveQuestionData() { + localStorage.setItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-questionData", + JSON.stringify(this.questionData) + ); + }, + //鎻愪氦 + handleDropdown() { + this.selectData.isComplete = true; + this.selectData.answerList.forEach((item) => { + if (item.value == item.answer) { + item.isRight = true; + } else { + item.isRight = false; + } + }); + this.saveSelectData(); + }, + + // 閲嶅仛 + clearSelectData() { + localStorage.removeItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-selectData" + ); + this.selectData.isComplete = false; + this.selectData.answerList.forEach((item) => { + item.value = ""; + item.isRight = null; + }); + }, + saveSelectData() { + localStorage.setItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-selectData", + JSON.stringify(this.selectData) + ); + }, + + //鎻愪氦 + handleTestData() { + this.testData.isComplete = true; + this.testData.answerList.forEach((item) => { + if (item.value == item.answer) { + item.isRight = true; + } else { + item.isRight = false; + } + }); + this.setTestData(); + }, + + // 閲嶅仛 + clearTestData() { + localStorage.removeItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-testData" + ); + this.testData.isComplete = false; + this.testData.answerList.forEach((item) => { + item.value = ""; + item.isRight = null; + }); + }, + + setTestData() { + localStorage.setItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-testData", + JSON.stringify(this.testData) + ); + }, + + //鎻愪氦 + handleActivityThree() { + this.activityThree.isComplete = true; + this.activityThree.answerList.forEach((item) => { + if (item.value == item.answer) { + item.isRight = true; + } else { + item.isRight = false; + } + }); + this.saveActiveThree(); + }, + + clearActivityThree() { + localStorage.removeItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-activityThree" + ); + this.activityThree.isComplete = false; + this.activityThree.answerList.forEach((item) => { + item.value = ""; + item.isRight = null; + }); + }, + + saveActiveThree() { + localStorage.setItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-activityThree", + JSON.stringify(this.activityThree) + ); + }, + + // 淇濆瓨 + saveTableData() { + localStorage.setItem( + "hotelEnglishTrainingBrochure2nd-book-chapter001-tableData", + JSON.stringify(this.tableData) + ); + }, + // 榧犳爣绉诲叆浜嬩欢 + handleMouseEnter(event) { + this.boxPosition.x = event.clientX; + this.boxPosition.y = event.clientY; + console.log(this.boxPosition, "this.boxPosition"); + // 璁剧疆鐩掑瓙浣嶇疆涓洪紶鏍囦綅缃笅鏂� + this.boxPosition.y += 50; // 璋冩暣鐩掑瓙涓庨紶鏍囩殑闂磋窛 + // 鏄剧ず鐩掑瓙 + this.isBoxVisible = true; + + + + + + }, + // 榧犳爣绉诲嚭浜嬩欢 + handleMouseLeave() { + + } + }, +}; +</script> + +<style lang="less" scoped></style> diff --git a/src/books/hotelEnglishTrainingBrochure2nd/view/components/header.vue b/src/books/hotelEnglishTrainingBrochure2nd/view/components/header.vue new file mode 100644 index 0000000..1f79d7a --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/view/components/header.vue @@ -0,0 +1,117 @@ +<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/Cover.jpg" /> + </div> + </div> + <!-- 鎵夐〉 --> + <div class="page-box mt-20" page="2" style="min-height: auto"> + <div v-if="showPageList.indexOf(2) > -1"> + <img class="img-0" alt="" src="../../assets/images/feiye.jpg" /> + </div> + </div> + <!-- 鎵夐〉 --> + <div class="page-box mt-20" page="3"> + <div v-if="showPageList.indexOf(3) > -1"> + <div class="copyrightPage-top"></div> + <div style="max-width: 600px; margin: 0 auto; padding: 1% 10%"> + <p class="fm-hyzh fz-16 bold">鍥句功鍦ㄧ増缂栫洰锛圕IP锛夋暟鎹�</p> + <p class="left3 mr-0 fm-hyss fz-16"> + 閰掑簵鑻辫瀹炶娲婚〉鏁欑▼ / 闆蜂咕涔�, 鍒樼櫥涓轰富缂�. --<br /> + 2鐗�. -- 鍖椾含 : 鏃呮父鏁欒偛鍑虹増绀�, 2025.3 + </p> + <p class="left3 fm-hyss fz-16">瀹炶瀵煎悜鍨嬫梾娓稿璇暀鏉�</p> + <p class="left3 fm-hyss fz-16">ISBN 978-7-5637-4705-4</p> + <p class="left3 fm-hyss fz-16 mt-20 mb-20"> + 鈪�. 鈶犻厭鈥� 鈪�. 鈶犻浄鈥� 鈶″垬鈥� 鈪�. 鈶犻キ搴楋紞鑻辫锛� <br />鏁欐潗 鈪�. 鈶燜719.2 + </p> + <p class="left3 fm-hyss fz-14"> + 涓浗鍥藉鐗堟湰棣咰IP鏁版嵁鏍稿瓧(2024)绗�031789鍙� + </p> + <p><br /></p> + <p class="left fz-16 fm-hyss center">瀹炶瀵煎悜鍨嬫梾娓稿璇暀鏉�</p> + <p class="left fz-16 fm-hyss center">閰掑簵鑻辫瀹炶娲婚〉鏁欑▼</p> + <p class="left fz-16 fm-hyss center">锛堢2鐗堬級</p> + <p class="left fz-18 fm-kt center">涓� 缂栥��闆蜂咕涔俱��鍒樼櫥涓�</p> + <p class="left fz-18 fm-kt center">鍓富缂栥��鍗庡浗姊呫��澶忋��瀛c��瀹夈��瀹�</p> + <p class="left fz-18 fm-kt center">鍙傘��缂栥��钄°��瀵汇��灞堟灄鑹炽��鍒樸��娓�</p> + <hr /> + <div class="fl"> + <div class="copyright-left"> + <p class="">绛栥��銆�鍒�</p> + <p class="">璐d换缂栬緫</p> + <p class="">鍑虹増鍗曚綅</p> + <p class="">鍦般��銆�鍧�</p> + <p class="">閭��銆�缂�</p> + <p class="">鍙戣鐢佃瘽</p> + <p class="">鏈ぞ缃戝潃</p> + <p class="">E - mail</p> + <p class="">鎺掔増鍗曚綅</p> + <p class="">鍗板埛鍗曚綅</p> + <p class="">缁忛攢鍗曚綅</p> + <p class="">寮�銆�銆�鏈�</p> + <p class="">鍗般��銆�寮�</p> + <p class="">瀛椼��銆�鏁�</p> + <p class="">鐗堛��銆�娆�</p> + <p class="">鍗般��銆�娆�</p> + <p class="">瀹氥��銆�浠�</p> + </div> + <div class="copyright-right"> + <p>鏉庣孩涓�</p> + <p>鏉庣孩涓�</p> + <p>鏃呮父鏁欒偛鍑虹増绀�</p> + <p>鍖椾含甯傛湞闃冲尯瀹氱搴勫崡閲� 1 鍙�</p> + <p>100024</p> + <p>锛�010锛�65778403銆�65728372銆�65767462锛堜紶鐪燂級</p> + <p>www.tepcb.com</p> + <p>tepfx@163.com</p> + <p>鍖椾含鏃呮暀鏂囧寲浼犳挱鏈夐檺鍏徃</p> + <p>鍖椾含鍗庤仈鍗板埛鏈夐檺鍏徃</p> + <p>鏂板崕涔﹀簵</p> + <p>710姣背脳1000姣背銆�1/16</p> + <p>21.25</p> + <p>240 鍗冨瓧</p> + <p>2025 骞� 3 鏈堢 2 鐗�</p> + <p>2025 骞� 3 鏈堢 1 娆″嵃鍒�</p> + <p>88.00 鍏�</p> + </div> + </div> + <p class="left center fz-16 mt-10"> + 锛堝浘涔﹀鏈夎璁㈠樊閿欒涓庡彂琛岄儴鑱旂郴锛� + </p> + </div> + <div class="copyrightPage-bottom"></div> + </div> + </div> + </div> +</template> + +<script> +export default { + name: "pageHeader", + props: { + showPageList: { + type: Array, + }, + }, + data() { + return {}; + }, +}; +</script> + +<style lang="less" scoped> +hr { + color: #000; + border: 0; + height: 2px; + background-color: #000; + font-weight: bold; + margin-bottom: 0; +} +.bold { + font-weight: bold; +} +</style> diff --git a/src/books/hotelEnglishTrainingBrochure2nd/view/components/index.vue b/src/books/hotelEnglishTrainingBrochure2nd/view/components/index.vue new file mode 100644 index 0000000..133db70 --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/view/components/index.vue @@ -0,0 +1,978 @@ +<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" + :interfaceQuestion="questionDataMap" + ></chapterOne> + <!-- <chapterTwo + v-if="showCatalogList.indexOf(2) > -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, 6); + }, 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.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, + // 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) { + // 鑾峰彇椤甸潰鎵�鏈塼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) { + 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 { + + + .page-content { + max-width: 816px; + min-width: 375px; + margin: 0 auto; + padding-bottom: 100px; + } +} +</style> diff --git a/src/books/hotelEnglishTrainingBrochure2nd/view/index.vue b/src/books/hotelEnglishTrainingBrochure2nd/view/index.vue new file mode 100644 index 0000000..d79accf --- /dev/null +++ b/src/books/hotelEnglishTrainingBrochure2nd/view/index.vue @@ -0,0 +1,80 @@ +<template> + <div class="hotelEnglishTrainingBrochure2nd" @mouseup="handleMouseUp"> + <pageContent></pageContent> + </div> + </template> + + <script> + import pageContent from "./components/index.vue"; + export default { + name: "hotelEnglishTrainingBrochure2nd", + 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> \ No newline at end of file diff --git a/src/books/preschoolEvaluation/assets/main.less b/src/books/preschoolEvaluation/assets/main.less index 0828a95..ec18872 100644 --- a/src/books/preschoolEvaluation/assets/main.less +++ b/src/books/preschoolEvaluation/assets/main.less @@ -681,7 +681,7 @@ .video-box { margin: 30px 0 20px 0; - border: 2px dashed #40C7F4; + border: 2px dashed #1c9e3a; padding: 3% 2% 2% 2%; position: relative; } @@ -702,6 +702,11 @@ .videoname { display: flex; justify-content: center; + align-items: center; + + span{ + margin-right: 20px; + } } .sInput { diff --git a/src/components/pdfview/index.vue b/src/components/pdfview/index.vue index 6a0d2f7..a712e0f 100644 --- a/src/components/pdfview/index.vue +++ b/src/components/pdfview/index.vue @@ -1,7 +1,15 @@ <!-- @format --> <template> - <el-dialog :visible.sync="localDialogVisible" @open="hadleOpenDialog" width="60vw" top="2vh" append-to-body - lock-scroll :show-close="false" class="custom-dialog"> + <el-dialog + :visible.sync="localDialogVisible" + @open="hadleOpenDialog" + width="60vw" + top="2vh" + append-to-body + lock-scroll + :show-close="false" + class="custom-dialog" + > <div slot="title" class="header_title"> <span>{{ pdfTitle }}</span> <span @click="closeDialog"> x </span> @@ -11,8 +19,7 @@ <div class="pdfBox-component"> <div class="preview" v-if="this.preViewMd5"> <div id="imageParent" class="imageBox"></div> - <div class="bottom_tool"> - </div> + <div class="bottom_tool"></div> </div> <div class="notBox" v-if="totalPage == 0 && !loading"> <el-empty description="鏆傛棤鏁版嵁"></el-empty> @@ -21,14 +28,13 @@ </div> </div> </el-dialog> - </template> <script> -import Viewer from 'viewerjs' -import 'viewerjs/dist/viewer.css' -import { getResourcePath } from '@/assets/methods/resources' +import Viewer from "viewerjs"; +import "viewerjs/dist/viewer.css"; +import { getResourcePath } from "@/assets/methods/resources"; export default { - name: 'pdf_view', + name: "pdf_view", props: { md5: { type: String, @@ -42,18 +48,18 @@ }, pdfTitle: { type: String, - } + }, }, data() { return { localDialogVisible: false, - currentPageSrc: '', + currentPageSrc: "", currentPage: 1, totalPage: 1, viewerCon: null, - preViewMd5: '', + preViewMd5: "", loading: false, - } + }; }, watch: { // md5: { @@ -85,126 +91,138 @@ }, methods: { hadleOpenDialog() { - this.preViewMd5 = this.md5 - this.currentPage = 1 - this.currentPageSrc = '' - this.totalPage = 1 - this.viewerCon?.destroy() + this.preViewMd5 = this.md5; + this.currentPage = 1; + this.currentPageSrc = ""; + this.totalPage = 1; + this.viewerCon?.destroy(); this.loading = true; this.clearDom(); this.getFileInfo(); this.$nextTick(() => { - this.scrollBottom() + this.scrollBottom(); }); }, closeDialog() { - this.localDialogVisible = false + this.localDialogVisible = false; }, openDialog() { - this.localDialogVisible = true + this.localDialogVisible = true; }, async downloadPdf() { - console.log(this.preViewMd5) - console.log(await getResourcePath(this.preViewMd5),"12345"); - - window.open(await getResourcePath(this.preViewMd5)) + console.log(await getResourcePath(this.preViewMd5), "12345"); + + window.open(await getResourcePath(this.preViewMd5)); }, domViewer() { // let ele = (this.container ? this.container : document).getElementById( // 'imageParent' // ) - let ele = document.getElementById('imageParent') + let ele = document.getElementById("imageParent"); if (ele) { this.viewerCon = new Viewer(ele, { inline: false, container: this.container - ? this.container.querySelector('#app') - : 'body', + ? this.container.querySelector("#app") + : "body", navbar: true, // 鏄剧ず瀵艰埅鏍� toolbar: true, // 鏄剧ず宸ュ叿鏍� title: true, // 鏄剧ず鏍囬 - }) - } - }, - clearDom() { - let ele = document.getElementById('imageParent') - if (ele) { - ele.innerHTML = '' - } - }, - createDom(page) { - var that = this - let ele = document.getElementById('imageParent') - const img = document.createElement('img') - img.src = this.getPageImage(page) - img.alt = '' - img.style.maxWidth = '90%' - img.style.padding = '30px 5%' - img.className = 'imgHover' - img.onclick = () => { - that.viewerCon?.destroy() - that.domViewer() - } - if (ele) { - ele.appendChild(img) - } - }, - scrollBottom() { - var that = this - var ele = document.getElementById('imageParent') - if (ele) { - ele.addEventListener('scroll', function () { - // 璁$畻婊氬姩鏉¤窛绂诲簳閮ㄧ殑浣嶇疆 - const scrollBottom = ele.scrollHeight - ele.scrollTop - ele.clientHeight - if (scrollBottom <= 10) { - that.currentPage++ - if (that.currentPage <= that.totalPage) { - that.createDom(that.currentPage, ele) - } - } }); } }, + clearDom() { + let ele = document.getElementById("imageParent"); + if (ele) { + ele.innerHTML = ""; + } + }, + createDom(page) { + var that = this; + let ele = document.getElementById("imageParent"); + const img = document.createElement("img"); + img.src = this.getPageImage(page); + // 鎵嬪姩瑙﹀彂婊氬姩浜嬩欢 + // ele.dispatchEvent(new Event("scroll")); + img.alt = ""; + img.style.maxWidth = "90%"; + img.style.padding = "30px 5%"; + img.className = "imgHover"; + img.onclick = () => { + that.viewerCon?.destroy(); + that.domViewer(); + }; + if (ele) { + ele.appendChild(img); + } + }, + + scrollBottom() { + const ele = document.getElementById("imageParent"); + if (ele) { + let lastScrollTop = 0; + ele.addEventListener("scroll", () => { + const scrollTop = ele.scrollTop; + const scrollBottom = ele.scrollHeight - scrollTop - ele.clientHeight; + if (scrollBottom < 10 && scrollTop > lastScrollTop) { + console.log( + "婊氬姩鍒板簳閮紝褰撳墠椤碉細", + this.currentPage, + "鎬婚〉鏁帮細", + this.totalPage + ); + if (this.currentPage < this.totalPage) { + this.currentPage++; + if (this.currentPage <= this.totalPage) { + this.createDom(this.currentPage, ele); + } + } + } + lastScrollTop = scrollTop; + }); + } + }, + getFileInfo() { // 鑾峰彇鐩綍 - this.loading = true + this.loading = true; this.MG.file .getPdfInfo({ md5: this.preViewMd5 }) .then((res) => { try { - if (typeof res === 'string' && res !== null) { - console.log(134) - this.totalPage = JSON.parse(res).totalPages - } else if (typeof res === 'object' && res !== null) { - console.log(res.totalPages) - this.totalPage = res.totalPages + if (typeof res === "string" && res !== null) { + this.totalPage = JSON.parse(res).totalPages; + } else if (typeof res === "object" && res !== null) { + this.totalPage = res.totalPages; } } catch (error) { - console.log(error, 'pdf杩斿洖鍊肩被鍨嬮敊璇�'); + console.log(error, "pdf杩斿洖鍊肩被鍨嬮敊璇�"); } - console.log(this.currentPage,"111") - this.createDom(this.currentPage) - this.loading = false + Math.min(3, res.totalPages); + for (let i = 0; i <= Math.min(3, res.totalPages); i++) { + this.createDom(i + 1); + } + this.loading = false; }) .catch((err) => { - this.totalPage = 0 - this.createDom(this.currentPage) - console.error(err) - this.loading = false - }) + this.totalPage = 0; + this.createDom(this.currentPage); + console.error(err); + this.loading = false; + }); }, getPageImage(page) { - const ctx = process.env.VUE_APP_API_URL + const ctx = process.env.VUE_APP_API_URL; return ( ctx + - '/file/GetPdfPageImage' + - '?md5=' + + "/file/GetPdfPageImage" + + "?md5=" + this.preViewMd5 + - '&index=' + + "&index=" + page + - '&dpi=200' - ) + "&dpi=200" + ); }, }, -} +}; </script> -- Gitblit v1.9.1