Commit 830dd7e3 by guomingpang

feat:外部课程相关 merge master

parent 88745c2f
/*
* @Author: 吴文洁
* @Date: 2020-08-05 10:12:45
* @LastEditors: fusanqiasng
<<<<<<< HEAD
* @LastEditTime: 2021-05-30 10:45:55
=======
<<<<<<< Updated upstream
* @LastEditTime: 2021-05-27 17:48:31
=======
* @LastEditTime: 2021-05-27 19:13:55
>>>>>>> Stashed changes
>>>>>>> feature/pangguoming/20210520/external_courses
* @Description: 视频课-列表模块
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
import React from 'react'
import { Table, Modal, message, Tooltip, Switch, Dropdown } from 'antd'
import _ from 'underscore'
import { PageControl } from '@/components'
import { LIVE_SHARE } from '@/domains/course-domain/constants'
import React from "react"
import { Table, Modal, message, Tooltip, Switch, Dropdown } from "antd"
import _ from "underscore"
import { PageControl } from "@/components"
import { LIVE_SHARE } from "@/domains/course-domain/constants"
import ShareLiveModal from '@/modules/course-manage/modal/ShareLiveModal'
import WatchDataModal from '../modal/WatchDataModal'
import CourseService from '@/domains/course-domain/CourseService'
import RelatedPlanModal from '../../modal/RelatedPlanModal'
import User from '@/common/js/user'
import ShareLiveModal from "@/modules/course-manage/modal/ShareLiveModal"
import WatchDataModal from "../modal/WatchDataModal"
import CourseService from "@/domains/course-domain/CourseService"
import RelatedPlanModal from "../../modal/RelatedPlanModal"
import User from "@/common/js/user"
import './VideoCourseList.less'
import "./VideoCourseList.less"
class VideoCourseList extends React.Component {
constructor(props) {
super(props)
this.state = {
id: '', // 视频课ID
id: "", // 视频课ID
studentIds: [],
RelatedPlanModalVisible: false,
selectPlanList: {},
ShelfLoading: false,
ShelfLoading: false
// dataSource: [],
}
}
componentDidMount() {
const videoCourseItem = localStorage.getItem('videoCourseItem')
const videoCourseItem = localStorage.getItem("videoCourseItem")
if (videoCourseItem) {
const _videoCourseItem = JSON.parse(videoCourseItem)
this.handleShowShareModal(_videoCourseItem, true)
......@@ -57,7 +41,7 @@ class VideoCourseList extends React.Component {
data={record}
close={() => {
this.setState({
watchDataModal: null,
watchDataModal: null
})
}}
/>
......@@ -71,11 +55,11 @@ class VideoCourseList extends React.Component {
const { ShelfLoading } = this.state
const columns = [
{
title: '视频课',
key: 'scheduleName',
dataIndex: 'scheduleName',
title: "视频课",
key: "scheduleName",
dataIndex: "scheduleName",
width: 321,
fixed: 'left',
fixed: "left",
render: (val, record) => {
const { coverUrl, scheduleVideoUrl } = record
return (
......@@ -85,7 +69,7 @@ class VideoCourseList extends React.Component {
className='course-cover'
src={
coverUrl ||
(type === 'internal' ? `${scheduleVideoUrl}?x-oss-process=video/snapshot,t_0,m_fast` : 'https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png')
(type === "internal" ? `${scheduleVideoUrl}?x-oss-process=video/snapshot,t_0,m_fast` : "https://image.xiaomaiketang.com/xm/mt3ZQRxGKB.png")
}
alt=''
/>
......@@ -101,31 +85,31 @@ class VideoCourseList extends React.Component {
</Choose>
</div>
)
},
}
},
{
title: (
<span>
<span>课程分类</span>
<If condition={type !== 'internal'}>
<If condition={type !== "internal"}>
<Tooltip title={<div>外部课程的分类由系统提供,不影响企业课程分类。</div>}>
<i className='icon iconfont' style={{ marginLeft: '5px', cursor: 'pointer', color: '#bfbfbf', fontSize: '14px', fontWeight: 'normal' }}>
<i className='icon iconfont' style={{ marginLeft: "5px", cursor: "pointer", color: "#bfbfbf", fontSize: "14px", fontWeight: "normal" }}>
&#xe61d;
</i>
</Tooltip>
</If>
</span>
),
key: 'categoryName',
dataIndex: 'categoryName',
key: "categoryName",
dataIndex: "categoryName",
width: 200,
render: (val, record) => {
return (
<Choose>
<When condition={type === 'internal'}>
<When condition={type === "internal"}>
<div className='record__item'>
{record.categoryOneName}
{record.categoryTwoName ? `-${record.categoryTwoName}` : ''}
{record.categoryTwoName ? `-${record.categoryTwoName}` : ""}
</div>
</When>
<Otherwise>
......@@ -133,12 +117,12 @@ class VideoCourseList extends React.Component {
</Otherwise>
</Choose>
)
},
}
},
{
title: '创建人',
key: 'createName',
dataIndex: 'createName',
title: "创建人",
key: "createName",
dataIndex: "createName",
width: 100,
render: (val) => {
return (
......@@ -150,7 +134,7 @@ class VideoCourseList extends React.Component {
)}
</div>
)
},
}
},
{
title: (
......@@ -164,62 +148,62 @@ class VideoCourseList extends React.Component {
关闭后,学院内不再展示此课程,但学员仍可通过分享的海报/链接查看此课程。
</div>
}>
<i className='icon iconfont' style={{ marginLeft: '5px', cursor: 'pointer', color: '#bfbfbf', fontSize: '14px' }}>
<i className='icon iconfont' style={{ marginLeft: "5px", cursor: "pointer", color: "#bfbfbf", fontSize: "14px" }}>
&#xe61d;
</i>
</Tooltip>
</span>
),
width: 120,
key: 'shelfState',
dataIndex: 'shelfState',
key: "shelfState",
dataIndex: "shelfState",
render: (val, item, index) => {
return (
<Switch
loading={ShelfLoading}
checked={item.shelfState === 'YES'}
checked={item.shelfState === "YES"}
defaultChecked={item.shelfState}
onClick={(checked) => {
this.changeShelfState(checked, item, index)
}}
/>
)
},
}
},
{
title: '观看学员数',
title: "观看学员数",
width: 110,
key: 'watchUserCount',
dataIndex: 'watchUserCount',
key: "watchUserCount",
dataIndex: "watchUserCount",
render: (val, item) => {
return <div className='watchUserCount'>{val || 0}</div>
},
}
},
{
title: '创建时间',
title: "创建时间",
width: 181,
key: 'created',
dataIndex: 'created',
key: "created",
dataIndex: "created",
sorter: true,
render: (val) => {
return formatDate('YYYY-MM-DD H:i', val)
},
return formatDate("YYYY-MM-DD H:i", val)
}
},
{
title: '更新时间',
title: "更新时间",
width: 181,
key: 'updated',
dataIndex: 'updated',
key: "updated",
dataIndex: "updated",
sorter: true,
render: (val) => {
return formatDate('YYYY-MM-DD H:i', val)
},
return formatDate("YYYY-MM-DD H:i", val)
}
},
{
title: '关联项',
title: "关联项",
width: 200,
key: 'planList',
dataIndex: 'planList',
key: "planList",
dataIndex: "planList",
render: (val, record) => {
return (
<div className='related-task'>
......@@ -241,14 +225,14 @@ class VideoCourseList extends React.Component {
</Choose>
</div>
)
},
}
},
{
title: '操作',
key: 'operate',
dataIndex: 'operate',
title: "操作",
key: "operate",
dataIndex: "operate",
width: 210,
fixed: 'right',
fixed: "right",
render: (val, record) => {
return (
<div className='operate'>
......@@ -256,7 +240,7 @@ class VideoCourseList extends React.Component {
观看数据
</div>
<If condition={type === 'internal'}>
<If condition={type === "internal"}>
<span className='operate__item split'> | </span>
<div className='operate__item' onClick={() => this.handleShowShareModal(record)}>
分享
......@@ -266,18 +250,18 @@ class VideoCourseList extends React.Component {
<Dropdown overlay={this.renderMoreOperate(record)}>
<span className='more-operate'>
<span className='operate-text'>更多</span>
<span className='iconfont icon' style={{ color: '#2966FF' }}>
<span className='iconfont icon' style={{ color: "#2966FF" }}>
&#xe824;
</span>
</span>
</Dropdown>
</div>
)
},
},
}
}
]
type !== 'internal' && columns.splice(2, 1)
type !== "internal" && columns.splice(2, 1)
return columns
}
......@@ -285,17 +269,17 @@ class VideoCourseList extends React.Component {
const { type } = this.props
return (
<div className='live-course-more-menu'>
<If condition={type !== 'internal'}>
<If condition={type !== "internal"}>
<div className='operate__item' onClick={() => this.handleShowShareModal(item)}>
分享
</div>
</If>
{(User.getUserRole() === 'CloudManager' || User.getUserRole() === 'StoreManager') && (
{(User.getUserRole() === "CloudManager" || User.getUserRole() === "StoreManager") && (
<div className='operate__item' onClick={() => this.handleRelatedModalShow(item)}>
关联培训计划
</div>
)}
<If condition={type === 'internal'}>
<If condition={type === "internal"}>
<div
className='operate__item'
onClick={() => {
......@@ -312,10 +296,10 @@ class VideoCourseList extends React.Component {
}
handlePlanName = (planArray) => {
let planStr = ''
let planStr = ""
planArray.map((item, index) => {
if (index < planArray.length - 1) {
planStr = planStr + item.planName + '、'
planStr = planStr + item.planName + "、"
} else {
planStr = planStr + item.planName
}
......@@ -324,21 +308,21 @@ class VideoCourseList extends React.Component {
}
//改变上架状态
changeShelfState = (checked, item, index) => {
let _shelfState = checked ? 'YES' : 'NO'
let _shelfState = checked ? "YES" : "NO"
if (checked) {
_shelfState = 'YES'
_shelfState = "YES"
} else {
_shelfState = 'NO'
_shelfState = "NO"
}
const params = {
courseId: item.id,
shelfState: _shelfState,
shelfState: _shelfState
}
CourseService.changeVideoShelfState(params).then(() => {
if (_shelfState === 'YES') {
message.success('已开启展示')
if (_shelfState === "YES") {
message.success("已开启展示")
} else {
message.success('已取消展示')
message.success("已取消展示")
}
this.props.changeShelfState(index, _shelfState)
})
......@@ -347,22 +331,22 @@ class VideoCourseList extends React.Component {
// 删除视频课
handleDeleteVideoCourse = (scheduleId) => {
Modal.confirm({
title: '你确定要删除此视频课吗?',
content: '删除后,学员将不能进行观看。',
title: "你确定要删除此视频课吗?",
content: "删除后,学员将不能进行观看。",
icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>,
okText: '确定',
okType: 'danger',
cancelText: '取消',
okText: "确定",
okType: "danger",
cancelText: "取消",
onOk: () => {
const param = {
courseId: scheduleId,
storeId: User.getStoreId(),
storeId: User.getStoreId()
}
CourseService.delVideoSchedule(param).then(() => {
message.success('删除成功')
message.success("删除成功")
this.props.onChange()
})
},
}
})
}
......@@ -377,7 +361,7 @@ class VideoCourseList extends React.Component {
longUrl,
coverUrl,
scheduleVideoUrl,
courseName,
courseName
}
const shareLiveModal = (
......@@ -389,9 +373,9 @@ class VideoCourseList extends React.Component {
title='视频课'
close={() => {
this.setState({
shareLiveModal: null,
shareLiveModal: null
})
localStorage.setItem('videoCourseItem', '')
localStorage.setItem("videoCourseItem", "")
}}
/>
)
......@@ -404,25 +388,25 @@ class VideoCourseList extends React.Component {
const { query } = this.props
let { order: _order } = query
// 按创建时间升序排序
if (columnKey === 'created' && order === 'ascend') {
_order = 'CREATED_ASC'
if (columnKey === "created" && order === "ascend") {
_order = "CREATED_ASC"
}
// 按创建时间降序排序
if (columnKey === 'created' && order === 'descend') {
_order = 'CREATED_DESC'
if (columnKey === "created" && order === "descend") {
_order = "CREATED_DESC"
}
// 按更新时间升序排序
if (columnKey === 'updated' && order === 'ascend') {
_order = 'UPDATED_ASC'
if (columnKey === "updated" && order === "ascend") {
_order = "UPDATED_ASC"
}
// 按更新时间降序排序
if (columnKey === 'updated' && order === 'descend') {
_order = 'UPDATED_DESC'
if (columnKey === "updated" && order === "descend") {
_order = "UPDATED_DESC"
}
const _query = {
...query,
orderEnum: _order,
orderEnum: _order
}
this.props.onChange(_query)
}
......@@ -439,23 +423,23 @@ class VideoCourseList extends React.Component {
this.setState({
RelatedPlanModalVisible: true,
selectCourseId: item.id,
selectPlanList: selectPlanList,
selectPlanList: selectPlanList
})
}
closeRelatedPlanModalVisible = () => {
this.setState({
RelatedPlanModalVisible: false,
RelatedPlanModalVisible: false
})
}
onChangeSelectPlanList = (selectPlanList) => {
this.setState({
selectPlanList: selectPlanList,
selectPlanList: selectPlanList
})
}
onConfirmSelectPlanList = () => {
this.setState(
{
RelatedPlanModalVisible: false,
RelatedPlanModalVisible: false
},
() => {
this.props.onChange()
......@@ -467,7 +451,7 @@ class VideoCourseList extends React.Component {
const { current, size } = query
const { RelatedPlanModalVisible, selectPlanList, selectCourseId } = this.state
return (
<div className={`video-course-list ${type !== 'internal' ? 'video-course-list-mt' : ''}`}>
<div className={`video-course-list ${type !== "internal" ? "video-course-list-mt" : ""}`}>
<Table
rowKey={(record) => record.id}
dataSource={dataSource}
......
......@@ -2,24 +2,19 @@
* @Description:
* @Author: zangsuyun
* @Date: 2021-03-12 10:43:10
<<<<<<< HEAD
* @LastEditors: fusanqiasng
* @LastEditTime: 2021-05-28 13:33:07
=======
* @LastEditors: fusanqiasng
* @LastEditTime: 2021-05-27 13:51:42
>>>>>>> 4399d60 (fix:修复外部课程相关模块bug)
* @LastEditTime: 2021-05-30 19:46:49
* @Copyright: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from 'react'
import React from "react"
import KnowledgeBaseFilter from './components/KnowledgeBaseFilter'
import KnowledgeBaseOpt from './components/KnowledgeBaseOpt'
import KnowledgeBaseList from './components/KnowledgeBaseList'
import Classification from './components/Classification'
import KnowledgeBaseFilter from "./components/KnowledgeBaseFilter"
import KnowledgeBaseOpt from "./components/KnowledgeBaseOpt"
import KnowledgeBaseList from "./components/KnowledgeBaseList"
import Classification from "./components/Classification"
import KnowledgeAPI from '@/data-source/knowledge/request-api'
import User from '@/common/js/user'
import KnowledgeAPI from "@/data-source/knowledge/request-api"
import User from "@/common/js/user"
export default class KnowledgeBase extends React.Component {
constructor(props) {
......@@ -29,12 +24,12 @@ export default class KnowledgeBase extends React.Component {
size: 10,
current: 1,
storeId: User.getStoreId(),
categoryId: 0,
categoryId: 0
},
dataSource: [], // 知识库列表
totalCount: 0, // 知识库数据总条数
categoryId: '0',
updateCategoryFlag: false,
categoryId: "0",
updateCategoryFlag: false
}
}
......@@ -45,7 +40,7 @@ export default class KnowledgeBase extends React.Component {
}
getSelectedCategoryId = (categoryId) => {
this.setState({
categoryId,
categoryId
})
this.handleFetchScheduleList({ categoryId, current: 1 })
}
......@@ -53,14 +48,14 @@ export default class KnowledgeBase extends React.Component {
// 更新分类树
updateCategoryTree = () => {
this.setState({
updateCategoryFlag: !this.state.updateCategoryFlag,
updateCategoryFlag: !this.state.updateCategoryFlag
})
}
// 获取知识库列表
handleFetchScheduleList = (_query = {}, flag = true) => {
const query = {
...this.state.query,
..._query,
..._query
}
// 更新请求参数
......@@ -73,7 +68,7 @@ export default class KnowledgeBase extends React.Component {
const { records = [], total = 0 } = result
this.setState({
dataSource: records,
totalCount: Number(total),
totalCount: Number(total)
})
})
}
......@@ -84,17 +79,17 @@ export default class KnowledgeBase extends React.Component {
<div className='page'>
<div className='content-header'>知识库</div>
<div className='box' style={{ display: 'flex' }}>
<div className='box' style={{ display: "flex" }}>
{/* 搜索模块 */}
<div className='left' style={{ width: 245 }}>
<Classification updateCategoryFlag={updateCategoryFlag} categoryId={categoryId} getSelectedCategoryId={this.getSelectedCategoryId} />
</div>
<div className='liner' style={{ backgroundColor: 'rgb(238, 238, 238)', width: 0.5, margin: '1px 16px 1px 2px' }}></div>
<div className='right' style={{ width: 'calc(100% - 285px)' }}>
<div className='liner' style={{ backgroundColor: "rgb(238, 238, 238)", width: 0.5, margin: "1px 16px 1px 2px" }}></div>
<div className='right' style={{ width: "calc(100% - 285px)" }}>
<KnowledgeBaseFilter onChange={this.handleFetchScheduleList} />
{/* 操作模块 */}
{categoryId !== '0' && (
{categoryId !== "0" && (
<KnowledgeBaseOpt onChange={this.handleFetchScheduleList} updateCategoryTree={this.updateCategoryTree} categoryId={categoryId} />
)}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment