轮播图优化

zhongshujie

2024-12-27 63a7d4f2bb7fdeaa1e6ed616a14c213d91d25a99

 src/books/aviationSafety/view/components/chapter003.vue

@@ -4,11 +4,7 @@
    <div class="page-box" page="34">
      <div v-if="showPageList.indexOf(34) > -1">
        <ul class="fl al-c jc-fe mr-70 pad-t-55 mb-45">
          <img
            class="headerImg mr-10"
            src="../../assets/images/headerlogo.png"
            alt=""
          />
          <img class="headerImg mr-10" src="../../assets/images/headerlogo.png" alt="" />
          <li class="headerText">项目三</li>
          <li class="headerText">前传检查</li>
          <li class="headerNumber">27</li>
@@ -20,9 +16,7 @@
          <p><br /></p>
          <div class="bk">
            <p class="bj1-qjms fl al-c">
              <span class="span-box"></span
              ><span class="span-text">项目导入</span
              ><span class="span-box"></span>
              <span class="span-box"></span><span class="span-text">项目导入</span><span class="span-box"></span>
            </p>
            <p class="fz-16">
              前传检查岗位是民航安检过程中的重要一环，对于保障机场安全运营和提高过检效率具有重要意义。前传员需要引导旅客正确摆放过检行李，维持过检秩序，处理突发状况，确保安检过程顺畅有序。掌握前传检查岗位的工作规范，熟练运用处置异常情况的方法，既能提高自身业务素质，也能有效保障机场安全。本项目将详细介绍前传检查岗位的含义、职责安排、工作流程以及特殊情况处置的内容。
@@ -30,40 +24,20 @@
          </div>
          <div class="video-box-cover">
            <p class="center text">
              <video
                :src="videoPathOne"
                webkit-playsinline="true"
                x-webkit-airplay="true"
                playsinline="true"
                x5-video-orientation="h5"
                x5-video-player-fullscreen="true"
                x5-playsinline=""
                controls
                controlslist="nodownload"
                class="w100 video"
                style="border-radius: 10px"
              ></video>
              <video :src="videoPathOne" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true"
                x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls
                controlslist="nodownload" class="w100 video" style="border-radius: 10px"></video>
            </p>
            <p class="center videoname">
              <span>视频：前传岗位介绍（导入） </span>
              <el-tooltip
                class="item"
                effect="dark"
                :content="chapterData.isCollectVideo ? '点击取消' : '点击收藏'"
                placement="top-start"
              >
                <img
                  :src="
                    collectResourceList.findIndex(
                      (item) => item.id == '3be8acd96beeba7bfb62cf26e46fb7dd'
                    ) > -1
                      ? collectCheck
                      : collectImg
                  "
                  alt=""
                  class="collect-btn"
                  @click="handleCollect('video-01')"
                />
              <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideo ? '点击取消' : '点击收藏'"
                placement="top-start">
                <img :src="collectResourceList.findIndex(
                  (item) => item.id == '3be8acd96beeba7bfb62cf26e46fb7dd'
                ) > -1
                    ? collectCheck
                    : collectImg
                  " alt="" class="collect-btn" @click="handleCollect('video-01')" />
              </el-tooltip>
            </p>
          </div>
@@ -88,13 +62,8 @@
        </ul>
        <div class="bodystyle p-odd">
          <p class="left mt-20 mb-20"><span class="bj2">·学习任务单·</span></p>
          <table
            border="1"
            cellpadding="4"
            cellspacing="0"
            style="border-color: #fff; border-collapse: collapse"
            class="fz-14 img-0"
          >
          <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff; border-collapse: collapse"
            class="fz-14 img-0">
            <tr class="table-th-bc">
              <td class="center" rowspan="3">任务目标</td>
              <td class="center">知识目标</td>
@@ -152,13 +121,8 @@
            <tr class="table-tr-bc">
              <td class="center w15">学习反思</td>
              <td class="center" colspan="2">
                <textarea
                  v-model="tableData.teskTableOne.one"
                  placeholder="请输入内容"
                  rows="6"
                  class="img-0 b0 table-textarea textarea-box"
                  @change="setBookTableData"
                ></textarea>
                <textarea v-model="tableData.teskTableOne.one" placeholder="请输入内容" rows="6"
                  class="img-0 b0 table-textarea textarea-box" @change="setBookTableData"></textarea>
              </td>
            </tr>
          </table>
@@ -185,11 +149,7 @@
    <div class="page-box" page="36">
      <div v-if="showPageList.indexOf(36) > -1">
        <ul class="fl al-c jc-fe mr-70 pad-t-55 mb-45">
          <img
            class="headerImg mr-10"
            src="../../assets/images/headerlogo.png"
            alt=""
          />
          <img class="headerImg mr-10" src="../../assets/images/headerlogo.png" alt="" />
          <li class="headerText">项目三</li>
          <li class="headerText">前传检查</li>
          <li class="headerNumber">29</li>
@@ -212,62 +172,32 @@
          <p>（6）协助验证检查员复查旅客登机牌，防止出现漏检现象。</p>
          <div class="video-box-cover">
            <p class="center text">
              <video
                :src="videoPathTwo"
                webkit-playsinline="true"
                x-webkit-airplay="true"
                playsinline="true"
                x5-video-orientation="h5"
                x5-video-player-fullscreen="true"
                x5-playsinline=""
                controls
                controlslist="nodownload"
                class="w100 video"
                style="border-radius: 10px"
              ></video>
              <video :src="videoPathTwo" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true"
                x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls
                controlslist="nodownload" class="w100 video" style="border-radius: 10px"></video>
            </p>
            <p class="center videoname">
              <span>视频：前传岗位主要职责 </span>
              <el-tooltip
                class="item"
                effect="dark"
                :content="chapterData.isCollectVideo2 ? '点击取消' : '点击收藏'"
                placement="top-start"
              >
                <img
                  :src="
                    collectResourceList.findIndex(
                      (item) => item.id == '1a8b239d665e109faeb1ad12e229a674'
                    ) > -1
                      ? collectCheck
                      : collectImg
                  "
                  alt=""
                  class="collect-btn"
                  @click="handleCollect('video-02')"
                />
              <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideo2 ? '点击取消' : '点击收藏'"
                placement="top-start">
                <img :src="collectResourceList.findIndex(
                  (item) => item.id == '1a8b239d665e109faeb1ad12e229a674'
                ) > -1
                    ? collectCheck
                    : collectImg
                  " alt="" class="collect-btn" @click="handleCollect('video-02')" />
              </el-tooltip>
            </p>
          </div>
          <p class="left mt-20 mb-20"><span class="bj2">·效果检测·</span></p>
          <p>1.请根据前传员的工作职责，两人一组进行情境模拟训练。</p>
          <textarea
            v-model="questionData.teskOne.one"
            placeholder="请输入内容"
            rows="6"
            class="fz-14 textarea-box-right"
            @change="setBookQuestion"
          ></textarea>
          <textarea v-model="questionData.teskOne.one" placeholder="请输入内容" rows="6" class="fz-14 textarea-box-right"
            @change="setBookQuestion"></textarea>
          <p>
            2.请旅客取出包内大件金属物品时，旅客表示不理解且不配合，你应该如何处理？
          </p>
          <textarea
            v-model="questionData.teskOne.two"
            placeholder="请输入内容"
            rows="6"
            class="fz-14 textarea-box-right"
            @change="setBookQuestion"
          ></textarea>
          <textarea v-model="questionData.teskOne.two" placeholder="请输入内容" rows="6" class="fz-14 textarea-box-right"
            @change="setBookQuestion"></textarea>
          <h2 id="b007">任务二<br />遵守岗位规范及情况处置原则</h2>
          <p class="left mt-20 mb-20"><span class="bj2">·任务描述·</span></p>
          <p>
@@ -285,13 +215,8 @@
        </ul>
        <div class="bodystyle p-odd">
          <p class="left mb-20 mt-20"><span class="bj2">·学习任务单·</span></p>
          <table
            border="1"
            cellpadding="4"
            cellspacing="0"
            style="border-color: #fff; border-collapse: collapse"
            class="fz-14 img-0"
          >
          <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff; border-collapse: collapse"
            class="fz-14 img-0">
            <tr class="table-th-bc">
              <td class="center" rowspan="3">任务目标</td>
              <td class="center">知识目标</td>
@@ -345,20 +270,15 @@
            <tr class="table-tr-bc">
              <td class="center w15">学习反思</td>
              <td class="center" colspan="2">
                <textarea
                  v-model="tableData.teskTableTwo.one"
                  placeholder="请输入内容"
                  rows="6"
                  class="img-0 b0 table-textarea textarea-box"
                  @change="setBookTableData"
                ></textarea>
                <textarea v-model="tableData.teskTableTwo.one" placeholder="请输入内容" rows="6"
                  class="img-0 b0 table-textarea textarea-box" @change="setBookTableData"></textarea>
              </td>
            </tr>
          </table>
          <p class="left"><span class="bj2">·知识准备·</span></p>
          <h3 id="c015">一、岗位工作流程</h3>
          <p>前传检查岗位的工作流程如图3-2所示。</p>
          <p class="center">
          <p class="center openImgBox">
            <img class="img-f" alt="" src="../../assets/images/0041-2.jpg" />
          </p>
          <p class="img">图3-2 前传检查岗位工作流程</p>
@@ -369,11 +289,7 @@
    <div class="page-box" page="38">
      <div v-if="showPageList.indexOf(38) > -1">
        <ul class="fl al-c jc-fe mr-70 pad-t-55 mb-45">
          <img
            class="headerImg mr-10"
            src="../../assets/images/headerlogo.png"
            alt=""
          />
          <img class="headerImg mr-10" src="../../assets/images/headerlogo.png" alt="" />
          <li class="headerText">项目三</li>
          <li class="headerText">前传检查</li>
          <li class="headerNumber">31</li>
@@ -397,78 +313,38 @@
          </p>
          <div class="video-box-cover">
            <p class="center text">
              <video
                :src="videoPathThree"
                webkit-playsinline="true"
                x-webkit-airplay="true"
                playsinline="true"
                x5-video-orientation="h5"
                x5-video-player-fullscreen="true"
                x5-playsinline=""
                controls
                controlslist="nodownload"
                class="w100 video"
                style="border-radius: 10px"
              ></video>
              <video :src="videoPathThree" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true"
                x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls
                controlslist="nodownload" class="w100 video" style="border-radius: 10px"></video>
            </p>
            <p class="center videoname">
              <span>视频：前传岗位特殊情况处理 </span>
              <el-tooltip
                class="item"
                effect="dark"
                :content="chapterData.isCollectVideo3 ? '点击取消' : '点击收藏'"
                placement="top-start"
              >
                <img
                  :src="
                    collectResourceList.findIndex(
                      (item) => item.id == '94b00baff32320b0c5f06e94951c0d22'
                    ) > -1
                      ? collectCheck
                      : collectImg
                  "
                  alt=""
                  class="collect-btn"
                  @click="handleCollect('video-03')"
                />
              <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideo3 ? '点击取消' : '点击收藏'"
                placement="top-start">
                <img :src="collectResourceList.findIndex(
                  (item) => item.id == '94b00baff32320b0c5f06e94951c0d22'
                ) > -1
                    ? collectCheck
                    : collectImg
                  " alt="" class="collect-btn" @click="handleCollect('video-03')" />
              </el-tooltip>
            </p>
          </div>
          <p class="left mt-20 mb-20"><span class="bj2">·效果检测·</span></p>
          <p>1.请描述前传检查岗位工作的基本流程。</p>
          <textarea
            v-model="questionData.teskTwo.one"
            placeholder="请输入内容"
            rows="6"
            class="fz-14 textarea-box-right"
            @change="setBookQuestion"
          ></textarea>
          <textarea v-model="questionData.teskTwo.one" placeholder="请输入内容" rows="6" class="fz-14 textarea-box-right"
            @change="setBookQuestion"></textarea>
          <p>2.当旅客在前传检查岗位提出携带了易碎物品时，应如何处理？</p>
          <textarea
            v-model="questionData.teskTwo.two"
            placeholder="请输入内容"
            rows="6"
            class="fz-14 textarea-box-right"
            @change="setBookQuestion"
          ></textarea>
          <textarea v-model="questionData.teskTwo.two" placeholder="请输入内容" rows="6" class="fz-14 textarea-box-right"
            @change="setBookQuestion"></textarea>
          <p>
            3.遇到不宜通过金属探测门检查的旅客，前传员应做什么？需要注意什么？
          </p>
          <textarea
            v-model="questionData.teskTwo.three"
            placeholder="请输入内容"
            rows="6"
            class="fz-14 textarea-box-right"
            @change="setBookQuestion"
          ></textarea>
          <textarea v-model="questionData.teskTwo.three" placeholder="请输入内容" rows="6" class="fz-14 textarea-box-right"
            @change="setBookQuestion"></textarea>
          <p class="fz-14 center" style="color: #8091bc">任务检测表</p>
          <table
            border="1"
            cellpadding="4"
            cellspacing="0"
            style="border-color: #fff; border-collapse: collapse"
            class="fz-14 img-0"
          >
          <table border="1" cellpadding="4" cellspacing="0" style="border-color: #fff; border-collapse: collapse"
            class="fz-14 img-0">
            <tr class="table-title-bc">
              <td class="center">任务目标</td>
              <td class="center">分值</td>
@@ -479,78 +355,43 @@
              <td class="center w15">岗位工作流程</td>
              <td class="center">20</td>
              <td class="center">
                <textarea
                  v-model="tableData.teskTableTwo.two"
                  placeholder="请输入内容"
                  rows="2"
                  class="b0 table-textarea textarea-box"
                  @change="setBookTableData"
                ></textarea>
                <textarea v-model="tableData.teskTableTwo.two" placeholder="请输入内容" rows="2"
                  class="b0 table-textarea textarea-box" @change="setBookTableData"></textarea>
              </td>
              <td class="center">
                <textarea
                  v-model="tableData.teskTableTwo.three"
                  placeholder="请输入内容"
                  rows="2"
                  class="b0 table-textarea textarea-box"
                  @change="setBookTableData"
                ></textarea>
                <textarea v-model="tableData.teskTableTwo.three" placeholder="请输入内容" rows="2"
                  class="b0 table-textarea textarea-box" @change="setBookTableData"></textarea>
              </td>
            </tr>
            <tr class="table-tr-bc">
              <td class="center">特殊情况处置</td>
              <td class="center w15">50</td>
              <td class="center">
                <textarea
                  v-model="tableData.teskTableTwo.four"
                  placeholder="请输入内容"
                  rows="2"
                  class="b0 table-textarea textarea-box"
                  @change="setBookTableData"
                ></textarea>
                <textarea v-model="tableData.teskTableTwo.four" placeholder="请输入内容" rows="2"
                  class="b0 table-textarea textarea-box" @change="setBookTableData"></textarea>
              </td>
              <td class="center">
                <textarea
                  v-model="tableData.teskTableTwo.five"
                  placeholder="请输入内容"
                  rows="2"
                  class="b0 table-textarea textarea-box"
                  @change="setBookTableData"
                ></textarea>
                <textarea v-model="tableData.teskTableTwo.five" placeholder="请输入内容" rows="2"
                  class="b0 table-textarea textarea-box" @change="setBookTableData"></textarea>
              </td>
            </tr>
            <tr class="table-th-bc">
              <td class="center w25">岗位职责</td>
              <td class="center">30</td>
              <td class="center">
                <textarea
                  v-model="tableData.teskTableTwo.six"
                  placeholder="请输入内容"
                  rows="2"
                  class="b0 table-textarea textarea-box"
                  @change="setBookTableData"
                ></textarea>
                <textarea v-model="tableData.teskTableTwo.six" placeholder="请输入内容" rows="2"
                  class="b0 table-textarea textarea-box" @change="setBookTableData"></textarea>
              </td>
              <td class="center">
                <textarea
                  v-model="tableData.teskTableTwo.seven"
                  placeholder="请输入内容"
                  rows="2"
                  class="b0 table-textarea textarea-box"
                  @change="setBookTableData"
                ></textarea>
                <textarea v-model="tableData.teskTableTwo.seven" placeholder="请输入内容" rows="2"
                  class="b0 table-textarea textarea-box" @change="setBookTableData"></textarea>
              </td>
            </tr>
          </table>
        </div>
      </div>
    </div>
    <preView
      :isClear="dialogVisible"
      :md5="p_md5"
      :pdfTitle="somePdfTitleValue"
      ref="pdfDialogRef"
    ></preView>
    <preView :isClear="dialogVisible" :md5="p_md5" :pdfTitle="somePdfTitleValue" ref="pdfDialogRef"></preView>
  </div>
</template>