黑马程序员技术交流社区

标题: 【郑州校区】学成在线第6天讲义-页面发布课程管理四 [打印本页]

作者: 我是楠楠 时间: 2019-12-12 14:16
标题: 【郑州校区】学成在线第6天讲义-页面发布课程管理四

【郑州校区】学成在线第6天讲义-页面发布课程管理四

1.4 页面发布前端
用户操作流程：
1、用户进入cms页面列表。
2、点击“发布”请求服务端接口，发布页面。
3、提示“发布成功”，或发布失败。
1.4.1 API方法
在 cms前端添加 api方法。

[AppleScript] 纯文本查看 复制代码

/

*

发布页面

*

/

export const page_postPage

= id

=

> {

return http

.requestPost(apiUrl+

'

/cms/page/postPage/

'

+id)

}

1.4.2 页面
修改page_list.vue，添加发布按钮

[AppleScript] 纯文本查看 复制代码

 <el

‐

table

‐

column label=

"

发布

"

width=

"

80

"

>

<template slot

‐

scope

=

"

scope

"

>

<el

‐

button

size

=

"

small

"

type

=

"

primary

"

plain @click=

"

postPage(scope.row.

pageId)

"

>发布

</el

‐

button>

</template>

</el

‐

table

‐

column>

添加页面发布事件：

[AppleScript] 纯文本查看 复制代码

 postPage (id) {

this.

$confirm(

'

确认发布该页面吗?

'

,

'

提示

'

, {

})

.then(()

=

> {

cmsApi.

page_postPage(id)

.then((res)

=

> {

if(res.success){

console.log(

'

发布页面id

=

'

+id);

this.

$message.success(

'

发布成功，请稍后查看结果

'

);

}else{

this.

$message.error(

'

发布失败

'

);

}

});

})

.catch(()

=

> {

});

}

1.5 测试
这里测试轮播图页面修改、发布的流程：
1、修改轮播图页面模板或修改轮播图地址
注意：先修改页面原型，页面原型调试正常后再修改页面模板。
2、执行页面预览
3、执行页面发布，查看页面是否写到网站目录
4、刷新门户首页并观察轮播图是否变化。
1.6 思考
1、如果发布到服务器的页面内容不正确怎么办？
2、一个页面需要发布很多服务器，点击“发布”后如何知道详细的发布结果？
3、一个页面发布到多个服务器，其中有一个服务器发布失败时怎么办？

2 课程管理
2.1 需求分析
在线教育平台的课程信息相当于电商平台的商品。课程管理是后台管理功能中最重要的模块。本项目为教学机构提供课程管理功能，教学机构可以添加属于自己的课程，供学生在线学习。
课程管理包括如下功能需求：
1、分类管理
2、新增课程
3、修改课程
4、预览课程
5、发布课程
用户的操作流程如下：
1、进入我的课程

3、输入课程基本信息，点击提交
4、课程基本信息提交成功，自动进入“管理课程”界面，点击“管理课程”也可以进入“管理课程”界面

5、编辑图片
上传课程图片。

6、编辑课程营销信息
营销信息主要是设置课程的收费方式及价格。

欢迎光临黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2