Browse Source

feat: 修改面包屑的显示

dev-zw
zhaowei 7 months ago
parent
commit
5d0b7d8438
2 changed files with 17 additions and 4 deletions
  1. +7
    -1
      react-ui/src/components/PageContainer/index.less
  2. +10
    -3
      react-ui/src/components/PageContainer/index.tsx

+ 7
- 1
react-ui/src/components/PageContainer/index.less View File

@@ -1,14 +1,20 @@
.kf-page-container {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;

&__breadcrumb {
display: flex;
flex: none;
align-items: center;
width: 100%;
height: 70px;
padding-left: 30px;
}

&__content {
height: calc(100% - 70px);
flex: 1;
width: 100%;
}
}

+ 10
- 3
react-ui/src/components/PageContainer/index.tsx View File

@@ -3,11 +3,18 @@ import React from 'react';
import './index.less';

function PageContainer({ children }: { children: React.ReactNode }) {
const { pathname } = location;
const showBreadcrumb = pathname.split('/').filter((v) => v !== '').length >= 2;
console.log('111', pathname);

return (
<div className="kf-page-container">
<div className="kf-page-container__breadcrumb">
<ProBreadcrumb></ProBreadcrumb>
</div>
{showBreadcrumb && (
<div className="kf-page-container__breadcrumb">
<ProBreadcrumb></ProBreadcrumb>
</div>
)}

<div className="kf-page-container__content">{children}</div>
</div>
);


Loading…
Cancel
Save