From eede90603b539f0945d0b26ffa00e1baaaa6af34 Mon Sep 17 00:00:00 2001
From: zhongshujie <2862698242@qq.com>
Date: 星期三, 06 十一月 2024 17:41:01 +0800
Subject: [PATCH] 艺术戏剧（手机端修改完成）
---
src/books/artAndDrama/view/components/chapter003.vue | 436 +++++++++++++++++++-----------------------------------
1 files changed, 155 insertions(+), 281 deletions(-)
diff --git a/src/books/artAndDrama/view/components/chapter003.vue b/src/books/artAndDrama/view/components/chapter003.vue
index cdd58ce..29ce7d4 100644
--- a/src/books/artAndDrama/view/components/chapter003.vue
+++ b/src/books/artAndDrama/view/components/chapter003.vue
@@ -5,12 +5,8 @@
<h1 id="a004">
<!-- 杩欓噷鐨勫姩鍥炬湁闂锛屾病鏈夎儗鏅浘鐗� -->
<img class="img-0" alt="" src="../../assets/images/dy3.jpg" />
- <audio
- :src="audioPathOne"
- controls
- controlslist="noplaybackrate nodownload"
- class="audio"
- ></audio>
+ <audio style="margin-top: 1em" :src="audioPathOne" controls controlslist="noplaybackrate nodownload"
+ class="audio"></audio>
</h1>
<div class="bodystyle">
<div class="bk">
@@ -19,7 +15,7 @@
<img class="img-gn" alt="" src="../../assets/images/dydd.jpg" />
</p>
</div>
- <p class="" style="margin: 8% 5% 5% 7%">
+ <p class="block mar-block">
姣忎釜浜虹殑蹇冧腑閮芥湁涓�涓垶鍙帮紝婕旂粠鐫�鐢熸椿鐨勯吀鐢滆嫤杈ｏ紝璁板綍鐫�鎴愰暱鐨勭偣鐐规淮婊淬�傘�婁竴鍧楀ザ閰�嬩腑鐨勬瘡鍙皬铓傝殎涔熸湁寰堝蹇冮噷璇濊琛ㄨ揪锛岃鎴戜滑涓�璧锋紨缁庡嚭鏉ュ惂锛�
</p>
</div>
@@ -27,11 +23,7 @@
<p><br /></p>
<!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
<div class="page-footer">
- <img
- class="page-footer-image"
- src="../../assets/images/ym.jpg"
- alt="Page Image"
- />
+ <img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
<div class="page-footer-number-right">19</div>
</div>
</div>
@@ -39,11 +31,7 @@
<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%"
- />
+ <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%">
@@ -53,52 +41,38 @@
</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 class="text rhombusFather"><span class="hs1 rhombus">鈼�</span>璇翠竴璇翠綘浼氬仛鍝簺瀹跺姟锛�</p>
+ <p class="text rhombusFather">
+ <span class="hs1 rhombus">鈼�</span>鍜屽皬浼欎即璁ㄨ鍔冲姩鍦ㄧ敓娲讳腑鐨勪綔鐢ㄣ��
</p>
- <p class="text">
- <span class="hs1">鈼�</span>琛ㄦ紨涓�绉嶅鍔″姵鍔紝璇峰皬浼欎即鐚滀竴鐚溿��
+ <p class="text rhombusFather">
+ <span class="hs1 rhombus ">鈼�</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 class="text rhombusFather">
+ <span class="hs1 rhombus">鈼�</span>閭�璇峰皬浼欎即鍒嗚鑹叉湕璇甸檮褰曚腑鐨勫墽鏈�夋1锝�2锛岄噸璇诲姞鐐规枃瀛椼��
</p>
<p class="block3" style="margin: 3% 0%">
- <span class="hs">鍓ф湰:銆�涓�鍧楀ザ閰�</span>
+ <span class="hs">鍓ф湰:銆�涓�鍧楀ザ閰紙閫夋1~2锛�</span>
</p>
<!-- <p class="center1 text" style="font-size: 25px; margin: 3% 0;"><span class="hs">涓�鍧楀ザ閰�</span></p> -->
<!-- 姝ゅ涓洪檮褰曡祫婧愬 -->
<div class="Options text">
- <span
- class="folder"
- v-for="(segment, index) in segments"
- :key="index"
- @click="showContent(index)"
- ><img src="../../assets/images/icon/folder.svg" alt="" />閫夋{{
- segment
- }}</span
- >
+ <span class="folder" v-for="(segment, index) in segments" :key="index" @click="showContent(index)"><img
+ src="../../assets/images/icon/folder.svg" alt="" />閫夋{{
+ segment
+ }}</span>
</div>
- <div
- v-if="activeIndex !== null"
- class="content-wrapper text"
- v-html="activeContent"
- ></div>
+ <div v-if="activeIndex !== null" class="content-wrapper text" v-html="activeContent"></div>
<p class="center text">
<img class="img-e" alt="" src="../../assets/images/0024-1.jpg" />
</p>
</div>
<!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
<div class="page-footer">
- <img
- class="page-footer-image"
- src="../../assets/images/ym.jpg"
- alt="Page Image"
- />
+ <img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
<div class="page-footer-number-left">20</div>
</div>
</div>
@@ -106,20 +80,15 @@
<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%"
- />
+ <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 class="text rhombusFather">
+ <span class="hs1 rhombus">鈼�</span>褰撲笂鍗婂満姣旇禌澶卞埄锛屼腑鍦轰紤鎭椂锛屼綘浼氭�庝箞鍋氾紵褰撳埆浜哄じ璧炰綘鐨勬椂鍊欙紝浣犱細鎬庝箞鍋氾紵璇蜂綘鍜屾湅鍙嬩竴璧锋紨涓�婕斿惂銆�
</p>
<h3 class="lefth3" id="c024" style="margin-top: 7%">
<img class="img-gn1" alt="" src="../../assets/images/czysj.jpg" />
@@ -127,26 +96,17 @@
<p class="center openImgBox">
<img class="img-e" alt="" src="../../assets/images/3-2.gif" />
</p>
- <p class="text">
- <span class="hs1">鈼�</span>璇锋妸铓傝殎闃熼暱鐨勫彴璇嶅拰浠栫殑鍐呭績鐙櫧杩炶捣鏉ュ惂锛�
+ <p class="text rhombusFather">
+ <span class="hs1 rhombus">鈼�</span>璇锋妸铓傝殎闃熼暱鐨勫彴璇嶅拰浠栫殑鍐呭績鐙櫧杩炶捣鏉ュ惂锛�
</p>
<!-- 杩炵嚎棰� -->
- <matching
- :rawData="rawData"
- :question="question"
- class="macthing"
- :primary-color="color"
- :bordercolor="'#fff'"
- >
+ <matching :rawData="rawData" :question="question" class="macthing" :primary-color="color"
+ :bordercolor="'#fff'">
</matching>
</div>
<!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
<div class="page-footer">
- <img
- class="page-footer-image"
- src="../../assets/images/ym.jpg"
- alt="Page Image"
- />
+ <img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
<div class="page-footer-number-right">21</div>
</div>
</div>
@@ -154,11 +114,7 @@
<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"
- />
+ <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%">
@@ -166,38 +122,38 @@
<h3 class="lefth3" id="c025">
<img class="img-gn1" alt="" src="../../assets/images/rhybx.jpg" />
</h3>
- <p class="text t-l">
- <span class="hs1">鈼�</span
- >鍦ㄣ�婁竴鍧楀ザ閰�嬬殑鏁呬簨涓紝铓傝殎闃熼暱涔熻捣杩囪椽蹇冿紝浣嗕粬鏈�缁堟垚鍔熷厠鏈嶄簡璐績锛屼綘璁や负浠栨槸鎬庝箞鍋氬埌鐨勫憿锛�
- <textarea
- v-model="questionData.reading.one"
- placeholder="璇疯緭鍏ュ唴瀹�"
- rows="6"
- style="margin-left: 40px; width: 92%"
- class="fz-16 fm-son"
- @change="setBookQuestion"
- :class="{ 'textarea-focused': isFocused === 'one' }" @focus="handleFocus('one')" @blur="handleBlur('one')"
- >
+ <p class="text t-l rhombusFather">
+ <span class="hs1 rhombus">鈼�</span>鍦ㄣ�婁竴鍧楀ザ閰�嬬殑鏁呬簨涓紝铓傝殎闃熼暱涔熻捣杩囪椽蹇冿紝浣嗕粬鏈�缁堟垚鍔熷厠鏈嶄簡璐績锛屼綘璁や负浠栨槸鎬庝箞鍋氬埌鐨勫憿锛�
+ <textarea v-model="questionData.reading.one" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+ class="w90 ma-l-40 fz-16 fm-son" @change="setBookQuestion"
+ :class="{ 'textarea-focused': isFocused === 'one' }" @focus="handleFocus('one')"
+ @blur="handleBlur('one')">
</textarea>
</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 class="text rhombusFather">
+ <span class="hs1 rhombus">鈼�</span>闃呰闄勫綍涓殑鍓ф湰閫夋5锛屼负鑷繁鐨勮〃婕旇璁″姩浣滃惂锛�
</p>
+ <p class="block3" style="margin: 3% 0%">
+ <span class="hs">鍓ф湰:銆�涓�鍧楀ザ閰紙閫夋3~5锛�</span>
+ </p>
+ <!-- 姝ゅ涓洪檮褰曡祫婧愬 -->
+ <div class="Options text">
+ <span class="folder" v-for="(segment, index) in paragraph" :key="index" @click="showContent(index+2)"><img
+ src="../../assets/images/icon/folder.svg" alt="" />閫夋{{
+ segment
+ }}</span>
+ </div>
+ <div v-if="activeIndex !== null" class="content-wrapper text" v-html="activeContent"></div>
<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"
- />
+ <img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
<div class="page-footer-number-left">22</div>
</div>
</div>
@@ -205,107 +161,64 @@
<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"
- />
+ <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 class="text rhombusFather">
+ <span class="hs1 rhombus">鈼�</span>璇锋寜鐓т簨浠跺叚瑕佺礌鐨勭粨鏋勭粰澶у鍒嗕韩涓�浠跺揩涔愮殑浜嬪惂锛�
</p>
- <p class="text2">
- 鏃堕棿锛�<input
- v-model="questionData.warnUp.one"
- class="input-bottom-border fz-18"
- @change="setBookQuestion"
- style="width: 70%"
- />
+ <p class="text2 special-P">
+ 鏃堕棿锛�<input v-model="questionData.warnUp.one" class="input-bottom-border fz-18 w70" @change="setBookQuestion"
+ />
</p>
- <p class="text2">
- 鍦扮偣锛�<input
- v-model="questionData.warnUp.two"
- class="input-bottom-border fz-18"
- @change="setBookQuestion"
- style="width: 70%"
- />
+ <p class="text2 special-P">
+ 鍦扮偣锛�<input v-model="questionData.warnUp.two" class="input-bottom-border fz-18 w70" @change="setBookQuestion"
+ />
</p>
- <p class="text2">
- 浜虹墿锛�<input
- v-model="questionData.warnUp.three"
- class="input-bottom-border fz-18"
- @change="setBookQuestion"
- style="width: 70%"
- />
+ <p class="text2 special-P">
+ 浜虹墿锛�<input v-model="questionData.warnUp.three" class="input-bottom-border fz-18 w70" @change="setBookQuestion"
+ />
</p>
-
- <p class="text2 t-l">
+ <p class="text2 t-l special-P">
璧峰洜锛�
- <textarea
- v-model="questionData.reading.two"
- placeholder="璇疯緭鍏ュ唴瀹�"
- rows="6"
- style="margin-left: 40px; width: 92%"
- class="fz-16 fm-son"
- @change="setBookQuestion"
- :class="{ 'textarea-focused': isFocused === 'two' }" @focus="handleFocus('two')" @blur="handleBlur('two')"
- >
+ <textarea v-model="questionData.reading.two" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+ class="w90 ma-l-40 fz-16 fm-son" @change="setBookQuestion"
+ :class="{ 'textarea-focused': isFocused === 'two' }" @focus="handleFocus('two')"
+ @blur="handleBlur('two')">
</textarea>
</p>
- <p class="text2 t-l">
+ <p class="text2 t-l special-P">
缁忚繃锛�
- <textarea
- v-model="questionData.reading.three"
- placeholder="璇疯緭鍏ュ唴瀹�"
- rows="6"
- style="margin-left: 40px; width: 92%"
- class="fz-16 fm-son"
- @change="setBookQuestion"
- :class="{ 'textarea-focused': isFocused === 'three' }" @focus="handleFocus('three')" @blur="handleBlur('three')"
- >
+ <textarea v-model="questionData.reading.three" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+ class="w90 ma-l-40 fz-16 fm-son" @change="setBookQuestion"
+ :class="{ 'textarea-focused': isFocused === 'three' }" @focus="handleFocus('three')"
+ @blur="handleBlur('three')">
</textarea>
</p>
- <p class="text2 t-l">
+ <p class="text2 t-l special-P">
缁撴灉锛�
- <textarea
- v-model="questionData.reading.four"
- placeholder="璇疯緭鍏ュ唴瀹�"
- rows="6"
- style="margin-left: 40px; width: 92%"
- class="fz-16 fm-son"
- @change="setBookQuestion"
- :class="{ 'textarea-focused': isFocused === 'four' }" @focus="handleFocus('four')" @blur="handleBlur('four')"
- >
+ <textarea v-model="questionData.reading.four" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+ class="w90 ma-l-40 fz-16 fm-son" @change="setBookQuestion"
+ :class="{ 'textarea-focused': isFocused === 'four' }" @focus="handleFocus('four')"
+ @blur="handleBlur('four')">
</textarea>
</p>
- <p class="text t-l" style="margin-top: 7%">
- <span class="hs1">鈼�</span
- >浣犳湁鐑︽伡鍚楋紵璇翠竴璇存槸浠�涔堬紝浣犳槸鎬庝箞澶勭悊瀹冪殑锛�
- <textarea
- v-model="questionData.reading.five"
- placeholder="璇疯緭鍏ュ唴瀹�"
- rows="6"
- style="margin-left: 40px; width: 92%"
- class="fz-16 fm-son"
- @change="setBookQuestion"
- :class="{ 'textarea-focused': isFocused === 'five' }" @focus="handleFocus('five')" @blur="handleBlur('five')"
- >
+ <p class="text t-l rhombusFather" style="margin-top: 7%">
+ <span class="hs1 rhombus">鈼�</span>浣犳湁鐑︽伡鍚楋紵璇翠竴璇存槸浠�涔堬紝浣犳槸鎬庝箞澶勭悊瀹冪殑锛�
+ <textarea v-model="questionData.reading.five" placeholder="璇疯緭鍏ュ唴瀹�" rows="6"
+ class="w90 ma-l-40 fz-16 fm-son" @change="setBookQuestion"
+ :class="{ 'textarea-focused': isFocused === 'five' }" @focus="handleFocus('five')"
+ @blur="handleBlur('five')">
</textarea>
</p>
</div>
<!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
<div class="page-footer">
- <img
- class="page-footer-image"
- src="../../assets/images/ym.jpg"
- alt="Page Image"
- />
+ <img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
<div class="page-footer-number-right">23</div>
</div>
</div>
@@ -313,32 +226,23 @@
<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"
- />
+ <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 class="text rhombusFather">
+ <span class="hs1 rhombus">鈼�</span>杩愮敤閲嶉煶銆佸唴蹇冪嫭鐧藉拰鍔ㄤ綔璁捐绛夎〃鐜版柟寮忥紝灏嗐�婁竴鍧楀ザ閰�嬬殑鏁呬簨琛ㄦ紨鍑烘潵鍚э紒锛堝墽鏈闄勫綍锛�
</p>
<p class="center openImgBox">
- <img class="img-e" alt="" src="../../assets/images/3-3.gif" />
+ <img class="img-a" alt="" src="../../assets/images/0028-1.jpg" />
</p>
</div>
<!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
<div class="page-footer">
- <img
- class="page-footer-image"
- src="../../assets/images/ym.jpg"
- alt="Page Image"
- />
+ <img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
<div class="page-footer-number-left">24</div>
</div>
</div>
@@ -346,67 +250,43 @@
<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"
- />
+ <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 ends">
- <span><span class="hs1">鈼�</span>鍠樻皵缁冧範</span>
+ <p class="text ends rhombusFather">
+ <span style="text-wrap: nowrap"><span class="hs1 rhombuSpecial">鈼�</span>鍠樻皵缁冧範</span>
<span>
- <audio
- :src="audioPathTwo"
- controls
- controlslist="noplaybackrate nodownload"
- class="audio"
- ></audio>
+ <audio :src="audioPathTwo" controls controlslist="noplaybackrate nodownload" class="audio"></audio>
</span>
</p>
<p class="text">
骞宠鍓嶆柟锛岃偐鑶�鏀炬澗锛屽弻鎵嬭嚜鐒朵笅鍨傛垨鍙夎叞锛屽弻鑴氬垎寮�锛屼笌鑲╁悓瀹姐�傛ā浠垮皬鐙楀枠姘旓紝鎰熷彈鑵归儴鐨勨�滃懠鍚糕�濈姸鎬侊紝鎯宠薄鑷繁鐨勮吂閮ㄦ槸涓�涓皵鐞冿紝鍦ㄥ惛姘旀椂鑵归儴鍚戝鎵╁紶锛屽悙姘旀椂鑵归儴鍚戝唴鏀剁缉銆�
</p>
- <p class="text ends">
- <span><span class="hs1">鈼�</span>鈥滃樁鈥濆０缁冧範</span>
+ <p class="text ends rhombusFather">
+ <span style="text-wrap: nowrap"><span class="hs1 rhombuSpecial">鈼�</span>鈥滃樁鈥濆０缁冧範</span>
<span>
- <audio
- :src="audioPathThree"
- controls
- controlslist="noplaybackrate nodownload"
- class="audio"
- ></audio>
+ <audio :src="audioPathThree" controls controlslist="noplaybackrate nodownload" class="audio"></audio>
</span>
</p>
<p class="text">鍦ㄢ�滃枠姘旂粌涔犫�濈殑鍩虹涓婏紝鍙戝嚭鈥滃樁鈥濋煶锛屾瘡缁�4鐭�1闀裤��</p>
- <p class="text ends">
- <span><span class="hs1">鈼�</span>鈥滃槦鈥濋煶缁冧範</span>
+ <p class="text ends rhombusFather">
+ <span style="text-wrap: nowrap"><span class="hs1 rhombuSpecial">鈼�</span>鈥滃槦鈥濋煶缁冧範</span>
<span>
- <audio
- :src="audioPathFour"
- controls
- controlslist="noplaybackrate nodownload"
- class="audio"
- ></audio>
+ <audio :src="audioPathFour" controls controlslist="noplaybackrate nodownload" class="audio"></audio>
</span>
</p>
<p class="text">
骞宠鍓嶆柟锛岃偐鑶�鏀炬澗锛屽弻鎵嬭嚜鐒朵笅鍨傦紝鍙岃剼鍒嗗紑锛屼笌鑲╁悓瀹姐�傛斁鏉惧弻鍞囷紝娣卞惛姘旓紝鍚瑰嚭姘旀祦甯﹀姩鍢村攪鎶栧姩锛屽彂鍑衡�滃槦鈥濈殑澹伴煶锛屽０闊宠秺闀胯秺濂姐��
</p>
- <p class="text" style="text-align: left">
- <span><span class="hs1">鈼�</span>鈥滄垜浠禐缇庨暱姹熲�濇皵澹扮粌</span>
+ <p class="text rhombusFather" style="text-align: left">
+ <span><span class="hs1 rhombuSpecial">鈼�</span>鈥滄垜浠禐缇庨暱姹熲�濇皵澹扮粌涔�</span>
<span class="text">
- <audio
- :src="audioPathFive"
- controls
- controlslist="noplaybackrate nodownload"
- class="audio"
- ></audio
- ></span>
+ <audio :src="audioPathFive" controls controlslist="noplaybackrate nodownload"
+ class="audio"></audio></span>
</p>
<p class="text">
骞宠鍓嶆柟锛岃偐鑶�鏀炬澗锛屽弻鎵嬭嚜鐒朵笅鍨傦紝鍙岃剼鍒嗗紑锛屼笌鑲╁悓瀹姐�備互璇存倓鎮勮瘽鐨勬劅瑙夛紝璇村嚭鈥滄垜浠禐缇庨暱姹熲�濓紝骞堕�愭澧炲姞姘斿０鐨勫姏搴︼紝鎵惧埌鍦ㄨ垶鍙颁笂璇存倓鎮勮瘽鐨勬劅瑙夈��
@@ -414,11 +294,7 @@
</div>
<!-- 姝ゆ涓洪〉鑴氶儴鍒嗭紙闇�瑕佽缃〉鐮侊級 -->
<div class="page-footer">
- <img
- class="page-footer-image"
- src="../../assets/images/ym.jpg"
- alt="Page Image"
- />
+ <img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
<div class="page-footer-number-right">25</div>
</div>
</div>
@@ -426,64 +302,38 @@
<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"
- />
+ <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 class="text rhombusFather">
+ <span class="hs1 rhombus">鈼�</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"
- style="
+ <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;
border-radius: 10px;
border: 2px solid green;
- "
- ></video>
+ "></video>
</p>
<p class="center videoname">
<span>瑙嗛锛氬績鏈夊澶э紝鑸炲彴灏辨湁澶氬ぇ </span>
- <el-tooltip
- class="item"
- effect="dark"
- :content="chapterData.isCollectVideo ? '鐐瑰嚮鍙栨秷' : '鐐瑰嚮鏀惰棌'"
- placement="top-start"
- >
+ <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')"
- />
+ :src="collectResourceList.findIndex(item => item.id == 'dd44a1e31b4304f50d10b2481a148411') > -1 ? 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"
- />
+ <img class="page-footer-image" src="../../assets/images/ym.jpg" alt="Page Image" />
<div class="page-footer-number-left">26</div>
</div>
</div>
@@ -494,6 +344,7 @@
<script>
import matching from "@/components/matching/matching.vue";
import { getResourcePath } from "@/assets/methods/resources";
+import { getCollectResource, setCollectResource } from "@/assets/methods/resources";
export default {
name: "chapterThree",
components: { matching },
@@ -506,7 +357,7 @@
default: "red",
},
},
- mounted() {
+ async mounted() {
this.getVidoePath();
const bookQuestion = localStorage.getItem(
"artAndDrama-book-question-three"
@@ -514,6 +365,11 @@
if (bookQuestion) {
this.questionData = JSON.parse(bookQuestion);
}
+ const data = localStorage.getItem("artAndDrama-chapter03-Data");
+ if (data) {
+ this.chapterData = JSON.parse(data);
+ }
+ this.collectResourceList = await getCollectResource(this.config.activeBook.bookId)
},
data() {
return {
@@ -526,7 +382,9 @@
audioPathFour: "",
audioPathFive: "",
isFocused: null, // 鐢ㄤ簬璺熻釜textarea鐨勮仛鐒︾姸鎬�
- segments: [1, 2, 3, 4, 5],
+ segments: [1, 2],
+ paragraph:[3,4,5],
+ collectResourceList: [],
color: "#fff",
activeIndex: null, // 鐢ㄤ簬杩借釜褰撳墠娲诲姩鐨勬寜閽储寮�
contents: [
@@ -535,9 +393,9 @@
' <p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙璧疯韩锛�<span class="un1">鎴戝喅瀹氫簡</span>锛佸ぇ瀹�<span class="un1">涓�璧锋惉</span>锛佽繖鍧楀ザ閰互鎴戜负棣栵紝鎼繍鐨勮矾涓�<span class="un1">涓嶈鍋峰悆</span>锛�</p><p class=" mar-l-r-4">铓傝殎浠細<span class="un1">鏄�</span>锛�</p><p class=" mar-l-r-4">銆愯殏铓佷滑杩呴�熷洿鎴愪竴鍦堬紝铓傝殎闃熼暱绔欏湪濂堕叒鏈�鍓嶉潰銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬惉鎴戝彛浠わ紒3锛�2锛�1锛佹姮锛�</p> <p class=" mar-l-r-4">銆愬ザ閰鎶捣銆�</p><p class=" mar-l-r-4">澶уご铓傝殎锛氬搰锛佽繖鍧楀ザ閰�<span class="un1">濂介鍣�</span>锛�</p><p class=" mar-l-r-4">灏忕溂闀滆殏铓侊細鎴戞兂<span class="un1">鍜�</span>涓�鍙ｏ紒</p><p class=" mar-l-r-4">灏忚殏铓侊細濡傛灉鑳�<span class="un1">鑸斾竴涓�</span>灏卞ソ浜嗭紒</p><p class=" mar-l-r-4">铓傝殎灏忓锛氭垜鐨勫彛姘存祦鍑烘潵浜嗭紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氫笉璁哥瀻鎯筹紒涓嶈鍋峰悆锛�<span class="un1">鍑哄彂</span>锛�</p><p class=" mar-l-r-4">銆愰煶涔愯捣锛岃殏铓佷滑鎶潃濂堕叒鍚戝墠璧扮潃銆�</p><p class=" mar-l-r-4">铓傝殎浠細濂堕叒锛佸ザ閰紒鎴戜滑鐨勫ザ閰紒濂堕叒锛佸ザ閰紒鎴戜滑涓�璧峰垎浜��</p><p class=" mar-l-r-4">銆愯殏铓佷滑闄堕唹涓��</p>',
' <p class=" mar-l-r-4">鍢��</p><p class=" mar-l-r-4">銆愯殏铓佷滑鐢ㄥ姴杩囩寷锛屽ザ閰殑涓�涓鎺変簡銆�</p><p class=" mar-l-r-4">铓傝殎灏忓锛�<span class="un1">鍟�</span>锛侀槦闀匡紒濂堕叒鐨勮<span class="un1">鎺変簡</span>锛�</p> <p class=" mar-l-r-4">銆愬ぇ瀹剁湅鍒版帀鍦ㄥ湴涓婄殑濂堕叒銆�</p><p class=" mar-l-r-4">铓傝殎浠細鍝囧摝锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氱瓑绛夛紒</p><p class=" mar-l-r-4">銆愯垶鍙板彉鍏夛紝婕斿憳鍔ㄤ綔瀹氭牸銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氭帀浜�<span class="un1">涓�涓</span>锛岃繖璇�<span class="un1">鎬庝箞鍔�</span>锛�<span class="un1">涓㈡帀</span>锛屽疄鍦�<span class="un1">澶彲鎯�</span>锛�<span class="un1">瓒佹満鍚冩帀</span>锛屽張瑕佺姱涓嶈鍋峰槾鐨勭浠ゃ�傛�庝箞鍔炲憿锛熸湁涓姙娉曪紒鎴戣鏄�<span class="un1">鍋峰槾</span>璋佷篃<span class="un1">鐪嬩笉瑙�</span>锛�<span class="un1">杩欐牱</span>涓嶅氨琛屽暒锛佸ぇ瀹跺惉濂藉暒锛�</p>',
' <p class=" mar-l-r-4">銆愯垶鍙板彉鍏夛紝婕斿憳绔嬫绔欏ソ銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氫紤鎭竴浼氬効锛�</p><p class=" mar-l-r-4">铓傝殎灏忓锛�<span class="un1">涓轰粈涔�</span>瑕佷紤鎭憖锛�</p><p class=" mar-l-r-4">灏忕溂闀滆殏铓侊細闃熼暱锛佽繖鍧楁帀鍦ㄥ湴涓婄殑濂堕叒<span class="un1">鎬庝箞鍔炲憖</span>锛�</p><p class=" mar-l-r-4">澶уご铓傝殎锛氭垜浠涓嶆妸瀹�<span class="un1">鍒嗕簡鍚�</span>锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬惉鎴戣锛�<span class="un1">浼戞伅</span>锛�<span class="un1">绔嬪埢浼戞伅</span>锛佸ぇ瀹舵惉杩愬お杈涜嫤鍟︼紒鍒嗘暎寮�锛屽摢閲屽噳蹇氨鍒板摢閲屼紤鎭紒</p><p class=" mar-l-r-4">銆愬ぇ瀹朵緷鏃т笉鍔ㄣ��</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬叏浣撻兘鏈夛紒绋嶆伅锛佺珛姝ｏ紒鍚戝悗鈥旇浆锛侀綈姝モ�旇蛋锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氱珛鈥斿畾锛佸師鍦颁紤鎭紒</p><p class=" mar-l-r-4">銆愯殏铓佷滑璺熼殢鍙ｄ护娑堝け鍦ㄨ崏涓涢噷銆�</p>',
- ' <p class=" mar-l-r-4">銆愯殏铓侀槦闀垮悜鑽変笡閲屾湜鍘伙紝纭畾娌℃湁澹板搷銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙灏忓０锛夊樋鍢垮樋锛屽悆鎺夊悗灏辫琚鍒蛋鎴栬�呭氨璇磋鑰侀拱鍚冩帀灏卞ソ鍟︼紒</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀夸綆涓嬪ご锛屽梾浜嗕竴涓嬪ザ閰��</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬懗閬�<span class="un1">鐪�</span>棣欙紒</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀跨殑鎵嬩几鍚戝ザ閰福锛岀獊鐒讹紝濂堕叒浜虹珯浜嗚捣鏉ャ��</p><p class=" mar-l-r-4">銆愬彉鍏夈��</p><p class=" mar-l-r-4">濂堕叒浜猴細涓嶈鍚冿紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙鍚撲簡涓�璺筹級浣犱綘浣狅紒浣犳�庝箞<span class="un1">绔�</span>璧锋潵鍟︼紒</p><p class=" mar-l-r-4">濂堕叒浜猴細鎴�<span class="un1">瀹炲湪</span>鐪嬩笉涓嬪幓鍟︼紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙瀹虫�曪級鏁戝懡鍝囷紒濂堕叒<span class="un1">娲�</span>鍟︼紒</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀胯窇銆�</p><p class=" mar-l-r-4">濂堕叒浜猴細<span class="un1">绔欎綇</span>锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氫綘瑕佸共浠�涔堬紵</p><p class=" mar-l-r-4">濂堕叒浜猴細<span class="un1">杩欏潡</span>锛�<span class="un1">浣犱笉鑳藉悆</span>锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氫负浠�涔堬紵</p><p class=" mar-l-r-4">濂堕叒浜猴細<span class="un1">绗竴</span>锛�<span class="un1">浣�</span>瀹氱殑瑙勭煩锛屼粖澶╂惉杩愪腑锛�<span class="un1">涓嶈鍋峰悆</span>锛佸鏋�<span class="un1">浣�</span>鍋氫笉鍒帮紝浣犲氨<span class="un1">涓嶈兘瑕佹眰鍒汉</span>锛�<span class="un1">绗簩</span>锛佷綘鏄�<span class="un1">铓傝殎闃熼暱</span>锛屽ぇ瀹堕�変綘褰撻槦闀匡紝鏄浣犵殑<span class="un1">淇′换</span>鍜�<span class="un1">灏婇噸</span>锛佷綘鍗磋儗鐫�澶у<span class="un1">鍋峰悆</span>锛�<span class="un1">绗笁</span>锛�<span class="un1">璇氬疄瀹堜俊</span>鏄編寰凤紝浣犲悆鎺夊ザ閰<span class="un1">鎾掕皫</span>锛屾拻浜�<span class="un1">涓�涓�</span>璋庡氨瑕佺敤<span class="un1">鏃犳暟</span>鐨勮皫鏉ュ渾绗竴涓皫锛屾渶鍚�<span class="un1">杩樻槸</span>浼氳鍙戠幇锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙浣庡ご锛夋垜涓嶅悆浜嗭紝鎴戠煡閬�<span class="un1">閿欎簡</span>鈥︹�﹀彲鏄紝杩欐帀鍦ㄥ湴涓婄殑濂堕叒鎬庝箞鍔炲憿锛�</p><p class=" mar-l-r-4">濂堕叒浜猴細锛堟兂浜嗘兂锛�<span class="un1">鏈夊姙娉�</span>锛佷綘鍙互閫夋嫨澶у<span class="un1">涓�璧峰垎</span>锛屼篃鍙互閫夋嫨缁欏勾榫勬渶灏忕殑铓傝殎鍚冿紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛�<span class="un1">濂戒富鎰�</span>锛佹垜杩欏氨闂棶澶у锛岃阿璋綘锛�</p><p class=" mar-l-r-4">銆愬彉鍏夛紝濂堕叒鎱㈡參鍦拌汉鍦ㄥ湴涓娿��</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙鍠婏級<span class="un1">娉ㄦ剰鍟�</span>锛佸叏浣撻兘鏈夛紒绋嶆伅锛佺珛姝ｏ紒</p><p class=" mar-l-r-4">鍚戝悗杞紒榻愭璧帮紒</p><p class=" mar-l-r-4">銆愯殏铓佷滑鐢卞洓闈㈠叓鏂硅蛋鍥炴潵銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬ぇ瀹朵紤鎭ソ鍟︼紒鎴戞湁涓�涓�<span class="un1">鍐冲畾</span>锛�</p><p class=" mar-l-r-4">铓傝殎浠細浠�涔堝喅瀹氾紵</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氳繖鐐瑰効濂堕叒娓ｆ槸鍒氭墠寮勬帀鐨勶紝涓簡鍙儨锛岋紙鎸囧悜灏忚殏铓侊級浣犳槸鎴戜滑涓勾榫勬渶灏忕殑锛�<span class="un1">浣�</span>鍚冩帀瀹冨惂锛�</p><p class=" mar-l-r-4">銆愯殏铓佷滑榧撴帉銆�</p><p class=" mar-l-r-4">銆愰煶涔愯捣锛屽ぇ瀹跺姴鍎挎瘮鍒氭墠鏇磋冻锛屾姮璧峰ザ閰悜灞辨礊璧板幓銆�</p><p class=" mar-l-r-4">銆愭敹鍏夈��</p>',
+ ' <p class=" mar-l-r-4">銆愯殏铓侀槦闀垮悜鑽変笡閲屾湜鍘伙紝纭畾娌℃湁澹板搷銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙灏忓０锛夊樋鍢垮樋锛屽悆鎺夊悗灏辫琚鍒蛋鎴栬�呭氨璇磋鑰侀拱鍚冩帀灏卞ソ鍟︼紒</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀夸綆涓嬪ご锛屽梾浜嗕竴涓嬪ザ閰��</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬懗閬�<span class="un1">鐪�</span>棣欙紒</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀跨殑鎵嬩几鍚戝ザ閰福锛岀獊鐒讹紝濂堕叒浜虹珯浜嗚捣鏉ャ��</p><p class=" mar-l-r-4">銆愬彉鍏夈��</p><p class=" mar-l-r-4">濂堕叒浜猴細涓嶈鍚冿紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙鍚撲簡涓�璺筹級浣犱綘浣狅紒浣犳�庝箞<span class="un1">绔�</span>璧锋潵鍟︼紒</p><p class=" mar-l-r-4">濂堕叒浜猴細鎴�<span class="un1">瀹炲湪</span>鐪嬩笉涓嬪幓鍟︼紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙瀹虫�曪級鏁戝懡鍝囷紒濂堕叒<span class="un1">娲�</span>鍟︼紒</p><p class=" mar-l-r-4">銆愯殏铓侀槦闀胯窇銆�</p><p class=" mar-l-r-4">濂堕叒浜猴細<span class="un1">绔欎綇</span>锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氫綘瑕佸共浠�涔堬紵</p><p class=" mar-l-r-4">濂堕叒浜猴細<span class="un1">杩欏潡</span>锛�<span class="un1">浣犱笉鑳藉悆</span>锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氫负浠�涔堬紵</p><p class=" mar-l-r-4">濂堕叒浜猴細<span class="un1">绗竴</span>锛�<span class="un1">浣�</span>瀹氱殑瑙勭煩锛屼粖澶╂惉杩愪腑锛�<span class="un1">涓嶈鍋峰悆</span>锛佸鏋�<span class="un1">浣�</span>鍋氫笉鍒帮紝浣犲氨<span class="un1">涓嶈兘瑕佹眰鍒汉</span>锛�<span class="un1">绗簩</span>锛佷綘鏄�<span class="un1">铓傝殎闃熼暱</span>锛屽ぇ瀹堕�変綘褰撻槦闀匡紝鏄浣犵殑<span class="un1">淇′换</span>鍜�<span class="un1">灏婇噸</span>锛佷綘鍗磋儗鐫�澶у<span class="un1">鍋峰悆</span>锛�<span class="un1">绗笁</span>锛�<span class="un1">璇氬疄瀹堜俊</span>鏄編寰凤紝浣犲悆鎺夊ザ閰<span class="un1">鎾掕皫</span>锛屾拻浜�<span class="un1">涓�涓�</span>璋庡氨瑕佺敤<span class="un1">鏃犳暟</span>鐨勮皫鏉ュ渾绗竴涓皫锛屾渶鍚�<span class="un1">杩樻槸</span>浼氳鍙戠幇锛�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙浣庡ご锛夋垜涓嶅悆浜嗭紝鎴戠煡閬�<span class="un1">閿欎簡</span>鈥︹�﹀彲鏄紝杩欐帀鍦ㄥ湴涓婄殑濂堕叒鎬庝箞鍔炲憿锛�</p><p class=" mar-l-r-4">濂堕叒浜猴細锛堟兂浜嗘兂锛�<span class="un1">鏈夊姙娉�</span>锛佷綘鍙互閫夋嫨澶у<span class="un1">涓�璧峰垎</span>锛屼篃鍙互閫夋嫨缁欏勾榫勬渶灏忕殑铓傝殎鍚冿紒</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛�<span class="un1">濂戒富鎰�</span>锛佹垜杩欏氨闂棶澶у锛岃阿璋綘锛�</p><p class=" mar-l-r-4">銆愬彉鍏夛紝濂堕叒鎱㈡參鍦拌汉鍦ㄥ湴涓娿��</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氾紙鍠婏級<span class="un1">娉ㄦ剰鍟�</span>锛佸叏浣撻兘鏈夛紒绋嶆伅锛佺珛姝ｏ紒</p><p class=" mar-l-r-4">鍚戝悗杞紒榻愭璧帮紒</p><p class=" mar-l-r-4">銆愯殏铓佷滑鐢卞洓闈㈠叓鏂硅蛋鍥炴潵銆�</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氬ぇ瀹朵紤鎭ソ鍟︼紒鎴戞湁涓�涓�<span class="un1">鍐冲畾</span>锛�</p><p class=" mar-l-r-4">铓傝殎浠細浠�涔堝喅瀹氾紵</p><p class=" mar-l-r-4">铓傝殎闃熼暱锛氳繖鐐瑰効濂堕叒娓ｆ槸鍒氭墠寮勬帀鐨勶紝涓簡鍙儨锛岋紙鎸囧悜灏忚殏铓侊級浣犳槸鎴戜滑涓勾榫勬渶灏忕殑锛�<span class="un1">浣�</span>鍚冩帀瀹冨惂锛�</p><p class=" mar-l-r-4">銆愯殏铓佷滑榧撴帉銆�</p><p class=" mar-l-r-4">銆愰煶涔愯捣锛屽ぇ瀹跺姴鍎挎瘮鍒氭墠鏇磋冻锛屾姮璧峰ザ閰悜灞辨礊璧板幓銆�</p><p class=" mar-l-r-4">銆愭敹鍏夈��</p>',
],
- activeContent: "", // 褰撳墠鏄剧ず鐨凥TML鍐呭
+ activeContent: "", // 褰撳墠鏄剧ず鐨凥TML鍐呭
chapterData: {
isCollectImg: false,
isCollectVideo: false,
@@ -645,9 +503,9 @@
reading: {
one: "",
two: "",
- three:"",
- four:"",
- five:"",
+ three: "",
+ four: "",
+ five: "",
},
table: {
one: "",
@@ -687,14 +545,13 @@
"f56a9d889d3098fa6800125ae7627481"
);
},
- handleFocus(id) {
+ handleFocus(id) {
this.isFocused = id; // 褰搕extarea鑱氱劍鏃讹紝璁剧疆涓簍rue
- },
- handleBlur(id) {
+ },
+ handleBlur(id) {
this.isFocused = null; // 褰搕extarea澶卞幓鐒︾偣鏃讹紝璁剧疆涓篺alse
- },
+ },
setBookQuestion() {
- console.log("淇濆瓨");
localStorage.setItem(
"artAndDrama-book-question-three",
JSON.stringify(this.questionData)
@@ -708,15 +565,13 @@
},
handleChapterData() {
localStorage.setItem(
- "math-chapterData",
+ "artAndDrama-chapter03-Data",
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;
+ if (type == "video") {
+ this.handleCollectResource("dd44a1e31b4304f50d10b2481a148411", "dd44a1e31b4304f50d10b2481a148411", '', "瑙嗛", "bits", '瑙嗛锛氬績鏈夊澶э紝鑸炲彴灏辨湁澶氬ぇ')
}
this.handleChapterData();
},
@@ -731,6 +586,25 @@
this.activeContent = this.contents[index];
}
},
+ //璧勬簮鏀惰棌浜嬩欢
+ handleCollectResource(id, md5, resourcePath, resourceType, source, resourceName) {
+ let list = this.collectResourceList
+ if (list.findIndex(item => item.id == id) > -1) {
+ list = list.filter(item => item.id != id)
+ } else {
+ list.push({
+ id,
+ md5,
+ resourcePath,
+ resourceType,
+ source,
+ resourceName,
+ })
+ }
+ this.collectResourceList = list
+ setCollectResource(this.config.activeBook.bookId, this.collectResourceList)
+ }
+
},
};
</script>
--
Gitblit v1.9.1