学前儿童组件替换，答题器if

闫增涛

2024-05-30 a280e63446d41ec4046270444f61093e5f34a533

 src/books/childHealth/view/content/components/chapter001.vue

@@ -49,13 +49,7 @@
          专题导学
        </h6>
        <p class="blockh6 m0-t0">
          <!-- <el-image
            alt=""
            :src="introductionImg"
            :preview-src-list="[introductionImg]"
            class="mb-20 open-image"
          /> -->
          <span id="open-image" @click="openImage">
          <span class="openImgBox">
            <img
              src="../../../assets/images/chapterOne/0014-1.jpg"
              data-imgurl="/books/book/img/0014-1.56a5dd0f.jpg"
@@ -66,8 +60,8 @@
      </div>
    </div>
    <!-- 2 -->
    <div class="page-box" page="10">
      <div v-if="showPageList.indexOf(10) > -1">
    <div class="page-box" page="10"  :show="showPageList.indexOf(10) > -1">
      <div v-show="showPageList.indexOf(10) > -1">
        <div class="header-box">
          <div class="header-border-box"></div>
          <div class="header-num-box">
@@ -357,11 +351,10 @@
              </span>
            </span>
            <examinations
              v-if="testOne && questionData"
              ref="examinationOne"
              :cardList="questionData[10]"
              v-if="testOne && questionData && questionData[10]"
              :chapter="1"
              :page="2"
              :page="10"
              :cardList="questionData[10]"
            />
          </div>
          <h2 class="module_block" id="b001" style="margin: 0">
@@ -395,12 +388,8 @@
                运动系统是由骨、骨连结和骨骼肌三部分组成的。全身的骨通过骨连结组成人体骨骼（见图1-1）。骨骼是人体的支架，具有保护内脏器官、供肌肉附着和作为肌肉运动的杠杆等作用。在神经系统的支配下，肌肉收缩牵动所附着的骨绕着关节转动，使身体产生各种动作。所以，运动系统具有运动、支持和保护等功能，幼年时期的骨骼还具有造血功能。
              </p>
              <div class="text-img-box">
                <div style="margin-right: 50px">
                  <el-image
                    :src="bonesImg"
                    :preview-src-list="[bonesImg]"
                    class="open-image"
                  />
                <div style="margin-right: 50px" class="openImgBox">
                  <img src="../../../assets/images/chapterOne/0015-5.jpg" class="w100" alt="">
                  <span class="img">图1-1 人体全身骨骼（前面观）</span>
                </div>
                <div>
@@ -433,8 +422,8 @@
      </div>
    </div>
    <!-- 3 -->
    <div class="page-box" page="11">
      <div v-if="showPageList.indexOf(11) > -1">
    <div class="page-box" page="11" :show="showPageList.indexOf(11) > -1">
      <div v-show="showPageList.indexOf(11) > -1">
        <div class="page-header-box">
          <span class="page-header-text"
            >专题一&nbsp;学前儿童生理发展特点与保健</span
@@ -457,9 +446,6 @@
          <p class="text-left text-height lh2">
            学前儿童的骨盆和成人不同，还没长结实，在蹦跳时要注意安全。比如，幼儿从高处往硬地上跳，就可能导致组成骨盆的骨发生不易察觉的移位，使骨盆变形。若女童骨盆变形，将会直接影响成年后的正常生理功能，这一点应引起家长和教师的特别注意。
          </p>
          <p class="text-left text-height lh2">
            学前儿童的骨盆和成人不同，还没长结实，在蹦跳时要注意安全。比如，幼儿从高处往硬地上跳，就可能导致组成骨盆的骨发生不易察觉的移位，使骨盆变形。若女童骨盆变形，将会直接影响成年后的正常生理功能，这一点应引起家长和教师的特别注意。
          </p>
          <div class="fl">
            <div class="bottom-left" style="width: 65%">
              <h5 id="e005">5.脊柱的生理弯曲还未定型</h5>
@@ -472,8 +458,8 @@
            </div>
            <div class="bottom-right" style="width: 35%">
              <div class="mt-40">
                <div class="banshi openImgBox">
                  <div class="swiper-container">
                <div class="banshi openImgBox" style="height: 364px;">
                  <div class="swiper-container swiper-img">
                    <div class="swiper-wrapper">
                      <div class="swiper-slide">
                        <div
@@ -506,31 +492,11 @@
                        </div>
                      </div>
                    </div>
                    <div class="swiper-pagination"></div>
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                  </div>
                </div>
              </div>
              <!-- <el-carousel
                trigger="click"
                class="bones-carousel carousel-image"
                arrow="always"
                indicator-position="none"
              >
                <el-carousel-item
                  v-for="(item, index) in bonesList"
                  :key="index"
                  class="bones-carousel-item"
                >
                  <el-image
                    :src="item"
                    :preview-src-list="bonesList"
                    :preview-teleported="true"
                    class="open-image"
                  />
                </el-carousel-item>
              </el-carousel> -->
              <p class="img">图1-2 成人脊柱模式图</p>
            </div>
          </div>
@@ -559,14 +525,10 @@

          <div class="fl">
            <div
              class="left fl fl-di fl-evenly"
              class="left fl fl-di fl-evenly openImgBox"
              style="width: 30%; margin-top: 5px"
            >
              <el-image
                :src="jointImg"
                :preview-src-list="[jointImg]"
                class="open-image"
              />
              <img src="../../../assets/images/chapterOne/0017-1.jpg" alt="" class="w100">
              <p class="img">图1-3 关节模式图</p>
            </div>
            <div class="right" style="width: 70%; padding-left: 20px">
@@ -583,26 +545,34 @@
          </div>
          <div class="fl">
            <div class="left" style="width: 30%">
              <el-carousel
                loop
                trigger="click"
                class="bones-carousel carousel-image"
                arrow="always"
                indicator-position="none"
              >
                <el-carousel-item
                  v-for="(item, index) in footList"
                  :key="index"
                  class="bones-carousel-item"
                >
                  <el-image
                    :src="item"
                    :preview-src-list="footList"
                    :preview-teleported="true"
                    class="open-image"
                  />
                </el-carousel-item>
              </el-carousel>
              <div class="banshi openImgBox">
                  <div class="swiper-container swiper-img">
                    <div class="swiper-wrapper">
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../../assets/images/chapterOne/foot-01.png" alt="正常足"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../../assets/images/chapterOne/foot-02.png" alt="扁平足"
                          />
                        </div>
                      </div>
                    </div>
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                  </div>
                </div>
              <p class="img">图1-4 正常足和扁平足</p>
            </div>
            <div class="right" style="width: 70%; padding-left: 20px">
@@ -638,28 +608,44 @@
              为了保证学前儿童身心健康发育。不良体态，如驼背、严重脊柱侧弯等，导致胸廓畸形，可严重影响学前儿童的心肺发育，容易患呼吸系统疾病。体态不良的儿童也容易自卑，影响健全人格的形成。为防止脊柱、胸廓等骨骼变形，形成良好体态，须注意以下几点：婴儿不宜过早坐、站，不宜睡软床和久坐沙
            </p>
            <div class="right fl fl-cn fl-di" style="width: 55%">
              <!-- <el-image :src="sitImg" :preview-src-list="[sitImg]" /> -->
              <el-carousel
                loop
                trigger="click"
                class="posure-carousel carousel-image"
                style="width: 300px"
                arrow="always"
                indicator-position="none"
              >
                <el-carousel-item
                  v-for="(item, index) in posureList"
                  :key="index"
                  class="bones-carousel-item"
                >
                  <el-image
                    :src="item"
                    :preview-src-list="posureList"
                    :preview-teleported="true"
                    class="open-image"
                  />
                </el-carousel-item>
              </el-carousel>
              <div class="banshi openImgBox">
                  <div class="swiper-container swiper-img">
                    <div class="swiper-wrapper">
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../../assets/images/chapterOne/posture-01.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../../assets/images/chapterOne/posture-02.png"
                          />
                        </div>
                      </div>
                      <div class="swiper-slide">
                        <div
                          class="imgBox"
                          style="width: 100%; height: 100%"
                        >
                          <img
                            src="../../../assets/images/chapterOne/posture-03.png"
                          />
                        </div>
                      </div>
                    </div>
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                  </div>
                </div>
              <p class="img">图1-5 坐姿对脊柱的影响</p>
            </div>
          </div>
@@ -718,7 +704,7 @@
            <span class="img center dl-bl w100">专题一 学习主题一</span>
            <examinations
              :cardList="questionData[14]"
              v-if="questionData"
              v-if="questionData && questionData[14]"
              :chapter="1"
              :page="6"
            />
@@ -988,12 +974,8 @@
              <h4 id="d009">（一）呼吸器官的特点</h4>
              <h5 id="e012">1.鼻</h5>
            </div>
            <div class="right" style="width: 50%">
              <el-image
                :src="breathing"
                :preview-src-list="[breathing]"
                class="open-image"
              />
            <div class="right openImgBox" style="width: 50%">
              <img src="../../../assets/images/chapterOne/0020-2.jpg" alt="" class="w100">
              <p class="img">图1-6 呼吸系统示意图</p>
            </div>
          </div>
@@ -1029,7 +1011,7 @@
            </div>
            <div class="right" style="width: 60%">
              <video
                :src="pathFive"
                :src="getResourcePath('163c06871b763954952d1cd74373c618')"
                poster="../../../assets/images/chapterOne/people-video-img.jpg"
                webkit-playsinline="true"
                x-webkit-airplay="true"
@@ -1063,12 +1045,8 @@
              </p>
            </div>
            <div class="right" style="width: 20%">
              <p class="center">
                <el-image
                  :src="throat"
                  :preview-src-list="[throat]"
                  class="open-image"
                />
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0021-1.jpg" alt="" class="w100">
              </p>
              <p class="img">图1-7 喉腔模式图</p>
            </div>
@@ -1091,12 +1069,8 @@
            学前儿童新陈代谢旺盛，在新陈代谢过程中，机体需氧量相对比成人多，只有加快呼吸频率才能满足自身对氧气的需求量，所以，年龄越小，呼吸频率越快。新生儿每分钟呼吸40～44次，1岁以内约30次，1～3岁25～30次，4～7岁约22次。不同年龄的人的呼吸频率见表1-1。
          </p>
          <p class="img">表1-1 不同年龄的人的呼吸频率</p>
          <p class="center">
            <el-image
              :src="tableOne"
              :preview-src-list="[tableOne]"
              class="open-image"
            />
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0021-2.jpg" alt="" class="w100">
          </p>
        </div>
      </div>
@@ -1161,7 +1135,7 @@
            <span class="img center dl-bl w100">专题一 学习主题二</span>
            <examinations
              :cardList="questionData[17]"
              v-if="questionData"
              v-if="questionData && questionData[17]"
              :chapter="1"
              :page="9"
            />
@@ -1445,13 +1419,8 @@
          <p>
            循环系统包括血液循环系统（心血管系统）和淋巴系统。血液循环系统由心脏和血管组成，血管包括动脉、静脉和毛细血管（见图1-8）。淋巴系统由淋巴管道、淋巴器官和淋巴组织组成。
          </p>
          <p class="center">
            <el-image
              :src="blood"
              :preview-src-list="[blood]"
              style="width: 60%"
              class="open-image"
            />
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0024-1.jpg" alt="" style="width:80%">
          </p>
          <p class="img">图1-8 血液循环示意图</p>

@@ -1486,12 +1455,8 @@
          <p>学前儿童的血液量及成分和成人不同。具体来说，有以下几方面不同。</p>
          <p>（1）血液量占体重的比例大于成人（见表1-2）</p>
          <p class="img">表1-2 不同年龄的血液量</p>
          <p class="center">
            <el-image
              :src="tableTwo"
              :preview-src-list="[tableTwo]"
              class="open-image"
            />
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0024-3.jpg" alt="" class="w100" />
          </p>
        </div>
      </div>
@@ -1541,12 +1506,8 @@
            由于婴幼儿心输出量少，而新陈代谢旺盛，为满足机体对血液的需求量，只有加快心率来保障供血量。年龄越小，心率越快。不同年龄的心率，如表1-3所示。
          </p>
          <p class="img">表1-3 不同年龄的心率</p>
          <p class="center">
            <el-image
              :src="tableThree"
              :preview-src-list="[tableThree]"
              class="open-image"
            />
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0025-1.jpg" alt="" class="w100" />
          </p>
        </div>
      </div>
@@ -1655,7 +1616,7 @@
            <span class="img center dl-bl w100">专题一 学习主题三</span>
            <examinations
              :cardList="questionData[22]"
              v-if="questionData"
              v-if="questionData  && questionData[22]"
              :chapter="1"
              :page="14"
            />
@@ -1907,12 +1868,8 @@
              <h5 id="e020">1.牙齿</h5>
            </div>
            <div class="right" style="width: 35%">
              <p class="center">
                <el-image
                  :src="digestion"
                  :preview-src-list="[digestion]"
                  class="open-image"
                />
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0028-1.jpg" alt="" class="w100">
              </p>
              <p class="img">图1-9 消化系统模式图</p>
            </div>
@@ -1971,22 +1928,12 @@
          </p>
          <p>每一颗乳牙和恒牙的萌出都有固定的时间，见表1-4、表1-5。</p>
          <p class="img">表1-4 乳牙萌出时间顺序（以月龄计算）</p>
          <p class="center">
            <el-image
              :src="tableFive"
              :preview-src-list="[tableFive]"
              style="width: 100%"
              class="open-image"
            />
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0029-1.jpg" alt="" class="w100" />
          </p>
          <p class="img">表1-5 恒牙萌出时间</p>
          <p class="center">
            <el-image
              :src="tableSix"
              :preview-src-list="[tableSix]"
              style="width: 100%"
              class="open-image"
            />
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0029-2.jpg" alt="" class="w100">
          </p>
          <h5 id="e021">2.舌</h5>
          <p>
@@ -2132,7 +2079,7 @@
            <span class="img center dl-bl w100">专题一 学习主题四</span>
            <examinations
              :cardList="questionData[27]"
              v-if="questionData"
              v-if="questionData  && questionData[27]"
              :chapter="1"
              :page="19"
            />
@@ -2380,12 +2327,8 @@
          </div>
          <div class="fl fl-around">
            <div class="left" style="width: 35%">
              <p class="center" style="margin-top: 0">
                <el-image
                  :src="urology"
                  :preview-src-list="[urology]"
                  class="open-image"
                />
              <p class="center openImgBox" style="margin-top: 0">
                <img src="../../../assets/images/chapterOne/0033-1.jpg" alt="" class="w100">
              </p>
              <p class="img">图1-10 泌尿系统模式图（男性）</p>
            </div>
@@ -2697,22 +2640,14 @@
          </p>
          <div class="fl">
            <div class="left" style="width: 50%">
              <p class="center">
                <el-image
                  :src="man"
                  :preview-src-list="[man]"
                  class="open-image"
                />
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0036-1.jpg" alt="" class="w100">
              </p>
              <p class="img">图1-11 男性生殖系统示意图</p>
            </div>
            <div class="right" style="width: 50%">
              <p class="center">
                <el-image
                  :src="woman"
                  :preview-src-list="[woman]"
                  class="open-image"
                />
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0036-2.jpg" alt="" class="w100">
              </p>
              <p class="img">图1-12 女性生殖系统示意图</p>
            </div>
@@ -2768,7 +2703,7 @@
            >
            <examinations
              :cardList="questionData[32]"
              v-if="questionData"
              v-if="questionData  && questionData[32]"
              :chapter="1"
              :page="24"
            />
@@ -3030,12 +2965,8 @@
              </p>
            </div>
            <div class="right" style="width: 50%">
              <p class="center">
                <el-image
                  :src="endocrineImg"
                  :preview-src-list="[endocrineImg]"
                  class="open-image"
                />
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0038-1.jpg" alt="" class="w100">
              </p>
              <p class="img">图1-13 内分泌系统示意图</p>
            </div>
@@ -3057,12 +2988,8 @@
              </p>
            </div>
            <div class="right" style="width: 36%">
              <p class="center">
                <el-image
                  :src="stature"
                  :preview-src-list="[stature]"
                  class="open-image"
                />
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0038-2.jpg" alt="" class="w100">
              </p>
              <p class="img">图1-14 成年侏儒症患者与正常成人的身高比较</p>
            </div>
@@ -3114,7 +3041,7 @@
            <span class="img center dl-bl w100">专题一 学习主题七</span>
            <examinations
              :cardList="questionData[34]"
              v-if="questionData"
              v-if="questionData  && questionData[34]"
              :chapter="1"
              :page="26"
            />
@@ -3349,12 +3276,8 @@
              </p>
            </div>
            <div class="right" style="width: 50%">
              <p class="center">
                <el-image
                  :src="nerve"
                  :preview-src-list="[nerve]"
                  class="open-image"
                />
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0040-1.jpg" alt="" class="w100">
              </p>
              <p class="img cneter">图1-15 神经元模式图</p>
            </div>
@@ -3418,23 +3341,14 @@
          <p>
            大脑分左、右两半球（见图1-16），表面凹凸不平，凹陷处称为“沟”，隆起处称为“回”，“沟”与“回”大大增加了大脑的表面积。较大的沟有中央沟、大脑外侧沟和顶枕沟，这些沟将大脑表面分成额叶、顶叶、颞叶和枕叶四部分。
          </p>
          <p class="center">
            <el-image
              :src="brainImg"
              :preview-src-list="[brainImg]"
              style="width: 70%"
              class="open-image"
            />
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0041-1.jpg" alt="" class="w100">
          </p>
          <p class="img">图1-16 大脑左、右两半球的功能比较</p>
          <div class="fl fl-around">
            <div class="left" style="width: 48%; margin-right: 10px">
              <p class="center">
                <el-image
                  :src="brainsImg"
                  :preview-src-list="[brainsImg]"
                  class="open-image"
                />
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0041-2.jpg" alt="" class="w100">
              </p>
              <p class="img">图1-17 大脑皮层分区图</p>
            </div>
@@ -3496,12 +3410,8 @@
            自主神经可分为交感神经和副交感神经两类，它们分布于同一器官，作用相反，相互制约，使内脏器官的活动协调、准确（见表1-6）。
          </p>
          <p class="img">表1-6 交感神经和副交感神经的作用与区别</p>
          <p class="center">
            <el-image
              :src="tableNine"
              :preview-src-list="[tableNine]"
              class="open-image"
            />
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0042-1.jpg" alt="" class="w100">
          </p>
          <h3 id="c016">二、学前儿童神经系统的特点＞＞＞＞＞＞</h3>
          <h4 id="d056">（一）脑发育非常迅速</h4>
@@ -3526,12 +3436,8 @@
            脑的迅速生长可从脑质量的变化上得到反映。不同年龄脑质量的变化见表1-7。
          </p>
          <p class="img">表1-7 不同年龄脑质量的变化</p>
          <p class="center">
            <el-image
              :src="tableTen"
              :preview-src-list="[tableTen]"
              class="open-image"
            />
          <p class="center openImgBox">
            <img src="../../../assets/images/chapterOne/0043-1.jpg" alt="" class="w100">
          </p>
          <h4 id="d057">（二）中枢神经系统的发育不均衡</h4>
          <p>
@@ -3600,7 +3506,7 @@
            <span class="img center dl-bl w100">专题一 学习主题八</span>
            <examinations
              :cardList="questionData[39]"
              v-if="questionData"
              v-if="questionData  && questionData[39]"
              :chapter="1"
              :page="31"
            />
@@ -3921,12 +3827,8 @@
              <h5 id="e036">1.眼球的前后径较短</h5>
            </div>
            <div class="right" style="width: 35%">
              <p class="center">
                <el-image
                  :src="eyesImg"
                  :preview-src-list="[eyesImg]"
                  class="open-image"
                />
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0046-2.jpg" alt="" class="w100">
              </p>
              <p class="img">图1-18 眼球结构模式图</p>
            </div>
@@ -4034,12 +3936,8 @@
              </p>
            </div>
            <div class="right" style="width: 58%">
              <p class="center">
                <el-image
                  :src="ersImg"
                  :preview-src-list="[ersImg]"
                  class="open-image"
                />
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0048-1.jpg" alt="" class="w100">
              </p>
              <p class="img">图1-19 耳的结构图</p>
            </div>
@@ -4061,12 +3959,8 @@
              <h5 id="e046">3.耳蜗的感受性较强</h5>
            </div>
            <div class="right" style="width: 48%">
              <p class="center">
                <el-image
                  :src="erImg"
                  :preview-src-list="[erImg]"
                  class="open-image"
                />
              <p class="center openImgBox">
                <img src="../../../assets/images/chapterOne/0048-2.jpg" alt="" class="w100">
              </p>
              <p class="img">图1-20 成人和学前儿童咽鼓管之比较</p>
            </div>
@@ -4379,8 +4273,8 @@
            <!-- <img class="img-g" alt="" src="image/0053-1.jpg" /><br /> -->
            <span class="img center dl-bl w100">专题一 学习主题九</span>
            <examinations
              :cardList="questionData[48]"
              v-if="questionData"
              :cardList="questionData[48] "
              v-if="questionData && questionData[48]"
              :chapter="1"
              :page="40"
            />
@@ -4593,7 +4487,7 @@
            <span class="img">过关检测（资格考试模拟题）1</span><br />
            <examinations
              :cardList="questionData[50][1]"
              v-if="questionData"
              v-if="questionData && questionData[50][1]"
              :chapter="1"
              :page="421"
            />
@@ -4601,7 +4495,7 @@
            <span class="img mt-20 dl-bl">过关检测（资格考试模拟题）2</span>
            <examinations
              :cardList="questionData[50][2]"
              v-if="questionData"
              v-if="questionData && questionData[50][2]"
              :chapter="1"
              :page="422"
            />
@@ -4625,7 +4519,6 @@
<script>
import examinations from "@/components/examinations/index.vue";
import getResourcePath from "@/assets/methods/resources";

export default {
  name: "chapter-one",
  components: { examinations },
@@ -4641,48 +4534,9 @@
  data() {
    return {
      // 学习一
      introductionImg: require("../../../assets/images/chapterOne/0014-1.jpg"),
      bonesImg: require("../../../assets/images/chapterOne/0015-5.jpg"),
      foot1: require("../../../assets/images/chapterOne/foot-01.png"),
      foot2: require("../../../assets/images/chapterOne/foot-02.png"),
      jointImg: require("../../../assets/images/chapterOne/0017-1.jpg"),
      footImg: require("../../../assets/images/chapterOne/0017-2.jpg"),
      sitImg: require("../../../assets/images/chapterOne/0018-1.jpg"),
      bonesList: [],
      footList: [
        require("../../../assets/images/chapterOne/foot-01.png"),
        require("../../../assets/images/chapterOne/foot-02.png")
      ],
      posureList: [
        require("../../../assets/images/chapterOne/posture-01.png"),
        require("../../../assets/images/chapterOne/posture-02.png"),
        require("../../../assets/images/chapterOne/posture-03.png")
      ],
      resourceState: "",
      type: "option",
      snipaste: require("../../../assets/images/chapterOne/snipaste.png"),
      breathing: require("../../../assets/images/chapterOne/0020-2.jpg"),
      throat: require("../../../assets/images/chapterOne/0021-1.jpg"),
      tableOne: require("../../../assets/images/chapterOne/0021-2.jpg"),
      blood: require("../../../assets/images/chapterOne/0024-1.jpg"),
      tableTwo: require("../../../assets/images/chapterOne/0024-3.jpg"),
      tableThree: require("../../../assets/images/chapterOne/0025-1.jpg"),
      digestion: require("../../../assets/images/chapterOne/0028-1.jpg"),
      tableFive: require("../../../assets/images/chapterOne/0029-1.jpg"),
      tableSix: require("../../../assets/images/chapterOne/0029-2.jpg"),
      urology: require("../../../assets/images/chapterOne/0033-1.jpg"),
      man: require("../../../assets/images/chapterOne/0036-1.jpg"),
      woman: require("../../../assets/images/chapterOne/0036-2.jpg"),
      endocrineImg: require("../../../assets/images/chapterOne/0038-1.jpg"),
      stature: require("../../../assets/images/chapterOne/0038-2.jpg"),
      nerve: require("../../../assets/images/chapterOne/0040-1.jpg"),
      brainImg: require("../../../assets/images/chapterOne/0041-1.jpg"),
      brainsImg: require("../../../assets/images/chapterOne/0041-2.jpg"),
      tableNine: require("../../../assets/images/chapterOne/0042-1.jpg"),
      tableTen: require("../../../assets/images/chapterOne/0043-1.jpg"),
      eyesImg: require("../../../assets/images/chapterOne/0046-2.jpg"),
      ersImg: require("../../../assets/images/chapterOne/0048-1.jpg"),
      erImg: require("../../../assets/images/chapterOne/0048-2.jpg"),
      img: require("@/books/childHealth/assets/images/chapterOne/0014-1.jpg"),
      productLinkPath: "",
      learnTbaleOne: true,
@@ -4854,6 +4708,7 @@
    };
  },
  async mounted() {
    this.getResourcePath = getResourcePath;
    this.getVideoPath();
    const localData = localStorage.getItem("chapterOneData");
    if (localData) {
@@ -4876,6 +4731,13 @@
      clearInterval(window.timerOne);
    }
    localStorage.setItem("chapterOneData", JSON.stringify(this.chapterOneData));
  },
  watch: {
    showPageList: {
      handler(newVal, oldVal) {
        console.log(newVal, "章节接收内容");
      }
    }
  },
  methods: {
    changeResources(type) {
@@ -4924,35 +4786,12 @@
    },
    saveChapterOneData() {
      // 记录第一张输入数据
      console.log("20miao");
      this.saveTime = 20;
      console.log(this.chapterOneData);
      localStorage.setItem(
        "chapterOneData",
        JSON.stringify(this.chapterOneData)
      );
    },

    openImage() {
      let container = document.getElementById("open-image");
      let viewr = new Viewer(container, {
        inline: false, // 是否以内联方式显示预览
        url: "data-imgurl",
        toolbar: {
          zoomIn: 1, // 是否显示放大按钮
          zoomOut: 1, // 是否显示缩小按钮
          oneToOne: 1, // 是否显示实际大小按钮
          reset: 1, // 是否显示重置按钮
          prev: 1, // 是否显示上一页按钮
          play: 0, // 是否显示播放按钮
          next: 1, // 是否显示下一页按钮
          rotateLeft: 0, // 是否显示向左旋转按钮
          rotateRight: 0, // 是否显示向右旋转按钮
          flipHorizontal: 0, // 是否显示水平翻转按钮
          flipVertical: 0 // 是否显示垂直翻转按钮
        }
      });
    }
  }
};
</script>