Merge pull request #2038 from visuddhinanda/agile

显示channel绑定信息

dashboard/src/components/api/Course.ts

@@ -1,5 +1,6 @@
 import { IStudio } from "../auth/Studio";
 import { IUser } from "../auth/User";
+import { IChannel } from "../channel/Channel";
 import { TRole } from "./Auth";
 
 export interface ICourseListApiResponse {
@@ -147,6 +148,7 @@ export interface ICourseMemberData {
   user_id: string;
   course_id: string;
   channel_id?: string;
+  channel?: IChannel;
   role?: string;
   operating?: "invite" | "sign_up";
   user?: IUser;

dashboard/src/components/course/CourseMember.tsx

@@ -1,172 +0,0 @@
-import { useIntl } from "react-intl";
-import { useRef, useState } from "react";
-import { ActionType, ProList } from "@ant-design/pro-components";
-import { Space, Tag, Button, Layout, Popconfirm } from "antd";
-
-import CourseAddMember from "./AddMember";
-import { delete_, get } from "../../request";
-
-import {
-  ICourseMemberDeleteResponse,
-  ICourseMemberListResponse,
-  TCourseMemberStatus,
-} from "../api/Course";
-import { IUser } from "../auth/User";
-
-const { Content } = Layout;
-
-interface IRoleTag {
-  title: string;
-  color: string;
-}
-
-export interface ICourseMember {
-  sn?: number;
-  id?: string;
-  userId: string;
-  user?: IUser;
-  name?: string;
-  tag?: IRoleTag[];
-  image: string;
-  role?: string;
-  startExp?: number;
-  endExp?: number;
-  currentExp?: number;
-  expByDay?: number;
-  status?: TCourseMemberStatus;
-}
-interface IWidget {
-  courseId?: string;
-}
-const CourseMemberWidget = ({ courseId }: IWidget) => {
-  const intl = useIntl(); //i18n
-  const [canDelete, setCanDelete] = useState(false);
-  const [memberCount, setMemberCount] = useState<number>();
-
-  const ref = useRef<ActionType>();
-  return (
-    <Content>
-      <ProList<ICourseMember>
-        rowKey="id"
-        actionRef={ref}
-        headerTitle={
-          intl.formatMessage({ id: "group.member" }) +
-          "-" +
-          memberCount?.toString()
-        }
-        toolBarRender={() => {
-          return [
-            canDelete ? (
-              <CourseAddMember
-                courseId={courseId}
-                onCreated={() => {
-                  ref.current?.reload();
-                }}
-              />
-            ) : (
-              <></>
-            ),
-          ];
-        }}
-        showActions="hover"
-        request={async (params = {}, sorter, filter) => {
-          console.log(params, sorter, filter);
-
-          let url = `/v2/course-member?view=course&id=${courseId}`;
-          const offset =
-            ((params.current ? params.current : 1) - 1) *
-            (params.pageSize ? params.pageSize : 20);
-          url += `&limit=${params.pageSize}&offset=${offset}`;
-          if (typeof params.keyword !== "undefined") {
-            url += "&search=" + (params.keyword ? params.keyword : "");
-          }
-          const res = await get<ICourseMemberListResponse>(url);
-          if (res.ok) {
-            console.log(res.data);
-            setMemberCount(res.data.count);
-            if (res.data.role === "owner" || res.data.role === "manager") {
-              setCanDelete(true);
-            }
-            const items: ICourseMember[] = res.data.rows.map((item, id) => {
-              let member: ICourseMember = {
-                id: item.id ? item.id : "",
-                userId: item.user_id,
-                user: item.user,
-                name: item.user?.nickName,
-                tag: [],
-                image: "",
-              };
-              return member;
-            });
-            console.log(items);
-            return {
-              total: res.data.count,
-              succcess: true,
-              data: items,
-            };
-          } else {
-            console.error(res.message);
-            return {
-              total: 0,
-              succcess: false,
-              data: [],
-            };
-          }
-        }}
-        pagination={{
-          showQuickJumper: true,
-          showSizeChanger: true,
-        }}
-        metas={{
-          title: {
-            dataIndex: "name",
-          },
-          avatar: {
-            dataIndex: "image",
-            editable: false,
-          },
-          subTitle: {
-            render: (text, row, index, action) => {
-              return <Tag>{row.role}</Tag>;
-            },
-          },
-          actions: {
-            render: (text, row, index, action) => [
-              canDelete ? (
-                <Popconfirm
-                  placement="bottomLeft"
-                  title={intl.formatMessage({
-                    id: "forms.message.member.remove",
-                  })}
-                  onConfirm={(
-                    e?: React.MouseEvent<HTMLElement, MouseEvent>
-                  ) => {
-                    console.log("delete", row.id);
-                    delete_<ICourseMemberDeleteResponse>(
-                      "/v2/course-member/" + row.id
-                    ).then((json) => {
-                      if (json.ok) {
-                        console.log("delete ok");
-                        ref.current?.reload();
-                      }
-                    });
-                  }}
-                  okText={intl.formatMessage({ id: "buttons.ok" })}
-                  cancelText={intl.formatMessage({ id: "buttons.cancel" })}
-                >
-                  <Button size="small" type="link" danger key="link">
-                    {intl.formatMessage({ id: "buttons.remove" })}
-                  </Button>
-                </Popconfirm>
-              ) : (
-                <></>
-              ),
-            ],
-          },
-        }}
-      />
-    </Content>
-  );
-};
-
-export default CourseMemberWidget;

dashboard/src/components/course/CourseMemberList.tsx

@@ -1,27 +1,46 @@
 import { useIntl } from "react-intl";
-import { Dropdown, Modal, Tag, message } from "antd";
+import { Dropdown, Tag, message } from "antd";
 import { ActionType, ProList } from "@ant-design/pro-components";
-import { ExclamationCircleFilled } from "@ant-design/icons";
 
-import { get, put } from "../../request";
-import { ICourseMember } from "./CourseMember";
+import { get } from "../../request";
 import AddMember from "./AddMember";
 import { useEffect, useRef, useState } from "react";
 import {
   ICourseDataResponse,
   ICourseMemberData,
   ICourseMemberListResponse,
-  ICourseMemberResponse,
   ICourseResponse,
   TCourseMemberAction,
   TCourseMemberStatus,
   actionMap,
 } from "../api/Course";
 import { ItemType } from "antd/lib/menu/hooks/useItems";
-import User from "../auth/User";
+import User, { IUser } from "../auth/User";
 import { getStatusColor, managerCanDo } from "./RolePower";
 import { ISetStatus, setStatus } from "./UserAction";
-const { confirm } = Modal;
+import { IChannel } from "../channel/Channel";
+
+interface IRoleTag {
+  title: string;
+  color: string;
+}
+
+export interface ICourseMember {
+  sn?: number;
+  id?: string;
+  userId: string;
+  user?: IUser;
+  name?: string;
+  tag?: IRoleTag[];
+  image: string;
+  role?: string;
+  channel?: IChannel;
+  startExp?: number;
+  endExp?: number;
+  currentExp?: number;
+  expByDay?: number;
+  status?: TCourseMemberStatus;
+}
 
 interface IWidget {
   courseId?: string;
@@ -97,6 +116,16 @@ const CourseMemberListWidget = ({ courseId, onSelect }: IWidget) => {
               );
             },
           },
+          content: {
+            render(dom, entity, index, action, schema) {
+              return (
+                <div>
+                  {"channel:"}
+                  {entity.channel?.name ?? "未绑定"}
+                </div>
+              );
+            },
+          },
           actions: {
             search: false,
             render: (text, row, index, action) => {
@@ -233,6 +262,7 @@ const CourseMemberListWidget = ({ courseId, onSelect }: IWidget) => {
                 name: item.user?.nickName,
                 role: item.role,
                 status: item.status,
+                channel: item.channel,
                 tag: [],
                 image: "",
               };

dashboard/src/components/course/SelectChannel.tsx

@@ -54,9 +54,6 @@ const SelectChannelWidget = ({
           }}
           submitTimeout={2000}
           onFinish={async (values) => {
-            console.log(values.channel);
-            console.log("id", id);
-
             if (user && courseId) {
               const url = `/v2/course-member_set-channel`;
               const data = {

dashboard/src/pages/studio/course/edit.tsx

@@ -7,7 +7,7 @@ import GoBack from "../../../components/studio/GoBack";
 import CourseInfoEdit from "../../../components/course/CourseInfoEdit";
 import CourseMemberList from "../../../components/course/CourseMemberList";
 import CourseMemberTimeLine from "../../../components/course/CourseMemberTimeLine";
-import { ICourseMember } from "../../../components/course/CourseMember";
+import { ICourseMember } from "../../../components/course/CourseMemberList";
 
 const Widget = () => {
   const intl = useIntl();