third/APIPark
1
0
Fork 0
mirror of https://github.com/APIParkLab/APIPark.git synced 2026-06-14 20:41:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #7 from maggieyyy/main

Browse Source 
fix:access &  monitor style
This commit is contained in:
Dot.L
2024-08-23 10:41:48 +08:00
committed by GitHub
parent 1be6f4e814 c1a1d16ca8
commit 7e399cc181
24 changed files with 97 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/packages/common/src/components/aoplatform/BasicLayout.tsx
+3 -3
View File
@@ -41,7 +41,7 @@ const themeToken = {
const navigator = useNavigate()
const location = useLocation()
const currentUrl = location.pathname
const { state,accessData,checkPermission} = useGlobalContext()
const { state,accessData,checkPermission,accessInit} = useGlobalContext()
const [pathname, setPathname] = useState(currentUrl);
const mainPage = project === 'core' ?'/service/list':'/serviceHub/list'
@@ -70,15 +70,15 @@ const themeToken = {
],undefined,'system.api_market.service_classification.view'),
getNavItem($t('运维与集成'), 'maintenanceCenter','/cluster', null, [
getNavItem(<a>{$t('监控报表')}</a>, 'dashboardsetting','/dashboardsetting',<Icon icon="ic:baseline-monitor-heart" width="18" height="18"/>,undefined,undefined,'system.devops.dashboardsetting.view'),
getNavItem(<a>{$t('集群')}</a>, 'cluster','/cluster',<Icon icon="ic:baseline-device-hub" width="18" height="18"/>,undefined,undefined,'system.devops.cluster.view'),
getNavItem(<a>{$t('监控报表')}</a>, 'dashboardsetting','/dashboardsetting',<Icon icon="ic:baseline-monitor-heart" width="18" height="18"/>,undefined,undefined,'system.devops.dashboardsetting.view'),
getNavItem(<a>{$t('证书')}</a>, 'cert','/cert',<Icon icon="ic:baseline-security" width="18" height="18"/>,undefined,undefined,'system.devops.ssl_certificate.view'),
getNavItem(<a>{$t('日志')}</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>{$t('资源')}</a>, 'resourcesettings','/resourcesettings',null,undefined,undefined,'system.partition.self.view'):null,
APP_MODE === 'pro' ? getNavItem(<a>{$t('Open API')}</a>, 'openapi','/openapi',null,undefined,undefined,'system.openapi.self.view'):null,
]),
]),
],[state.language])
],[state.language,accessInit])
useEffect(() => {
frontend/packages/common/src/components/aoplatform/EditableTable.tsx
+1 -1
View File
@@ -78,7 +78,7 @@ const EditableTable = <T extends { _id: string }>({
}}
btnTitle="增加"/>,
(config.index !== configurations.length - 1 )&& <TableBtnWithPermission key="delete" btnType="delete" btnTitle="删除"
(config.index !== configurations.length - 1 )&& <TableBtnWithPermission key="remove" btnType="remove" btnTitle="删除"
onClick={() => {
setConfigurations((prev)=>{
const tmpPreData = [...prev];
frontend/packages/common/src/components/aoplatform/PageList.tsx
+2 -2
View File
@@ -59,7 +59,7 @@ const PageList = <T extends Record<string, unknown>>(props: React.PropsWithChild
const [tableWidth, setTableWidth] = useState<number|undefined>(undefined);
const actionRef = useRef<ActionType>();
const [allowTableClick,setAllowTableClick] = useState<boolean>(false)
const {accessData,checkPermission} = useGlobalContext()
const {accessData,checkPermission,accessInit} = useGlobalContext()
const [minTableWidth, setMinTableWidth] = useState<number>(0)
// 使用useImperativeHandle来自定义暴露给父组件的实例值
@@ -68,7 +68,7 @@ const PageList = <T extends Record<string, unknown>>(props: React.PropsWithChild
const lastAccess = useMemo(()=>{
if(!tableClickAccess) return true
return checkPermission(tableClickAccess as keyof typeof PERMISSION_DEFINITION[0])
},[allowTableClick, accessData])
},[allowTableClick, accessData,accessInit])
useEffect(()=>{
tableClickAccess ? setAllowTableClick(lastAccess) : setAllowTableClick(true)
frontend/packages/common/src/components/aoplatform/TableBtnWithPermission.tsx
+4 -2
View File
@@ -22,6 +22,7 @@ const TableIconName={
'add':'ic:baseline-add',
'edit':'ic:baseline-edit',
'delete':'ic:baseline-delete',
'remove':'ic:baseline-minus',
'copy':'ic:baseline-file-copy',
'view':'ic:baseline-remove-red-eye',
'publish':'ic:baseline-publish',
@@ -35,12 +36,13 @@ const TableIconName={
const TableBtnWithPermission = ({btnTitle, access, tooltip, disabled, navigateTo, onClick,className,btnType}:TableBtnWithPermissionProps) => {
const [btnAccess, setBtnAccess] = useState<boolean>(false)
const {accessData,checkPermission} = useGlobalContext()
const {accessData,checkPermission,accessInit} = useGlobalContext()
const navigate = useNavigate()
const lastAccess = useMemo(()=>{
if(!accessInit) return false
if(!access) return true
return checkPermission(access)
},[access, accessData,checkPermission])
},[access, accessData,checkPermission,accessInit])
useEffect(()=>{
access ? setBtnAccess(lastAccess) : setBtnAccess(true)
frontend/packages/common/src/components/aoplatform/TagWithPermission.tsx
+2 -2
View File
@@ -10,11 +10,11 @@ export interface TagWithPermission extends TagProps{
export default function TagWithPermission(props:TagWithPermission){
const {access,onClose} = props
const [editAccess, setEditAccess] = useState<boolean>(access ? false:true)
const {accessData,checkPermission} = useGlobalContext()
const {accessData,checkPermission,accessInit} = useGlobalContext()
const lastAccess = useMemo(()=>{
if(!access) return true
return checkPermission(access as keyof typeof PERMISSION_DEFINITION[0])
},[access, accessData,checkPermission])
},[access, accessData,checkPermission,accessInit])
useEffect(()=>{
access ? setEditAccess(lastAccess) : setEditAccess(true)
frontend/packages/common/src/components/aoplatform/WithPermission.tsx
+2 -2
View File
@@ -16,12 +16,12 @@ type WithPermissionProps = {
const WithPermission = ({access, tooltip, children,disabled, showDisabled = true}:WithPermissionProps) => {
const [editAccess, setEditAccess] = useState<boolean>(access ? false:true)
const {accessData,checkPermission} = useGlobalContext()
const {accessData,checkPermission,accessInit} = useGlobalContext()
const lastAccess = useMemo(()=>{
if(!access) return true
return checkPermission(access as keyof typeof PERMISSION_DEFINITION[0])
},[access, accessData,checkPermission])
},[access, accessData,checkPermission,accessInit])
useEffect(()=>{
// 先判断权限，无论权限是否为true，如果disabled为true时则必须为ture
frontend/packages/common/src/components/aoplatform/formily2-customize/ArrayItemBlankComponent.tsx
+3 -20
View File
@@ -2,6 +2,7 @@
import {forwardRef, useImperativeHandle, useState} from 'react'
import { Input } from 'antd'
import { Icon } from '@iconify/react/dist/iconify.js'
export const ArrayItemBlankComponent = forwardRef(
(props: { [k: string]: any }, ref) => {
const { onChange, value, dataFormat } = props
@@ -135,27 +136,9 @@ export const ArrayItemBlankComponent = forwardRef(
{index !== resList.length - 1 && (
<div style={{ display: 'inline-block' }}>
{n[dataFormat[0].key] && (
<a
className="array_item_addition ant-btn-text anticon"
onClick={() => addLine(index)}
>
<span>
<svg className="iconpark-icon">
<use href="#add-circle"></use>
</svg>
</span>
</a>
<Icon icon="ic:baseline-add" onClick={() => addLine(index as unknown as number)} width="14" height="14"/>
)}
<a
className="array_item_addition ant-btn-text anticon"
onClick={() => removeLine(index)}
>
<span>
<svg className="iconpark-icon">
<use href="#reduce-one"></use>
</svg>
</span>
</a>
<Icon icon="ic:baseline-minus" onClick={() => removeLine(index as unknown as number)} width="14" height="14"/>
</div>
)}
</div>
frontend/packages/common/src/components/aoplatform/formily2-customize/SimpleMapComponent.tsx
+3 -20
View File
@@ -2,6 +2,7 @@ import {forwardRef, useImperativeHandle, useState} from 'react'
import { Input } from '@formily/antd-v5'
import { $t } from '@common/locales'
import { Icon } from '@iconify/react/dist/iconify.js'
export const SimpleMapComponent = forwardRef(
(props: { [k: string]: unknown }, ref) => {
const {
@@ -89,27 +90,9 @@ export const SimpleMapComponent = forwardRef(
{index !== kvList.length - 1 && (
<div style={{ display: 'inline-block' }}>
{n.key && (
<a
className="arrayItemAddition ant-btn-text anticon"
onClick={() => addLine(index)}
>
<span>
<svg className="iconpark-icon">
<use href="#add-circle"></use>
</svg>
</span>
</a>
<Icon icon="ic:baseline-add" onClick={() => addLine(index as unknown as number)} width="14" height="14"/>
)}
<a
className="arrayItemAddition ant-btn-text anticon"
onClick={() => removeLine(index)}
>
<span>
<svg className="iconpark-icon">
<use href="#reduce-one"></use>
</svg>
</span>
</a>
<Icon icon="ic:baseline-minus" onClick={() => removeLine(index as unknown as number)} width="14" height="14"/>
</div>
)}
</div>
frontend/packages/common/src/contexts/GlobalStateContext.tsx
+7 -8
View File
@@ -38,7 +38,7 @@ export const GlobalContext = createContext<{
dispatch: Dispatch<GlobalAction>;
accessData:Map<string,string[]>;
pluginAccessDictionary:{[k:string]:string};
getGlobalAccessData:()=>void;
getGlobalAccessData:()=>Promise<{ access:string[]}>;
getTeamAccessData:(teamId:string)=>void;
getPluginAccessDictionary:(pluginData:{[k:string]:string})=>void
resetAccess:()=>void
@@ -117,12 +117,16 @@ export const GlobalProvider: FC<{children:ReactNode}> = ({ children }) => {
let getGlobalAccessPromise: Promise<BasicResponse<{ access:string[] }>> | null = null
const getGlobalAccessData = ()=>{
if(getGlobalAccessPromise){
return getGlobalAccessPromise
}
getGlobalAccessPromise = new Promise((resolve, reject) => fetchData<BasicResponse<{ access:string[]}>>('profile/permission/system',{method:'GET'},).then(response=>{
const {code,data,msg} = response
if(code === STATUS_CODE.SUCCESS){
setAccessInit(true)
setAccessData(prevData => new Map(prevData).set('system', data.access))
resolve(data.response)
getGlobalAccessPromise = null
}else{
message.error(msg || RESPONSE_TIPS.error)
reject(data.msg || RESPONSE_TIPS.error)
@@ -156,16 +160,11 @@ export const GlobalProvider: FC<{children:ReactNode}> = ({ children }) => {
const resetAccess = ()=>{
setAccessData(new Map())
setAccessInit(false)
setPluginAccessDictionary({})
}
const checkPermission = async (access:keyof typeof PERMISSION_DEFINITION[0] | Array<keyof typeof PERMISSION_DEFINITION[0]>)=>{
if( !accessInit && getGlobalAccessPromise){
await getGlobalAccessPromise
}
if( !accessInit && !getGlobalAccessPromise){
await getGlobalAccessData()
}
const checkPermission = (access:keyof typeof PERMISSION_DEFINITION[0] | Array<keyof typeof PERMISSION_DEFINITION[0]>)=>{
let revs = false;
if (Array.isArray(access)) {
revs = access.some(item => checkAccess(item, accessData));
frontend/packages/common/src/utils/permission.ts
+2 -1
View File
@@ -12,7 +12,8 @@ export const checkAccess:(access:AccessDataType, accessData:Map<string,string[]>
console.warn('权限字段有误：',access)
return false
}
const neededBackendAccessArr = PERMISSION_DEFINITION[0]?.[access]?.granted.anyOf[0].backend || []
console.log(access, PERMISSION_DEFINITION)
const neededBackendAccessArr = PERMISSION_DEFINITION[0]?.[access]?.granted?.anyOf[0].backend || []
return accessData?.has(accLevel)&& accessData.get(accLevel)!.length > 0 ? hasIntersection(neededBackendAccessArr, accessData.get(accLevel)!) : false
}
frontend/packages/core/src/const/team/const.tsx
+1 -1
View File
@@ -165,7 +165,7 @@ export const TEAM_MEMBER_MODAL_TABLE_COLUMNS:ColumnsType<MemberItem> = [
getItem($t('管理'), 'grp', null,
[
getItem(<Link to="member">{$t('成员')}</Link>, 'member',undefined, undefined, undefined,'team.team.member.view'),
getItem(<Link to="setting">{$t('设置')}</Link>, 'setting',undefined,undefined,undefined,'team.team.team.edit')],
getItem(<Link to="setting">{$t('设置')}</Link>, 'setting',undefined,undefined,undefined,'team.team.team.view')],
'group'),
];
frontend/packages/core/src/index.css
+7 -7
View File
@@ -349,6 +349,7 @@ p{
} */
.ant-table-cell {
a{
color:var(--primary-color) !important;
}
@@ -662,7 +663,7 @@ p{
.ant-pro-table-list-toolbar-setting-items{
position:absolute;
top:14px;
top:18px;
right:16px;
z-index:9;
.ant-pro-table-list-toolbar-setting-item{
@@ -775,7 +776,6 @@ p{
padding:0 !important;
}
.eo_page_list .ant-pro-table-list-toolbar-container{
/* padding:12px 20px 12px 12px !important; */
padding-block:0px !important;
flex-direction: row-reverse;
@@ -1103,6 +1103,11 @@ p{
}
}
.eo_page_list .ant-table-tbody:not(tbody) .ant-table-cell{
display: flex;
align-items: center;
}
.ant-alert-info{
background: #1784FC1A !important;
}
@@ -1214,11 +1219,6 @@ p{
font-weight: bold;
}
/* .eo_page_list.role_table .ant-pro-table-list-toolbar-container{
padding-left:0 !important;
padding-right:0 !important;
} */
div.preview-document{
p{
frontend/packages/core/src/pages/partitions/DashboardSettingEdit.tsx
+1 -2
View File
@@ -50,8 +50,7 @@ export type DashboardSettingEditProps = {
<Form
form={form}
className="mx-auto flex flex-col justify-between h-full"
labelCol={{ span: 7 }}
wrapperCol={{ span: 17}}
layout="vertical"
onFinish={onFinish}
autoComplete="off"
>
frontend/packages/core/src/pages/system/SystemConfig.tsx
+8 -2
View File
@@ -40,7 +40,7 @@ const SystemConfig = forwardRef<SystemConfigHandle>((_,ref) => {
const [tagOptionList, setTagOptionList] = useState<DefaultOptionType[]>([])
const [serviceClassifyOptionList, setServiceClassifyOptionList] = useState<DefaultOptionType[]>()
const [uploadLoading, setUploadLoading] = useState<boolean>(false)
const {checkPermission} = useGlobalContext()
const {checkPermission,accessInit, getGlobalAccessData} = useGlobalContext()
useImperativeHandle(ref, () => ({
save:onFinish
@@ -186,7 +186,13 @@ const SystemConfig = forwardRef<SystemConfigHandle>((_,ref) => {
}
useEffect(() => {
getTeamOptionList()
if(accessInit){
getTeamOptionList
}else{
getGlobalAccessData()?.then(()=>{
getTeamOptionList()
})
}
getTagAndServiceClassifyList()
if (serviceId !== undefined) {
setOnEdit(true);
frontend/packages/core/src/pages/system/SystemInsidePage.tsx
+2 -2
View File
@@ -23,7 +23,7 @@ const SystemInsidePage:FC = ()=> {
const currentUrl = location.pathname
const {fetchData} = useFetch()
const { setPrefixForce,setApiPrefix ,systemInfo,setSystemInfo} = useSystemContext()
const { accessData,checkPermission} = useGlobalContext()
const { accessData,checkPermission,accessInit} = useGlobalContext()
const [activeMenu, setActiveMenu] = useState<string>()
const navigateTo = useNavigate()
@@ -70,7 +70,7 @@ const SystemInsidePage:FC = ()=> {
return pre ?? 'api'
})
return filteredMenu || []
},[accessData])
},[accessData,accessInit])
const onMenuClick: MenuProps['onClick'] = ({key}) => {
setActiveMenu(key)
frontend/packages/core/src/pages/system/SystemList.tsx
+13 -1
View File
@@ -29,9 +29,15 @@ const SystemList:FC = ()=>{
const [memberValueEnum, setMemberValueEnum] = useState<{[k:string]:{text:string}}>({})
const [open, setOpen] = useState(false);
const drawerFormRef = useRef<SystemConfigHandle>(null)
const {checkPermission} = useGlobalContext()
const {checkPermission,accessInit, getGlobalAccessData} = useGlobalContext()
const getSystemList = ()=>{
if(!accessInit){
getGlobalAccessData()?.then(()=>{
getSystemList()
})
return
}
if(!tableHttpReload){
setTableHttpReload(true)
return Promise.resolve({
@@ -55,6 +61,12 @@ const SystemList:FC = ()=>{
}
const getTeamsList = ()=>{
if(!accessInit){
getGlobalAccessData()?.then(()=>{
getTeamsList()
})
return
}
fetchData<BasicResponse<{ teams: SimpleTeamItem[] }>>(!checkPermission('system.workspace.team.view_all') ?'simple/teams/mine' :'simple/teams',{method:'GET',eoTransformKeys:[]}).then(response=>{
const {code,data,msg} = response
setTeamList(data.teams)
frontend/packages/core/src/pages/team/TeamConfig.tsx
+7 -3
View File
@@ -1,4 +1,4 @@
import { forwardRef, useEffect, useImperativeHandle, useState} from "react";
import { forwardRef, useEffect, useImperativeHandle, useMemo, useState} from "react";
import {App, Button, Form, Input, Row, Select} from "antd";
import {Link, useLocation, useNavigate, useParams} from "react-router-dom";
import {RouterParams} from "@core/components/aoplatform/RenderRoutes.tsx";
@@ -34,8 +34,12 @@ const TeamConfig= forwardRef<TeamConfigHandle,TeamConfigProps>((props,ref) => {
const [managerOption, setManagerOption] = useState<DefaultOptionType[]>([])
const { setBreadcrumb} = useBreadcrumb()
const { setTeamInfo } =useTeamContext()
const {checkPermission} = useGlobalContext()
const pageType= checkPermission('system.organization.team.view') ? 'manage' : 'myteam'
const {checkPermission,accessInit} = useGlobalContext()
const pageType= useMemo(()=>{
if(!accessInit) return 'myteam'
return checkPermission('system.organization.team.view') ? 'manage' : 'myteam'
},[checkPermission,accessInit])
const [canDelete, setCanDelete] = useState<boolean>(false)
const navigateTo = useNavigate()
useImperativeHandle(ref, () => ({
frontend/packages/core/src/pages/team/TeamInsidePage.tsx
+3 -3
View File
@@ -21,8 +21,8 @@ const TeamInsidePage:FC = ()=> {
const {teamId} = useParams<RouterParams>();
const {fetchData} = useFetch()
const location = useLocation()
const { teamInfo ,setTeamInfo } = useTeamContext()
const {getTeamAccessData,cleanTeamAccessData,accessData,checkPermission,teamDataFlushed} = useGlobalContext()
const { teamInfo ,setTeamInfo ,} = useTeamContext()
const {getTeamAccessData,cleanTeamAccessData,accessData,checkPermission,teamDataFlushed,accessInit} = useGlobalContext()
const navigateTo = useNavigate()
const [activeMenu, setActiveMenu] = useState<string>()
@@ -52,7 +52,7 @@ const TeamInsidePage:FC = ()=> {
return pre
})
return filteredMenu || []
},[accessData])
},[accessData,accessInit])
const getTeamInfo = ()=>{
setTeamInfo?.(undefined)
frontend/packages/core/src/pages/team/TeamList.tsx
+5 -1
View File
@@ -28,12 +28,16 @@ const TeamList:FC = ()=>{
const {fetchData} = useFetch()
const [memberValueEnum, setMemberValueEnum] = useState<{[k:string]:{text:string}}>({})
const teamConfigRef = useRef<TeamConfigHandle>(null)
const {accessData,checkPermission} = useGlobalContext()
const {accessData,checkPermission,accessInit, getGlobalAccessData} = useGlobalContext()
const [curTeam, setCurTeam] = useState<TeamConfigFieldType>({} as TeamConfigFieldType)
const [modalVisible, setModalVisible] = useState<boolean>(false)
const [modalType, setModalType] = useState<'add'|'edit'>('add')
const getTeamList = ()=>{
if(!accessInit){
getGlobalAccessData()?.then(()=>{getTeamList()})
return
}
return fetchData<BasicResponse<{teams:TeamTableListItem}>>(!checkPermission('system.workspace.team.view_all') ? 'teams':'manager/teams',{method:'GET',eoParams:{keyword:searchWord},eoTransformKeys:['create_time','service_num','can_delete']}).then(response=>{
const {code,data,msg} = response
if(code === STATUS_CODE.SUCCESS){
frontend/packages/dashboard/src/component/MonitorApiPage.tsx
+1 -1
View File
@@ -151,7 +151,7 @@ export default function MonitorApiPage(props:MonitorApiPageProps){
}
return (
<div className="h-[calc(100vh-140px)] overflow-hidden">
<div className="h-full overflow-hidden">
<ScrollableSection>
<div className="pl-btnbase pr-btnrbase pb-btnbase content-before">
<TimeRangeSelector
frontend/packages/dashboard/src/component/MonitorTable.tsx
+2 -2
View File
@@ -73,7 +73,7 @@ const MonitorTable = forwardRef<MonitorTableHandler, MonitorTableProps<unknown>>
valueType: 'option',
render: (_: React.ReactNode, entity: unknown) => [
// <TableBtnWithPermission access="system.dashboard.self.view" key="view" onClick={()=>onRowClick(entity)} btnTitle="查看"/>,
<TableBtnWithPermission access="" key="view" btnType="view" onClick={()=>onRowClick(entity)} btnTitle="查看"/>,
APP_MODE === 'pro' ? <TableBtnWithPermission access="" key="view" btnType="view" onClick={()=>onRowClick(entity)} btnTitle="查看"/> : null
],
}
]
@@ -86,7 +86,7 @@ const MonitorTable = forwardRef<MonitorTableHandler, MonitorTableProps<unknown>>
besidesTableHeight={inModal ? 64+56+258: undefined}
ref={tableRef}
showPagination={showPagination}
columns = {[...(TableType[type] || []),...(APP_MODE === 'pro' ? operation : [])]}
columns = {[...(TableType[type] || []),...operation]}
request={getTableDataSource}
dataSource={tableListDataSource}
// tableClickAccess="system.dashboard.self.view"
frontend/packages/dashboard/src/component/MonitorTotalPage.tsx
+4 -4
View File
@@ -209,17 +209,17 @@ const MonitorTotalPage = (props:MonitorTotalPageProps) => {
{
label:$t('API 请求量 Top10'),
key:'api',
children:<MonitorTable className="pb-[10px]" ref={monitorApiTableRef} type='api' id="dashboard_top10_api" onRowClick={(record)=>{APP_MODE !== 'pro' ? null : getDetailData(record as MonitorApiData,'api')}} request={()=>getTablesData(queryData||{},'api')}/>
children:<MonitorTable className="py-[10px]" ref={monitorApiTableRef} type='api' id="dashboard_top10_api" onRowClick={(record)=>{APP_MODE !== 'pro' ? null : getDetailData(record as MonitorApiData,'api')}} request={()=>getTablesData(queryData||{},'api')}/>
},
{
label:$t('应用调用量 Top10'),
key:'subscribers',
children:<MonitorTable className="pb-[10px]" ref={monitorSubTableRef} type='subscribers' id="dashboard_top10_subscriber" onRowClick={(record)=>{APP_MODE !== 'pro' ? null : getDetailData(record as MonitorSubscriberData,'subscriber')}} request={()=>getTablesData(queryData||{},'subscriber')} />
children:<MonitorTable className="py-[10px]" ref={monitorSubTableRef} type='subscribers' id="dashboard_top10_subscriber" onRowClick={(record)=>{APP_MODE !== 'pro' ? null : getDetailData(record as MonitorSubscriberData,'subscriber')}} request={()=>getTablesData(queryData||{},'subscriber')} />
},
{
label:$t('服务被调用量 Top10'),
key:'providers',
children:<MonitorTable className="pb-[10px]" ref={monitorSubTableRef} type='provider' id="dashboard_top10_provider" onRowClick={(record)=>{APP_MODE !== 'pro' ? null : getDetailData(record as MonitorSubscriberData,'provider')}} request={()=>getTablesData(queryData||{},'provider')} />
children:<MonitorTable className="py-[10px]" ref={monitorSubTableRef} type='provider' id="dashboard_top10_provider" onRowClick={(record)=>{APP_MODE !== 'pro' ? null : getDetailData(record as MonitorSubscriberData,'provider')}} request={()=>getTablesData(queryData||{},'provider')} />
}
]
@@ -231,7 +231,7 @@ const MonitorTotalPage = (props:MonitorTotalPageProps) => {
}
return (
<div className={`h-[calc(100vh-140px)] overflow-hidden pb-btnybase flex flex-col ${totalEmpty ? 'bg-[#fff]' : 'bg-MENU_BG'}`}>
<div className={`h-full overflow-hidden pb-btnybase flex flex-col ${totalEmpty ? 'bg-[#fff]' : 'bg-MENU_BG'}`}>
<ScrollableSection>
<div className="flex items-center flex-wrap pb-[10px] px-btnbase content-before bg-MAIN_BG">
<TimeRangeSelector
frontend/packages/market/src/pages/serviceHub/ServiceHubList.tsx
+1 -1
View File
@@ -187,7 +187,7 @@ const CardTitle = (service:ServiceHubTableListItem)=>{
<span className="mr-[12px]"><ApiOutlined className="mr-[1px] text-[14px] h-[14px] w-[14px]"/><span className="font-normal text-[14px]">{service.apiNum ?? '-'}</span></span>
</Tooltip>
<Tooltip title={$t('接入应用数量')}>
<span className="mr-[12px] flex items-center"><span className="h-[14px] mr-[4px] flex items-center"><iconpark-icon className="max-h-[14px] h-[14px] w-[14px]" name="auto-generate-api"></iconpark-icon></span><span className="font-normal text-[14px]">{service.subscriberNum ?? '-'}</span></span>
<span className="mr-[12px] flex items-center"><span className="h-[14px] mr-[4px] flex items-center"><iconpark-icon size="14px" name="auto-generate-api"></iconpark-icon></span><span className="font-normal text-[14px]">{service.subscriberNum ?? '-'}</span></span>
</Tooltip>
</div>
</div>
frontend/packages/market/src/pages/serviceHub/management/ServiceHubManagement.tsx
+13 -4
View File
@@ -13,6 +13,7 @@ import { useTenantManagementContext } from "../../../contexts/TenantManagementCo
import { Icon } from "@iconify/react/dist/iconify.js";
import { useGlobalContext } from "@common/contexts/GlobalStateContext";
import { $t } from "@common/locales";
import WithPermission from "@common/components/aoplatform/WithPermission";
export default function ServiceHubManagement() {
const { message ,modal} = App.useApp()
@@ -26,11 +27,15 @@ export default function ServiceHubManagement() {
const [teamList, setTeamList] = useState<MenuItem[]>([])
const {setAppName} = useTenantManagementContext()
const navigateTo = useNavigate()
const {getTeamAccessData,cleanTeamAccessData,checkPermission} = useGlobalContext()
const {getTeamAccessData,cleanTeamAccessData,checkPermission,getGlobalAccessData,accessInit} = useGlobalContext()
type MenuItem = Required<MenuProps>['items'][number];
const getServiceList = ()=>{
if(!accessInit){
getGlobalAccessData()?.then(()=>{getServiceList()})
return
}
setServiceLoading(true)
return fetchData<BasicResponse<{apps:ServiceHubAppListItem}>>(!checkPermission('system.workspace.application.view_all') ? 'my_apps':'apps',{method:'GET',eoParams:{ team:teamId,keyword:''},eoTransformKeys:['api_num','subscribe_num','subscribe_verify_num']}).then(response=>{
const {code,data,msg} = response
@@ -50,6 +55,10 @@ const getServiceList = ()=>{
const getTeamsList = ()=>{
if(!accessInit){
getGlobalAccessData()?.then(()=>{getTeamsList()})
return
}
setPageLoading(true)
fetchData<BasicResponse<{ teams: SimpleTeamItem[] }>>(!checkPermission('system.workspace.team.view_all') ?'simple/teams/mine' :'simple/teams',{method:'GET',eoTransformKeys:['app_num','subscribe_num']}).then(response=>{
const {code,data,msg} = response
@@ -159,9 +168,9 @@ useEffect(() => {
const item = serviceList[index];
return (
<div className="pt-[20px]">{
item.type === 'addNewItem' ?<Card className="shadow-[0_5px_10px_0_rgba(0,0,0,0.05)] rounded-[10px] overflow-visible cursor-pointer h-[180px] transition duration-500 hover:shadow-[0_5px_20px_0_rgba(0,0,0,0.15)] hover:scale-[1.05]" classNames={{body:'h-[180px] flex items-center justify-center cursor-pointer'}} onClick={()=>{openModal('add')}}>
item.type === 'addNewItem' ?<WithPermission access="team.application.application.add" showDisabled={false}><Card className="shadow-[0_5px_10px_0_rgba(0,0,0,0.05)] rounded-[10px] overflow-visible cursor-pointer h-[180px] transition duration-500 hover:shadow-[0_5px_20px_0_rgba(0,0,0,0.15)] hover:scale-[1.05]" classNames={{body:'h-[180px] flex items-center justify-center cursor-pointer'}} onClick={()=>{openModal('add')}}>
<div className="flex items-center"><Icon icon="ic:baseline-add" width="18" height="18"/><span>{$t('添加应用')}</span></div>
</Card> : <Card title={CardTitle(item)} className="shadow-[0_5px_10px_0_rgba(0,0,0,0.05)] rounded-[10px] overflow-visible cursor-pointer h-[180px] transition duration-500 hover:shadow-[0_5px_20px_0_rgba(0,0,0,0.15)] hover:scale-[1.05]" classNames={{header:'border-b-[0px] p-[20px] ', body:"pt-0"}} onClick={()=>{setAppName(item.name);navigateTo(`/tenantManagement/${teamId}/inside/${item.id}/service`)}}>
</Card></WithPermission> : <Card title={CardTitle(item)} className="shadow-[0_5px_10px_0_rgba(0,0,0,0.05)] rounded-[10px] overflow-visible cursor-pointer h-[180px] transition duration-500 hover:shadow-[0_5px_20px_0_rgba(0,0,0,0.15)] hover:scale-[1.05]" classNames={{header:'border-b-[0px] p-[20px] ', body:"pt-0"}} onClick={()=>{setAppName(item.name);navigateTo(`/tenantManagement/${teamId}/inside/${item.id}/service`)}}>
<span className="line-clamp-3 break-all">{item.description || $t('暂无服务描述')}</span>
</Card>}</div>
@@ -205,7 +214,7 @@ const CardTitle = (service:ServiceHubAppListItem)=>{
<p className="text-[14px] h-[20px] leading-[20px] truncate">{service.name}</p>
<div className="mt-[10px] h-[20px] flex items-center font-normal">
<Tooltip title={$t('订阅的服务数量：已通过 (0) 个，申请中 (1) 个',[service.subscribeNum ?? '-', service.subscribeVerifyNum ?? '-'])}>
<span className="mr-[12px] flex items-center"><span className="h-[14px] mr-[4px] flex items-center"><iconpark-icon className="max-h-[14px] h-[14px] w-[14px]" name="auto-generate-api"></iconpark-icon></span><span className="font-normal text-[14px]">{(service.subscribeNum + service.subscribeVerifyNum)?? '-'}</span></span>
<span className="mr-[12px] flex items-center"><span className="h-[14px] mr-[4px] flex items-center"><iconpark-icon size="14px" name="auto-generate-api"></iconpark-icon></span><span className="font-normal text-[14px]">{(service.subscribeNum + service.subscribeVerifyNum)?? '-'}</span></span>
</Tooltip>
</div>
</div>