Commit 1187b501 authored by liangliangyin's avatar liangliangyin

fix: breadcrumb itemRender abs path.

parent b0e091a6
...@@ -13,7 +13,7 @@ const PageHeaderTabConfig = { ...@@ -13,7 +13,7 @@ const PageHeaderTabConfig = {
tabList: PropTypes.array, tabList: PropTypes.array,
tabActiveKey: PropTypes.string, tabActiveKey: PropTypes.string,
tabProps: PropTypes.object, tabProps: PropTypes.object,
tabChange: PropTypes.func tabChange: PropTypes.func,
} }
const PageHeaderWrapperProps = { const PageHeaderWrapperProps = {
...@@ -27,18 +27,19 @@ const PageHeaderWrapperProps = { ...@@ -27,18 +27,19 @@ const PageHeaderWrapperProps = {
back: PropTypes.func, back: PropTypes.func,
// 包装 pro-layout 才能使用 // 包装 pro-layout 才能使用
i18nRender: PropTypes.any i18nRender: PropTypes.any,
} }
const defaultI18nRender = (t) => t const defaultI18nRender = (t) => t
const useContext = (route) => { const useContext = (route) => {
return route && { return route && {
...route.meta ...route.meta,
} || null } || null
} }
const noop = () => {} const noop = () => {
}
// TODO :: tabList tab 支持图标 优化 // TODO :: tabList tab 支持图标 优化
const renderFooter = (h, tabConfigProps, i18nRender) => { const renderFooter = (h, tabConfigProps, i18nRender) => {
...@@ -62,7 +63,7 @@ const renderFooter = (h, tabConfigProps, i18nRender) => { ...@@ -62,7 +63,7 @@ const renderFooter = (h, tabConfigProps, i18nRender) => {
{...tabProps} {...tabProps}
> >
{tabList.map(item => ( {tabList.map(item => (
<Tabs.TabPane {...item} tab={i18nRender(item.tab)} key={item.key} /> <Tabs.TabPane {...item} tab={i18nRender(item.tab)} key={item.key}/>
))} ))}
</Tabs> </Tabs>
) )
...@@ -76,10 +77,10 @@ const renderPageHeader = (h, content, extraContent) => { ...@@ -76,10 +77,10 @@ const renderPageHeader = (h, content, extraContent) => {
<div class={`${prefixedClassName}-detail`}> <div class={`${prefixedClassName}-detail`}>
<div class={`${prefixedClassName}-main`}> <div class={`${prefixedClassName}-main`}>
<div class={`${prefixedClassName}-row`}> <div class={`${prefixedClassName}-row`}>
{ content && ( {content && (
<div class={`${prefixedClassName}-content`}>{content}</div> <div class={`${prefixedClassName}-content`}>{content}</div>
)} )}
{ extraContent && ( {extraContent && (
<div class={`${prefixedClassName}-extraContent`}> <div class={`${prefixedClassName}-extraContent`}>
{extraContent} {extraContent}
</div> </div>
...@@ -113,14 +114,14 @@ const defaultPageHeaderRender = (h, props, pageMeta, i18nRender) => { ...@@ -113,14 +114,14 @@ const defaultPageHeaderRender = (h, props, pageMeta, i18nRender) => {
extra, extra,
title: i18nRender(pageHeaderTitle), title: i18nRender(pageHeaderTitle),
onBack: handleBack || noop, onBack: handleBack || noop,
footer: renderFooter(h, restProps, i18nRender) footer: renderFooter(h, restProps, i18nRender),
} }
if (!handleBack) { if (!handleBack) {
tabProps.backIcon = false tabProps.backIcon = false
} }
return ( return (
<PageHeader { ...{ props: tabProps } }> <PageHeader {...{ props: tabProps }}>
{renderPageHeader(h, content, extraContent)} {renderPageHeader(h, content, extraContent)}
</PageHeader> </PageHeader>
) )
...@@ -131,7 +132,7 @@ const PageHeaderWrapper = { ...@@ -131,7 +132,7 @@ const PageHeaderWrapper = {
name: 'PageHeaderWrapper', name: 'PageHeaderWrapper',
props: PageHeaderWrapperProps, props: PageHeaderWrapperProps,
inject: ['locale', 'contentWidth'], inject: ['locale', 'contentWidth'],
render (h) { render(h) {
const children = this.$slots.default const children = this.$slots.default
const content = getComponentFromProp(this, 'content') const content = getComponentFromProp(this, 'content')
const extra = getComponentFromProp(this, 'extra') const extra = getComponentFromProp(this, 'extra')
...@@ -160,10 +161,20 @@ const PageHeaderWrapper = { ...@@ -160,10 +161,20 @@ const PageHeaderWrapper = {
const routes = this.$route.matched.concat().map(route => { const routes = this.$route.matched.concat().map(route => {
return { return {
path: route.path, path: route.path,
breadcrumbName: i18n(route.meta.title) breadcrumbName: i18n(route.meta.title),
} }
}) })
breadcrumb = { props: { routes }} // TODO:: warn -> abs path
const itemRender = ({ route, params, routes, paths, h }) => {
return routes.indexOf(route) === routes.length - 1 && (
<span>{route.breadcrumbName}</span>
) || (
<router-link to={{ path: route.path }}>{route.breadcrumbName}</router-link>
)
}
breadcrumb = { props: { routes, itemRender } }
} else {
breadcrumb = propsBreadcrumb
} }
const props = { const props = {
...@@ -173,7 +184,7 @@ const PageHeaderWrapper = { ...@@ -173,7 +184,7 @@ const PageHeaderWrapper = {
extraContent, extraContent,
breadcrumb, breadcrumb,
tabChange, tabChange,
back back,
} }
return ( return (
...@@ -181,16 +192,16 @@ const PageHeaderWrapper = { ...@@ -181,16 +192,16 @@ const PageHeaderWrapper = {
<div class={`${prefixedClassName}-page-header-warp`}> <div class={`${prefixedClassName}-page-header-warp`}>
<GridContent>{defaultPageHeaderRender(h, props, pageMeta, i18n)}</GridContent> <GridContent>{defaultPageHeaderRender(h, props, pageMeta, i18n)}</GridContent>
</div> </div>
{ children ? ( {children ? (
<GridContent contentWidth={contentWidth}> <GridContent contentWidth={contentWidth}>
<div class={`${prefixedClassName}-children-content`}> <div class={`${prefixedClassName}-children-content`}>
{children} {children}
</div> </div>
</GridContent> </GridContent>
) : null } ) : null}
</div> </div>
) )
} },
} }
export default PageHeaderWrapper export default PageHeaderWrapper
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment