|
@@ -93,7 +93,7 @@
|
|
</span>
|
|
</span>
|
|
</h2>
|
|
</h2>
|
|
</template>
|
|
</template>
|
|
- <h2 v-else>
|
|
|
|
|
|
+ <h2 v-else :style="{ justifyContent: articleInfo.en_flag ? '' : 'center' }">
|
|
<span
|
|
<span
|
|
:style="{
|
|
:style="{
|
|
color: colorObj.titleColor,
|
|
color: colorObj.titleColor,
|
|
@@ -114,6 +114,7 @@
|
|
lineHeight: '22px',
|
|
lineHeight: '22px',
|
|
fontWeight: '400',
|
|
fontWeight: '400',
|
|
}"
|
|
}"
|
|
|
|
+ v-if="articleInfo.en_flag"
|
|
>
|
|
>
|
|
{{
|
|
{{
|
|
articleInfo.art_author +
|
|
articleInfo.art_author +
|
|
@@ -128,6 +129,65 @@
|
|
(articleInfo.page_no_in_pub ? " · P" + articleInfo.page_no_in_pub : "")
|
|
(articleInfo.page_no_in_pub ? " · P" + articleInfo.page_no_in_pub : "")
|
|
}}
|
|
}}
|
|
</h6>
|
|
</h6>
|
|
|
|
+ <template v-else>
|
|
|
|
+ <div class="info-box">
|
|
|
|
+ <el-button
|
|
|
|
+ type="text"
|
|
|
|
+ class="btn-left"
|
|
|
|
+ :class="[activeArticleIndex === 0 ? 'not-allow' : '']"
|
|
|
|
+ @click="handlePage('-')"
|
|
|
|
+ :style="{ color: colorObj.btnColor }"
|
|
|
|
+ ><svg-icon icon-class="arrow-left-line"></svg-icon>上一篇</el-button
|
|
|
|
+ >
|
|
|
|
+ <h6
|
|
|
|
+ class="nnpe-article-author"
|
|
|
|
+ :style="{
|
|
|
|
+ color: colorObj.sourceColor,
|
|
|
|
+ fontSize: '14px',
|
|
|
|
+ lineHeight: '22px',
|
|
|
|
+ fontWeight: '400',
|
|
|
|
+ margin: 0,
|
|
|
|
+ }"
|
|
|
|
+ >
|
|
|
|
+ {{
|
|
|
|
+ articleInfo.study_phase_name +
|
|
|
|
+ "版 · 第 " +
|
|
|
|
+ articleInfo.iss_no +
|
|
|
|
+ " 期 · " +
|
|
|
|
+ articleInfo.release_date +
|
|
|
|
+ " · " +
|
|
|
|
+ articleInfo.chn_item +
|
|
|
|
+ (articleInfo.page_no_in_pub
|
|
|
|
+ ? " · P" + articleInfo.page_no_in_pub
|
|
|
|
+ : "")
|
|
|
|
+ }}
|
|
|
|
+ </h6>
|
|
|
|
+ <el-button
|
|
|
|
+ type="text"
|
|
|
|
+ class="btn-right"
|
|
|
|
+ :class="[
|
|
|
|
+ activeArticleIndex === activeArticleIndexLen - 1 ? 'not-allow' : '',
|
|
|
|
+ ]"
|
|
|
|
+ @click="handlePage('+')"
|
|
|
|
+ :style="{ color: colorObj.btnColor }"
|
|
|
|
+ >下一篇<svg-icon icon-class="arrow-right-line"></svg-icon
|
|
|
|
+ ></el-button>
|
|
|
|
+ </div>
|
|
|
|
+ <el-divider></el-divider>
|
|
|
|
+ <h6
|
|
|
|
+ class="nnpe-article-author"
|
|
|
|
+ :style="{
|
|
|
|
+ color: colorObj.sourceColor,
|
|
|
|
+ fontSize: '16px',
|
|
|
|
+ lineHeight: '24px',
|
|
|
|
+ fontWeight: '400',
|
|
|
|
+ margin: 0,
|
|
|
|
+ textAlign: 'center',
|
|
|
|
+ }"
|
|
|
|
+ >
|
|
|
|
+ {{ articleInfo.art_author }}
|
|
|
|
+ </h6>
|
|
|
|
+ </template>
|
|
<div class="audio-box">
|
|
<div class="audio-box">
|
|
<div
|
|
<div
|
|
class="aduioLine-content aduioLine-box"
|
|
class="aduioLine-content aduioLine-box"
|
|
@@ -286,7 +346,11 @@
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<template v-else>
|
|
<template v-else>
|
|
- <div class="cn-content" v-html="articleInfo.art_content"></div>
|
|
|
|
|
|
+ <div
|
|
|
|
+ class="cn-content"
|
|
|
|
+ v-html="articleInfo.art_content"
|
|
|
|
+ :style="{ color: colorObj.contentColor }"
|
|
|
|
+ ></div>
|
|
</template>
|
|
</template>
|
|
<!-- <img src="../../../assets/article-img.png" style="max-width:100%;margin:24px 0;" /> -->
|
|
<!-- <img src="../../../assets/article-img.png" style="max-width:100%;margin:24px 0;" /> -->
|
|
<div class="voice-full-screen" :id="'screen-' + mathNum">
|
|
<div class="voice-full-screen" :id="'screen-' + mathNum">
|
|
@@ -318,6 +382,8 @@ export default {
|
|
"likeSentencelist",
|
|
"likeSentencelist",
|
|
"likeWord",
|
|
"likeWord",
|
|
"articleImg",
|
|
"articleImg",
|
|
|
|
+ "activeArticleIndex",
|
|
|
|
+ "activeArticleIndexLen",
|
|
],
|
|
],
|
|
components: {
|
|
components: {
|
|
AudioLine,
|
|
AudioLine,
|
|
@@ -489,6 +555,9 @@ export default {
|
|
changeIsFull() {
|
|
changeIsFull() {
|
|
this.isFull = false;
|
|
this.isFull = false;
|
|
},
|
|
},
|
|
|
|
+ handlePage(type) {
|
|
|
|
+ this.$emit("handlePage", type);
|
|
|
|
+ },
|
|
},
|
|
},
|
|
//生命周期 - 创建完成(可以访问当前this实例)
|
|
//生命周期 - 创建完成(可以访问当前this实例)
|
|
created() {},
|
|
created() {},
|
|
@@ -717,4 +786,28 @@ export default {
|
|
color: #2f3742;
|
|
color: #2f3742;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+.info-box {
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+}
|
|
|
|
+.btn-left,
|
|
|
|
+.btn-right {
|
|
|
|
+ color: #3459d2;
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ line-height: 24px;
|
|
|
|
+ padding: 0;
|
|
|
|
+ .svg-icon {
|
|
|
|
+ margin-right: 12px;
|
|
|
|
+ }
|
|
|
|
+ &.not-allow {
|
|
|
|
+ color: #5e89ef;
|
|
|
|
+ cursor: not-allowed;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+.btn-right {
|
|
|
|
+ .svg-icon {
|
|
|
|
+ margin-right: 0;
|
|
|
|
+ margin-left: 12px;
|
|
|
|
+ }
|
|
|
|
+}
|
|
</style>
|
|
</style>
|