@meethive/components 0.0.3 → 0.0.4

package/es/ProLayout/Basic/Header.js

@@ -1,111 +1,91 @@
-
-import { createVNode as _createVNode, } from 'vue'
-import { defineComponent, computed, toRefs, } from 'vue'
-import { Layout } from 'ant-design-vue'
-import PropTypes from 'ant-design-vue/es/_util/vue-types'
-import { baseHeaderProps, TopNavHeader } from '../TopHeader'
-import { useRouteContext } from '../RouteContext'
-import { LayoutType } from '../defaultSettings'
-
-export const headerViewProps = {
-  ...baseHeaderProps,
-  headerRender: {
-    type: [Object, Function, Boolean],
-    default: () => undefined
-  },
-  headerTitleRender: {
-    type: [Object, Function, Boolean],
-    default: () => undefined
-  },
-  headerContentRender: {
-    type: [Object, Function, Boolean],
-    default: () => undefined
-  },
-  hasSiderMenu: PropTypes.looseBool,
-  siderWidth: PropTypes.number.def(208)
-}
-
-export default defineComponent({
-  name: 'HeaderView',
-  inheritAttrs: false,
-  props: headerViewProps ,
-  setup(props) {
-    const {
-      prefixCls,
-      fixedHeader,
-      headerHeight,
-      layout,
-      theme,
-      onCollapse
-    } = toRefs(props)
-
-    const context = useRouteContext()
-
-    const needFixedHeader = computed(() => {
-      return fixedHeader.value || (context ).fixedHeader
-    })
-
-    const isTop = computed(() => {
-      return layout.value === 'top'
-    })
-
-    const className = computed(() => ({
-      [`${prefixCls.value}-fixed-header`]: needFixedHeader.value,
-      [`${prefixCls.value}-top-menu`]: isTop.value
-    }))
-
-    const renderContent = () => {
-      const defaultDom = _createVNode(TopNavHeader, {
-        theme: theme.value,
-        mode: 'horizontal',
-        ...props,
-        onCollapse: onCollapse.value,
-        menuData: (context ).menuData
-      }, null)
-      if (props.headerRender) {
-        return (props.headerRender )(props, defaultDom)
-      }
-      return defaultDom
-    }
-
-    const right = computed(() => {
-      return needFixedHeader.value ? 0 : undefined
-    })
-
-    const width = computed(() => {
-      if ((context ).layoutType === LayoutType.PAD) {
-        return (context ).siderWidth
-      }
-      return 0
-    })
-
-    return () => {
-      return (
-        React.createElement(React.Fragment, null
-          , needFixedHeader.value && (
-            React.createElement(Layout.Header, {
-              style: {
-                height: `${headerHeight.value}px`,
-                lineHeight: `${headerHeight.value}px`,
-                background: 'transparent'
-              },}
-            )
-          )
-          , React.createElement(Layout.Header, {
-            style: {
-              padding: 0,
-              height: `${headerHeight.value}px`,
-              lineHeight: `${headerHeight.value}px`,
-              width: props.hasSiderMenu ? `calc(100% - ${width.value}px)` : '100%',
-              zIndex: 100,
-              right: right.value
-            },
-            class: className.value,}
-
-            , renderContent()
-          )
-        )
-      )
-    }
-  }
-})
+import { createVNode as _createVNode } from 'vue';
+import { defineComponent, computed, toRefs } from 'vue';
+import { Layout } from 'ant-design-vue';
+import PropTypes from 'ant-design-vue/es/_util/vue-types';
+import { baseHeaderProps, TopNavHeader } from '../TopHeader';
+import { useRouteContext } from '../RouteContext';
+import { LayoutType } from '../defaultSettings';
+export const headerViewProps = {
+  ...baseHeaderProps,
+  headerRender: {
+    type: [Object, Function, Boolean],
+    default: () => undefined
+  },
+  headerTitleRender: {
+    type: [Object, Function, Boolean],
+    default: () => undefined
+  },
+  headerContentRender: {
+    type: [Object, Function, Boolean],
+    default: () => undefined
+  },
+  hasSiderMenu: PropTypes.looseBool,
+  siderWidth: PropTypes.number.def(208)
+};
+export default defineComponent({
+  name: 'HeaderView',
+  inheritAttrs: false,
+  props: headerViewProps,
+  setup(props) {
+    const {
+      prefixCls,
+      fixedHeader,
+      headerHeight,
+      layout,
+      theme,
+      onCollapse
+    } = toRefs(props);
+    const context = useRouteContext();
+    const needFixedHeader = computed(() => {
+      return fixedHeader.value || context.fixedHeader;
+    });
+    const isTop = computed(() => {
+      return layout.value === 'top';
+    });
+    const className = computed(() => ({
+      [`${prefixCls.value}-fixed-header`]: needFixedHeader.value,
+      [`${prefixCls.value}-top-menu`]: isTop.value
+    }));
+    const renderContent = () => {
+      const defaultDom = _createVNode(TopNavHeader, {
+        theme: theme.value,
+        mode: 'horizontal',
+        ...props,
+        onCollapse: onCollapse.value,
+        menuData: context.menuData
+      }, null);
+      if (props.headerRender) {
+        return props.headerRender(props, defaultDom);
+      }
+      return defaultDom;
+    };
+    const right = computed(() => {
+      return needFixedHeader.value ? 0 : undefined;
+    });
+    const width = computed(() => {
+      if (context.layoutType === LayoutType.PAD) {
+        return context.siderWidth;
+      }
+      return 0;
+    });
+    return () => {
+      return <>
+          {needFixedHeader.value && <Layout.Header style={{
+          height: `${headerHeight.value}px`,
+          lineHeight: `${headerHeight.value}px`,
+          background: 'transparent'
+        }} />}
+          <Layout.Header style={{
+          padding: 0,
+          height: `${headerHeight.value}px`,
+          lineHeight: `${headerHeight.value}px`,
+          width: props.hasSiderMenu ? `calc(100% - ${width.value}px)` : '100%',
+          zIndex: 100,
+          right: right.value
+        }} class={className.value}>
+            {renderContent()}
+          </Layout.Header>
+        </>;
+    };
+  }
+});