分类、部门删除关联跳转相关页面时选中

This commit is contained in:
禺狨 2023-06-09 11:03:04 +08:00
parent 2e7466cea7
commit 12cc5edbf6
10 changed files with 137 additions and 31 deletions

View File

@ -5,13 +5,13 @@ import { resourceCategory } from "../../api/index";
interface Option {
key: string | number;
title: any;
children?: Option[];
}
interface PropInterface {
type: string;
text: string;
selected: any;
onUpdate: (keys: any, title: any) => void;
}
@ -20,6 +20,12 @@ export const TreeCategory = (props: PropInterface) => {
const [loading, setLoading] = useState<boolean>(true);
const [selectKey, setSelectKey] = useState<any>([]);
useEffect(() => {
if (props.selected && props.selected.length > 0) {
setSelectKey(props.selected);
}
}, [props.selected]);
useEffect(() => {
resourceCategory.resourceCategoryList().then((res: any) => {
const categories = res.data.categories;

View File

@ -13,6 +13,7 @@ interface PropInterface {
text: string;
refresh: boolean;
showNum: boolean;
selected: any;
onUpdate: (keys: any, title: any) => void;
}
@ -22,6 +23,12 @@ export const TreeDepartment = (props: PropInterface) => {
const [selectKey, setSelectKey] = useState<any>([]);
const [userTotal, setUserTotal] = useState(0);
useEffect(() => {
if (props.selected && props.selected.length > 0) {
setSelectKey(props.selected);
}
}, [props.selected]);
useEffect(() => {
setLoading(true);
department.departmentList().then((res: any) => {

View File

@ -110,6 +110,7 @@ export const UploadImageButton = (props: PropsInterface) => {
<Row style={{ width: 752, minHeight: 520, marginTop: 24 }}>
<Col span={7}>
<TreeCategory
selected={category_ids}
type="no-cate"
text={"图片"}
onUpdate={(keys: any) => {

View File

@ -173,6 +173,7 @@ export const UploadVideoSub = (props: PropsInterface) => {
<Row style={{ width: 752, minHeight: 520 }}>
<Col span={7}>
<TreeCategory
selected={[]}
type="no-cate"
text={props.label}
onUpdate={(keys: any) => setCategoryIds(keys)}

View File

@ -21,7 +21,7 @@ import {
import type { MenuProps } from "antd";
import type { ColumnsType } from "antd/es/table";
import { dateFormat } from "../../utils/index";
import { useNavigate } from "react-router-dom";
import { useNavigate, useLocation } from "react-router-dom";
import { TreeDepartment, TreeCategory, PerButton } from "../../compenents";
import type { TabsProps } from "antd";
import { CourseCreate } from "./compenents/create";
@ -40,6 +40,7 @@ interface DataType {
}
const CoursePage = () => {
const result = new URLSearchParams(useLocation().search);
const navigate = useNavigate();
const [list, setList] = useState<any>([]);
const [refresh, setRefresh] = useState(false);
@ -50,18 +51,43 @@ const CoursePage = () => {
const [category_ids, setCategoryIds] = useState<any>([]);
const [title, setTitle] = useState<string>("");
const [dep_ids, setDepIds] = useState<any>([]);
const [selLabel, setLabel] = useState<string>("全部分类");
const [selDepLabel, setDepLabel] = useState<string>("全部部门");
const [selLabel, setLabel] = useState<string>(
result.get("label") ? String(result.get("label")) : "全部分类"
);
const [selDepLabel, setDepLabel] = useState<string>(
result.get("label") ? String(result.get("label")) : "全部部门"
);
const [course_category_ids, setCourseCategoryIds] = useState<any>({});
const [course_dep_ids, setCourseDepIds] = useState<any>({});
const [categories, setCategories] = useState<any>({});
const [departments, setDepartments] = useState<any>({});
const [tabKey, setTabKey] = useState(1);
const [tabKey, setTabKey] = useState(result.get("did") ? "2" : "1");
const [createVisible, setCreateVisible] = useState<boolean>(false);
const [updateVisible, setUpdateVisible] = useState<boolean>(false);
const [updateHourVisible, setHourUpdateVisible] = useState<boolean>(false);
const [cid, setCid] = useState<number>(0);
const [cateId, setCateId] = useState(Number(result.get("cid")));
const [did, setDid] = useState(Number(result.get("did")));
useEffect(() => {
getList();
}, [category_ids, dep_ids, refresh, page, size, tabKey]);
useEffect(() => {
setCateId(Number(result.get("cid")));
if (Number(result.get("cid"))) {
let arr = [];
arr.push(Number(result.get("cid")));
setCategoryIds(arr);
}
setDid(Number(result.get("did")));
if (Number(result.get("did"))) {
let arr = [];
arr.push(Number(result.get("did")));
setDepIds(arr);
}
}, [result.get("cid"), result.get("did")]);
const items: TabsProps["items"] = [
{
@ -70,6 +96,7 @@ const CoursePage = () => {
children: (
<div className="float-left">
<TreeCategory
selected={category_ids}
type=""
text={"分类"}
onUpdate={(keys: any, title: any) => {
@ -90,6 +117,7 @@ const CoursePage = () => {
children: (
<div className="float-left">
<TreeDepartment
selected={dep_ids}
refresh={refresh}
showNum={false}
type="no-course"
@ -288,7 +316,7 @@ const CoursePage = () => {
setLoading(true);
let categoryIds = "";
let depIds = "";
if (tabKey === 1) {
if (tabKey === "1") {
categoryIds = category_ids.join(",");
} else {
depIds = dep_ids.join(",");
@ -317,11 +345,6 @@ const CoursePage = () => {
setRefresh(!refresh);
};
// 加载列表
useEffect(() => {
getList();
}, [category_ids, dep_ids, refresh, page, size, tabKey]);
const paginationProps = {
current: page, //当前页码
pageSize: size,
@ -337,7 +360,7 @@ const CoursePage = () => {
};
const onChange = (key: string) => {
setTabKey(Number(key));
setTabKey(key);
};
return (
@ -345,7 +368,7 @@ const CoursePage = () => {
<div className="tree-main-body">
<div className="left-box">
<Tabs
defaultActiveKey="1"
defaultActiveKey={tabKey}
centered
tabBarGutter={55}
items={items}
@ -354,7 +377,7 @@ const CoursePage = () => {
</div>
<div className="right-box">
<div className="playedu-main-title float-left mb-24">
线 | {tabKey === 1 ? selLabel : selDepLabel}
线 | {tabKey === "1" ? selLabel : selDepLabel}
</div>
<div className="float-left j-b-flex mb-24">
<div className="d-flex">
@ -406,8 +429,8 @@ const CoursePage = () => {
rowKey={(record) => record.id}
/>
<CourseCreate
cateIds={tabKey === 1 ? category_ids : []}
depIds={tabKey === 2 ? dep_ids : []}
cateIds={tabKey === "1" ? category_ids : []}
depIds={tabKey === "2" ? dep_ids : []}
open={createVisible}
onCancel={() => {
setCreateVisible(false);

View File

@ -89,7 +89,12 @@ const DepartmentPage = () => {
<i
className="iconfont icon-icon-delete"
style={{ fontSize: 24 }}
onClick={() => removeItem(departments[id][i].id)}
onClick={() =>
removeItem(
departments[id][i].id,
departments[id][i].name
)
}
/>
</>
)}
@ -124,7 +129,12 @@ const DepartmentPage = () => {
<i
className="iconfont icon-icon-delete"
style={{ fontSize: 24 }}
onClick={() => removeItem(departments[id][i].id)}
onClick={() =>
removeItem(
departments[id][i].id,
departments[id][i].name
)
}
/>
</>
)}
@ -144,7 +154,7 @@ const DepartmentPage = () => {
setRefresh(!refresh);
};
const removeItem = (id: number) => {
const removeItem = (id: number, label: string) => {
if (id === 0) {
return;
}
@ -187,7 +197,9 @@ const DepartmentPage = () => {
style={{ paddingLeft: 4, paddingRight: 4 }}
type="link"
danger
onClick={() => navigate("/course")}
onClick={() =>
navigate("/course?did=" + id + "&label=" + label)
}
>
{res.data.courses.length}线
</Button>
@ -197,7 +209,9 @@ const DepartmentPage = () => {
type="link"
style={{ paddingLeft: 4, paddingRight: 4 }}
danger
onClick={() => navigate("/member/index")}
onClick={() =>
navigate("/member/index?did=" + id + "&label=" + label)
}
>
{res.data.users.length}
</Button>

View File

@ -20,7 +20,7 @@ import {
} from "@ant-design/icons";
import { user } from "../../api/index";
import { dateFormat } from "../../utils/index";
import { Link, Navigate } from "react-router-dom";
import { Link, Navigate, useLocation } from "react-router-dom";
import { TreeDepartment, PerButton } from "../../compenents";
import { MemberCreate } from "./compenents/create";
import { MemberUpdate } from "./compenents/update";
@ -37,6 +37,7 @@ interface DataType {
}
const MemberPage = () => {
const result = new URLSearchParams(useLocation().search);
const [loading, setLoading] = useState<boolean>(true);
const [page, setPage] = useState(1);
const [size, setSize] = useState(10);
@ -47,12 +48,24 @@ const MemberPage = () => {
const [nickname, setNickname] = useState<string>("");
const [email, setEmail] = useState<string>("");
const [dep_ids, setDepIds] = useState<any>([]);
const [selLabel, setLabel] = useState<string>("全部部门");
const [selLabel, setLabel] = useState<string>(
result.get("label") ? String(result.get("label")) : "全部部门"
);
const [createVisible, setCreateVisible] = useState<boolean>(false);
const [updateVisible, setUpdateVisible] = useState<boolean>(false);
const [mid, setMid] = useState<number>(0);
const [user_dep_ids, setUserDepIds] = useState<any>({});
const [departments, setDepartments] = useState<any>({});
const [did, setDid] = useState(Number(result.get("did")));
useEffect(() => {
setDid(Number(result.get("did")));
if (Number(result.get("did"))) {
let arr = [];
arr.push(Number(result.get("did")));
setDepIds(arr);
}
}, [result.get("did")]);
const columns: ColumnsType<DataType> = [
{
@ -247,6 +260,7 @@ const MemberPage = () => {
<div className="tree-main-body">
<div className="left-box">
<TreeDepartment
selected={dep_ids}
refresh={refresh}
showNum={true}
type=""

View File

@ -11,6 +11,7 @@ import {
Pagination,
} from "antd";
import { resource } from "../../../api";
import { useLocation } from "react-router-dom";
import styles from "./index.module.less";
import { UploadImageSub } from "../../../compenents/upload-image-button/upload-image-sub";
import { TreeCategory, PerButton } from "../../../compenents";
@ -32,6 +33,7 @@ interface ImageItem {
}
const ResourceImagesPage = () => {
const result = new URLSearchParams(useLocation().search);
const [imageList, setImageList] = useState<ImageItem[]>([]);
const [refresh, setRefresh] = useState(false);
const [page, setPage] = useState(1);
@ -41,8 +43,20 @@ const ResourceImagesPage = () => {
const [selectKey, setSelectKey] = useState<any>([]);
const [visibleArr, setVisibleArr] = useState<any>([]);
const [hoverArr, setHoverArr] = useState<any>([]);
const [selLabel, setLabel] = useState<string>("全部图片");
const [selLabel, setLabel] = useState<string>(
result.get("label") ? String(result.get("label")) : "全部图片"
);
const [loading, setLoading] = useState<boolean>(false);
const [cateId, setCateId] = useState(Number(result.get("cid")));
useEffect(() => {
setCateId(Number(result.get("cid")));
if (Number(result.get("cid"))) {
let arr = [];
arr.push(Number(result.get("cid")));
setCategoryIds(arr);
}
}, [result.get("cid")]);
// 删除图片
const removeResource = () => {
@ -151,6 +165,7 @@ const ResourceImagesPage = () => {
<div className="tree-main-body">
<div className="left-box">
<TreeCategory
selected={category_ids}
type="no-cate"
text={"图片"}
onUpdate={(keys: any, title: any) => {

View File

@ -88,7 +88,9 @@ const ResourceCategoryPage = () => {
<i
className="iconfont icon-icon-delete"
style={{ fontSize: 24 }}
onClick={() => removeItem(categories[id][i].id)}
onClick={() =>
removeItem(categories[id][i].id, categories[id][i].name)
}
/>
)}
</div>
@ -123,7 +125,9 @@ const ResourceCategoryPage = () => {
<i
className="iconfont icon-icon-delete"
style={{ fontSize: 24 }}
onClick={() => removeItem(categories[id][i].id)}
onClick={() =>
removeItem(categories[id][i].id, categories[id][i].name)
}
/>
)}
</div>
@ -142,7 +146,7 @@ const ResourceCategoryPage = () => {
setRefresh(!refresh);
};
const removeItem = (id: number) => {
const removeItem = (id: number, label: string) => {
if (id === 0) {
return;
}
@ -187,7 +191,9 @@ const ResourceCategoryPage = () => {
style={{ paddingLeft: 4, paddingRight: 4 }}
type="link"
danger
onClick={() => navigate("/course")}
onClick={() =>
navigate("/course?cid=" + id + "&label=" + label)
}
>
{res.data.courses.length}线
</Button>
@ -197,7 +203,9 @@ const ResourceCategoryPage = () => {
type="link"
style={{ paddingLeft: 4, paddingRight: 4 }}
danger
onClick={() => navigate("/videos")}
onClick={() =>
navigate("/videos?cid=" + id + "&label=" + label)
}
>
{res.data.videos.length}
</Button>
@ -207,7 +215,9 @@ const ResourceCategoryPage = () => {
type="link"
style={{ paddingLeft: 4, paddingRight: 4 }}
danger
onClick={() => navigate("/images")}
onClick={() =>
navigate("/images?cid=" + id + "&label=" + label)
}
>
{res.data.images.length}
</Button>

View File

@ -2,6 +2,7 @@ import { useEffect, useState } from "react";
import { Modal, Table, message, Space } from "antd";
import { resource } from "../../../api";
// import styles from "./index.module.less";
import { useLocation } from "react-router-dom";
import { ExclamationCircleFilled } from "@ant-design/icons";
import type { ColumnsType } from "antd/es/table";
import { dateFormat } from "../../../utils/index";
@ -18,6 +19,7 @@ interface DataType {
}
const ResourceVideosPage = () => {
const result = new URLSearchParams(useLocation().search);
const [videoList, setVideoList] = useState<any>([]);
const [videosExtra, setVideoExtra] = useState<any>([]);
const [adminUsers, setAdminUsers] = useState<any>({});
@ -27,7 +29,19 @@ const ResourceVideosPage = () => {
const [total, setTotal] = useState(0);
const [loading, setLoading] = useState<boolean>(true);
const [category_ids, setCategoryIds] = useState<any>([]);
const [selLabel, setLabel] = useState<string>("全部视频");
const [selLabel, setLabel] = useState<string>(
result.get("label") ? String(result.get("label")) : "全部视频"
);
const [cateId, setCateId] = useState(Number(result.get("cid")));
useEffect(() => {
setCateId(Number(result.get("cid")));
if (Number(result.get("cid"))) {
let arr = [];
arr.push(Number(result.get("cid")));
setCategoryIds(arr);
}
}, [result.get("cid")]);
const columns: ColumnsType<DataType> = [
// {
@ -170,6 +184,7 @@ const ResourceVideosPage = () => {
<div className="tree-main-body">
<div className="left-box">
<TreeCategory
selected={category_ids}
type="no-cate"
text={"视频"}
onUpdate={(keys: any, title: any) => {