Merge pull request #13 from eolinker/feature/simplified_permissions

修改样式
eolinker · Aug 12, 2024 · 79a6dd2 · 79a6dd2
2 parents 8923343 + 1763525
commit 79a6dd2
Show file tree

Hide file tree

Showing 56 changed files with 304 additions and 282 deletions.
diff --git a/frontend/packages/businessEntry/src/App.tsx b/frontend/packages/businessEntry/src/App.tsx
@@ -10,8 +10,8 @@ import ThemeSwitcher from '@common/components/aoplatform/ThemeSwitcher'
 const antdComponentThemeToken = {
   token: {
     // Seed Token，影响范围大
-    colorPrimary: '#7371fc',
-    colorLink:'#7371fc',
+    colorPrimary: '#3D46F2',
+    colorLink:'#3D46F2',
     colorBorder:'#ededed',
     colorText:'#333',
     borderRadius: 4,
@@ -38,7 +38,7 @@ const antdComponentThemeToken = {
       optionHoverBg:'#EBEEF2'
     },
     Layout: {
-      bodyBg: 'linear-gradient(107.97deg, rgba(32,41,117,1) 4.41%,rgba(16,13,27,1) 86.11%);',
+      bodyBg: '#17163E',
       headerBg: 'transparent',
       headerColor: '#333',
       headerPadding: '10 20px',

diff --git a/frontend/packages/common/src/components/aoplatform/BasicLayout.tsx b/frontend/packages/common/src/components/aoplatform/BasicLayout.tsx
@@ -21,7 +21,7 @@ import { UserInfoType, UserProfileHandle } from '@common/const/type.ts';
 import { useFetch } from '@common/hooks/http.ts';
 
 const themeToken = {
-    bgLayout:'linear-gradient(107.97deg, rgba(32,41,117,1) 4.41%,rgba(16,13,27,1) 86.11%);',
+    bgLayout:'#17163E;',
     header: {
         heightLayoutHeader:72
     },
@@ -164,7 +164,6 @@ const themeToken = {
         })
     }
 
-
     return(
         <div
             id="test-pro-layout"
@@ -184,7 +183,7 @@ const themeToken = {
                 location={{
                     pathname,
                 }}
-                siderWidth={212}
+                siderWidth={220}
                 breakpoint={'lg'}
                 route={headerMenuData}
                 token={themeToken}
@@ -260,7 +259,7 @@ const themeToken = {
                 collapsed={false}
                 collapsedButtonRender={false}
                 >
-                  <div className="w-full h-calc-100vh-minus-navbar px-[40px] py-[30px]">
+                  <div className={`w-full h-calc-100vh-minus-navbar px-[40px] pt-[30px] ${currentUrl.startsWith('/role/list') ? 'overflow-auto' : 'overflow-hidden' }`}>
                     <Outlet />
                   </div>
                 </ProLayout>

diff --git a/frontend/packages/common/src/components/aoplatform/InsidePage.tsx b/frontend/packages/common/src/components/aoplatform/InsidePage.tsx
@@ -3,7 +3,7 @@ import { Button, Tag } from "antd"
 import {useNavigate} from "react-router-dom";
 import WithPermission from "@common/components/aoplatform/WithPermission";
 import { FC, ReactNode } from "react";
-import { LeftOutlined } from "@ant-design/icons";
+import { ArrowLeftOutlined, LeftOutlined } from "@ant-design/icons";
 
 
 class InsidePageProps {
@@ -28,11 +28,13 @@ const InsidePage:FC<InsidePageProps> = ({showBanner=true,pageTitle,tagList,showB
     return (
         // <div className="h-full flex flex-col flex-1 overflow-hidden bg-[#f7f8fa]">
         <div className="h-full flex flex-col flex-1 overflow-hidden  ">
-            { showBanner &&  <div className="p-btnbase  mx-[4px] border-[0px] border-b-[1px] border-solid border-BORDER">
-                {backUrl && <p className="mb-[16px] h-[20px] "><a className="leading-[20px] inline-block "onClick={goBack}> <LeftOutlined /> 返回</a></p>}
+            { showBanner &&  <div className="  mx-[4px] border-[0px] border-b-[1px] border-solid border-BORDER">
+                {backUrl &&<div className="text-[18px] leading-[25px] pb-[12px]">
+                        <Button type="text" onClick={goBack}><ArrowLeftOutlined className="max-h-[14px]" />返回</Button>
+                    </div>}
                 <div className="flex justify-between">
                     <div className="flex items-center">
-                        <span className="text-[20px] mr-[8px] leading-[32px]">{pageTitle}</span>
+                        <p className="text-theme text-[26px] pr-[10px]">{pageTitle}</p>
                         {tagList && tagList?.length > 0 && tagList?.map((tag)=>{
                             return ( <Tag className="" key={tag.label as string} bordered={false} >{tag.label}</Tag>)
                         })}
@@ -41,7 +43,7 @@ const InsidePage:FC<InsidePageProps> = ({showBanner=true,pageTitle,tagList,showB
                         onBtnClick&&onBtnClick()
                     }}>{btnTitle}</Button></WithPermission>}
                 </div>
-                <p className="text-[14px] leading-[22px] text-[#999]">
+                <p className="mb-[30px]">
                     {description}
                 </p>
             </div>}

diff --git a/frontend/packages/common/src/components/aoplatform/InsidePageForHub.tsx b/frontend/packages/common/src/components/aoplatform/InsidePageForHub.tsx
@@ -3,6 +3,7 @@ import { Button, Tag } from "antd"
 import {useNavigate} from "react-router-dom";
 import WithPermission from "@common/components/aoplatform/WithPermission";
 import { FC, ReactNode } from "react";
+import { ArrowLeftOutlined } from "@ant-design/icons";
 
 
 class InsidePageProps {
@@ -27,10 +28,12 @@ const InsidePageForHub:FC<InsidePageProps> = ({showBanner=true,pageTitle,tagList
     return (
         <div className="h-full flex flex-col flex-1 overflow-hidden max-w-[1500px] m-auto">
             { showBanner &&  <div className="p-btnbase  mx-[4px]">
-                <p className="mb-[16px] h-[20px] "><a className="leading-[20px] inline-block "onClick={goBack}> {"<  返回列表"}</a></p>
+                <div className="text-[18px] leading-[25px] pb-[12px]">
+                        <Button type="text" onClick={goBack}><ArrowLeftOutlined className="max-h-[14px]" />返回</Button>
+                    </div>
                 <div className="flex justify-between">
                     <div className="">
-                        <span className="text-[20px] font-bold">{pageTitle}</span>
+                        <span className="text-[26px] text-theme">{pageTitle}</span>
                         {tagList && tagList?.length > 0 && tagList?.map((tag)=>{
                             return ( <Tag key={tag.label as string} bordered={false}>{tag.label}</Tag>)
                         })}
@@ -39,7 +42,7 @@ const InsidePageForHub:FC<InsidePageProps> = ({showBanner=true,pageTitle,tagList
                         onBtnClick&&onBtnClick()
                     }}>{btnTitle}</Button></WithPermission>}
                 </div>
-                <p className="text-[14px] leading-[22px] text-[#999]">
+                <p className="mb-[30px]">
                     {description}
                 </p>
             </div>}

diff --git a/frontend/packages/common/src/components/aoplatform/Navigation.tsx b/frontend/packages/common/src/components/aoplatform/Navigation.tsx
@@ -27,10 +27,10 @@ export const routerKeyMap = new Map<string, string[]|string>([
 export const TOTAL_MENU_ITEMS: MenuProps['items'] = [
 
   getNavItem('工作空间', 'workspace','/tenantManagement',<Icon icon="ic:baseline-space-dashboard" width="18" height="18"/>, [
-    getNavItem('我的', 'my','/tenantManagement',<Icon icon="ic:baseline-home" width="18" height="18"/>,[
-      getNavItem(<a>应用</a>, 'tenantManagement','/tenantManagement',null,undefined,undefined,''),
-      getNavItem(<a>服务</a>, 'service','/service',null,undefined,undefined,''),
-      getNavItem(<a>团队</a>, 'team','/team',null,undefined,undefined,''),
+    getNavItem('我的', 'my','/tenantManagement',null,[
+      getNavItem(<a>应用</a>, 'tenantManagement','/tenantManagement',<Icon icon="ic:baseline-apps" width="18" height="18"/>,undefined,undefined,''),
+      getNavItem(<a>服务</a>, 'service','/service',<Icon icon="ic:baseline-blinds-closed" width="18" height="18"/>,undefined,undefined,''),
+      getNavItem(<a>团队</a>, 'team','/team',<Icon icon="ic:baseline-people-alt" width="18" height="18"/>,undefined,undefined,''),
     ],undefined,''),
       getNavItem(<a>API 市场</a>, 'serviceHub','/serviceHub',<Icon icon="ic:baseline-hub" width="18" height="18"/>,undefined,undefined,'system.workspace.api_market.view'),
   ]),
@@ -42,18 +42,18 @@ export const TOTAL_MENU_ITEMS: MenuProps['items'] = [
   ]):null,
 
   getNavItem('系统设置', 'operationCenter','/member',<Icon icon="ic:baseline-settings" width="18" height="18"/>, [
-    getNavItem('组织', 'organization','/member',<Icon icon="ic:baseline-people-alt" width="18" height="18"/>,[
-      getNavItem(<a>成员</a>, 'member','/member',null,undefined,undefined,'system.organization.member.view'),
-      getNavItem(<a>角色</a>, 'role','/role',null,undefined,undefined,'system.organization.role.view'),
+    getNavItem('组织', 'organization','/member',null,[
+      getNavItem(<a>成员</a>, 'member','/member',<Icon icon="ic:baseline-people-alt" width="18" height="18"/>,undefined,undefined,'system.organization.member.view'),
+      getNavItem(<a>角色</a>, 'role','/role',<Icon icon="ic:baseline-verified-user" width="18" height="18"/>,undefined,undefined,'system.organization.role.view'),
     ],undefined,''),
-    getNavItem('API 市场', 'serviceHubSetting','/servicecategories',<Icon icon="ic:baseline-hub" width="18" height="18"/>,[
-      getNavItem(<a>服务分类管理</a>, 'servicecategories','/servicecategories',null,undefined,undefined,'system.api_market.service_classification.view'),
+    getNavItem('API 市场', 'serviceHubSetting','/servicecategories',null,[
+      getNavItem(<a>服务分类管理</a>, 'servicecategories','/servicecategories',<Icon icon="ic:baseline-hub" width="18" height="18"/>,undefined,undefined,'system.api_market.service_classification.view'),
     ],undefined,'system.api_market.service_classification.view'),
 
-    getNavItem('运维与集成', 'maintenanceCenter','/cluster', <Icon icon="ic:baseline-memory" width="18" height="18"/>, [
-      getNavItem(<a>集群</a>, 'cluster','/cluster',null,undefined,undefined,'system.devops.cluster.view'),
-      getNavItem(<a>证书</a>, 'cert','/cert',null,undefined,undefined,'system.devops.ssl_certificate.view'),
-      getNavItem(<a>日志</a>, 'logsettings','/logsettings',null,undefined,undefined,'system.devops.log_configuration.view'),
+    getNavItem('运维与集成', 'maintenanceCenter','/cluster', null, [
+      getNavItem(<a>集群</a>, 'cluster','/cluster',<Icon icon="ic:baseline-device-hub" width="18" height="18"/>,undefined,undefined,'system.devops.cluster.view'),
+      getNavItem(<a>证书</a>, 'cert','/cert',<Icon icon="ic:baseline-security" width="18" height="18"/>,undefined,undefined,'system.devops.ssl_certificate.view'),
+      getNavItem(<a>日志</a>, 'logsettings','/logsettings',<Icon icon="ic:baseline-sticky-note-2" width="18" height="18"/>,undefined,undefined,'system.devops.log_configuration.view'),
       APP_MODE === 'pro' ? getNavItem(<a>资源</a>, 'resourcesettings','/resourcesettings',null,undefined,undefined,'system.partition.self.view'):null,
       APP_MODE === 'pro' ? getNavItem(<a>Open API</a>, 'openapi','/openapi',null,undefined,undefined,'system.openapi.self.view'):null,
     ]),

diff --git a/frontend/packages/common/src/components/aoplatform/PageList.module.css b/frontend/packages/common/src/components/aoplatform/PageList.module.css
@@ -19,7 +19,7 @@
     .ant-table-pagination.ant-pagination {
         margin: 1px 10px 0 !important;
         padding:  10px 0;
-        box-shadow: 0 -2px 2px -2px var(--border-color);
+        /* box-shadow: 0 -2px 2px -2px var(--border-color); */
     }
     .ant-table.ant-table-middle{
         .ant-table-thead>tr>th,
@@ -34,10 +34,6 @@
         }
 
 
-        .ant-table-tbody>tr>td,
-        .ant-table-cell{
-            padding:9px 10px 8px;
-        }
         .ant-table-thead>tr>th{
             color:#666666;
             font-weight:normal;

diff --git a/frontend/packages/common/src/components/aoplatform/PageList.tsx b/frontend/packages/common/src/components/aoplatform/PageList.tsx
@@ -75,17 +75,17 @@ const PageList = <T extends Record<string, unknown>>(props: React.PropsWithChild
 
   useEffect(() => {
     const handleResize = () => {
-      if (parentRef.current) {
+      if (parentRef.current && !noScroll) {
         const res = parentRef.current.getBoundingClientRect();
-        const height = res.height - ((noTop ? 0 : 52) + 40 + (showPagination && !dragSortKey ? 52 : 0)); // 减去顶部按钮、底部分页、表头高度
+        const height = res.height - ((noTop ? 0 : 52) + 40 + (showPagination && !dragSortKey ? 52 : 0) +( besidesTableHeight ?? 0)); // 减去顶部按钮、底部分页、表头高度
         setTableWidth(minTableWidth > res.width ? minTableWidth : undefined);
         height && setTableHeight(minVirtualHeight === undefined ? height : (height > minVirtualHeight ? height : minVirtualHeight));
       }
     };
 
     const debouncedHandleResize = debounce(handleResize, 200);
 
-    if (!resizeObserverRef.current || noScroll) {
+    if (!resizeObserverRef.current && !noScroll) {
       // 创建一个 ResizeObserver 来监听高度变化，只创建一次
       resizeObserverRef.current = new ResizeObserver(debouncedHandleResize);
       // 开始监听

diff --git a/frontend/packages/common/src/components/aoplatform/SubscribeApprovalModalContent.tsx b/frontend/packages/common/src/components/aoplatform/SubscribeApprovalModalContent.tsx
@@ -112,7 +112,7 @@ export const SubscribeApprovalModalContent = forwardRef<SubscribeApprovalModalHa
                     label="申请原因"
                     name="reason"
                 >
-                    <Input.TextArea className="w-INPUT_NORMAL" disabled={true} placeholder="请输入"  />
+                    <Input.TextArea className="w-INPUT_NORMAL" disabled={true} placeholder=" "  />
                 </Form.Item>
                 <Form.Item<FieldType>
                     label="审核意见"

diff --git a/...nd/packages/common/src/components/aoplatform/intelligent-plugin/IntelligentPluginList.tsx b/...nd/packages/common/src/components/aoplatform/intelligent-plugin/IntelligentPluginList.tsx
@@ -301,8 +301,8 @@ export default function IntelligentPluginList(){
             footer:(_, { OkBtn, CancelBtn }) =>{
                 return (
                         <>
-                            <WithPermission access="system.partition.self.edit"><CancelBtn/></WithPermission>
-                            <WithPermission access="system.partition.self.edit"><OkBtn/></WithPermission>
+                            <WithPermission access=""><CancelBtn/></WithPermission>
+                            <WithPermission access=""><OkBtn/></WithPermission>
                         </>
                 );
             },
@@ -330,7 +330,7 @@ export default function IntelligentPluginList(){
             onSearchWordChange={(e)=>{setSearchWord(e.target.value);setTableHttpReload(true);setTableHttpReload(true)}}
         />
 
-        <DrawerWithFooter title={`${drawerType === 'add' ? '添加' : '编辑'}${pluginName }`} open={drawerOpen} onClose={()=>{setCurDetail(undefined);setDrawerOpen(false)}} onSubmit={()=>drawerFormRef.current?.save()?.then((res)=>{res && manualReloadTable();return res})}  submitAccess='system.partition.self.edit'>
+        <DrawerWithFooter title={`${drawerType === 'add' ? '添加' : '编辑'}${pluginName }`} open={drawerOpen} onClose={()=>{setCurDetail(undefined);setDrawerOpen(false)}} onSubmit={()=>drawerFormRef.current?.save()?.then((res)=>{res && manualReloadTable();return res})}  submitAccess=''>
             <Spin indicator={<LoadingOutlined style={{ fontSize: 24 }} spin/>} spinning={drawerLoading}>
                 <IntelligentPluginConfig 
                     ref={drawerFormRef!} 

diff --git a/frontend/packages/common/src/components/postcat/ApiEdit.tsx b/frontend/packages/common/src/components/postcat/ApiEdit.tsx
@@ -32,7 +32,7 @@ interface ApiNameHandle{
 export const theme = createTheme({
     palette: {
       primary: {
-        main: '#7371fc', // 自定义主色调
+        main: '#3D46F2', // 自定义主色调
       },
       text: {
         primary: '#333', // 主要文字颜色
@@ -58,11 +58,11 @@ export const theme = createTheme({
                   color: '#BBB', // 设置 placeholder 的颜色
                 },
                 '&:hover:not(.Mui-disabled):not(.Mui-focused):not(.Mui-error)': {
-                  borderColor: '#7371fc', // 设置 hover 时的边框颜色
+                  borderColor: '#3D46F2', // 设置 hover 时的边框颜色
                   borderWidth: '1px', // 设置边框粗细
                 },
                 '&.Mui-focused': {
-                  borderColor: '#7371fc', // 设置选中时的边框颜色
+                  borderColor: '#3D46F2', // 设置选中时的边框颜色
                   borderWidth: '1px', // 设置边框粗细
                 },
             },
@@ -75,7 +75,7 @@ export const theme = createTheme({
                   color: '#BBB', // 设置 placeholder 的颜色
                 },
                 '&:hover  .MuiOutlinedInput-notchedOutline':{
-                    borderColor: '#7371fc', // 设置选中时的边框颜色
+                    borderColor: '#3D46F2', // 设置选中时的边框颜色
                     borderWidth: '1px', // 设置边框粗细
                 }
               },
@@ -109,19 +109,19 @@ export const theme = createTheme({
             styleOverrides: {
               root: {
                 '&:hover:not(.Mui-disabled):not(.Mui-focused):not(.Mui-error)': {
-                  borderColor: '#7371fc',
+                  borderColor: '#3D46F2',
                   borderWidth: '1px',
                 },
                 '&:hover:not(.Mui-disabled):not(.Mui-focused):not(.Mui-error) .MuiOutlinedInput-notchedOutline': {
-                  borderColor: '#7371fc',
+                  borderColor: '#3D46F2',
                   borderWidth: '1px',
                 },
                 '&.Mui-focused': {
-                  borderColor: '#7371fc',
+                  borderColor: '#3D46F2',
                   borderWidth: '1px',
                 },
                 '&.Mui-focused .MuiOutlinedInput-notchedOutline': {
-                  borderColor: '#7371fc',
+                  borderColor: '#3D46F2',
                   borderWidth: '1px',
                 },
               },

diff --git a/frontend/packages/common/src/components/postcat/api/Codebox/index.tsx b/frontend/packages/common/src/components/postcat/api/Codebox/index.tsx
@@ -165,16 +165,16 @@ export const Codebox =  memo((props: CodeboxProps) => {
         >
         {extraContent}
 
-          <IconButton name="code" onClick={formatCode} sx={{color:'#333',transition:'none','&.MuiButtonBase-root:hover':{background:'transparent',color:'#7371fc',transition:'none'}}}>
+          <IconButton name="code" onClick={formatCode} sx={{color:'#333',transition:'none','&.MuiButtonBase-root:hover':{background:'transparent',color:'#3D46F2',transition:'none'}}}>
             格式化
           </IconButton>
-          <IconButton name="copy" onClick={copyCode}  sx={{color:'#333',transition:'none','&.MuiButtonBase-root:hover':{background:'transparent',color:'#7371fc',transition:'none'}}}>
+          <IconButton name="copy" onClick={copyCode}  sx={{color:'#333',transition:'none','&.MuiButtonBase-root:hover':{background:'transparent',color:'#3D46F2',transition:'none'}}}>
            复制
           </IconButton>
-          <IconButton name="search" onClick={searchInCode}  sx={{color:'#333',transition:'none','&.MuiButtonBase-root:hover':{background:'transparent',color:'#7371fc',transition:'none'}}}>
+          <IconButton name="search" onClick={searchInCode}  sx={{color:'#333',transition:'none','&.MuiButtonBase-root:hover':{background:'transparent',color:'#3D46F2',transition:'none'}}}>
             搜索
           </IconButton>
-          {!readOnly &&<IconButton name="file-text" onClick={replaceInCode}  sx={{color:'#333',transition:'none','&.MuiButtonBase-root:hover':{background:'transparent',color:'#7371fc',transition:'none'}}}>
+          {!readOnly &&<IconButton name="file-text" onClick={replaceInCode}  sx={{color:'#333',transition:'none','&.MuiButtonBase-root:hover':{background:'transparent',color:'#3D46F2',transition:'none'}}}>
            替代
           </IconButton>}
         </Box></>

diff --git a/frontend/packages/common/src/components/postcat/api/MoreSetting/components/ParamLimit.tsx b/frontend/packages/common/src/components/postcat/api/MoreSetting/components/ParamLimit.tsx
@@ -64,13 +64,13 @@ export function ParamLimit({ min, max, onChange, minLabel = 'Minimum', maxLabel
                     border: '1px solid #EDEDED'
                   },
                   '& .Mui-focused .MuiOutlinedInput-notchedOutline':{
-                    border:'1px solid #7371fc'
+                    border:'1px solid #3D46F2'
                   },
                   '& .MuiInputLabel-root.Mui-focused':{
-                    color:'#7371fc'
+                    color:'#3D46F2'
                   },
                   '& .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline':{
-                    borderColor:'#7371fc'
+                    borderColor:'#3D46F2'
                     }
                 }}
                 value={minValue}
@@ -90,13 +90,13 @@ export function ParamLimit({ min, max, onChange, minLabel = 'Minimum', maxLabel
                     border: '1px solid #EDEDED'
                   },
                   '& .Mui-focused .MuiOutlinedInput-notchedOutline':{
-                    border:'1px solid #7371fc'
+                    border:'1px solid #3D46F2'
                   },
                   '& .MuiInputLabel-root.Mui-focused':{
-                    color:'#7371fc'
+                    color:'#3D46F2'
                   },
                   '& .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline':{
-                    borderColor:'#7371fc'
+                    borderColor:'#3D46F2'
                     }
                 }}
                 onChange={handleMaxChange}