) => [...labelTaskKey.lists(), filter] as const,
8 | details: () => [...labelTaskKey.all, 'details'] as const,
9 | detail: (id: string | number) => [...labelTaskKey.details(), id] as const,
10 | };
11 |
12 | export const labelerKey = {
13 | all: ['all_labelers'] as const,
14 | lists: () => [...labelTaskKey.all, 'list'] as const,
15 | list: (filter: LabelTaskStatisticsBody) => [...labelTaskKey.lists(), filter] as const,
16 | details: () => [...labelTaskKey.all, 'details'] as const,
17 | detail: (id: string | number) => [...labelTaskKey.details(), id] as const,
18 | };
19 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/constant/query-key-factories/team.ts:
--------------------------------------------------------------------------------
1 | // 团队列表
2 | export const teamKey = {
3 | all: ['team_key'] as const,
4 | lists: () => [...teamKey.all, 'list'] as const,
5 | list: (filter: any) => [...teamKey.lists(), filter] as const,
6 | details: () => [...teamKey.all, 'details'] as const,
7 | detail: (id: string | number) => [...teamKey.details(), id] as const,
8 | };
9 |
10 | // 团队成员列表
11 | export const teamMemberKey = {
12 | all: ['team_member_key'] as const,
13 | lists: () => [...teamMemberKey.all, 'list'] as const,
14 | list: (filter: any) => [...teamMemberKey.lists(), filter] as const,
15 | details: () => [...teamMemberKey.all, 'details'] as const,
16 | detail: (id: string | number) => [...teamMemberKey.details(), id] as const,
17 | };
18 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/hooks/useLockFn.ts:
--------------------------------------------------------------------------------
1 | import { useRef, useCallback } from 'react';
2 |
3 | function useLockFn(fn: (...args: P) => Promise) {
4 | const lockRef = useRef(false);
5 |
6 | return useCallback(
7 | async (...args: P) => {
8 | if (lockRef.current) return;
9 | lockRef.current = true;
10 | try {
11 | return await fn(...args);
12 | } finally {
13 | lockRef.current = false;
14 | }
15 | },
16 | [fn],
17 | );
18 | }
19 |
20 | export default useLockFn;
21 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/hooks/useUserInfo.ts:
--------------------------------------------------------------------------------
1 | import { useQuery } from '@tanstack/react-query';
2 |
3 | import { userInfoKey } from '@/constant/query-key-factories';
4 | import { getUserInfo } from '@/api/user';
5 |
6 | export const useUserInfo = () => {
7 | return useQuery({
8 | queryKey: userInfoKey.all,
9 | queryFn: getUserInfo,
10 | staleTime: Infinity,
11 | gcTime: Infinity,
12 | });
13 | };
14 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
14 |
23 | LLM-Web
24 |
25 |
26 |
27 |
28 |
29 |
30 |
40 |
41 |
42 |
43 |
44 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/index.tsx:
--------------------------------------------------------------------------------
1 | import ReactDOM from 'react-dom/client';
2 |
3 | import App from './App';
4 | import '../../initialize';
5 | import './styles/index.css';
6 | import 'antd/dist/reset.css';
7 |
8 | ReactDOM.createRoot(document.getElementById('root')!).render();
9 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/layouts/index.css:
--------------------------------------------------------------------------------
1 | .layout-wrapper .ant-pro-sider-logo {
2 | @apply !py-6 !px-8;
3 |
4 | height: 71px;
5 | }
6 |
7 | .layout-wrapper .ant-layout-sider-children {
8 | @apply !p-0;
9 | }
10 |
11 | .layout-wrapper .ant-pro-sider-menu {
12 | @apply !p-4;
13 | }
14 |
15 | .layout-wrapper .ant-menu-inline-collapsed {
16 | @apply !p-1;
17 | }
18 |
19 | .layout-wrapper .ant-pro-sider-actions {
20 | @apply !pr-4;
21 | }
22 |
23 | .layout-wrapper .ant-pro-sider-actions-avatar {
24 | @apply !mx-3 !my-3;
25 | }
26 |
27 | .layout-wrapper .ant-pro-sider-logo img {
28 | @apply !h-7;
29 | }
30 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/loaders/task.loader.ts:
--------------------------------------------------------------------------------
1 | import type { LoaderFunctionArgs } from 'react-router-dom';
2 |
3 | import queryClient from '@/constant/queryClient';
4 |
5 | import { getLabelTaskDetail } from '../services/task';
6 | import { labelTaskKey } from '../constant/query-key-factories';
7 |
8 | export async function labelTaskLoader({ params }: LoaderFunctionArgs) {
9 | try {
10 | // @ts-ignore
11 | return await queryClient.fetchQuery({
12 | queryKey: labelTaskKey.detail(params.id!),
13 | queryFn: () => getLabelTaskDetail({}, { task_id: params.id! }),
14 | });
15 | } catch (err) {
16 | return null;
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/loaders/team.loader.ts:
--------------------------------------------------------------------------------
1 | import type { LoaderFunctionArgs } from 'react-router-dom';
2 |
3 | import queryClient from '@/constant/queryClient';
4 |
5 | import { getTeamDetail } from '../services/team';
6 | import { teamKey } from '../constant/query-key-factories';
7 |
8 | export async function teamLoader({ params }: LoaderFunctionArgs) {
9 | try {
10 | return await queryClient.fetchQuery({
11 | queryKey: teamKey.detail(params.team_id!),
12 | queryFn: async () => getTeamDetail(params.team_id!),
13 | });
14 | } catch (err) {
15 | return null;
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/pages/task.label.create/context.ts:
--------------------------------------------------------------------------------
1 | import type { FormInstance } from 'antd';
2 | import { createContext } from 'react';
3 |
4 | export interface ITaskFormContext {
5 | basicForm: FormInstance;
6 | toolForm: FormInstance;
7 | }
8 |
9 | const TaskFormContext = createContext({} as ITaskFormContext);
10 |
11 | export default TaskFormContext;
12 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/pages/users.operator/Invite/index.tsx:
--------------------------------------------------------------------------------
1 | import { PlusOutlined } from '@ant-design/icons';
2 | import { ModalForm, ProFormText } from '@ant-design/pro-components';
3 | import { Button, Form, message } from 'antd';
4 |
5 | import { EUserRole, IUserInfo } from '@/api/user';
6 |
7 | interface IProps {
8 | mutateAsync: (d: IUserInfo) => Promise;
9 | }
10 |
11 | export default ({ mutateAsync }: IProps) => {
12 | const [form] = Form.useForm();
13 | return (
14 |
15 | title="添加成员"
16 | layout="horizontal"
17 | trigger={
18 |
22 | }
23 | form={form}
24 | modalProps={{
25 | width: 400,
26 | centered: true,
27 | destroyOnClose: true,
28 | onCancel: () => console.log('run'),
29 | }}
30 | onFinish={async (values) => {
31 | await mutateAsync({ ...values, role: EUserRole.admin });
32 | message.success('添加成功');
33 | return true;
34 | }}
35 | >
36 |
37 |
38 |
39 | );
40 | };
41 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/pages/users.team/Edit/index.tsx:
--------------------------------------------------------------------------------
1 | import { ModalForm, ProFormText } from '@ant-design/pro-components';
2 | import { message } from 'antd';
3 |
4 | import type { ITeam, IUpdateTeam } from '@/apps/operator/services/team';
5 | import { updateTeam, createTeam } from '@/apps/operator/services/team';
6 |
7 | interface IProps {
8 | info?: ITeam;
9 | isCreate?: boolean;
10 | open: boolean;
11 | onUpdate: () => void;
12 | onCancel: () => void;
13 | }
14 |
15 | // 正则校验手机号
16 | const phoneReg = /^(?:(?:\+|00)86)?1[3-9]\d{9}$/;
17 |
18 | export default (props: IProps) => {
19 | return (
20 | {
25 | const api = props.isCreate ? createTeam : updateTeam;
26 | await api({ ...values, team_id: props.info?.team_id as string });
27 | message.success('提交成功');
28 | props?.onUpdate();
29 | return true;
30 | }}
31 | initialValues={props.info}
32 | modalProps={{
33 | centered: true,
34 | width: 500,
35 | destroyOnClose: true,
36 | onCancel: () => props.onCancel(),
37 | }}
38 | >
39 |
40 |
50 |
58 |
67 |
68 | );
69 | };
70 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/services/team.ts:
--------------------------------------------------------------------------------
1 | import request from '@/api/request';
2 | import type { ETeamAccess } from '@/api/team';
3 |
4 | /**
5 | * 创建团队
6 | * */
7 | export interface ITeam {
8 | name: string; // 团队名称
9 | owner: string; // 团队拥有者 联系人
10 | owner_cellphone: string; // 联系人手机号
11 | team_id: string; // 团队id
12 | user_count: number; // 团队成员数量
13 | is_default_team: boolean; // 是否是默认团队
14 | }
15 | export const createTeam = (params: Omit) => {
16 | return request.post('/v1/team/create', params);
17 | };
18 |
19 | /**
20 | * 更新团队
21 | * */
22 | export type IUpdateTeam = Omit;
23 | export const updateTeam = (params: IUpdateTeam) => {
24 | return request.patch('/v1/team/update', params);
25 | };
26 |
27 | /**
28 | * 获取团队列表
29 | * */
30 | interface ITeamListParams {
31 | page?: number; // 页码
32 | page_size?: number; // 每页数量
33 | }
34 |
35 | export const getTeamList = (params: ITeamListParams): Promise<{ list: ITeam[]; total: number }> => {
36 | return request.post('/v1/team/list', params);
37 | };
38 |
39 | /**
40 | * 获取团队详情
41 | * */
42 | export const getTeamDetail = async (team_id: string): Promise => {
43 | return request.get(`/v1/team/get/${team_id}`);
44 | };
45 |
46 | /**
47 | * 删除团队
48 | */
49 | export const deleteTeam = (params: { team_id: string }) => {
50 | return request.post('/v1/team/delete', params);
51 | };
52 |
53 | /**
54 | * 获取运营人员列表
55 | * */
56 | export interface IOperatorItemParams {
57 | user_name?: string; // 用户名
58 | role?: ETeamAccess; // 用户角色
59 | page_size: number; // 每页数量
60 | is_operator: boolean; // 是否是运营人员
61 | page?: number; // 页码
62 | }
63 | export interface IOperatorRes {
64 | user_id: string; // 用户名
65 | role: ETeamAccess; // 用户角色
66 | name?: string; // 用户名
67 | }
68 | /**
69 | * 添加运营人员 删除运营人员
70 | * */
71 | export const editOperator = (params: IOperatorRes) => {
72 | return request.post('/v1/user/edit', params);
73 | };
74 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/services/types.ts:
--------------------------------------------------------------------------------
1 | export interface ListPayload {
2 | total: number;
3 | list: T[];
4 | }
5 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/styles/index.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;
4 |
5 | :root {
6 | --header-height: 56px;
7 | }
8 |
9 | a,
10 | a:hover {
11 | @apply text-primary;
12 | }
13 |
14 | /* 全局样式
15 | 设计要求覆盖全平台
16 | */
17 |
18 | /* 弹窗 内容区 */
19 | .ant-modal-content {
20 | padding-bottom: 24px !important;
21 | }
22 |
23 | .ant-table-thead .ant-table-cell {
24 | @apply !bg-fill-tertiary;
25 | }
26 |
27 | input:-webkit-autofill,
28 | input:-webkit-autofill:hover,
29 | input:-webkit-autofill:focus,
30 | input:-webkit-autofill:active {
31 | box-shadow: 0 0 0 30px white inset !important;
32 | }
33 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/utils/bfsEach.ts:
--------------------------------------------------------------------------------
1 | interface BFSOption {
2 | childrenField: ChildField;
3 | }
4 |
5 | export type TreeTypeWithChildrenField = TreeNode &
6 | Record[]>;
7 |
8 | /**
9 | * 广度优先遍历树节点
10 | * @param input 树
11 | * @param iteratee 回调函数
12 | * @param option
13 | * @returns void
14 | */
15 | export function bfsEach(
16 | input: TreeTypeWithChildrenField[],
17 | iteratee: (
18 | node: TreeTypeWithChildrenField,
19 | i: number,
20 | input: TreeTypeWithChildrenField[],
21 | parentPath: (string | number)[],
22 | ) => void,
23 | option: BFSOption = { childrenField: 'children' as ChildField },
24 | path: (string | number)[] = [],
25 | ) {
26 | if (!Array.isArray(input)) {
27 | console.warn('bfsEach input must be an array');
28 | return;
29 | }
30 |
31 | const { childrenField } = option;
32 |
33 | const leaf: TreeTypeWithChildrenField[] = [];
34 |
35 | for (let i = 0; i < input.length; i += 1) {
36 | if (Array.isArray(input[i][childrenField])) {
37 | leaf.push(...input[i][childrenField]);
38 | }
39 |
40 | iteratee(input[i], i, input, [...path, i.toString()]);
41 |
42 | if (leaf.length > 0 && i === input.length - 1) {
43 | bfsEach(leaf, iteratee, option, [...path, childrenField]);
44 | }
45 | }
46 | }
47 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/utils/downloadFromUrl.ts:
--------------------------------------------------------------------------------
1 | export default function downloadFromUrl(url: string, name?: string) {
2 | const link = document.createElement('a');
3 | link.href = url;
4 |
5 | if (name) {
6 | link.setAttribute('download', name);
7 | }
8 |
9 | document.body.appendChild(link);
10 | link.click();
11 | document.body.removeChild(link);
12 | }
13 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/utils/mapTree.ts:
--------------------------------------------------------------------------------
1 | import type { TreeTypeWithChildrenField } from './bfsEach';
2 |
3 | export interface MapTreeIterateeArg {
4 | index: number;
5 | treeNodes: TreeNode[];
6 | depth: number;
7 | parent: TreeNode | null;
8 | preNode: TreeNode | undefined;
9 | }
10 |
11 | export interface MapTreeOptions {
12 | depth?: number;
13 | parent?: TreeTypeWithChildrenField | null;
14 | childrenField: ChildField;
15 | }
16 |
17 | /**
18 | * 树的map遍历
19 | * @param treeNodes
20 | * @param iteratee
21 | * @returns
22 | */
23 | export function mapTree(
24 | treeNodes: TreeTypeWithChildrenField[] = [],
25 | iteratee: (
26 | node: TreeTypeWithChildrenField,
27 | iterateeArgs: MapTreeIterateeArg>,
28 | ) => TreeTypeWithChildrenField,
29 | options: MapTreeOptions = { childrenField: 'children' as ChildField },
30 | ): TreeTypeWithChildrenField[] {
31 | const { depth = 0, parent = null, childrenField } = options || {};
32 | const newNodes = [];
33 |
34 | for (let i = 0; i < treeNodes.length; i += 1) {
35 | const node = iteratee(treeNodes[i], {
36 | index: i,
37 | treeNodes,
38 | depth,
39 | parent,
40 | preNode: newNodes[newNodes.length - 1],
41 | });
42 |
43 | if (node === null) {
44 | continue;
45 | }
46 |
47 | if (Array.isArray(node[childrenField])) {
48 | node[childrenField] = mapTree(node[childrenField], iteratee, {
49 | depth: depth + 1,
50 | parent: node,
51 | childrenField,
52 | }) as TreeTypeWithChildrenField[ChildField];
53 | }
54 |
55 | newNodes.push(node);
56 | }
57 |
58 | return newNodes;
59 | }
60 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/utils/objectEach.ts:
--------------------------------------------------------------------------------
1 | export function objectEach(input: T, callback: (input: T, inputKey: keyof T) => void) {
2 | if (typeof input !== 'object' || !input) {
3 | return;
4 | }
5 |
6 | for (const key of Object.keys(input)) {
7 | const item = input[key as keyof T];
8 |
9 | callback(input, key as keyof T);
10 |
11 | if (typeof item === 'object') {
12 | objectEach(item as unknown as T, callback);
13 | }
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/wrappers/CheckChildRoute.tsx:
--------------------------------------------------------------------------------
1 | import { useOutlet } from 'react-router-dom';
2 | import type { PropsWithChildren } from 'react';
3 | import type React from 'react';
4 |
5 | const CheckChildRoute: React.FC> = ({ children }) => {
6 | const outlet = useOutlet();
7 |
8 | // 如果有子路由，不渲染当前组件
9 | if (outlet) {
10 | return outlet;
11 | }
12 |
13 | return children;
14 | };
15 |
16 | export default CheckChildRoute;
17 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/wrappers/CheckUsersPagePermission.tsx:
--------------------------------------------------------------------------------
1 | import { Outlet, Navigate } from 'react-router-dom';
2 |
3 | import { hasPermission } from '@/apps/operator/constant/access';
4 |
5 | const CheckUsersPagePermission = () => {
6 | if (!hasPermission('canUsersPagePermission')) {
7 | return ;
8 | }
9 | return ;
10 | };
11 |
12 | export default CheckUsersPagePermission;
13 |
--------------------------------------------------------------------------------
/frontend/src/apps/operator/wrappers/LoginCheck.tsx:
--------------------------------------------------------------------------------
1 | import type { To } from 'react-router-dom';
2 | import { useRouteLoaderData, useNavigate } from 'react-router-dom';
3 |
4 | // 已登录的用户访问登录页时，自动返回前一页
5 | export default function LoginCheck({ children }: { children: JSX.Element }) {
6 | const auth = useRouteLoaderData('root');
7 | const navigate = useNavigate();
8 |
9 | if (auth) {
10 | setTimeout(() => {
11 | navigate(-1 as To);
12 | });
13 |
14 | return null;
15 | }
16 |
17 | return children;
18 | }
19 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/App.tsx:
--------------------------------------------------------------------------------
1 | import AppContainer from '@/components/AppContainer';
2 | import RouterContainer from '@/components/RouterContainer';
3 | import { QueryProvider } from '@/constant/queryClient';
4 |
5 | import routes from './routes';
6 |
7 | export default function App() {
8 | return (
9 |
10 |
11 |
12 |
13 |
14 | );
15 | }
16 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/README.md:
--------------------------------------------------------------------------------
1 | # 供应商（标注）端
2 |
3 | 使用实验室的账号体系（SSO）
4 |
5 | 附：[SSO 接入文档](https://aicarrier.feishu.cn/docx/FYdedfGzEoV73Axi2lLcQdcrnzc)
6 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/assets/bg.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/opendatalab/LabelLLM/11f2a221f73c9625ec820bec8fc158c1ae16b8a9/frontend/src/apps/supplier/assets/bg.png
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/assets/empty.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/opendatalab/LabelLLM/11f2a221f73c9625ec820bec8fc158c1ae16b8a9/frontend/src/apps/supplier/assets/empty.png
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/assets/join.svg:
--------------------------------------------------------------------------------
1 |
19 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/assets/logo.svg:
--------------------------------------------------------------------------------
1 |
12 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/assets/preview.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/assets/timeout.svg:
--------------------------------------------------------------------------------
1 |
14 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/assets/title.svg:
--------------------------------------------------------------------------------
1 |
11 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/components/Copy/index.tsx:
--------------------------------------------------------------------------------
1 | import type { HTMLAttributes, PropsWithChildren } from 'react';
2 | import React from 'react';
3 | import { CopyToClipboard } from 'react-copy-to-clipboard';
4 | import { Tooltip } from 'antd';
5 | import clsx from 'clsx';
6 |
7 | import IconFont from '@/components/IconFont';
8 | import { message } from '@/components/StaticAnt';
9 | import { useIntl } from 'react-intl';
10 |
11 | interface IProps extends HTMLAttributes {
12 | val: string;
13 | children?: React.ReactNode;
14 | }
15 |
16 | const Copy: React.FC> = ({ val, className, children }) => {
17 | const { formatMessage } = useIntl();
18 | return (
19 | {
22 | message.success(formatMessage({ id: 'common.copy.success' }));
23 | }}
24 | >
25 | {children || (
26 |
27 |
33 |
34 |
35 |
36 |
37 |
38 | )}
39 |
40 | );
41 | };
42 |
43 | export default Copy;
44 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/components/Empty/index.tsx:
--------------------------------------------------------------------------------
1 | import type { HTMLAttributes, PropsWithChildren } from 'react';
2 | import React from 'react';
3 | import { Empty as AntdEmpty } from 'antd';
4 | import { clsx } from 'clsx';
5 | import type { VariantProps } from 'class-variance-authority';
6 | import { cva } from 'class-variance-authority';
7 |
8 | import emptyPic from '../../assets/empty.png';
9 |
10 | const base = clsx('rounded-sm overflow-hidden');
11 | const variants = cva(base, {
12 | variants: {
13 | size: {
14 | default: 'pt-16',
15 | },
16 | bordered: {
17 | true: 'border border-solid border-border-secondary',
18 | },
19 | },
20 | defaultVariants: {
21 | size: 'default',
22 | },
23 | });
24 |
25 | interface IProps extends HTMLAttributes, VariantProps {
26 | description?: React.ReactNode | string;
27 | imageHeight?: number;
28 | }
29 |
30 | const Empty: React.FC> = ({ className, bordered, description, imageHeight }) => {
31 | return (
32 |
35 | );
36 | };
37 |
38 | export default Empty;
39 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/constant/access.ts:
--------------------------------------------------------------------------------
1 | import type { IUserInfo } from '@/api/user';
2 | import { EUserRole } from '@/api/user';
3 | import queryClient from '@/constant/queryClient';
4 | import { userInfoKey } from '@/constant/query-key-factories';
5 |
6 | export interface IAccessValue {
7 | canReadPage: boolean; // 是否能访问页面
8 | canReadMember: boolean; // 是否能访问成员管理页面
9 | }
10 |
11 | // 用户团队权限
12 |
13 | export const accessObj: Record = {
14 | [EUserRole.admin]: '管理员',
15 | [EUserRole.user]: '普通用户',
16 | };
17 |
18 | type UserRoleMap = Record;
19 |
20 | const roleAccessMap: UserRoleMap = {
21 | [EUserRole.admin]: {
22 | canReadPage: true,
23 | canReadMember: true,
24 | },
25 | [EUserRole.user]: {
26 | canReadPage: true,
27 | canReadMember: false,
28 | },
29 | };
30 |
31 | // 校验当前用户的团队权限
32 | export function hasPermission(permission: keyof IAccessValue) {
33 | const user = queryClient.getQueryData(userInfoKey.all);
34 | const role = user?.role || EUserRole.user;
35 | return roleAccessMap[role][permission];
36 | }
37 |
38 | export default roleAccessMap;
39 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/constant/operatorAccess.ts:
--------------------------------------------------------------------------------
1 | import type { IUserInfo } from '@/api/user';
2 | import { EUserRole } from '@/api/user';
3 | import queryClient from '@/constant/queryClient';
4 | import { userInfoKey } from '@/constant/query-key-factories';
5 |
6 | // 运营权限
7 | export interface IAccessValue {
8 | canReadPage: boolean; // 是否能访问页面
9 | canReadPreview: boolean; // 是否能访问预览页面
10 | }
11 |
12 | type UserRoleMap = Record;
13 |
14 | const roleAccessMap: UserRoleMap = {
15 | [EUserRole.admin]: {
16 | canReadPage: true,
17 | canReadPreview: true,
18 | },
19 | [EUserRole.user]: {
20 | canReadPage: true,
21 | canReadPreview: false,
22 | },
23 | };
24 |
25 | // 权限验证
26 | export function hasPermission(permission: keyof IAccessValue) {
27 | const user = queryClient.getQueryData(userInfoKey.all);
28 | if (!user?.role) return false;
29 | return roleAccessMap[user?.role][permission];
30 | }
31 |
32 | export default roleAccessMap;
33 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/constant/query-key-factories/index.ts:
--------------------------------------------------------------------------------
1 | export * from './task';
2 | export * from './member';
3 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/constant/query-key-factories/member.ts:
--------------------------------------------------------------------------------
1 | // 任务列表
2 | export const memberKey = {
3 | all: ['member_key'] as const,
4 | lists: () => [...memberKey.all, 'memberKey'] as const,
5 | list: (filter: any) => [...memberKey.lists(), filter] as const,
6 | details: () => [...memberKey.all, 'details'] as const,
7 | detail: (id: string | number) => [...memberKey.details(), id] as const,
8 | };
9 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/constant/query-key-factories/task.ts:
--------------------------------------------------------------------------------
1 | import type { IPagination } from '@/apps/supplier/services/task';
2 |
3 | // 任务列表
4 | export const taskKey = {
5 | all: ['task_key'] as const,
6 | lists: () => [...taskKey.all, 'list'] as const,
7 | list: (filter: IPagination) => [...taskKey.lists(), filter] as const,
8 | details: () => [...taskKey.all, 'details'] as const,
9 | detail: (id: string | number) => [...taskKey.details(), id] as const,
10 | };
11 |
12 | // 问题列表
13 | export const questionKey = {
14 | all: ['question_key'] as const,
15 | lists: () => [...questionKey.all, 'list'] as const,
16 | list: (filter: string) => [...questionKey.lists(), filter] as const,
17 | details: () => [...questionKey.all, 'details'] as const,
18 | detail: (obj: any) => [...questionKey.details(), obj] as const,
19 | };
20 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/constant/task.ts:
--------------------------------------------------------------------------------
1 | export enum ERouterTaskType {
2 | task = 'task',
3 | preview = 'preview',
4 | review = 'review', // 预览全部任务
5 | reviewTask = 'review_task', // 预览某个标注员任务
6 | }
7 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/hooks/useTaskParams.ts:
--------------------------------------------------------------------------------
1 | import { useParams } from 'react-router-dom';
2 | import useUrlState from '@ahooksjs/use-url-state';
3 |
4 | import { ERouterTaskType } from '@/apps/supplier/constant/task';
5 | import type { ERecordStatus } from '@/apps/supplier/services/task';
6 |
7 | /**
8 | * type 当前任务类型
9 | * taskId 任务id
10 | * isPreview 是否是预览任务
11 | * */
12 |
13 | export enum EQueryQuestionType {
14 | all = 'all',
15 | problem = 'problem',
16 | customize = 'customize',
17 | }
18 | // 源题组合展示 默认不传 单题模式
19 | export enum EKind {
20 | with_duplicate = 'with_duplicate',
21 | }
22 |
23 | interface IQuery {
24 | user_id?: string;
25 | // 全部题目 未达标的题录
26 | record_status?: ERecordStatus;
27 | flow_index?: string;
28 | // 是否是搜索
29 | is_search?: string;
30 | data_id?: string; // 题目 id
31 | questionnaire_id?: string; // 问卷 id
32 | // 题目类型 包含 全部题目 仅看标为有问题 自定义题目范围
33 | question_type?: EQueryQuestionType;
34 | kind?: EKind; // 源题组合展示 默认不传 单题模式
35 | inlet?: 'supplier' | 'operator';
36 | }
37 |
38 | // 预览任务 https://labelu-llm-dev.shlab.tech/supplier/preview/beebc1fa-9b7f-406a-b498-194dab40d673;
39 | // 查看题目 https://labelu-llm-dev.shlab.tech/supplier/review/beebc1fa-9b7f-406a-b498-194dab40d673;
40 | // 查看标注员标注任务 https://labelu-llm-dev.shlab.tech/supplier/review_task/beebc1fa-9b7f-406a-b498-194dab40d673?user_id=1011;
41 |
42 | export const useTaskParams = () => {
43 | const params = useParams<{ type: ERouterTaskType; id: string }>();
44 | const [urlState, setUrlState] = useUrlState({
45 | flow_index: undefined,
46 | user_id: undefined,
47 | record_status: undefined,
48 | is_search: undefined,
49 | data_id: undefined,
50 | inlet: undefined,
51 | });
52 |
53 | const type = params.type || ERouterTaskType.task;
54 |
55 | return {
56 | type,
57 | taskId: params.id,
58 | isPreview: [ERouterTaskType.preview, ERouterTaskType.review, ERouterTaskType.reviewTask].includes(type),
59 | flow_index: urlState.flow_index,
60 | urlState,
61 | setUrlState,
62 | } as const;
63 | };
64 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/hooks/useUserInfo.ts:
--------------------------------------------------------------------------------
1 | import { useQuery } from '@tanstack/react-query';
2 |
3 | import { getUserInfo } from '@/api/user';
4 | import { userInfoKey } from '@/constant/query-key-factories';
5 |
6 | export const useUserInfo = () => {
7 | const { data: userInfo } = useQuery({
8 | queryKey: userInfoKey.all,
9 | queryFn: async () => getUserInfo(),
10 | staleTime: Infinity,
11 | gcTime: Infinity,
12 | });
13 | return {
14 | userInfo,
15 | };
16 | };
17 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
14 |
23 | LabelU-LLM
24 |
25 |
26 |
27 |
28 |
29 |
30 |
40 |
41 |
42 |
43 |
44 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/index.tsx:
--------------------------------------------------------------------------------
1 | import ReactDOM from 'react-dom/client';
2 |
3 | import App from './App';
4 | import '../../initialize';
5 | import './styles/index.css';
6 | import 'antd/dist/reset.css';
7 |
8 | ReactDOM.createRoot(document.getElementById('root')!).render();
9 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/layouts/CustomPageContainer.tsx:
--------------------------------------------------------------------------------
1 | import { PageContainer } from '@ant-design/pro-components';
2 | import type { PropsWithChildren } from 'react';
3 | import React from 'react';
4 | import { clsx } from 'clsx';
5 |
6 | interface IProps {
7 | className?: string;
8 | title?: string | React.ReactNode;
9 | bodyClassName?: string;
10 | }
11 |
12 | const CustomPageContainer: React.FC> = ({ className, title, children, bodyClassName }) => {
13 | return (
14 |
20 | {children}
21 |
22 | );
23 | };
24 |
25 | export default CustomPageContainer;
26 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/layouts/index.css:
--------------------------------------------------------------------------------
1 | /* 菜单 item 背景圆角 */
2 | .layout-wrapper .ant-menu-item {
3 | @apply rounded-none;
4 | }
5 |
6 | .layout-wrapper .ant-pro-sider-logo {
7 | @apply !py-5 !px-8;
8 |
9 | height: var(--header-height);
10 | }
11 |
12 | .layout-wrapper .ant-layout-sider-children {
13 | @apply !p-0;
14 | }
15 |
16 | .layout-wrapper .ant-pro-sider-menu {
17 | @apply !p-4;
18 | }
19 |
20 | .layout-wrapper .ant-menu-inline-collapsed {
21 | @apply !p-1;
22 | }
23 |
24 | .layout-wrapper .ant-pro-sider-logo img {
25 | @apply !h-7;
26 | }
27 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/pages/404.tsx:
--------------------------------------------------------------------------------
1 | import { Button, Result } from 'antd';
2 | import type { PropsWithChildren } from 'react';
3 | import React from 'react';
4 | import { useNavigate } from 'react-router-dom';
5 |
6 | const ResultBox: React.FC = () => {
7 | const navigate = useNavigate();
8 | return (
9 |
10 | navigate('/task')}>
16 | Back Task
17 |
18 | }
19 | />
20 |
21 | );
22 | };
23 |
24 | export default ResultBox;
25 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/pages/join-team/index.tsx:
--------------------------------------------------------------------------------
1 | import type { HTMLAttributes, PropsWithChildren } from 'react';
2 | import React from 'react';
3 | import { useParams, useNavigate } from 'react-router-dom';
4 | import { Button, Spin } from 'antd';
5 | import { useQuery } from '@tanstack/react-query';
6 |
7 | import { getInviteLinkDetail, joinTeam } from '@/apps/supplier/services/joinTeam';
8 |
9 | import { ReactComponent as JoinImg } from '../../assets/join.svg';
10 | import { ReactComponent as Timeout } from '../../assets/timeout.svg';
11 | import { useIntl } from 'react-intl';
12 |
13 | type IProps = HTMLAttributes;
14 |
15 | const Team: React.FC> = () => {
16 | const { formatMessage } = useIntl();
17 | const params = useParams<{ id: string }>();
18 | const navigate = useNavigate();
19 | const { data, isLoading, refetch } = useQuery({
20 | queryKey: ['getInviteLinkDetail', params.id],
21 | queryFn: async () => getInviteLinkDetail(params.id as string),
22 | });
23 |
24 | const toTask = async () => {
25 | await joinTeam({ team_id: data?.team_id as string });
26 | refetch?.();
27 | };
28 |
29 | return (
30 |
31 |
32 | {data?.is_expired ?
:
}
33 |
34 | {formatMessage({ id: 'member.team' })}：{data?.team_name}
35 |
36 |
{formatMessage({ id: 'member.team.join' })}
37 | {data?.is_expired && (
38 |
41 | )}
42 | {!data?.is_expired && data?.is_joined && (
43 |
46 | )}
47 | {!data?.is_expired && !data?.is_joined && (
48 |
51 | )}
52 |
20 | {conversation?.map((item) => {
21 | return ;
22 | })}
23 |
24 | );
25 | };
26 |
27 | export default React.memo(Answer);
28 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/pages/task.[id]/CheckTaskType/index.tsx:
--------------------------------------------------------------------------------
1 | import type { HTMLAttributes, PropsWithChildren } from 'react';
2 | import React from 'react';
3 |
4 | import { useTaskParams } from '@/apps/supplier/hooks/useTaskParams';
5 | import type { ERouterTaskType } from '@/apps/supplier/constant/task';
6 |
7 | type IProps = HTMLAttributes & {
8 | types: ERouterTaskType[];
9 | };
10 |
11 | const CheckTaskType: React.FC> = ({ types, children }) => {
12 | const { type } = useTaskParams();
13 | if (types.includes(type)) return <>{children};
14 | return null;
15 | };
16 |
17 | export default CheckTaskType;
18 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/pages/task.[id]/Countdown/index.tsx:
--------------------------------------------------------------------------------
1 | import type { HTMLAttributes, PropsWithChildren } from 'react';
2 | import React from 'react';
3 | import { Statistic, Tooltip } from 'antd';
4 | import { QuestionCircleOutlined } from '@ant-design/icons';
5 | import { FormattedMessage, useIntl } from 'react-intl';
6 |
7 | const { Countdown } = Statistic;
8 |
9 | interface IProps extends HTMLAttributes {
10 | remain_time?: number;
11 | whetherTimeout: () => void;
12 | }
13 |
14 | const CountdownBox: React.FC> = ({ remain_time, whetherTimeout }) => {
15 | const { formatMessage } = useIntl();
16 | return (
17 |
22 |
23 |
24 |
25 |
26 |
27 | }
28 | format="mm:ss"
29 | value={(remain_time ?? 0) * 1000}
30 | onFinish={whetherTimeout}
31 | />
32 | );
33 | };
34 |
35 | export default CountdownBox;
36 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/pages/task.[id]/CustomizeTextarea/upload.ts:
--------------------------------------------------------------------------------
1 | import type { RcFile } from 'antd/es/upload';
2 |
3 | import { getUploadUrl } from '@/apps/supplier/services/task';
4 | import request from '@/api/request';
5 |
6 | export const upload = async (file: RcFile) => {
7 | const { get_url, put_url } = await getUploadUrl({
8 | type: file.type,
9 | content_length: file.size,
10 | suffix: file.name.split('.').pop()?.toLowerCase() || '',
11 | });
12 | await request.put(put_url, file, { headers: { 'Content-Type': file.type, 'Content-Length': file.size } });
13 | return get_url;
14 | };
15 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/pages/task.[id]/QuestionnaireSelect/index.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { useQuery } from '@tanstack/react-query';
3 | import { Select } from 'antd';
4 |
5 | import { ERecordStatus, getTaskDataIds } from '@/apps/supplier/services/task';
6 | import { EKind, useTaskParams } from '@/apps/supplier/hooks/useTaskParams';
7 | import { FormattedMessage, useIntl } from 'react-intl';
8 |
9 | const QuestionnaireSelect = ({ data_id, questionnaire_id }: { data_id?: string; questionnaire_id?: string }) => {
10 | const { formatMessage } = useIntl();
11 | const { urlState, taskId, setUrlState } = useTaskParams();
12 | const { data } = useQuery({
13 | queryKey: ['getTaskDataIds', taskId, questionnaire_id],
14 | queryFn: async () =>
15 | getTaskDataIds({
16 | task_id: taskId!,
17 | questionnaire_id: questionnaire_id,
18 | record_status: urlState.record_status === ERecordStatus.invalid ? ERecordStatus.invalid : undefined,
19 | }),
20 | enabled: urlState.kind === EKind.with_duplicate && !!questionnaire_id,
21 | });
22 | if (urlState.kind !== EKind.with_duplicate) {
23 | return null;
24 | }
25 |
26 | const options = data?.data?.map((item) => ({
27 | value: item,
28 | label: item,
29 | }));
30 | return (
31 |
32 |
33 | ：
34 |
35 |
46 | );
47 | };
48 |
49 | export default QuestionnaireSelect;
50 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/pages/task.[id]/context.ts:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | import type { EPlugin } from '@/apps/supplier/pages/task.[id]/PluginSet';
4 | import type { IPluginConfig } from '@/apps/supplier/services/task';
5 |
6 | interface IOptions {
7 | label: string | number;
8 | value: string | number;
9 | disabled?: boolean;
10 | }
11 |
12 | export const DatasetsDetailContext = React.createContext<{
13 | data_id?: string;
14 | pluginConfig?: IPluginConfig;
15 | plugins?: EPlugin[];
16 | setPlugins?: (plugins: EPlugin[]) => void;
17 | sortOptions?: IOptions[];
18 | setSortOptionsHandle?: (v: number) => void;
19 | }>({});
20 |
21 | export const useDatasetsContext = () => {
22 | const context = React.useContext(DatasetsDetailContext);
23 | if (!context) {
24 | throw new Error('useDatasetsContext 必须在 DatasetsDetailContext 中使用 ');
25 | }
26 | return context;
27 | };
28 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/pages/task.[id]/index.css:
--------------------------------------------------------------------------------
1 | .chat-task .ant-form-item-label {
2 | padding-bottom: 0 !important;
3 | }
4 |
5 | .chat-task .ant-form-item {
6 | margin-bottom: 0 !important;
7 | }
8 |
9 | /* .chat-task .chat-task-form-items >div:last-of-type { */
10 |
11 | /* margin-bottom: 0 !important; */
12 |
13 | /* } */
14 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/pages/task/Card/index.module.css:
--------------------------------------------------------------------------------
1 | .card {
2 | background: linear-gradient(156.69deg, #cfbeff 29.41%, #bad1ff 58.72%, #8eebff 93.86%);
3 | }
4 |
5 | .card:hover {
6 | background: #2126c0 !important;
7 | box-shadow: 0 2px 10px rgb(18 19 22 / 10%);
8 | }
9 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/services/joinTeam.ts:
--------------------------------------------------------------------------------
1 | import request from '@/api/request';
2 |
3 | /**
4 | * 邀请链接详情
5 | */
6 | interface IInviteLinkDetail {
7 | is_expired: boolean; // 是否过期
8 | is_joined: boolean; // 是否已加入
9 | team_name: string; // 团队名称
10 | team_id: string; // 团队id
11 | }
12 | export const getInviteLinkDetail = async (link_id: string): Promise => {
13 | return request.get(`/v1/user/team/invitations/${link_id}`);
14 | };
15 |
16 | /**
17 | * 加入团队
18 | */
19 | export const joinTeam = async (params: { team_id: string }): Promise => {
20 | return request.post(`/v1/user/invitations/join`, params);
21 | };
22 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/wrappers/CheckPreviewAuth.tsx:
--------------------------------------------------------------------------------
1 | import type { HTMLAttributes, PropsWithChildren } from 'react';
2 | import React from 'react';
3 | import { useParams } from 'react-router-dom';
4 |
5 | import { ERouterTaskType } from '@/apps/supplier/constant/task';
6 | import { goLogin } from '@/utils/sso';
7 | import { hasPermission } from '@/apps/supplier/constant/operatorAccess';
8 |
9 | type IProps = HTMLAttributes;
10 |
11 | const CheckPreviewAuth: React.FC> = ({ children }) => {
12 | const { type } = useParams<{ type: ERouterTaskType }>();
13 |
14 | // 当前任务类型为预览，并且没有预览权限
15 | if (type && [ERouterTaskType.preview, ERouterTaskType.review].includes(type) && !hasPermission('canReadPreview')) {
16 | goLogin();
17 | return null;
18 | }
19 |
20 | return <>{children};
21 | };
22 |
23 | export default CheckPreviewAuth;
24 |
--------------------------------------------------------------------------------
/frontend/src/apps/supplier/wrappers/CheckTaskRouter.tsx:
--------------------------------------------------------------------------------
1 | import type { HTMLAttributes, PropsWithChildren } from 'react';
2 | import React from 'react';
3 | import { useParams, Navigate } from 'react-router-dom';
4 |
5 | import { ERouterTaskType } from '@/apps/supplier/constant/task';
6 |
7 | type IProps = HTMLAttributes;
8 |
9 | const CheckTaskRouter: React.FC> = ({ children }) => {
10 | const { type } = useParams<{ type: ERouterTaskType }>();
11 |
12 | const isRouter = Object.values(ERouterTaskType).some((item) => item === type);
13 | if (type && !isRouter) {
14 | return ;
15 | }
16 |
17 | return <>{children};
18 | };
19 |
20 | export default CheckTaskRouter;
21 |
--------------------------------------------------------------------------------
/frontend/src/components/AppContainer.tsx:
--------------------------------------------------------------------------------
1 | import { App as AntApp, ConfigProvider } from 'antd';
2 | import type { ConfigProviderProps } from 'antd/es/config-provider';
3 | import { IntlProvider } from 'react-intl';
4 | import enUS from 'antd/locale/en_US';
5 | import zhCN from 'antd/locale/zh_CN';
6 |
7 | import StaticAnt from '@/components/StaticAnt';
8 | import locale from '../locales';
9 | import UseLang from '@/hooks/useLang';
10 |
11 | import themeToken from '../styles/theme.json';
12 |
13 | interface AppProps extends ConfigProviderProps {
14 | children: React.ReactNode;
15 | className?: string;
16 | }
17 |
18 | const antdLocale = {
19 | 'zh-CN': zhCN,
20 | 'en-US': enUS,
21 | } as Record;
22 |
23 | // eslint-disable-next-line react/prop-types
24 | const AppContainer: React.FC = ({ children, className, ...rest }) => {
25 | const { lang } = UseLang();
26 | return (
27 |
28 |
29 |
30 |
31 | {children}
32 |
33 |
34 |
35 | );
36 | };
37 |
38 | export default AppContainer;
39 |
--------------------------------------------------------------------------------
/frontend/src/components/AppPanel/arrow.svg:
--------------------------------------------------------------------------------
1 |
6 |
--------------------------------------------------------------------------------
/frontend/src/components/AppPanel/labelu.svg:
--------------------------------------------------------------------------------
1 |
12 |
--------------------------------------------------------------------------------
/frontend/src/components/AppPanel/tool.svg:
--------------------------------------------------------------------------------
1 |
6 |
--------------------------------------------------------------------------------
/frontend/src/components/Breadcrumb.tsx:
--------------------------------------------------------------------------------
1 | import type { BreadcrumbItemProps } from 'antd';
2 | import { Breadcrumb as BreadcrumbAnt } from 'antd';
3 | import type { Params } from 'react-router-dom';
4 | import { useLocation, Link, useMatches } from 'react-router-dom';
5 |
6 | export interface Match {
7 | id: string;
8 | pathname: string;
9 | params: Params;
10 | data: unknown;
11 | handle: {
12 | crumb?: (data?: any) => React.ReactNode;
13 | };
14 | }
15 |
16 | export interface CustomBreadcrumbProps extends BreadcrumbItemProps {
17 | className?: string;
18 | /** 有些页面不需要显示首页的标题 */
19 | hideHome?: boolean;
20 | style?: React.CSSProperties;
21 | separator?: React.ReactNode;
22 | /** 当路由深度小于等于这个值时不显示面包屑 */
23 | hiddenDepth?: number;
24 | }
25 |
26 | /**
27 | * 面包屑导航
28 | * 通过react-router-dom 的useMatches得到route的父子路径
29 | */
30 | function Breadcrumb({ className, hiddenDepth, hideHome = false, style, ...rest }: CustomBreadcrumbProps) {
31 | const matches = useMatches() as Match[];
32 | const location = useLocation();
33 | const paths = location.pathname.split('/');
34 |
35 | if (location.pathname.endsWith('/')) {
36 | paths.pop();
37 | }
38 |
39 | if (hiddenDepth && paths.length <= hiddenDepth) {
40 | return null;
41 | }
42 |
43 | const crumbs = matches.filter((match) => {
44 | if (hideHome && match.pathname === '/') {
45 | return false;
46 | }
47 |
48 | return Boolean(match.handle?.crumb?.(match.data));
49 | });
50 | const items = crumbs.map((match, index) => {
51 | const title = match.handle.crumb!(match.data);
52 |
53 | return {
54 | title: index === crumbs.length - 1 ? title : {title},
55 | key: match.pathname,
56 | };
57 | });
58 |
59 | return ;
60 | }
61 |
62 | export default Breadcrumb;
63 |
--------------------------------------------------------------------------------
/frontend/src/components/ErrorBoundary/index.tsx:
--------------------------------------------------------------------------------
1 | import { Result } from 'antd';
2 | import React, { useEffect } from 'react';
3 | import { ErrorBoundary } from 'react-error-boundary';
4 |
5 | export default function CustomErrorBoundary({ children }: React.PropsWithChildren) {
6 | const fallback = ;
7 |
8 | useEffect(() => {
9 | const isRefreshed = Boolean(sessionStorage.getItem('error::refreshed'));
10 |
11 | // 如果遇到文件更新（比如升级）时，异步文件加载失败，刷新一次页面
12 | if (!isRefreshed) {
13 | sessionStorage.setItem('error::refreshed', 'true');
14 | window.location.reload();
15 | }
16 | }, []);
17 |
18 | return {children};
19 | }
20 |
--------------------------------------------------------------------------------
/frontend/src/components/FancyInput/base/Boolean.fancy.tsx:
--------------------------------------------------------------------------------
1 | import type { SwitchProps } from 'antd';
2 | import { Switch } from 'antd';
3 |
4 | export interface FancyBooleanProps extends SwitchProps {
5 | value: boolean;
6 | fieldProps?: any;
7 | fullField?: any;
8 | }
9 |
10 | export function FancyBoolean({ value, fieldProps, fullField, ...rest }: FancyBooleanProps) {
11 | return ;
12 | }
13 |
--------------------------------------------------------------------------------
/frontend/src/components/FancyInput/base/Enum.fancy.tsx:
--------------------------------------------------------------------------------
1 | import type { SelectProps } from 'antd';
2 | import { Select } from 'antd';
3 | import { useRef, useState } from 'react';
4 | import type { FormItemProps } from 'antd/lib/form';
5 | import _ from 'lodash';
6 |
7 | import { useScrollFetch } from '@/apps/operator/hooks/useScrollFetch';
8 | import { gid } from '@/utils/gid';
9 |
10 | export interface FancyEnumProps extends SelectProps {
11 | fieldProps: FormItemProps;
12 | antProps?: any;
13 | fullField?: any;
14 | queryFn?: (
15 | filterValue: string,
16 | refs: { totalRef: React.Ref; pageNoRef: React.Ref },
17 | ) => Promise<{ label: string; value: string }[]>;
18 | }
19 |
20 | export function FancyEnum(props: FancyEnumProps) {
21 | const { queryFn, onSearch, options, fieldProps, fullField, antProps, ...rest } = props;
22 | const [value, setValue] = useState('');
23 | const totalRef = useRef(0);
24 | const pageNoRef = useRef(1);
25 | const extraClassName = useRef(gid());
26 | const popupClassName = rest.popupClassName
27 | ? `${rest.popupClassName} ${extraClassName.current}`
28 | : extraClassName.current;
29 |
30 | const [list, loading] = useScrollFetch(
31 | (isReset) => {
32 | if (!queryFn) {
33 | return Promise.resolve([]);
34 | }
35 |
36 | if (isReset) {
37 | pageNoRef.current = 1;
38 | }
39 |
40 | return queryFn?.(value, { totalRef, pageNoRef });
41 | },
42 | () => document.querySelector(`.${extraClassName.current} .rc-virtual-list-holder`),
43 | {
44 | isEnd: (allData) => _.size(allData) >= totalRef.current,
45 | threshold: 50,
46 | watch: [value],
47 | },
48 | );
49 |
50 | const handleSearch: SelectProps['onSearch'] = _.debounce((_value: string) => {
51 | setValue(_value);
52 | onSearch?.(_value);
53 | }, 500);
54 |
55 | const handleResetSearch = () => {
56 | setValue('');
57 | };
58 |
59 | const _options = options || list;
60 |
61 | return (
62 |
71 | );
72 | }
73 |
--------------------------------------------------------------------------------
/frontend/src/components/FancyInput/base/Number.fancy.tsx:
--------------------------------------------------------------------------------
1 | import type { InputNumberProps } from 'antd';
2 | import { InputNumber } from 'antd';
3 |
4 | export type FancyNumberProps = InputNumberProps & {
5 | fieldProps?: any;
6 | };
7 |
8 | export function FancyNumber({ fieldProps, ...rest }: FancyNumberProps) {
9 | return ;
10 | }
11 |
--------------------------------------------------------------------------------
/frontend/src/components/FancyInput/base/String.fancy.tsx:
--------------------------------------------------------------------------------
1 | import type { InputProps } from 'antd';
2 | import { Input } from 'antd';
3 | import type { TextAreaProps } from 'antd/es/input';
4 |
5 | export interface FancyStringProps extends InputProps {
6 | alias?: 'input' | 'textarea';
7 | fieldProps?: any;
8 | antProps?: any;
9 | fullField?: any;
10 | }
11 |
12 | export function FancyString({ alias = 'input', fieldProps, antProps, fullField, ...rest }: FancyStringProps) {
13 | if (alias === 'input') {
14 | return ;
15 | }
16 |
17 | return ;
18 | }
19 |
--------------------------------------------------------------------------------
/frontend/src/components/FancyInput/fancyInput.ts:
--------------------------------------------------------------------------------
1 | import { FancyBoolean } from './base/Boolean.fancy';
2 | import { FancyEnum } from './base/Enum.fancy';
3 | import { FancyString } from './base/String.fancy';
4 | import { FancyNumber } from './base/Number.fancy';
5 |
6 | export const inputs: Record> = {
7 | enum: FancyEnum,
8 | string: FancyString,
9 | number: FancyNumber,
10 | boolean: FancyBoolean,
11 | };
12 |
13 | export const inputMapping: Record = {
14 | string: '字符串',
15 | number: '数字',
16 | boolean: '布尔值',
17 | enum: '选择',
18 | };
19 |
20 | export function add(type: string, component: React.FC) {
21 | if (inputs[type]) {
22 | console.warn(`[FancyInput] ${type} already exists`);
23 | return;
24 | }
25 |
26 | inputs[type] = component;
27 | }
28 |
29 | export function remove(type: string) {
30 | delete inputs[type];
31 | }
32 |
--------------------------------------------------------------------------------
/frontend/src/components/FancyInput/index.tsx:
--------------------------------------------------------------------------------
1 | import { inputs, add, remove } from './fancyInput';
2 | import type { FancyInputProps } from './types';
3 |
4 | export default function FancyInput({
5 | type,
6 | field,
7 | key,
8 | label,
9 | hidden,
10 | rules,
11 | tooltip,
12 | dependencies,
13 | ...props
14 | }: FancyInputProps) {
15 | const Input = inputs[type];
16 |
17 | if (!Input) {
18 | console.warn(`FancyInput: ${type} is not supported`);
19 | return <>Not supported yet;
20 | }
21 |
22 | return ;
23 | }
24 |
25 | export { add, remove };
26 |
--------------------------------------------------------------------------------
/frontend/src/components/FancyInput/types.ts:
--------------------------------------------------------------------------------
1 | import type { FormInstance, FormItemProps, Rule } from 'antd/es/form';
2 | import type { NamePath } from 'antd/es/form/interface';
3 |
4 | export interface FancyInputParams {
5 | /** form field type */
6 | type: string;
7 | /** form field name */
8 | field: string;
9 | /** uniq key */
10 | key: string;
11 | label?: React.ReactNode;
12 | disabled?: boolean;
13 | initialValue?: any;
14 | children?: FancyInputParams[];
15 | hidden?: boolean;
16 | tooltip?: string;
17 | rules?: Rule[];
18 | layout?: 'horizontal' | 'vertical';
19 | dependencies?: (string | number)[];
20 | fieldProps?: FormItemProps;
21 | renderFormItem?: (params: FancyInputParams, form: FormInstance, fullField: NamePath) => React.ReactNode;
22 | renderGroup?: (params: FancyInputParams, form: FormInstance, fullField: NamePath) => React.ReactNode;
23 | /** antd input component props, only in template definition */
24 | antProps?: Record;
25 | }
26 |
27 | export interface FancyInputProps {
28 | type: string;
29 | [key: string]: any;
30 | }
31 |
--------------------------------------------------------------------------------
/frontend/src/components/Help.tsx:
--------------------------------------------------------------------------------
1 | import { QuestionCircleOutlined } from '@ant-design/icons';
2 | import { Tooltip } from 'antd';
3 | import type { TooltipProps } from 'antd';
4 | import React from 'react';
5 |
6 | export default function Help({
7 | children,
8 | placement,
9 | className,
10 | }: React.PropsWithChildren<{
11 | placement?: TooltipProps['placement'];
12 | className?: string;
13 | }>) {
14 | return (
15 |
16 |
17 |
18 | );
19 | }
20 |
--------------------------------------------------------------------------------
/frontend/src/components/IconFont/index.tsx:
--------------------------------------------------------------------------------
1 | import { createFromIconfontCN } from '@ant-design/icons';
2 |
3 | const IconFont = createFromIconfontCN({
4 | scriptUrl: `/iconfont_3732290.js`,
5 | });
6 |
7 | export default IconFont;
8 |
--------------------------------------------------------------------------------
/frontend/src/components/Markdown/errorImage.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/opendatalab/LabelLLM/11f2a221f73c9625ec820bec8fc158c1ae16b8a9/frontend/src/components/Markdown/errorImage.png
--------------------------------------------------------------------------------
/frontend/src/components/MemberInvite/index.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { Button, Alert, Spin } from 'antd';
3 | import { RedoOutlined, InfoCircleOutlined } from '@ant-design/icons';
4 | import { useQuery } from '@tanstack/react-query';
5 | import dayjs from 'dayjs';
6 | import { CopyToClipboard } from 'react-copy-to-clipboard';
7 |
8 | import { message } from '@/components/StaticAnt';
9 | import { createInviteLink } from '@/api/team';
10 |
11 | interface IProps {
12 | teamId: string;
13 | }
14 |
15 | const Invite = ({ teamId }: IProps) => {
16 | const { data, refetch, isLoading, isFetching } = useQuery({
17 | queryKey: ['createInviteLink', teamId],
18 | queryFn: async () => createInviteLink({ team_id: teamId as string }),
19 | });
20 |
21 | const url = data?.link_id ? window.location.origin + '/supplier/join/' + data?.link_id : '';
22 | return (
23 | <>
24 | }
30 | />
31 | 操作方式：将链接发给成员，成员点击链接通过邀请加入团队
32 |
33 |
34 |
{url}
35 |
{
38 | message.success('复制成功');
39 | }}
40 | >
41 |
44 |
45 |
48 | {
51 | if (!isLoading) {
52 | refetch?.();
53 | }
54 | }}
55 | >
56 |
57 | 重新生成
58 |
59 | 有效期至 {dayjs(data?.expire_time).format('YYYY-MM-DD HH:mm:ss')}
60 |
61 |
62 | );
63 | };
64 |
65 | export default Invite;
66 |
--------------------------------------------------------------------------------
/frontend/src/components/MessageBox/index.tsx:
--------------------------------------------------------------------------------
1 | import type { PropsWithChildren } from 'react';
2 | import React from 'react';
3 | import type { VariantProps } from 'class-variance-authority';
4 | import { cva } from 'class-variance-authority';
5 | import clsx from 'clsx';
6 |
7 | const base = 'rounded-md inline-block py-2 px-5';
8 | const variants = cva(base, {
9 | variants: {
10 | type: {
11 | default: 'bg-white',
12 | secondary: 'chat-secondary',
13 | primary: 'chat-primary',
14 | },
15 | bordered: {
16 | true: 'border border-solid border-borderSecondary',
17 | },
18 | },
19 | defaultVariants: {
20 | type: 'default',
21 | },
22 | });
23 | // 消除框的基本样式
24 | interface IMessageBox extends VariantProps {
25 | className?: string;
26 | }
27 | const MessageBox: React.FC> = ({ type, bordered, className, children }) => {
28 | return {children}
;
29 | };
30 |
31 | export default MessageBox;
32 |
--------------------------------------------------------------------------------
/frontend/src/components/StaticAnt.tsx:
--------------------------------------------------------------------------------
1 | import { App } from 'antd';
2 | import type { MessageInstance } from 'antd/es/message/interface';
3 | import type { ModalStaticFunctions } from 'antd/es/modal/confirm';
4 | import type { NotificationInstance } from 'antd/es/notification/interface';
5 |
6 | let message: MessageInstance;
7 | let notification: NotificationInstance;
8 | let modal: Omit;
9 |
10 | export default () => {
11 | const staticFunction = App.useApp();
12 | message = staticFunction.message;
13 | modal = staticFunction.modal;
14 | notification = staticFunction.notification;
15 | return null;
16 | };
17 |
18 | export { message, notification, modal };
19 |
--------------------------------------------------------------------------------
/frontend/src/constant/chat.ts:
--------------------------------------------------------------------------------
1 | export const model = {
2 | name: 'PuYu000',
3 | description: '基于浦江PJLM-0进行了人类对齐训练的模型',
4 | };
5 |
6 | export enum EPlugins {
7 | calculator = 'calculator',
8 | equation = 'equation',
9 | search = 'search',
10 | }
11 |
12 | export const plugins = {
13 | [EPlugins.calculator]: {
14 | value: EPlugins.calculator,
15 | label: '计算器',
16 | desc: '执行加减乘除等数值运算',
17 | },
18 | [EPlugins.equation]: {
19 | value: EPlugins.equation,
20 | label: '解方程器',
21 | desc: '求解带有未知数的方程',
22 | },
23 | [EPlugins.search]: {
24 | value: EPlugins.search,
25 | label: '搜索',
26 | desc: '实时搜索引擎搜索',
27 | },
28 | };
29 | export enum EUserType {
30 | user = 'user',
31 | robot = 'robot',
32 | }
33 |
--------------------------------------------------------------------------------
/frontend/src/constant/query-key-factories/index.ts:
--------------------------------------------------------------------------------
1 | export * from './user';
2 |
--------------------------------------------------------------------------------
/frontend/src/constant/query-key-factories/user.ts:
--------------------------------------------------------------------------------
1 | // sso登录的用户信息
2 | export const userInfoKey = {
3 | all: ['ssoUserInfo'] as const,
4 | };
5 |
--------------------------------------------------------------------------------
/frontend/src/constant/queryClient.tsx:
--------------------------------------------------------------------------------
1 | import type { PropsWithChildren } from 'react';
2 | import React from 'react';
3 | import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
4 | import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
5 |
6 | // 创建一个 client
7 | const queryClient = new QueryClient({
8 | defaultOptions: {
9 | queries: {
10 | retry: false,
11 | refetchOnWindowFocus: false,
12 | },
13 | },
14 | });
15 |
16 | export const QueryProvider: React.FC = (props) => {
17 | return (
18 |
19 | {props.children}
20 | {import.meta.env.DEV && }
21 |
22 | );
23 | };
24 |
25 | export default queryClient;
26 |
--------------------------------------------------------------------------------
/frontend/src/constant/team.ts:
--------------------------------------------------------------------------------
1 | export const DEFAULT_TEAM = '00000000-0000-0000-0000-000000000000';
2 |
--------------------------------------------------------------------------------
/frontend/src/hooks/useLang.ts:
--------------------------------------------------------------------------------
1 | import { useQueryClient, useQuery } from '@tanstack/react-query';
2 | import store from 'storejs';
3 |
4 | const UseLang = () => {
5 | const queryClient = useQueryClient();
6 |
7 | const query = useQuery({
8 | queryKey: ['lang'],
9 | queryFn: async () => store.get('lang') || 'zh-CN',
10 | });
11 | // 更新
12 | const setLang = (value: 'zh-CN' | 'en-US') => {
13 | store.set('lang', value);
14 | queryClient.refetchQueries({ queryKey: ['lang'] });
15 | };
16 | return { setLang, lang: query.data, isZh: query.data === 'zh-CN' };
17 | };
18 |
19 | export default UseLang;
20 |
--------------------------------------------------------------------------------
/frontend/src/hooks/useStoreIds.ts:
--------------------------------------------------------------------------------
1 | import { message } from '@/components/StaticAnt';
2 | import { useIntl } from 'react-intl';
3 | import store from 'storejs';
4 |
5 | export type TStoreKey = 'data_id' | 'questionnaire_id';
6 | export const useStoreIds = () => {
7 | const { formatMessage } = useIntl();
8 | // 保存 ids 区分
9 | const saveIds = async (key: TStoreKey, val: string) => {
10 | // val 转数组 过滤空字符串
11 | store.set(
12 | key,
13 | val
14 | .split('\n')
15 | ?.map((item) => item.trim())
16 | .filter(Boolean),
17 | );
18 | };
19 |
20 | const getIds = (key: TStoreKey) => {
21 | return store.get(key) || [];
22 | };
23 |
24 | // 上一题 下一题
25 | const nextId = (id: string, key: TStoreKey, n: 1 | -1) => {
26 | const ids = getIds(key);
27 | // 获取当前 id 下标
28 | const index = ids.indexOf(id);
29 | // 获取上一个或下一个id
30 | const nextIndex = index + n;
31 | // 检查索引是否越界
32 | if (nextIndex < 0 || nextIndex >= ids.length) {
33 | message.warning(formatMessage({ id: 'task.error.msg2' }));
34 | return null;
35 | }
36 |
37 | return ids[nextIndex];
38 | };
39 |
40 | const clearAll = () => {
41 | // 退出当前页面 关闭tab都需要清除浏览器缓存 缓存的 id
42 | store.remove('data_id');
43 | store.remove('questionnaire_id');
44 | };
45 |
46 | return { saveIds, getIds, clearAll, nextId };
47 | };
48 |
--------------------------------------------------------------------------------
/frontend/src/initialize.tsx:
--------------------------------------------------------------------------------
1 | import type { TooltipPropsWithTitle } from 'antd/lib/tooltip';
2 | import React from 'react';
3 |
4 | /**
5 | * 此文件用于应用初始化时的准备工作，比如一些注册处理函数，库的初始配置等
6 | */
7 |
8 | declare global {
9 | interface Window {
10 | // 是否开发环境
11 | DEV: boolean;
12 | }
13 | }
14 |
15 | // ==========================【formatter】=========================
16 |
17 | interface EllipseOption extends TooltipPropsWithTitle {
18 | maxWidth?: Pick | string;
19 | maxLength: number;
20 | type?: 'tooltip' | 'popover';
21 | }
22 |
--------------------------------------------------------------------------------
/frontend/src/loaders/sso.loader.ts:
--------------------------------------------------------------------------------
1 | import type { LoaderFunctionArgs } from 'react-router-dom';
2 |
3 | import { getUserInfo } from '@/api/user';
4 | import queryClient from '@/constant/queryClient';
5 | import { userInfoKey } from '@/constant/query-key-factories';
6 |
7 | export async function ssoLoader({ request }: LoaderFunctionArgs) {
8 | try {
9 | // 往react-router中注入用户信息
10 | return await queryClient.fetchQuery({
11 | queryKey: userInfoKey.all,
12 | queryFn: getUserInfo,
13 | staleTime: Infinity,
14 | gcTime: Infinity,
15 | });
16 | } catch (err) {
17 | console.error(err);
18 | return null;
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/frontend/src/locales/index.ts:
--------------------------------------------------------------------------------
1 | import zhCN from './zh-CN';
2 | import enUS from './en-US';
3 |
4 | export default {
5 | 'zh-CN': zhCN,
6 | 'en-US': enUS,
7 | } as Record;
8 |
--------------------------------------------------------------------------------
/frontend/src/styles/font/iconfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/opendatalab/LabelLLM/11f2a221f73c9625ec820bec8fc158c1ae16b8a9/frontend/src/styles/font/iconfont.ttf
--------------------------------------------------------------------------------
/frontend/src/styles/font/iconfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/opendatalab/LabelLLM/11f2a221f73c9625ec820bec8fc158c1ae16b8a9/frontend/src/styles/font/iconfont.woff
--------------------------------------------------------------------------------
/frontend/src/styles/font/iconfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/opendatalab/LabelLLM/11f2a221f73c9625ec820bec8fc158c1ae16b8a9/frontend/src/styles/font/iconfont.woff2
--------------------------------------------------------------------------------
/frontend/src/styles/index.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;
4 |
--------------------------------------------------------------------------------
/frontend/src/styles/theme.json:
--------------------------------------------------------------------------------
1 | {
2 | "token": {
3 | "blue": "#0D53DE",
4 | "colorPrimary": "#0D53DE",
5 | "colorSuccess": "#00b365",
6 | "colorWarning": "#ff8800",
7 | "colorError": "#f5483b",
8 | "colorText": "rgba(18, 19, 22, 0.8)",
9 | "colorTextSecondary": "rgba(18, 19, 22, 0.5)",
10 | "colorTextTertiary": "rgba(18, 19, 22, 0.25)",
11 | "colorTextQuaternary": "rgba(18, 19, 22, 0.20)",
12 | "colorBorder": "#D7D8DD",
13 | "borderRadius": 6,
14 | "colorBorderSecondary": "#EBECF0",
15 | "colorInfo": "#0D53DE",
16 | "boxShadow": " 0 8px 26px 0 rgba(18, 19, 22, 0.12), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05) ",
17 | "boxShadowSecondary": " 0 4px 12px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05) ",
18 | "wireframe": false
19 | },
20 | "components": {
21 | "Button": {
22 | "controlHeight": 36,
23 | "marginXS": 4
24 | },
25 | "Input": {
26 | "colorBorder": "#EBECF0",
27 | "controlHeight": 36
28 | },
29 | "Select": {
30 | "colorBorder": "#EBECF0",
31 | "controlHeight": 36
32 | },
33 | "Table": {
34 | "borderRadiusLG": 8,
35 | "padding": 24
36 | }
37 | }
38 | }
39 |
--------------------------------------------------------------------------------
/frontend/src/utils/getUrlExtension.ts:
--------------------------------------------------------------------------------
1 | export function getUrlExtension(url: string): string {
2 | const urlWithoutQuery = url.split('?')[0];
3 | return urlWithoutQuery.split('.').pop()?.toLowerCase() || '';
4 | }
5 |
--------------------------------------------------------------------------------
/frontend/src/utils/gid.ts:
--------------------------------------------------------------------------------
1 | export function gid() {
2 | return `_${Math.random().toString(36).substr(2, 9)}`;
3 | }
4 |
--------------------------------------------------------------------------------
/frontend/src/utils/parseDocumentType.ts:
--------------------------------------------------------------------------------
1 | export function parseDocumentType(url: string) {
2 | const urlWithoutQuery = url.split('?')[0];
3 | const extension = urlWithoutQuery.split('.').pop();
4 | console.log(extension);
5 | return extension?.toLowerCase() || '';
6 | }
7 |
--------------------------------------------------------------------------------
/frontend/src/utils/sso.ts:
--------------------------------------------------------------------------------
1 | /** 前往登录页 */
2 | export function goLogin() {
3 | // window.location.href = getUAA(sso?.login || '');
4 | window.location.href = '/login';
5 | }
6 |
--------------------------------------------------------------------------------
/frontend/src/vite-env.d.ts:
--------------------------------------------------------------------------------
1 | ///
2 | ///
3 |
--------------------------------------------------------------------------------
/frontend/src/wrappers/RequireSSO.tsx:
--------------------------------------------------------------------------------
1 | import { useRouteLoaderData } from 'react-router-dom';
2 |
3 | import { goLogin } from '@/utils/sso';
4 |
5 | export default function RequireAuth({ children }: { children: JSX.Element }) {
6 | const auth = useRouteLoaderData('root');
7 |
8 | if (!auth) {
9 | goLogin();
10 |
11 | return null;
12 | }
13 |
14 | return children;
15 | }
16 |
--------------------------------------------------------------------------------
/frontend/tailwind.config.js:
--------------------------------------------------------------------------------
1 | /** @type {import('tailwindcss').Config} */
2 | module.exports = {
3 | content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
4 | theme: {
5 | extend: {
6 | colors: {
7 | primary: '#0d53de',
8 | success: '#00b365',
9 | warning: '#ff8800',
10 | error: '#f5483b',
11 | 'base-color': '#121316',
12 | color: 'rgba(18, 19, 22, 0.8)',
13 | secondary: 'rgba(18, 19, 22, 0.5)',
14 | tertiary: 'rgba(18, 19, 22, 0.25)',
15 | quaternary: 'rgba(18, 19, 22, 0.20)',
16 | // ICON 颜色
17 | icon: '#4A4653',
18 | fill: '#b4b6bc', // 一级填充色
19 | 'fill-secondary': '#EBECF0', // 二级填充色
20 | 'fill-tertiary': '#F4F5F9', // 三级填充色
21 | 'fill-quaternary': '#f9f9f9', // 四级填充色
22 | colorBorder: '#D7D8DD',
23 | borderSecondary: '#EBECF0',
24 | borderRadius: 2,
25 | },
26 | transitionTimingFunction: {
27 | 'in-expo': 'cubic-bezier(0.95, 0.05, 0.795, 0.035)',
28 | 'out-expo': 'cubic-bezier(0.19, 1, 0.22, 1)',
29 | },
30 | },
31 | },
32 | plugins: [],
33 | corePlugins: {
34 | preflight: false,
35 | },
36 | };
37 |
--------------------------------------------------------------------------------
/frontend/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "ts-node": {
3 | "esm": true,
4 | "compilerOptions": {
5 | "module": "CommonJS",
6 | "esModuleInterop": true,
7 | "moduleResolution": "node"
8 | }
9 | },
10 | "compilerOptions": {
11 | "lib": ["ES2022", "DOM", "DOM.Iterable"],
12 | "module": "ESNext",
13 | "target": "ES2015",
14 | "composite": false,
15 | "declaration": true,
16 | "declarationMap": false,
17 | "downlevelIteration": true,
18 | "esModuleInterop": true,
19 | "forceConsistentCasingInFileNames": true,
20 | "inlineSources": false,
21 | "isolatedModules": true,
22 | "moduleResolution": "node",
23 | "resolveJsonModule": true,
24 | "noUnusedLocals": false,
25 | "noUnusedParameters": false,
26 | "preserveWatchOutput": true,
27 | "skipLibCheck": true,
28 | "strict": true,
29 | "baseUrl": "./",
30 | "jsx": "react-jsx",
31 | "allowJs": true,
32 | "noEmit": true,
33 | "noFallthroughCasesInSwitch": true,
34 | "allowSyntheticDefaultImports": true,
35 | "types": ["node", "vite/client"],
36 | "paths": {
37 | "@/*": ["./src/*"]
38 | }
39 | },
40 | "include": ["src", "scripts", ".eslintrc.js", "vite.config.dev.ts", "vite.config.prod.ts", "rollup.config.ts"],
41 | "exclude": ["node_modules", "**/*.test.tsx", "**/*.test.ts"]
42 | }
43 |
--------------------------------------------------------------------------------
/frontend/tsconfig.util.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "lib": ["ES2022"],
4 | "module": "CommonJS",
5 | "target": "ES2015",
6 | "composite": false,
7 | "declaration": false,
8 | "declarationMap": false,
9 | "downlevelIteration": true,
10 | "esModuleInterop": true,
11 | "forceConsistentCasingInFileNames": true,
12 | "inlineSources": false,
13 | "isolatedModules": true,
14 | "moduleResolution": "node",
15 | "resolveJsonModule": false,
16 | "noUnusedLocals": false,
17 | "noUnusedParameters": false,
18 | "preserveWatchOutput": true,
19 | "skipLibCheck": true,
20 | "strict": true,
21 | "baseUrl": "./",
22 | "jsx": "react-jsx",
23 | "allowJs": true,
24 | "noEmit": true
25 | },
26 | "include": ["scripts"],
27 | "exclude": ["node_modules", "**/*.test.tsx", "**/*.test.ts"]
28 | }
29 |
--------------------------------------------------------------------------------
/frontend/vite.config.dev.ts:
--------------------------------------------------------------------------------
1 | import { join, relative, resolve } from 'path';
2 |
3 | import { defineConfig } from 'vite';
4 | import react from '@vitejs/plugin-react';
5 | import svgr from 'vite-plugin-svgr';
6 | import { ViteEjsPlugin } from 'vite-plugin-ejs';
7 |
8 | const appDir = process.env.APP_DIR || 'src/apps/login';
9 |
10 | // https://vitejs.dev/config/
11 | export default defineConfig({
12 | base: '/',
13 | publicDir: resolve(__dirname, 'public'),
14 | server: {
15 | host: true,
16 | port: 3000,
17 | proxy: {
18 | '/api': {
19 | target: 'http://10.6.16.145:16666/',
20 | changeOrigin: true,
21 | },
22 | },
23 | },
24 |
25 | optimizeDeps: {
26 | include: ['react/jsx-runtime'],
27 | },
28 | css: {
29 | modules: {
30 | localsConvention: 'camelCaseOnly',
31 | },
32 | },
33 |
34 | plugins: [
35 | react(),
36 | svgr(),
37 | ViteEjsPlugin({
38 | // root: resolve(__dirname, appDir),
39 | root: join(__dirname, relative(__dirname, resolve(appDir))),
40 | }),
41 | ].filter(Boolean),
42 |
43 | resolve: {
44 | alias: {
45 | '@': resolve(__dirname, 'src/'),
46 | },
47 | },
48 | });
49 |
--------------------------------------------------------------------------------
/release-notes.md:
--------------------------------------------------------------------------------
1 | # Release Notes
2 |
3 | ## Latest Changes
4 |
--------------------------------------------------------------------------------