|
@@ -36,7 +36,7 @@
|
|
|
</el-carousel>
|
|
|
<div class="book-info-right">
|
|
|
<h1 class="title">{{data.title}}</h1>
|
|
|
- <b class="org">{{data.org}}</b><span class="date">2023.07.01-2023.07.21</span>
|
|
|
+ <!-- <b class="org">{{data.org}}</b><span class="date">2023.07.01-2023.07.21</span> -->
|
|
|
<div class="label-box">
|
|
|
<label v-for="(itemL,indexL) in data.tagList" :key="indexL" :style="{background:tagBg[indexL%3],color:tagColor[indexL%3]}">
|
|
|
{{ '# ' + itemL }}
|
|
@@ -58,7 +58,7 @@
|
|
|
</div>
|
|
|
<div class="info-item">
|
|
|
<label>发行时间</label>
|
|
|
- <span>2023-01-12</span>
|
|
|
+ <span>2023-05-15</span>
|
|
|
</div>
|
|
|
<div class="info-item">
|
|
|
<label>中英双语</label>
|
|
@@ -66,23 +66,24 @@
|
|
|
</div>
|
|
|
<div class="info-item">
|
|
|
<label>期数</label>
|
|
|
- <span>804 期</span>
|
|
|
+ <span>815 期</span>
|
|
|
</div>
|
|
|
<div class="info-item">
|
|
|
<label>学段</label>
|
|
|
- <span>高中</span>
|
|
|
+ <span>初二</span>
|
|
|
</div>
|
|
|
<div class="info-item">
|
|
|
<label>版本</label>
|
|
|
<span>基础版</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="price-box">
|
|
|
+ <div class="price-box" v-if="!data.isBuy">
|
|
|
<span class="price">¥{{data.price|cutMoneyFiter}}</span>
|
|
|
<span class="oldPrice">¥{{data.oldPrice|cutMoneyFiter}}</span>
|
|
|
</div>
|
|
|
<div class="btn-box">
|
|
|
<a class="continue" v-if="data.isBuy">继续学习</a>
|
|
|
+ <a class="upgrade" v-if="data.isBuy">升级为讲解版</a>
|
|
|
<el-dropdown @command="handleChangeWay" v-else>
|
|
|
<el-button>
|
|
|
立即购买<svg-icon icon-class="arrow-down"></svg-icon>
|
|
@@ -192,10 +193,10 @@ export default {
|
|
|
headerBg: '#1F1F1F',
|
|
|
previousPage: '商城',
|
|
|
data:{
|
|
|
- navTitle: '第 804 期 Teens Senior 3',
|
|
|
- title: '第 804 期 Teens Senior 3',
|
|
|
+ navTitle: '第 815 期 Celebrating new King',
|
|
|
+ title: '第 815 期 Celebrating new King',
|
|
|
org: '二十一世纪英文报',
|
|
|
- tagList: ['中英双语','经典读物','高中必读','学前'],
|
|
|
+ tagList: ['中英双语','经典读物','初中必读'],
|
|
|
imgList:[
|
|
|
require('../../assets/img1.png'), require('../../assets/bookcard-image.png'),
|
|
|
],
|
|
@@ -206,47 +207,63 @@ export default {
|
|
|
},
|
|
|
price: '3.9',
|
|
|
oldPrice: '5.99',
|
|
|
- isBuy: false,
|
|
|
+ isBuy: true,
|
|
|
treeList: [
|
|
|
{
|
|
|
- number: '1',
|
|
|
- title: 'FRONTPAGE',
|
|
|
- children:[
|
|
|
- {
|
|
|
- number: '1.1',
|
|
|
- title: '2022, ready to pounce!'
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
number: '2',
|
|
|
title: 'OUR WORLD',
|
|
|
children:[
|
|
|
{
|
|
|
number:'2.1',
|
|
|
- title:'Making room for the pet boom'
|
|
|
+ title:'Out in the fields'
|
|
|
},
|
|
|
{
|
|
|
number:'2.2',
|
|
|
- title:'in need of company'
|
|
|
+ title:'IN BRIEF 新闻速览'
|
|
|
},
|
|
|
{
|
|
|
number: '2.3',
|
|
|
- title:'Revising key law'
|
|
|
+ title:'XI’S WORDS 英语学习'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ number:'2.4',
|
|
|
+ title:'WORLD LENS 图行天下'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ number: '2.5',
|
|
|
+ title:'4,200'
|
|
|
}
|
|
|
]
|
|
|
},
|
|
|
{
|
|
|
number: '3',
|
|
|
- title: 'QUIZ TIME',
|
|
|
+ title: 'SCIENCE STUDY',
|
|
|
children: [
|
|
|
{
|
|
|
number: '3.1',
|
|
|
- title:'上期IV版参考答案'
|
|
|
+ title:'Listened to by aliens'
|
|
|
},
|
|
|
{
|
|
|
number: '3.2',
|
|
|
- title: '本期参考答案'
|
|
|
+ title: 'Wearable mushrooms'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ number:'3.3',
|
|
|
+ title:'Lend a helping fin'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ number: '4',
|
|
|
+ title: 'READING & WRITING',
|
|
|
+ children: [
|
|
|
+ {
|
|
|
+ number: '4.1',
|
|
|
+ title:'What’s the word 短文填空'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ number: '4.2',
|
|
|
+ title: '任务型阅读:我的身体我做主'
|
|
|
}
|
|
|
]
|
|
|
}
|
|
@@ -503,6 +520,7 @@ export default {
|
|
|
display: flex;
|
|
|
flex-flow: wrap;
|
|
|
border-bottom: 1px solid #EBEBEB;
|
|
|
+ margin-bottom: 24px;
|
|
|
.info-item{
|
|
|
width: 50%;
|
|
|
margin-bottom: 15px;
|
|
@@ -524,6 +542,7 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
.btn-box{
|
|
|
+ display: flex;
|
|
|
.el-button{
|
|
|
width: 180px;
|
|
|
height: 52px;
|
|
@@ -540,15 +559,30 @@ export default {
|
|
|
margin-left: 7px;
|
|
|
}
|
|
|
.continue{
|
|
|
- width: 160px;
|
|
|
- height: 52px;
|
|
|
+ width: 112px;
|
|
|
+ height: 40px;
|
|
|
background: #175DFF;
|
|
|
border-radius: 4px;
|
|
|
font-weight: 500;
|
|
|
- font-size: 20px;
|
|
|
- line-height: 52px;
|
|
|
- color: rgba(255, 255, 255, 0.88);
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 40px;
|
|
|
+ color: rgba(255, 255, 255, 1);
|
|
|
+ display: block;
|
|
|
+ text-align: center;
|
|
|
+ box-shadow: 0px 8px 16px rgba(23, 93, 255, 0.24);
|
|
|
+ }
|
|
|
+ .upgrade{
|
|
|
+ margin-left: 16px;
|
|
|
display: block;
|
|
|
+ width: 144px;
|
|
|
+ height: 40px;
|
|
|
+ background: #E9E9E9;
|
|
|
+ box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.06);
|
|
|
+ border-radius: 4px;
|
|
|
+ color: #595959;
|
|
|
+ font-weight: 500;
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 40px;
|
|
|
text-align: center;
|
|
|
}
|
|
|
}
|