1.5.1API方法
[AppleScript] 纯文本查看 复制代码 /*发布课程*/ export const publish = id => {
return http.requestPost(apiUrl+'/course/publish/'+id);
}
1.5.2 页面
修改 course_pub.vue
添加:
[AppleScript] 纯文本查看 复制代码 <el‐card class="box‐card">
<div slot="header" class="clearfix">
<span>课程发布</span>
</div>
<div class="text item">
<div v‐if="course.status == '202001'">
状态:制作中<br/>
<el‐button type="primary" @click.native="publish" >新课程发布</el‐button>
</div>
<div v‐else‐if="course.status == '202003'">
状态:已下线
<br/><br/>
<span><a :href="'http://www.xuecheng.com/course/detail/'+this.courseid+'.html'" target="_blank">点我查看课程详情页面 </a>
</span>
</div>
<div v‐else‐if="course.status == '202002'">
状态:已发布<br/>
<el‐button type="primary" @click.native="publish" >修改发布</el‐button>
<br/><br/>
<span><a :href="'http://www.xuecheng.com/course/detail/'+this.courseid+'.html'" target="_blank">点我查看课程详情页面 </a> </span>
</div>
</div>
</el‐card>
发布方法 ,发布成功重新查询课程,如果课程状态已更改则显示课程详情页面的链接。
[AppleScript] 纯文本查看 复制代码 //发布
publish(){
this.$confirm('课程发布后将不允许回退,是否继续?', '提示', {}).then(() => {
courseApi.publish(this.courseid).then((res) => {
if(res.success){
this.$message.error('发布成功');
//查询课程信息
this.getcourse()
}else{
this.$message.error('发布失败');
}
});
});
},
//查询课程信息
getcourse(){
courseApi.getCoursebaseById(this.courseid).then((res) => {
console.log(res);
this.course = res;
});
}
在钩子方法中查询课程信息:
[AppleScript] 纯文本查看 复制代码 mounted(){
//课程id
this.courseid = this.$route.params.courseid;
console.log("courseid=" + this.courseid)
//查询课程信息
this.getcourse()
}
|