From c7b33fe92cf6d4449ca5919353c15611ae9ad410 Mon Sep 17 00:00:00 2001
From: user1 <10901603+no-distractions1@user.noreply.gitee.com>
Date: 星期五, 28 六月 2024 09:40:32 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout
---
src/books/childHealth/view/content/components/chapter003.vue | 9
.env.product | 4
src/books/English/view/components/chapter001.vue | 2849 ++++++++++++++++++++++++++++++++++++-------
src/books/artAndDance/view/components/chapter003.vue | 9
src/books/childHealth/view/content/components/chapter008.vue | 13
src/books/childHealth/view/content/components/chapter002.vue | 8
src/books/English/assets/main.less | 3
src/books/childHealth/view/content/index.vue | 34
src/books/artAndDance/assets/main.less | 7
src/books/mathBook/view/components/chapter001.vue | 8
src/books/childHealth/view/content/components/chapter010.vue | 7
src/books/English/view/components/chapter004.vue | 16
src/books/childHealth/view/content/components/chapter009.vue | 12
src/books/artAndDance/view/components/chapter004.vue | 9
src/books/artAndDance/view/components/index.vue | 54
src/books/childHealth/view/content/components/chapter005.vue | 7
src/components/examinations/index.vue | 10
src/books/English/view/components/index.vue | 181 +-
src/books/childHealth/view/content/components/chapter001.vue | 13
src/books/artAndDrama/view/components/index.vue | 6
src/books/artAndDance/view/components/chapter006.vue | 5
src/assets/images/rubber.png | 0
src/books/artAndDrama/view/components/chapter003.vue | 2
src/books/childHealth/view/content/components/chapter0004.vue | 9
src/books/artAndDance/view/components/chapter001.vue | 9
src/books/childHealth/view/content/components/chapter006.vue | 7
src/components/dragQuestion/index.vue | 276 ++-
src/books/artAndDance/view/components/chapter005.vue | 9
src/assets/methods/examination.js | 44
src/assets/images/brush.png | 0
/dev/null | 61
src/components/graffiti/components/toolBtns.vue | 57
src/books/childHealth/view/content/components/chapter007.vue | 18
src/books/artAndDance/view/components/chapter002.vue | 9
src/books/artAndDrama/view/components/chapter002.vue | 6
src/components/graffiti/index.vue | 131 +
src/books/artAndDrama/view/components/chapter001.vue | 4
src/components/graffiti/components/brushSize.vue | 20
src/assets/images/scrub.png | 0
src/assets/images/revoke.png | 0
src/assets/images/save.png | 0
41 files changed, 2,985 insertions(+), 941 deletions(-)
diff --git a/.env.product b/.env.product
index 307f663..3958a74 100644
--- a/.env.product
+++ b/.env.product
@@ -1,6 +1,6 @@
VUE_APP_ENV = 'product'
VUE_APP_API_URL = "https://jsek.bnuic.com"
VUE_APP_RESOURCE_CTX = 'https://jsek.bnuic.com/books/resource/'
-VUE_APP_PUBLIC_PATH = 'https://jsek.bnuic.com/books/book/artAndDrama'
+VUE_APP_PUBLIC_PATH = 'https://jsek.bnuic.com/books/book/english'
VUE_APP_BOOK_LIST = "childHealth/lifeCare/sportsAndHealth/embedded/english/artAndDance/artAndDrama/mathBook"
-VUE_APP_BOOK_ID = 'artAndDrama'
\ No newline at end of file
+VUE_APP_BOOK_ID = 'english'
\ No newline at end of file
diff --git a/src/assets/images/brush.png b/src/assets/images/brush.png
new file mode 100644
index 0000000..5f23599
--- /dev/null
+++ b/src/assets/images/brush.png
Binary files differ
diff --git a/src/assets/images/revoke.png b/src/assets/images/revoke.png
new file mode 100644
index 0000000..97c4e20
--- /dev/null
+++ b/src/assets/images/revoke.png
Binary files differ
diff --git a/src/assets/images/rubber.png b/src/assets/images/rubber.png
new file mode 100644
index 0000000..bf9955c
--- /dev/null
+++ b/src/assets/images/rubber.png
Binary files differ
diff --git a/src/assets/images/save.png b/src/assets/images/save.png
new file mode 100644
index 0000000..f7b2421
--- /dev/null
+++ b/src/assets/images/save.png
Binary files differ
diff --git a/src/assets/images/scrub.png b/src/assets/images/scrub.png
new file mode 100644
index 0000000..2ef004c
--- /dev/null
+++ b/src/assets/images/scrub.png
Binary files differ
diff --git a/src/assets/methods/examination.js b/src/assets/methods/examination.js
index 0da5175..e4c2cd1 100644
--- a/src/assets/methods/examination.js
+++ b/src/assets/methods/examination.js
@@ -1,7 +1,9 @@
import MG from "@/assets/js/middleGround/WebMiddleGroundApi";
import getPublicImage from "@/assets/js/middleGround/tool";
+// 鑾峰彇棰樼洰鍒楄〃
const getQuestionList = async (page, questionList, activeBook) => {
- console.log("page", page);
+const collectList = await getCollectList(activeBook)
+console.log('鏀惰棌鍒楄〃',collectList);
const oldAnswerData = localStorage.getItem(activeBook.name + "oldAnswerData");
let oldData = null;
let oldList = [];
@@ -97,7 +99,7 @@
isSubmit: false, // 鏌ョ湅瑙ｆ瀽
isRight: null, // 鏄惁姝ｇ‘
isComplete: false,
- isCollect: true,
+ isCollect: collectList.indexOf(qitem) > -1 ? true : false,
isUnfold: "",
};
// 澶氶�夊拰濉┖绛旀鑲负鏁扮粍锛岃杞崲JSON鏍煎紡
@@ -222,7 +224,43 @@
}
return cardList.filter((item) => item.infoList.length > 0);
};
-
+// 鑾峰彇鏀惰棌鍒楄〃
+const getCollectList = async(activeBook) => {
+ const allCollect = [
+ {
+ type:'bits',
+ collectList:[]
+ },
+ {
+ type:'json',
+ collectList:[]
+ },
+ ]
+ await MG.identity
+ .getUserKey({
+ domain: 'collectData',
+ keys: [activeBook.bookId]
+ })
+ .then((res) => {
+ try {
+ const collect = JSON.parse(res[0].value)
+ if (collect.length) {
+ allCollect[0].collectList = collect.find(
+ (citem) => citem.type == 'bits'
+ ).collectList
+ allCollect[1].collectList = collect.find(
+ (citem) => citem.type == 'json'
+ ).collectList
+ }
+ } catch (error) {
+ console.log('鏆傛棤鏁版嵁')
+ }
+ })
+ .catch(() => {
+ console.log('鑾峰彇鏀惰棌鎶ラ敊');
+ })
+ return allCollect.find(item => item.type == 'bits').collectList
+}
const getQuestionData = async (chapter, chapterData, activeBook) => {
const data = { ...chapterData };
const oldAnswerData = localStorage.getItem("oldAnswerData");
diff --git a/src/books/English/assets/main.less b/src/books/English/assets/main.less
index 9013460..3add23e 100644
--- a/src/books/English/assets/main.less
+++ b/src/books/English/assets/main.less
@@ -679,6 +679,9 @@
.fw-wr {
flex-wrap: wrap;
}
+ .ju-ar {
+ justify-content: space-around;
+ }
.ju-bt {
justify-content: space-between;
}
diff --git a/src/books/English/view/components/chapter001.vue b/src/books/English/view/components/chapter001.vue
index db5f535..00eb6ce 100644
--- a/src/books/English/view/components/chapter001.vue
+++ b/src/books/English/view/components/chapter001.vue
@@ -26,7 +26,10 @@
<div class="page-box" page="8">
<div v-if="showPageList.indexOf(8) > -1">
<div class="w100 mb-20" style="padding-right: 20px">
- <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
+ <div
+ class="event-header-bc fl al-end"
+ style="height: 100px; padding-left: 40px"
+ >
<div class="preface-header-box event-header-text-bc">
<span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
<span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -40,13 +43,22 @@
</h2>
<h3 id="c001"><span class="bjh3">Warm-up</span></h3>
<p>
- <b>鈪�.Write down the English words for the Chinese cultural symbols
- in the following pictures.</b>
+ <b
+ >鈪�.Write down the English words for the Chinese cultural symbols
+ in the following pictures.</b
+ >
<span class="btn-box" @click="showAnswerTwo = !showAnswerTwo">
- <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
- <path class="a"
+ <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)" />
+ transform="translate(-3327.144 15329)"
+ />
</svg>
</span>
</p>
@@ -58,57 +70,120 @@
<img src="../../assets/images/0012-1.jpg" class="w100" />
</p>
<p class="center">
- 1.<input v-model="questionData.warnUp.one.value" class="input-bottom-border fz-18"
- @blur="handleQuestion('one')" @change="setBookQuestion" />
+ 1.<input
+ v-model="questionData.warnUp.one.value"
+ class="input-bottom-border fz-18"
+ @blur="handleQuestion('one')"
+ @change="setBookQuestion"
+ />
<span class="icon-box">
- <svg v-if="questionData.warnUp.one.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">
+ <svg
+ v-if="questionData.warnUp.one.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="questionData.warnUp.one.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">
+ <svg
+ v-if="questionData.warnUp.one.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerTwo"
+ >
绛旀锛欳hinese knot
</p>
</div>
<div class="right" style="width: 48%">
<div>
<p class="center">
- <img src="../../assets/images/0012-2.jpg" style="width: 94%" />
+ <img
+ src="../../assets/images/0012-2.jpg"
+ style="width: 94%"
+ />
</p>
<p class="center">
- 2.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.two.value"
- @blur="handleQuestion('two')" @change="setBookQuestion" />
+ 2.<input
+ class="input-bottom-border fz-18"
+ v-model="questionData.warnUp.two.value"
+ @blur="handleQuestion('two')"
+ @change="setBookQuestion"
+ />
<span class="icon-box">
- <svg v-if="questionData.warnUp.two.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">
+ <svg
+ v-if="questionData.warnUp.two.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="questionData.warnUp.two.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">
+ <svg
+ v-if="questionData.warnUp.two.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerTwo"
+ >
绛旀锛欳hinese medicine
</p>
</div>
@@ -121,57 +196,120 @@
<img src="../../assets/images/0012-3.jpg" class="w100" />
</p>
<p class="center">
- 3.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.three.value"
- @blur="handleQuestion('three')" @change="setBookQuestion" />
+ 3.<input
+ class="input-bottom-border fz-18"
+ v-model="questionData.warnUp.three.value"
+ @blur="handleQuestion('three')"
+ @change="setBookQuestion"
+ />
<span class="icon-box">
- <svg v-if="questionData.warnUp.three.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">
+ <svg
+ v-if="questionData.warnUp.three.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="questionData.warnUp.three.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">
+ <svg
+ v-if="questionData.warnUp.three.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerTwo"
+ >
绛旀锛欳hinese calligraphy
</p>
</div>
<div class="right" style="width: 48%">
<div>
<p class="center">
- <img src="../../assets/images/0012-4.jpg" style="width: 93%" />
+ <img
+ src="../../assets/images/0012-4.jpg"
+ style="width: 93%"
+ />
</p>
<p class="center">
- 4.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.four.value"
- @blur="handleQuestion('four')" @change="setBookQuestion" />
+ 4.<input
+ class="input-bottom-border fz-18"
+ v-model="questionData.warnUp.four.value"
+ @blur="handleQuestion('four')"
+ @change="setBookQuestion"
+ />
<span class="icon-box">
- <svg v-if="questionData.warnUp.four.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">
+ <svg
+ v-if="questionData.warnUp.four.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="questionData.warnUp.four.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">
+ <svg
+ v-if="questionData.warnUp.four.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerTwo"
+ >
绛旀锛歍aichi
</p>
</div>
@@ -184,57 +322,120 @@
<img src="../../assets/images/0012-5.jpg" class="w100" />
</p>
<p class="center">
- 5.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.five.value"
- @blur="handleQuestion('five')" @change="setBookQuestion" />
+ 5.<input
+ class="input-bottom-border fz-18"
+ v-model="questionData.warnUp.five.value"
+ @blur="handleQuestion('five')"
+ @change="setBookQuestion"
+ />
<span class="icon-box">
- <svg v-if="questionData.warnUp.five.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">
+ <svg
+ v-if="questionData.warnUp.five.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="questionData.warnUp.five.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">
+ <svg
+ v-if="questionData.warnUp.five.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerTwo"
+ >
绛旀锛歴weet dumpling
</p>
</div>
<div class="right" style="width: 48%">
<div>
<p class="center">
- <img src="../../assets/images/0012-6.jpg" style="width: 92%" />
+ <img
+ src="../../assets/images/0012-6.jpg"
+ style="width: 92%"
+ />
</p>
<p class="center">
- 6.<input class="input-bottom-border fz-18" v-model="questionData.warnUp.six.value"
- @blur="handleQuestion('six')" @change="setBookQuestion" />
+ 6.<input
+ class="input-bottom-border fz-18"
+ v-model="questionData.warnUp.six.value"
+ @blur="handleQuestion('six')"
+ @change="setBookQuestion"
+ />
<span class="icon-box">
- <svg v-if="questionData.warnUp.six.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">
+ <svg
+ v-if="questionData.warnUp.six.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="questionData.warnUp.six.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">
+ <svg
+ v-if="questionData.warnUp.six.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerTwo">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerTwo"
+ >
绛旀锛欳hinese chess
</p>
</div>
@@ -249,17 +450,32 @@
鏄剧ず绛旀
</button> -->
<span class="btn-box" @click="showAnswerOne = !showAnswerOne">
- <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
- <path class="a"
+ <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)" />
+ transform="translate(-3327.144 15329)"
+ />
</svg>
</span>
</p>
<p class="t0">
- <input v-model="questionData.warnUp.seven" class="input-bottom-border fz-18" style="width: 100%" />
+ <input
+ v-model="questionData.warnUp.seven"
+ class="input-bottom-border fz-18"
+ style="width: 100%"
+ />
</p>
- <p class="event-header-text-bc pd-5" style="width: 100%" v-if="showAnswerOne">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 100%"
+ v-if="showAnswerOne"
+ >
绛旀锛�1. Hanfu 2. Qipao 3. Tang Suit 4. Chinese tea 5. Chinese
silk 6. Chinese calligraphy & painting 7. Chinese embroidery 8.
Chinese papercut 9. Chinese lantern 10. Moon cake 11. Memorial
@@ -280,20 +496,30 @@
<li class=""></li>
<li class="fz-18">
<span class="chapter-left-bc">MODULE 1</span>
- <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
+ <span class="chapter-right-bc fw-bl chapter-right-cl"
+ >CHINA,A WONDERLAND</span
+ >
</li>
- </ul>a
+ </ul>
+ a
<div class="padding-102">
<div class="bodystyle">
<h3 id="c002" class="fl al-cn">
<span class="bjh3">Listening</span>
<!--controlslist="noplaybackrate nodownload"鍚庨潰鐨勯煶棰戞鍔犲叆杩欎釜-->
- <audio :src="resource.listenOne" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
+ <audio
+ :src="resource.listenOne"
+ controls
+ controlslist="noplaybackrate nodownload"
+ class="audio"
+ ></audio>
</h3>
<p>
- <b>Four foreigners are talking about their impressions on Chinese
+ <b
+ >Four foreigners are talking about their impressions on Chinese
culture.Listen to the recording and match the items with the
- corresponding descriptions.</b>
+ corresponding descriptions.</b
+ >
</p>
<!-- <p class="center">
<img class="img-0" alt="" src="../../assets/images/0013-3.jpg" />
@@ -318,16 +544,33 @@
鏄剧ず绛旀
</button> -->
<span class="btn-box" @click="showAnswerThree = !showAnswerThree">
- <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
- <path class="a"
+ <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)" />
+ transform="translate(-3327.144 15329)"
+ />
</svg>
</span>
</p>
- <textarea v-model="questionData.reading.one" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
- style="margin-left: 40px; width: 92%" class="fz-16 fm-son" @change="setBookQuestion"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%" v-if="showAnswerThree">
+ <textarea
+ v-model="questionData.reading.one"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="6"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 fm-son"
+ @change="setBookQuestion"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 91%"
+ v-if="showAnswerThree"
+ >
绛旀锛歍he Silk Road Immigrants Sinologist
</p>
<p>
@@ -340,16 +583,33 @@
鏄剧ず绛旀
</button> -->
<span class="btn-box" @click="showAnswerFour = !showAnswerFour">
- <svg xmlns="http://www.w3.org/2000/svg" width="20.501" height="20.501" viewBox="0 0 20.501 20.501">
- <path class="a"
+ <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)" />
+ transform="translate(-3327.144 15329)"
+ />
</svg>
</span>
</p>
- <textarea v-model="questionData.reading.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
- style="margin-left: 40px; width: 92%" class="fz-16 fm-son" @change="setBookQuestion"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 91%" v-if="showAnswerFour">
+ <textarea
+ v-model="questionData.reading.two"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="6"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 fm-son"
+ @change="setBookQuestion"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 91%"
+ v-if="showAnswerFour"
+ >
绛旀锛�(1)Various delicious food (2)Unique architectures
(3)Beautiful (4)Intangible cultural heritage, such as Taichi,
shadow puppet show, traditional Chinese medicine, Peking Opera
@@ -357,8 +617,12 @@
</p>
<p class="center"><b>My Experience in Wonderland</b></p>
<p class="center">
- <audio :src="resource.readingOne" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
-
+ <audio
+ :src="resource.readingOne"
+ controls
+ controlslist="noplaybackrate nodownload"
+ class="audio"
+ ></audio>
</p>
<p class="block">
鈥淪o how was your journey to China?鈥� asks Alexandra.鈥淗ighly
@@ -369,29 +633,41 @@
</p>
<p>
My
- <span class="word-bc" @click="saveWord($event, 'incredible')">incredible</span>
+ <span class="word-bc" @click="saveWord($event, 'incredible')"
+ >incredible</span
+ >
journey to China started in 2017 when I got selected as a foreign
student for PhD studies at one university.When I arrived in
China,I was like Alice in Alice in Wonderland.I was curious about
the people,the culture,the
- <span class="word-bc" @click="saveWord($event, 'cuisine')">cuisine</span>
+ <span class="word-bc" @click="saveWord($event, 'cuisine')"
+ >cuisine</span
+ >
and of course the huge variety of
- <span class="word-bc" @click="saveWord($event, 'landscapes')">landscapes</span>.
+ <span class="word-bc" @click="saveWord($event, 'landscapes')"
+ >landscapes</span
+ >.
</p>
<p>
I found many great people and made several Chinese friends along
the way.These friends made me see China through the eyes of the
locals.I always found Chinese people very friendly and
- <span class="word-bc" @click="saveWord($event, 'hospitable')">hospitable</span>
+ <span class="word-bc" @click="saveWord($event, 'hospitable')"
+ >hospitable</span
+ >
towards foreigners.These Chinese friends made my understanding of
Chinese culture and
- <span class="word-bc" @click="saveWord($event, 'civilization')">civilization</span>
+ <span class="word-bc" @click="saveWord($event, 'civilization')"
+ >civilization</span
+ >
much easier,enjoyable and memorable.I consider China my second
home and love it like my own country!
</p>
<p>
You cannot
- <span class="word-bc" @click="saveWord($event, 'explore')">explore</span>
+ <span class="word-bc" @click="saveWord($event, 'explore')"
+ >explore</span
+ >
China properly if you do not try its delicious variety of food.If
you ate
</p>
@@ -406,7 +682,10 @@
<div class="page-box" page="10">
<div v-if="showPageList.indexOf(10) > -1">
<div class="w100 mb-20" style="padding-right: 20px">
- <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
+ <div
+ class="event-header-bc fl al-end"
+ style="height: 100px; padding-left: 40px"
+ >
<div class="preface-header-box event-header-text-bc">
<span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
<span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -420,10 +699,16 @@
Chinese food would still never end! Though I love to eat almost
all kinds of Chinese cuisine,I found Sichuan and Hunan cuisine
quite
- <span class="word-bc" @click="saveWord($event, 'mouth-watering')">mouth-watering</span>
+ <span class="word-bc" @click="saveWord($event, 'mouth-watering')"
+ >mouth-watering</span
+ >
and
- <span class="word-bc" @click="saveWord($event, 'stimulating')">stimulating</span>.For a
- <span class="word-bc" @click="saveWord($event, 'foodie')">foodie</span>
+ <span class="word-bc" @click="saveWord($event, 'stimulating')"
+ >stimulating</span
+ >.For a
+ <span class="word-bc" @click="saveWord($event, 'foodie')"
+ >foodie</span
+ >
like me,China is a heaven.I simply cannot live without Chinese
food.
</p>
@@ -433,8 +718,15 @@
its own story and history.From the big and advanced cities like
Shanghai or Guangzhou to the ancient cities like Xi鈥檃n and
Hangzhou,each city has its
- <span class="word-bc" @click="saveWord($event, 'unique')">unique</span>
- <span class="word-bc" style="margin-left: 5px" @click="saveWord($event, 'atmosphere')">atmosphere</span>
+ <span class="word-bc" @click="saveWord($event, 'unique')"
+ >unique</span
+ >
+ <span
+ class="word-bc"
+ style="margin-left: 5px"
+ @click="saveWord($event, 'atmosphere')"
+ >atmosphere</span
+ >
that attracts you.I visited more than a dozen cities and came
across their charming features and unique landscapes such as
Huangshan,the Great Wall,Canton Tower.
@@ -448,11 +740,18 @@
<img class="img-g" alt="" src="../../assets/images/0014-1.jpg" />
</p> -->
<p class="fl al-cn mt-40">
- <span class="zt-cs" style="font-size: 20px">Words & Expressions</span>
+ <span class="zt-cs" style="font-size: 20px"
+ >Words & Expressions</span
+ >
<span class="line-border-box"></span>
</p>
- <audio :src="resource.readingTwo" controls controlslist="noplaybackrate nodownload" style="margin-left: 10px" class="audio"
- @play="audioPlay"></audio>
+ <audio
+ :src="resource.readingTwo"
+ controls
+ controlslist="noplaybackrate nodownload"
+ style="margin-left: 10px"
+ class="audio"
+ ></audio>
<p>wonderland /藞w蕦nd蓹l忙nd/ <i>n.</i> 鏈夎澶氬濡欎簨鐗╃殑鍦版柟</p>
<div class="bkbj">
<p><i>land or place full of marvels or wonderful things</i></p>
@@ -466,7 +765,9 @@
</p>
<div class="bkbj">
<p>
- <i>the food served in a restaurant (usually an expensive one)</i>
+ <i
+ >the food served in a restaurant (usually an expensive one)</i
+ >
</p>
</div>
<p>landscape /藞l忙ndske瑟p/ <i>n.</i> 锛堥檰涓婏級 椋庢櫙锛屾櫙鑹�</p>
@@ -483,16 +784,20 @@
</p>
<div class="bkbj">
<p>
- <i>a society,its culture and its way of life (during a
+ <i
+ >a society,its culture and its way of life (during a
particular period of time or in a particular part of the
- world)</i>
+ world)</i
+ >
</p>
</div>
<p>explore /瑟k藞spl蓴藧(r)/ <i>v.</i> 鎺㈢储锛涜�冨療</p>
<div class="bkbj">
<p>
- <i>to travel into or around an area or a country in order to
- learn about it</i>
+ <i
+ >to travel into or around an area or a country in order to
+ learn about it</i
+ >
</p>
</div>
<p>mouth-watering <i>adj.</i> 浠や汉鍨傛稁鐨勶紱缇庡懗鐨�</p>
@@ -513,7 +818,9 @@
<li class=""></li>
<li class="fz-18">
<span class="chapter-left-bc">MODULE 1</span>
- <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
+ <span class="chapter-right-bc fw-bl chapter-right-cl"
+ >CHINA,A WONDERLAND</span
+ >
</li>
</ul>
<div class="padding-93">
@@ -529,8 +836,10 @@
<p>foodie /藞fu藧di/<i>n.</i> 鍚冭揣锛涚編椋熷</p>
<div class="bkbj">
<p>
- <i>a person who is very interested in cooking and eating
- different kinds of food</i>
+ <i
+ >a person who is very interested in cooking and eating
+ different kinds of food</i
+ >
</p>
</div>
<p>unique /ju<i>藞</i>ni藧k/ <i>adj.</i> 鍞竴鐨勶紱鐙竴鏃犱簩鐨�</p>
@@ -540,8 +849,10 @@
<p>atmosphere /藞忙tm蓹sf瑟蓹(r)/ <i>n.</i> 姘旀皼锛涙皼鍥�</p>
<div class="bkbj">
<p>
- <i>the feeling or mood that you have in a particular place or
- situation</i>
+ <i
+ >the feeling or mood that you have in a particular place or
+ situation</i
+ >
</p>
</div>
<ul class="w100 fl fw-wr">
@@ -559,17 +870,37 @@
<div class="bj-note">
<p class="m0"><b class="fz-18">Notes:</b></p>
<p class="m0">
- <i>Alice in Wonderland</i> 锛�<i>Alice's Adventures in
- Wonderland</i>鐨勭畝鍐欙紝涓枃璇戜负銆婄埍涓戒笣姊︽父浠欏銆嬶級锛屾槸19涓栫邯鑻卞浗浣滃鍒樻槗鏂峰崱缃楀皵鍒涗綔鐨勮憲鍚嶅効绔ユ枃瀛︿綔鍝侊紝璁茶堪浜嗕竴涓悕鍙埍涓戒笣鐨勮嫳鍥藉皬濂冲涓轰簡杩介�愪竴鍙彛鐫�鎬�琛ㄣ�佷細璇磋瘽鐨勫厰瀛愯�屼笉鎱庢帀鍏ヤ簡鍏斿瓙娲烇紝浠庤�岃繘鍏ヤ簡涓�涓濂囩殑鍥藉害骞剁粡鍘嗕簡涓�绯诲垪濂囧够鍐掗櫓鐨勬晠浜嬨��
+ <i>Alice in Wonderland</i> 锛�<i
+ >Alice's Adventures in Wonderland</i
+ >鐨勭畝鍐欙紝涓枃璇戜负銆婄埍涓戒笣姊︽父浠欏銆嬶級锛屾槸19涓栫邯鑻卞浗浣滃鍒樻槗鏂峰崱缃楀皵鍒涗綔鐨勮憲鍚嶅効绔ユ枃瀛︿綔鍝侊紝璁茶堪浜嗕竴涓悕鍙埍涓戒笣鐨勮嫳鍥藉皬濂冲涓轰簡杩介�愪竴鍙彛鐫�鎬�琛ㄣ�佷細璇磋瘽鐨勫厰瀛愯�屼笉鎱庢帀鍏ヤ簡鍏斿瓙娲烇紝浠庤�岃繘鍏ヤ簡涓�涓濂囩殑鍥藉害骞剁粡鍘嗕簡涓�绯诲垪濂囧够鍐掗櫓鐨勬晠浜嬨��
</p>
</div>
<p><b>鈪�.Reading comprehension.</b></p>
<p>
A.Mark the items that made the author curious when she arrived in
China.
+ </p>
+ <p>
+ <input
+ type="checkbox"
+ name="ball1"
+ :disabled="testData.isComplete"
+ value="Language"
+ id="1"
+ v-model="testData.check.value"
+ @change="setTestData"
+ />
+ Language
<span>
<svg
- v-if="testData.check.isRight"
+ v-if="
+ testData.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Language'
+ )
+ "
t="1716986419862"
class="icon"
viewBox="0 0 1820 1024"
@@ -587,7 +918,14 @@
></path>
</svg>
<svg
- v-if="testData.check.isRight == false"
+ v-if="
+ testData.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Language'
+ ) == false
+ "
t="1716987085767"
class="icon"
viewBox="0 0 1024 1024"
@@ -607,34 +945,394 @@
</span>
</p>
<p>
- <input type="checkbox" name="ball1" value="Language" id="1" v-model="testData.check.value" @change="setTestData" />
- Language
- </p>
- <p>
- <input type="checkbox" name="ball2" value="People" id="2" v-model="testData.check.value" @change="setTestData" />
+ <input
+ type="checkbox"
+ name="ball2"
+ :disabled="testData.isComplete"
+ value="People"
+ id="2"
+ v-model="testData.check.value"
+ @change="setTestData"
+ />
People
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'People'
+ )
+ "
+ 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.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'People'
+ ) == 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>
- <input type="checkbox" name="ball3" value="Culture" id="3" v-model="testData.check.value" @change="setTestData" />
+ <input
+ type="checkbox"
+ name="ball3"
+ :disabled="testData.isComplete"
+ value="Culture"
+ id="3"
+ v-model="testData.check.value"
+ @change="setTestData"
+ />
Culture
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Culture'
+ )
+ "
+ 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.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Culture'
+ ) == 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>
- <input type="checkbox" name="ball4" value="Cuisine" id="4" v-model="testData.check.value" @change="setTestData" />
+ <input
+ type="checkbox"
+ name="ball4"
+ :disabled="testData.isComplete"
+ value="Cuisine"
+ id="4"
+ v-model="testData.check.value"
+ @change="setTestData"
+ />
Cuisine
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Cuisine'
+ )
+ "
+ 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.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Cuisine'
+ ) == 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>
- <input type="checkbox" name="ball5" value="Folk" id="5" v-model="testData.check.value" @change="setTestData" />
+ <input
+ type="checkbox"
+ name="ball5"
+ :disabled="testData.isComplete"
+ value="Folk art"
+ id="5"
+ v-model="testData.check.value"
+ @change="setTestData"
+ />
Folk art
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Folk art'
+ )
+ "
+ 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.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Folk art'
+ ) == 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>
- <input type="checkbox" name="ball6" value="Landscapes" id="6" v-model="testData.check.value" @change="setTestData" />
+ <input
+ type="checkbox"
+ name="ball6"
+ :disabled="testData.isComplete"
+ value="Landscapes"
+ id="6"
+ v-model="testData.check.value"
+ @change="setTestData"
+ />
Landscapes
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Landscapes'
+ )
+ "
+ 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.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Landscapes'
+ ) == 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>
- <input type="checkbox" name="ball7" value="Transportation" id="7" v-model="testData.check.value" @change="setTestData" />
+ <input
+ type="checkbox"
+ name="ball7"
+ :disabled="testData.isComplete"
+ value="Transportation"
+ id="7"
+ v-model="testData.check.value"
+ @change="setTestData"
+ />
Transportation
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Transportation'
+ )
+ "
+ 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.isComplete &&
+ isShowRight(
+ testData.check.answer,
+ testData.check.value,
+ 'Transportation'
+ ) == 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" style="margin-left: 35px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 35px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛欳ulture,Cuisine,Landscapes
</p>
</div>
@@ -648,7 +1346,10 @@
<div class="page-box" page="12">
<div v-if="showPageList.indexOf(12) > -1">
<div class="w100 mb-20" style="padding-right: 20px">
- <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
+ <div
+ class="event-header-bc fl al-end"
+ style="height: 100px; padding-left: 40px"
+ >
<div class="preface-header-box event-header-text-bc">
<span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
<span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -661,37 +1362,92 @@
B.Write down the answer to each question according to the passage.
</p>
<p>1.What鈥檙e the author鈥檚 comments about Chinese food?</p>
- <textarea v-model="testData.tx.one" placeholder="璇疯緭鍏ュ唴瀹�" rows="4" style="margin-left: 40px; width: 92%"
- class="fz-16 textarea-text" @change="setTestData"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <textarea
+ :disabled="testData.isComplete"
+ v-model="testData.tx.one"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="4"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 textarea-text"
+ @change="setTestData"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛欳hinese food is very delicious. Sichuan and Hunan cuisines
are quite mouth-watering and stimulating.
</p>
<p>2.When and why did the author start her journey to China?</p>
- <textarea v-model="testData.tx.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="4" style="margin-left: 40px; width: 92%"
- class="fz-16 textarea-text" @change="setTestData"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <textarea
+ :disabled="testData.isComplete"
+ v-model="testData.tx.two"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="4"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 textarea-text"
+ @change="setTestData"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛歐hen the author got selected as a foreign student for PhD
studies at one university in 2017, she started her journey to
China.
</p>
<p>3.What are the author鈥檚 expectations of her stay in China?</p>
- <textarea v-model="testData.tx.three" placeholder="璇疯緭鍏ュ唴瀹�" rows="4" style="margin-left: 40px; width: 92%"
- class="fz-16 textarea-text" @change="setTestData"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <textarea
+ :disabled="testData.isComplete"
+ v-model="testData.tx.three"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="4"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 textarea-text"
+ @change="setTestData"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛歍he author looks forward to exploring more during her stay.
</p>
<p>4.What did the author think of Chinese people?</p>
- <textarea v-model="testData.tx.four" placeholder="璇疯緭鍏ュ唴瀹�" rows="4" style="margin-left: 40px; width: 92%"
- class="fz-16 textarea-text" @change="setTestData"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <textarea
+ :disabled="testData.isComplete"
+ v-model="testData.tx.four"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="4"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 textarea-text"
+ @change="setTestData"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛歍he author thought the local Chinese were very friendly and
hospitable.
</p>
<p>5.What鈥檚 the author鈥檚 impression of the cities in China?</p>
- <textarea v-model="testData.tx.five" placeholder="璇疯緭鍏ュ唴瀹�" rows="4" style="margin-left: 40px; width: 92%"
- class="fz-16 textarea-text" @change="setTestData"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <textarea
+ :disabled="testData.isComplete"
+ v-model="testData.tx.five"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="4"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 textarea-text"
+ @change="setTestData"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛欵ach city has its unique atmosphere with charming features
and unique landscapes.
</p>
@@ -701,9 +1457,24 @@
<p>
A.Fill in the blanks with the proper words in the passage.The
initial letters of the words have been given.
+ </p>
+ <p>
+ In 2017,the author arrived in China.When she arrived,she was like
+ Alice in <i>Alice in Wonderland</i>.She was curious about the
+ people,the culture,the c<input
+ :disabled="testData.isComplete"
+ type="text"
+ class="input-bottom-border"
+ style="width: 60px"
+ v-model="testData.in.one"
+ @change="setTestData"
+ />
<span>
<svg
- v-if="testData.in.isRight"
+ v-if="
+ testData.isComplete &&
+ isTextRight(testData.in.answer, testData.in.one)
+ "
t="1716986419862"
class="icon"
viewBox="0 0 1820 1024"
@@ -721,7 +1492,10 @@
></path>
</svg>
<svg
- v-if="testData.in.isRight == false"
+ v-if="
+ testData.isComplete &&
+ isTextRight(testData.in.answer, testData.in.one) == false
+ "
t="1716987085767"
class="icon"
viewBox="0 0 1024 1024"
@@ -739,72 +1513,318 @@
></path>
</svg>
</span>
- </p>
- <p>
- In 2017,the author arrived in China.When she arrived,she was like
- Alice in <i>Alice in Wonderland</i>.She was curious about the
- people,the culture,the c<input type="text" class="input-bottom-border" style="width: 60px"
- v-model="testData.in.one" @change="setTestData" />
- ,and of course the huge variety of l<input v-model="testData.in.two" type="text"
- class="input-bottom-border" style="width: 60px" @change="setTestData" />.Chinese friends helped her a lot in understanding
- Chinese
- culture and c<input v-model="testData.in.three" type="text" class="input-bottom-border"
- style="width: 60px" @change="setTestData" />.The author believes that one cannot e<input type="text"
- v-model="testData.in.four" class="input-bottom-border" style="width: 60px" @change="setTestData" />China properly if he/she
- does not try its delicious variety of
+ ,and of course the huge variety of l
+ <input
+ :disabled="testData.isComplete"
+ v-model="testData.in.two"
+ type="text"
+ class="input-bottom-border"
+ style="width: 60px"
+ @change="setTestData"
+ />
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isTextRight(testData.in.answer, testData.in.two)
+ "
+ 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.isComplete &&
+ isTextRight(testData.in.answer, testData.in.two) == 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>
+ .Chinese friends helped her a lot in understanding Chinese culture
+ and c<input
+ :disabled="testData.isComplete"
+ v-model="testData.in.three"
+ type="text"
+ class="input-bottom-border"
+ style="width: 60px"
+ @change="setTestData"
+ />
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isTextRight(testData.in.answer, testData.in.three)
+ "
+ 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.isComplete &&
+ isTextRight(testData.in.answer, testData.in.three) == 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>
+ .The author believes that one cannot e<input
+ :disabled="testData.isComplete"
+ type="text"
+ v-model="testData.in.four"
+ class="input-bottom-border"
+ style="width: 60px"
+ @change="setTestData"
+ />
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isTextRight(testData.in.answer, testData.in.four)
+ "
+ 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.isComplete &&
+ isTextRight(testData.in.answer, testData.in.four) == 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>
+ China properly if he/she does not try its delicious variety of
food.China has thousands of years of rich and beautiful
- culture.Each city has its u<input v-model="testData.in.five" type="text" class="input-bottom-border"
- style="width: 60px" @change="setTestData" />atmosphere that attracts people.
+ culture.Each city has its u<input
+ :disabled="testData.isComplete"
+ v-model="testData.in.five"
+ type="text"
+ class="input-bottom-border"
+ style="width: 60px"
+ @change="setTestData"
+ />
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isTextRight(testData.in.answer, testData.in.five)
+ "
+ 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.isComplete &&
+ isTextRight(testData.in.answer, testData.in.five) == 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>
+ atmosphere that attracts people.
</p>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛歝uisine, landscapes, civilization, explore, unique
</p>
<p>
B.Underline the following expressions in the passage and make
sentences with them.
</p>
- <p>
- 1.get selected as
- </p>
- <textarea v-model="testData.line.one" placeholder="璇疯緭鍏ュ唴瀹�" rows="4" style="margin-left: 40px; width: 92%"
- class="fz-16 textarea-text" @change="setTestData"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p>1.get selected as</p>
+ <textarea
+ :disabled="testData.isComplete"
+ v-model="testData.line.one"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="4"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 textarea-text"
+ @change="setTestData"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛歋he got selected as the cultural ambassador to show Chinese
culture on campus.
</p>
- <p>
- 2.be curious about
- </p>
- <textarea v-model="testData.line.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="4" style="margin-left: 40px; width: 92%"
- class="fz-16 textarea-text" @change="setTestData"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p>2.be curious about</p>
+ <textarea
+ :disabled="testData.isComplete"
+ v-model="testData.line.two"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="4"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 textarea-text"
+ @change="setTestData"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛歁any foreigners are curious about the amazing Chinese
martial arts.
</p>
- <p>
- 3.along the way
- </p>
- <textarea v-model="testData.line.three" placeholder="璇疯緭鍏ュ唴瀹�" rows="4" style="margin-left: 40px; width: 92%"
- class="fz-16 textarea-text" @change="setTestData"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p>3.along the way</p>
+ <textarea
+ :disabled="testData.isComplete"
+ v-model="testData.line.three"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="4"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 textarea-text"
+ @change="setTestData"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛欼 suggest that you go to Tibet by train so that you can
enjoy the natural scenery along the way.
</p>
- <p>
- 4.come across
- </p>
- <textarea v-model="testData.line.four" placeholder="璇疯緭鍏ュ唴瀹�" rows="4" style="margin-left: 40px; width: 92%"
- class="fz-16 textarea-text" @change="setTestData"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p>4.come across</p>
+ <textarea
+ :disabled="testData.isComplete"
+ v-model="testData.line.four"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="4"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 textarea-text"
+ @change="setTestData"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛欻e came across the temple fair in Beijing during the Spring
Festival.
</p>
- <p>
- 5.look forward to
- </p>
- <textarea v-model="testData.line.five" placeholder="璇疯緭鍏ュ唴瀹�" rows="4" style="margin-left: 40px; width: 92%"
- class="fz-16 textarea-text" @change="setTestData"></textarea>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p>5.look forward to</p>
+ <textarea
+ :disabled="testData.isComplete"
+ v-model="testData.line.five"
+ placeholder="璇疯緭鍏ュ唴瀹�"
+ rows="4"
+ style="margin-left: 40px; width: 92%"
+ class="fz-16 textarea-text"
+ @change="setTestData"
+ ></textarea>
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛歋he is looking forward to visiting the incredible cities in
China.
</p>
@@ -822,7 +1842,9 @@
<li class=""></li>
<li class="fz-18">
<span class="chapter-left-bc">MODULE 1</span>
- <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
+ <span class="chapter-right-bc fw-bl chapter-right-cl"
+ >CHINA,A WONDERLAND</span
+ >
</li>
</ul>
<div class="padding-93">
@@ -833,9 +1855,19 @@
people.
</p>
<p>
- <input v-model="testData.ts.one" type="text" class="input-bottom-border" @change="setTestData" />
+ <input
+ :disabled="testData.isComplete"
+ v-model="testData.ts.one"
+ type="text"
+ class="input-bottom-border"
+ @change="setTestData"
+ />
</p>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛氬瓟瀛愬紑鍒涗簡骞虫皯鍖栫殑鏁欒偛銆�
</p>
<p>
@@ -843,9 +1875,19 @@
greatly promoted the development of ancient Chinese civilization.
</p>
<p>
- <input v-model="testData.ts.two" type="text" class="input-bottom-border" @change="setTestData" />
+ <input
+ :disabled="testData.isComplete"
+ v-model="testData.ts.two"
+ type="text"
+ class="input-bottom-border"
+ @change="setTestData"
+ />
</p>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛氬珮绁栧彂鏄庝簡涓浗缂笣鎶�鏈紝杩欐瀬澶у湴淇冭繘浜嗕腑鍥藉彜浠ｆ枃鏄庣殑鍙戝睍銆�
</p>
<p>
@@ -853,9 +1895,19 @@
tea culture in depth.
</p>
<p>
- <input v-model="testData.ts.three" type="text" class="input-bottom-border" @change="setTestData" />
+ <input
+ :disabled="testData.isComplete"
+ v-model="testData.ts.three"
+ type="text"
+ class="input-bottom-border"
+ @change="setTestData"
+ />
</p>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛氶檰缇斤紝銆婅尪缁忋�嬬殑浣滆�咃紝瀵逛腑鍥借尪閬撹繘琛屼簡娣卞叆鐨勭爺绌躲��
</p>
<p>
@@ -863,33 +1915,67 @@
Chinese medical science.
</p>
<p>
- <input v-model="testData.ts.four" type="text" class="input-bottom-border" @change="setTestData" />
+ <input
+ :disabled="testData.isComplete"
+ v-model="testData.ts.four"
+ type="text"
+ class="input-bottom-border"
+ @change="setTestData"
+ />
</p>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛氬紶浠叉櫙鏄竴浣嶅涓浗鍖诲鏈夌潃閲嶅ぇ褰卞搷鐨勫尰瀛﹀銆�
</p>
<p>
<b>鈪�.Grammar focus:The conditional sentence鈥攊f-clause.</b>
<span class="btn-box" @click="showAnswer('showImg')">
- <svg t="1717037443722" class="icon" viewBox="0 0 1024 1024" version="1.1"
- xmlns="http://www.w3.org/2000/svg" p-id="30864" xmlns:xlink="http://www.w3.org/1999/xlink" width="20"
- height="20">
+ <svg
+ t="1717037443722"
+ class="icon"
+ viewBox="0 0 1024 1024"
+ version="1.1"
+ xmlns="http://www.w3.org/2000/svg"
+ p-id="30864"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ width="20"
+ height="20"
+ >
<path
d="M387.2 471.152l-154.768 258.72v103.488h515.792V626.384l-149.12 103.488z m283.712-51.744a77.632 77.632 0 1 0 77.392 77.616 77.504 77.504 0 0 0-77.472-77.616zM640 0H160.72A96.736 96.736 0 0 0 64 96.72V927.36a96.736 96.736 0 0 0 96.72 96.64h702.56A96.704 96.704 0 0 0 960 927.36V298.016z m7.808 94.736l226.544 211.008h-146.544a80.08 80.08 0 0 1-80-80zM896 927.36a32.688 32.688 0 0 1-32.72 32.64h-702.56A32.704 32.704 0 0 1 128 927.36V96.72A32.752 32.752 0 0 1 160.72 64l423.088 0.384v161.44a144.176 144.176 0 0 0 144 143.92H896z"
- p-id="30865"></path>
+ p-id="30865"
+ ></path>
</svg>
</span>
</p>
- <el-image v-if="showImg" :src="imgThirteen" :preview-src-list="[imgThirteen]" />
+ <el-image
+ v-if="showImg"
+ :src="imgThirteen"
+ :preview-src-list="[imgThirteen]"
+ />
<p>A.Combine the following sentences into if-clauses.</p>
<p>
1.Try using sticks.You can enjoy the fun of having a real Chinese
meal.
</p>
<p>
- <b>If</b><input v-model="testData.gr.one" type="text" class="input-bottom-border" @change="setTestData" />.
+ <b>If</b
+ ><input
+ :disabled="testData.isComplete"
+ v-model="testData.gr.one"
+ type="text"
+ class="input-bottom-border"
+ @change="setTestData"
+ />.
</p>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛欼f you try using sticks, you can enjoy the fun of having a
real Chinese meal.
</p>
@@ -898,17 +1984,39 @@
there.
</p>
<p>
- <b>If</b><input v-model="testData.gr.two" type="text" class="input-bottom-border" @change="setTestData" />.
+ <b>If</b
+ ><input
+ :disabled="testData.isComplete"
+ v-model="testData.gr.two"
+ type="text"
+ class="input-bottom-border"
+ @change="setTestData"
+ />.
</p>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛欼f you go to my Chinese New Year party, you will meet my
Chinese friends there.
</p>
<p>3.Drink some Longjing tea,and you will love it.</p>
<p>
- <b>If</b><input type="text" v-model="testData.gr.three" class="input-bottom-border" @change="setTestData" />.
+ <b>If</b
+ ><input
+ :disabled="testData.isComplete"
+ type="text"
+ v-model="testData.gr.three"
+ class="input-bottom-border"
+ @change="setTestData"
+ />.
</p>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛欼f you drink some Longjing tea, you will love it.
</p>
<p>
@@ -916,9 +2024,20 @@
warriors.
</p>
<p>
- <b>If</b><input v-model="testData.gr.four" type="text" class="input-bottom-border" @change="setTestData" />.
+ <b>If</b
+ ><input
+ :disabled="testData.isComplete"
+ v-model="testData.gr.four"
+ type="text"
+ class="input-bottom-border"
+ @change="setTestData"
+ />.
</p>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛欼f I go to Xi鈥檃n one day, I will visit the terracotta
warriors.
</p>
@@ -927,9 +2046,20 @@
Chicken would possibly be in top three.
</p>
<p>
- <b>If</b><input v-model="testData.gr.five" type="text" class="input-bottom-border" @change="setTestData" />.
+ <b>If</b
+ ><input
+ :disabled="testData.isComplete"
+ v-model="testData.gr.five"
+ type="text"
+ class="input-bottom-border"
+ @change="setTestData"
+ />.
</p>
- <p class="event-header-text-bc pd-5" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛� If you ask foreigners about their favorite Chinese food,
Kung Pao Chicken would possible be in top three
</p>
@@ -938,38 +2068,289 @@
<i>whether</i>.
</p>
<p>
- 1.I was wondering<input v-model="testData.cm.one" type="text" class="input-bottom-border"
- style="width: 60px" @change="setTestData" />to go for a walk in the Summer Palace.
+ 1.I was wondering<input
+ :disabled="testData.isComplete"
+ v-model="testData.cm.one"
+ type="text"
+ class="input-bottom-border"
+ style="width: 60px"
+ @change="setTestData"
+ />to go for a walk in the Summer Palace.
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isTextRight(testData.cm.answer, testData.cm.one)
+ "
+ 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.isComplete &&
+ isTextRight(testData.cm.answer, testData.cm.one) == 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>
- 2.We can spend the afternoon on the beach<input v-model="testData.cm.two" type="text"
- class="input-bottom-border" style="width: 60px" />the weather is fine.
+ 2.We can spend the afternoon on the beach<input
+ :disabled="testData.isComplete"
+ v-model="testData.cm.two"
+ type="text"
+ class="input-bottom-border"
+ style="width: 60px"
+ />the weather is fine.
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isTextRight(testData.cm.answer, testData.cm.two)
+ "
+ 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.isComplete &&
+ isTextRight(testData.cm.answer, testData.cm.two) == 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>
- 3.I called Wang to find out<input v-model="testData.cm.three" type="text" class="input-bottom-border"
- style="width: 60px" @change="setTestData" />or not he really went to see the Peking opera show.
+ 3.I called Wang to find out<input
+ :disabled="testData.isComplete"
+ v-model="testData.cm.three"
+ type="text"
+ class="input-bottom-border"
+ style="width: 60px"
+ @change="setTestData"
+ />or not he really went to see the Peking opera show.
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isTextRight(testData.cm.answer, testData.cm.three)
+ "
+ 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.isComplete &&
+ isTextRight(testData.cm.answer, testData.cm.three) == 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>
- 4.We鈥檙e not interested in<input v-model="testData.cm.four" type="text" class="input-bottom-border"
- style="width: 60px" @change="setTestData" />we get great jobs and that kind of thing.
+ 4.We鈥檙e not interested in<input
+ :disabled="testData.isComplete"
+ v-model="testData.cm.four"
+ type="text"
+ class="input-bottom-border"
+ style="width: 60px"
+ @change="setTestData"
+ />we get great jobs and that kind of thing.
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isTextRight(testData.cm.answer, testData.cm.four)
+ "
+ 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.isComplete &&
+ isTextRight(testData.cm.answer, testData.cm.four) == 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>
- 5.<input v-model="testData.cm.five" type="text" class="input-bottom-border" style="width: 60px" @change="setTestData" />I go to
- Sichuan,I will visit Chengdu Research Base of Giant
+ 5.<input
+ :disabled="testData.isComplete"
+ v-model="testData.cm.five"
+ type="text"
+ class="input-bottom-border"
+ style="width: 60px"
+ @change="setTestData"
+ />I go to Sichuan,I will visit Chengdu Research Base of Giant
Panda Breeding.
+ <span>
+ <svg
+ v-if="
+ testData.isComplete &&
+ isTextRight(testData.cm.answer, testData.cm.five)
+ "
+ 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.isComplete &&
+ isTextRight(testData.cm.answer, testData.cm.five) == 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" style="margin-left: 40px; width: 93%" v-if="showQuestionAnswer">
+ <p
+ class="event-header-text-bc pd-5"
+ style="margin-left: 40px; width: 93%"
+ v-if="showQuestionAnswer"
+ >
绛旀锛� 1.whether 2.if 3.whether 4.whether
5.if
</p>
- <div class="w100 fl ju-cn">
- <ul class="fl ju-ev" style="width: 80%">
+ <div class="w100 fl">
+ <ul class="fl ju-ar w100">
<li>
<button class="btn-border btn-w" @click="saveData">
鎻愪氦
</button>
- </li>
- <li>
</li>
<li>
<button @click="changeTestData" class="btn-border btn-w">
@@ -977,7 +2358,10 @@
</button>
</li>
<li>
- <button @click="showQuestionAnswer = !showQuestionAnswer" class="parimary-btn">
+ <button
+ @click="showQuestionAnswer = !showQuestionAnswer"
+ class="parimary-btn"
+ >
鏌ョ湅绛旀
</button>
</li>
@@ -994,7 +2378,10 @@
<div class="page-box" page="14">
<div v-if="showPageList.indexOf(14) > -1">
<div class="w100 mb-20" style="padding-right: 20px">
- <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
+ <div
+ class="event-header-bc fl al-end"
+ style="height: 100px; padding-left: 40px"
+ >
<div class="preface-header-box event-header-text-bc">
<span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
<span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -1022,9 +2409,19 @@
<p>銆�銆�銆�銆�3.What does he/she know about it?</p>
</div>
<p class="left">
- <img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" />
+ <img
+ class="img-gn"
+ alt=""
+ src="../../assets/images/dy1-worksheet.jpg"
+ />
</p>
- <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
+ <table
+ border="1"
+ cellpadding="4"
+ cellspacing="0"
+ style="border-color: #fff"
+ class="fz-14"
+ >
<tr class="table-th-bc">
<td class="tl-cn">Interviewees</td>
<td class="wh-no tl-cn">Chinese Culture</td>
@@ -1043,64 +2440,133 @@
</tr>
<tr class="table-tr-bc">
<td>
- <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.one"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.two" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.two"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.three"
+ class="w100 table-tr-bc b0 table-textarea"
+ @change="setBookQuestion"
+ ></textarea>
</td>
</tr>
<tr class="table-tr-bc">
<td>
- <textarea v-model="questionData.table.four" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.four"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.five" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.five"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.six" class="w100 table-tr-bc b0 table-textarea"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.six"
+ class="w100 table-tr-bc b0 table-textarea"
+ @change="setBookQuestion"
+ ></textarea>
</td>
</tr>
<tr class="table-tr-bc">
<td>
- <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.seven"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.enight"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.nine"
+ class="w100 table-tr-bc b0 table-textarea"
+ @change="setBookQuestion"
+ ></textarea>
</td>
</tr>
</table>
<p class="left">
- <img class="img-gn" alt="" src="../../assets/images/dy1-wordbank.jpg" />
+ <img
+ class="img-gn"
+ alt=""
+ src="../../assets/images/dy1-wordbank.jpg"
+ />
</p>
<div class="bk-wh">
<p class="dl-box">
- <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'exquisite')">exquisite</span>
- <span class="word-bc mr-20 dl-span" @click="saveWord($event, 'ancient')">ancient</span><span
- class="word-bc mr-20 dl-span" @click="saveWord($event, 'incredible')">incredible</span><span
- class="word-bc mr-20 dl-span" @click="saveWord($event, 'unique')">unique</span><span
- class="word-bc mr-20 dl-span" @click="saveWord($event, 'traditional')">traditional</span><span
- class="word-bc mr-20 dl-span" @click="saveWord($event, 'outstanding')">outstanding</span><span
- class="word-bc mr-20 dl-span" @click="saveWord($event, 'mouth-watering')">mouth-watering</span><span
- class="word-bc mr-20 dl-span" @click="saveWord($event, 'diverse')">diverse</span><span
- class="word-bc mr-20 dl-span" @click="saveWord($event, 'hospitable')">hospitable</span><span
- class="word-bc mr-20 dl-span" @click="saveWord($event, 'enjoyable')">enjoyable</span><span
- class="word-bc mr-20 dl-span" @click="saveWord($event, 'memorable')">memorable</span><span
- class="word-bc mr-20 dl-span" @click="saveWord($event, 'charming')">charming</span>
+ <span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'exquisite')"
+ >exquisite</span
+ >
+ <span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'ancient')"
+ >ancient</span
+ ><span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'incredible')"
+ >incredible</span
+ ><span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'unique')"
+ >unique</span
+ ><span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'traditional')"
+ >traditional</span
+ ><span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'outstanding')"
+ >outstanding</span
+ ><span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'mouth-watering')"
+ >mouth-watering</span
+ ><span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'diverse')"
+ >diverse</span
+ ><span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'hospitable')"
+ >hospitable</span
+ ><span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'enjoyable')"
+ >enjoyable</span
+ ><span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'memorable')"
+ >memorable</span
+ ><span
+ class="word-bc mr-20 dl-span"
+ @click="saveWord($event, 'charming')"
+ >charming</span
+ >
</p>
</div>
<div class="resource-primary-border" style="padding: 8px">
@@ -1264,7 +2730,9 @@
<li class=""></li>
<li class="fz-18">
<span class="chapter-left-bc">MODULE 1</span>
- <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
+ <span class="chapter-right-bc fw-bl chapter-right-cl"
+ >CHINA,A WONDERLAND</span
+ >
</li>
</ul>
<div class="padding-93">
@@ -1274,8 +2742,10 @@
</h2>
<h3 id="c005"><span class="bjh3">Warm-up</span></h3>
<p>
- <b>Put the expressions in the box below on the corresponding
- answer line under each picture.</b>
+ <b
+ >Put the expressions in the box below on the corresponding
+ answer line under each picture.</b
+ >
</p>
<div class="bk-wh">
<p>
@@ -1288,68 +2758,146 @@
<div class="left" style="width: 48%">
<div>
<p class="center">
- <img src="../../assets/images/0019-1.jpg" alt="" class="w100" />
+ <img
+ src="../../assets/images/0019-1.jpg"
+ alt=""
+ class="w100"
+ />
</p>
<p class="center">
1.
- <select class="select-border" v-model="dropdownData.one.value" @change="setDropdownData">
- <option v-for="(item, index) in dropDownList" :key="index" :value="item">
+ <select
+ class="select-border"
+ v-model="dropdownData.one.value"
+ @change="setDropdownData"
+ :disabled="dropdownData.isComplete"
+ >
+ <option
+ v-for="(item, index) in dropDownList"
+ :key="index"
+ :value="item"
+ >
{{ item }}
</option>
</select>
<span class="icon-box">
- <svg v-if="dropdownData.one.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">
+ <svg
+ v-if="dropdownData.one.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="dropdownData.one.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">
+ <svg
+ v-if="dropdownData.one.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerFive"
+ >
绛旀锛歩ntercity train
</p>
</div>
<div class="right" style="width: 48%">
<div>
<p class="center">
- <img src="../../assets/images/0019-2.jpg" alt="" style="width: 98%" />
+ <img
+ src="../../assets/images/0019-2.jpg"
+ alt=""
+ style="width: 98%"
+ />
</p>
<p class="center">
2.
- <select class="select-border" v-model="dropdownData.two.value" @change="setDropdownData">
- <option v-for="(item, index) in dropDownList" :key="index" :value="item">
+ <select
+ class="select-border"
+ v-model="dropdownData.two.value"
+ @change="setDropdownData"
+ :disabled="dropdownData.isComplete"
+ >
+ <option
+ v-for="(item, index) in dropDownList"
+ :key="index"
+ :value="item"
+ >
{{ item }}
</option>
</select>
<span class="icon-box">
- <svg v-if="dropdownData.two.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">
+ <svg
+ v-if="dropdownData.two.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="dropdownData.two.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">
+ <svg
+ v-if="dropdownData.two.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerFive"
+ >
绛旀锛歰nline shopping
</p>
</div>
@@ -1359,68 +2907,146 @@
<div class="left" style="width: 48%">
<div>
<p class="center">
- <img src="../../assets/images/0019-3.jpg" alt="" style="width: 98%" />
+ <img
+ src="../../assets/images/0019-3.jpg"
+ alt=""
+ style="width: 98%"
+ />
</p>
<p class="center">
3.
- <select class="select-border" v-model="dropdownData.three.value" @change="setDropdownData">
- <option v-for="(item, index) in dropDownList" :key="index" :value="item">
+ <select
+ class="select-border"
+ v-model="dropdownData.three.value"
+ @change="setDropdownData"
+ :disabled="dropdownData.isComplete"
+ >
+ <option
+ v-for="(item, index) in dropDownList"
+ :key="index"
+ :value="item"
+ >
{{ item }}
</option>
</select>
<span class="icon-box">
- <svg v-if="dropdownData.three.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">
+ <svg
+ v-if="dropdownData.three.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="dropdownData.three.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">
+ <svg
+ v-if="dropdownData.three.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerFive"
+ >
绛旀锛歟lectronic payment
</p>
</div>
<div class="right" style="width: 48%">
<div>
<p class="center">
- <img src="../../assets/images/0019-4.jpg" alt="" style="width: 94%" />
+ <img
+ src="../../assets/images/0019-4.jpg"
+ alt=""
+ style="width: 94%"
+ />
</p>
<p class="center">
4.
- <select class="select-border" v-model="dropdownData.four.value" @change="setDropdownData">
- <option v-for="(item, index) in dropDownList" :key="index" :value="item">
+ <select
+ class="select-border"
+ v-model="dropdownData.four.value"
+ @change="setDropdownData"
+ :disabled="dropdownData.isComplete"
+ >
+ <option
+ v-for="(item, index) in dropDownList"
+ :key="index"
+ :value="item"
+ >
{{ item }}
</option>
</select>
<span class="icon-box">
- <svg v-if="dropdownData.four.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">
+ <svg
+ v-if="dropdownData.four.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="dropdownData.four.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">
+ <svg
+ v-if="dropdownData.four.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerFive"
+ >
绛旀锛歴hared bike
</p>
</div>
@@ -1430,68 +3056,146 @@
<div class="left" style="width: 48%">
<div>
<p class="center">
- <img src="../../assets/images/0019-5.jpg" alt="" class="w100" />
+ <img
+ src="../../assets/images/0019-5.jpg"
+ alt=""
+ class="w100"
+ />
</p>
<p class="center">
5.
- <select class="select-border" v-model="dropdownData.five.value" @change="setDropdownData">
- <option v-for="(item, index) in dropDownList" :key="index" :value="item">
+ <select
+ class="select-border"
+ v-model="dropdownData.five.value"
+ @change="setDropdownData"
+ :disabled="dropdownData.isComplete"
+ >
+ <option
+ v-for="(item, index) in dropDownList"
+ :key="index"
+ :value="item"
+ >
{{ item }}
</option>
</select>
<span class="icon-box">
- <svg v-if="dropdownData.five.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">
+ <svg
+ v-if="dropdownData.five.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="dropdownData.five.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">
+ <svg
+ v-if="dropdownData.five.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerFive"
+ >
绛旀锛歵ake-away service
</p>
</div>
<div class="right" style="width: 48%">
<div>
<p class="center">
- <img src="../../assets/images/0019-6.jpg" alt="" style="width: 98%" />
+ <img
+ src="../../assets/images/0019-6.jpg"
+ alt=""
+ style="width: 98%"
+ />
</p>
<p class="center">
6.
- <select class="select-border" v-model="dropdownData.six.value" @change="setDropdownData">
- <option v-for="(item, index) in dropDownList" :key="index" :value="item">
+ <select
+ class="select-border"
+ v-model="dropdownData.six.value"
+ @change="setDropdownData"
+ :disabled="dropdownData.isComplete"
+ >
+ <option
+ v-for="(item, index) in dropDownList"
+ :key="index"
+ :value="item"
+ >
{{ item }}
</option>
</select>
<span class="icon-box">
- <svg v-if="dropdownData.six.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">
+ <svg
+ v-if="dropdownData.six.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>
+ fill="#1AFA29"
+ p-id="18768"
+ ></path>
</svg>
- <svg v-if="dropdownData.six.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">
+ <svg
+ v-if="dropdownData.six.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>
+ fill="#d81e06"
+ p-id="25746"
+ ></path>
</svg>
</span>
</p>
</div>
- <p class="event-header-text-bc pd-5" style="width: 90%" v-if="showAnswerFive">
+ <p
+ class="event-header-text-bc pd-5"
+ style="width: 90%"
+ v-if="showAnswerFive"
+ >
绛旀锛歠acial recognition
</p>
</div>
@@ -1499,13 +3203,19 @@
</div>
<div class="w100 fl ju-cn">
<div class="fl ju-ev mt-40" style="width: 80%">
- <button class="btn-border btn-w" @click="handleDropdown('judge')">
+ <button
+ class="btn-border btn-w"
+ @click="handleDropdown('judge')"
+ >
鎻愪氦
</button>
<button class="btn-border btn-w" @click="changeDropdown">
閲嶅仛
</button>
- <button @click="showAnswerFive = !showAnswerFive" class="parimary-btn">
+ <button
+ @click="showAnswerFive = !showAnswerFive"
+ class="parimary-btn"
+ >
鏌ョ湅绛旀
</button>
</div>
@@ -1521,7 +3231,10 @@
<div class="page-box" page="16">
<div v-if="showPageList.indexOf(16) > -1">
<div class="w100 mb-20" style="padding-right: 20px">
- <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
+ <div
+ class="event-header-bc fl al-end"
+ style="height: 100px; padding-left: 40px"
+ >
<div class="preface-header-box event-header-text-bc">
<span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
<span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -1602,18 +3315,27 @@
<li class=""></li>
<li class="fz-18">
<span class="chapter-left-bc">MODULE 1</span>
- <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
+ <span class="chapter-right-bc fw-bl chapter-right-cl"
+ >CHINA,A WONDERLAND</span
+ >
</li>
</ul>
<!-- 鍐呭 -->
<div class="padding-93">
<div class="bodystyle">
<p class="fl al-cn mt-40">
- <span class="zt-cs" style="font-size: 20px">Words & Expressions</span>
+ <span class="zt-cs" style="font-size: 20px"
+ >Words & Expressions</span
+ >
<span class="line-border-box"></span>
</p>
- <audio :src="resource.readingTwo" controls controlslist="noplaybackrate nodownload" style="margin-left: 10px" class="audio"
- @play="audioPlay"></audio>
+ <audio
+ :src="resource.readingTwo"
+ controls
+ controlslist="noplaybackrate nodownload"
+ style="margin-left: 10px"
+ class="audio"
+ ></audio>
<p>breeze /bri藧z/ <i>n.</i> 寰锛涘拰椋�</p>
<div class="bkbj">
<p><i>a light wind</i></p>
@@ -1637,8 +3359,10 @@
<p>dormitory /藞d蓴藧m蓹tri/ <i>n.</i> 瀛︾敓瀹胯垗锛涢泦浣撳鑸�</p>
<div class="bkbj">
<p>
- <i>a room for several people to sleep in,esp.in a school or
- other institution</i>
+ <i
+ >a room for several people to sleep in,esp.in a school or
+ other institution</i
+ >
</p>
</div>
<p>neighbour /藞ne瑟b蓹(r)/ <i>n.</i> 閭诲眳锛涢偦浜�</p>
@@ -1656,15 +3380,19 @@
<p>laptop /藞l忙pt蓲p/ <i>n.</i> 渚挎惡寮忕數鑴戯紱绗旇鏈數鑴�</p>
<div class="bkbj">
<p>
- <i>a small computer that can work with a battery and be easily
- carried</i>
+ <i
+ >a small computer that can work with a battery and be easily
+ carried</i
+ >
</p>
</div>
<p>stun /st蕦n/ <i>v.</i> 浣块渿鎯婏紙鎴栨儕鎰曘�佺洰鐬彛鍛嗭級</p>
<div class="bkbj">
<p>
- <i>to surprise or shock sb.so much that he/she cannot think
- clearly or speak</i>
+ <i
+ >to surprise or shock sb.so much that he/she cannot think
+ clearly or speak</i
+ >
</p>
</div>
<p>trigger /藞tr瑟伞蓹(r)/ <i>v.</i> 寮曡捣锛涜Е鍙�</p>
@@ -1678,16 +3406,20 @@
<p>era /藞瑟蓹r蓹/ <i>n.</i> 鏃朵唬锛涘勾浠�</p>
<div class="bkbj">
<p>
- <i>a period of time,usually in history,that is different from
+ <i
+ >a period of time,usually in history,that is different from
other periods because of particular characteristics or
- events</i>
+ events</i
+ >
</p>
</div>
<p>economy /瑟藞k蓲n蓹mi/ <i>n.</i> 缁忔祹锛涚粡娴庢儏鍐�</p>
<div class="bkbj">
<p>
- <i>the relationship between production,trade and the supply of
- money in a particular country or region</i>
+ <i
+ >the relationship between production,trade and the supply of
+ money in a particular country or region</i
+ >
</p>
</div>
</div>
@@ -1702,7 +3434,10 @@
<div v-if="showPageList.indexOf(18) > -1">
<!-- 澶撮儴 -->
<div class="w100 mb-20" style="padding-right: 20px">
- <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
+ <div
+ class="event-header-bc fl al-end"
+ style="height: 100px; padding-left: 40px"
+ >
<div class="preface-header-box event-header-text-bc">
<span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
<span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -1715,8 +3450,10 @@
<p>boom /bu藧m/ <i>v.</i> 杩呴�熷彂灞曪紱绻佽崳鏄岀洓</p>
<div class="bkbj">
<p>
- <i>to have a period of rapid growth; to become bigger,more
- successful,etc.</i>
+ <i
+ >to have a period of rapid growth; to become bigger,more
+ successful,etc.</i
+ >
</p>
</div>
<p>potential /p蓹藞ten蕛l/ <i>n.</i> 娼滃姏锛涙綔鑳�</p>
@@ -1822,7 +3559,9 @@
<li class=""></li>
<li class="fz-18">
<span class="chapter-left-bc">MODULE 1</span>
- <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
+ <span class="chapter-right-bc fw-bl chapter-right-cl"
+ >CHINA,A WONDERLAND</span
+ >
</li>
</ul>
<!-- 鍐呭 -->
@@ -1880,9 +3619,19 @@
changes,then report to the class.
</p>
<p class="left">
- <img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" />
+ <img
+ class="img-gn"
+ alt=""
+ src="../../assets/images/dy1-worksheet.jpg"
+ />
</p>
- <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
+ <table
+ border="1"
+ cellpadding="4"
+ cellspacing="0"
+ style="border-color: #fff"
+ class="fz-14"
+ >
<tr class="table-th-bc">
<td class="tl-cn">Items</td>
<td class="wh-no tl-cn">A Decade Ago</td>
@@ -1912,7 +3661,10 @@
<div v-if="showPageList.indexOf(20) > -1">
<!-- 澶撮儴 -->
<div class="w100 mb-20" style="padding-right: 20px">
- <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
+ <div
+ class="event-header-bc fl al-end"
+ style="height: 100px; padding-left: 40px"
+ >
<div class="preface-header-box event-header-text-bc">
<span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
<span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -1922,7 +3674,13 @@
<!-- 鍐呭 -->
<div class="padding-93">
<div class="bodystyle">
- <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff" class="fz-14">
+ <table
+ border="1"
+ cellpadding="4"
+ cellspacing="0"
+ style="border-color: #fff"
+ class="fz-14"
+ >
<tr class="table-th-bc">
<td class="tl-cn">Items</td>
<td class="wh-no tl-cn">A Decade Ago</td>
@@ -1937,51 +3695,81 @@
</tr>
<tr class="table-tr-bc">
<td>
- <textarea v-model="questionData.table.one" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.one"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.two" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.two"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.three" class="w100 table-tr-bc b0 table-textarea"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.three"
+ class="w100 table-tr-bc b0 table-textarea"
+ @change="setBookQuestion"
+ ></textarea>
</td>
</tr>
<tr class="table-tr-bc">
<td>
- <textarea v-model="questionData.table.four" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.four"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.five" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.five"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.six" class="w100 table-tr-bc b0 table-textarea"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.six"
+ class="w100 table-tr-bc b0 table-textarea"
+ @change="setBookQuestion"
+ ></textarea>
</td>
</tr>
<tr class="table-tr-bc">
<td>
- <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.seven"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.enight" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.enight"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
<td>
- <textarea v-model="questionData.table.nine" class="w100 table-tr-bc b0 table-textarea"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.nine"
+ class="w100 table-tr-bc b0 table-textarea"
+ @change="setBookQuestion"
+ ></textarea>
</td>
</tr>
<tr class="table-tr-bc">
<td colspan="3">
Your suggestion:
- <textarea v-model="questionData.table.seven" class="w100 table-tr-bc b0 table-textarea textarea-box"
- @change="setBookQuestion"></textarea>
+ <textarea
+ v-model="questionData.table.seven"
+ class="w100 table-tr-bc b0 table-textarea textarea-box"
+ @change="setBookQuestion"
+ ></textarea>
</td>
</tr>
</table>
@@ -1990,11 +3778,18 @@
</h2>
<h3 id="c008"><span class="bjh3">Listening</span></h3>
<p>
- <b>鈪�.Listen to Tom,an overseas student,talking about his journey
- to China and fill in the blanks with what you hear.</b>
+ <b
+ >鈪�.Listen to Tom,an overseas student,talking about his journey
+ to China and fill in the blanks with what you hear.</b
+ >
</p>
- <audio :src="resource.readingTwo" controls controlslist="noplaybackrate nodownload" style="margin-left: 10px" class="audio"
- @play="audioPlay"></audio>
+ <audio
+ :src="resource.readingTwo"
+ controls
+ controlslist="noplaybackrate nodownload"
+ style="margin-left: 10px"
+ class="audio"
+ ></audio>
<p>
After studying in China for almost three years by now,I call China
my second homeland.I love the natural beauty,the 1.________,the
@@ -2010,9 +3805,11 @@
of Laoshan鈥� China is such a beautiful country!
</p>
<p>
- <b>鈪�.Listen to the conversation about planning for the upcoming
+ <b
+ >鈪�.Listen to the conversation about planning for the upcoming
Chinese Culture Week and circle the right expressions to
- complete the following sentences.</b>
+ complete the following sentences.</b
+ >
</p>
<p>
1.They would like to organize an activity for foreign students to
@@ -2033,7 +3830,9 @@
<li class=""></li>
<li class="fz-18">
<span class="chapter-left-bc">MODULE 1</span>
- <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
+ <span class="chapter-right-bc fw-bl chapter-right-cl"
+ >CHINA,A WONDERLAND</span
+ >
</li>
</ul>
<!-- 鍐呭 -->
@@ -2058,8 +3857,10 @@
2.What information would you like to tell them about the event?
</p>
<p>
- <b>鈪�.Read the following tips for designing an event poster and
- mark the key elements in the following poster.</b>
+ <b
+ >鈪�.Read the following tips for designing an event poster and
+ mark the key elements in the following poster.</b
+ >
</p>
<p>
An event poster is a marketing tool designed to attract visitors
@@ -2075,48 +3876,112 @@
<div class="horizontal" style="display: flex">
<div class="left" style="width: 48%">
<p class="center">
- <img class="img-e" alt="" src="../../assets/images/0025-1.jpg" />
+ <img
+ class="img-e"
+ alt=""
+ src="../../assets/images/0025-1.jpg"
+ />
</p>
</div>
<div class="right" style="width: 48%">
<p>
- <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
+ <input
+ type="checkbox"
+ name="ball"
+ value="Language"
+ id="1"
+ v-model="testData.check"
+ />
Name of the event
</p>
<p>
- <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
+ <input
+ type="checkbox"
+ name="ball"
+ value="Language"
+ id="1"
+ v-model="testData.check"
+ />
Date and time
</p>
<p>
- <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
+ <input
+ type="checkbox"
+ name="ball"
+ value="Language"
+ id="1"
+ v-model="testData.check"
+ />
Location
</p>
<p>
- <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
+ <input
+ type="checkbox"
+ name="ball"
+ value="Language"
+ id="1"
+ v-model="testData.check"
+ />
Greetings
</p>
<p>
- <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
+ <input
+ type="checkbox"
+ name="ball"
+ value="Language"
+ id="1"
+ v-model="testData.check"
+ />
Warnings
</p>
<p>
- <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
+ <input
+ type="checkbox"
+ name="ball"
+ value="Language"
+ id="1"
+ v-model="testData.check"
+ />
Organizer
</p>
<p>
- <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
+ <input
+ type="checkbox"
+ name="ball"
+ value="Language"
+ id="1"
+ v-model="testData.check"
+ />
Signature
</p>
<p>
- <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
+ <input
+ type="checkbox"
+ name="ball"
+ value="Language"
+ id="1"
+ v-model="testData.check"
+ />
A short description of the event
</p>
<p>
- <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
+ <input
+ type="checkbox"
+ name="ball"
+ value="Language"
+ id="1"
+ v-model="testData.check"
+ />
Contact information
</p>
<p>
- <input type="checkbox" name="ball" value="Language" id="1" v-model="testData.check" />
+ <input
+ type="checkbox"
+ name="ball"
+ value="Language"
+ id="1"
+ v-model="testData.check"
+ />
Pictures of the event
</p>
</div>
@@ -2133,7 +3998,10 @@
<div v-if="showPageList.indexOf(22) > -1">
<!-- 澶撮儴 -->
<div class="w100 mb-20" style="padding-right: 20px">
- <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
+ <div
+ class="event-header-bc fl al-end"
+ style="height: 100px; padding-left: 40px"
+ >
<div class="preface-header-box event-header-text-bc">
<span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
<span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -2144,22 +4012,27 @@
<div class="padding-93">
<div class="bodystyle">
<p>
- <b>鈪�.DIY Crafts Club is planning a paper-cutting contest to
+ <b
+ >鈪�.DIY Crafts Club is planning a paper-cutting contest to
promote Chinese handicrafts.The contest will be held in the
- lobby of Student Center at</b>6锛�00-8锛�00<b> November</b>16<b>.You're in charge of publicity in the club
- and are required to
+ lobby of Student Center at</b
+ >6锛�00-8锛�00<b> November</b>16<b
+ >.You're in charge of publicity in the club and are required to
design a poster for the contest.Complete the necessary
- information in the following poster.</b>
+ information in the following poster.</b
+ >
</p>
<p class="center">
<img class="img-a" alt="" src="../../assets/images/0026-1.jpg" />
</p>
<p>
- <b>鈪�.Your class has prepared a Chinese culture exhibition for
+ <b
+ >鈪�.Your class has prepared a Chinese culture exhibition for
foreign exchange students.Your group takes the responsibility of
designing a poster for it.Discuss with your partner and try to
answer the questions below to find out what information is
- needed.</b>
+ needed.</b
+ >
</p>
<div class="dy1-bj4">
<p class="center"><b>Information to put into our poster</b></p>
@@ -2190,15 +4063,19 @@
<li class=""></li>
<li class="fz-18">
<span class="chapter-left-bc">MODULE 1</span>
- <span class="chapter-right-bc fw-bl chapter-right-cl">CHINA,A WONDERLAND</span>
+ <span class="chapter-right-bc fw-bl chapter-right-cl"
+ >CHINA,A WONDERLAND</span
+ >
</li>
</ul>
<!-- 鍐呭 -->
<div class="padding-93">
<div class="bodystyle">
<p>
- 鈪�<b>.Design a poster for the exhibition according to the
- information in the table above.</b>
+ 鈪�<b
+ >.Design a poster for the exhibition according to the
+ information in the table above.</b
+ >
</p>
<p class="center">
<img class="img-b" alt="" src="../../assets/images/0027-1.jpg" />
@@ -2237,7 +4114,10 @@
<div v-if="showPageList.indexOf(24) > -1">
<!-- 澶撮儴 -->
<div class="w100 mb-20" style="padding-right: 20px">
- <div class="event-header-bc fl al-end" style="height: 100px; padding-left: 40px">
+ <div
+ class="event-header-bc fl al-end"
+ style="height: 100px; padding-left: 40px"
+ >
<div class="preface-header-box event-header-text-bc">
<span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
<span class="g-text event-text-color">鍩虹妯″潡涓�</span>
@@ -2248,7 +4128,11 @@
<div class="padding-93">
<div class="bodystyle">
<p class="left">
- <img class="img-gn" alt="" src="../../assets/images/dy1-worksheet.jpg" />
+ <img
+ class="img-gn"
+ alt=""
+ src="../../assets/images/dy1-worksheet.jpg"
+ />
</p>
<p class="center">
<img class="img-b" alt="" src="../../assets/images/0028-1.jpg" />
@@ -2463,10 +4347,11 @@
},
},
testData: {
+ isComplete: false,
check: {
- isRight:null,
- answer:["Culture","Cuisine","Landscapes"],
- value:[]
+ isRight: null,
+ answer: ["Culture", "Cuisine", "Landscapes"],
+ value: [],
},
tx: {
one: "",
@@ -2481,8 +4366,8 @@
three: "",
four: "",
five: "",
- isRight:null,
- answer:'cuisine,landscapes,civilization,explore,unique'
+ isRight: null,
+ answer: ["uisine", "andscapes", "ivilization", "xplore", "nique"],
},
line: {
one: "",
@@ -2510,6 +4395,7 @@
three: "",
four: "",
five: "",
+ answer: ["whether", "if", "whether", "whether", "if"],
},
},
resource: {
@@ -2526,6 +4412,7 @@
"take-away service",
],
dropdownData: {
+ isComplete: false,
one: {
value: "",
isRight: null,
@@ -2584,10 +4471,11 @@
changeTestData() {
localStorage.removeItem("english-testOne");
this.testData = {
+ isComplete: false,
check: {
- isRight:null,
- answer:["Culture","Cuisine","Landscapes"],
- value:[]
+ isRight: null,
+ answer: ["Culture", "Cuisine", "Landscapes"],
+ value: [],
},
tx: {
one: "",
@@ -2602,8 +4490,8 @@
three: "",
four: "",
five: "",
- isRight:null,
- answer:['uisine','andscapes','ivilization','xplore','nique']
+ isRight: null,
+ answer: ["uisine", "andscapes", "ivilization", "xplore", "nique"],
},
line: {
one: "",
@@ -2631,11 +4519,11 @@
three: "",
four: "",
five: "",
+ answer: ["whether", "if", "whether", "whether", "if"],
},
};
},
setBookQuestion() {
- console.log("淇濆瓨");
localStorage.setItem(
"english-book-question-one",
JSON.stringify(this.questionData)
@@ -2661,55 +4549,61 @@
if (type == "one") {
this.questionData.warnUp.one.value
? (this.questionData.warnUp.one.isRight =
- this.questionData.warnUp.one.value == "Chinese knot")
+ this.questionData.warnUp.one.value == "Chinese knot")
: (this.questionData.warnUp.one.isRight = null);
} else if (type == "two") {
this.questionData.warnUp.two.value
? (this.questionData.warnUp.two.isRight =
- this.questionData.warnUp.two.value == "Chinese medicine")
+ this.questionData.warnUp.two.value == "Chinese medicine")
: (this.questionData.warnUp.two.isRight = null);
} else if (type == "three") {
this.questionData.warnUp.three.value
? (this.questionData.warnUp.three.isRight =
- this.questionData.warnUp.three.value == "Chinese calligraphy")
+ this.questionData.warnUp.three.value == "Chinese calligraphy")
: (this.questionData.warnUp.three.isRight = null);
} else if (type == "four") {
this.questionData.warnUp.four.value
? (this.questionData.warnUp.four.isRight =
- this.questionData.warnUp.four.value == "Taichi")
+ this.questionData.warnUp.four.value == "Taichi")
: (this.questionData.warnUp.four.isRight = null);
} else if (type == "five") {
this.questionData.warnUp.five.value
? (this.questionData.warnUp.five.isRight =
- this.questionData.warnUp.five.value == "sweet dumpling")
+ this.questionData.warnUp.five.value == "sweet dumpling")
: (this.questionData.warnUp.five.isRight = null);
} else if (type == "six") {
this.questionData.warnUp.six.value
? (this.questionData.warnUp.six.isRight =
- this.questionData.warnUp.six.value == "Chinese chess")
+ this.questionData.warnUp.six.value == "Chinese chess")
: (this.questionData.warnUp.six.isRight = null);
}
},
handleDropdown(type) {
const dropdownDatas = this.dropdownData;
for (let key in dropdownDatas) {
- const item = dropdownDatas[key];
+ let item = dropdownDatas[key];
if (type == "judge") {
- item.value == item.answer
- ? (item.isRight = true)
- : (item.isRight = false);
- console.log(item.value, item.answer);
+ if (key != "isComplete") {
+ item.value == item.answer
+ ? (item.isRight = true)
+ : (item.isRight = false);
+ }
}
}
this.dropdownData = dropdownDatas;
+ this.$set(this.dropdownData,'isComplete',true)
+ this.setDropdownData()
},
changeDropdown() {
localStorage.removeItem("english-dropdown-one");
for (let key in this.dropdownData) {
- const item = this.dropdownData[key];
- item.value = "";
- item.isRight = null;
+ let item = this.dropdownData[key];
+ if(key != 'isComplete') {
+ item.value = "";
+ item.isRight = null;
+ }
}
+ this.$set(this.dropdownData,'isComplete',false)
},
setDropdownData() {
localStorage.setItem(
@@ -2718,33 +4612,42 @@
);
},
saveData() {
- const item = this.testData['check']
+ const item = this.testData["check"];
const sortedArr1 = item.answer.slice().sort();
const sortedArr2 = item.value.slice().sort();
const isRight = sortedArr1.every(
- (value, index) => value === sortedArr2[index]
- );
- const inData = this.testData['in']
- let inString = []
+ (value, index) => value === sortedArr2[index]
+ );
+ const inData = this.testData["in"];
+ let inString = [];
for (let key in inData) {
const citem = inData[key];
- if(key != 'answer' && key !== 'isRight') {
+ if (key != "answer" && key !== "isRight") {
console.log(key);
- inString.push(citem)
+ inString.push(citem);
}
-
-
}
- const inRight = inData.answer == inString
- console.log('in',inData.answer,inString);
- this.$set(this.testData['in'],'isRight',inRight)
- this.$set(this.testData['check'],'isRight',isRight)
- this.setTestData()
- console.log(this.testData);
-
+ const inRight = inData.answer == inString;
+ console.log("in", inData.answer, inString);
+ this.$set(this.testData["in"], "isRight", inRight);
+ this.$set(this.testData["check"], "isRight", isRight);
+ this.$set(this.testData, "isComplete", true);
+ this.setTestData();
+ this.showQuestionAnswer = true;
},
- audioPlay() {
- this.$emit("closeMiniAudio");
+ isShowRight(answer, userAnswer, data) {
+ let flag = null;
+ if (userAnswer.indexOf(data) > -1) {
+ flag = answer.indexOf(data) > -1 ? true : false;
+ }
+ return flag;
+ },
+ isTextRight(answer, data) {
+ let flag = null;
+ if (data) {
+ flag = answer.indexOf(data) > -1 ? true : false;
+ }
+ return flag;
},
},
};
@@ -2828,7 +4731,7 @@
border: 0;
border-bottom: 1px solid #767676;
&:focus {
- outline: none;
+ outline: none;
}
}
</style>
diff --git a/src/books/English/view/components/chapter004.vue b/src/books/English/view/components/chapter004.vue
index 27bb19d..1a99f0b 100644
--- a/src/books/English/view/components/chapter004.vue
+++ b/src/books/English/view/components/chapter004.vue
@@ -21,9 +21,9 @@
</div>
</div>
<!-- 59 -->
- <div class="page-box" page="65">
+ <!-- <div class="page-box" page="65">
<div v-if="showPageList.indexOf(65) > -1">
- <!-- 澶撮儴 -->
+
<ul class="preface-odd-header w100 fl ju-bt">
<li class=""></li>
<li class="fz-18">
@@ -32,7 +32,7 @@
VOLUNTEERS</span>
</li>
</ul>
- <!-- 鍐呭 -->
+
<div class="padding-93">
<div class="bodystyle">
<h2 id="b013"><img class="img-0" alt="" src="../../assets/images/dy4-le1.jpg" /></h2>
@@ -64,11 +64,11 @@
<span class="contet-num-box">59</span>
</div>
</div>
- </div>
+ </div> -->
<!-- 60 -->
- <div class="page-box" page="66">
+ <!-- <div class="page-box" page="66">
<div v-if="showPageList.indexOf(66) > -1">
- <!-- 澶撮儴 -->
+
<div class="w100 mb-20" style="padding-right: 20px">
<div class="event-header-bc-unit4 fl al-end" style="height: 100px; padding-left: 40px">
<div class="preface-header-box event-header-text-bc-unit4">
@@ -77,7 +77,7 @@
</div>
</div>
</div>
- <!-- 鍐呭 -->
+
<div class="padding-93">
<div class="bodystyle">
<h3 id="c029"><span class="bjh3">Listening</span></h3>
@@ -1006,7 +1006,7 @@
<span class="contet-num-box">76</span>
</div>
</div>
- </div>
+ </div> -->
</div>
</template>
<script>
diff --git a/src/books/English/view/components/index.vue b/src/books/English/view/components/index.vue
index d9434e7..9d696ff 100644
--- a/src/books/English/view/components/index.vue
+++ b/src/books/English/view/components/index.vue
@@ -1,29 +1,44 @@
<template>
<div class="page-main" @scroll="throttledScrollHandler">
- <div class="page-content" :style="{
- fontSize: fontSize ? fontSize + 'px' : '16px',
- transform: `scale(${pageZoom ? pageZoom : 1})`,
- transformOrigin: 'center top',
- }">
- <pageHeader v-if="showCatalogList.indexOf(1) > -1" :showPageList="loadPageList"></pageHeader>
- <chapterOne @saveCharacters="saveCharacters" @closeMiniAudio="closeMiniAudio"
- v-if="showCatalogList.indexOf(2) > -1" :showPageList="loadPageList"></chapterOne>
- <chapterTwo @saveCharacters="saveCharacters" @closeMiniAudio="closeMiniAudio"
- v-if="showCatalogList.indexOf(3) > -1" :showPageList="loadPageList"></chapterTwo>
- <chapterThree @saveCharacters="saveCharacters" @closeMiniAudio="closeMiniAudio"
- v-if="showCatalogList.indexOf(4) > -1" :showPageList="loadPageList"></chapterThree>
- <chapterFour @saveCharacters="saveCharacters" @closeMiniAudio="closeMiniAudio"
- v-if="showCatalogList.indexOf(5) > -1" :showPageList="loadPageList"></chapterFour>
- <chapterFive @saveCharacters="saveCharacters" @closeMiniAudio="closeMiniAudio"
- v-if="showCatalogList.indexOf(6) > -1" :showPageList="loadPageList"></chapterFive>
- <chapterSex @saveCharacters="saveCharacters" @closeMiniAudio="closeMiniAudio"
- v-if="showCatalogList.indexOf(7) > -1" :showPageList="loadPageList"></chapterSex>
- <chapterSeven @saveCharacters="saveCharacters" @closeMiniAudio="closeMiniAudio"
- v-if="showCatalogList.indexOf(8) > -1" :showPageList="loadPageList"></chapterSeven>
- <chapterEight @saveCharacters="saveCharacters" @closeMiniAudio="closeMiniAudio"
- v-if="showCatalogList.indexOf(9) > -1" :showPageList="loadPageList"></chapterEight>
+ <div
+ class="page-content"
+ :style="{
+ fontSize: fontSize ? fontSize + 'px' : '16px',
+ transform: `scale(${pageZoom ? pageZoom : 1})`,
+ transformOrigin: 'center top',
+ }"
+ >
+ <pageHeader
+ v-if="showCatalogList.indexOf(1) > -1"
+ :showPageList="loadPageList"
+ ></pageHeader>
+ <chapterOne
+ @saveCharacters="saveCharacters"
+ v-if="showCatalogList.indexOf(2) > -1"
+ :showPageList="loadPageList"
+ ></chapterOne>
+ <chapterTwo
+ @saveCharacters="saveCharacters"
+ v-if="showCatalogList.indexOf(3) > -1"
+ :showPageList="loadPageList"
+ ></chapterTwo>
+ <chapterThree
+ @saveCharacters="saveCharacters"
+ v-if="showCatalogList.indexOf(4) > -1"
+ :showPageList="loadPageList"
+ ></chapterThree>
+ <chapterFour
+ @saveCharacters="saveCharacters"
+ v-if="showCatalogList.indexOf(5) > -1"
+ :showPageList="loadPageList"
+ ></chapterFour>
</div>
- <miniAudio :path="audioPath" :currentTime="currentTime" @closeMiniAudio="closeMiniAudio" ref="audioPlayer">
+ <miniAudio
+ :path="audioPath"
+ :currentTime="currentTime"
+ @closeMiniAudio="closeMiniAudio"
+ ref="audioPlayer"
+ >
</miniAudio>
</div>
</template>
@@ -97,6 +112,7 @@
setTimeout(() => {
this.initSwiper();
this.initViewer();
+ this.closeAudio()
}, 200);
},
},
@@ -167,36 +183,36 @@
}, 500);
// 娴嬭瘯椤甸潰璺宠浆
- setTimeout(() => {
- this.gotoPage(2,7);
- // setTimeout(() => {
- // this.renderSign("Highlight", {
- // id: "2ACA9359",
- // txt: "棰樹竴瀛︿範涓婚涓� 杩愬姩",
- // page: "10",
- // type: "Highlight",
- // color: "#F5E12A"
- // });
- // setTimeout(() => {
- // this.delSign({
- // ids: ["2ACA9359"]
- // });
- // }, 2000);
- // }, 5000);
+ // setTimeout(() => {
+ // this.gotoPage(4,59);
+ // setTimeout(() => {
+ // this.renderSign("Highlight", {
+ // id: "2ACA9359",
+ // txt: "棰樹竴瀛︿範涓婚涓� 杩愬姩",
+ // page: "10",
+ // type: "Highlight",
+ // color: "#F5E12A"
+ // });
+ // setTimeout(() => {
+ // this.delSign({
+ // ids: ["2ACA9359"]
+ // });
+ // }, 2000);
+ // }, 5000);
- // 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);
+ // 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
+ // });
+ // }, 50);
},
methods: {
// setZoom1() {
@@ -455,8 +471,8 @@
page && pageThemeColor && pageThemeColor[page]
? pageThemeColor[page]
: chapterNum && chapterThemeColor && chapterThemeColor[chapterNum]
- ? chapterThemeColor[chapterNum]
- : bookThemeColor;
+ ? chapterThemeColor[chapterNum]
+ : bookThemeColor;
if (themeColor) {
domItem.style.color = themeColor;
}
@@ -473,8 +489,8 @@
page && pageThemeColor && pageThemeColor[page]
? pageThemeColor[page]
: chapterNum && chapterThemeColor && chapterThemeColor[chapterNum]
- ? chapterThemeColor[chapterNum]
- : bookThemeColor;
+ ? chapterThemeColor[chapterNum]
+ : bookThemeColor;
if (themeColor) {
domItem.style.backgroundColor = themeColor;
}
@@ -491,8 +507,8 @@
page && pageThemeColor && pageThemeColor[page]
? pageThemeColor[page]
: chapterNum && chapterThemeColor && chapterThemeColor[chapterNum]
- ? chapterThemeColor[chapterNum]
- : bookThemeColor;
+ ? chapterThemeColor[chapterNum]
+ : bookThemeColor;
if (themeColor) {
domItem.style.borderColor = themeColor;
}
@@ -635,23 +651,19 @@
autoplay: {
//鑷姩寮�濮�
delay: 3000, //鏃堕棿闂撮殧
- disableOnInteraction: false //*鎵嬪姩鎿嶄綔杞挱鍥惧悗涓嶄細鏆傚仠*
+ disableOnInteraction: false, //*鎵嬪姩鎿嶄綔杞挱鍥惧悗涓嶄細鏆傚仠*
},
paginationClickable: true,
slidesPerView: 1, // 涓�缁勪笁涓�
spaceBetween: 30, // 闂撮殧
// 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳
navigation: {
- nextEl: dom.querySelector(
- ".swiper-button-next"
- ),
- prevEl: dom.querySelector(
- ".swiper-button-prev"
- )
+ nextEl: dom.querySelector(".swiper-button-next"),
+ prevEl: dom.querySelector(".swiper-button-prev"),
},
// 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔�
observer: true,
- observeParents: true
+ observeParents: true,
// // 濡傛灉闇�瑕佸垎椤靛櫒
// pagination: {
// el: (this.container ? this.container : document).querySelector(
@@ -674,12 +686,8 @@
spaceBetween: 30, // 闂撮殧
// 濡傛灉闇�瑕佸墠杩涘悗閫�鎸夐挳
navigation: {
- nextEl: dom.querySelector(
- ".swiper-button-next"
- ),
- prevEl: dom.querySelector(
- ".swiper-button-prev"
- )
+ nextEl: dom.querySelector(".swiper-button-next"),
+ prevEl: dom.querySelector(".swiper-button-prev"),
},
// 绐楀彛鍙樺寲,閲嶆柊init,閽堝F11鍏ㄥ睆鍜屾斁澶х缉灏�,蹇呴』鍔�
observer: true,
@@ -698,8 +706,8 @@
var paginationInfoEl = dom.querySelector(".pageBox");
if (paginationInfoEl)
paginationInfoEl.textContent = currentPage + "/" + totalPages;
- }
- }
+ },
+ },
});
}
},
@@ -745,7 +753,7 @@
propsData: {
showPageList: [],
questionData: {},
- isSearch: true
+ isSearch: true,
},
});
pageExample.$mount(
@@ -777,7 +785,7 @@
propsData: {
showPageList: [pageNum],
questionData: {},
- isSearch: true
+ isSearch: true,
},
});
pageExample.$mount(
@@ -833,7 +841,7 @@
// 璁板綍楂樹寒淇℃伅
this.highlightData = data;
// 璺宠浆
- this.gotoPage(data.catalog, data.page, () => { });
+ this.gotoPage(data.catalog, data.page, () => {});
},
// 鐐瑰嚮浜嬩欢锛氬皢鐢熷兓鍗曡瘝浼犵粰 涓诲簲鐢� 浠庤�岃皟鐢ㄨ瘝鍏稿姛鑳�
saveCharacters(event, word) {
@@ -898,6 +906,25 @@
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();
+ });
+ }
+ },
},
components: {
pageHeader,
diff --git a/src/books/artAndDance/assets/main.less b/src/books/artAndDance/assets/main.less
index 6b92359..95b4af5 100644
--- a/src/books/artAndDance/assets/main.less
+++ b/src/books/artAndDance/assets/main.less
@@ -454,6 +454,13 @@
}
}
}
+@media (max-width:820px) {
+ .ans-dance {
+ .page-box {
+ min-height: 500px;
+ }
+ }
+}
@media (min-width: 660px) {
.ans-dance {
.page-padding {
diff --git a/src/books/artAndDance/view/components/chapter001.vue b/src/books/artAndDance/view/components/chapter001.vue
index 7b8b7f6..d462483 100644
--- a/src/books/artAndDance/view/components/chapter001.vue
+++ b/src/books/artAndDance/view/components/chapter001.vue
@@ -54,13 +54,13 @@
<ul class="fl fl-cl al-cn audio-box">
<li class="fl al-cn">
<span class="wh-nr auido-text mr-8 ">鐢风闊�</span>
- <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay" ></audio>
+ <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio" ></audio>
</li>
<li class="fl al-cn mt-20 " >
<span class="wh-nr auido-text mr-8 ">
濂崇闊�
</span>
- <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
+ <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio" ></audio>
</li>
</ul>
<h3 id="c003">榛勯工妤奸�佸瓱娴╃劧涔嬪箍闄�</h3>
@@ -79,7 +79,7 @@
x5-playsinline=""
controls
controlslist="nodownload"
- class="w100"
+ class="w100 video"
style="margin-top: 40px;"
></video>
</div>
@@ -172,9 +172,6 @@
this.auidoPathOne = await getResourcePath("2c5f6c69b0f9f7a3c03e473cb8c977f5");
this.auidoPathTwo = await getResourcePath("e93c0fdde08be5a4386c8c863892a287");
},
- audioPlay(e) {
- this.$emit('closeAudio',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/artAndDance/view/components/chapter002.vue b/src/books/artAndDance/view/components/chapter002.vue
index e3c4ee7..08778f8 100644
--- a/src/books/artAndDance/view/components/chapter002.vue
+++ b/src/books/artAndDance/view/components/chapter002.vue
@@ -69,13 +69,13 @@
<ul class="fl fl-cl al-cn audio-box">
<li class="fl al-cn">
<span class="wh-nr auido-text mr-8">鐢风闊�</span>
- <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
+ <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio" ></audio>
</li>
<li class="fl al-cn mt-20">
<span class="wh-nr auido-text mr-8">
濂崇闊�
</span>
- <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
+ <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio" ></audio>
</li>
</ul>
<h3 id="c006">浜＄緤琛ョ墷</h3>
@@ -119,7 +119,7 @@
x5-playsinline=""
controls
controlslist="nodownload"
- class="w100"
+ class="w100 video"
style="margin-top: 40px;"
></video>
<h2 class="lefth2 mt-40" id="b007">
@@ -225,9 +225,6 @@
}
},200)
},
- audioPlay(e) {
- this.$emit('closeAudio',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/artAndDance/view/components/chapter003.vue b/src/books/artAndDance/view/components/chapter003.vue
index 85aa071..7091624 100644
--- a/src/books/artAndDance/view/components/chapter003.vue
+++ b/src/books/artAndDance/view/components/chapter003.vue
@@ -54,13 +54,13 @@
<ul class="fl fl-cl al-cn audio-box">
<li class="fl al-cn">
<span class="wh-nr auido-text mr-8">鐢风闊�</span>
- <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
+ <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio" ></audio>
</li>
<li class="fl al-cn mt-20">
<span class="wh-nr auido-text mr-8">
濂崇闊�
</span>
- <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
+ <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio"></audio>
</li>
</ul>
<h3 id="c009">灏忓効鍨傞挀</h3>
@@ -79,7 +79,7 @@
x5-playsinline=""
controls
controlslist="nodownload"
- class="w100"
+ class="w100 video"
style="margin-top: 40px;"
></video>
</div>
@@ -171,9 +171,6 @@
this.auidoPathOne = await getResourcePath("85923e871441c541991be07fe4ce8771");
this.auidoPathTwo = await getResourcePath("c018f7a6434abfac0b0e0da1174d643a");
},
- audioPlay(e) {
- this.$emit('closeAudio',e.srcElement.currentSrc)
- }
},
}
</script>
diff --git a/src/books/artAndDance/view/components/chapter004.vue b/src/books/artAndDance/view/components/chapter004.vue
index 97ce204..73e3e16 100644
--- a/src/books/artAndDance/view/components/chapter004.vue
+++ b/src/books/artAndDance/view/components/chapter004.vue
@@ -60,13 +60,13 @@
<ul class="fl fl-cl al-cn audio-box">
<li class="fl al-cn">
<span class="wh-nr auido-text mr-8">鐢风闊�</span>
- <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
+ <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio" ></audio>
</li>
<li class="fl al-cn mt-20">
<span class="wh-nr auido-text mr-8">
濂崇闊�
</span>
- <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
+ <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio" ></audio>
</li>
</ul>
<h3 id="c012">瀵婚殣鑰呬笉閬�</h3>
@@ -83,7 +83,7 @@
x5-playsinline=""
controls
controlslist="nodownload"
- class="w100"
+ class="w100 video"
style="margin-top: 40px;"
></video>
</div>
@@ -175,9 +175,6 @@
this.auidoPathOne = await getResourcePath("a865ff99b91fa24d87ac81a883be54db");
this.auidoPathTwo = await getResourcePath("66f3cc00d272a120514201e13e87fb9d");
},
- audioPlay(e) {
- this.$emit('closeAudio',e.srcElement.currentSrc)
- }
},
}
</script>
diff --git a/src/books/artAndDance/view/components/chapter005.vue b/src/books/artAndDance/view/components/chapter005.vue
index e0fcfca..032ca3e 100644
--- a/src/books/artAndDance/view/components/chapter005.vue
+++ b/src/books/artAndDance/view/components/chapter005.vue
@@ -66,11 +66,11 @@
<ul class="fl fl-cl al-cn audio-box">
<li class="fl al-cn">
<span class="wh-nr auido-text mr-8">鐢风闊�</span>
- <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
+ <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio" ></audio>
</li>
<li class="fl al-cn mt-20">
<span class="wh-nr auido-text mr-8"> 濂崇闊� </span>
- <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
+ <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio" ></audio>
</li>
</ul>
<h3 id="c015">娓旀瓕瀛�</h3>
@@ -111,7 +111,7 @@
x5-playsinline=""
controls
controlslist="nodownload"
- class="w100"
+ class="w100 video"
style="margin:38px 0"
></video>
<h2 class="lefth2" id="b003">
@@ -219,9 +219,6 @@
}
},200)
},
- audioPlay(e) {
- this.$emit('closeAudio',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/artAndDance/view/components/chapter006.vue b/src/books/artAndDance/view/components/chapter006.vue
index 765ae71..5ae1e73 100644
--- a/src/books/artAndDance/view/components/chapter006.vue
+++ b/src/books/artAndDance/view/components/chapter006.vue
@@ -311,10 +311,14 @@
</ul>
</div>
</div>
+ <!-- <div class="page-box" page="30">
+ <giffiti :page="30" :bcImg="'https://t7.baidu.com/it/u=1819248061,230866778&fm=193&f=GIF'" />
+ </div> -->
</div>
</template>
<script>
+import giffiti from '@/components/graffiti/index.vue'
export default {
name: "chapterSix",
props: {
@@ -322,6 +326,7 @@
type: Array,
},
},
+ components:{giffiti}
};
</script>
diff --git a/src/books/artAndDance/view/components/index.vue b/src/books/artAndDance/view/components/index.vue
index 6678a4d..0d85c36 100644
--- a/src/books/artAndDance/view/components/index.vue
+++ b/src/books/artAndDance/view/components/index.vue
@@ -18,28 +18,23 @@
<chapterOne
v-if="showCatalogList.indexOf(2) > -1"
:showPageList="loadPageList"
- @closeAudio="closeAudio"
></chapterOne>
<chapterTwo
v-if="showCatalogList.indexOf(3) > -1"
:showPageList="loadPageList"
- @closeAudio="closeAudio"
>
</chapterTwo>
<chapterThree
v-if="showCatalogList.indexOf(4) > -1"
:showPageList="loadPageList"
- @closeAudio="closeAudio"
></chapterThree>
<chapterFour
v-if="showCatalogList.indexOf(5) > -1"
:showPageList="loadPageList"
- @closeAudio="closeAudio"
></chapterFour>
<chapterFive
v-if="showCatalogList.indexOf(6) > -1"
:showPageList="loadPageList"
- @closeAudio="closeAudio"
></chapterFive>
<chapterSix
v-if="showCatalogList.indexOf(7) > -1"
@@ -123,6 +118,8 @@
setTimeout(() => {
this.initSwiper();
this.initViewer();
+ this.closeAudio()
+ this.closeVideo()
}, 200);
},
},
@@ -194,7 +191,7 @@
// 娴嬭瘯椤甸潰璺宠浆
// setTimeout(() => {
- // this.gotoPage(6, 26);
+ // this.gotoPage(6, 30);
// setTimeout(() => {
// this.renderSign("Highlight", {
// id: "2ACA9359",
@@ -208,7 +205,7 @@
// ids: ["2ACA9359"]
// });
// }, 2000);
- // }, 5000);
+ // }, 500);
// const pageDom = (this.container ? this.container : document)
// .querySelector("#app")
@@ -900,20 +897,43 @@
this.audioPath = "";
},
// 鐐瑰嚮闊抽鎾斁锛屽叧闂叾浠栭煶棰�
- closeAudio(path) {
- let allVideo = (
+ closeAudio() {
+ let allAudio = (
this.container ? this.container : document
).querySelectorAll(".audio");
- allVideo = Array.from(allVideo);
- if(allVideo.length) {
- for (let index = 0; index < allVideo.length; index++) {
- const item = allVideo[index];
- if(item.currentSrc != path) {
- item.pause()
+ 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()
+ })
}
- 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()
+ }
+ }
+ })
+ }
}
},
components: {
diff --git a/src/books/artAndDrama/view/components/chapter001.vue b/src/books/artAndDrama/view/components/chapter001.vue
index af294c1..37d628f 100644
--- a/src/books/artAndDrama/view/components/chapter001.vue
+++ b/src/books/artAndDrama/view/components/chapter001.vue
@@ -48,7 +48,7 @@
@play="audioPlay"></audio> -->
</h1>
<!-- 杩炵嚎棰� -->
- <matching :rawData="rawData" :question="question" class="macthing" :primary-color="color"></matching>
+ <matching :rawData="rawData" :question="question" class="macthing" :primary-color="color" :bordercolor="'#fff'"></matching>
<p class="text">灏忔彁绀猴細鍔犵偣鐨勬枃瀛椾负鏈彞璇濅腑鐨勯�昏緫閲嶉煶锛屽湪鏈楄鍙戦煶鏃惰閲嶈銆�</p>
</div>
<p><br /></p>
@@ -417,7 +417,7 @@
videoPathOne: "",
auidoPathOne: "",
auidoPathTwo: "",
- auidoPathThree: "",
+ auidoPathThree:"",
auidoPathFour: "",
auidoPathFive: "",
auidoPathSex: "",
diff --git a/src/books/artAndDrama/view/components/chapter002.vue b/src/books/artAndDrama/view/components/chapter002.vue
index b149deb..391dfde 100644
--- a/src/books/artAndDrama/view/components/chapter002.vue
+++ b/src/books/artAndDrama/view/components/chapter002.vue
@@ -97,8 +97,8 @@
class="input-bottom-border fz-18" @change="setBookQuestion" style="width: 15%" />銆�</p>
<h3 class="lefth3" id="c014" style="margin-top: 7%;"><img class="img-gn1" alt=""
src="../../assets/images/czysj.jpg" /></h3>
- <p class="text"><span class="hs1">鈼�</span>闃呰涓嬮潰鐨勬枃瀛楋紝涓哄皬铓傝殎閫夋嫨涓�绉嶆�ф牸鍚с��</p>
- <drag :question="dragQuestion" :page="16" class="drag-text" />
+ <!-- <p class="text"><span class="hs1">鈼�</span>闃呰涓嬮潰鐨勬枃瀛楋紝涓哄皬铓傝殎閫夋嫨涓�绉嶆�ф牸鍚с��</p> -->
+ <drag :question="dragQuestion" :page="16" class="drag-text"/>
<!-- <choice class="text" :questions="questions" :primaryColor="accentColor" hoverBackgroundColor="green" hoverColor="white"></choice> -->
<p class="center openImgBox"><img class="img-e" alt="" src="../../assets/images/2-2.gif" /></p>
</div>
@@ -536,7 +536,7 @@
}
.drag-text {
- margin: 0 6%;
+ margin: 0 4%;
font-family: "STKaiti";
font-size: 19px;
}
diff --git a/src/books/artAndDrama/view/components/chapter003.vue b/src/books/artAndDrama/view/components/chapter003.vue
index 0c0f667..f221438 100644
--- a/src/books/artAndDrama/view/components/chapter003.vue
+++ b/src/books/artAndDrama/view/components/chapter003.vue
@@ -73,7 +73,7 @@
<p class="center openImgBox"><img class="img-e" alt="" src="../../assets/images/3-2.gif" /></p>
<p class="text"><span class="hs1">鈼�</span>璇锋妸铓傝殎闃熼暱鐨勫彴璇嶅拰浠栫殑鍐呭績鐙櫧杩炶捣鏉ュ惂锛�</p>
<!-- 杩炵嚎棰� -->
- <matching :rawData="rawData" :question="question" class="macthing" :primaryColor="'transparent'" :bordercolor="'transparent'">
+ <matching :rawData="rawData" :question="question" class="macthing" :primaryColor="'transparent'" :bordercolor="'transparent'" >
</matching>
</div>
<!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
diff --git a/src/books/artAndDrama/view/components/index.vue b/src/books/artAndDrama/view/components/index.vue
index 49347fa..ea7ad88 100644
--- a/src/books/artAndDrama/view/components/index.vue
+++ b/src/books/artAndDrama/view/components/index.vue
@@ -155,8 +155,8 @@
}, 500);
// 娴嬭瘯椤甸潰璺宠浆
- setTimeout(() => {
- this.gotoPage(2,6);
+ // setTimeout(() => {
+ // this.gotoPage(2,6);
// setTimeout(() => {
// this.renderSign("Highlight", {
// id: "2ACA9359",
@@ -184,7 +184,7 @@
// txt: " 杩愬姩绯荤粺鏄敱楠ㄣ�侀杩炵粨鍜岄楠艰倢涓夐儴鍒嗙粍鎴愮殑銆傚叏韬殑楠ㄩ�氳繃楠ㄨ繛缁撶粍鎴愪汉浣撻楠硷紙瑙佸浘1-1锛夈�傞楠兼槸浜轰綋鐨勬敮鏋讹紝鍏锋湁淇濇姢鍐呰剰鍣ㄥ畼銆佷緵鑲岃倝闄勭潃鍜屼綔涓鸿倢鑲夎繍鍔ㄧ殑鏉犳潌绛変綔鐢ㄣ�傚湪绁炵粡绯荤粺鐨勬敮閰嶄笅锛岃倢鑲夋敹缂╃壍鍔ㄦ墍闄勭潃鐨勯缁曠潃鍏宠妭杞姩锛屼娇韬綋浜х敓鍚勭鍔ㄤ綔銆傛墍浠ワ紝杩愬姩绯荤粺鍏锋湁杩愬姩銆佹敮鎸佸拰淇濇姢绛夊姛鑳斤紝骞煎勾鏃舵湡鐨勯楠艰繕鍏锋湁閫犺鍔熻兘銆� ",
// txtIndex: 57
// });
- }, 500);
+ // }, 500);
},
methods: {
// setZoom1() {
diff --git a/src/books/childHealth/view/content/components/chapter0004.vue b/src/books/childHealth/view/content/components/chapter0004.vue
index 818446d..040ba07 100644
--- a/src/books/childHealth/view/content/components/chapter0004.vue
+++ b/src/books/childHealth/view/content/components/chapter0004.vue
@@ -330,7 +330,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ヤ綋閲嶇殑娴嬮噺</p>
</div>
@@ -384,7 +383,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ヨ韩楂樼殑娴嬮噺</p>
</div>
@@ -424,7 +422,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ュご鍥寸殑娴嬮噺</p>
</div>
@@ -473,7 +470,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ヨ兏鍥寸殑娴嬮噺</p>
</div>
@@ -757,7 +753,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ョ殑鍋ュ悍妫�鏌�</p>
</div>
@@ -1256,7 +1251,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬効绔ョ粯浜烘祴璇�</p>
</div>
@@ -1602,9 +1596,6 @@
gotoLabel(id) {
(this.container ? this.container : document).getElementById(id).scrollIntoView()
},
- videoPlay(e) {
- this.$emit('closeVideo',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/childHealth/view/content/components/chapter001.vue b/src/books/childHealth/view/content/components/chapter001.vue
index 239aaef..303f3d8 100644
--- a/src/books/childHealth/view/content/components/chapter001.vue
+++ b/src/books/childHealth/view/content/components/chapter001.vue
@@ -323,7 +323,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
</span>
<span class="span-border"></span>
@@ -417,7 +416,6 @@
controls
controlslist="nodownload"
class="video-box video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氶楠�</p>
<h5 id="e001">1.楠ㄧ敓闀胯繀閫�</h5>
@@ -1028,7 +1026,6 @@
controlslist="nodownload"
style="margin-top: 20px"
class="video-border w100 video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ュ懠鍚搁亾鐨勯槻寰＄壒鐐逛笌淇濆仴</p>
</div>
@@ -1489,7 +1486,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ュ績銆佽绠＄殑鐗圭偣鍙婁繚鍋�</p>
</div>
@@ -1970,7 +1966,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ョ墮榻跨殑鐢熺悊鐗圭偣鍙婁繚鍋�</p>
</div>
@@ -3046,7 +3041,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ュ唴鍒嗘硨绯荤粺鐨勭敓鐞嗙壒鐐逛笌淇濆仴</p>
</div>
@@ -3447,7 +3441,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
</p>
<p class="img">瑙嗛锛氬鍓嶅効绔ュぇ鑴戠殑鐢熺悊鐗圭偣鍙婁繚鍋�</p>
@@ -3970,7 +3963,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ョ溂鐨勭敓鐞嗙壒鐐逛笌淇濆仴</p>
</div>
@@ -4075,7 +4067,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ヨ�崇殑鐗圭偣鍙婁繚鍋�</p>
</div>
@@ -4282,7 +4273,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ョ毊鑲ょ殑鐗圭偣涓庝繚鍋�</p>
</div>
@@ -4983,9 +4973,6 @@
JSON.stringify(this.chapterOneData)
);
},
- videoPlay(e) {
- this.$emit('closeVideo',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/childHealth/view/content/components/chapter002.vue b/src/books/childHealth/view/content/components/chapter002.vue
index 7e0ff2d..0c794eb 100644
--- a/src/books/childHealth/view/content/components/chapter002.vue
+++ b/src/books/childHealth/view/content/components/chapter002.vue
@@ -303,7 +303,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬効绔ュ悇闃舵鐨勭壒鐐瑰拰淇濆仴瑕佺偣</p>
</div>
@@ -638,7 +637,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氱敓闀垮彂鑲茬殑鈥滈搧鈥濊寰�</p>
</div>
@@ -809,7 +807,7 @@
</div>
<div class="padding-96">
<div class="fieldset">
- <p class="t0">鑳為棿鐩镐簰渚濆瓨鐨勫姩鎬佸叧绯诲彂鐢熶綔鐢ㄣ��</p>
+ <p class="t0 block">鑳為棿鐩镐簰渚濆瓨鐨勫姩鎬佸叧绯诲彂鐢熶綔鐢ㄣ��</p>
<p class="block">
浜虹被澶ц剳鐨眰涓紝2宀佸墠绐佽Е浜х敓鏁扮洰澶氫簬鎴愬勾锛屽湪浠ュ悗10骞村唴閫愭笎鍑忓皯锛岃繖鍙兘涓庡彂鑲茶繃绋嬩腑涓�浜涢暱鏈熷緱涓嶅埌鍒烘縺鐨勬棤鍔熻兘绁炵粡缁嗚優閫愭笎鍑嬩骸鏈夊叧銆�
</p>
@@ -1032,7 +1030,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
</div>
</div>
@@ -1508,9 +1505,6 @@
JSON.stringify(this.chapterTwoData)
);
},
- videoPlay(e) {
- this.$emit('closeVideo',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/childHealth/view/content/components/chapter003.vue b/src/books/childHealth/view/content/components/chapter003.vue
index bbff559..b821ff2 100644
--- a/src/books/childHealth/view/content/components/chapter003.vue
+++ b/src/books/childHealth/view/content/components/chapter003.vue
@@ -547,7 +547,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬奖鍝嶅鍓嶅効绔ュ績鐞嗗彂灞曠殑鍥犵礌</p>
</div>
@@ -1076,7 +1075,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氳繃搴︿緷璧�</p>
</div>
@@ -1197,7 +1195,6 @@
controls
controlslist="nodownload"
class="video-border w100 video"
- @play="videoPlay"
></video>
</p>
<p class="img">瑙嗛锛氳嚜鎱�</p>
@@ -1563,7 +1560,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氳█璇強璇█鍙戣偛闅滅</p>
</div>
@@ -1610,7 +1606,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氭�庢牱鍙戠幇瀛╁瓙鍙戣偛杩熺紦</p>
</div>
@@ -1724,7 +1719,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬効绔ュ鍔ㄧ棁</p>
</div>
@@ -2168,9 +2162,6 @@
gotoLabel(id) {
(this.container ? this.container : document).getElementById(id).scrollIntoView()
},
- videoPlay(e) {
- this.$emit('closeVideo',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/childHealth/view/content/components/chapter005.vue b/src/books/childHealth/view/content/components/chapter005.vue
index 7f390d6..a494a23 100644
--- a/src/books/childHealth/view/content/components/chapter005.vue
+++ b/src/books/childHealth/view/content/components/chapter005.vue
@@ -444,7 +444,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氳惀鍏荤礌</p>
</div>
@@ -1600,7 +1599,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氫钩鍎胯緟鍔╅鍝佺殑娣诲姞</p>
</div>
@@ -1908,7 +1906,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ヨ喅椋熺殑閰嶅埗鍘熷垯</p>
</div>
@@ -2106,7 +2103,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬効绔ラギ椋熶範鎯殑鍩瑰吇</p>
</div>
@@ -2933,9 +2929,6 @@
gotoLabel(id) {
(this.container ? this.container : document).getElementById(id).scrollIntoView()
},
- videoPlay(e) {
- this.$emit('closeVideo',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/childHealth/view/content/components/chapter006.vue b/src/books/childHealth/view/content/components/chapter006.vue
index 98e262f..68dbcc3 100644
--- a/src/books/childHealth/view/content/components/chapter006.vue
+++ b/src/books/childHealth/view/content/components/chapter006.vue
@@ -840,7 +840,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氭柊鐢熷効鐗圭偣涓庝繚鍋�</p>
</div>
@@ -1147,7 +1146,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氶噸瑙嗘柊鐢熷効鐤剧梾绛涙煡</p>
</div>
@@ -1229,7 +1227,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氭棭浜у効鐨勭壒鐐逛笌淇濆仴</p>
</div>
@@ -2313,7 +2310,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬辜鍎挎湡鐨勭壒鐐逛笌淇濆仴</p>
</div>
@@ -2965,9 +2961,6 @@
gotoLabel(id) {
(this.container ? this.container : document).getElementById(id).scrollIntoView()
},
- videoPlay(e) {
- this.$emit('closeVideo',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/childHealth/view/content/components/chapter007.vue b/src/books/childHealth/view/content/components/chapter007.vue
index 61d378d..2c43cb6 100644
--- a/src/books/childHealth/view/content/components/chapter007.vue
+++ b/src/books/childHealth/view/content/components/chapter007.vue
@@ -239,7 +239,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氱柧鐥呭熀纭�</p>
</div>
@@ -640,7 +639,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氶仐浼犵梾銆佸嚭鐢熺己闄蜂笌浼樼敓</p>
</div>
@@ -1391,7 +1389,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ュ父瑙佺柧鐥呪�斺�旇偉鑳栫棁</p>
</div>
@@ -1516,7 +1513,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛涓冿細瀛﹀墠鍎跨甯歌鐤剧梾鈥斺�旂淮鐢熺礌D缂轰箯鎬т綕鍋荤梾</p>
</div>
@@ -1623,7 +1619,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ュ父瑙佺柧鐥呪�斺�旂己閾佹�ц传琛�</p>
</div>
@@ -1691,7 +1686,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ュ父瑙佺柧鐥呪�斺�斾笂鍛煎惛閬撴劅鏌�</p>
</div>
@@ -1840,7 +1834,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ュ父瑙佺柧鐥呪�斺�旈緥榻�</p>
</div>
@@ -1921,7 +1914,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ュ父瑙佺柧鐥呪�斺�斾腑鑰崇値</p>
</div>
@@ -1968,7 +1960,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ュ父瑙佺柧鐥呪�斺�斿急瑙�</p>
</div>
@@ -2317,7 +2308,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氫紶鏌撶梾鍩虹鐭ヨ瘑鈥斺�旂壒鎬т笌涓変釜鐜妭</p>
</div>
@@ -2537,7 +2527,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氫紶鏌撶梾鍙婂叾棰勯槻鈥斺�旂柅鑻�</p>
</div>
@@ -3172,7 +3161,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氫紶鏌撶梾鍙婂叾棰勯槻鈥斺�旂媯鐘梾</p>
</div>
@@ -3296,7 +3284,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬鍓嶅効绔ュ父瑙佸瘎鐢熻櫕鐥呪�斺�旇洸铏梾</p>
</div>
@@ -3834,7 +3821,7 @@
this.pathThree = await getResourcePath("79aa2ccd431dcc000dbe2962ded4397c");
this.pathFour = await getResourcePath("94654e3d22604a815f9f4558616d8f39");
this.pathFive = await getResourcePath("2373520e42d1be7bb70fbd5729d2f860");
- this.pathSix = await getResourcePath("bf7cabfb18771490b5cbb2eebdf424a3");
+ this.pathSix = await getResourcePath("dac5587e1f5e51b67f221773b04c1aed");
this.pathSeven = await getResourcePath("99a137c537d757a6ee39e6888218ca7c");
this.pathEight = await getResourcePath("9a1e8e3374e3bdf82a5066ead76398ef");
this.pathNine = await getResourcePath("7ae6133d91e84c4ea5c96d5d4ac62fb9");
@@ -3852,9 +3839,6 @@
gotoLabel(id) {
(this.container ? this.container : document).getElementById(id).scrollIntoView()
},
- videoPlay(e) {
- this.$emit('closeVideo',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/childHealth/view/content/components/chapter008.vue b/src/books/childHealth/view/content/components/chapter008.vue
index 3d3676b..256dd23 100644
--- a/src/books/childHealth/view/content/components/chapter008.vue
+++ b/src/books/childHealth/view/content/components/chapter008.vue
@@ -334,7 +334,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氫綋娓╂祴閲�</p>
</div>
@@ -388,7 +387,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氱墿鐞嗛檷娓�</p>
</div>
@@ -475,7 +473,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">
瑙嗛锛氬鍓嶅効绔ュ父鐢ㄧ殑鎶ょ悊涓庢�ユ晳鎶�鏈�斺�斿効绔ョ瀛︾敤鑽寚鍗�
@@ -596,7 +593,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氭榧昏</p>
</div>
@@ -1015,7 +1011,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬紓鐗╃殑澶勭悊</p>
</div>
@@ -1057,7 +1052,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氶奔鍒哄崱鍠夌殑澶勭悊</p>
</div>
@@ -1221,7 +1215,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氭儕鍘ャ�佹檿鍘ャ�佷紤鍏嬬殑澶勭悊</p>
</div>
@@ -1388,7 +1381,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氶鎶樹笌鑴变綅</p>
</div>
@@ -1475,7 +1467,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬績鑲哄鑻�</p>
</div>
@@ -1936,7 +1927,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬辜鍎垮洯瀹夊叏鏁欒偛</p>
</div>
@@ -2596,9 +2586,6 @@
this.$data.pathNine = await getResourcePath("bf45a94562ab237da0ef65ba33631022");
this.$data.pathTen = await getResourcePath("f7b5594f23b2ded96e15b99c296be54d");
},
- videoPlay(e) {
- this.$emit('closeVideo',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/childHealth/view/content/components/chapter009.vue b/src/books/childHealth/view/content/components/chapter009.vue
index 75d0e96..7606c94 100644
--- a/src/books/childHealth/view/content/components/chapter009.vue
+++ b/src/books/childHealth/view/content/components/chapter009.vue
@@ -306,7 +306,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬姩鍔涘畾鍨嬪強鍏跺舰鎴�</p>
</div>
@@ -595,7 +594,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氫竷姝ユ礂鎵嬫硶</p>
</div>
@@ -630,7 +628,7 @@
/>
浜戞祴璇�
</h6>
- <p class="blockh6-c center">
+ <p class="blockh6-c">
<span class="img center dl-bl w100">涓撻涔� 瀛︿範涓婚涓�</span>
<examinations
v-if="questionData"
@@ -996,7 +994,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氭櫒闂存鏌�</p>
</div>
@@ -1058,7 +1055,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氶闃叉帴绉�</p>
</div>
@@ -1272,7 +1268,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氫紶鏌撶梾鍩虹鐭ヨ瘑鈥斺�旈殧绂�</p>
</div>
@@ -1328,7 +1323,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氫紶鏌撶梾鍩虹鐭ヨ瘑鈥斺�旀秷姣�</p>
</div>
@@ -1463,7 +1457,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氱幆澧冨崼鐢熷埗搴︿笌鍗敓淇濆仴鐧昏銆佺粺璁″埗搴�</p>
</div>
@@ -1900,9 +1893,6 @@
"960e9aa17b48e900b08cde6e44b774f3"
);
},
- videoPlay(e) {
- this.$emit('closeVideo',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/childHealth/view/content/components/chapter010.vue b/src/books/childHealth/view/content/components/chapter010.vue
index 1331d97..4e0cdee 100644
--- a/src/books/childHealth/view/content/components/chapter010.vue
+++ b/src/books/childHealth/view/content/components/chapter010.vue
@@ -366,7 +366,7 @@
</p>
<div class="annotation-border"></div>
<p class="note" id="childTen-labelOne">
- <a id="m1"></a><a href="chapter010.html#w1">[1]</a>
+ <a id="m1"></a><a href="javascript: void(0)">[1]</a>
鎽樿嚜銆婂辜鍎垮洯寤鸿鏍囧噯銆嬶紙寤烘爣175鈥�2016锛夈��
</p>
</div>
@@ -424,7 +424,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬辜鍎垮洯鍚勫閰嶇疆鐨勫崼鐢熻姹�</p>
</div>
@@ -1092,7 +1091,6 @@
controls
controlslist="nodownload"
class="w100 video-border video"
- @play="videoPlay"
></video>
<p class="img">瑙嗛锛氬辜鍎垮洯鏂囧叿鍜屾暀鐜╁叿鍗敓</p>
</div>
@@ -1493,9 +1491,6 @@
gotoLabel(id) {
(this.container ? this.container : document).getElementById(id).scrollIntoView()
},
- videoPlay(e) {
- this.$emit('closeVideo',e.srcElement.currentSrc)
- }
},
};
</script>
diff --git a/src/books/childHealth/view/content/index.vue b/src/books/childHealth/view/content/index.vue
index cc40f13..0b2d947 100644
--- a/src/books/childHealth/view/content/index.vue
+++ b/src/books/childHealth/view/content/index.vue
@@ -21,61 +21,51 @@
v-if="showCatalogList.indexOf(2) > -1"
:showPageList="loadPageList"
:questionData="questionDataMap"
- @closeVideo="closeVideo"
></chapterOne>
<chapterTwo
v-if="showCatalogList.indexOf(3) > -1"
:showPageList="loadPageList"
:questionData="questionDataMap"
- @closeVideo="closeVideo"
></chapterTwo>
<chapterThree
v-if="showCatalogList.indexOf(4) > -1"
:showPageList="loadPageList"
:questionData="questionDataMap"
- @closeVideo="closeVideo"
></chapterThree>
<chapterFour
v-if="showCatalogList.indexOf(5) > -1"
:showPageList="loadPageList"
:questionData="questionDataMap"
- @closeVideo="closeVideo"
></chapterFour>
<chapterFive
v-if="showCatalogList.indexOf(6) > -1"
:showPageList="loadPageList"
:questionData="questionDataMap"
- @closeVideo="closeVideo"
></chapterFive>
<chapterSix
v-if="showCatalogList.indexOf(7) > -1"
:showPageList="loadPageList"
:questionData="questionDataMap"
- @closeVideo="closeVideo"
></chapterSix>
<chapterSeven
v-if="showCatalogList.indexOf(8) > -1"
:showPageList="loadPageList"
:questionData="questionDataMap"
- @closeVideo="closeVideo"
></chapterSeven>
<chapterEight
v-if="showCatalogList.indexOf(9) > -1"
:showPageList="loadPageList"
:questionData="questionDataMap"
- @closeVideo="closeVideo"
></chapterEight>
<chapterNine
v-if="showCatalogList.indexOf(10) > -1"
:showPageList="loadPageList"
:questionData="questionDataMap"
- @closeVideo="closeVideo"
></chapterNine>
<chapterTen
v-if="showCatalogList.indexOf(11) > -1"
:showPageList="loadPageList"
:questionData="questionDataMap"
- @closeVideo="closeVideo"
></chapterTen>
<chapterEleven
v-if="showCatalogList.indexOf(12) > -1"
@@ -167,6 +157,7 @@
setTimeout(() => {
this.initSwiper();
this.initViewer();
+ this.closeVideo()
}, 200);
}
},
@@ -238,7 +229,7 @@
// 娴嬭瘯椤甸潰璺宠浆
// setTimeout(() => {
- // this.gotoPage(1,10);
+ // this.gotoPage(8,175);
// setTimeout(() => {
// this.renderSign("Highlight", {
// id: "2ACA9359",
@@ -907,18 +898,23 @@
// 璺宠浆
this.gotoPage(data.catalog, data.page, () => {});
},
- closeVideo(path) {
+ // 鐐瑰嚮瑙嗛鍏抽棴鍏朵粬
+ closeVideo() {
let allVideo = (
this.container ? this.container : document
).querySelectorAll(".video");
- allVideo = Array.from(allVideo);
- if(allVideo.length) {
- for (let index = 0; index < allVideo.length; index++) {
- const item = allVideo[index];
- if(item.currentSrc != path) {
- item.pause()
+ 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()
+ }
}
- }
+ })
}
}
},
diff --git a/src/books/mathBook/view/components/chapter001.vue b/src/books/mathBook/view/components/chapter001.vue
index 13c1ab5..a7f9230 100644
--- a/src/books/mathBook/view/components/chapter001.vue
+++ b/src/books/mathBook/view/components/chapter001.vue
@@ -575,10 +575,6 @@
</div>
</div>
</div>
- <!-- <div class="page-box padding-116" page="10">
- <drag :question="dragQuestion" :page="10"/>
- <graffiti style="width:100%" />
- </div> -->
<!-- 鍑芥暟鎺т欢寮圭獥 -->
<el-dialog
:visible.sync="dialogVisible"
@@ -823,11 +819,9 @@
import examinations from "@/components/examinations/index.vue";
import { getResourcePath } from "@/assets/methods/resources";
import { getCollectResource,setCollectResource } from "@/assets/methods/resources";
-import drag from '@/components/dragQuestion/index.vue'
-import graffiti from "@/components/graffiti/index.vue"
export default {
name: "chapter-one",
- components: { examinations,drag,graffiti },
+ components: { examinations },
props: {
showPageList: {
type: Array,
diff --git a/src/components/dragQuestion/index.vue b/src/components/dragQuestion/index.vue
index f3d8d04..ddeca7d 100644
--- a/src/components/dragQuestion/index.vue
+++ b/src/components/dragQuestion/index.vue
@@ -1,5 +1,28 @@
<template>
- <div class="drag-box">
+ <div class="drag-box" :style="{ borderColor: bcColor }">
+ <div class="title-box">
+ <p class="text" style="text-indent:2em !important"><span class="hs1">鈼�</span>{{ titileText }}</p>
+ <span class="svg-btn t0" @mouseenter="mouseenterTitle" @mouseleave="mouseleaveTitle">
+ <p class="p-title" v-if="ishowTitle">璇锋嫋鎷界瓟妗堝埌鎷彿閲屽惂</p>
+ <svg
+ t="1719309984490"
+ class="icon"
+ viewBox="0 0 1024 1024"
+ version="1.1"
+ xmlns="http://www.w3.org/2000/svg"
+ p-id="6316"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ width="20"
+ height="20"
+ >
+ <path
+ d="M510.66571776 2.32285525c281.13999758 0.03143566 510.59693795 229.62226973 510.04273323 510.34079346-0.55769771 281.76056661-229.64788451 510.68426013-510.37339307 509.99849074-281.55681565-0.68693447-509.37908565-228.64309817-509.75166009-510.05321216C0.20965945 231.71226624 229.53852701 2.29141959 510.66571776 2.32285525zM972.54389419 512.41565298C972.50314354 258.01834837 766.47298389 51.25351879 510.91837042 50.72958578c-254.73844338-0.52160398-461.85256163 206.22576071-462.11918507 461.70003911-0.26545949 254.42175431 206.44814165 460.98865493 461.56614428 461.71517497C764.4715611 974.86899086 972.5846437 766.95849529 972.54389419 512.41565298zM539.07335282 677.31941831c-21.78046749 0-42.9799515 0-64.78370475 0 0-12.93997511-0.69159139-25.64243456 0.14553657-38.24359993 1.68939179-25.44566841 7.57490347-49.85162069 20.87115321-72.0221275 10.34708992-17.25368889 23.52341675-32.14269326 38.16209863-45.82548935 18.18046691-16.99288633 36.5774939-33.76688469 54.39702926-51.13118151 10.49262649-10.22367517 19.81863026-21.62794496 24.66675485-35.82070101 11.61384277-34.00090851 4.18913394-64.36339485-18.43079054-91.405312-37.56481536-44.90802403-100.39250489-46.44605838-138.86663567-23.96934258-24.24993792 14.16597845-38.78965362 35.84282283-47.27736433 61.9113893-3.80491662 11.68719417-6.43273045 23.75744057-9.84295083 36.5856438-22.35912192-2.65459257-45.24566983-5.3720576-68.99030357-8.19081558 0.88602851-5.92276935 1.52056946-11.49159197 2.57425635-16.9800795 5.91229042-30.78861824 16.59935403-59.50246343 36.69741568-84.13079666 24.48396061-30.00271872 56.38215225-47.47180259 93.95744654-54.68344547 39.22044359-7.527168 78.41527125-6.71448974 116.55641316 5.67360967 48.83402752 15.86002717 84.96908857 46.85006848 101.39030641 96.21501497 15.76571904 47.39379427 8.01966421 92.16443165-23.01345564 132.15913187-19.68590051 25.37115307-44.16869717 45.98383275-67.17633194 68.0751673-10.12121714 9.71837099-20.36119211 19.49728541-29.15278394 30.3741292-13.05873294 16.15459442-18.04308025 35.69262933-19.61720718 56.12134969C540.4507136 653.56547072 539.84644437 665.12226418 539.07335282 677.31941831zM470.0818853 814.35345351c0-25.59353401 0-50.94023737 0-76.69910073 25.64359851 0 50.98447986 0 76.7526582 0 0 25.51552569 0 50.86921501 0 76.69910073C521.33997454 814.35345351 495.85239154 814.35345351 470.0818853 814.35345351z"
+ p-id="6317"
+ ></path>
+ </svg>
+
+ </span>
+ </div>
<div
v-for="(item, index) in drageQuestion"
:key="item.id"
@@ -18,41 +41,41 @@
{{ item.userAnswer[ditem.num].txt }}
<span>
<svg
- v-if="getItemRight(index,ditem.num)"
- 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="getItemRight(index,ditem.num) == 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>
+ v-if="getItemRight(index, ditem.num)"
+ 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="getItemRight(index, ditem.num) == 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>
</span>
</span>
@@ -61,7 +84,14 @@
<!-- 閫夐」 -->
<ul class="option-box">
<li v-for="(citem, cindex) in item.option" :key="cindex">
- <span class="drag-option" @mousedown="mousedown" v-show="item.userAnswer.findIndex(eitem => eitem.value == citem.value) == -1"
+ <span
+ class="drag-option"
+ @mousedown="mousedown"
+ v-show="
+ item.userAnswer.findIndex(
+ (eitem) => eitem.value == citem.value
+ ) == -1
+ "
>{{ citem.value }}銆亄{ citem.txt }}</span
>
</li>
@@ -94,14 +124,20 @@
style="margin-left: 20px"
>
<span>鎮ㄧ殑绛旀锛�</span>
- <span
- class="errorBox"
- v-if="item.userAnswer.length"
+ <span class="errorBox" v-if="item.userAnswer.length">
+ <span
+ v-for="(answerItem, answerIdnex) in item.userAnswer"
+ :key="answerIdnex"
+ >{{ answerItem.value
+ }}<span
+ v-if="
+ answerIdnex !== item.userAnswer.length - 1 &&
+ answerItem.value
+ "
+ >,</span
+ ></span
>
- <span v-for="(answerItem,answerIdnex) in item.userAnswer" :key="answerIdnex">{{answerItem.value}}<span v-if="answerIdnex !== item.userAnswer.length - 1 && answerItem.value">,</span></span>
-
- </span
- >
+ </span>
</p>
</div>
<p class="difficulty" v-if="item.difficulty">
@@ -192,6 +228,14 @@
page: {
type: Number,
},
+ bcColor: {
+ type: String,
+ default: "#8fae34",
+ },
+ titileText: {
+ type: String,
+ default: "闃呰涓嬮潰鐨勬枃瀛楋紝涓哄皬铓傝殎閫夋嫨涓�绉嶆�ф牸鍚с��",
+ },
},
watch: {
question: {
@@ -200,7 +244,7 @@
this.config.activeBook.name + "-drag-" + this.page
);
if (oldAnswer) {
- this.submitState = true
+ this.submitState = true;
oldAnswer = JSON.parse(oldAnswer);
for (let index = 0; index < newValue.length; index++) {
// 鏃х瓟妗堣祴鍊�
@@ -232,24 +276,24 @@
maxX: null,
maxY: null,
spaceList: [],
- submitState:false,
- isLift:false
+ submitState: false,
+ isLift: false,
+ ishowTitle:false
};
},
- mounted() {
- },
+ mounted() {},
methods: {
// 1.閫夐」鎷栨嫿
// 2.闄愬埗鎷栨嫿绉诲姩鍙兘鍦ㄩ鑼冨洿鍐�
// 3.闄愬埗榧犳爣鏉惧紑瑕佸湪绌烘牸鐨勮寖鍥村唴
mousedown(e) {
e.preventDefault();
- if(this.submitState) return false
- this.isLift = false
+ if (this.submitState) return false;
+ this.isLift = false;
this.moveDom = e.toElement;
this.parentDom = this.getParentWithClass(e.toElement, "question-box");
this.questionIndex = this.parentDom.getAttribute("num");
- if(!this.spaceList.length) this.getSpaceInfo(this.parentDom);
+ if (!this.spaceList.length) this.getSpaceInfo(this.parentDom);
const parentInfo = this.parentDom.getBoundingClientRect();
this.parentX = parentInfo.x;
this.parentY = parentInfo.y;
@@ -263,14 +307,14 @@
// 闄愬埗鍦ㄦ棰樿寖鍥村唴鎷栧姩
if (e.x <= this.maxX && e.y < this.maxY) {
const moveX = e.x - this.parentX;
- const moveY = e.y - this.parentY;
+ const moveY = e.y - this.parentY + 40;
this.moveDom.style.left = moveX + "px";
this.moveDom.style.top = moveY + "px";
// 濡傛灉杩樻湁鏈夌┖鏍�
if (this.spaceList.length) {
for (let index = 0; index < this.spaceList.length; index++) {
let item = this.spaceList[index];
- if(!item) return false
+ if (!item) return false;
if (
e.x >= item.minX &&
e.x <= item.maxX &&
@@ -278,22 +322,22 @@
e.y <= item.maxY
) {
// 濡傛灉绉诲姩鍒扮┖鏍艰寖鍥村唴,涓旈紶鏍囨姮璧峰悗,灏嗙瓟妗堝～鍏ョ┖鏍�,骞跺皢璇ョ┖鏍肩殑鏁版嵁娓呯┖(绌烘牸涓嶈兘鍒犻櫎,鍙兘娓呯┖,鍚﹀垯瀵艰嚧鏁扮粍绱㈠紩鏀瑰彉,涓嶈兘姝ｇ‘鍐欏叆鍒版寚瀹氱┖鏍间腑)
- if(!this.isLift) return false
+ if (!this.isLift) return false;
this.$set(
this.drageQuestion[this.questionIndex].userAnswer,
index,
{
- value:this.moveDom.textContent.charAt(0),
- txt:this.moveDom.textContent.slice(2)
+ value: this.moveDom.textContent.charAt(0),
+ txt: this.moveDom.textContent.slice(2),
}
);
- if(this.drageQuestion[this.questionIndex].userAnswer[index]) {
+ if (this.drageQuestion[this.questionIndex].userAnswer[index]) {
this.moveDom.style.display = "none";
this.moveDom = null;
- this.$set(this.spaceList,index,{})
+ this.$set(this.spaceList, index, {});
}
} else {
- if(this.isLift && this.moveDom) {
+ if (this.isLift && this.moveDom) {
// 鍦ㄩ潪绌烘牸鍖哄煙鎶捣榧犳爣
this.moveDom.style.position = "";
this.moveDom.style.left = "0px";
@@ -308,22 +352,20 @@
mouseup(e) {
if (this.moveDom) {
// this.moveDom = null;
-
}
- this.isLift = true
-
+ this.isLift = true;
},
// 鑾峰彇棰樼洰绌烘牸鍧愭爣
getSpaceInfo(parentDom) {
let arr = [];
const list = parentDom.querySelectorAll(".space");
-
+
for (let index = 0; index < list.length; index++) {
const itemInfo = list[index].getBoundingClientRect();
arr.push({
minX: itemInfo.x,
maxX: itemInfo.x + itemInfo.width,
- minY: itemInfo.y + 3 ,
+ minY: itemInfo.y + 3,
maxY: itemInfo.y + itemInfo.height,
});
}
@@ -355,51 +397,49 @@
},
// 鎻愪氦
submitData() {
- this.submitState = true
+ this.submitState = true;
let arr = [];
const data = this.drageQuestion;
for (let index = 0; index < data.length; index++) {
const item = data[index];
for (let cindex = 0; cindex < item.userAnswer.length; cindex++) {
let citem = item.userAnswer[cindex];
- arr[cindex] = citem.value
+ arr[cindex] = citem.value;
}
- item.isRight = JSON.stringify(arr) == JSON.stringify(item.answer)
- item.isComplete = true
+ item.isRight = JSON.stringify(arr) == JSON.stringify(item.answer);
+ item.isComplete = true;
}
},
redio() {
- this.submitState = false
+ this.submitState = false;
localStorage.removeItem(
this.config.activeBook.name + "-drag-" + this.page
);
- let arr = []
+ let arr = [];
// const data = []
for (let index = 0; index < this.drageQuestion.length; index++) {
const item = this.drageQuestion[index];
- item.isComplete = false
- item.isRight = null
+ item.isComplete = false;
+ item.isRight = null;
for (let cindex = 0; cindex < item.option.length; cindex++) {
const citem = item.option[cindex];
- arr.push(
- {
- txt:'',
- value:''
- }
- )
+ arr.push({
+ txt: "",
+ value: "",
+ });
}
- item.userAnswer = arr
+ item.userAnswer = arr;
}
const optionList = (
this.container ? this.container : document
).querySelectorAll(".drag-option");
for (let index = 0; index < optionList.length; index++) {
const item = optionList[index];
- item.style.position = null
- item.style.top = null
- item.style.left = null
+ item.style.position = null;
+ item.style.top = null;
+ item.style.left = null;
}
- this.spaceList = []
+ this.spaceList = [];
},
seeAnswer() {
for (let index = 0; index < this.drageQuestion.length; index++) {
@@ -439,17 +479,25 @@
}
},
// 鏄剧ず瀵归敊鏂规硶
- getItemRight(num,number) {
- if(!this.submitState) return null
- let flag = null
- const item = this.question[num]
- console.log(item,num,number);
- const answer = item.answer[number]
- const userAns = item.userAnswer[number].value
- if(answer && userAns) {
- flag = answer == userAns
- }
- return flag
+ getItemRight(num, number) {
+ if (!this.submitState) return null;
+ let flag = null;
+ const item = this.question[num];
+ console.log(item, num, number);
+ const answer = item.answer[number];
+ const userAns = item.userAnswer[number].value;
+ if (answer && userAns) {
+ flag = answer == userAns;
+ }
+ return flag;
+ },
+ mouseenterTitle() {
+ this.ishowTitle = true
+ console.log(this.ishowTitle );
+ },
+ mouseleaveTitle() {
+ this.ishowTitle = false
+ console.log(this.ishowTitle );
}
},
};
@@ -460,7 +508,11 @@
text-indent: 0 !important;
}
.drag-box {
+ box-sizing: border-box;
position: relative;
+ border: 1px solid;
+ padding: 10px;
+ border-radius: 10px;
}
.space {
display: inline-block;
@@ -510,6 +562,40 @@
.el-collapse {
width: 100%;
}
+.svg-btn {
+ position: relative;
+ margin-left: 5px;
+ max-height: 20px;
+ cursor: pointer;
+ display: flex;
+ padding: 3px;
+ fill: #fff;
+ border: 1px solid #8fae34;
+ border-radius: 5px;
+ background-color: #8fae34;
+ &:hover {
+ fill: #8fae34;
+ background-color: #fff;
+ }
+}
+.p-title {
+ text-indent: 0 !important;
+ position: absolute;
+ top: -33px;
+ background-color:#8fae34 ;
+ padding: 0 4px;
+ white-space: nowrap;
+ border-radius: 4px;
+ color: #fff;
+}
+.title-box {
+ display: flex;
+ margin-bottom: 20px;
+ p {
+ margin: 0;
+ text-indent: 2em ;
+ }
+}
/** 瑙ｆ瀽 */
.objective {
/deep/ .el-collapse-item__header {
diff --git a/src/components/examinations/index.vue b/src/components/examinations/index.vue
index eddf0e0..5192350 100644
--- a/src/components/examinations/index.vue
+++ b/src/components/examinations/index.vue
@@ -464,14 +464,20 @@
>淇濆瓨</el-button
>
<el-button
- @click="handleQuestion"
+ @click="(e) =>{
+ handleQuestion()
+ saveAnswer(e)
+ }"
class="examinations-btn-box"
:style="{ borderColor: primaryColor }"
>鎻愪氦</el-button
>
<el-button @click="redo" class="examinations-btn-box">閲嶅仛</el-button>
<el-button
- @click="openAnswers"
+ @click="(e) => {
+ openAnswers()
+ saveAnswer(e)
+ }"
class="examinations-btn-box"
:style="{ borderColor: primaryColor }"
>鏌ョ湅绛旀</el-button
diff --git a/src/components/graffiti/components/brushSize.vue b/src/components/graffiti/components/brushSize.vue
index 9c47a7c..52d103b 100644
--- a/src/components/graffiti/components/brushSize.vue
+++ b/src/components/graffiti/components/brushSize.vue
@@ -9,6 +9,7 @@
title="璋冩暣绗斿埛绮楃粏"
@change="(event) => $emit('change-size', +event.target.value)"
/>
+ <el-color-picker v-model="checkColor" @change="onChangeColor"></el-color-picker>
</div>
</template>
@@ -24,12 +25,29 @@
brushSize() {
return this.size
}
+ },
+ data() {
+ return {
+ checkColor:"#000000"
+ }
+ },
+ methods:{
+ onChangeColor(color) {
+ this.$emit("change-color", color);
+ },
}
};
// const brushSize = computed(() => props.size);
</script>
-<style scoped>
+<style lang="less" scoped>
+.wrap-range {
+ display: flex;
+ align-items: center;
+ .el-color-picker {
+ margin-left: 20px;
+ }
+}
.wrap-range input {
width: 150px;
height: 20px;
diff --git a/src/components/graffiti/components/colorPicker.vue b/src/components/graffiti/components/colorPicker.vue
deleted file mode 100644
index 4cde0de..0000000
--- a/src/components/graffiti/components/colorPicker.vue
+++ /dev/null
@@ -1,61 +0,0 @@
-<template>
- <div>
- <span
- v-for="(color, index) of colorList"
- class="color-item"
- :class="{ active: colorSelected === color }"
- :style="{ backgroundColor: color }"
- :key="index"
- @click="onChangeColor(color)"
- ></span>
- </div>
-</template>
-
-<script>
-export default {
- props: {
- color: {
- type: String,
- },
- },
- computed:{
- colorSelected() {
- return this.color
- }
- },
- data() {
- return {
- colorList: [
- "#000000",
- "#808080",
- "#FF3333",
- "#0066FF",
- "#FFFF33",
- "#33CC66",
- ],
- };
- },
- methods: {
- onChangeColor(color) {
- this.$emit("change-color", color);
- },
- },
-};
-</script>
-
-<style scoped>
-.color-item {
- display: inline-block;
- width: 32px;
- height: 32px;
- margin: 0 4px;
- box-sizing: border-box;
- border: 4px solid white;
- box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
- cursor: pointer;
- transition: 0.3s;
-}
-.color-item.active {
- box-shadow: 0 0 15px #00ccff;
-}
-</style>
diff --git a/src/components/graffiti/components/toolBtns.vue b/src/components/graffiti/components/toolBtns.vue
index aad1a3f..83e91d7 100644
--- a/src/components/graffiti/components/toolBtns.vue
+++ b/src/components/graffiti/components/toolBtns.vue
@@ -5,9 +5,15 @@
:key="index"
:class="{ active: toolSelected === item.name }"
:title="item.title"
- @click="onChangeTool(item.name)"
+ @click="onChangeTool(item.name, index)"
+ :style="{ boxShadow: index == num ? '0 0 15px #00ccff' : '' }"
>
- <i :class="['iconfont', item.icon]"></i>
+ <img
+ :src="item.icon"
+ alt=""
+ class="giaffiti-btn"
+ :style="{ width: index == 0 ? '18px' : '' }"
+ />
</button>
</div>
</template>
@@ -20,24 +26,46 @@
default: "brush",
},
},
- computed:{
+ computed: {
toolSelected() {
- return this.tool
- }
+ return this.tool;
+ },
},
data() {
return {
toolList: [
- { name: "brush", title: "鐢荤瑪", icon: "icon-qianbi" },
- { name: "eraser", title: "姗＄毊鎿�", icon: "icon-xiangpi" },
- { name: "clear", title: "娓呯┖", icon: "icon-qingchu" },
- { name: "undo", title: "鎾ら攢", icon: "icon-chexiao" },
- { name: "save", title: "淇濆瓨", icon: "icon-fuzhi" },
+ {
+ name: "brush",
+ title: "鐢荤瑪",
+ icon: require("@/assets/images/brush.png"),
+ },
+ {
+ name: "eraser",
+ title: "姗＄毊鎿�",
+ icon: require("@/assets/images/rubber.png"),
+ },
+ {
+ name: "clear",
+ title: "娓呯┖",
+ icon: require("@/assets/images/scrub.png"),
+ },
+ {
+ name: "undo",
+ title: "鎾ら攢",
+ icon: require("@/assets/images/revoke.png"),
+ },
+ {
+ name: "save",
+ title: "淇濆瓨",
+ icon: require("@/assets/images/save.png"),
+ },
],
+ num: 0,
};
},
methods: {
- onChangeTool(tool) {
+ onChangeTool(tool, index) {
+ if (index == 0 || index == 1) this.num = index;
this.$emit("change-tool", tool);
},
},
@@ -45,6 +73,10 @@
</script>
<style scoped>
+.tools {
+ display: flex;
+ align-items: center;
+}
.tools button {
/* border-radius: 50%; */
width: 32px;
@@ -71,4 +103,7 @@
.tools button i {
font-size: 20px;
}
+.giaffiti-btn {
+ width: 24px;
+}
</style>
diff --git a/src/components/graffiti/index.vue b/src/components/graffiti/index.vue
index 8980a01..11c1519 100644
--- a/src/components/graffiti/index.vue
+++ b/src/components/graffiti/index.vue
@@ -1,3 +1,4 @@
+<!-- 娑傝壊杩炵嚎棰樻帶浠� -->
<template>
<div class="page">
<div class="main">
@@ -5,7 +6,6 @@
<canvas
id="canvas"
:style="{
- backgroundImage: `url(${backgroundImage})`,
backgroundSize: 'cover',
backgroundPosition: 'center',
}"
@@ -14,8 +14,7 @@
</div>
</div>
<div class="footer">
- <BrushSize :size="brushSize" @change-size="onChangeSize" />
- <ColorPicker :color="brushColor" @change-color="onChangeColor" />
+ <BrushSize :size="brushSize" @change-size="onChangeSize" @change-color="onChangeColor" />
<ToolBtns :tool="brushTool" @change-tool="onChangeTool" />
</div>
</div>
@@ -23,16 +22,23 @@
<script>
import BrushSize from "./components/brushSize.vue";
-import ColorPicker from "./components/colorPicker.vue";
import ToolBtns from "./components/toolBtns.vue";
export default {
name: "graffiti",
- components: { BrushSize, ColorPicker, ToolBtns },
+ components: { BrushSize, ToolBtns },
+ props:{
+ page:{
+ type:Number
+ },
+ bcImg:{
+ type:String
+ }
+ },
data() {
return {
canvas: null,
context: null,
- painting: false,
+ painting: false, // 璁板綍鐘舵�侊紝榧犳爣鏄惁鍦ㄦ寜涓嬬姸鎬�
historyData: [], // 瀛樺偍鍘嗗彶鏁版嵁锛岀敤浜庢挙閿�
brushSize: 5, // 绗斿埛澶у皬
brushColor: "#000000", // 绗斿埛棰滆壊
@@ -42,16 +48,17 @@
top: 0,
},
backgroundImage:
- "https://t7.baidu.com/it/u=1819248061,230866778&fm=193&f=GIF",
+ "",
};
},
mounted() {
+ this.backgroundImage = this.bcImg
this.canvas = document.getElementById("canvas");
if (this.canvas.getContext) {
this.context = this.canvas.getContext("2d", { willReadFrequently: true });
this.initCanvas();
// window.addEventListener('resize', updateCanvasPosition);
- window.addEventListener("scroll", this.updateCanvasOffset); // 娣诲姞婊氬姩鏉℃粴鍔ㄤ簨浠剁洃鍚櫒
+ window.addEventListener("scroll",this.updateCanvasOffset,true); // 娣诲姞婊氬姩鏉℃粴鍔ㄤ簨浠剁洃鍚櫒
this.getCanvasOffset();
this.context.lineGap = "round";
this.context.lineJoin = "round";
@@ -61,14 +68,39 @@
this.canvas.addEventListener("mouseleave", this.closePaint);
}
this.toolClear();
+ const oldData = localStorage.getItem(this.config.activeBook.name + '-graffiti-' + this.page)
+ if(oldData) {
+ this.backgroundImage = oldData
+ }
},
+ // watch:{
+ // backgroundImage:{
+ // handler(newValue) {
+ // if(newValue && this.context) {
+ // const imgData = new Image();
+ // // 鍒嗕袱绉嶆儏鍐碉紝鍒濇鐨勫浘鐗� 鐩存帴鐢ㄥ閮ㄩ摼鎺ワ紝闇�瑕佸姞璺ㄥ煙鍜屾椂闂存埑锛屼簩娆′繚瀛樼殑浣滀负鑳屾櫙鍒欎笉闇�瑕�
+ // const oldData = localStorage.getItem(this.config.activeBook.name + '-graffiti-' + this.page)
+ // if(oldData) {
+ // imgData.src = newValue
+ // } else {
+ // imgData.src = newValue + '?' + new Date().getTime();
+ // imgData.setAttribute('crossOrigin', '');
+ // }
+ // imgData.onload = () => {
+ // this.context.drawImage(imgData,0,0)
+ // }
+ // }
+ // }
+ // }
+ // },
methods: {
changeBackground(imgUrl) {
this.backgroundImage = imgUrl;
},
+ // 鍒濆鍖� 鐢诲竷锛岃缃ぇ灏忚儗鏅壊
initCanvas() {
const that = this
- function resetCanvas() {
+ const resetCanvas = () => {
const elPanel = document.getElementById("canvas_panel");
that.canvas.width = elPanel.clientWidth;
that.canvas.height = elPanel.clientHeight;
@@ -79,9 +111,22 @@
that.context.fillRect(0, 0, that.canvas.width, that.canvas.height);
that.context.fillStyle = "black";
that.getCanvasOffset(); // 鏇存柊鐢诲竷浣嶇疆
+ // 璁剧疆鐢诲竷鑳屾櫙鍥�
+ const imgData = new Image();
+ // 鍒嗕袱绉嶆儏鍐碉紝鍒濇鐨勫浘鐗� 鐩存帴鐢ㄥ閮ㄩ摼鎺ワ紝闇�瑕佸姞璺ㄥ煙鍜屾椂闂存埑锛屼簩娆′繚瀛樼殑浣滀负鑳屾櫙鍒欎笉闇�瑕�
+ const oldData = localStorage.getItem(this.config.activeBook.name + '-graffiti-' + this.page)
+ if(oldData) {
+ imgData.src = oldData
+ } else {
+ imgData.src = this.backgroundImage + '?' + new Date().getTime();
+ imgData.setAttribute('crossOrigin', '');
+ }
+ imgData.onload = () => {
+ this.context.drawImage(imgData,0,0)
+ }
}
-
resetCanvas();
+ // 鐩戝惉绐楀彛澶у皬 锛岀獥鍙ｆ敼鍙橀噸鏂版覆鏌撶敾甯�
window.addEventListener("resize", resetCanvas);
},
@@ -99,7 +144,7 @@
y: y - this.canvasOffset.top,
};
},
-
+ // 榧犳爣鎶捣鏂规硶
downCallback(event) {
// 鍏堜繚瀛樹箣鍓嶇殑鏁版嵁锛岀敤浜庢挙閿�鏃舵仮澶嶏紙缁樺埗鍓嶄繚瀛橈紝涓嶆槸缁樺埗鍚庡啀淇濆瓨锛�
const data = this.context.getImageData(
@@ -118,7 +163,7 @@
this.brushTool === "eraser" ? "#FFFFFF" : this.brushColor;
this.painting = true;
},
-
+ // 榧犳爣绉诲姩鏂规硶(璁＄畻鍧愭爣骞舵覆鏌撹建杩�)
moveCallback(event) {
if (!this.painting) {
return;
@@ -131,16 +176,19 @@
closePaint() {
this.painting = false;
},
+ // 閲嶆柊璁＄畻鐢诲竷鐨勫亸绉诲��
updateCanvasOffset() {
- this.getCanvasOffset(); // 閲嶆柊璁＄畻鐢诲竷鐨勫亸绉诲��
+ this.getCanvasOffset();
},
-
+ // 鏀瑰彉绗斿埛澶у皬
onChangeSize(size) {
this.brushSize = size;
},
+ // 鏀瑰彉绗斿埛棰滆壊
onChangeColor(color) {
this.brushColor = color;
},
+ // 淇濆瓨锛屾竻绌虹瓑鎸夐挳
onChangeTool(tool) {
this.brushTool = tool;
switch (tool) {
@@ -155,38 +203,67 @@
break;
}
},
+ // 娓呯┖canvas鎵�鏈夊唴瀹�(鑳屾櫙鍥鹃櫎澶�)
toolClear() {
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
this.resetToolActive();
+ // 鏂板姞鍐呭锛屾竻绌哄悗灏嗚儗鏅浘鍐嶈缃笂鍘�
+ const imgData = new Image();
+ // 鍒嗕袱绉嶆儏鍐碉紝鍒濇鐨勫浘鐗� 鐩存帴鐢ㄥ閮ㄩ摼鎺ワ紝闇�瑕佸姞璺ㄥ煙鍜屾椂闂存埑锛屼簩娆′繚瀛樼殑浣滀负鑳屾櫙鍒欎笉闇�瑕�
+ const oldData = localStorage.getItem(this.config.activeBook.name + '-graffiti-' + this.page)
+ if(oldData) {
+ imgData.src = oldData
+ } else {
+ imgData.src = this.backgroundImage + '?' + new Date().getTime();
+ imgData.setAttribute('crossOrigin', '');
+ }
+ imgData.onload = () => {
+ this.context.drawImage(imgData,0,0)
+ }
},
+ // 淇濆瓨鐢诲竷鑳屾櫙鍜屽垝绾垮埌鏈湴鏂规硶
toolSave() {
- const imageDataUrl = this.canvas.toDataURL("image/png");
- console.log(imageDataUrl);
- // const imgUrl = canvas.toDataURL('image/png');
- // const el = document.createElement('a');
- // el.setAttribute('href', imgUrl);
- // el.setAttribute('target', '_blank');
- // el.setAttribute('download', `graffiti-${Date.now()}`);
- // document.body.appendChild(el);
- // el.click();
- // document.body.removeChild(el);
- // resetToolActive();
+ var imgData = this.canvas.toDataURL({format: 'png', quality:1, width:800,});
+ localStorage.setItem(this.config.activeBook.name + '-graffiti-' + this.page,imgData)
},
+ // 淇濆瓨涓轰竴寮犲浘鐗囧苟涓嬭浇鐨勬柟娉�
+ saveImgData() {
+ var link = document.createElement("a");
+ var imgData = this.canvas.toDataURL({format: 'png', quality:1, width:20000, height:4000});
+ var strDataURI = imgData.substr(22, imgData.length);
+ var blob = dataURLtoBlob(imgData);
+ var objurl = URL.createObjectURL(blob);
+ link.download = "grid1.png";
+ link.href = objurl;
+ link.click();
+
+ function dataURLtoBlob(dataurl) {
+ var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
+ bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
+ while(n--){
+ u8arr[n] = bstr.charCodeAt(n);
+ }
+ return new Blob([u8arr], {type:mime});
+ }
+ },
+ // 杩斿洖涓婁竴姝ユ柟娉�(鎾ら攢)
toolUndo() {
+ //
if (this.historyData.length <= 0) {
this.resetToolActive();
return;
}
+ // 灏嗙敾鐨勪笂涓�姝ユ暟鎹啓鍏anvas 閲嶆柊娓叉煋
const lastIndex = this.historyData.length - 1;
this.context.putImageData(this.historyData[lastIndex], 0, 0);
this.historyData.pop();
-
this.resetToolActive();
},
// 瀛樺偍鏁版嵁
saveData(data) {
this.historyData.length >= 50 && this.historyData.shift(); // 璁剧疆鍌ㄥ瓨涓婇檺涓�50姝�
this.historyData.push(data);
+ console.log('鏁版嵁',this.historyData);
},
// 娓呴櫎銆佹挙閿�銆佷繚瀛樼姸鎬佷笉闇�瑕佷繚鎸侊紝鎿嶄綔瀹屽悗鎭㈠绗斿埛鐘舵��
resetToolActive() {
@@ -202,7 +279,7 @@
.page {
display: flex;
flex-direction: column;
- width: 1038px;
+ width:100%;
height: 866px;
}
--
Gitblit v1.9.1