zhongshujie
2024-09-05 5f52ef1659fee6858532c6a9731bd352d2f6fe6f
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
<template>
  <div class="chapter" num="4">
    <div class="page-box" page="12">
      <div v-if="showPageList.indexOf(12) > -1">
        <img class="img-0" alt="" src="../../assets/images/dy3.jpg" />
        <img src="../../assets/images/07.gif" alt="" style="width: 54%;" class="cover-gif">
      </div>
    </div>
    <div class="page-box" page="13">
      <div v-if="showPageList.indexOf(13) > -1" class="pg-mh fl fl-cl">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <p class="center">
            <img class="img-a" alt="" src="../../assets/images/06.gif" />
          </p>
          <h2 class="lefth2" id="b001">
            <img class="img-gn" alt="" src="../../assets/images/rhybx.jpg" />
          </h2>
          <h3 id="c001" class="fw-400 fz-26 mb-20">元素</h3>
          <p class="block2 fw-400 fz-26">双手按于身体两旁,模仿孩童天真可爱的样子</p>
          <p class="block1 w70"><span class="ls fz-26">——旁按手</span></p>
          <p class="block2 fz-26">单手旁按,指向1点方向</p>
          <p class="block1 w70"><span class="ls fz-26">——模仿钓鱼</span></p>
          <p class="block2 fz-26">单腿交替吸跳</p>
          <p class="block1 w70"><span class="ls fz-26">——吸跳步</span></p>
        </div>
        <ul class="pb-box">
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 10 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="14">
      <div v-if="showPageList.indexOf(14) > -1">
        <div>
          <img src="../../assets/images/chapter-three-header.png" class="w100" />
        </div>
        <div class="padding-96">
          <h3 id="c002">空间与方向</h3>
          <p class="block2">高、中空间</p>
          <p class="block2">1、2、4、8点方向</p>
          <h2 class="lefth2" id="b002">
            <img class="img-gn" alt="" src="../../assets/images/xsyty.jpg" />
          </h2>
          <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" ></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"></audio>
            </li>
          </ul>
          <h3 id="c009" style="margin-right: 4.5%;">小儿垂钓</h3>
          <p class="block2 fm-son" style="margin-right: 7.5%;">〔唐〕胡令能</p>
          <p class="block2 m16-0">蓬头稚子学垂纶,</p>
          <p class="block2 m16-0">侧坐莓苔草映身。</p>
          <p class="block2 m16-0">路人借问遥招手,</p>
          <p class="block2 m16-0">怕得鱼惊不应人。</p>
          <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="margin-top: 40px;"
          ></video>
        </div>
        <ul>
          <li class="fl ju-end mr-40">
            <div>
              <span class="dl-ib"> 11 </span>
              <img src="../../assets/images/icon/tree.jpg" />
            </div>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="15">
      <div v-if="showPageList.indexOf(15) > -1" class="pg-mh">
        <img
          src="../../assets/images/pageContentHeader.jpg"
          alt=""
          class="w100 mb-40"
        />
        <div class="padding-96">
          <h2 class="lefth2" id="b003">
            <img class="img-gn" alt="" src="../../assets/images/czysj.jpg" />
          </h2>
          <div class="bj1">
            <p class="block">
              <img
                class="inline"
                alt=""
                src="../../assets/images/dn.png"
              />运用所学舞蹈元素,设立孩童钓鱼的两个不同场景。
            </p>
            <p class="block">
              <img
                class="inline"
                alt=""
                src="../../assets/images/dn.png"
              />学生自愿分组,每组自行设置与该诗情感相关的主题,在教师的引导下进行创编,并富有情感地展示出来。
            </p>
          </div>
          <h2 class="lefth2" id="b004">
            <img class="img-gn1" alt="" src="../../assets/images/tz.jpg" />
          </h2>
          <div class="bj2">
            <p class="block">
              观察生活中钓鱼者的形象,根据已学舞蹈元素,创编出新的单一舞蹈动作或者造型吧。
            </p>
          </div>
        </div>
        <ul class="pb-box">
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 12 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>
 
<script>
import {getResourcePath} from "@/assets/methods/resources";
  export default {
    name:"chapterThree",
    props:{
      showPageList:{
        type:Array,
      }
    },
    mounted() {
      this.getVidoePath()
    },
    data() {
      return {
        videoPathOne:"",
        auidoPathOne:"",
        auidoPathTwo:""
      }
    },
    methods: {
   async getVidoePath() {
      this.videoPathOne = await getResourcePath("36a2cffb28e494bea887f9a905b11863");
      this.auidoPathOne = await getResourcePath("85923e871441c541991be07fe4ce8771");
      this.auidoPathTwo = await getResourcePath("c018f7a6434abfac0b0e0da1174d643a");
    },
  },
  }
</script>
 
<style lang="less" scoped>
.cover-gif {
  position: absolute;
  top: 32%;
  left: 22%;
 
}
</style>