chenJinxu
/
HealthStudentWeb
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

优化模块 对接训练营、心理咨询api

test
Dingei 10 months ago
parent
08b4792ebe
commit
14ed9ba7b8
4 changed files with 109 additions and 133 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +21
    -2
      src/api/optimize.js
  2. +32
    -51
      src/views/optimize/index.vue
  3. +1
    -0
      src/views/optimize/scss/trainingcamp.scss
  4. +55
    -80
      src/views/optimize/trainingcamp.vue

+ 21
- 2
src/api/optimize.js View File

@@ -3,7 +3,9 @@ import request from '@/config/request_java';
export const APIOptimize = {
getExpertList, // 获取专家列表
getTalkList, // 获取养育话题列表
addTalkLabels // 新增养育话题标签
addTalkLabels, // 新增养育话题标签
getCampList, // 获取训练营列表
getCampRecommendList // 获取训练营推荐列表
};
export default APIOptimize;

@@ -32,4 +34,21 @@ function addTalkLabels(params) {
method: 'post',
data: params
});
}
}

// 获取训练营列表
function getCampList(id) {
return request({
url: `/java_api/optimize/getCampList`,
method: 'get',
params: { id }
});
}

// 获取训练营推荐列表
function getCampRecommendList() {
return request({
url: `/java_api/optimize/getCampRecommendList`,
method: 'get'
});
}

+ 32
- 51
src/views/optimize/index.vue View File

@@ -35,24 +35,13 @@
</div>
<div class="main">
<ul>
<li @click="goTrainingcamp(1)">
<li v-for="(item, index) in campList" :key="index" @click="goTrainingcamp(item.id)">
<div class="left">
<p>情绪管理控制</p>
<span>入门易学</span>
<p>{{item.name}}</p>
<span>{{item.summary}}</span>
<div>
<h5>会员价 ¥998</h5>
<s>¥1288</s>
</div>
</div>
<img src="@/assets/today/images/2_42.png" />
</li>
<li @click="goTrainingcamp(2)">
<div class="left">
<p>情绪管理控制</p>
<span>入门易学</span>
<div>
<h5>会员价 ¥998</h5>
<s>¥1288</s>
<h5>会员价 ¥{{item.vipPrice}}</h5>
<s>¥{{item.price}}</s>
</div>
</div>
<img src="@/assets/today/images/2_42.png" />
@@ -67,55 +56,29 @@
</div>
<div class="select">
<ul>
<li>
<img src="@/assets/optimize/icons/3_55.png" alt="" />
</li>
<li>
<img src="@/assets/optimize/icons/3_58.png" alt="" />
</li>
<li>
<img src="@/assets/optimize/icons/3_62.png" alt="" />
</li>
<li>
<img src="@/assets/optimize/icons/3_66.png" alt="" />
</li>
<li>
<li v-for="(item, index) in expertList" :key="index" @click="switchPsychology(item.id)">
<img src="@/assets/optimize/icons/3_55.png" alt="" />
</li>
<li>
<img src="@/assets/optimize/icons/3_58.png" alt="" />
</li>
<li>
<img src="@/assets/optimize/icons/3_62.png" alt="" />
</li>
<li>
<img src="@/assets/optimize/icons/3_66.png" alt="" />
</li>
</ul>
</div>
<div class="main">
<div class="top">
<p>黛建松</p>
<span>清华大学心理学教授</span>
<p>{{psychologyInfo.name}}</p>
<span>{{psychologyInfo.title}}</span>
<img src="@/assets/optimize/images/3_48.png" alt="" />
</div>
<div class="bottom">
<h4>700人次<span>咨询</span>，<span>从业</span>8年</h4>
<!-- <h4>700人次<span>咨询</span>，<span>从业</span>8年</h4> -->
<h4>{{psychologyInfo.seek}}</h4>
<ul>
<li>焦虑</li>
<li>抑郁</li>
<li>儿童心理</li>
<li>亲子关系</li>
<li>青春期心理</li>
<li>家庭关系</li>
<li>压力管理</li>
<li v-for="(item, index) in psychologyInfo.labels" :key="index">{{item}}</li>
</ul>
<div>
<h5>
<img src="@/assets/optimize/icons/location.png" alt="" />
<span>郴州市苏仙区</span>
<span>{{psychologyInfo.address}}</span>
</h5>
<p>¥2480</p>
<p>¥{{psychologyInfo.price}}</p>
</div>
</div>
</div>
@@ -144,7 +107,9 @@ export default {
data() {
return {
expertList: [],
talkList: []
talkList: [],
campList: [],
psychologyInfo: {}
};
},
created() {
@@ -157,6 +122,8 @@ export default {
APIOptimize.getExpertList(0)
.then(res => {
this.expertList = res.data.data
this.psychologyInfo = this.expertList[0]
this.psychologyInfo.labels = this.psychologyInfo.labels.split('|');
})
.catch(e => {
console.log(e);
@@ -169,6 +136,14 @@ export default {
.catch(e => {
console.log(e);
})
// 训练营列表
APIOptimize.getCampList(0)
.then(res => {
this.campList = res.data.data
})
.catch(e => {
console.log(e);
})
},
goExperts(id) {
this.$router.push({
@@ -193,6 +168,12 @@ export default {
id: id
}
});
},
switchPsychology(id) {
this.psychologyInfo = this.expertList.find(item => item.id == id);
if ( typeof this.psychologyInfo.labels == 'string' ) {
this.psychologyInfo.labels = this.psychologyInfo.labels.split('|');
}
}
}
};


+ 1
- 0
src/views/optimize/scss/trainingcamp.scss View File

@@ -144,6 +144,7 @@
display: block;
font-size: 28px;
color: grey;
margin-top: 10px;
}
}
}


+ 55
- 80
src/views/optimize/trainingcamp.vue View File

@@ -20,99 +20,37 @@
</div>
<div class="content-box" v-show="active == 'content'">
<ul>
<li>
<p>001 小学生学习能力发展的特点</p>
<li v-for="(item, index) in info.videoList" :key="index">
<!-- <p>{{index + 1 <= 9 ? '0' + (index + 1) : index + 1}} {{item.title}}</p> -->
<p>{{item.title}}</p>
<div>
<span><i>免费</i>09:26 | 11034次播放</span>
<img src="@/assets/optimize/icons/play.png" alt="" />
</div>
</li>
<li>
<p>002 小学生学习能力发展的特点</p>
<div>
<span>09:26 | 11034次播放</span>
<img src="@/assets/optimize/icons/lock.png" alt="" />
</div>
</li>
<li>
<p>003 小学生学习能力发展的特点</p>
<div>
<span><i>免费</i>09:26 | 11034次播放</span>
<img src="@/assets/optimize/icons/play.png" alt="" />
</div>
</li>
<li>
<p>004 小学生学习能力发展的特点</p>
<div>
<span>09:26 | 11034次播放</span>
<img src="@/assets/optimize/icons/play.png" alt="" />
<span><i v-if="item.isFree == 0">免费</i>{{item.duration}} | {{item.playBack}}次播放</span>
<img v-if="item.isFree == 0" src="@/assets/optimize/icons/play.png" alt="" />
<img v-else src="@/assets/optimize/icons/lock.png" alt="" />
</div>
</li>
</ul>
</div>
<div class="evaluate-box" v-show="active == 'evaluate'">
<ul>
<li>
<li v-for="(item, index) in info.evaluate" :key="index">
<div class="top">
<img src="@/assets/optimize/icons/3_55.png" alt="" />
<div>
<p>张杰妈妈</p>
<span>12.18 51:13 广州</span>
<p>{{item.name}}</p>
<span>{{item.date}} {{item.address}}</span>
</div>
</div>
<p>买了好多课，这个是最值得的，真的实用，思路清晰</p>
<span>21.孩子的适应能力怎么训练？</span>
</li>
<li>
<div class="top">
<img src="@/assets/optimize/icons/3_55.png" alt="" />
<div>
<p>张杰妈妈</p>
<span>12.18 51:13 广州</span>
</div>
</div>
<p>买了好多课，这个是最值得的，真的实用，思路清晰</p>
<span>21.孩子的适应能力怎么训练？</span>
</li>
<li>
<div class="top">
<img src="@/assets/optimize/icons/3_55.png" alt="" />
<div>
<p>张杰妈妈</p>
<span>12.18 51:13 广州</span>
</div>
</div>
<p>买了好多课，这个是最值得的，真的实用，思路清晰</p>
<span>21.孩子的适应能力怎么训练？</span>
</li>
<li>
<div class="top">
<img src="@/assets/optimize/icons/3_55.png" alt="" />
<div>
<p>张杰妈妈</p>
<span>12.18 51:13 广州</span>
</div>
</div>
<p>买了好多课，这个是最值得的，真的实用，思路清晰</p>
<span>21.孩子的适应能力怎么训练？</span>
<p>{{item.content}}</p>
<span>{{item.videoName}}</span>
</li>
</ul>
</div>
<div class="recommend-box" v-show="active == 'recommend'">
<ul>
<li>
<h4>孩子自主学习力提升实操课</h4>
<p>入门易学</p>
<span>播放</span>
<img src="@/assets/optimize/images/3_48.png" alt="" />
</li>
<li>
<h4>给孩子的文学课</h4>
<span>播放</span>
<img src="@/assets/optimize/images/3_48.png" alt="" />
</li>
<li>
<h4>孩子自主学习力提升实操课</h4>
<li v-for="(item, index) in campList" :key="index">
<h4>{{item.name}}</h4>
<p>{{item.summary}}</p>
<span>播放</span>
<img src="@/assets/optimize/images/3_48.png" alt="" />
</li>
@@ -126,17 +64,20 @@

<script>
import TabBar from '@/components/TabBar';
import APIOptimize from '@/api/optimize';
export default {
components: {
TabBar
},
data() {
return {
active: 'brief'
active: 'brief',
campList: [],
info: {}
};
},
created() {
console.log(this.$route.query);
this.init(this.$route.query.id);
},
mounted() {},
methods: {
@@ -149,11 +90,45 @@ export default {
// 切换
switchNav(e) {
this.active = e;
},
// 初始化
init(id) {
// 训练营详情
APIOptimize.getCampList(id)
.then(res => {
if ( res.data.data.length != 0 ) {
this.info = res.data.data[0]
if ( this.info.evaluate.length != 0 ) {
this.info.evaluate.forEach(element => {
if ( this.info.videoList.length != 0 ) {
this.info.videoList.forEach(e => {
if ( element['videoId'] == e['id'] ) {
element['videoName'] = e['title'];
}
})
} else {
element['videoName'] = "暂无消息";
}
})
}
}
})
.catch(e => {
console.log(e);
})
// 训练营推荐列表
APIOptimize.getCampRecommendList()
.then(res => {
this.campList = res.data.data
})
.catch(e => {
console.log(e);
})
}
}
};
</script>
"
<style scoped lang="scss">
@import './scss/trainingcamp.scss';
@import './scss/trainingcamp.scss';
</style>

Write Preview
Loading…
Cancel
Save