闫增涛
2024-06-14 ffe5406df610d814f3ab9e42a12922a0a3f5f797
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
186
187
188
189
190
191
192
<template>
  <div class="chapter" num="5">
    <div class="page-box" page="16">
      <div v-if="showPageList.indexOf(16) > -1">
        <img class="img-0" alt="" src="../../assets/images/dy4.jpg" />
        <img src="../../assets/images/08.gif" alt="" style="width: 55%;" class="cover-gif">
      </div>
    </div>
    <div class="page-box" page="17">
      <div v-if="showPageList.indexOf(17) > -1" class="pg-mh fl fl-cl ju-bt">
        <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/09.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">单臂或双臂于体旁</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>
          <p class="block2 fz-26">单手或双手于胸前</p>
          <p class="block1 w70"><span class="ls fz-26">——单按掌、胸前交叉按掌</span></p>
        </div>
        <ul>
          <li class="ml-40">
            <img src="../../assets/images/icon/tree.jpg" />
            <span class="dl-ib"> 14 </span>
          </li>
          <li>
            <img class="img-0" alt="" src="../../assets/images/ym.jpg" />
          </li>
        </ul>
      </div>
    </div>
    <div class="page-box" page="18">
      <div v-if="showPageList.indexOf(18) > -1">
        <div>
          <img src="../../assets/images/chapter-four-header.png" class="w100" />
        </div>
        <div class="padding-96">
          <p class="block2 fz-26">单托掌和单山膀手</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>
          <h3 id="c002">空间与方向</h3>
          <p class="block2">高、中空间</p>
          <p class="block2">1-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" @play="audioPlay"></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>
            </li>
          </ul>
          <h3 id="c012">寻隐者不遇</h3>
          <p class="block2 fm-son">〔唐〕贾岛</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"
            style="margin-top: 40px;"
          ></video>
        </div>
        <ul>
          <li class="fl ju-end mr-40">
            <div>
              <span class="dl-ib"> 15 </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="19">
      <div v-if="showPageList.indexOf(19) > -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"> 16 </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:"chapterFour",
    props:{
      showPageList:{
        type:Array,
      }
    },
    mounted() {
      this.getVidoePath()
    },
    data() {
      return {
        videoPathOne:"",
        auidoPathOne:"",
        auidoPathTwo:""
      }
    },
    methods: {
   async getVidoePath() {
      this.videoPathOne = await getResourcePath("20b7d2311433c78a4fddf69d09a5fb43");
      this.auidoPathOne = await getResourcePath("a865ff99b91fa24d87ac81a883be54db");
      this.auidoPathTwo = await getResourcePath("66f3cc00d272a120514201e13e87fb9d");
    },
    audioPlay(e) {
      this.$emit('closeAudio',e.srcElement.currentSrc)
    }
  },
  }
</script>
 
<style lang="less" scoped>
.cover-gif {
  position: absolute;
  top: 32%;
  left: 22%;
 
}
</style>