Commit 74b673e5 authored by 陈帅's avatar 陈帅

fix type error

parent de7f6505
@import '~antd/lib/style/themes/default.less';
.toolbar {
position: fixed;
right: 0;
bottom: 0;
z-index: 9;
width: 100%;
height: 56px;
padding: 0 24px;
line-height: 56px;
background: #fff;
border-top: 1px solid @border-color-split;
box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.03);
&::after {
display: block;
clear: both;
content: '';
}
.left {
float: left;
}
.right {
float: right;
}
button + button {
margin-left: 8px;
}
}
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import styles from './index.less';
export interface FooterToolbarProps {
extra?: React.ReactNode;
style?: React.CSSProperties;
className?: string;
}
export default class FooterToolbar extends Component<FooterToolbarProps> {
static contextTypes = {
isMobile: PropTypes.bool,
};
state = {
width: undefined,
};
componentDidMount() {
window.addEventListener('resize', this.resizeFooterToolbar);
this.resizeFooterToolbar();
}
componentWillUnmount() {
window.removeEventListener('resize', this.resizeFooterToolbar);
}
resizeFooterToolbar = () => {
const sider = document.querySelector('.ant-layout-sider') as HTMLDivElement;
if (sider == null) {
return;
}
const { isMobile } = this.context;
const width = isMobile ? null : `calc(100% - ${sider.style.width})`;
const { width: stateWidth } = this.state;
if (stateWidth !== width) {
this.setState({ width });
}
};
render() {
const { children, className, extra, ...restProps } = this.props;
const { width } = this.state;
return (
<div className={classNames(className, styles.toolbar)} style={{ width }} {...restProps}>
<div className={styles.left}>{extra}</div>
<div className={styles.right}>{children}</div>
</div>
);
}
}
import React, { Component } from 'react';
import { Card, Form, Icon, Col, Row, DatePicker, TimePicker, Input, Select, Popover } from 'antd';
import {
Card,
Form,
Icon,
Button,
Col,
Row,
DatePicker,
TimePicker,
Input,
Select,
Popover,
} from 'antd';
import { connect } from 'dva';
import TableForm from './components/TableForm';
import styles from './style.less';
import { FormComponentProps } from 'antd/lib/form';
import { Dispatch } from 'redux';
import FooterToolbar from './components/FooterToolbar';
const { Option } = Select;
const { RangePicker } = DatePicker;
......@@ -47,9 +60,10 @@ const tableData = [
interface PAGE_NAME_UPPER_CAMEL_CASEProps extends FormComponentProps {
dispatch: Dispatch;
submitting: boolean;
}
@connect(({ loading }: { loading: { effects: any } }) => ({
@connect(({ loading }: { loading: { effects: { [key: string]: boolean } } }) => ({
submitting: loading.effects['BLOCK_NAME_CAMEL_CASE/submitAdvancedForm'],
}))
class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEProps> {
......@@ -99,7 +113,12 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
content={errorList}
overlayClassName={styles.errorPopover}
trigger="click"
getPopupContainer={trigger => trigger && trigger.parentNode}
getPopupContainer={(trigger: HTMLElement) => {
if (trigger && trigger.parentNode) {
return trigger.parentNode as HTMLElement;
}
return trigger;
}}
>
<Icon type="exclamation-circle" />
</Popover>
......@@ -140,8 +159,9 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
render() {
const {
form: { getFieldDecorator },
submitting,
} = this.props;
const { width } = this.state;
return (
<>
<Card title="仓库管理" className={styles.card} bordered={false}>
......@@ -269,7 +289,12 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<TimePicker
placeholder="提醒时间"
style={{ width: '100%' }}
getPopupContainer={trigger => trigger.ParentNode}
getPopupContainer={trigger => {
if (trigger && trigger.parentNode) {
return trigger.parentNode as HTMLElement;
}
return trigger;
}}
/>
)}
</Form.Item>
......@@ -294,12 +319,12 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
initialValue: tableData,
})(<TableForm />)}
</Card>
{/* <FooterToolbar style={{ width }}>
<FooterToolbar style={{ width }}>
{this.getErrorInfo()}
<Button type="primary" onClick={this.validate} loading={submitting}>
提交
</Button>
</FooterToolbar> */}
</FooterToolbar>
</>
);
}
......
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