Merge pull request #2090 from visuddhinanda/agile

添加user气泡

dashboard/src/components/auth/User.tsx

@@ -1,4 +1,4 @@
-import { Avatar, Space } from "antd";
+import { Avatar, Popover, Space } from "antd";
 import { getAvatarColor } from "./Studio";
 
 export interface IUser {
@@ -7,6 +7,7 @@ export interface IUser {
   userName: string;
   avatar?: string;
 }
+
 interface IWidget {
   id?: string;
   nickName?: string;
@@ -14,6 +15,7 @@ interface IWidget {
   avatar?: string;
   showAvatar?: boolean;
   showName?: boolean;
+  showUserName?: boolean;
 }
 const UserWidget = ({
   nickName,
@@ -21,20 +23,40 @@ const UserWidget = ({
   avatar,
   showAvatar = true,
   showName = true,
+  showUserName = false,
 }: IWidget) => {
   return (
-    <Space>
-      {showAvatar ? (
-        <Avatar
-          size="small"
-          src={avatar}
-          style={{ backgroundColor: getAvatarColor(nickName) }}
-        >
-          {nickName?.slice(0, 2)}
-        </Avatar>
-      ) : undefined}
-      {showName ? nickName : undefined}
-    </Space>
+    <Popover
+      content={
+        <div>
+          <div>
+            <Avatar
+              size="large"
+              src={avatar}
+              style={{ backgroundColor: getAvatarColor(nickName) }}
+            >
+              {nickName?.slice(0, 2)}
+            </Avatar>
+          </div>
+          <div>{`${nickName}@${userName}`}</div>
+        </div>
+      }
+    >
+      <Space>
+        {showAvatar ? (
+          <Avatar
+            size={"small"}
+            src={avatar}
+            style={{ backgroundColor: getAvatarColor(nickName) }}
+          >
+            {nickName?.slice(0, 2)}
+          </Avatar>
+        ) : undefined}
+        {showName ? nickName : undefined}
+        {showName && showUserName ? "@" : undefined}
+        {showUserName ? userName : undefined}
+      </Space>
+    </Popover>
   );
 };
 

dashboard/src/components/auth/UserName.tsx

@@ -1,27 +0,0 @@
-export interface IUser {
-  id?: string;
-  nickName?: string;
-  realName?: string;
-}
-interface IWidget {
-  id?: string;
-  nickName?: string;
-  realName?: string;
-  onClick?: Function;
-}
-
-const UserNameWidget = ({ id, nickName, realName, onClick }: IWidget) => {
-  return (
-    <span
-      onClick={(e) => {
-        if (typeof onClick !== "undefined") {
-          onClick(e);
-        }
-      }}
-    >
-      {nickName}
-    </span>
-  );
-};
-
-export default UserNameWidget;

dashboard/src/components/corpus/SentHistory.tsx

@@ -2,8 +2,7 @@ import { ProList } from "@ant-design/pro-components";
 import { Space, Typography } from "antd";
 
 import { get } from "../../request";
-import User from "../auth/User";
-import { IUser } from "../auth/UserName";
+import User, { IUser } from "../auth/User";
 import TimeShow from "../general/TimeShow";
 import { IChannel } from "../channel/Channel";
 import { MergeIcon2 } from "../../assets/icon";

dashboard/src/components/course/CourseHead.tsx

@@ -5,11 +5,11 @@ import { Typography } from "antd";
 import { HomeOutlined } from "@ant-design/icons";
 
 import { API_HOST } from "../../request";
-import UserName from "../auth/UserName";
 import { ICourseDataResponse } from "../api/Course";
 import { useIntl } from "react-intl";
 import Status from "./Status";
 import moment from "moment";
+import User from "../auth/User";
 
 const { Title, Text } = Typography;
 
@@ -112,7 +112,7 @@ const CourseHeadWidget = ({ data }: IWidget) => {
             <Space>
               <Text>主讲人：</Text>{" "}
               <Text>
-                <UserName {...data?.teacher} />
+                <User {...data?.teacher} showAvatar={false} />
               </Text>
             </Space>
           </Space>

dashboard/src/components/course/CourseMemberList.tsx

@@ -1,9 +1,9 @@
 import { useIntl } from "react-intl";
-import { Dropdown, Tag, message } from "antd";
+import { Button, Dropdown, Tag, message } from "antd";
 import { ActionType, ProList } from "@ant-design/pro-components";
+import { ExportOutlined } from "@ant-design/icons";
 
-import { get } from "../../request";
-import AddMember from "./AddMember";
+import { API_HOST, get } from "../../request";
 import { useEffect, useRef, useState } from "react";
 import {
   ICourseDataResponse,
@@ -298,6 +298,14 @@ const CourseMemberListWidget = ({ courseId, onSelect }: IWidget) => {
           search: true,
         }}
         toolBarRender={() => [
+          <a
+            href={`${API_HOST}/api/v2/course-member-export?course_id=${courseId}`}
+            target="_blank"
+            key="export"
+            rel="noreferrer"
+          >
+            <ExportOutlined />
+          </a>,
           <CourseInvite
             courseId={courseId}
             onCreated={() => {

dashboard/src/components/share/Collaborator.tsx

@@ -12,11 +12,10 @@ import {
   IShareResponse,
   IShareUpdateRequest,
 } from "../api/Share";
-import { IUser } from "../auth/User";
+import User, { IUser } from "../auth/User";
 import { TRole } from "../api/Auth";
 
 import Group, { IGroup } from "../group/Group";
-import UserName from "../auth/UserName";
 
 interface ICollaborator {
   sn?: number;
@@ -120,7 +119,7 @@ const CollaboratorWidget = ({ resId, load = false, onReload }: IWidget) => {
         title: {
           render: (text, row, index, action) => {
             return row.user ? (
-              <UserName {...row.user} key={index} />
+              <User {...row.user} showAvatar={false} key={index} />
             ) : (
               <Group group={row.group} key={index} />
             );

dashboard/src/components/term/TermItem.tsx

@@ -7,7 +7,6 @@ import {
 
 import { ITermDataResponse } from "../api/Term";
 import MdView from "../template/MdView";
-import UserName from "../auth/UserName";
 import TimeShow from "../general/TimeShow";
 import TermModal from "./TermModal";
 import { useEffect, useState } from "react";
@@ -19,6 +18,7 @@ import store from "../../store";
 import "../article/article.css";
 import Discussion from "../discussion/Discussion";
 import { useIntl } from "react-intl";
+import User from "../auth/User";
 
 const { Text } = Typography;
 
@@ -66,7 +66,7 @@ const TermItemWidget = ({ data, onTermClick }: IWidget) => {
                     id: "term.general-in-studio",
                   })}
               <Text type="secondary">
-                <UserName {...data?.editor} />
+                <User {...data?.editor} showAvatar={false} />
               </Text>
               <TimeShow type="secondary" updatedAt={data?.updated_at} />
             </Space>

dashboard/src/components/transfer/TransferList.tsx

@@ -7,7 +7,6 @@ import { renderBadge } from "../channel/ChannelTable";
 import User, { IUser } from "../auth/User";
 import { IChannel } from "../channel/Channel";
 import { IStudio } from "../auth/Studio";
-import UserName from "../auth/UserName";
 import TimeShow from "../general/TimeShow";
 import {
   ITransferRequest,
@@ -108,7 +107,11 @@ const TransferListWidget = ({ studioName }: IWidget) => {
             render(dom, entity, index, action, schema) {
               return (
                 <Space>
-                  <UserName key={"user"} {...entity.transferor} />
+                  <User
+                    key={"user"}
+                    {...entity.transferor}
+                    showAvatar={false}
+                  />
                   <span key="text">{"transfer at"}</span>
                   <TimeShow key={"time"} createdAt={entity.created_at} />
                 </Space>

dashboard/src/reducers/current-course.ts

@@ -1,9 +1,13 @@
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
 
 import type { RootState } from "../store";
-import { ICourseMemberData } from "../components/api/Course";
+import {
+  ICourseDataResponse,
+  ICourseMemberData,
+} from "../components/api/Course";
 
 export interface ITextbook {
+  course?: ICourseDataResponse;
   courseId: string;
   articleId: string;
   channelId: string;