<template>
|
<div class="chapter" num="4">
|
<div class="page-box" page="22">
|
<div v-if="showPageList.indexOf(22) > -1">
|
<h1 id="a004">
|
<!-- 这里的动图有问题，没有背景图片 -->
|
<img class="img-0" alt="" src="../../assets/images/dy3.jpg" />
|
<audio :src="auidoPathOne" controls class="audio" @play="audioPlay"></audio>
|
</h1>
|
<div class="bodystyle">
|
<div class="bk">
|
<div class="bj1">
|
<p class="left"><img class="img-gn" alt="" src="../../assets/images/dydd.jpg" /></p>
|
</div>
|
<p class="block" style="margin: 8% 5% 5% 7%">
|
每个人的心中都有一个舞台，演绎着生活的酸甜苦辣，记录着成长的点点滴滴。《一块奶酪》中的每只小蚂蚁也有很多心里话要表达，让我们一起演绎出来吧！</p>
|
</div>
|
</div>
|
<p><br /></p>
|
<!-- 此次为页脚部分（需要设置页码） -->
|
<div class="page-footer">
|
<img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
|
<div class="page-footer-number-right">19</div>
|
</div>
|
</div>
|
</div>
|
<div class="page-box" page="23">
|
<div v-if="showPageList.indexOf(23) > -1">
|
<h1>
|
<img src="../../assets/images/header-green.png" alt="" style="width: 100%;" />
|
</h1>
|
<img class="headerimg" src="../../assets/images/page5.png" alt="" />
|
<div class="bodystyle" style="margin-top: 3%">
|
|
<h2 id="b011" class="problem">第一课 吹响劳动的集结号</h2>
|
<h3 class="lefth3" id="c021"><img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" /></h3>
|
<p class="text">寒来暑往，秋收冬藏。一年四季，劳碌奔忙。</p>
|
<p class="text">团结一心，吹响号角。幸福生活，劳动创造。</p>
|
<p class="text"><span class="hs1">◇</span>说一说你会做哪些家务？</p>
|
<p class="text"><span class="hs1">◇</span>和小伙伴讨论劳动在生活中的作用。</p>
|
<p class="text"><span class="hs1">◇</span>表演一种家务劳动，请小伙伴猜一猜。</p>
|
<h3 class="lefth3" id="c022" style="margin-top: 7%"><img class="img-gn1" alt=""
|
src="../../assets/images/czysj.jpg" /></h3>
|
<p class="text"><span class="hs1">◇</span>邀请小伙伴分角色朗诵附录中的剧本选段1～2，重读加点文字。</p>
|
<p class="block3" style=""><span class="hs">剧本</span></p>
|
<p class="center1 text" style="font-size: 25px; margin: 3% 0;"><span class="hs">一块奶酪</span></p>
|
<p class="center text"><img class="img-e" alt="" src="../../assets/images/0024-1.jpg" /></p>
|
<i class="el-icon-folder-opened text" style="color: brown;">选段1</i>
|
<i class="el-icon-folder-opened text" style="color: brown;">选段2</i>
|
</div>
|
<p><br /></p>
|
<!-- 此次为页脚部分（需要设置页码） -->
|
<div class="page-footer">
|
<img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
|
<div class="page-footer-number-left">20</div>
|
</div>
|
</div>
|
</div>
|
<div class="page-box" page="24">
|
<div v-if="showPageList.indexOf(24) > -1">
|
<h1>
|
<img src="../../assets/images/unit3-header-img.png" alt="" style="height: auto; width: 100%" />
|
</h1>
|
<div class="bodystyle" style="margin-top: 3%;">
|
<h2 id="b012" class="problem">第二课 意外发生了！</h2>
|
<h3 class="lefth3" id="c023"><img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" /></h3>
|
<p class="text"><span class="hs1">◇</span>当上半场比赛失利，中场休息时，你会怎么做？当别人夸赞你的时候，你会怎么做？请你和朋友一起演一演吧。</p>
|
<h3 class="lefth3" id="c024" style="margin-top: 7%;"><img class="img-gn1" alt=""
|
src="../../assets/images/czysj.jpg" /></h3>
|
<p class="center openImgBox"><img class="img-e" alt="" src="../../assets/images/3-2.gif" /></p>
|
<p class="text"><span class="hs1">◇</span>请把蚂蚁队长的台词和他的内心独白连起来吧！</p>
|
<!-- 连线题 -->
|
<matching :rawData="rawData" :question="question" class="macthing" :primaryColor="'transparent'">
|
</matching>
|
</div>
|
<!-- 此次为页脚部分（需要设置页码） -->
|
<div class="page-footer">
|
<img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
|
<div class="page-footer-number-right">21</div>
|
</div>
|
</div>
|
</div>
|
<div class="page-box" page="25">
|
<div v-if="showPageList.indexOf(25) > -1">
|
<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" style="margin-top: 3%;">
|
<h2 id="b013" class="problem">第三课 我该怎么办？</h2>
|
<h3 class="lefth3" id="c025"><img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" /></h3>
|
<p class="text"><span class="hs1">◇</span>在《一块奶酪》的故事中，蚂蚁队长也起过贪心，但他最终成功克服了贪心，你认为他是怎么做到的呢？</p>
|
<p><input v-model="questionData.warnUp.one" class="input-bottom-border fz-18 "
|
@change="setBookQuestion" style="width: 90%" /></p>
|
<h3 class="lefth3" id="c026" style="margin-top: 7%;"><img class="img-gn1" alt=""
|
src="../../assets/images/czysj.jpg" /></h3>
|
<p class="text"><span class="hs1">◇</span>阅读附录中的剧本选段5，为自己的表演设计动作吧！</p>
|
<p class="center openImgBox"><img class="img-e" alt="" src="../../assets/images/3-3.gif" /></p>
|
</div>
|
<!-- 此次为页脚部分（需要设置页码） -->
|
<div class="page-footer">
|
<img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
|
<div class="page-footer-number-left">22</div>
|
</div>
|
</div>
|
</div>
|
<div class="page-box" page="26">
|
<div v-if="showPageList.indexOf(26) > -1">
|
<h1>
|
<img src="../../assets/images/unit3-header-img.png" alt="" style="width: 100%; height: auto" />
|
</h1>
|
<div class="bodystyle" style="margin-top: 3%;">
|
<h2 id="b014" class="problem">第四课 皆大欢喜</h2>
|
<h3 class="lefth3" id="c027"><img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" /></h3>
|
<p class="text"><span class="hs1">◇</span>请按照事件六要素的结构给大家分享一件快乐的事吧！</p>
|
<p class="text">时间：<input v-model="questionData.warnUp.two" class="input-bottom-border fz-18"
|
@change="setBookQuestion" style="width: 70%" /></p>
|
<p class="text">地点：<input v-model="questionData.warnUp.three" class="input-bottom-border fz-18"
|
@change="setBookQuestion" style="width: 70%" /></p>
|
<p class="text">人物：<input v-model="questionData.warnUp.four" class="input-bottom-border fz-18"
|
@change="setBookQuestion" style="width: 70%" /></p>
|
<p class="text">起因：<input v-model="questionData.warnUp.five" class="input-bottom-border fz-18"
|
@change="setBookQuestion" style="width: 70%" /></p>
|
<p class="text">经过：<input v-model="questionData.warnUp.six" class="input-bottom-border fz-18"
|
@change="setBookQuestion" style="width: 70%" /></p>
|
<p class="text">结果：<input v-model="questionData.warnUp.seven" class="input-bottom-border fz-18"
|
@change="setBookQuestion" style="width: 70%" /></p>
|
<p class="text" style="margin-top: 7%;"><span class="hs1">◇</span>你有烦恼吗？说一说是什么，你是怎么处理它的？</p>
|
<p><input v-model="questionData.warnUp.enight" class="input-bottom-border fz-18"
|
@change="setBookQuestion" style="width: 85%" /></p>
|
</div>
|
<!-- 此次为页脚部分（需要设置页码） -->
|
<div class="page-footer">
|
<img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
|
<div class="page-footer-number-right">23</div>
|
</div>
|
</div>
|
</div>
|
<div class="page-box" page="27">
|
<div v-if="showPageList.indexOf(27) > -1">
|
<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" style="margin-top: 3%;">
|
<h3 class="lefth3" id="c028"><img class="img-gn1" alt="" src="../../assets/images/czysj.jpg" /></h3>
|
<p class="text"><span class="hs1">◇</span>运用重音、内心独白和动作设计等表现方式，将《一块奶酪》的故事表演出来吧！（剧本见附录）</p>
|
<p class="center openImgBox"><img class="img-e" alt="" src="../../assets/images/3-3.gif" /></p>
|
</div>
|
<!-- 此次为页脚部分（需要设置页码） -->
|
<div class="page-footer">
|
<img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
|
<div class="page-footer-number-left">24</div>
|
</div>
|
</div>
|
</div>
|
<div class="page-box" page="28">
|
<div v-if="showPageList.indexOf(28) > -1">
|
<h1>
|
<img src="../../assets/images/unit3-header-img.png" alt="" style="width: 100%; height: auto" />
|
</h1>
|
<div class="bodystyle" style="margin-top: 3%;">
|
<h2 id="b015" class="problem">单元活动任务</h2>
|
<h3 class="lefth3" id="c029"><img class="img-gn1" alt="" src="../../assets/images/xsyty.jpg" /></h3>
|
<p class="text"><span class="hs1">◇</span>喘气练习</p>
|
<p class="text">平视前方，肩膀放松，双手自然下垂或叉腰，双脚分开，与肩同宽。模仿小狗喘气，感受腹部的“呼吸”状态，想象自己的腹部是一个气球，在吸气时腹部向外扩张，吐气时腹部向内收缩。
|
</p>
|
<p class="text"><span class="hs1">◇</span>“嘶”声练习</p>
|
<p class="text">在“喘气练习”的基础上，发出“嘶”音，每组4短1长。</p>
|
<p class="text"><span class="hs1">◇</span>“嘟”音练习</p>
|
<p class="text">平视前方，肩膀放松，双手自然下垂，双脚分开，与肩同宽。放松双唇，深吸气，吹出气流带动嘴唇抖动，发出“嘟”的声音，声音越长越好。</p>
|
<p class="text"><span class="hs1">◇</span>“我们赞美长江”气声练习</p>
|
<p class="text">平视前方，肩膀放松，双手自然下垂，双脚分开，与肩同宽。以说悄悄话的感觉，说出“我们赞美长江”，并逐步增加气声的力度，找到在舞台上说悄悄话的感觉。</p>
|
</div>
|
<!-- 此次为页脚部分（需要设置页码） -->
|
<div class="page-footer">
|
<img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
|
<div class="page-footer-number-right">25</div>
|
</div>
|
</div>
|
</div>
|
<div class="page-box" page="29">
|
<div v-if="showPageList.indexOf(29) > -1">
|
<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" style="margin-top: 3%">
|
<h3 class="lefth3" id="c030"><img class="img-gn1" alt="" src="../../assets/images/tzyys.jpg" /></h3>
|
<p class="text"><span
|
class="hs1">◇</span>劳动最光荣！请为家中长辈做一件力所能及的事情，用实际行动表达你的爱意！体验过程中要记住每一个动作的细节，再尝试以无实物表演的方式进行展示。
|
</p>
|
<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" @play="videoPlay"
|
style="margin-top: 40px; border-radius: 10px; border: 2px solid green;"></video>
|
</p>
|
<p class="center videoname">
|
<span>视频：心有多大，舞台就有多大 </span>
|
<el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideo ? '点击取消' : '点击收藏'"
|
placement="top-start">
|
<img :src="chapterData.isCollectVideo ? collectCheck : collectImg" alt=""
|
class="collect-btn" @click="handleCollect('video')" />
|
</el-tooltip>
|
</p>
|
</div>
|
<!-- 此次为页脚部分（需要设置页码） -->
|
<div class="page-footer">
|
<img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
|
<div class="page-footer-number-left">26</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import matching from "@/components/matching/matching.vue";
|
import { getResourcePath } from "@/assets/methods/resources";
|
export default {
|
name: "chapterThree",
|
components: { matching },
|
props: {
|
showPageList: {
|
type: Array,
|
},
|
primaryColor: {
|
type: String,
|
default: "red",
|
}
|
},
|
//在这里对调用的方法进行挂载
|
mounted() {
|
this.getVidoePath();
|
const bookQuestion = localStorage.getItem("artAndDrama-book-question-three");
|
if (bookQuestion) {
|
this.questionData = JSON.parse(bookQuestion);
|
}
|
},
|
data() {
|
return {
|
collectImg: require("../../assets/images/icon/heart.png"),
|
collectCheck: require("../../assets/images/icon/heart-check.png"),
|
videoPathOne: "",
|
auidoPathOne: "",
|
chapterData: {
|
isCollectImg: false,
|
isCollectVideo: false,
|
txtOne: "",
|
txtTwo: "",
|
},
|
rawData: {
|
left: [
|
{
|
oldId: "FB34",
|
txt: "“掉了一个角，这该怎么办！”",
|
},
|
{
|
oldId: "64D6",
|
txt: "“丢掉，实在太可惜！”",
|
},
|
{
|
oldId: "2ED4",
|
txt: "“我要是偷嘴谁也看不见。”",
|
},
|
],
|
right: [
|
{
|
oldId: "64D6",
|
txt: "不能丢掉啊，如果能给我吃就太好了！",
|
},
|
{
|
oldId: "2ED4",
|
txt: "要不我把奶酪偷偷吃了吧。",
|
},
|
{
|
oldId: "FB34",
|
txt: "好可惜啊，这么美味的奶酪！",
|
},
|
],
|
},
|
question: {
|
KnowledgePoint: "123",
|
analysis: "123",
|
answer: [
|
{
|
id: "FB34",
|
linkValue: "“掉了一个角，这该怎么办！”",
|
value: "好可惜啊，这么美味的奶酪！",
|
},
|
{
|
id: "64D6",
|
linkValue: "“丢掉，实在太可惜！”",
|
value: "不能丢掉啊，如果能给我吃就太好了！",
|
},
|
{
|
id: "2ED4",
|
linkValue: "“我要是偷嘴谁也看不见。”",
|
value: "要不我把奶酪偷偷吃了吧。",
|
},
|
],
|
optionStyle: undefined,
|
id: 489306,
|
options: {
|
linkValues: [
|
{
|
oldId: "FB34",
|
txt: "“掉了一个角，这该怎么办！”",
|
},
|
{
|
oldId: "64D6",
|
txt: "“丢掉，实在太可惜！”",
|
},
|
{
|
oldId: "2ED4",
|
txt: "“我要是偷嘴谁也看不见。”",
|
},
|
],
|
values: [
|
{
|
oldId: "64D6",
|
txt: "不能丢掉啊，如果能给我吃就太好了！",
|
},
|
{
|
oldId: "2ED4",
|
txt: "要不我把奶酪偷偷吃了吧。",
|
},
|
{
|
oldId: "FB34",
|
txt: "好可惜啊，这么美味的奶酪！",
|
},
|
],
|
},
|
questionType: "matching",
|
stem: {
|
stemTxt: "按顺序连线",
|
},
|
stemStyle: undefined,
|
titleDescription: "1",
|
userChoise: [],
|
value: [],
|
answerImg: require("../../assets/images/matching-two.png"),
|
},
|
questionData: {
|
warnUp: {
|
one: "",
|
two: "",
|
three: "",
|
four: "",
|
five: "",
|
six: "",
|
seven: "",
|
enight: "",
|
},
|
reading: {
|
one: "",
|
two: "",
|
},
|
table: {
|
one: "",
|
two: "",
|
three: "",
|
four: "",
|
five: "",
|
six: "",
|
seven: "",
|
enight: "",
|
nine: "",
|
},
|
},
|
};
|
},
|
methods: {
|
//视频和音频的MD5地址
|
async getVidoePath() {
|
// 视频Md5地址
|
this.videoPathOne = await getResourcePath(
|
"dd44a1e31b4304f50d10b2481a148411"
|
);
|
// 音频Md5地址
|
// this.auidoPathOne = await getResourcePath(
|
// "2c5f6c69b0f9f7a3c03e473cb8c977f5"
|
// );
|
|
},
|
setBookQuestion() {
|
console.log("保存");
|
localStorage.setItem(
|
"artAndDrama-book-question-three",
|
JSON.stringify(this.questionData)
|
);
|
},
|
audioPlay(e) {
|
this.$emit('closeAudio', e.srcElement.currentSrc)
|
},
|
videoPlay(e) {
|
this.$emit('closeVideo', e.srcElement.currentSrc)
|
},
|
handleChapterData() {
|
localStorage.setItem(
|
"math-chapterData",
|
JSON.stringify(this.chapterData)
|
);
|
},
|
handleCollect(type) {
|
if (type == "img") {
|
this.chapterData.isCollectImg = !this.chapterData.isCollectImg;
|
} else if (type == "video") {
|
this.chapterData.isCollectVideo = !this.chapterData.isCollectVideo;
|
}
|
this.handleChapterData();
|
},
|
},
|
};
|
</script>
|
|
<style lang="less" scoped>
|
.w70 {
|
width: 78%;
|
}
|
|
.fw-400 {
|
font-weight: 400 !important;
|
}
|
|
.fz-26 {
|
font-size: 26px !important;
|
}
|
|
.cover-img {
|
position: absolute;
|
top: 33%;
|
left: 23%;
|
}
|
|
.division-line {
|
width: 2px;
|
height: 100%;
|
background-color: red;
|
}
|
|
.macthing {
|
background-color: rgb(188, 220, 164);
|
padding: 3% 0;
|
margin: 0% 8%;
|
}
|
</style>
|
