艺术戏剧（整本分页）

user1

2024-06-17 f99d327dd2a9923c511373e76eef533457e4af32

 src/books/artAndDrama/view/components/chapter002.vue

@@ -4,7 +4,7 @@
      <div v-if="showPageList.indexOf(14) > -1">
        <h1 id="a004">
          <img class="img-0" alt="" src="../../assets/images/dy2.jpg" />
          <audio :src="auidoPathOne" controls></audio>
          <audio :src="auidoPathOne" controls class="audio"  @play="audioPlay"></audio>
        </h1>
        <div class="bodystyle">
          <div class="bk">
@@ -31,8 +31,8 @@
        <h1>
          <img src="../../assets/images/header-green.png" alt="" style="width: 100%; height: auto" />
        </h1>
        <img class="headerimg" src="../../assets/images/page5.png" alt="" />
        <div class="bodystyle">
          <img src="../../assets/images/page5.png" alt="" />
          <h2 id="b006">第一课　五官的力量</h2>
          <h3 class="lefth3" id="c011">
            <img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" />
@@ -70,17 +70,17 @@
    <div class="page-box" page="16">
      <div v-if="showPageList.indexOf(16) > -1">
        <h1>
          <img src="../../assets/images/page6-header-green.png" alt="" style="height: auto; width: 100%" />
          <img src="../../assets/images/unit2-header-img.png" alt="" style="height: auto; width: 100%" />
        </h1>
        <div class="bodystyle">
          <h2 id="b007">第二课　明察秋毫</h2>
          <h3 class="lefth3" id="c013"><img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" /></h3>
          <p><span class="hs1">◇</span>我们的世界五彩斑斓。请你填一填，提到这些颜色，你想到了哪些事物？</p>
          <p>黄色：柠檬、<input v-model="questionData.warnUp.three" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 10%"/>、<input v-model="questionData.warnUp.four" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 10%"/>。</p>
          <p>红色：鞭炮、<input v-model="questionData.warnUp.five" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 10%"/>、<input v-model="questionData.warnUp.six" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 10%"/>。</p>
          <p>绿色：叶子、<input v-model="questionData.warnUp.seven" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 10%"/>、<input v-model="questionData.warnUp.eight" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 10%"/>。</p>
          <p>黑色：黑板、<input v-model="questionData.warnUp.nine" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 10%"/>、<input v-model="questionData.warnUp.ten" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 10%"/>。</p>
          <p>蓝色：大海、<input v-model="questionData.warnUp.eleven" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 10%"/>、<input v-model="questionData.warnUp.twelve" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 10%"/>。</p>
          <p>黄色：柠檬、<input v-model="questionData.warnUp.three" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 15%"/>、<input v-model="questionData.warnUp.four" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 15%"/>。</p>
          <p>红色：鞭炮、<input v-model="questionData.warnUp.five" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 15%"/>、<input v-model="questionData.warnUp.six" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 15%"/>。</p>
          <p>绿色：叶子、<input v-model="questionData.warnUp.seven" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 15%"/>、<input v-model="questionData.warnUp.eight" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 15%"/>。</p>
          <p>黑色：黑板、<input v-model="questionData.warnUp.nine" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 15%"/>、<input v-model="questionData.warnUp.ten" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 15%"/>。</p>
          <p>蓝色：大海、<input v-model="questionData.warnUp.eleven" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 15%"/>、<input v-model="questionData.warnUp.twelve" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 15%"/>。</p>
          <h3 class="lefth3" id="c014"><img class="img-gn1" alt="" src="../../assets/images/czysj.jpg" /></h3>
          <p><span class="hs1">◇</span>阅读下面的文字，为小蚂蚁选择一种性格吧。</p>
          <p class="center  openImgBox"><img class="img-e" alt="" src="../../assets/images/2-2.gif" /></p>
@@ -101,14 +101,15 @@
        <h1>
          <img src="../../assets/images/header-green.png" alt="" style="width: 100%; height: auto" />
        </h1>
        <img class="headerimg" src="../../assets/images/page5.png" alt="" />
        <div class="bodystyle">
          <h2 id="b008">第三课　闻声识人</h2>
          <h3 class="lefth3" id="c015"><img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" /></h3>
          <p>常言道：良言一句三冬暖，恶语伤人六月寒。语言在人与人的交往中起着重要的作用，有着无穷的力量。</p>
          <p><span class="hs1">◇</span>如果朋友心情不好，你该怎么安慰他/她呢？</p>
          <p>“<input v-model="questionData.warnUp.thirteen" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 50%"/>”</p>
          <p>“<input v-model="questionData.warnUp.thirteen" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 80%"/>。”</p>
          <p><span class="hs1">◇</span>如果你邀请好朋友来家里做客，你该说什么来欢迎他/她呢？</p>
          <p>“<input v-model="questionData.warnUp.fourteen" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 50%"/>”</p>
          <p>“<input v-model="questionData.warnUp.fourteen" class="input-bottom-border fz-18" @change="setBookQuestion"  style="width: 80%"/>。”</p>
          <h3 class="lefth3" id="c016"><img class="img-gn1" alt="" src="../../assets/images/czysj.jpg" /></h3>
          <p><span class="hs1">◇</span>请根据提示读出句子，注意声音和语气的变化。</p>
          <p><span class="hs">这一大块奶酪都是我的了！</span>（一只狡猾的蚂蚁，想要把奶酪偷偷地占为己有）</p>
@@ -125,7 +126,7 @@
    <div class="page-box" page="18">
      <div v-if="showPageList.indexOf(18) > -1">
        <h1>
          <img src="../../assets/images/header-green.png" alt="" style="width: 100%; height: auto" />
          <img src="../../assets/images/unit2-header-img.png" alt="" style="width: 100%; height: auto" />
        </h1>
        <div class="bodystyle">
          <p><span class="hs">这块奶酪太沉了，我们休息一下吧！</span>（一只弱小的蚂蚁，在向蚂蚁队长请求休息）</p>
@@ -143,6 +144,7 @@
        <h1>
          <img src="../../assets/images/header-green.png" alt="" style="width: 100%; height: auto" />
        </h1>
        <img class="headerimg" src="../../assets/images/page5.png" alt="" />
        <div class="bodystyle">
          <h2 id="b009">第四课　真听真看真感受</h2>
          <h3 class="lefth3" id="c017"><img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" /></h3>
@@ -165,7 +167,7 @@
    <div class="page-box" page="20">
      <div v-if="showPageList.indexOf(20) > -1">
        <h1>
          <img src="../../assets/images/page6-header-green.png" alt="" style="width: 100%; height: auto" />
          <img src="../../assets/images/unit2-header-img.png" alt="" style="width: 100%; height: auto" />
        </h1>
        <div class="bodystyle">
          <h2 id="b010">单元活动任务</h2>
@@ -190,17 +192,19 @@
        <h1>
          <img src="../../assets/images/header-green.png" alt="" style="width: 100%; height: auto" />
        </h1>
        <img class="headerimg" src="../../assets/images/page5.png" alt="" />
        <div class="bodystyle">
          <p><span class="hs1">◇</span>吹乒乓球练习</p>
          <p>用气息将桌面上的乒乓球从“起点”运送至“终点”，运送过程中避免乒乓球触碰障碍物。</p>
          <h3 class="lefth3" id="c020"><img class="img-gn1" alt="" src="../../assets/images/czysj.jpg" /></h3>
          <h3 class="lefth3" id="c020"><img class="img-gn1" alt="" src="../../assets/images/tzyys.jpg" /></h3>
          <p><span class="hs1">◇</span>请走进剧场观看不同剧种的现场演出，感受戏剧的魅力吧！</p>
          <p class="center">
            <video :src="videoPathOne" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true"
              x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls
              controlslist="nodownload" class="w100"
              style="margin-top: 40px; border-radius: 10px; border: 2px solid green;"></video>
          <h2>视频: 惟妙惟肖的人物</h2></p>
          <h2>视频: 惟妙惟肖的人物</h2>
        </p>
        </div>
      </div>
      <!-- 此处为页脚部分（需要设置页码） -->
@@ -288,6 +292,9 @@
        JSON.stringify(this.questionData)
      );
    },
    audioPlay(e) {
      this.$emit('closeAudio',e.srcElement.currentSrc)
    }
  },
};
</script>