feat/workorder (#3860)

* feat: workorder

* pref: workorder button

* chore: move workorder to common

* chore: format code

* pref: style

projects/app/src/components/Layout/auth.tsx

@@ -3,6 +3,7 @@ import { useUserStore } from '@/web/support/user/useUserStore';
 import { useQuery } from '@tanstack/react-query';
 import { useTranslation } from 'next-i18next';
 import { useToast } from '@fastgpt/web/hooks/useToast';
+import { useSystemStore } from '@/web/common/system/useSystemStore';
 
 const unAuthPage: { [key: string]: boolean } = {
   '/': true,

projects/app/src/components/Layout/index.tsx

@@ -14,6 +14,7 @@ import { useSystem } from '@fastgpt/web/hooks/useSystem';
 import { useDebounceEffect, useMount } from 'ahooks';
 import { useTranslation } from 'next-i18next';
 import { useToast } from '@fastgpt/web/hooks/useToast';
+import WorkorderButton from '../support/workorder/WorkorderButton';
 
 const Navbar = dynamic(() => import('./navbar'));
 const NavbarPhone = dynamic(() => import('./navbarPhone'));
@@ -121,6 +122,7 @@ const Layout = ({ children }: { children: JSX.Element }) => {
               <Auth>
                 <Box h={'100%'} position={'fixed'} left={0} top={0} w={navbarWidth}>
                   <Navbar unread={unread} />
+                  {feConfigs.show_workorder && <WorkorderButton />}
                 </Box>
                 <Box h={'100%'} ml={navbarWidth} overflow={'overlay'}>
                   {children}

projects/app/src/components/support/workorder/WorkorderButton.tsx

@@ -0,0 +1,112 @@
+import { getWorkorderURL } from '@/web/common/workorder/api';
+import { Box, Flex } from '@chakra-ui/react';
+import Icon from '@fastgpt/web/components/common/Icon';
+import { useRequest2 } from '@fastgpt/web/hooks/useRequest';
+import { useToggle } from 'ahooks';
+import { useTranslation } from 'next-i18next';
+
+function WorkorderButton() {
+  const [open, setOpen] = useToggle(true);
+  const { t } = useTranslation();
+
+  const { data, runAsync } = useRequest2(getWorkorderURL, {
+    manual: true
+  });
+
+  const onFeedback = async () => {
+    await runAsync();
+    if (data) {
+      window.open(data.redirectUrl);
+    }
+  };
+  return (
+    <>
+      {open ? (
+        <Flex
+          position="fixed"
+          bottom="20%"
+          right="0"
+          height="62px"
+          width="58px"
+          zIndex={100}
+          boxShadow="0px 12px 32px -4px #00175633"
+          alignItems="center"
+          justifyContent="center"
+          direction="column"
+          borderTopLeftRadius="8px"
+          borderBottomLeftRadius="8px"
+          border={'1px'}
+          borderColor={'#DFE6F2'}
+        >
+          <Box
+            zIndex={101}
+            width="14px"
+            height="14px"
+            position="absolute"
+            left="-6px"
+            top="-6px"
+            borderRadius="full"
+            background="white"
+            border="1px"
+            borderColor={'myGray.25'}
+            bgColor="myGray.25"
+            _hover={{
+              cursor: 'pointer',
+              bgColor: 'myGray.100'
+            }}
+            onClick={() => setOpen.set(false)}
+          >
+            <Icon name="close" />
+          </Box>
+          <Flex
+            alignItems="center"
+            justifyContent="center"
+            direction="column"
+            bgColor="myGray.25"
+            _hover={{
+              cursor: 'pointer',
+              bgColor: 'myGray.100'
+            }}
+            width="100%"
+            height="100%"
+            borderTopLeftRadius="8px"
+            borderBottomLeftRadius="8px"
+            onClick={onFeedback}
+          >
+            <Icon name="feedback" width="28px" height="28px" />
+            <Box fontSize="11px" fontWeight="500">
+              {t('common:question_feedback')}
+            </Box>
+          </Flex>
+        </Flex>
+      ) : (
+        <Flex
+          position="fixed"
+          bottom="20%"
+          right="0"
+          height="44px"
+          width="19px"
+          bgColor="myGray.25"
+          borderTopLeftRadius="8px"
+          borderBottomLeftRadius="8px"
+          border={'1px'}
+          borderColor={'#DFE6F2'}
+          zIndex={100}
+          boxShadow="0px 12px 32px -4px #00175633"
+          alignItems="center"
+          justifyContent="center"
+          direction="column"
+          _hover={{
+            cursor: 'pointer',
+            bgColor: 'myGray.100'
+          }}
+          onClick={() => setOpen.set(true)}
+        >
+          <Icon name="core/chat/chevronLeft" width="16px" height="16px" />
+        </Flex>
+      )}
+    </>
+  );
+}
+
+export default WorkorderButton;

projects/app/src/pageComponents/account/team/context.tsx

@@ -92,7 +92,7 @@ export const TeamModalContextProvider = ({ children }: { children: ReactNode })
     total: memberTotal,
     ScrollData: MemberScrollData
   } = useScrollPagination(getTeamMembers, {
-    pageSize: 20,
+    pageSize: 1000,
     params: {
       withLeaved: true
     }

projects/app/src/web/common/workorder/api.ts

@@ -0,0 +1,5 @@
+import { GET } from '@/web/common/api/request';
+export const getWorkorderURL = () =>
+  GET<{
+    redirectUrl: string;
+  }>('/proApi/common/workorder/create');