How to use @ant-design/pro-layout - 10 common examples

To help you get started, we’ve selected a few @ant-design/pro-layout examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github Jkanon / webmagician-ui / src / layouts / Components / ProLayout / index.tsx View on Github external
...props,
    formatMessage,
    breadcrumb,
  };

  // gen page title
  const pageTitle = defaultPageTitleRender(
    {
      pathname: location.pathname,
      ...defaultProps,
    },
    props,
  );

  // gen breadcrumbProps, parameter for pageHeader
  const breadcrumbProps = getBreadcrumbProps({
    ...props,
    breadcrumb,
  });

  return (
    
      
        {params => (
          <div>
            
              {renderSiderMenu({
                ...defaultProps,
                menuData,
                onCollapse,
                isMobile,
                theme: navTheme,</div>
github Jkanon / webmagician-ui / src / layouts / Components / ProLayout / index.tsx View on Github external
defaultMessage,
        ...rest,
      });
    }
    const locales = getLocales();
    if (locales[id]) {
      return locales[id];
    }
    if (defaultMessage) {
      return defaultMessage as string;
    }
    return id;
  };

  const { routes = [] } = route;
  const { breadcrumb, menuData } = getMenuData(routes, menu, formatMessage, menuDataRender);

  /**
   * init variables
   */
  const isMobile =
    useMedia({
      id: 'BasicLayout',
      query: '(max-width: 599px)',
      targetWindow: window || {
        matchMedia: () => true,
      },
    })[0] && !props.disableMobile;

  // If it is a fix menu, calculate padding
  // don't need padding in phone mode
  const hasLeftPadding = fixSiderbar && PropsLayout !== 'topmenu' && !isMobile;
github tangtanglove / fullstack-frontend / src / components / PageHeaderWrapper / index.tsx View on Github external
});
    }
  }, []);

  const {
    route = {
      routes: [],
    },
  } = props;
  const { routes = [] } = route;
  const {
    children,
    breadcrumbNameMap,
    dispatch
  } = props;
  const { breadcrumb } = getMenuData(routes);

  console.log(breadcrumbNameMap);

  return (
    <div>
      <div>
        
      </div>
      <div>
        <div>
          {children}
        </div>
      </div>
    </div>
  );
};
github tangtanglove / fullstack-frontend / src / layouts / LoginLayout.tsx View on Github external
const LoginLayout: React.SFC = props =&gt; {
  const {
    route = {
      routes: [],
    },
  } = props;
  const { routes = [] } = route;
  const {
    children,
    location = {
      pathname: '',
    },
  } = props;
  const { breadcrumb } = getMenuData(routes, props);

  const links = [{
    key: 'FullStack',
    title: 'FullStack',
    href: 'http://fullstack.qasl.cn',
    blankTarget: true
  }, {
    key: 'Document',
    title: '帮助文档',
    href: 'https://www.kancloud.cn/tangtanglove/fullstack',
    blankTarget: true
  }, {
    key: 'Github',
    title: '问题反馈',
    href: 'https://github.com/tangtanglove/fullstack-backend/issues',
    blankTarget: true
github crawlab-team / artipub / src / layouts / UserLayout.tsx View on Github external
const UserLayout: React.SFC = props =&gt; {
  const {
    route = {
      routes: [],
    },
  } = props;
  const { routes = [] } = route;
  const {
    children,
    location = {
      pathname: '',
    },
  } = props;
  const { breadcrumb } = getMenuData(routes);

  return (
    
      <div>
        <div>
          
        </div>
        <div>
          <div></div></div></div>
github XiaoMi / thain / thain-fe / src / layouts / UserLayout.tsx View on Github external
const UserLayout: React.SFC = props =&gt; {
  const {
    route = {
      routes: [],
    },
  } = props;
  const { routes = [] } = route;
  const {
    children,
    location = {
      pathname: '',
    },
  } = props;
  const { breadcrumb } = getMenuData(routes);
  const title = getPageTitle({
    pathname: location.pathname,
    breadcrumb,
    formatMessage,
    ...props,
  });
  return (
    &lt;&gt;
      
        <title>{title}</title>
        
      

      <div>
        <div>
          </div></div>
github linghuxiong / spring-batch-admin-ui / src / layouts / UserLayout.tsx View on Github external
const UserLayout: React.SFC = props =&gt; {
  const {
    route = {
      routes: [],
    },
  } = props;
  const { routes = [] } = route;
  const {
    children,
    location = {
      pathname: '',
    },
  } = props;
  const { breadcrumb } = getMenuData(routes);

  return (
    
      <div>
        <div>
          
        </div>
        <div>
          <div></div></div></div>
github tangtanglove / fullstack-backend / resources / frontend / src / layouts / UserLayout.tsx View on Github external
const UserLayout: React.SFC = props =&gt; {
  const {
    route = {
      routes: [],
    },
  } = props;
  const { routes = [] } = route;
  const {
    children,
    location = {
      pathname: '',
    },
  } = props;
  const { breadcrumb } = getMenuData(routes, props);

  return (
    
      <div>
        <div>
          
        </div>
        <div>
          <div></div></div></div>
github hs-web / hsweb-ui-antd / src / layouts / UserLayout.tsx View on Github external
const UserLayout: React.SFC = props =&gt; {
  const {
    route = {
      routes: [],
    },
  } = props;
  const { routes = [] } = route;
  const {
    children,
    location = {
      pathname: '',
    },
  } = props;
  const { breadcrumb } = getMenuData(routes, props);

  return (
    
      <div>
        <div>
          
        </div>
        <div>
          <div></div></div></div>