Compare commits

...

70 Commits
v1.3 ... main

Author SHA1 Message Date
xxx
b49c73f338 版本号 2024-02-20 15:30:03 +08:00
xxx
6ccf595984 移除 web-vitals 2024-02-20 15:01:33 +08:00
xxx
7c0decf82a project name 2024-02-20 14:51:58 +08:00
xxx
97c5540d96 fixed: pnpm build报错 2024-02-20 14:48:56 +08:00
xxx
c94c5106e5 fixed: pnpm install之后运行报错bug 2024-02-20 14:40:36 +08:00
xxx
5670e23d27 移除xgplayer 2024-02-20 14:31:04 +08:00
unknown
65ed275964 学员添加编辑优化 2024-01-30 11:56:59 +08:00
unknown
015dc667cb 系统配置优化 2024-01-26 10:16:40 +08:00
unknown
6ecd1de62a 去除各资源选择器中上传资源的按钮 2024-01-25 10:14:01 +08:00
unknown
b257fa8e30 去除各资源选择器中上传资源的按钮 2024-01-25 10:11:17 +08:00
unknown
09d2051c19 跑马灯配置去除身份证号选择 2024-01-25 10:07:45 +08:00
unknown
1fc70f3494 系统配置文案优化 2024-01-25 10:04:03 +08:00
unknown
123c19126a 几个页面添加组件增加loading 2024-01-22 10:25:48 +08:00
unknown
40e1dd03ad 学员添加、编辑去除身份证号 2024-01-22 10:12:38 +08:00
unknown
6ed4d50006 视频上传增加限制 2024-01-09 11:10:51 +08:00
xxx
fbf95bbb66 移除hls.min.js文件 2024-01-08 16:13:04 +08:00
unknown
9534877350 上传视频最小化 2024-01-08 13:15:09 +08:00
unknown
7820448c0d 版本号添加 2024-01-08 12:19:34 +08:00
unknown
895385c4d7 线上课-学员第一次学习时间显示优化 2023-11-15 10:13:51 +08:00
unknown
46e9949ce0 首页学习时间不显示天 2023-11-15 10:01:46 +08:00
unknown
57e216fc07 首页文档跳转地址优化 2023-11-15 09:43:18 +08:00
unknown
1cf8b33a81 系统配置默认图片回显优化 2023-11-15 09:33:55 +08:00
unknown
0666d9a769 系统配置默认图片回显优化 2023-11-15 09:28:39 +08:00
xxx
5b124ca821 Merge branch 'fix/11131' into dev 2023-11-14 14:16:08 +08:00
unknown
54b47dc105 部门同步ldap后不显示新建部门按钮 2023-11-13 15:26:11 +08:00
unknown
3b3be12cac 学习详情明细宽度优化 2023-11-13 14:50:20 +08:00
xxx
e479ec7848 解决冲突 2023-11-13 14:39:52 +08:00
unknown
2b8e8777c7 系统角色权限优化组装 2023-11-13 14:38:11 +08:00
unknown
3d6ea85e41 学员;列表存储页码到url 2023-11-13 14:23:25 +08:00
unknown
d9850260e9 视频列表增加名称搜索 2023-11-13 14:20:49 +08:00
白书科技
da6fc9639f
!19 优化
Merge pull request !19 from 白书科技/fix/11131
2023-11-13 06:07:18 +00:00
白书科技
d2e28b9548
!18 优化
Merge pull request !18 from 白书科技/fix/1113
2023-11-13 06:06:26 +00:00
unknown
e12c13e5cd 学员学习列表第一次学习时间优化 2023-11-13 14:05:01 +08:00
unknown
b553659a95 学习详情明细优化 2023-11-13 12:00:35 +08:00
unknown
f69b432b12 学习详情明细优化 2023-11-13 11:58:58 +08:00
白书科技
d6a0d2bfec
!17 优化
Merge pull request !17 from 白书科技/fix/1108
2023-11-13 03:57:27 +00:00
白书科技
42f5d77e4f
!16 优化
Merge pull request !16 from 白书科技/fix/1101
2023-11-13 03:56:54 +00:00
白书科技
aa8e1d88aa
!15 优化
Merge pull request !15 from 白书科技/fix/1031
2023-11-13 03:56:19 +00:00
unknown
f7fe5e35f4 Merge branch 'fix/1101' into fix/1108 2023-11-08 16:18:48 +08:00
unknown
8013964441 资源选择器增加名称筛选 2023-11-08 16:11:09 +08:00
unknown
caf377eb1a 管理员新建、编辑优化 2023-11-01 17:04:38 +08:00
unknown
272e9a5d50 管理员新建、编辑优化 2023-11-01 17:03:48 +08:00
unknown
7d37329713 线上课编辑章节名时逻辑优化 2023-11-01 16:14:30 +08:00
unknown
e0bd169069 线上课课时拖动为父子级时取消 2023-10-31 15:46:52 +08:00
白书科技
d06214aec0
!14 优化
Merge pull request !14 from 白书科技/fix/1007
2023-10-07 09:51:13 +00:00
unknown
a8432cece7 系统权限控制 2023-10-07 17:48:58 +08:00
白书科技
c13bf7ef3c
!13 优化
Merge pull request !13 from 白书科技/fix/0926
2023-09-26 13:43:37 +00:00
unknown
a5d579d3e7 登陆页面水印 2023-09-26 21:42:18 +08:00
白书科技
61573f1891
!12 优化
Merge pull request !12 from 白书科技/fix/0925
2023-09-25 06:55:35 +00:00
unknown
295fe75b67 线上课编辑 2023-09-25 10:17:11 +08:00
xxx
ad0a6d7095 ldap配置优化 2023-09-24 16:04:05 +08:00
xxx
b2820232b9 去除ldap-附加用户dn配置 2023-09-24 16:00:40 +08:00
xxx
052ee5f9f8 fixed: 学员列表的部门展开导致部门进度查看失败c 2023-09-24 10:14:56 +08:00
白书科技
f07741892a
!11 优化
Merge pull request !11 from 白书科技/fix/0922
2023-09-24 00:46:58 +00:00
xxx
983b8c39bd 优化视频资源选择的分类总是加载 2023-09-24 08:23:43 +08:00
xxx
1fd4f20ab0 优化学员列表的部门 2023-09-23 21:33:54 +08:00
unknown
3459016134 部门、分类列表存储全局 2023-09-22 16:19:44 +08:00
xxx
fd77180c35 fixed: 批量导入学员返回数据未刷新 2023-09-22 15:41:28 +08:00
unknown
37b6d5b0ab Merge branch 'fix/0922' of https://gitee.com/playeduxyz/backend into fix/0922 2023-09-22 15:30:52 +08:00
unknown
dea6712bbd 部门学习进度学员导出优化 2023-09-22 15:30:37 +08:00
xxx
f554f13945 update 2023-09-22 15:23:34 +08:00
unknown
f0d21a80eb Merge branch 'fix/0922' of https://gitee.com/playeduxyz/backend into fix/0922 2023-09-22 15:23:01 +08:00
unknown
7d45a2ea17 部门学习进度学员导出优化 2023-09-22 15:22:28 +08:00
xxx
06ec74ab15 fixed: iconfont乱码 2023-09-22 15:20:00 +08:00
unknown
d6da505574 学员学习页面数据错误 2023-09-22 15:11:37 +08:00
unknown
f580bc5ac7 线上课列表、学员列表数据存储到url上 2023-09-22 15:04:22 +08:00
unknown
6715d8cf50 系统全局存储部门和分类 2023-09-22 14:51:22 +08:00
unknown
c1adb96a0a 系统全局存储部门和分类 2023-09-22 14:50:54 +08:00
xxx
36ab0200a0 新增LDAP的组织架构一键同步 2023-09-21 10:12:18 +08:00
xxx
5d5dc4dde6 左侧菜单权限 2023-09-21 10:02:06 +08:00
53 changed files with 1200 additions and 775 deletions

View File

@ -13,10 +13,5 @@
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
<script
crossorigin="anonymous"
integrity="sha512-oHrfR/z2wkuRuaHrdZ9NhoT/o/1kteub+QvmQgVzOKK7NTvIKQMvnY9+/RR0+eW311o4lAE/YzzLXXmP2XUvig=="
src="https://lib.baomitu.com/hls.js/1.1.4/hls.min.js"
></script>
</body>
</html>

View File

@ -1,7 +1,7 @@
{
"name": "frontend",
"private": true,
"version": "0.0.0",
"name": "playedu-admin-interface",
"private": false,
"version": "1.6.0",
"type": "module",
"scripts": {
"dev": "vite",
@ -14,6 +14,7 @@
"ahooks": "^3.7.6",
"antd": "^5.3.2",
"axios": "^1.3.4",
"dayjs": "^1.11.10",
"echarts": "^5.4.2",
"localforage": "^1.10.0",
"match-sorter": "^6.3.1",
@ -24,12 +25,11 @@
"react-router-dom": "^6.9.0",
"redux": "^4.2.1",
"sort-by": "^1.2.0",
"web-vitals": "^3.3.0",
"xlsx": "^0.18.5"
},
"devDependencies": {
"@types/react": "^18.0.28",
"@types/react-dom": "^18.0.11",
"@types/react": "^18.2.0",
"@types/react-dom": "^18.2.0",
"@vitejs/plugin-react-swc": "^3.0.0",
"less": "^4.1.3",
"rollup-plugin-gzip": "^3.1.0",

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -54,3 +54,7 @@ export function dropDiffClass(id: number, parent_id: number, ids: number[]) {
export function checkDestroy(id: number) {
return client.get(`/backend/v1/department/${id}/destroy`, {});
}
export function ldapSync() {
return client.post(`/backend/v1/department/ldap-sync`, {});
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 919 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 86 KiB

After

Width:  |  Height:  |  Size: 64 KiB

View File

@ -14,7 +14,7 @@ export const BackBartment = (props: PropInterface) => {
return (
<div className={styles["back-bar-box"]}>
<Button
style={{paddingLeft:0}}
style={{ paddingLeft: 0 }}
icon={<LeftOutlined />}
type="link"
danger

View File

@ -2,23 +2,41 @@ import React from "react";
import { Layout } from "antd";
import { Link } from "react-router-dom";
export const Footer: React.FC = () => {
interface PropInterface {
type?: string;
}
export const Footer: React.FC<PropInterface> = ({ type }) => {
return (
<Layout.Footer
style={{
width: "100%",
backgroundColor: "#F6F6F6",
background: type === "none" ? "none" : "#F6F6F6",
height: 166,
paddingTop: 80,
textAlign: "center",
}}
>
<Link to="https://playedu.xyz/" target="blank">
<Link
to="https://playedu.xyz/"
style={{
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
target="blank"
>
<i
style={{ fontSize: 30, color: "#cccccc" }}
className="iconfont icon-waterprint footer-icon"
onClick={() => {}}
></i>
<span
className="ml-5"
style={{ color: "#D7D7D7", fontSize: 12, marginTop: -5 }}
>
Version 1.6
</span>
</Link>
</Layout.Footer>
);

View File

@ -37,16 +37,16 @@ const items = [
<i className="iconfont icon-icon-category" />,
null,
null,
null
"resource-category-menu"
),
getItem(
"资源管理",
"resource",
<i className="iconfont icon-icon-file" />,
[
getItem("视频", "/videos", null, null, null, null),
getItem("图片", "/images", null, null, null, null),
getItem("课件", "/courseware", null, null, null, null),
getItem("视频", "/videos", null, null, null, "resource-menu"),
getItem("图片", "/images", null, null, null, "resource-menu"),
getItem("课件", "/courseware", null, null, null, "resource-menu"),
],
null,
null
@ -92,7 +92,6 @@ const items = [
"admin-user-index"
),
getItem("管理日志", "/system/adminlog", null, null, null, "admin-log"),
// getItem("角色配置", "/system/adminroles", null, null, null, null),
],
null,
null
@ -120,6 +119,7 @@ export const LeftMenu: React.FC = () => {
}
return [];
};
const openKeyMerge = (pathname: string): string[] => {
let newOpenKeys = hit(pathname);
for (let i = 0; i < openKeys.length; i++) {
@ -166,8 +166,14 @@ export const LeftMenu: React.FC = () => {
for (let i in items) {
let menuItem = items[i];
if (!menuItem.children) {
// 一级菜单不做权限控制
// 一级菜单=>没有子菜单&配置了权限
if (menuItem.children === null) {
if (
menuItem.permission !== null &&
typeof permissions[menuItem.permission] === "undefined"
) {
continue;
}
menus.push(menuItem);
continue;
}

View File

@ -6,8 +6,8 @@ interface PropInterface {
text: string;
p: string;
class: string;
icon: any;
onClick: () => void;
icon?: any;
onClick?: () => void;
disabled: any;
}
@ -30,7 +30,7 @@ export const PerButton = (props: PropInterface) => {
danger
icon={props.icon}
onClick={() => {
props.onClick();
props.onClick && props.onClick();
}}
disabled={props.disabled}
>
@ -43,7 +43,7 @@ export const PerButton = (props: PropInterface) => {
type={props.type}
icon={props.icon}
onClick={() => {
props.onClick();
props.onClick && props.onClick();
}}
disabled={props.disabled}
>

View File

@ -1,6 +1,6 @@
import { Tree } from "antd";
import { useState, useEffect } from "react";
import { resourceCategory } from "../../api/index";
import { useSelector } from "react-redux";
interface Option {
key: string | number;
@ -17,8 +17,10 @@ interface PropInterface {
export const TreeCategory = (props: PropInterface) => {
const [treeData, setTreeData] = useState<any>([]);
const [loading, setLoading] = useState<boolean>(true);
const [selectKey, setSelectKey] = useState<number[]>([]);
const resourceCategories = useSelector(
(state: any) => state.systemConfig.value.resourceCategories
);
useEffect(() => {
if (props.selected && props.selected.length > 0) {
@ -27,21 +29,17 @@ export const TreeCategory = (props: PropInterface) => {
}, [props.selected]);
useEffect(() => {
resourceCategory.resourceCategoryList().then((res: any) => {
const categories: CategoriesBoxModel = res.data.categories;
if (JSON.stringify(categories) !== "{}") {
const new_arr: Option[] = checkArr(categories, 0);
if (props.type === "no-cate") {
new_arr.unshift({
key: 0,
title: <span className="tree-title-elli"></span>,
});
}
setTreeData(new_arr);
if (JSON.stringify(resourceCategories) !== "{}") {
const new_arr: Option[] = checkArr(resourceCategories, 0);
if (props.type === "no-cate") {
new_arr.unshift({
key: 0,
title: <span className="tree-title-elli"></span>,
});
}
});
}, []);
setTreeData(new_arr);
}
}, [resourceCategories]);
const checkArr = (categories: CategoriesBoxModel, id: number) => {
const arr = [];

View File

@ -1,6 +1,7 @@
import { Button, Input, message, Tree } from "antd";
import { Tree } from "antd";
import { useState, useEffect } from "react";
import { department } from "../../api/index";
import { useSelector } from "react-redux";
interface Option {
key: string | number;
@ -9,19 +10,21 @@ interface Option {
}
interface PropInterface {
type: string;
text: string;
refresh: boolean;
showNum: boolean;
selected: any;
depUserCount?: KeyNumberObject;
userCount?: number;
onUpdate: (keys: any, title: any) => void;
}
export const TreeDepartment = (props: PropInterface) => {
const [treeData, setTreeData] = useState<any>([]);
const [loading, setLoading] = useState<boolean>(true);
const [selectKey, setSelectKey] = useState<number[]>([]);
const [userTotal, setUserTotal] = useState(0);
// 本地缓存
const localDepartments = useSelector(
(state: any) => state.systemConfig.value.departments
);
useEffect(() => {
if (props.selected && props.selected.length > 0) {
@ -30,32 +33,25 @@ export const TreeDepartment = (props: PropInterface) => {
}, [props.selected]);
useEffect(() => {
setLoading(true);
department.departmentList().then((res: any) => {
const departments: DepartmentsBoxModel = res.data.departments;
const departCount: DepIdsModel = res.data.dep_user_count;
setUserTotal(res.data.user_total);
if (JSON.stringify(departments) !== "{}") {
if (props.showNum) {
const new_arr: any[] = checkNewArr(departments, 0, departCount);
setTreeData(new_arr);
} else {
const new_arr: any[] = checkArr(departments, 0);
setTreeData(new_arr);
}
if (JSON.stringify(localDepartments) !== "{}") {
let data: any[] = [];
if (props.depUserCount) {
data = checkNewArr(localDepartments, 0, props.depUserCount);
} else {
const new_arr: Option[] = [
{
key: "",
title: "全部",
children: [],
},
];
setTreeData(new_arr);
data = checkArr(localDepartments, 0);
}
setLoading(false);
});
}, [props.refresh]);
setTreeData(data);
} else {
const data: Option[] = [
{
key: "",
title: "全部",
children: [],
},
];
setTreeData(data);
}
}, [localDepartments, props.depUserCount]);
const checkNewArr = (
departments: DepartmentsBoxModel,
@ -133,8 +129,10 @@ export const TreeDepartment = (props: PropInterface) => {
if (info) {
label = info.node.title.props.children;
}
props.onUpdate(selectedKeys, label);
setSelectKey(selectedKeys);
if (selectedKeys.length <= 1) {
props.onUpdate(selectedKeys, label);
setSelectKey(selectedKeys);
}
};
const onExpand = (selectedKeys: any, info: any) => {
@ -142,8 +140,10 @@ export const TreeDepartment = (props: PropInterface) => {
if (info) {
label = info.node.title.props.children;
}
props.onUpdate(selectedKeys, label);
setSelectKey(selectedKeys);
if (selectedKeys.length <= 1) {
props.onUpdate(selectedKeys, label);
setSelectKey(selectedKeys);
}
};
return (
@ -157,7 +157,7 @@ export const TreeDepartment = (props: PropInterface) => {
onClick={() => onSelect([], "")}
>
{props.text}
{props.showNum && userTotal ? "(" + userTotal + ")" : ""}
{props.showNum && props.userCount ? "(" + props.userCount + ")" : ""}
</div>
{treeData.length > 0 && (
<Tree

View File

@ -1,9 +1,9 @@
import { useEffect, useState } from "react";
import { Row, Col, Empty, Table, Spin } from "antd";
import { Row, Col, Empty, Table, Spin, Typography, Input, Button } from "antd";
import type { ColumnsType } from "antd/es/table";
import { resource } from "../../api";
import styles from "./index.module.less";
import { TreeCategory, UploadCoursewareButton } from "../../compenents";
import { TreeCategory } from "../../compenents";
interface VideoItem {
id: number;
@ -47,6 +47,7 @@ export const UploadCoursewareSub = (props: PropsInterface) => {
const [size, setSize] = useState(10);
const [total, setTotal] = useState(0);
const [selectedRowKeys, setSelectedRowKeys] = useState<any>([]);
const [title, setTitle] = useState("");
// 加载列表
useEffect(() => {
@ -70,7 +71,7 @@ export const UploadCoursewareSub = (props: PropsInterface) => {
size,
"",
"",
"",
title,
"WORD,EXCEL,PPT,PDF,TXT,RAR,ZIP",
categoryIds
)
@ -92,6 +93,7 @@ export const UploadCoursewareSub = (props: PropsInterface) => {
const resetVideoList = () => {
setPage(1);
setVideoList([]);
setTitle("");
setRefresh(!refresh);
};
@ -178,14 +180,37 @@ export const UploadCoursewareSub = (props: PropsInterface) => {
</Col>
<Col span={17}>
<Row style={{ marginBottom: 24, paddingLeft: 10 }}>
<Col span={24}>
<UploadCoursewareButton
categoryIds={category_ids}
onUpdate={() => {
resetVideoList();
}}
></UploadCoursewareButton>
</Col>
<div className="float-left j-b-flex">
<div className="d-flex"></div>
<div className="d-flex">
<div className="d-flex mr-24">
<Typography.Text></Typography.Text>
<Input
value={title}
onChange={(e) => {
setTitle(e.target.value);
}}
allowClear
style={{ width: 160 }}
placeholder="请输入名称关键字"
/>
</div>
<div className="d-flex">
<Button className="mr-16" onClick={resetVideoList}>
</Button>
<Button
type="primary"
onClick={() => {
setPage(1);
setRefresh(!refresh);
}}
>
</Button>
</div>
</div>
</div>
</Row>
{init && (
<div className="float-left text-center mt-30">

View File

@ -1,20 +1,8 @@
import { InboxOutlined } from "@ant-design/icons";
import {
Button,
Col,
message,
Modal,
Progress,
Row,
Table,
Tag,
Upload,
} from "antd";
import Dragger from "antd/es/upload/Dragger";
import { useRef, useState } from "react";
import { generateUUID, parseVideo } from "../../utils";
import { minioMergeVideo, minioUploadId } from "../../api/upload";
import { UploadChunk } from "../../js/minio-upload-chunk";
import { useEffect, useRef, useState } from "react";
import { useSelector } from "react-redux";
import { Button } from "antd";
import { useDispatch } from "react-redux";
import { uploadAction } from "../../store/user/loginUserSlice";
interface PropsInterface {
categoryIds: number[];
@ -22,200 +10,32 @@ interface PropsInterface {
}
export const UploadVideoButton = (props: PropsInterface) => {
const [showModal, setShowModal] = useState(false);
const localFileList = useRef<FileItem[]>([]);
const [fileList, setFileList] = useState<FileItem[]>([]);
const dispatch = useDispatch();
const uploadStatus = useSelector(
(state: any) => state.loginUser.value.uploadStatus
);
const getMinioUploadId = async () => {
let resp: any = await minioUploadId("mp4");
return resp.data;
};
const uploadProps = {
multiple: true,
beforeUpload: async (file: File) => {
if (file.type === "video/mp4") {
// 视频封面解析 || 视频时长解析
let videoInfo = await parseVideo(file);
// 添加到本地待上传
let data = await getMinioUploadId();
let run = new UploadChunk(file, data["upload_id"], data["filename"]);
let item: FileItem = {
id: generateUUID(),
file: file,
upload: {
handler: run,
progress: 0,
status: 0,
remark: "",
},
video: {
duration: videoInfo.duration,
poster: videoInfo.poster,
},
};
item.upload.handler.on("success", () => {
minioMergeVideo(
data["filename"],
data["upload_id"],
props.categoryIds.join(","),
item.file.name,
"mp4",
item.file.size,
item.video?.duration || 0,
item.video?.poster || ""
).then(() => {
item.upload.progress = 100;
item.upload.status = item.upload.handler.getUploadStatus();
setFileList([...localFileList.current]);
});
});
item.upload.handler.on("progress", (p: number) => {
item.upload.status = item.upload.handler.getUploadStatus();
item.upload.progress = p >= 100 ? 99 : p;
setFileList([...localFileList.current]);
});
item.upload.handler.on("error", (msg: string) => {
item.upload.status = item.upload.handler.getUploadStatus();
item.upload.remark = msg;
setFileList([...localFileList.current]);
});
item.upload.handler.start();
// 先插入到ref
localFileList.current.push(item);
// 再更新list
setFileList([...localFileList.current]);
} else {
message.error(`${file.name} 并不是 mp4 视频文件`);
}
return Upload.LIST_IGNORE;
},
};
const closeWin = () => {
if (fileList.length > 0) {
fileList.forEach((item) => {
if (item.upload.status !== 5 && item.upload.status !== 7) {
item.upload.handler.cancel();
}
});
useEffect(() => {
if (!uploadStatus) {
props.onUpdate();
}
props.onUpdate();
localFileList.current = [];
setFileList([]);
setShowModal(false);
};
}, [uploadStatus]);
return (
<>
<Button
type="primary"
onClick={() => {
setShowModal(true);
dispatch(
uploadAction({
uploadStatus: true,
uploadCateIds: props.categoryIds,
})
);
}}
>
</Button>
{showModal ? (
<Modal
width={800}
title="上传视频"
open={true}
onCancel={() => {
closeWin();
}}
maskClosable={false}
closable={false}
onOk={() => {
closeWin();
}}
okText="完成"
>
<Row gutter={[0, 10]}>
<Col span={24}>
<Dragger {...uploadProps}>
<p className="ant-upload-drag-icon">
<InboxOutlined />
</p>
<p className="ant-upload-text"></p>
<p className="ant-upload-hint">
/ mp4
</p>
</Dragger>
</Col>
<Col span={24}>
<Table
pagination={false}
rowKey="id"
columns={[
{
title: "视频",
dataIndex: "name",
key: "name",
render: (_, record) => <span>{record.file.name}</span>,
},
{
title: "大小",
dataIndex: "size",
key: "size",
render: (_, record) => (
<span>
{(record.file.size / 1024 / 1024).toFixed(2)}M
</span>
),
},
{
title: "进度",
dataIndex: "progress",
key: "progress",
render: (_, record: FileItem) => (
<>
{record.upload.status === 0 ? (
"等待上传"
) : (
<Progress
size="small"
steps={20}
percent={record.upload.progress}
/>
)}
</>
),
},
{
title: "操作",
key: "action",
render: (_, record) => (
<>
{record.upload.status === 5 ? (
<>
<Button
type="link"
size="small"
className="b-n-link c-red"
onClick={() => {
record.upload.handler.retry();
}}
>
.
</Button>
</>
) : null}
{record.upload.status === 7 ? (
<Tag color="success"></Tag>
) : null}
</>
),
},
]}
dataSource={fileList}
/>
</Col>
</Row>
</Modal>
) : null}
</>
);
};

View File

@ -0,0 +1,26 @@
.float-button {
width: auto;
height: 32px;
background: #ffffff;
box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.1);
border-radius: 16px;
box-sizing: border-box;
padding: 6px 8px;
display: flex;
align-items: center;
position: fixed;
right: 24px;
bottom: 20px;
z-index: 50;
cursor: pointer;
img {
width: 20px;
height: 20px;
}
span {
margin-left: 6px;
font-size: 12px;
font-weight: 400;
color: #ff4d4f;
}
}

View File

@ -0,0 +1,289 @@
import { InboxOutlined } from "@ant-design/icons";
import {
Button,
Col,
message,
Modal,
Progress,
Row,
Table,
Tag,
Upload,
} from "antd";
import Dragger from "antd/es/upload/Dragger";
import { useEffect, useRef, useState } from "react";
import { generateUUID, parseVideo } from "../../utils";
import styles from "./index.module.less";
import { minioMergeVideo, minioUploadId } from "../../api/upload";
import { UploadChunk } from "../../js/minio-upload-chunk";
import { useDispatch } from "react-redux";
import { useSelector } from "react-redux";
import { uploadAction } from "../../store/user/loginUserSlice";
import upIcon from "../../assets/images/commen/upload.png";
export const UploadVideoFloatButton = () => {
const dispatch = useDispatch();
const [showModal, setShowModal] = useState(false);
const localFileList = useRef<FileItem[]>([]);
const intervalId = useRef<number>();
const intervalId2 = useRef<number>();
const [successNum, setSuccessNum] = useState(0);
const [fileList, setFileList] = useState<FileItem[]>([]);
const uploadStatus = useSelector(
(state: any) => state.loginUser.value.uploadStatus
);
const categoryIds = useSelector(
(state: any) => state.loginUser.value.uploadCateIds
);
const getMinioUploadId = async () => {
let resp: any = await minioUploadId("mp4");
return resp.data;
};
useEffect(() => {
if (uploadStatus) {
setShowModal(true);
intervalId.current = setInterval(() => {
let num = localFileList.current.filter(
(it) => it.upload.status === 7
).length;
setSuccessNum(num);
}, 5000);
let timeDiv = document.createElement("div");
document.body.appendChild(timeDiv);
intervalId2.current = setInterval(() => {
timeDiv && timeDiv.click();
}, 10000);
} else {
window.clearInterval(intervalId.current);
window.clearInterval(intervalId2.current);
console.log("定时器已销毁");
}
}, [uploadStatus]);
const uploadProps = {
multiple: true,
beforeUpload: async (file: File, fileList: any) => {
if (file.size > 2 * 1024 * 1024 * 1024) {
message.error(`${file.name} 大小超过2G`);
return Upload.LIST_IGNORE;
}
if (fileList.length > 10) {
message.config({ maxCount: 1 });
message.error("单次最多上传10个视频");
return Upload.LIST_IGNORE;
} else {
message.config({ maxCount: 10 });
}
if (file.type === "video/mp4") {
// 视频封面解析 || 视频时长解析
let videoInfo = await parseVideo(file);
// 添加到本地待上传
let data = await getMinioUploadId();
let run = new UploadChunk(file, data["upload_id"], data["filename"]);
let item: FileItem = {
id: generateUUID(),
file: file,
upload: {
handler: run,
progress: 0,
status: 0,
remark: "",
},
video: {
duration: videoInfo.duration,
poster: videoInfo.poster,
},
};
item.upload.handler.on("success", () => {
minioMergeVideo(
data["filename"],
data["upload_id"],
categoryIds.join(","),
item.file.name,
"mp4",
item.file.size,
item.video?.duration || 0,
item.video?.poster || ""
).then(() => {
item.upload.progress = 100;
item.upload.status = item.upload.handler.getUploadStatus();
setFileList([...localFileList.current]);
});
});
item.upload.handler.on("progress", (p: number) => {
item.upload.status = item.upload.handler.getUploadStatus();
item.upload.progress = p >= 100 ? 99 : p;
setFileList([...localFileList.current]);
});
item.upload.handler.on("error", (msg: string) => {
item.upload.status = item.upload.handler.getUploadStatus();
item.upload.remark = msg;
setFileList([...localFileList.current]);
});
item.upload.handler.start();
// 先插入到ref
localFileList.current.push(item);
// 再更新list
setFileList([...localFileList.current]);
} else {
message.error(`${file.name} 并不是 mp4 视频文件`);
}
return Upload.LIST_IGNORE;
},
};
const closeWin = () => {
if (fileList.length > 0) {
fileList.forEach((item) => {
if (item.upload.status !== 5 && item.upload.status !== 7) {
item.upload.handler.cancel();
}
});
}
localFileList.current = [];
setFileList([]);
setSuccessNum(0);
setShowModal(false);
dispatch(
uploadAction({
uploadStatus: false,
uploadCateIds: [],
})
);
};
return (
<>
{uploadStatus ? (
<>
<div
style={{ display: showModal ? "none" : "flex" }}
className={styles["float-button"]}
onClick={() => setShowModal(true)}
>
<img src={upIcon} />
<span>
({successNum}/{fileList.length})
</span>
</div>
<Modal
width={800}
title="上传视频"
open={showModal}
maskClosable={false}
footer={null}
onCancel={() => {
closeWin();
}}
>
<Row gutter={[0, 10]}>
<Col span={24}>
<Dragger {...uploadProps}>
<p className="ant-upload-drag-icon">
<InboxOutlined />
</p>
<p className="ant-upload-text"></p>
<p className="ant-upload-hint">
/ 2G以内的mp4文件
</p>
</Dragger>
</Col>
<Col span={24}>
<Table
pagination={false}
rowKey="id"
columns={[
{
title: "视频",
dataIndex: "name",
key: "name",
render: (_, record) => <span>{record.file.name}</span>,
},
{
title: "大小",
dataIndex: "size",
key: "size",
render: (_, record) => (
<span>
{(record.file.size / 1024 / 1024).toFixed(2)}M
</span>
),
},
{
title: "进度",
dataIndex: "progress",
key: "progress",
render: (_, record: FileItem) => (
<>
{record.upload.status === 0 ? (
"等待上传"
) : (
<Progress
size="small"
steps={20}
percent={record.upload.progress}
/>
)}
</>
),
},
{
title: "操作",
key: "action",
render: (_, record) => (
<>
{record.upload.status === 5 ? (
<>
<Button
type="link"
size="small"
className="b-n-link c-red"
onClick={() => {
record.upload.handler.retry();
}}
>
.
</Button>
</>
) : null}
{record.upload.status === 7 ? (
<Tag color="success"></Tag>
) : null}
</>
),
},
]}
dataSource={fileList}
/>
</Col>
<Col span={24}>
<div className="r-r-flex">
<Button
type="primary"
onClick={() => {
closeWin();
}}
>
</Button>
<Button
type="default"
className="mr-16"
onClick={() => {
setShowModal(false);
}}
>
</Button>
</div>
</Col>
</Row>
</Modal>
</>
) : null}
</>
);
};

View File

@ -1,9 +1,8 @@
import { useEffect, useState } from "react";
import { Row, Col, Empty, Table, Spin } from "antd";
import { Row, Col, Empty, Table, Spin, Typography, Input, Button } from "antd";
import type { ColumnsType } from "antd/es/table";
import { resource } from "../../api";
import styles from "./index.module.less";
import { UploadVideoButton } from "../upload-video-button";
import { DurationText, TreeCategory } from "../../compenents";
interface VideoItem {
@ -48,6 +47,7 @@ export const UploadVideoSub = (props: PropsInterface) => {
const [size, setSize] = useState(10);
const [total, setTotal] = useState(0);
const [selectedRowKeys, setSelectedRowKeys] = useState<any>([]);
const [title, setTitle] = useState("");
// 加载列表
useEffect(() => {
@ -66,7 +66,7 @@ export const UploadVideoSub = (props: PropsInterface) => {
setLoading(true);
let categoryIds = category_ids.join(",");
resource
.resourceList(page, size, "", "", "", "VIDEO", categoryIds)
.resourceList(page, size, "", "", title, "VIDEO", categoryIds)
.then((res: any) => {
setTotal(res.data.result.total);
setVideoExtra(res.data.videos_extra);
@ -85,6 +85,7 @@ export const UploadVideoSub = (props: PropsInterface) => {
const resetVideoList = () => {
setPage(1);
setVideoList([]);
setTitle("");
setRefresh(!refresh);
};
@ -159,15 +160,7 @@ export const UploadVideoSub = (props: PropsInterface) => {
<>
<Row style={{ width: 752, minHeight: 520 }}>
<Col span={7}>
{init && (
<div className="float-left text-center mt-30">
<Spin></Spin>
</div>
)}
<div
className="float-left"
style={{ display: init ? "none" : "block" }}
>
<div className="float-left">
<TreeCategory
selected={[]}
type="no-cate"
@ -178,14 +171,37 @@ export const UploadVideoSub = (props: PropsInterface) => {
</Col>
<Col span={17}>
<Row style={{ marginBottom: 24, paddingLeft: 10 }}>
<Col span={24}>
<UploadVideoButton
categoryIds={category_ids}
onUpdate={() => {
resetVideoList();
}}
></UploadVideoButton>
</Col>
<div className="float-left j-b-flex">
<div className="d-flex"></div>
<div className="d-flex">
<div className="d-flex mr-24">
<Typography.Text></Typography.Text>
<Input
value={title}
onChange={(e) => {
setTitle(e.target.value);
}}
allowClear
style={{ width: 160 }}
placeholder="请输入名称关键字"
/>
</div>
<div className="d-flex">
<Button className="mr-16" onClick={resetVideoList}>
</Button>
<Button
type="primary"
onClick={() => {
setPage(1);
setRefresh(!refresh);
}}
>
</Button>
</div>
</div>
</div>
</Row>
{init && (
<div className="float-left text-center mt-30">

View File

@ -1,5 +1,3 @@
@import "./assets/iconfont/iconfont.css";
@primaryColor: #ff4d4f;
body {
@ -22,6 +20,10 @@ code {
monospace;
}
.w-100 {
width: 100%;
}
.w-174px {
max-width: 134px;
overflow: hidden;
@ -185,6 +187,11 @@ code {
align-items: center;
}
.r-r-flex {
display: flex;
flex-direction: row-reverse;
}
.flex-1 {
flex: 1;
}

View File

@ -1,7 +1,7 @@
import ReactDOM from "react-dom/client";
import "./assets/iconfont/iconfont.css";
import "./index.less";
import App from "./App";
import reportWebVitals from "./reportWebVitals";
import { BrowserRouter } from "react-router-dom";
import { Provider } from "react-redux";
import store from "./store";
@ -24,8 +24,3 @@ ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
</ConfigProvider>
</Provider>
);
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

View File

@ -10,6 +10,7 @@ import {
message,
Image,
TreeSelect,
Spin,
} from "antd";
import styles from "./create.module.less";
import { useSelector } from "react-redux";
@ -52,6 +53,7 @@ export const CourseCreate: React.FC<PropInterface> = ({
const defaultThumb2 = courseDefaultThumbs[1];
const defaultThumb3 = courseDefaultThumbs[2];
const [loading, setLoading] = useState(false);
const [init, setInit] = useState(true);
const [departments, setDepartments] = useState<Option[]>([]);
const [categories, setCategories] = useState<Option[]>([]);
const [thumb, setThumb] = useState("");
@ -71,9 +73,9 @@ export const CourseCreate: React.FC<PropInterface> = ({
const [attachments, setAttachments] = useState<number[]>([]);
useEffect(() => {
setInit(true);
if (open) {
getParams();
getCategory();
initData();
}
}, [open, cateIds, depIds]);
@ -96,43 +98,48 @@ export const CourseCreate: React.FC<PropInterface> = ({
setShowDrop(false);
}, [form, open]);
const getParams = () => {
department.departmentList().then((res: any) => {
const departments = res.data.departments;
const departCount: DepIdsModel = res.data.dep_user_count;
if (JSON.stringify(departments) !== "{}") {
const new_arr: any = checkArr(departments, 0, departCount);
setDepartments(new_arr);
}
let type = "open";
if (depIds.length !== 0 && depIds[0] !== 0) {
type = "elective";
let item = checkChild(res.data.departments, depIds[0]);
let arr: any[] = [];
if (item === undefined) {
arr.push(depIds[0]);
} else if (item.parent_chain === "") {
arr.push(depIds[0]);
} else {
let new_arr = item.parent_chain.split(",");
new_arr.map((num: any) => {
arr.push(Number(num));
});
arr.push(depIds[0]);
}
form.setFieldsValue({
dep_ids: arr,
});
const initData = async () => {
await getParams();
await getCategory();
setInit(false);
};
const getParams = async () => {
let res: any = await department.departmentList();
const departments = res.data.departments;
const departCount: DepIdsModel = res.data.dep_user_count;
if (JSON.stringify(departments) !== "{}") {
const new_arr: any = checkArr(departments, 0, departCount);
setDepartments(new_arr);
}
let type = "open";
if (depIds.length !== 0 && depIds[0] !== 0) {
type = "elective";
let item = checkChild(res.data.departments, depIds[0]);
let arr: any[] = [];
if (item === undefined) {
arr.push(depIds[0]);
} else if (item.parent_chain === "") {
arr.push(depIds[0]);
} else {
form.setFieldsValue({
dep_ids: depIds,
let new_arr = item.parent_chain.split(",");
new_arr.map((num: any) => {
arr.push(Number(num));
});
arr.push(depIds[0]);
}
form.setFieldsValue({
type: type,
dep_ids: arr,
});
setType(type);
} else {
form.setFieldsValue({
dep_ids: depIds,
});
}
form.setFieldsValue({
type: type,
});
setType(type);
};
const checkChild = (departments: any[], id: number) => {
@ -145,37 +152,36 @@ export const CourseCreate: React.FC<PropInterface> = ({
}
};
const getCategory = () => {
course.createCourse().then((res: any) => {
const categories = res.data.categories;
if (JSON.stringify(categories) !== "{}") {
const new_arr: any = checkArr(categories, 0, null);
setCategories(new_arr);
}
const getCategory = async () => {
let res: any = await course.createCourse();
const categories = res.data.categories;
if (JSON.stringify(categories) !== "{}") {
const new_arr: any = checkArr(categories, 0, null);
setCategories(new_arr);
}
if (cateIds.length !== 0 && cateIds[0] !== 0) {
let item = checkChild(res.data.categories, cateIds[0]);
let arr: any[] = [];
if (item === undefined) {
arr.push(cateIds[0]);
} else if (item.parent_chain === "") {
arr.push(cateIds[0]);
} else {
let new_arr = item.parent_chain.split(",");
new_arr.map((num: any) => {
arr.push(Number(num));
});
arr.push(cateIds[0]);
}
form.setFieldsValue({
category_ids: arr,
});
if (cateIds.length !== 0 && cateIds[0] !== 0) {
let item = checkChild(res.data.categories, cateIds[0]);
let arr: any[] = [];
if (item === undefined) {
arr.push(cateIds[0]);
} else if (item.parent_chain === "") {
arr.push(cateIds[0]);
} else {
form.setFieldsValue({
category_ids: cateIds,
let new_arr = item.parent_chain.split(",");
new_arr.map((num: any) => {
arr.push(Number(num));
});
arr.push(cateIds[0]);
}
});
form.setFieldsValue({
category_ids: arr,
});
} else {
form.setFieldsValue({
category_ids: cateIds,
});
}
};
const getNewTitle = (title: any, id: number, counts: any) => {
@ -330,6 +336,10 @@ export const CourseCreate: React.FC<PropInterface> = ({
});
} else {
setChapterType(e.target.value);
setChapters([]);
setHours([]);
setChapterHours([]);
setTreeData([]);
}
};
@ -499,7 +509,15 @@ export const CourseCreate: React.FC<PropInterface> = ({
}
width={634}
>
<div className="float-left mt-24">
{init && (
<div className="float-left text-center mt-30">
<Spin></Spin>
</div>
)}
<div
className="float-left mt-24"
style={{ display: init ? "none" : "block" }}
>
<SelectResource
defaultKeys={
chapterType == 0 ? hours : changeChapterHours(chapterHours)

View File

@ -234,7 +234,7 @@ export const CourseHourUpdate: React.FC<PropInterface> = ({
const arr = [...chapters];
if (arr[index].id) {
courseChapter
.updateCourseChapter(id, Number(arr[index].id), value, arr.length)
.updateCourseChapter(id, Number(arr[index].id), value, index + 1)
.then((res: any) => {
console.log("ok");
getDetail();

View File

@ -65,6 +65,7 @@ export const TreeHours = (props: PropInterface) => {
}
props.onRemoveItem(id);
};
const onDrop: TreeProps["onDrop"] = (info) => {
const dropKey = info.node.key;
const dragKey = info.dragNode.key;
@ -96,23 +97,35 @@ export const TreeHours = (props: PropInterface) => {
// Find dragObject
let dragObj: DataNode;
loop(data, dragKey, (item, index, arr) => {
arr.splice(index, 1);
dragObj = item;
});
let dragLength = (info.dragNode as any).props.pos.split("-").length;
let dropLength = (info.node as any).props.pos.split("-").length;
if (!info.dropToGap) {
// Drop on the content
loop(data, dropKey, (item) => {
item.children = item.children || [];
// where to insert 示例添加到头部,可以是随意位置
item.children.unshift(dragObj);
});
if (
(dropPosition == 0 && dropPos.length == 3) ||
(dropPosition == 0 && dropPos.length == 2 && dragLength == 2)
) {
} else {
loop(data, dragKey, (item, index, arr) => {
arr.splice(index, 1);
dragObj = item;
});
loop(data, dropKey, (item) => {
item.children = item.children || [];
// where to insert 示例添加到头部,可以是随意位置
item.children.unshift(dragObj);
});
}
} else if (
((info.node as any).props.children || []).length > 0 && // Has children
(info.node as any).props.expanded && // Is expanded
dropPosition === 1 // On the bottom gap
) {
loop(data, dragKey, (item, index, arr) => {
arr.splice(index, 1);
dragObj = item;
});
loop(data, dropKey, (item) => {
item.children = item.children || [];
// where to insert 示例添加到头部,可以是随意位置
@ -121,6 +134,16 @@ export const TreeHours = (props: PropInterface) => {
// item to the tail of the children
});
} else {
if (
(dragLength == 3 && dropLength == 2) ||
(dragLength == 2 && dropLength == 3)
) {
return;
}
loop(data, dragKey, (item, index, arr) => {
arr.splice(index, 1);
dragObj = item;
});
let ar: DataNode[] = [];
let i: number;
loop(data, dropKey, (_item, index, arr) => {

View File

@ -103,7 +103,6 @@ export const CourseUpdate: React.FC<PropInterface> = ({
setType(type);
setThumb(res.data.course.thumb);
setInit(false);
console.log(dayjs(res.data.course.published_at, "YYYY-MM-DD HH:mm:ss"));
});
};

View File

@ -20,7 +20,7 @@ import {
import type { MenuProps } from "antd";
import type { ColumnsType } from "antd/es/table";
import { dateFormat } from "../../utils/index";
import { useNavigate, useLocation } from "react-router-dom";
import { useNavigate, useLocation, useSearchParams } from "react-router-dom";
import { TreeDepartment, TreeCategory, PerButton } from "../../compenents";
import type { TabsProps } from "antd";
import { CourseCreate } from "./compenents/create";
@ -42,17 +42,30 @@ interface DataType {
title: string;
}
interface LocalSearchParamsInterface {
page?: number;
size?: number;
title?: string;
}
const CoursePage = () => {
const result = new URLSearchParams(useLocation().search);
const [searchParams, setSearchParams] = useSearchParams({
page: "1",
size: "10",
title: "",
});
const page = parseInt(searchParams.get("page") || "1");
const size = parseInt(searchParams.get("size") || "10");
const title = searchParams.get("title");
const navigate = useNavigate();
const [list, setList] = useState<DataType[]>([]);
const [refresh, setRefresh] = useState(false);
const [page, setPage] = useState(1);
const [size, setSize] = useState(10);
const [total, setTotal] = useState(0);
const [refresh, setRefresh] = useState(false);
const [loading, setLoading] = useState(true);
const [category_ids, setCategoryIds] = useState<number[]>([]);
const [title, setTitle] = useState("");
const [dep_ids, setDepIds] = useState<number[]>([]);
const [selLabel, setLabel] = useState<string>(
result.get("label") ? String(result.get("label")) : "全部分类"
@ -105,7 +118,9 @@ const CoursePage = () => {
type=""
text={"分类"}
onUpdate={(keys: any, title: any) => {
setPage(1);
resetLocalSearchParams({
page: 1,
});
setCategoryIds(keys);
if (typeof title === "string") {
setLabel(title);
@ -124,12 +139,12 @@ const CoursePage = () => {
<div className="float-left">
<TreeDepartment
selected={dep_ids}
refresh={refresh}
showNum={false}
type="no-course"
text={"部门"}
onUpdate={(keys: any, title: any) => {
setPage(1);
resetLocalSearchParams({
page: 1,
});
setDepIds(keys);
setDepLabel(title);
}}
@ -346,7 +361,7 @@ const CoursePage = () => {
depIds = dep_ids.join(",");
}
course
.courseList(page, size, "", "", title, depIds, categoryIds)
.courseList(page, size, "", "", title ? title : "", depIds, categoryIds)
.then((res: any) => {
setTotal(res.data.total);
setList(res.data.data);
@ -362,10 +377,12 @@ const CoursePage = () => {
};
// 重置列表
const resetList = () => {
setPage(1);
setSize(10);
resetLocalSearchParams({
page: 1,
size: 10,
title: "",
});
setList([]);
setTitle("");
setRefresh(!refresh);
};
@ -379,8 +396,28 @@ const CoursePage = () => {
};
const handlePageChange = (page: number, pageSize: number) => {
setPage(page);
setSize(pageSize);
resetLocalSearchParams({
page: page,
size: pageSize,
});
};
const resetLocalSearchParams = (params: LocalSearchParamsInterface) => {
setSearchParams(
(prev) => {
if (typeof params.title !== "undefined") {
prev.set("title", params.title);
}
if (typeof params.page !== "undefined") {
prev.set("page", params.page + "");
}
if (typeof params.size !== "undefined") {
prev.set("size", params.size + "");
}
return prev;
},
{ replace: true }
);
};
const onChange = (key: string) => {
@ -419,9 +456,11 @@ const CoursePage = () => {
<div className="d-flex mr-24">
<Typography.Text></Typography.Text>
<Input
value={title}
value={title || ""}
onChange={(e) => {
setTitle(e.target.value);
resetLocalSearchParams({
title: e.target.value,
});
}}
allowClear
style={{ width: 160 }}
@ -435,7 +474,9 @@ const CoursePage = () => {
<Button
type="primary"
onClick={() => {
setPage(1);
resetLocalSearchParams({
page: 1,
});
setRefresh(!refresh);
}}
>

View File

@ -60,6 +60,22 @@ type HourCountModel = {
[key: number]: string;
};
type PerCourseRecordsModel = {
[key: number]: {
course_id: number;
created_at: string;
finished_at: string;
finished_duration: number;
hour_id: number;
id: number;
is_finished: number;
real_duration: number;
total_duration: number;
updated_at: string;
user_id: number;
};
};
const CourseUserPage = () => {
const params = useParams();
const result = new URLSearchParams(useLocation().search);
@ -69,6 +85,7 @@ const CourseUserPage = () => {
const [hourCount, setHourCount] = useState<HourCountModel>({});
const [userDepIds, setUserDepIds] = useState<DepIdsModel>({});
const [departments, setDepartments] = useState<DepartmentsModel>({});
const [perRecords, setPerRecords] = useState<PerCourseRecordsModel>({});
const [refresh, setRefresh] = useState(false);
const [page, setPage] = useState(1);
const [size, setSize] = useState(10);
@ -135,8 +152,8 @@ const CourseUserPage = () => {
dataIndex: "created_at",
render: (_, record: any) => (
<>
{records[record.id] ? (
<span>{dateFormat(records[record.id].created_at)}</span>
{perRecords[record.id] ? (
<span>{dateFormat(perRecords[record.id].created_at)}</span>
) : hourCount[record.id] ? (
<span>{dateFormat(hourCount[record.id])}</span>
) : (
@ -150,7 +167,7 @@ const CourseUserPage = () => {
dataIndex: "id",
render: (_, record: any) => (
<>
{records[record.id] ? (
{records[record.id] && records[record.id].finished_at ? (
<span>{dateFormat(String(records[record.id].finished_at))}</span>
) : (
<span>-</span>
@ -213,6 +230,7 @@ const CourseUserPage = () => {
setList(res.data.data);
setHourCount(res.data.user_course_hour_user_first_at);
setRecords(res.data.user_course_records);
setPerRecords(res.data.per_user_earliest_records);
setCourse(res.data.course);
setDepartments(res.data.departments);
setUserDepIds(res.data.user_dep_ids);

View File

@ -558,7 +558,7 @@ const DashboardPage = () => {
<div className={styles["usage-guide"]}>
<img className={styles["banner"]} src={banner} alt="" />
<Link
to="https://www.playedu.xyz/docs/docs/guide/"
to="https://www.playedu.xyz/book/opensource-handbook/article/wFymJ4SXcX"
target="blank"
className={styles["link"]}
>

View File

@ -1,5 +1,5 @@
import React, { useState, useRef, useEffect } from "react";
import { Modal, Form, Input, Cascader, message } from "antd";
import { Modal, Form, Input, Cascader, message, Spin } from "antd";
import styles from "./create.module.less";
import { department } from "../../../api/index";
@ -19,11 +19,13 @@ export const DepartmentCreate: React.FC<PropInterface> = ({
onCancel,
}) => {
const [form] = Form.useForm();
const [init, setInit] = useState(true);
const [loading, setLoading] = useState(false);
const [departments, setDepartments] = useState<any>([]);
const [parent_id, setParentId] = useState<number>(0);
useEffect(() => {
setInit(true);
if (open) {
getParams();
}
@ -54,6 +56,7 @@ export const DepartmentCreate: React.FC<PropInterface> = ({
});
setDepartments(new_arr);
}
setInit(false);
});
};
@ -125,7 +128,15 @@ export const DepartmentCreate: React.FC<PropInterface> = ({
maskClosable={false}
okButtonProps={{ loading: loading }}
>
<div className="float-left mt-24">
{init && (
<div className="float-left text-center mt-30">
<Spin></Spin>
</div>
)}
<div
className="float-left mt-24"
style={{ display: init ? "none" : "block" }}
>
<Form
form={form}
name="basic"

View File

@ -8,7 +8,8 @@ import type { DataNode, TreeProps } from "antd/es/tree";
import { DepartmentCreate } from "./compenents/create";
import { DepartmentUpdate } from "./compenents/update";
import { useNavigate } from "react-router-dom";
import { useSelector } from "react-redux";
import { useSelector, useDispatch } from "react-redux";
import { saveDepartmentsAction } from "../../store/system/systemConfigSlice";
const { confirm } = Modal;
@ -19,6 +20,7 @@ interface Option {
}
const DepartmentPage = () => {
const dispatch = useDispatch();
const navigate = useNavigate();
const permissions = useSelector(
(state: any) => state.loginUser.value.permissions
@ -32,6 +34,8 @@ const DepartmentPage = () => {
const [updateVisible, setUpdateVisible] = useState(false);
const [did, setDid] = useState<number>(0);
const [modal, contextHolder] = Modal.useModal();
// 是否启用LDAP
const ldapEnabled = useSelector(
(state: any) => state.systemConfig.value["ldap-enabled"]
);
@ -55,6 +59,7 @@ const DepartmentPage = () => {
const getData = () => {
department.departmentList().then((res: any) => {
const departments: DepartmentsBoxModel = res.data.departments;
dispatch(saveDepartmentsAction(res.data.departments));
if (JSON.stringify(departments) !== "{}") {
const new_arr: Option[] = checkArr(departments, 0);
setTreeData(new_arr);
@ -389,24 +394,49 @@ const DepartmentPage = () => {
}
};
const ldapSync = () => {
if (loading) {
message.warning("正在同步,请稍后...");
return;
}
setLoading(true);
department.ldapSync().then(() => {
message.success("操作成功");
setLoading(false);
resetData();
});
};
return (
<>
{!ldapEnabled && (
{
<div className="playedu-main-top mb-24">
{contextHolder}
<div className="d-flex">
<PerButton
type="primary"
text="新建部门"
class="mr-16"
icon={<PlusOutlined />}
p="department-cud"
onClick={() => setCreateVisible(true)}
disabled={null}
/>
{ldapEnabled ? (
<PerButton
type="primary"
text="一键同步LDAP部门架构"
class="mr-16"
icon={null}
p="department-cud"
onClick={() => ldapSync()}
disabled={null}
/>
) : (
<PerButton
type="primary"
text="新建部门"
class="mr-16"
icon={<PlusOutlined />}
p="department-cud"
onClick={() => setCreateVisible(true)}
disabled={null}
/>
)}
</div>
</div>
)}
}
<div className="playedu-main-body">
{loading && (
<div className="float-left text-center mt-30">

View File

@ -5,6 +5,7 @@ import {
SystemConfigStoreInterface,
saveConfigAction,
} from "../../store/system/systemConfigSlice";
import { UploadVideoFloatButton } from "../../compenents/upload-video-float-button";
interface Props {
loginData?: any;
@ -27,6 +28,8 @@ const InitPage = (props: Props) => {
systemH5Url: props.configData["system.h5_url"],
memberDefaultAvatar: props.configData["member.default_avatar"],
courseDefaultThumbs: props.configData["default.course_thumbs"],
departments: props.configData["departments"],
resourceCategories: props.configData["resource_categories"],
};
dispatch(saveConfigAction(config));
}
@ -34,6 +37,7 @@ const InitPage = (props: Props) => {
return (
<>
<Outlet />
<UploadVideoFloatButton></UploadVideoFloatButton>
</>
);
};

View File

@ -13,6 +13,15 @@
height: 640px;
}
}
.footer-box {
width: 880px;
height: auto;
position: absolute;
top: 50%;
left: 50%;
margin-left: -440px;
margin-top: 280px;
}
.login-box {
width: 880px;
height: 560px;
@ -30,9 +39,11 @@
height: 100%;
box-sizing: border-box;
padding: 90px 10px 80px 30px;
display: flex;
align-items: center;
.icon {
width: 400px;
height: 400px;
height: auto;
}
}
.right-box {

View File

@ -13,6 +13,7 @@ import {
SystemConfigStoreInterface,
saveConfigAction,
} from "../../store/system/systemConfigSlice";
import { Footer } from "../../compenents/footer";
const LoginPage = () => {
const dispatch = useDispatch();
@ -67,6 +68,8 @@ const LoginPage = () => {
systemH5Url: res.data["system.h5_url"],
memberDefaultAvatar: res.data["member.default_avatar"],
courseDefaultThumbs: res.data["default.course_thumbs"],
departments: res.data["departments"],
resourceCategories: res.data["resource_categories"],
};
dispatch(saveConfigAction(data));
};
@ -124,6 +127,9 @@ const LoginPage = () => {
</div>
</div>
</div>
<div className={styles["footer-box"]}>
<Footer type="none"></Footer>
</div>
</div>
);
};

View File

@ -1,5 +1,5 @@
import React, { useState, useEffect } from "react";
import { Modal, Form, TreeSelect, Input, message } from "antd";
import { Modal, Form, TreeSelect, Input, message, Spin } from "antd";
import styles from "./create.module.less";
import { useSelector } from "react-redux";
import { user, department } from "../../../api/index";
@ -24,6 +24,7 @@ export const MemberCreate: React.FC<PropInterface> = ({
onCancel,
}) => {
const [form] = Form.useForm();
const [init, setInit] = useState(true);
const [loading, setLoading] = useState(false);
const [departments, setDepartments] = useState<any>([]);
const memberDefaultAvatar = useSelector(
@ -32,6 +33,7 @@ export const MemberCreate: React.FC<PropInterface> = ({
const [avatar, setAvatar] = useState<string>(memberDefaultAvatar);
useEffect(() => {
setInit(true);
if (open) {
getParams();
}
@ -56,6 +58,7 @@ export const MemberCreate: React.FC<PropInterface> = ({
const new_arr: Option[] = checkArr(departments, 0);
setDepartments(new_arr);
}
setInit(false);
});
};
@ -83,10 +86,10 @@ export const MemberCreate: React.FC<PropInterface> = ({
if (loading) {
return;
}
if (values.idCard !== "" && !ValidataCredentials(values.idCard)) {
message.error("请输入正确的身份证号!");
return;
}
// if (values.idCard !== "" && !ValidataCredentials(values.idCard)) {
// message.error("请输入正确的身份证号!");
// return;
// }
setLoading(true);
user
.storeUser(
@ -125,7 +128,15 @@ export const MemberCreate: React.FC<PropInterface> = ({
maskClosable={false}
okButtonProps={{ loading: loading }}
>
<div className="member-form float-left mt-24">
{init && (
<div className="float-left text-center mt-30">
<Spin></Spin>
</div>
)}
<div
className="float-left mt-24"
style={{ display: init ? "none" : "block" }}
>
<Form
form={form}
name="create-basic"
@ -203,13 +214,6 @@ export const MemberCreate: React.FC<PropInterface> = ({
placeholder="请选择学员所属部门"
/>
</Form.Item>
<Form.Item label="身份证号" name="idCard">
<Input
style={{ width: 274 }}
allowClear
placeholder="请填写学员身份证号"
/>
</Form.Item>
</Form>
</div>
</Modal>

View File

@ -59,7 +59,6 @@ export const MemberLearnProgressDialog: React.FC<PropInterface> = ({
{
title: "课时标题",
dataIndex: "title",
render: (title: string) => (
<>
<span>{title}</span>
@ -68,7 +67,6 @@ export const MemberLearnProgressDialog: React.FC<PropInterface> = ({
},
{
title: "总时长",
width: 120,
dataIndex: "duration",
render: (duration: number) => (
<>
@ -78,7 +76,6 @@ export const MemberLearnProgressDialog: React.FC<PropInterface> = ({
},
{
title: "已学习时长",
width: 120,
dataIndex: "finished_duration",
render: (_, record: any) => (
<>
@ -96,7 +93,6 @@ export const MemberLearnProgressDialog: React.FC<PropInterface> = ({
},
{
title: "是否学完",
width: 100,
dataIndex: "is_finished",
render: (_, record: any) => (
<>
@ -112,7 +108,6 @@ export const MemberLearnProgressDialog: React.FC<PropInterface> = ({
},
{
title: "开始时间",
width: 150,
dataIndex: "created_at",
render: (_, record: any) => (
<>
@ -126,7 +121,6 @@ export const MemberLearnProgressDialog: React.FC<PropInterface> = ({
},
{
title: "学完时间",
width: 150,
dataIndex: "finished_at",
render: (_, record: any) => (
<>
@ -142,7 +136,6 @@ export const MemberLearnProgressDialog: React.FC<PropInterface> = ({
title: "操作",
key: "action",
fixed: "right",
width: 70,
render: (_, record: any) => (
<>
{records && records[record.id] ? (
@ -222,7 +215,7 @@ export const MemberLearnProgressDialog: React.FC<PropInterface> = ({
maskClosable={false}
footer={null}
>
<div className="d-flex mt-24">
<div className="mt-24">
<PerButton
type="primary"
text="重置学习记录"
@ -235,10 +228,7 @@ export const MemberLearnProgressDialog: React.FC<PropInterface> = ({
disabled={null}
/>
</div>
<div
className="d-flex mt-24"
style={{ maxHeight: 800, overflowY: "auto" }}
>
<div className="mt-24" style={{ maxHeight: 800, overflowY: "auto" }}>
<Table
columns={column}
dataSource={list}

View File

@ -108,10 +108,10 @@ export const MemberUpdate: React.FC<PropInterface> = ({
if (loading) {
return;
}
if (values.idCard !== "" && !ValidataCredentials(values.idCard)) {
message.error("请输入正确的身份证号!");
return;
}
// if (values.idCard !== "" && !ValidataCredentials(values.idCard)) {
// message.error("请输入正确的身份证号!");
// return;
// }
setLoading(true);
user
.updateUser(
@ -239,13 +239,6 @@ export const MemberUpdate: React.FC<PropInterface> = ({
placeholder="请选择学员所属部门"
/>
</Form.Item>
<Form.Item label="身份证号" name="idCard">
<Input
allowClear
style={{ width: 274 }}
placeholder="请填写学员身份证号"
/>
</Form.Item>
</Form>
</div>
</Modal>

View File

@ -117,17 +117,17 @@ const MemberDepartmentProgressPage = () => {
setSize(pageSize);
};
const getTotalHours = (params: any) => {
if (params) {
let value = 0;
for (let key in params) {
value += params[key].hour_count;
}
return value;
} else {
return 0;
}
};
// const getTotalHours = (params: any) => {
// if (params) {
// let value = 0;
// for (let key in params) {
// value += params[key].hour_count;
// }
// return value;
// } else {
// return 0;
// }
// };
const getFinishedHours = (params: any) => {
if (params) {
@ -164,7 +164,17 @@ const MemberDepartmentProgressPage = () => {
let sheetName = "sheet1";
let data = [];
let arr = ["学员"];
courses.map((item: any) => {
let data2 = res.data.courses;
let arr2: any = [];
let value = 0;
for (let key in data2) {
arr2.push(data2[key]);
value += data2[key].class_hour;
}
let w_totalHour = value;
let w_courses = arr2;
let w_records = res.data.user_course_records;
w_courses.map((item: any) => {
arr.push(item.title);
});
arr.push("总计课时");
@ -172,21 +182,23 @@ const MemberDepartmentProgressPage = () => {
res.data.data.forEach((item: any) => {
let arr = [item.name];
courses.map((it: any) => {
if (records && records[item.id] && records[item.id][it.id]) {
if (records && records[item.id][it.id].is_finished === 1) {
w_courses.map((it: any) => {
if (w_records && w_records[item.id] && w_records[item.id][it.id]) {
if (w_records && w_records[item.id][it.id].is_finished === 1) {
arr.push("已学完");
} else {
arr.push(
records &&
records[item.id][it.id].finished_count + " / " + it.class_hour
w_records &&
w_records[item.id][it.id].finished_count +
" / " +
it.class_hour
);
}
} else {
arr.push(0 + " / " + it.class_hour);
}
});
arr.push(getFinishedHours(records[item.id]) + " / " + totalHour);
arr.push(getFinishedHours(w_records[item.id]) + " / " + w_totalHour);
data.push(arr);
});

View File

@ -20,7 +20,7 @@ import {
} from "@ant-design/icons";
import { user } from "../../api/index";
import { dateFormat } from "../../utils/index";
import { Link, Navigate, useLocation } from "react-router-dom";
import { Link, useLocation, useSearchParams } from "react-router-dom";
import { useSelector } from "react-redux";
import { TreeDepartment, PerButton } from "../../compenents";
import { MemberCreate } from "./compenents/create";
@ -46,17 +46,34 @@ interface DataType {
verify_at?: string;
}
interface LocalSearchParamsInterface {
page?: number;
size?: number;
nickname?: string;
email?: string;
}
const MemberPage = () => {
const result = new URLSearchParams(useLocation().search);
const [loading, setLoading] = useState(true);
const [page, setPage] = useState(1);
const [size, setSize] = useState(10);
const [searchParams, setSearchParams] = useSearchParams({
page: "1",
size: "10",
nickname: "",
email: "",
});
const page = parseInt(searchParams.get("page") || "1");
const size = parseInt(searchParams.get("size") || "10");
const nickname = searchParams.get("nickname");
const email = searchParams.get("email");
const [loading, setLoading] = useState(false);
const [list, setList] = useState<DataType[]>([]);
const [total, setTotal] = useState(0);
const [pureTotal, setPureTotal] = useState(0);
const [refresh, setRefresh] = useState(false);
const [depUserCount, setDepUserCount] = useState<KeyNumberObject>();
const [nickname, setNickname] = useState("");
const [email, setEmail] = useState("");
const [dep_ids, setDepIds] = useState<number[]>([]);
const [selLabel, setLabel] = useState<string>(
result.get("label") ? String(result.get("label")) : "全部部门"
@ -72,13 +89,13 @@ const MemberPage = () => {
);
useEffect(() => {
setDid(Number(result.get("did")));
if (Number(result.get("did"))) {
let arr = [];
arr.push(Number(result.get("did")));
setDepIds(arr);
if (result.get("refresh")) {
resetLocalSearchParams({
page: 1,
});
setRefresh(!refresh);
}
}, [result.get("did")]);
}, [result.get("refresh")]);
const columns: ColumnsType<DataType> = [
{
@ -211,30 +228,45 @@ const MemberPage = () => {
getData();
}, [refresh, page, size, dep_ids]);
useEffect(() => {
const handlePageBack = () => {
getData();
};
window.addEventListener("popstate", handlePageBack);
return () => {
window.removeEventListener("popstate", handlePageBack);
};
}, []);
const getData = () => {
let depIds = dep_ids.join(",");
if (loading) {
return;
}
setLoading(true);
user
.userList(page, size, {
name: nickname,
email: email,
id_card: "",
dep_ids: depIds,
dep_ids: dep_ids.join(","),
})
.then((res: any) => {
setList(res.data.data);
setDepartments(res.data.departments);
setUserDepIds(res.data.user_dep_ids);
setTotal(res.data.total);
setPureTotal(res.data.pure_total);
setDepUserCount(res.data.dep_user_count);
setLoading(false);
});
};
const resetData = () => {
setNickname("");
setEmail("");
setPage(1);
setSize(10);
resetLocalSearchParams({
page: 1,
size: 10,
nickname: "",
email: "",
});
setList([]);
setRefresh(!refresh);
};
@ -249,8 +281,31 @@ const MemberPage = () => {
};
const handlePageChange = (page: number, pageSize: number) => {
setPage(page);
setSize(pageSize);
resetLocalSearchParams({
page: page,
size: pageSize,
});
};
const resetLocalSearchParams = (params: LocalSearchParamsInterface) => {
setSearchParams(
(prev) => {
if (typeof params.nickname !== "undefined") {
prev.set("nickname", params.nickname);
}
if (typeof params.email !== "undefined") {
prev.set("email", params.email);
}
if (typeof params.page !== "undefined") {
prev.set("page", params.page + "");
}
if (typeof params.size !== "undefined") {
prev.set("size", params.size + "");
}
return prev;
},
{ replace: true }
);
};
const delUser = (id: number) => {
@ -282,12 +337,14 @@ const MemberPage = () => {
<div className="left-box">
<TreeDepartment
selected={dep_ids}
refresh={refresh}
showNum={true}
type=""
userCount={pureTotal}
depUserCount={depUserCount}
text={"部门"}
onUpdate={(keys: any, title: any) => {
setPage(1);
resetLocalSearchParams({
page: 1,
});
setDepIds(keys);
var index = title.indexOf("(");
if (index !== -1) {
@ -324,7 +381,6 @@ const MemberPage = () => {
class="mr-16"
icon={null}
p="user-store"
onClick={() => null}
disabled={null}
/>
</Link>
@ -340,9 +396,7 @@ const MemberPage = () => {
type="default"
text="部门学员进度"
class="mr-16"
icon={null}
p="department-user-learn"
onClick={() => null}
disabled={null}
/>
</Link>
@ -352,9 +406,11 @@ const MemberPage = () => {
<div className="d-flex mr-24">
<Typography.Text></Typography.Text>
<Input
value={nickname}
value={nickname || ""}
onChange={(e) => {
setNickname(e.target.value);
resetLocalSearchParams({
nickname: e.target.value,
});
}}
style={{ width: 160 }}
placeholder="请输入姓名关键字"
@ -364,9 +420,11 @@ const MemberPage = () => {
<div className="d-flex mr-24">
<Typography.Text></Typography.Text>
<Input
value={email}
value={email || ""}
onChange={(e) => {
setEmail(e.target.value);
resetLocalSearchParams({
email: e.target.value,
});
}}
style={{ width: 160 }}
placeholder="请输入邮箱账号"
@ -380,7 +438,9 @@ const MemberPage = () => {
<Button
type="primary"
onClick={() => {
setPage(1);
resetLocalSearchParams({
page: 1,
});
setRefresh(!refresh);
}}
>

View File

@ -57,6 +57,22 @@ type DepartmentsListModel = {
updated_at: string;
};
type PerCourseRecordsModel = {
[key: number]: {
course_id: number;
created_at: string;
finished_at: string;
finished_duration: number;
hour_id: number;
id: number;
is_finished: number;
real_duration: number;
total_duration: number;
updated_at: string;
user_id: number;
};
};
const MemberLearnPage = () => {
let chartRef = useRef(null);
const navigate = useNavigate();
@ -69,6 +85,7 @@ const MemberLearnPage = () => {
const [currentCourses, setCurrentCourses] = useState<DataType[]>([]);
const [openCourses, setOpenCourses] = useState<CourseModel[]>([]);
const [records, setRecords] = useState<UserCourseRecordsModel>({});
const [perRecords, setPerRecords] = useState<PerCourseRecordsModel>({});
const [hourCount, setHourCount] = useState<HourCountModel>({});
const [total2, setTotal2] = useState(0);
const [refresh2, setRefresh2] = useState(false);
@ -194,6 +211,7 @@ const MemberLearnPage = () => {
setOpenCourses(res.data.open_courses);
setHourCount(res.data.user_course_hour_count);
setRecords(res.data.user_course_records);
setPerRecords(res.data.per_course_earliest_records);
if (res.data.departments.length > 0) {
let box: OptionModel[] = [];
res.data.departments.map((item: any) => {
@ -247,8 +265,8 @@ const MemberLearnPage = () => {
dataIndex: "created_at",
render: (_, record: any) => (
<>
{records[record.id] ? (
<span>{dateFormat(records[record.id].created_at)}</span>
{perRecords[record.id] ? (
<span>{dateFormat(perRecords[record.id].created_at)}</span>
) : (
<span>-</span>
)}
@ -260,7 +278,7 @@ const MemberLearnPage = () => {
dataIndex: "finished_at",
render: (_, record: any) => (
<>
{records[record.id] ? (
{records[record.id] && records[record.id].finished_at ? (
<span>{dateFormat(String(records[record.id].finished_at))}</span>
) : (
<span>-</span>

View File

@ -1,5 +1,5 @@
import React, { useState, useRef, useEffect } from "react";
import { Modal, Form, Input, Cascader, message } from "antd";
import { Modal, Form, Input, Cascader, message, Spin } from "antd";
import styles from "./create.module.less";
import { resourceCategory } from "../../../../api/index";
@ -19,11 +19,13 @@ export const ResourceCategoryCreate: React.FC<PropInterface> = ({
onCancel,
}) => {
const [form] = Form.useForm();
const [init, setInit] = useState(true);
const [loading, setLoading] = useState(false);
const [categories, setCategories] = useState<any>([]);
const [parent_id, setParentId] = useState<number>(0);
useEffect(() => {
setInit(true);
if (open) {
getParams();
}
@ -54,6 +56,7 @@ export const ResourceCategoryCreate: React.FC<PropInterface> = ({
});
setCategories(new_arr);
}
setInit(false);
});
};
@ -125,7 +128,15 @@ export const ResourceCategoryCreate: React.FC<PropInterface> = ({
onCancel={() => onCancel()}
okButtonProps={{ loading: loading }}
>
<div className="float-left mt-24">
{init && (
<div className="float-left text-center mt-30">
<Spin></Spin>
</div>
)}
<div
className="float-left mt-24"
style={{ display: init ? "none" : "block" }}
>
<Form
form={form}
name="basic"

View File

@ -8,7 +8,8 @@ import type { DataNode, TreeProps } from "antd/es/tree";
import { ResourceCategoryCreate } from "./compenents/create";
import { ResourceCategoryUpdate } from "./compenents/update";
import { useNavigate } from "react-router-dom";
import { useSelector } from "react-redux";
import { useSelector, useDispatch } from "react-redux";
import { saveCategoriesAction } from "../../../store/system/systemConfigSlice";
const { confirm } = Modal;
@ -19,6 +20,7 @@ interface Option {
}
const ResourceCategoryPage = () => {
const dispatch = useDispatch();
const navigate = useNavigate();
const permissions = useSelector(
(state: any) => state.loginUser.value.permissions
@ -53,6 +55,7 @@ const ResourceCategoryPage = () => {
setLoading(true);
resourceCategory.resourceCategoryList().then((res: any) => {
const categories: CategoriesBoxModel = res.data.categories;
dispatch(saveCategoriesAction(res.data.categories));
if (JSON.stringify(categories) !== "{}") {
const new_arr: Option[] = checkArr(categories, 0);
setTreeData(new_arr);

View File

@ -1,5 +1,14 @@
import { useEffect, useState } from "react";
import { Modal, Table, message, Space, Dropdown, Button } from "antd";
import {
Modal,
Table,
message,
Space,
Dropdown,
Typography,
Input,
Button,
} from "antd";
import type { MenuProps } from "antd";
import { resource } from "../../../api";
import { useLocation } from "react-router-dom";
@ -63,6 +72,7 @@ const ResourceVideosPage = () => {
const [multiConfig, setMultiConfig] = useState(false);
const [updateId, setUpdateId] = useState(0);
const [playUrl, setPlayUrl] = useState("");
const [title, setTitle] = useState("");
useEffect(() => {
setCateId(Number(result.get("cid")));
@ -231,7 +241,7 @@ const ResourceVideosPage = () => {
setLoading(true);
let categoryIds = category_ids.join(",");
resource
.resourceList(page, size, "", "", "", "VIDEO", categoryIds)
.resourceList(page, size, "", "", title, "VIDEO", categoryIds)
.then((res: any) => {
setTotal(res.data.result.total);
setVideoList(res.data.result.data);
@ -250,6 +260,7 @@ const ResourceVideosPage = () => {
setSize(10);
setVideoList([]);
setSelectedRowKeys([]);
setTitle("");
setRefresh(!refresh);
};
@ -328,7 +339,34 @@ const ResourceVideosPage = () => {
</Button>
</div>
<div className="d-flex"></div>
<div className="d-flex">
<div className="d-flex mr-24">
<Typography.Text></Typography.Text>
<Input
value={title}
onChange={(e) => {
setTitle(e.target.value);
}}
allowClear
style={{ width: 160 }}
placeholder="请输入名称关键字"
/>
</div>
<div className="d-flex">
<Button className="mr-16" onClick={resetVideoList}>
</Button>
<Button
type="primary"
onClick={() => {
setPage(1);
setRefresh(!refresh);
}}
>
</Button>
</div>
</div>
</div>
<div className="float-left">
{multiConfig ? (

View File

@ -1,5 +1,5 @@
import React, { useState, useEffect } from "react";
import { Modal, Select, Switch, Form, Input, message } from "antd";
import { Modal, Select, Switch, Form, Input, message, Spin } from "antd";
import styles from "./create.module.less";
import { adminUser } from "../../../../api/index";
@ -22,10 +22,12 @@ export const SystemAdministratorCreate: React.FC<PropInterface> = ({
onCancel,
}) => {
const [form] = Form.useForm();
const [init, setInit] = useState(true);
const [loading, setLoading] = useState(false);
const [roles, setRoles] = useState<selRoleModel[]>([]);
useEffect(() => {
setInit(true);
if (open) {
getParams();
}
@ -56,6 +58,7 @@ export const SystemAdministratorCreate: React.FC<PropInterface> = ({
});
}
setRoles(arr);
setInit(false);
});
};
@ -110,7 +113,15 @@ export const SystemAdministratorCreate: React.FC<PropInterface> = ({
maskClosable={false}
okButtonProps={{ loading: loading }}
>
<div className="float-left mt-24">
{init && (
<div className="float-left text-center mt-30">
<Spin></Spin>
</div>
)}
<div
className="float-left mt-24"
style={{ display: init ? "none" : "block" }}
>
<Form
form={form}
name="basic"
@ -149,12 +160,12 @@ export const SystemAdministratorCreate: React.FC<PropInterface> = ({
<Form.Item
label="邮箱"
name="email"
rules={[{ required: true, message: "请输入员邮箱!" }]}
rules={[{ required: true, message: "请输入管理员邮箱!" }]}
>
<Input
allowClear
style={{ width: 200 }}
placeholder="请输入员邮箱"
placeholder="请输入管理员邮箱"
/>
</Form.Item>
<Form.Item

View File

@ -111,7 +111,7 @@ export const SystemAdministratorUpdate: React.FC<PropInterface> = ({
<>
{open ? (
<Modal
title="编辑管理员"
title="编辑管理员"
centered
forceRender
open={true}
@ -168,12 +168,12 @@ export const SystemAdministratorUpdate: React.FC<PropInterface> = ({
<Form.Item
label="邮箱"
name="email"
rules={[{ required: true, message: "请输入员邮箱!" }]}
rules={[{ required: true, message: "请输入管理员邮箱!" }]}
>
<Input
allowClear
style={{ width: 200 }}
placeholder="请输入员邮箱"
placeholder="请输入管理员邮箱"
/>
</Form.Item>
<Form.Item label="密码" name="password">

View File

@ -107,10 +107,10 @@ const SystemLogPage = () => {
render: (_, record: any) => <span>{record.title}</span>,
},
{
title: "IP地区",
title: "IP",
width: 250,
dataIndex: "ip_area",
render: (ip_area: string) => <span>{ip_area}</span>,
dataIndex: "ip",
render: (ip: string) => <span>{ip}</span>,
},
{
title: "时间",

View File

@ -1,5 +1,14 @@
import React, { useState, useEffect } from "react";
import { Drawer, TreeSelect, Space, Button, Form, Input, message } from "antd";
import {
Drawer,
TreeSelect,
Space,
Button,
Form,
Input,
message,
Spin,
} from "antd";
import styles from "./create.module.less";
import { adminRole } from "../../../../api/index";
@ -19,11 +28,13 @@ export const SystemAdminrolesCreate: React.FC<PropInterface> = ({
onCancel,
}) => {
const [form] = Form.useForm();
const [init, setInit] = useState(true);
const [loading, setLoading] = useState(false);
const [permissions, setPermissions] = useState<Option[]>([]);
const [actions, setActions] = useState<Option[]>([]);
useEffect(() => {
setInit(true);
if (open) {
getParams();
}
@ -39,89 +50,57 @@ export const SystemAdminrolesCreate: React.FC<PropInterface> = ({
const getParams = () => {
adminRole.createAdminRole().then((res: any) => {
const arr: Option[] = [
{
title: "学员",
value: "学员-n",
children: [],
},
{
title: "管理员",
value: "管理员-n",
children: [],
},
];
const arr2: Option[] = [
{
title: "学员",
value: "学员-n",
children: [],
},
{
title: "管理员",
value: "管理员-n",
children: [],
},
{
title: "管理员日志",
value: "管理员日志-n",
children: [],
},
{
title: "管理员角色",
value: "管理员角色-n",
children: [],
},
{
title: "线上课",
value: "线上课-n",
children: [],
},
{
title: "资源分类",
value: "资源分类-n",
children: [],
},
{
title: "部门",
value: "部门-n",
children: [],
},
{
title: "系统配置",
value: "系统配置-n",
children: [],
},
{
title: "其它",
value: "其它-n",
children: [],
},
];
const arr: any = [];
const arr2: any = [];
let actions = res.data.perm_action.action;
let permissions = res.data.perm_action.data;
for (let i = 0; i < permissions.length; i++) {
arr.map((item: any) => {
if (item.title === permissions[i].group_name) {
item.children.push({
title: permissions[i].name,
value: permissions[i].id,
});
}
});
const key = arr.findIndex(
(it: any) => it.title === permissions[i].group_name
);
if (key >= 0) {
arr[key].children.push({
title: permissions[i].name,
value: permissions[i].id,
});
} else {
arr.push({
title: permissions[i].group_name,
value: permissions[i].group_name + "-n",
children: [
{
title: permissions[i].name,
value: permissions[i].id,
},
],
});
}
}
for (let j = 0; j < actions.length; j++) {
arr2.map((item: any) => {
if (item.title === actions[j].group_name) {
item.children.push({
title: actions[j].name,
value: actions[j].id,
});
}
});
const key = arr2.findIndex(
(it: any) => it.title === actions[j].group_name
);
if (key >= 0) {
arr2[key].children.push({
title: actions[j].name,
value: actions[j].id,
});
} else {
arr2.push({
title: actions[j].group_name,
value: actions[j].group_name + "-n",
children: [
{
title: actions[j].name,
value: actions[j].id,
},
],
});
}
}
setPermissions(arr);
setActions(arr2);
setInit(false);
});
};
@ -181,7 +160,15 @@ export const SystemAdminrolesCreate: React.FC<PropInterface> = ({
}
width={634}
>
<div className="float-left mt-24">
{init && (
<div className="float-left text-center mt-30">
<Spin></Spin>
</div>
)}
<div
className="float-left mt-24"
style={{ display: init ? "none" : "block" }}
>
<Form
form={form}
name="adminroles-create"

View File

@ -53,86 +53,53 @@ export const SystemAdminrolesUpdate: React.FC<PropInterface> = ({
const getParams = () => {
adminRole.createAdminRole().then((res: any) => {
const arr: Option[] = [
{
title: "学员",
value: "学员-n",
children: [],
},
{
title: "管理员",
value: "管理员-n",
children: [],
},
];
const arr2: Option[] = [
{
title: "学员",
value: "学员-n",
children: [],
},
{
title: "管理员",
value: "管理员-n",
children: [],
},
{
title: "管理员日志",
value: "管理员日志-n",
children: [],
},
{
title: "管理员角色",
value: "管理员角色-n",
children: [],
},
{
title: "线上课",
value: "线上课-n",
children: [],
},
{
title: "资源分类",
value: "资源分类-n",
children: [],
},
{
title: "部门",
value: "部门-n",
children: [],
},
{
title: "系统配置",
value: "系统配置-n",
children: [],
},
{
title: "其它",
value: "其它-n",
children: [],
},
];
const arr: any = [];
const arr2: any = [];
let actions = res.data.perm_action.action;
let permissions = res.data.perm_action.data;
for (let i = 0; i < permissions.length; i++) {
arr.map((item: any) => {
if (item.title === permissions[i].group_name) {
item.children.push({
title: permissions[i].name,
value: permissions[i].id,
});
}
});
const key = arr.findIndex(
(it: any) => it.title === permissions[i].group_name
);
if (key >= 0) {
arr[key].children.push({
title: permissions[i].name,
value: permissions[i].id,
});
} else {
arr.push({
title: permissions[i].group_name,
value: permissions[i].group_name + "-n",
children: [
{
title: permissions[i].name,
value: permissions[i].id,
},
],
});
}
}
for (let j = 0; j < actions.length; j++) {
arr2.map((item: any) => {
if (item.title === actions[j].group_name) {
item.children.push({
title: actions[j].name,
value: actions[j].id,
});
}
});
const key = arr2.findIndex(
(it: any) => it.title === actions[j].group_name
);
if (key >= 0) {
arr2[key].children.push({
title: actions[j].name,
value: actions[j].id,
});
} else {
arr2.push({
title: actions[j].group_name,
value: actions[j].group_name + "-n",
children: [
{
title: actions[j].name,
value: actions[j].id,
},
],
});
}
}
setPermissions(arr);
setActions(arr2);

View File

@ -14,13 +14,14 @@ import {
} from "antd";
import { appConfig, system } from "../../../api/index";
import { UploadImageButton } from "../../../compenents";
import { useDispatch } from "react-redux";
import { useSelector, useDispatch } from "react-redux";
import type { TabsProps } from "antd";
import type { CheckboxChangeEvent } from "antd/es/checkbox";
import {
SystemConfigStoreInterface,
saveConfigAction,
} from "../../../store/system/systemConfigSlice";
import logoIcon from "../../../assets/logo.png";
const SystemConfigPage = () => {
const dispatch = useDispatch();
@ -33,6 +34,9 @@ const SystemConfigPage = () => {
const [nameChecked, setNameChecked] = useState(false);
const [emailChecked, setEmailChecked] = useState(false);
const [idCardchecked, setIdCardChecked] = useState(false);
const memberDefaultAvatar = useSelector(
(state: any) => state.systemConfig.value.memberDefaultAvatar
);
useEffect(() => {
getDetail();
@ -52,6 +56,8 @@ const SystemConfigPage = () => {
});
if (configData[i].key_value !== "") {
setLogo(configData[i].key_value);
} else {
setLogo(logoIcon);
}
} else if (configData[i].key_name === "system.api_url") {
form.setFieldsValue({
@ -122,7 +128,11 @@ const SystemConfigPage = () => {
"system.pc_index_footer_msg": configData[i].key_value,
});
} else if (configData[i].key_name === "member.default_avatar") {
setAvatar(configData[i].key_value);
if (configData[i].key_value !== "") {
setAvatar(configData[i].key_value);
} else {
setAvatar(memberDefaultAvatar);
}
form.setFieldsValue({
"member.default_avatar": configData[i].key_value,
});
@ -170,10 +180,6 @@ const SystemConfigPage = () => {
form.setFieldsValue({
"ldap.base_dn": configData[i].key_value,
});
} else if (configData[i].key_name === "ldap.user_dn_prefix") {
form.setFieldsValue({
"ldap.user_dn_prefix": configData[i].key_value,
});
}
}
});
@ -259,6 +265,8 @@ const SystemConfigPage = () => {
systemH5Url: res.data["system.h5_url"],
memberDefaultAvatar: res.data["member.default_avatar"],
courseDefaultThumbs: res.data["default.course_thumbs"],
departments: res.data["departments"],
resourceCategories: res.data["resource_categories"],
};
dispatch(saveConfigAction(data));
});
@ -294,9 +302,9 @@ const SystemConfigPage = () => {
{logo && (
<Form.Item
style={{ marginBottom: 30 }}
label="网站Logo"
label="PC学员端Logo"
name="system.logo"
labelCol={{ style: { marginTop: 4, marginLeft: 54 } }}
labelCol={{ style: { marginTop: 4, marginLeft: 24 } }}
>
<div className="d-flex">
<Image preview={false} height={40} src={logo} />
@ -318,7 +326,7 @@ const SystemConfigPage = () => {
{!logo && (
<Form.Item
style={{ marginBottom: 30 }}
label="网站Logo"
label="PC学员端Logo"
name="system.logo"
>
<div className="d-flex">
@ -346,38 +354,38 @@ const SystemConfigPage = () => {
</Form.Item>
<Form.Item
style={{ marginBottom: 30 }}
label="PC访问地址"
label="PC学员端地址"
name="system.pc_url"
>
<Input style={{ width: 274 }} placeholder="请填写PC访问地址" />
<Input style={{ width: 274 }} placeholder="请填写PC学员端地址" />
</Form.Item>
<Form.Item
style={{ marginBottom: 30 }}
label="H5访问地址"
label="H5学员端地址"
name="system.h5_url"
>
<Input style={{ width: 274 }} placeholder="请填写H5访问地址" />
<Input style={{ width: 274 }} placeholder="请填写H5学员端地址" />
</Form.Item>
<Form.Item
style={{ marginBottom: 30 }}
label="网站标题"
label="学员端标题"
name="system.name"
>
<Input
style={{ width: 274 }}
allowClear
placeholder="请填写网站标题"
placeholder="请填写学员端标题"
/>
</Form.Item>
<Form.Item
style={{ marginBottom: 30 }}
label="网站页脚"
label="学员端页脚"
name="system.pc_index_footer_msg"
>
<Input
style={{ width: 274 }}
allowClear
placeholder="请填写网站页脚"
placeholder="请填写学员端页脚"
/>
</Form.Item>
<Form.Item
@ -459,13 +467,6 @@ const SystemConfigPage = () => {
>
</Checkbox>
<Checkbox
checked={idCardchecked}
className="ml-24"
onChange={addIdCard}
>
</Checkbox>
</Space>
</Form.Item>
<Form.Item
@ -729,7 +730,7 @@ const SystemConfigPage = () => {
/>
</Form.Item>
<div className="helper-text">
LDAP的对外服务地址ldap.example.com
LDAP的对外服务地址ldap://ldap.example.com:389
</div>
</Space>
</Form.Item>
@ -763,21 +764,7 @@ const SystemConfigPage = () => {
placeholder="请填写基本DN"
/>
</Form.Item>
<div className="helper-text">LDAP根节点搜索用户</div>
</Space>
</Form.Item>
<Form.Item style={{ marginBottom: 30 }} label="附件用户DN">
<Space align="baseline" style={{ height: 32 }}>
<Form.Item name="ldap.user_dn_prefix">
<Input
style={{ width: 274 }}
allowClear
placeholder="请填写基本DN"
/>
</Form.Item>
<div className="helper-text">
DN的搜索范围限制
</div>
<div className="helper-text"></div>
</Space>
</Form.Item>
<Form.Item

4
src/playedu.d.ts vendored
View File

@ -1,4 +1,8 @@
declare global {
interface KeyNumberObject {
[key: number]: number;
}
interface FileItem {
id: string; //上传文件的唯一id
file: File; //上传的文件资源

View File

@ -1,15 +0,0 @@
import { ReportHandler } from 'web-vitals';
const reportWebVitals = (onPerfEntry?: ReportHandler) => {
if (onPerfEntry && onPerfEntry instanceof Function) {
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
getCLS(onPerfEntry);
getFID(onPerfEntry);
getFCP(onPerfEntry);
getLCP(onPerfEntry);
getTTFB(onPerfEntry);
});
}
};
export default reportWebVitals;

View File

@ -9,21 +9,32 @@ type SystemConfigStoreInterface = {
systemName?: string;
memberDefaultAvatar?: string;
courseDefaultThumbs?: string[];
departments?: any;
resourceCategories?: any;
};
let defaultValue: SystemConfigStoreInterface = {};
const systemConfigSlice = createSlice({
name: "systemConfig",
initialState: {
value: {},
value: defaultValue,
},
reducers: {
saveConfigAction(stage, e) {
stage.value = e.payload;
},
saveDepartmentsAction(stage, e) {
stage.value.departments = e.payload;
},
saveCategoriesAction(stage, e) {
stage.value.resourceCategories = e.payload;
},
},
});
export default systemConfigSlice.reducer;
export const { saveConfigAction } = systemConfigSlice.actions;
export const { saveConfigAction, saveDepartmentsAction, saveCategoriesAction } =
systemConfigSlice.actions;
export type { SystemConfigStoreInterface };

View File

@ -1,4 +1,5 @@
import { createSlice } from "@reduxjs/toolkit";
import { message } from "antd";
type UserInterface = {
id: number;
@ -10,12 +11,16 @@ type UserStoreInterface = {
user: UserInterface | null;
isLogin: boolean;
permissions: string[];
uploadStatus: boolean;
uploadCateIds: number[];
};
let defaultValue: UserStoreInterface = {
user: null,
isLogin: false,
permissions: [],
uploadStatus: false,
uploadCateIds: [],
};
const loginUserSlice = createSlice({
@ -33,10 +38,21 @@ const loginUserSlice = createSlice({
stage.value.user = null;
stage.value.isLogin = false;
},
uploadAction(stage, e) {
if (
stage.value.uploadStatus === true &&
e.payload.uploadStatus === true
) {
message.error("请点击右下角悬浮窗");
}
stage.value.uploadStatus = e.payload.uploadStatus;
stage.value.uploadCateIds = e.payload.uploadCateIds;
},
},
});
export default loginUserSlice.reducer;
export const { loginAction, logoutAction } = loginUserSlice.actions;
export const { loginAction, logoutAction, uploadAction } =
loginUserSlice.actions;
export type { UserStoreInterface };

View File

@ -24,22 +24,12 @@ export function timeFormat(dateStr: number) {
return "-";
}
var d = moment.duration(dateStr, "seconds");
let value =
Math.floor(d.asDays()) +
"天" +
d.hours() +
"时" +
d.minutes() +
"分" +
d.seconds() +
"秒";
let value = d.hours() + "时" + d.minutes() + "分" + d.seconds() + "秒";
if (Math.floor(d.asDays()) === 0) {
if (d.hours() === 0) {
value = d.minutes() + "分" + d.seconds() + "秒";
} else {
value = d.hours() + "时" + d.minutes() + "分" + d.seconds() + "秒";
}
if (d.hours() === 0) {
value = d.minutes() + "分" + d.seconds() + "秒";
} else {
value = d.hours() + "时" + d.minutes() + "分" + d.seconds() + "秒";
}
return value;