Skip to content

X
xiaomai-cloud-class-web
Commit dc2446de by guomingpang
Options

fix:修复知识库课程分类搜索bug

parent 4a03f8fd
Showing with 79 additions and 79 deletions
src/modules/course-manage/video-course/components/VideoCourseList.jsx
import React from 'react' import React from "react"
import { Table, Modal, message, Tooltip, Switch, Dropdown } from 'antd' import { Table, Modal, message, Tooltip, Switch, Dropdown } from "antd"
import _ from 'underscore' import _ from "underscore"
import { PageControl } from '@/components' import { PageControl } from "@/components"
import { LIVE_SHARE } from '@/domains/course-domain/constants' import { LIVE_SHARE } from "@/domains/course-domain/constants"
import ShareLiveModal from '@/modules/course-manage/modal/ShareLiveModal' import ShareLiveModal from "@/modules/course-manage/modal/ShareLiveModal"
import WatchDataModal from '../modal/WatchDataModal' import WatchDataModal from "../modal/WatchDataModal"
import CourseService from '@/domains/course-domain/CourseService' import CourseService from "@/domains/course-domain/CourseService"
import RelatedPlanModal from '../../modal/RelatedPlanModal' import RelatedPlanModal from "../../modal/RelatedPlanModal"
import User from '@/common/js/user' import User from "@/common/js/user"
import './VideoCourseList.less' import "./VideoCourseList.less"
class VideoCourseList extends React.Component { class VideoCourseList extends React.Component {
constructor(props) { constructor(props) {
super(props) super(props)
this.state = { this.state = {
id: '', // 视频课ID id: "", // 视频课ID
studentIds: [], studentIds: [],
RelatedPlanModalVisible: false, RelatedPlanModalVisible: false,
selectPlanList: {}, selectPlanList: {},
...@@ -26,7 +26,7 @@ class VideoCourseList extends React.Component { ...@@ -26,7 +26,7 @@ class VideoCourseList extends React.Component {
} }
componentDidMount() { componentDidMount() {
const videoCourseItem = localStorage.getItem('videoCourseItem') const videoCourseItem = localStorage.getItem("videoCourseItem")
if (videoCourseItem) { if (videoCourseItem) {
const _videoCourseItem = JSON.parse(videoCourseItem) const _videoCourseItem = JSON.parse(videoCourseItem)
this.handleShowShareModal(_videoCourseItem, true) this.handleShowShareModal(_videoCourseItem, true)
...@@ -55,11 +55,11 @@ class VideoCourseList extends React.Component { ...@@ -55,11 +55,11 @@ class VideoCourseList extends React.Component {
const { ShelfLoading } = this.state const { ShelfLoading } = this.state
const columns = [ const columns = [
{ {
title: '视频课', title: "视频课",
key: 'scheduleName', key: "scheduleName",
dataIndex: 'scheduleName', dataIndex: "scheduleName",
width: 321, width: 321,
fixed: 'left', fixed: "left",
render: (val, record) => { render: (val, record) => {
const { coverUrl, scheduleVideoUrl } = record const { coverUrl, scheduleVideoUrl } = record
return ( return (
...@@ -69,7 +69,7 @@ class VideoCourseList extends React.Component { ...@@ -69,7 +69,7 @@ class VideoCourseList extends React.Component {
className='course-cover' className='course-cover'
src={ src={
coverUrl || 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='' alt=''
/> />
...@@ -91,25 +91,25 @@ class VideoCourseList extends React.Component { ...@@ -91,25 +91,25 @@ class VideoCourseList extends React.Component {
title: ( title: (
<span> <span>
<span>课程分类</span> <span>课程分类</span>
<If condition={type !== 'internal'}> <If condition={type !== "internal"}>
<Tooltip title={<div>外部课程的分类由系统提供，不影响企业课程分类。</div>}> <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; &#xe61d;
</i> </i>
</Tooltip> </Tooltip>
</If> </If>
</span> </span>
), ),
key: 'categoryName', key: "categoryName",
dataIndex: 'categoryName', dataIndex: "categoryName",
width: 200, width: 200,
render: (val, record) => { render: (val, record) => {
return ( return (
<Choose> <Choose>
<When condition={type === 'internal'}> <When condition={type === "internal"}>
<div className='record__item'> <div className='record__item'>
{record.categoryOneName} {record.categoryOneName}
{record.categoryTwoName ? `-${record.categoryTwoName}` : ''} {record.categoryTwoName ? `-${record.categoryTwoName}` : ""}
</div> </div>
</When> </When>
<Otherwise> <Otherwise>
...@@ -120,9 +120,9 @@ class VideoCourseList extends React.Component { ...@@ -120,9 +120,9 @@ class VideoCourseList extends React.Component {
} }
}, },
{ {
title: '创建人', title: "创建人",
key: 'createName', key: "createName",
dataIndex: 'createName', dataIndex: "createName",
width: 100, width: 100,
render: (val) => { render: (val) => {
return ( return (
...@@ -148,20 +148,20 @@ class VideoCourseList extends React.Component { ...@@ -148,20 +148,20 @@ class VideoCourseList extends React.Component {
关闭后，学院内不再展示此课程，但学员仍可通过分享的海报/链接查看此课程。 关闭后，学院内不再展示此课程，但学员仍可通过分享的海报/链接查看此课程。
</div> </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; &#xe61d;
</i> </i>
</Tooltip> </Tooltip>
</span> </span>
), ),
width: 120, width: 120,
key: 'shelfState', key: "shelfState",
dataIndex: 'shelfState', dataIndex: "shelfState",
render: (val, item, index) => { render: (val, item, index) => {
return ( return (
<Switch <Switch
loading={ShelfLoading} loading={ShelfLoading}
checked={item.shelfState === 'YES'} checked={item.shelfState === "YES"}
defaultChecked={item.shelfState} defaultChecked={item.shelfState}
onClick={(checked) => { onClick={(checked) => {
this.changeShelfState(checked, item, index) this.changeShelfState(checked, item, index)
...@@ -171,39 +171,39 @@ class VideoCourseList extends React.Component { ...@@ -171,39 +171,39 @@ class VideoCourseList extends React.Component {
} }
}, },
{ {
title: '观看学员数', title: "观看学员数",
width: 110, width: 110,
key: 'watchUserCount', key: "watchUserCount",
dataIndex: 'watchUserCount', dataIndex: "watchUserCount",
render: (val, item) => { render: (val, item) => {
return <div className='watchUserCount'>{val || 0}</div> return <div className='watchUserCount'>{val || 0}</div>
} }
}, },
{ {
title: '创建时间', title: "创建时间",
width: 181, width: 181,
key: 'created', key: "created",
dataIndex: 'created', dataIndex: "created",
sorter: true, sorter: true,
render: (val) => { render: (val) => {
return formatDate('YYYY-MM-DD H:i', val) return formatDate("YYYY-MM-DD H:i", val)
} }
}, },
{ {
title: '更新时间', title: "更新时间",
width: 181, width: 181,
key: 'updated', key: "updated",
dataIndex: 'updated', dataIndex: "updated",
sorter: true, sorter: true,
render: (val) => { render: (val) => {
return formatDate('YYYY-MM-DD H:i', val) return formatDate("YYYY-MM-DD H:i", val)
} }
}, },
{ {
title: '关联项', title: "关联项",
width: 200, width: 200,
key: 'planList', key: "planList",
dataIndex: 'planList', dataIndex: "planList",
render: (val, record) => { render: (val, record) => {
return ( return (
<div className='related-task'> <div className='related-task'>
...@@ -228,11 +228,11 @@ class VideoCourseList extends React.Component { ...@@ -228,11 +228,11 @@ class VideoCourseList extends React.Component {
} }
}, },
{ {
title: '操作', title: "操作",
key: 'operate', key: "operate",
dataIndex: 'operate', dataIndex: "operate",
width: 210, width: 210,
fixed: 'right', fixed: "right",
render: (val, record) => { render: (val, record) => {
return ( return (
<div className='operate'> <div className='operate'>
...@@ -240,7 +240,7 @@ class VideoCourseList extends React.Component { ...@@ -240,7 +240,7 @@ class VideoCourseList extends React.Component {
观看数据 观看数据
</div> </div>
<If condition={type === 'internal'}> <If condition={type === "internal"}>
<span className='operate__item split'> | </span> <span className='operate__item split'> | </span>
<div className='operate__item' onClick={() => this.handleShowShareModal(record)}> <div className='operate__item' onClick={() => this.handleShowShareModal(record)}>
分享 分享
...@@ -250,7 +250,7 @@ class VideoCourseList extends React.Component { ...@@ -250,7 +250,7 @@ class VideoCourseList extends React.Component {
<Dropdown overlay={this.renderMoreOperate(record)}> <Dropdown overlay={this.renderMoreOperate(record)}>
<span className='more-operate'> <span className='more-operate'>
<span className='operate-text'>更多</span> <span className='operate-text'>更多</span>
<span className='iconfont icon' style={{ color: '#2966FF' }}> <span className='iconfont icon' style={{ color: "#2966FF" }}>
&#xe824; &#xe824;
</span> </span>
</span> </span>
...@@ -261,7 +261,7 @@ class VideoCourseList extends React.Component { ...@@ -261,7 +261,7 @@ class VideoCourseList extends React.Component {
} }
] ]
type !== 'internal' && columns.splice(2, 1) type !== "internal" && columns.splice(2, 1)
return columns return columns
} }
...@@ -269,17 +269,17 @@ class VideoCourseList extends React.Component { ...@@ -269,17 +269,17 @@ class VideoCourseList extends React.Component {
const { type } = this.props const { type } = this.props
return ( return (
<div className='live-course-more-menu'> <div className='live-course-more-menu'>
<If condition={type !== 'internal'}> <If condition={type !== "internal"}>
<div className='operate__item' onClick={() => this.handleShowShareModal(item)}> <div className='operate__item' onClick={() => this.handleShowShareModal(item)}>
分享 分享
</div> </div>
</If> </If>
{(User.getUserRole() === 'CloudManager' || User.getUserRole() === 'StoreManager') && ( {(User.getUserRole() === "CloudManager" || User.getUserRole() === "StoreManager") && (
<div className='operate__item' onClick={() => this.handleRelatedModalShow(item)}> <div className='operate__item' onClick={() => this.handleRelatedModalShow(item)}>
关联培训计划 关联培训计划
</div> </div>
)} )}
<If condition={type === 'internal'}> <If condition={type === "internal"}>
<div <div
className='operate__item' className='operate__item'
onClick={() => { onClick={() => {
...@@ -296,10 +296,10 @@ class VideoCourseList extends React.Component { ...@@ -296,10 +296,10 @@ class VideoCourseList extends React.Component {
} }
handlePlanName = (planArray) => { handlePlanName = (planArray) => {
let planStr = '' let planStr = ""
planArray.map((item, index) => { planArray.map((item, index) => {
if (index < planArray.length - 1) { if (index < planArray.length - 1) {
planStr = planStr + item.planName + '、' planStr = planStr + item.planName + "、"
} else { } else {
planStr = planStr + item.planName planStr = planStr + item.planName
} }
...@@ -308,21 +308,21 @@ class VideoCourseList extends React.Component { ...@@ -308,21 +308,21 @@ class VideoCourseList extends React.Component {
} }
//改变上架状态 //改变上架状态
changeShelfState = (checked, item, index) => { changeShelfState = (checked, item, index) => {
let _shelfState = checked ? 'YES' : 'NO' let _shelfState = checked ? "YES" : "NO"
if (checked) { if (checked) {
_shelfState = 'YES' _shelfState = "YES"
} else { } else {
_shelfState = 'NO' _shelfState = "NO"
} }
const params = { const params = {
courseId: item.id, courseId: item.id,
shelfState: _shelfState shelfState: _shelfState
} }
CourseService.changeVideoShelfState(params).then(() => { CourseService.changeVideoShelfState(params).then(() => {
if (_shelfState === 'YES') { if (_shelfState === "YES") {
message.success('已开启展示') message.success("已开启展示")
} else { } else {
message.success('已取消展示') message.success("已取消展示")
} }
this.props.changeShelfState(index, _shelfState) this.props.changeShelfState(index, _shelfState)
}) })
...@@ -331,19 +331,19 @@ class VideoCourseList extends React.Component { ...@@ -331,19 +331,19 @@ class VideoCourseList extends React.Component {
// 删除视频课 // 删除视频课
handleDeleteVideoCourse = (scheduleId) => { handleDeleteVideoCourse = (scheduleId) => {
Modal.confirm({ Modal.confirm({
title: '你确定要删除此视频课吗？', title: "你确定要删除此视频课吗？",
content: '删除后，学员将不能进行观看。', content: "删除后，学员将不能进行观看。",
icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>, icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>,
okText: '确定', okText: "确定",
okType: 'danger', okType: "danger",
cancelText: '取消', cancelText: "取消",
onOk: () => { onOk: () => {
const param = { const param = {
courseId: scheduleId, courseId: scheduleId,
storeId: User.getStoreId() storeId: User.getStoreId()
} }
CourseService.delVideoSchedule(param).then(() => { CourseService.delVideoSchedule(param).then(() => {
message.success('删除成功') message.success("删除成功")
this.props.onChange() this.props.onChange()
}) })
} }
...@@ -375,7 +375,7 @@ class VideoCourseList extends React.Component { ...@@ -375,7 +375,7 @@ class VideoCourseList extends React.Component {
this.setState({ this.setState({
shareLiveModal: null shareLiveModal: null
}) })
localStorage.setItem('videoCourseItem', '') localStorage.setItem("videoCourseItem", "")
}} }}
/> />
) )
...@@ -388,20 +388,20 @@ class VideoCourseList extends React.Component { ...@@ -388,20 +388,20 @@ class VideoCourseList extends React.Component {
const { query } = this.props const { query } = this.props
let { order: _order } = query let { order: _order } = query
// 按创建时间升序排序 // 按创建时间升序排序
if (columnKey === 'created' && order === 'ascend') { if (columnKey === "created" && order === "ascend") {
_order = 'CREATED_ASC' _order = "CREATED_ASC"
} }
// 按创建时间降序排序 // 按创建时间降序排序
if (columnKey === 'created' && order === 'descend') { if (columnKey === "created" && order === "descend") {
_order = 'CREATED_DESC' _order = "CREATED_DESC"
} }
// 按更新时间升序排序 // 按更新时间升序排序
if (columnKey === 'updated' && order === 'ascend') { if (columnKey === "updated" && order === "ascend") {
_order = 'UPDATED_ASC' _order = "UPDATED_ASC"
} }
// 按更新时间降序排序 // 按更新时间降序排序
if (columnKey === 'updated' && order === 'descend') { if (columnKey === "updated" && order === "descend") {
_order = 'UPDATED_DESC' _order = "UPDATED_DESC"
} }
const _query = { const _query = {
...@@ -451,7 +451,7 @@ class VideoCourseList extends React.Component { ...@@ -451,7 +451,7 @@ class VideoCourseList extends React.Component {
const { current, size } = query const { current, size } = query
const { RelatedPlanModalVisible, selectPlanList, selectCourseId } = this.state const { RelatedPlanModalVisible, selectPlanList, selectCourseId } = this.state
return ( return (
<div className={`video-course-list ${type !== 'internal' ? 'video-course-list-mt' : ''}`}> <div className={`video-course-list ${type !== "internal" ? "video-course-list-mt" : ""}`}>
<Table <Table
rowKey={(record) => record.id} rowKey={(record) => record.id}
dataSource={dataSource} dataSource={dataSource}
......
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