| | |
| | | <div class="page-box" page="7"> |
| | | <div class="w100 mb-20" style="padding-right: 20px"> |
| | | <div |
| | | class="w100 event-header-bc fl al-end" |
| | | class="event-header-bc fl al-end" |
| | | style="height: 100px; padding-left: 40px" |
| | | > |
| | | <div class="preface-header-box event-header-text-bc"> |
| | |
| | | <div class="fl ju-bt"> |
| | | <div class="left" style="width:48%"> |
| | | <p class="center"> |
| | | <el-image |
| | | :src="imgOne" |
| | | :preview-src-list="[imgOne]" |
| | | class="w100" |
| | | /> |
| | | <el-image :src="imgOne" :preview-src-list="[imgOne]" /> |
| | | </p> |
| | | <p class="center">1._____________________</p> |
| | | <p class="center"> |
| | | 1.<input |
| | | v-model="questionData.warnUp.one.value" |
| | | class="input-bottom-border fz-18" |
| | | @blur="handleQuestion('one')" |
| | | /> |
| | | <i |
| | | class="el-icon-check correct-icon" |
| | | v-if="questionData.warnUp.one.isRight" |
| | | ></i> |
| | | <i class="el-icon-close error-icon" v-if="questionData.warnUp.one.isRight == false"></i> |
| | | </p> |
| | | </div> |
| | | <div class="right" style="width:48%"> |
| | | <p class="center"> |
| | | <el-image |
| | | :src="imgTwo" |
| | | :preview-src-list="[imgTwo]" |
| | | class="w100" |
| | | style="width: 96%" |
| | | /> |
| | | </p> |
| | | <p class="center">2._____________________</p> |
| | | <p class="center"> |
| | | 2.<input class="input-bottom-border fz-18" /> |
| | | </p> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="fl ju-bt"> |
| | | <div class="left" style="width:48%"> |
| | | <p class="center"> |
| | | <el-image |
| | | :src="imgThree" |
| | | :preview-src-list="[imgThree]" |
| | | class="w100" |
| | | /> |
| | | <el-image :src="imgThree" :preview-src-list="[imgThree]" /> |
| | | </p> |
| | | <p class="center">3._____________________</p> |
| | | <p class="center"> |
| | | 3.<input class="input-bottom-border fz-18" /> |
| | | </p> |
| | | </div> |
| | | <div class="right" style="width:48%"> |
| | | <p class="center"> |
| | | <el-image |
| | | :src="imgFour" |
| | | :preview-src-list="[imgFour]" |
| | | class="w100" |
| | | style="width: 94%" |
| | | /> |
| | | </p> |
| | | <p class="center">4._____________________</p> |
| | | <p class="center"> |
| | | 4.<input class="input-bottom-border fz-18" /> |
| | | </p> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="fl ju-bt"> |
| | | <div class="left" style="width:48%"> |
| | | <p class="center"> |
| | | <el-image |
| | | :src="imgFive" |
| | | :preview-src-list="[imgFive]" |
| | | class="w100" |
| | | /> |
| | | <el-image :src="imgFive" :preview-src-list="[imgFive]" /> |
| | | </p> |
| | | <p class="center">5._____________________</p> |
| | | <p class="center"> |
| | | 5.<input class="input-bottom-border fz-18" /> |
| | | </p> |
| | | </div> |
| | | <div class="right" style="width:48%"> |
| | | <p class="center"> |
| | | <el-image |
| | | :src="imgSix" |
| | | :preview-src-list="[imgSix]" |
| | | class="w100" |
| | | style="width: 94%" |
| | | /> |
| | | </p> |
| | | <p class="center">6._____________________</p> |
| | | <p class="center"> |
| | | 6.<input class="input-bottom-border fz-18" /> |
| | | </p> |
| | | </div> |
| | | </div> |
| | | <p><b>Ⅱ.What other symbols can you think of?</b></p> |
| | | <p>_________________________________________</p> |
| | | <p> |
| | | <b>Ⅱ.What other symbols can you think of?</b> |
| | | <button class="parimary-btn" @click="showAnswer('seven')"> |
| | | 显示答案 |
| | | </button> |
| | | </p> |
| | | <p> |
| | | <input |
| | | v-model="questionData.warnUp.seven" |
| | | class="input-bottom-border w100 fz-18" |
| | | /> |
| | | </p> |
| | | </div> |
| | | </div> |
| | | <div class="preface-bottom"> |
| | |
| | | imgFour:require("../../assets/images/0012-4.jpg"), |
| | | imgFive:require("../../assets/images/0012-5.jpg"), |
| | | imgSix:require("../../assets/images/0012-6.jpg"), |
| | | questionData: { |
| | | warnUp: { |
| | | one: { |
| | | value: "", |
| | | isRight:null, |
| | | }, |
| | | two:{ |
| | | value:"", |
| | | isRight:null, |
| | | }, |
| | | three:{ |
| | | value: "", |
| | | isRight:null, |
| | | }, |
| | | four:{ |
| | | value: "", |
| | | isRight:null, |
| | | }, |
| | | five:{ |
| | | value: "", |
| | | isRight:null, |
| | | }, |
| | | six:{ |
| | | value: "", |
| | | isRight:null, |
| | | }, |
| | | seven:{ |
| | | value: "", |
| | | isRight:null, |
| | | }, |
| | | }, |
| | | }, |
| | | }; |
| | | }, |
| | | methods: { |
| | | showAnswer(type) { |
| | | if (type == "seven") { |
| | | this.questionData.warnUp.seven = "This is a good idear."; |
| | | } |
| | | }, |
| | | handleQuestion(type) { |
| | | if (type == "one") { |
| | | return this.questionData.warnUp.one.value ? this.questionData.warnUp.one.isRight = this.questionData.warnUp.one.value == "你好" : this.questionData.warnUp.one.isRight = null |
| | | } |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="less" scoped> |
| | | </style> |
| | | <style lang="less" scoped></style> |