cxt
5 years ago
commit
3923cf64c3
@ -0,0 +1,35 @@
|
||||
class CourseVideosController < ApplicationController
|
||||
before_action :require_login
|
||||
before_action :validate_params
|
||||
before_action :find_course, only: [:create]
|
||||
before_action :find_video, only: [:update]
|
||||
before_action :teacher_allowed
|
||||
|
||||
def create
|
||||
title = params[:name].strip
|
||||
link = params[:link].strip
|
||||
course_second_category_id = params[:category_id] || 0
|
||||
@course.course_videos.create!(title: title, link: link, is_link: 1, user_id: current_user.id, course_second_category_id: course_second_category_id)
|
||||
render_ok
|
||||
end
|
||||
|
||||
def update
|
||||
title = params[:name].strip
|
||||
link = params[:link].strip
|
||||
@video.update!(title: title, link: link)
|
||||
render_ok
|
||||
end
|
||||
|
||||
private
|
||||
|
||||
def validate_params
|
||||
tip_exception("视频名称不能为空") if params[:name].blank?
|
||||
tip_exception("链接地址不能为空") if params[:link].blank?
|
||||
end
|
||||
|
||||
def find_video
|
||||
@video = CourseVideo.find params[:id]
|
||||
@course = @video.course
|
||||
end
|
||||
|
||||
end
|
||||
@ -1,4 +1,7 @@
|
||||
class CourseVideo < ApplicationRecord
|
||||
belongs_to :course
|
||||
belongs_to :video
|
||||
belongs_to :video, optional: true
|
||||
belongs_to :user, optional: true
|
||||
|
||||
validates :title, length: { maximum: 60, too_long: "不能超过60个字符" }
|
||||
end
|
||||
|
||||
@ -0,0 +1,8 @@
|
||||
json.course_module do
|
||||
json.id @course_module.id
|
||||
json.module_name @course_module.module_name
|
||||
json.module_type @course_module.module_type
|
||||
json.course_second_categories do
|
||||
json.array! @course_module.course_second_categories, :id, :name
|
||||
end
|
||||
end
|
||||
@ -1,3 +1,22 @@
|
||||
json.count @count
|
||||
json.videos @videos, partial: 'users/videos/video', as: :video
|
||||
json.course_id @course.id
|
||||
|
||||
json.videos @videos do |video|
|
||||
if video.is_link
|
||||
json.(video, :id, :title, :link, :user_id)
|
||||
|
||||
user = video.user
|
||||
json.user_name user&.real_name
|
||||
json.user_img url_to_avatar(user)
|
||||
json.user_login user&.login
|
||||
else
|
||||
json.partial! 'users/videos/video', locals: { video: video.video }
|
||||
end
|
||||
end
|
||||
|
||||
json.course_id @course.id
|
||||
if @category.present?
|
||||
json.category_id @category.id
|
||||
json.category_name @category.name
|
||||
end
|
||||
json.course_module_id @video_module&.id
|
||||
json.has_category @video_module.course_second_categories.size > 0
|
||||
@ -1,4 +1,4 @@
|
||||
json.(attendance, :name, :mode)
|
||||
json.(attendance, :id, :name, :mode)
|
||||
json.attendance_date attendance.attendance_date.strftime("%Y/%m/%d")
|
||||
json.start_time attendance.start_time.strftime("%H:%M")
|
||||
json.end_time attendance.end_time.strftime("%H:%M")
|
||||
|
||||
@ -0,0 +1,5 @@
|
||||
class AddCourseSecondCategoryIdToCourseVideos < ActiveRecord::Migration[5.2]
|
||||
def change
|
||||
add_column :course_videos, :course_second_category_id, :integer, index: true, default: 0
|
||||
end
|
||||
end
|
||||
@ -0,0 +1,5 @@
|
||||
class MigrateMemberAttendanceMode < ActiveRecord::Migration[5.2]
|
||||
def change
|
||||
CourseMemberAttendance.where(attendance_mode: 3).update_all(attendance_mode: 4)
|
||||
end
|
||||
end
|
||||
@ -0,0 +1,8 @@
|
||||
class AddLinkToCourseVideos < ActiveRecord::Migration[5.2]
|
||||
def change
|
||||
add_column :course_videos, :is_link, :boolean, default: 0
|
||||
add_column :course_videos, :title, :string
|
||||
add_column :course_videos, :link, :string
|
||||
add_column :course_videos, :user_id, :integer, index: true
|
||||
end
|
||||
end
|
||||
@ -0,0 +1,5 @@
|
||||
class AddLinkToAttachments < ActiveRecord::Migration[5.2]
|
||||
def change
|
||||
add_column :attachments, :link, :string
|
||||
end
|
||||
end
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 147 KiB |
File diff suppressed because one or more lines are too long
Binary file not shown.
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 394 KiB After Width: | Height: | Size: 404 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -0,0 +1,21 @@
|
||||
import Quill from "quill";
|
||||
const Inline = Quill.import('blots/inline');
|
||||
|
||||
export default class LinkBlot extends Inline {
|
||||
static create(value) {
|
||||
let node = super.create()
|
||||
let rs = value
|
||||
if (rs.indexOf('http://') < 0) {
|
||||
rs = 'http://' + rs
|
||||
}
|
||||
node.setAttribute('href', rs)
|
||||
node.setAttribute('target', '_blank')
|
||||
return node;
|
||||
}
|
||||
|
||||
static formats(node) {
|
||||
return node.getAttribute('href');
|
||||
}
|
||||
}
|
||||
LinkBlot.blotName = 'link'
|
||||
LinkBlot.tagName = 'a'
|
||||
@ -1,54 +0,0 @@
|
||||
/*
|
||||
* @Description: 重写图片
|
||||
* @Author: tangjiang
|
||||
* @Github:
|
||||
* @Date: 2019-12-16 15:50:45
|
||||
* @LastEditors: tangjiang
|
||||
* @LastEditTime: 2019-12-17 16:44:48
|
||||
*/
|
||||
import Quill from "quill";
|
||||
|
||||
const BlockEmbed = Quill.import('blots/block/embed');
|
||||
|
||||
export default class ImageBlot extends BlockEmbed {
|
||||
|
||||
static create(value) {
|
||||
|
||||
const node = super.create();
|
||||
|
||||
node.setAttribute('alt', value.alt);
|
||||
node.setAttribute('src', value.url);
|
||||
|
||||
if (value.width) {
|
||||
node.setAttribute('width', value.width);
|
||||
}
|
||||
if (value.height) {
|
||||
node.setAttribute('height', value.height);
|
||||
}
|
||||
// 宽度和高度都不存在时，
|
||||
if (!value.width && !value.height) {
|
||||
node.setAttribute('display', 'block');
|
||||
node.setAttribute('width', '100%');
|
||||
}
|
||||
// 给图片添加点击事件
|
||||
node.onclick = () => {
|
||||
value.onClick && value.onClick(value.url);
|
||||
}
|
||||
return node;
|
||||
}
|
||||
|
||||
static value (node) {
|
||||
|
||||
return {
|
||||
alt: node.getAttribute('alt'),
|
||||
url: node.getAttribute('src'),
|
||||
onclick: node.onclick,
|
||||
// width: node.width,
|
||||
// height: node.height,
|
||||
display: node.getAttribute('display')
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
ImageBlot.blotName = 'image';
|
||||
ImageBlot.tagName = 'img';
|
||||
@ -1,45 +0,0 @@
|
||||
/*
|
||||
* @Description:
|
||||
* @Author: tangjiang
|
||||
* @Github:
|
||||
* @Date: 2019-12-09 09:09:42
|
||||
* @LastEditors: tangjiang
|
||||
* @LastEditTime: 2019-12-18 08:46:20
|
||||
*/
|
||||
import 'quill/dist/quill.core.css'; // 核心样式
|
||||
import 'quill/dist/quill.snow.css'; // 有工具栏
|
||||
import 'quill/dist/quill.bubble.css'; // 无工具栏
|
||||
import 'katex/dist/katex.min.css'; // katex 表达式样式
|
||||
import React, { useState, useReducer, useEffect } from 'react';
|
||||
import useQuill from './useQuill';
|
||||
|
||||
function ReactQuill ({
|
||||
disallowColors, // 不可见时颜色
|
||||
placeholder, // 提示信息
|
||||
uploadImage, // 图片上传
|
||||
onChange, // 内容变化时
|
||||
options, // 配置信息
|
||||
value, // 显示的内容
|
||||
style,
|
||||
showUploadImage // 显示上传图片
|
||||
}) {
|
||||
|
||||
const [element, setElement] = useState(); // quill 渲染节点
|
||||
|
||||
useQuill({
|
||||
disallowColors,
|
||||
placeholder,
|
||||
uploadImage,
|
||||
onChange,
|
||||
options,
|
||||
value,
|
||||
showUploadImage,
|
||||
element
|
||||
});
|
||||
|
||||
return (
|
||||
<div className='react_quill_area' ref={setElement} style={style}/>
|
||||
);
|
||||
}
|
||||
|
||||
export default ReactQuill;
|
||||
@ -1,47 +0,0 @@
|
||||
function deepEqual (prev, current) {
|
||||
if (prev === current) { // 基本类型比较，值，类型都相同 或者同为 null or undefined
|
||||
return true;
|
||||
}
|
||||
|
||||
if ((!prev && current)
|
||||
|| (prev && !current)
|
||||
|| (!prev && !current)
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (Array.isArray(prev)) {
|
||||
if (!Array.isArray(current)) return false;
|
||||
if (prev.length !== current.length) return false;
|
||||
|
||||
for (let i = 0; i < prev.length; i++) {
|
||||
if (!deepEqual(current[i], prev[i])) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
if (typeof current === 'object') {
|
||||
if (typeof prev !== 'object') return false;
|
||||
const prevKeys = Object.keys(prev);
|
||||
const curKeys = Object.keys(current);
|
||||
|
||||
if (prevKeys.length !== curKeys.length) return false;
|
||||
|
||||
prevKeys.sort();
|
||||
curKeys.sort();
|
||||
|
||||
for (let i = 0; i < prevKeys.length; i++) {
|
||||
if (prevKeys[i] !== curKeys[i]) return false;
|
||||
const key = prevKeys[i];
|
||||
if (!deepEqual(prev[key], current[key])) return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
export default deepEqual;
|
||||
@ -1,26 +0,0 @@
|
||||
/*
|
||||
* @Description: 将多维数组转变成一维数组
|
||||
* @Author: tangjiang
|
||||
* @Github:
|
||||
* @Date: 2019-12-09 09:35:01
|
||||
* @LastEditors: tangjiang
|
||||
* @LastEditTime: 2019-12-16 11:36:22
|
||||
*/
|
||||
function flatten (array) {
|
||||
return flatten.rec(array, []);
|
||||
}
|
||||
|
||||
flatten.rec = function flatten (array, result) {
|
||||
|
||||
for (let item of array) {
|
||||
if (Array.isArray(item)) {
|
||||
flatten(item, result);
|
||||
} else {
|
||||
result.push(item);
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
export default flatten;
|
||||
@ -1,32 +0,0 @@
|
||||
#quill-toolbar{
|
||||
.quill-btn{
|
||||
vertical-align: middle;
|
||||
}
|
||||
.quill_image{
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
width: 28px;
|
||||
height: 24px;
|
||||
overflow: hidden;
|
||||
.image_input{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
.ql-image{
|
||||
position: relative;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.react_quill_area{
|
||||
.ql-toolbar:not(:last-child) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@ -1,13 +0,0 @@
|
||||
/*
|
||||
* @Description: 导出 ReactQuill
|
||||
* @Author: tangjiang
|
||||
* @Github:
|
||||
* @Date: 2019-12-09 09:08:24
|
||||
* @LastEditors: tangjiang
|
||||
* @LastEditTime: 2019-12-16 11:37:13
|
||||
*/
|
||||
import ReactQuill from './ReactQuill';
|
||||
import useQuill from './useQuill';
|
||||
|
||||
export default ReactQuill;
|
||||
export { useQuill };
|
||||
@ -1,27 +0,0 @@
|
||||
/*
|
||||
* @Description:
|
||||
* @Author: tangjiang
|
||||
* @Github:
|
||||
* @Date: 2019-12-12 19:48:55
|
||||
* @LastEditors: tangjiang
|
||||
* @LastEditTime: 2019-12-16 11:38:16
|
||||
*/
|
||||
import { useState, useEffect } from 'react';
|
||||
import deepEqual from './deepEqual';
|
||||
|
||||
function useDeepEqual (input) {
|
||||
|
||||
const [value, setValue] = useState(input);
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
if (!deepEqual(input, value)) {
|
||||
setValue(input)
|
||||
}
|
||||
|
||||
}, [input, value]);
|
||||
|
||||
return value;
|
||||
}
|
||||
|
||||
export default useDeepEqual;
|
||||
@ -1,148 +0,0 @@
|
||||
/*
|
||||
* @Description: 创建 reactQuill实例
|
||||
* @Author: tangjiang
|
||||
* @Github:
|
||||
* @Date: 2019-12-09 09:31:42
|
||||
* @LastEditors: tangjiang
|
||||
* @LastEditTime: 2019-12-17 20:42:05
|
||||
*/
|
||||
import Quill from 'quill'; // 导入quill
|
||||
import { useState, useEffect, useMemo } from 'react';
|
||||
import flatten from './flatten.js';
|
||||
import useDeepEqualMemo from './useDeepEqualMemo';
|
||||
import Katex from 'katex';
|
||||
import ImageBlot from './ImageBlot';
|
||||
import { fetchUploadImage } from '../../services/ojService.js';
|
||||
import { getImageUrl } from 'educoder'
|
||||
window.katex = Katex;
|
||||
|
||||
Quill.register(ImageBlot);
|
||||
|
||||
function useMountQuill ({
|
||||
element,
|
||||
options: passedOptions,
|
||||
uploadImage,
|
||||
showUploadImage,
|
||||
imgAttrs = {} // 指定图片的宽高属性
|
||||
}) {
|
||||
|
||||
// 是否引入 katex
|
||||
const [katexLoaded, setKatexLoaded] = useState(Boolean(window.katex))
|
||||
const [quill, setQuill] = useState(null);
|
||||
|
||||
const options = useDeepEqualMemo(passedOptions);
|
||||
console.log('use mount quill: ', passedOptions);
|
||||
|
||||
// 判断options中是否包含公式
|
||||
const requireKatex = useMemo(() => {
|
||||
return flatten(options.modules.toolbar).includes('formula');
|
||||
}, [options]);
|
||||
|
||||
// 加载katex
|
||||
useEffect(() => {
|
||||
if (!requireKatex) return;
|
||||
if (katexLoaded) return;
|
||||
|
||||
const interval = setInterval(() => {
|
||||
if (window.katex) {
|
||||
setKatexLoaded(true);
|
||||
clearInterval(interval);
|
||||
}
|
||||
});
|
||||
|
||||
return () => { // 定义回调清除定时器
|
||||
clearInterval(interval);
|
||||
}
|
||||
|
||||
}, [
|
||||
setKatexLoaded,
|
||||
katexLoaded,
|
||||
requireKatex
|
||||
]);
|
||||
|
||||
// 加载 quill
|
||||
useEffect(() => {
|
||||
if (!element) return;
|
||||
if (requireKatex && !katexLoaded) {
|
||||
element.innerHTML = `
|
||||
<div style="color: #ddd">
|
||||
Loading Katex...
|
||||
</div>
|
||||
`
|
||||
}
|
||||
// 清空内容
|
||||
element.innerHTML = '';
|
||||
console.log(element);
|
||||
// 创建 quill 节点
|
||||
const quillNode = document.createElement('div');
|
||||
element.appendChild(quillNode); // 将quill节点追回到 element 元素中
|
||||
|
||||
const quill = new Quill(element, options);
|
||||
setQuill(quill);
|
||||
// 加载上传图片功能
|
||||
if (typeof uploadImage === 'function') {
|
||||
quill.getModule('toolbar').addHandler('image', (e) => {
|
||||
// 创建type类型输入框加载本地图片
|
||||
const input = document.createElement('input');
|
||||
input.setAttribute('type', 'file');
|
||||
input.setAttribute('accept', 'image/*');
|
||||
input.click();
|
||||
|
||||
input.onchange = async (e) => {
|
||||
const file = input.files[0]; // 获取文件信息
|
||||
const formData = new FormData();
|
||||
formData.append('file', file);
|
||||
|
||||
// const reader = new FileReader();
|
||||
// reader.readAsDataURL(file);
|
||||
// console.log('文件信息===>>', reader);
|
||||
// reader.onload = function (e) {
|
||||
// debugger;
|
||||
// console.log('文件信息===>>', e.target.result);
|
||||
// const image = new Image();
|
||||
// image.src = e.target.result;
|
||||
|
||||
// image.onload = function () {
|
||||
// // file.width =
|
||||
// console.log(image.width, image.height);
|
||||
// }
|
||||
// }
|
||||
|
||||
const range = quill.getSelection(true);
|
||||
let fileUrl = ''; // 保存上传成功后图片的url
|
||||
// 上传文件
|
||||
const result = await fetchUploadImage(formData);
|
||||
// 获取上传图片的url
|
||||
if (result.data && result.data.id) {
|
||||
fileUrl = getImageUrl(`api/attachments/${result.data.id}`);
|
||||
}
|
||||
// 根据id获取文件路径
|
||||
const { width, height } = imgAttrs;
|
||||
// console.log('上传图片的url:', fileUrl);
|
||||
if (fileUrl) {
|
||||
quill.insertEmbed(range.index, 'image', {
|
||||
url: fileUrl,
|
||||
alt: '',
|
||||
onClick: showUploadImage,
|
||||
width,
|
||||
height
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return () => {
|
||||
element.innerHTML = '';
|
||||
}
|
||||
}, [
|
||||
element,
|
||||
options,
|
||||
requireKatex,
|
||||
katexLoaded,
|
||||
]);
|
||||
|
||||
return quill;
|
||||
}
|
||||
|
||||
export default useMountQuill;
|
||||
@ -1,60 +0,0 @@
|
||||
/*
|
||||
* @Description:
|
||||
* @Author: tangjiang
|
||||
* @Github:
|
||||
* @Date: 2019-12-09 09:09:50
|
||||
* @LastEditors: tangjiang
|
||||
* @LastEditTime: 2019-12-17 15:46:50
|
||||
*/
|
||||
import useQuillPlaceholder from './useQuillPlaceholder';
|
||||
import useQuillValueSync from './useQuillValueSync';
|
||||
import useQuillOnChange from './useQuillOnChange';
|
||||
import useMountQuill from './useMountQuill';
|
||||
import { useEffect } from 'react';
|
||||
|
||||
function useQuill ({
|
||||
disallowColors,
|
||||
placeholder,
|
||||
uploadImage,
|
||||
onChange,
|
||||
options,
|
||||
value,
|
||||
element,
|
||||
showUploadImage
|
||||
}) {
|
||||
|
||||
// 获取 quill 实例
|
||||
const quill = useMountQuill({
|
||||
element,
|
||||
options,
|
||||
uploadImage,
|
||||
showUploadImage
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (disallowColors && quill) {
|
||||
quill.clipboard.addMatcher(Node.ELEMENT_NODE, (node, delta) => {
|
||||
delta.ops = delta.ops.map(op => {
|
||||
if (op.attributes && op.attributes.color) {
|
||||
const { color, ...attributes } = op.attributes;
|
||||
return {
|
||||
...op,
|
||||
attributes
|
||||
}
|
||||
}
|
||||
return op;
|
||||
});
|
||||
return delta;
|
||||
});
|
||||
}
|
||||
}, [
|
||||
disallowColors,
|
||||
quill
|
||||
]);
|
||||
|
||||
useQuillPlaceholder(quill, placeholder);
|
||||
useQuillValueSync(quill, value);
|
||||
useQuillOnChange(quill, onChange);
|
||||
}
|
||||
|
||||
export default useQuill;
|
||||
@ -1,33 +0,0 @@
|
||||
/*
|
||||
* @Description:
|
||||
* @Author: tangjiang
|
||||
* @Github:
|
||||
* @Date: 2019-12-12 19:49:11
|
||||
* @LastEditors: tangjiang
|
||||
* @LastEditTime: 2019-12-16 11:39:27
|
||||
*/
|
||||
import { useEffect } from 'react';
|
||||
|
||||
function useQuillOnChange (quill, onChange) {
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
if (!quill) return;
|
||||
if (typeof onChange !== 'function') return;
|
||||
|
||||
let handler;
|
||||
|
||||
quill.on(
|
||||
'text-change',
|
||||
(handler = () => {
|
||||
onChange(quill.getContents()); // getContents: 检索编辑器内容
|
||||
})
|
||||
);
|
||||
|
||||
return () => {
|
||||
quill.off('text-change', handler);
|
||||
}
|
||||
}, [quill, onChange]);
|
||||
}
|
||||
|
||||
export default useQuillOnChange;
|
||||
@ -1,22 +0,0 @@
|
||||
/*
|
||||
* @Description:
|
||||
* @Author: tangjiang
|
||||
* @Github:
|
||||
* @Date: 2019-12-09 09:28:34
|
||||
* @LastEditors: tangjiang
|
||||
* @LastEditTime: 2019-12-16 11:39:48
|
||||
*/
|
||||
import { useEffect } from 'react'
|
||||
|
||||
function useQuillPlaceholder (
|
||||
quill,
|
||||
placeholder
|
||||
) {
|
||||
|
||||
useEffect(() => {
|
||||
if (!quill || !quill.root) return;
|
||||
quill.root.dataset.placeholder = placeholder;
|
||||
}, [quill, placeholder]);
|
||||
}
|
||||
|
||||
export default useQuillPlaceholder;
|
||||
@ -1,31 +0,0 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import deepEqual from './deepEqual.js'
|
||||
|
||||
function useQuillValueSync(quill, value) {
|
||||
const [selection, setSelection] = useState(null)
|
||||
|
||||
useEffect(() => {
|
||||
if (!quill) return
|
||||
|
||||
const previous = quill.getContents()
|
||||
const current = value
|
||||
|
||||
if (!deepEqual(previous, current)) {
|
||||
setSelection(quill.getSelection())
|
||||
if (typeof value === 'string') {
|
||||
quill.clipboard.dangerouslyPasteHTML(value, 'api')
|
||||
} else {
|
||||
quill.setContents(value)
|
||||
}
|
||||
}
|
||||
}, [quill, value, setSelection])
|
||||
|
||||
useEffect(() => {
|
||||
if (quill && selection) {
|
||||
quill.setSelection(selection)
|
||||
setSelection(null)
|
||||
}
|
||||
}, [quill, selection, setSelection])
|
||||
}
|
||||
|
||||
export default useQuillValueSync
|
||||
@ -0,0 +1,128 @@
|
||||
import React,{ Component } from "react";
|
||||
import { Radio , Modal } from 'antd';
|
||||
import './video.css';
|
||||
import axios from 'axios';
|
||||
class MoveBox extends Component{
|
||||
constructor(props){
|
||||
super(props);
|
||||
this.state={
|
||||
data:undefined,
|
||||
selectSubId:undefined
|
||||
}
|
||||
}
|
||||
|
||||
componentDidUpdate=(prevProps)=>{
|
||||
if(this.props.id && this.props.visible && this.props.id !== prevProps.id){
|
||||
this.getSubList(this.props.mainId);
|
||||
}
|
||||
}
|
||||
|
||||
getSubList=(id)=>{
|
||||
const url = `/course_modules/${id}.json`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
let list = result.data.course_module && result.data.course_module.course_second_categories;
|
||||
let defaultId = list.length>0 ? list[0].id : undefined;
|
||||
this.setState({
|
||||
data:result.data.course_module,
|
||||
selectSubId:defaultId
|
||||
})
|
||||
}
|
||||
}).catch(error=>{
|
||||
console.log(error);
|
||||
})
|
||||
}
|
||||
cancelMove=()=>{
|
||||
const { setMoveVisible } = this.props;
|
||||
setMoveVisible && setMoveVisible(false);
|
||||
}
|
||||
|
||||
// 选择子目录
|
||||
selectSub=(e)=>{
|
||||
this.setState({
|
||||
selectSubId:e.target.value
|
||||
})
|
||||
}
|
||||
|
||||
handleSubmit=()=>{
|
||||
const CourseId = this.props.match.params.coursesId;
|
||||
const { id } = this.props;
|
||||
const { selectSubId } = this.state;
|
||||
const url = `/courses/${CourseId}/move_to_category.json`;
|
||||
axios.post(url,{
|
||||
video_ids:[id],
|
||||
new_category_id:selectSubId
|
||||
}).then(result=>{
|
||||
if(result){
|
||||
const { setMoveVisible , successFunc , updataleftNavfun} = this.props;
|
||||
updataleftNavfun && updataleftNavfun();
|
||||
setMoveVisible && setMoveVisible(false);
|
||||
successFunc && successFunc();
|
||||
}
|
||||
}).catch(error=>{
|
||||
console.log(error);
|
||||
})
|
||||
}
|
||||
|
||||
render(){
|
||||
const { visible , id } = this.props;
|
||||
const { data , selectSubId } = this.state;
|
||||
|
||||
let list = data && data.course_second_categories && data.course_second_categories.length>0?data.course_second_categories:undefined;
|
||||
|
||||
return(
|
||||
<Modal
|
||||
visible={visible}
|
||||
width="560px"
|
||||
title={'移动到'}
|
||||
footer={null}
|
||||
closable={false}
|
||||
>
|
||||
<div>
|
||||
<style>
|
||||
{
|
||||
`
|
||||
.ant-radio-group.ant-radio-group-outline{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.ant-radio-wrapper{
|
||||
margin-bottom:5px;
|
||||
display:flex;
|
||||
}
|
||||
.ant-radio{
|
||||
margin-top:2px;
|
||||
}
|
||||
.ant-radio-group.ant-radio-group-outline span:last-child{
|
||||
max-height: 450px;
|
||||
display: block;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
}
|
||||
`
|
||||
}
|
||||
</style>
|
||||
<Radio.Group onChange={this.selectSub} value={selectSubId}>
|
||||
{
|
||||
list && list.map((item,key)=>{
|
||||
return(
|
||||
<Radio value={item.id} key={item.id}>
|
||||
{item.name}
|
||||
</Radio>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Radio.Group>
|
||||
<div className="clearfix mt30 edu-txt-center">
|
||||
<a onClick={this.cancelMove} className="task-btn mr30">取消</a>
|
||||
<a type="submit" onClick={this.handleSubmit} className="task-btn task-btn-orange">确定</a>
|
||||
</div>
|
||||
</div>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
}
|
||||
export default MoveBox;
|
||||
|
After Width: | Height: | Size: 68 KiB |
Loading…
Reference in new issue