Unverified Commit 9d54a0ea authored by wadezz's avatar wadezz Committed by GitHub

Merge pull request #1 from ant-design/master

merge master
parents 7e6b9aa0 d2577208
**/*.md
**/*.svg
**/*.ejs
**/*.html
package.json
.umi
.umi-production
{
"singleQuote": true,
"trailingComma": "es5",
"trailingComma": "all",
"printWidth": 100,
"proseWrap": "never",
"overrides": [
{
"files": ".prettierrc",
"options": { "parser": "json" }
"options": {
"parser": "json"
}
}
]
}
\ No newline at end of file
{
"extends": [
"stylelint-config-standard",
"stylelint-config-css-modules",
"stylelint-config-rational-order",
"stylelint-config-prettier"
],
"plugins": ["stylelint-order", "stylelint-declaration-block-no-ignored-properties"],
"rules": {
"declaration-empty-line-before": null,
"no-descending-specificity": null,
"selector-pseudo-class-no-unknown": null,
"selector-pseudo-element-colon-notation": null
"plugin/declaration-block-no-ignored-properties": true
}
}
@import '~antd/lib/style/themes/default.less';
.avatarHolder {
text-align: center;
margin-bottom: 24px;
text-align: center;
& > img {
width: 104px;
......@@ -11,19 +11,19 @@
}
.name {
margin-bottom: 4px;
color: @heading-color;
font-weight: 500;
font-size: 20px;
line-height: 28px;
font-weight: 500;
color: @heading-color;
margin-bottom: 4px;
}
}
.detail {
p {
position: relative;
margin-bottom: 8px;
padding-left: 26px;
position: relative;
&:last-child {
margin-bottom: 0;
......@@ -32,10 +32,10 @@
i {
position: absolute;
height: 14px;
width: 14px;
left: 0;
top: 4px;
left: 0;
width: 14px;
height: 14px;
background: url(https://gw.alipayobjects.com/zos/rmsportal/pBjWzVAHnOOtAUvZmZfy.svg);
&.title {
......@@ -54,9 +54,9 @@
.tagsTitle,
.teamTitle {
font-weight: 500;
color: @heading-color;
margin-bottom: 12px;
color: @heading-color;
font-weight: 500;
}
.tags {
......@@ -77,12 +77,12 @@
a {
display: block;
margin-bottom: 24px;
color: @text-color;
transition: color 0.3s;
overflow: hidden;
color: @text-color;
white-space: nowrap;
text-overflow: ellipsis;
word-break: break-all;
white-space: nowrap;
transition: color 0.3s;
&:hover {
color: @primary-color;
......
export interface ITag {
export interface itag {
key: string;
label: string;
}
export interface Province {
export interface province {
label: string;
key: string;
}
export interface City {
export interface city {
label: string;
key: string;
}
export interface Geographic {
export interface geographic {
province: Province;
city: City;
}
export interface Notice {
export interface notice {
id: string;
title: string;
logo: string;
......@@ -29,7 +29,7 @@ export interface Notice {
memberLink: string;
}
export interface CurrentUser {
export interface currentuser {
name: string;
avatar: string;
userid: string;
......
......@@ -36,7 +36,7 @@ const operationTabList = [
];
interface BLOCK_NAME_CAMEL_CASEProps extends RouteChildrenProps {
dispatch: Dispatch;
dispatch: Dispatch<any>;
currentUser: CurrentUser;
currentUserLoading: boolean;
}
......@@ -57,7 +57,7 @@ interface BLOCK_NAME_CAMEL_CASEState {
}) => ({
currentUser: BLOCK_NAME_CAMEL_CASE.currentUser,
currentUserLoading: loading.effects['BLOCK_NAME_CAMEL_CASE/fetchCurrent'],
})
}),
)
class PAGE_NAME_UPPER_CAMEL_CASE extends PureComponent<
BLOCK_NAME_CAMEL_CASEProps,
......@@ -65,7 +65,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends PureComponent<
> {
static getDerivedStateFromProps(
props: BLOCK_NAME_CAMEL_CASEProps,
state: BLOCK_NAME_CAMEL_CASEState
state: BLOCK_NAME_CAMEL_CASEState,
) {
const { match, location } = props;
const { tabKey } = state;
......@@ -88,6 +88,8 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends PureComponent<
tabKey: 'articles',
};
input: Input | null | undefined;
componentDidMount() {
const { dispatch } = this.props;
dispatch({
......@@ -108,8 +110,6 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends PureComponent<
this.setState({ inputVisible: true }, () => this.input && this.input.focus());
};
input: Input | null | undefined;
saveInputRef = (input: Input | null) => {
this.input = input;
};
......
......@@ -11,7 +11,7 @@ import { AnyAction } from 'redux';
export type Effect = (
action: AnyAction,
effects: EffectsCommandMap & { select: <T>(func: (state: ModalState) => T) => T }
effects: EffectsCommandMap & { select: <T>(func: (state: ModalState) => T) => T },
) => void;
export interface ModelType {
......
......@@ -7,7 +7,7 @@ function getProvince(req: any, res: { json: (arg0: { name: string; id: string }[
function getCity(
req: { params: { province: string | number } },
res: { json: (arg: any) => void }
res: { json: (arg: any) => void },
) {
return res.json(city[req.params.province]);
}
......
......@@ -5,18 +5,18 @@
padding-top: 12px;
.left {
max-width: 448px;
min-width: 224px;
max-width: 448px;
}
.right {
flex: 1;
padding-left: 104px;
.avatar_title {
height: 22px;
font-size: @font-size-base;
margin-bottom: 8px;
color: @heading-color;
font-size: @font-size-base;
line-height: 22px;
margin-bottom: 8px;
}
.avatar {
width: 144px;
......@@ -39,11 +39,11 @@
flex-direction: column-reverse;
.right {
padding: 20px;
display: flex;
flex-direction: column;
align-items: center;
max-width: 448px;
padding: 20px;
.avatar_title {
display: none;
}
......
......@@ -2,12 +2,12 @@
.row {
.item {
max-width: 220px;
width: 50%;
max-width: 220px;
}
.item:first-child {
margin-right: 8px;
width: ~'calc(50% - 8px)';
margin-right: 8px;
}
}
......
......@@ -16,7 +16,7 @@ const nullSlectItem: SelectItem = {
};
interface GeographicViewProps {
dispatch?: Dispatch;
dispatch?: Dispatch<any>;
province?: ProvinceData[];
city?: CityData[];
value?: {
......@@ -44,28 +44,30 @@ interface GeographicViewProps {
city,
loading: loading.models.BLOCK_NAME_CAMEL_CASE,
};
}
},
)
class GeographicView extends Component<GeographicViewProps> {
componentDidMount = () => {
const { dispatch } = this.props;
dispatch &&
if (dispatch) {
dispatch({
type: 'BLOCK_NAME_CAMEL_CASE/fetchProvince',
});
}
};
componentDidUpdate(props: GeographicViewProps) {
const { dispatch, value } = this.props;
if (!props.value && !!value && !!value.province) {
dispatch &&
if (dispatch) {
dispatch({
type: 'BLOCK_NAME_CAMEL_CASE/fetchCity',
payload: value.province.key,
});
}
}
}
getProvinceOption() {
const { province } = this.props;
......@@ -101,17 +103,18 @@ class GeographicView extends Component<GeographicViewProps> {
selectProvinceItem = (item: SelectItem) => {
const { dispatch, onChange } = this.props;
dispatch &&
if (dispatch) {
dispatch({
type: 'BLOCK_NAME_CAMEL_CASE/fetchCity',
payload: item.key,
});
onChange &&
}
if (onChange) {
onChange({
province: item,
city: nullSlectItem,
});
}
};
selectCityItem = (item: SelectItem) => {
......
@import '~antd/lib/style/themes/default.less';
.area_code {
width: 30%;
max-width: 128px;
margin-right: 8px;
width: 30%;
}
.phone_number {
max-width: 312px;
width: ~'calc(70% - 8px)';
max-width: 312px;
}
......@@ -20,12 +20,14 @@ class PhoneView extends PureComponent<PhoneViewProps> {
className={styles.area_code}
value={values[0]}
onChange={e => {
// tslint:disable-next-line: no-unused-expression
onChange && onChange(`${e.target.value}-${values[1]}`);
}}
/>
<Input
className={styles.phone_number}
onChange={e => {
// tslint:disable-next-line: no-unused-expression
onChange && onChange(`${values[0]}-${e.target.value}`);
}}
value={values[1]}
......
......@@ -39,7 +39,7 @@ const validatorGeographic = (
province: SelectItem;
city: SelectItem;
},
callback: (message?: string) => void
callback: (message?: string) => void,
) => {
const { province, city } = value;
if (!province.key) {
......@@ -70,6 +70,7 @@ interface BaseViewProps extends FormComponentProps {
currentUser: BLOCK_NAME_CAMEL_CASE.currentUser,
}))
class BaseView extends Component<BaseViewProps> {
view: HTMLDivElement | undefined;
componentDidMount() {
this.setBaseInfo();
}
......@@ -96,7 +97,6 @@ class BaseView extends Component<BaseViewProps> {
}
return '';
}
view: HTMLDivElement | undefined;
getViewDom = (ref: HTMLDivElement) => {
this.view = ref;
......@@ -142,7 +142,7 @@ class BaseView extends Component<BaseViewProps> {
<Input.TextArea
placeholder={formatMessage({ id: 'BLOCK_NAME.basic.profile-placeholder' })}
rows={4}
/>
/>,
)}
</FormItem>
<FormItem label={formatMessage({ id: 'BLOCK_NAME.basic.country' })}>
......@@ -156,7 +156,7 @@ class BaseView extends Component<BaseViewProps> {
})(
<Select style={{ maxWidth: 220 }}>
<Option value="China">中国</Option>
</Select>
</Select>,
)}
</FormItem>
<FormItem label={formatMessage({ id: 'BLOCK_NAME.basic.geographic' })}>
......
......@@ -8,7 +8,7 @@ class BindingView extends Component {
title: formatMessage({ id: 'BLOCK_NAME.binding.taobao' }, {}),
description: formatMessage({ id: 'BLOCK_NAME.binding.taobao-description' }, {}),
actions: [
<a>
<a key="Bind">
<FormattedMessage id="BLOCK_NAME.binding.bind" defaultMessage="Bind" />
</a>,
],
......@@ -18,7 +18,7 @@ class BindingView extends Component {
title: formatMessage({ id: 'BLOCK_NAME.binding.alipay' }, {}),
description: formatMessage({ id: 'BLOCK_NAME.binding.alipay-description' }, {}),
actions: [
<a>
<a key="Bind">
<FormattedMessage id="BLOCK_NAME.binding.bind" defaultMessage="Bind" />
</a>,
],
......@@ -28,7 +28,7 @@ class BindingView extends Component {
title: formatMessage({ id: 'BLOCK_NAME.binding.dingding' }, {}),
description: formatMessage({ id: 'BLOCK_NAME.binding.dingding-description' }, {}),
actions: [
<a>
<a key="Bind">
<FormattedMessage id="BLOCK_NAME.binding.bind" defaultMessage="Bind" />
</a>,
],
......
......@@ -34,7 +34,7 @@ class SecurityView extends Component {
</Fragment>
),
actions: [
<a>
<a key="Modify">
<FormattedMessage id="BLOCK_NAME.security.modify" defaultMessage="Modify" />
</a>,
],
......@@ -43,10 +43,10 @@ class SecurityView extends Component {
title: formatMessage({ id: 'BLOCK_NAME.security.phone' }, {}),
description: `${formatMessage(
{ id: 'BLOCK_NAME.security.phone-description' },
{}
{},
)}:138****8293`,
actions: [
<a>
<a key="Modify">
<FormattedMessage id="BLOCK_NAME.security.modify" defaultMessage="Modify" />
</a>,
],
......@@ -55,7 +55,7 @@ class SecurityView extends Component {
title: formatMessage({ id: 'BLOCK_NAME.security.question' }, {}),
description: formatMessage({ id: 'BLOCK_NAME.security.question-description' }, {}),
actions: [
<a>
<a key="Set">
<FormattedMessage id="BLOCK_NAME.security.set" defaultMessage="Set" />
</a>,
],
......@@ -64,10 +64,10 @@ class SecurityView extends Component {
title: formatMessage({ id: 'BLOCK_NAME.security.email' }, {}),
description: `${formatMessage(
{ id: 'BLOCK_NAME.security.email-description' },
{}
{},
)}:ant***sign.com`,
actions: [
<a>
<a key="Modify">
<FormattedMessage id="BLOCK_NAME.security.modify" defaultMessage="Modify" />
</a>,
],
......@@ -76,7 +76,7 @@ class SecurityView extends Component {
title: formatMessage({ id: 'BLOCK_NAME.security.mfa' }, {}),
description: formatMessage({ id: 'BLOCK_NAME.security.mfa-description' }, {}),
actions: [
<a>
<a key="bind">
<FormattedMessage id="BLOCK_NAME.security.bind" defaultMessage="Bind" />
</a>,
],
......
export interface ITag {
export interface itag {
key: string;
label: string;
}
export interface Province {
export interface province {
label: string;
key: string;
}
export interface City {
export interface city {
label: string;
key: string;
}
export interface Geographic {
export interface geographic {
province: Province;
city: City;
}
export interface ProvinceData {
export interface provincedata {
name: string;
id: string;
}
export interface CityData {
export interface citydata {
province: string;
name: string;
id: string;
}
export interface Notice {
export interface notice {
id: string;
title: string;
logo: string;
......@@ -37,7 +37,7 @@ export interface Notice {
memberLink: string;
}
export interface CurrentUser {
export interface currentuser {
name: string;
avatar: string;
userid: string;
......
......@@ -13,7 +13,7 @@ import { CurrentUser } from './data';
const { Item } = Menu;
interface PAGE_NAME_UPPER_CAMEL_CASEProps {
dispatch: Dispatch;
dispatch: Dispatch<any>;
currentUser: CurrentUser;
}
......@@ -32,6 +32,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
PAGE_NAME_UPPER_CAMEL_CASEProps,
PAGE_NAME_UPPER_CAMEL_CASEState
> {
main: HTMLDivElement | undefined;
constructor(props: PAGE_NAME_UPPER_CAMEL_CASEProps) {
super(props);
const menuMap = {
......@@ -56,8 +57,6 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
};
}
main: HTMLDivElement | undefined;
componentDidMount() {
const { dispatch } = this.props;
dispatch({
......
......@@ -13,7 +13,7 @@ export interface ModalState {
export type Effect = (
action: AnyAction,
effects: EffectsCommandMap & { select: <T>(func: (state: ModalState) => T) => T }
effects: EffectsCommandMap & { select: <T>(func: (state: ModalState) => T) => T },
) => void;
export interface ModelType {
......
@import '~antd/lib/style/themes/default.less';
.main {
display: flex;
width: 100%;
height: 100%;
background-color: @body-background;
display: flex;
padding-top: 16px;
padding-bottom: 16px;
overflow: auto;
background-color: @body-background;
.leftMenu {
width: 224px;
border-right: @border-width-base @border-style-base @border-color-split;
......@@ -22,16 +22,16 @@
}
.right {
flex: 1;
padding-left: 40px;
padding-right: 40px;
padding-top: 8px;
padding-right: 40px;
padding-bottom: 8px;
padding-left: 40px;
.title {
font-size: 20px;
margin-bottom: 12px;
color: @heading-color;
line-height: 28px;
font-weight: 500;
margin-bottom: 12px;
font-size: 20px;
line-height: 28px;
}
}
:global {
......@@ -48,19 +48,19 @@
.ant-list-item-meta {
// 账号绑定图标
.taobao {
color: #ff4000;
display: block;
color: #ff4000;
font-size: 48px;
line-height: 48px;
border-radius: @border-radius-base;
}
.dingding {
background-color: #2eabff;
margin: 2px;
padding: 6px;
color: #fff;
font-size: 32px;
line-height: 32px;
padding: 6px;
margin: 2px;
background-color: #2eabff;
border-radius: @border-radius-base;
}
.alipay {
......
......@@ -4,9 +4,117 @@ import { isEqual } from 'lodash';
import styles from '../style.less';
class TableForm extends PureComponent {
static getDerivedStateFromProps(nextProps, preState) {
if (isEqual(nextProps.value, preState.value)) {
return null;
}
return {
data: nextProps.value,
value: nextProps.value,
};
}
index = 0;
cacheOriginData = {};
columns = [
{
title: '成员姓名',
dataIndex: 'name',
key: 'name',
width: '20%',
render: (text, record) => {
if (record.editable) {
return (
<Input
value={text}
autoFocus
onChange={e => this.handleFieldChange(e, 'name', record.key)}
onKeyPress={e => this.handleKeyPress(e, record.key)}
placeholder="成员姓名"
/>
);
}
return text;
},
},
{
title: '工号',
dataIndex: 'workId',
key: 'workId',
width: '20%',
render: (text, record) => {
if (record.editable) {
return (
<Input
value={text}
onChange={e => this.handleFieldChange(e, 'workId', record.key)}
onKeyPress={e => this.handleKeyPress(e, record.key)}
placeholder="工号"
/>
);
}
return text;
},
},
{
title: '所属部门',
dataIndex: 'department',
key: 'department',
width: '40%',
render: (text, record) => {
if (record.editable) {
return (
<Input
value={text}
onChange={e => this.handleFieldChange(e, 'department', record.key)}
onKeyPress={e => this.handleKeyPress(e, record.key)}
placeholder="所属部门"
/>
);
}
return text;
},
},
{
title: '操作',
key: 'action',
render: (text, record) => {
const { loading } = this.state;
if (!!record.editable && loading) {
return null;
}
if (record.editable) {
if (record.isNew) {
return (
<span>
<a onClick={e => this.saveRow(e, record.key)}>添加</a>
<Divider type="vertical" />
<Popconfirm title="是否要删除此行?" onConfirm={() => this.remove(record.key)}>
<a>删除</a>
</Popconfirm>
</span>
);
}
return (
<span>
<a onClick={e => this.saveRow(e, record.key)}>保存</a>
<Divider type="vertical" />
<a onClick={e => this.cancel(e, record.key)}>取消</a>
</span>
);
}
return (
<span>
<a onClick={e => this.toggleEditable(e, record.key)}>编辑</a>
<Divider type="vertical" />
<Popconfirm title="是否要删除此行?" onConfirm={() => this.remove(record.key)}>
<a>删除</a>
</Popconfirm>
</span>
);
},
},
];
constructor(props) {
super(props);
......@@ -19,16 +127,6 @@ class TableForm extends PureComponent {
};
}
static getDerivedStateFromProps(nextProps, preState) {
if (isEqual(nextProps.value, preState.value)) {
return null;
}
return {
data: nextProps.value,
value: nextProps.value,
};
}
getRowByKey(key, newData) {
const { data } = this.state;
return (newData || data).filter(item => item.key === key)[0];
......@@ -132,115 +230,14 @@ class TableForm extends PureComponent {
this.setState({ data: newData });
this.clickedCancel = false;
}
render() {
const columns = [
{
title: '成员姓名',
dataIndex: 'name',
key: 'name',
width: '20%',
render: (text, record) => {
if (record.editable) {
return (
<Input
value={text}
autoFocus
onChange={e => this.handleFieldChange(e, 'name', record.key)}
onKeyPress={e => this.handleKeyPress(e, record.key)}
placeholder="成员姓名"
/>
);
}
return text;
},
},
{
title: '工号',
dataIndex: 'workId',
key: 'workId',
width: '20%',
render: (text, record) => {
if (record.editable) {
return (
<Input
value={text}
onChange={e => this.handleFieldChange(e, 'workId', record.key)}
onKeyPress={e => this.handleKeyPress(e, record.key)}
placeholder="工号"
/>
);
}
return text;
},
},
{
title: '所属部门',
dataIndex: 'department',
key: 'department',
width: '40%',
render: (text, record) => {
if (record.editable) {
return (
<Input
value={text}
onChange={e => this.handleFieldChange(e, 'department', record.key)}
onKeyPress={e => this.handleKeyPress(e, record.key)}
placeholder="所属部门"
/>
);
}
return text;
},
},
{
title: '操作',
key: 'action',
render: (text, record) => {
const { loading } = this.state;
if (!!record.editable && loading) {
return null;
}
if (record.editable) {
if (record.isNew) {
return (
<span>
<a onClick={e => this.saveRow(e, record.key)}>添加</a>
<Divider type="vertical" />
<Popconfirm title="是否要删除此行?" onConfirm={() => this.remove(record.key)}>
<a>删除</a>
</Popconfirm>
</span>
);
}
return (
<span>
<a onClick={e => this.saveRow(e, record.key)}>保存</a>
<Divider type="vertical" />
<a onClick={e => this.cancel(e, record.key)}>取消</a>
</span>
);
}
return (
<span>
<a onClick={e => this.toggleEditable(e, record.key)}>编辑</a>
<Divider type="vertical" />
<Popconfirm title="是否要删除此行?" onConfirm={() => this.remove(record.key)}>
<a>删除</a>
</Popconfirm>
</span>
);
},
},
];
const { loading, data } = this.state;
return (
<Fragment>
<Table
loading={loading}
columns={columns}
columns={this.columns}
dataSource={data}
pagination={false}
rowClassName={record => (record.editable ? styles.editable : '')}
......
......@@ -59,7 +59,7 @@ const tableData = [
];
interface PAGE_NAME_UPPER_CAMEL_CASEProps extends FormComponentProps {
dispatch: Dispatch;
dispatch: Dispatch<any>;
submitting: boolean;
}
......@@ -184,7 +184,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
addonBefore="http://"
addonAfter=".com"
placeholder="请输入"
/>
/>,
)}
</Form.Item>
</Col>
......@@ -196,7 +196,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<Select placeholder="请选择管理员">
<Option value="xiao">付晓晓</Option>
<Option value="mao">周毛毛</Option>
</Select>
</Select>,
)}
</Form.Item>
</Col>
......@@ -210,7 +210,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<Select placeholder="请选择审批员">
<Option value="xiao">付晓晓</Option>
<Option value="mao">周毛毛</Option>
</Select>
</Select>,
)}
</Form.Item>
</Col>
......@@ -219,7 +219,10 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
{getFieldDecorator('dateRange', {
rules: [{ required: true, message: '请选择生效日期' }],
})(
<RangePicker placeholder={['开始日期', '结束日期']} style={{ width: '100%' }} />
<RangePicker
placeholder={['开始日期', '结束日期']}
style={{ width: '100%' }}
/>,
)}
</Form.Item>
</Col>
......@@ -231,7 +234,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<Select placeholder="请选择仓库类型">
<Option value="private">私密</Option>
<Option value="public">公开</Option>
</Select>
</Select>,
)}
</Form.Item>
</Col>
......@@ -263,7 +266,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<Select placeholder="请选择管理员">
<Option value="xiao">付晓晓</Option>
<Option value="mao">周毛毛</Option>
</Select>
</Select>,
)}
</Form.Item>
</Col>
......@@ -277,7 +280,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<Select placeholder="请选择审批员">
<Option value="xiao">付晓晓</Option>
<Option value="mao">周毛毛</Option>
</Select>
</Select>,
)}
</Form.Item>
</Col>
......@@ -295,7 +298,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
}
return trigger;
}}
/>
/>,
)}
</Form.Item>
</Col>
......@@ -307,7 +310,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<Select placeholder="请选择仓库类型">
<Option value="private">私密</Option>
<Option value="public">公开</Option>
</Select>
</Select>,
)}
</Form.Item>
</Col>
......
......@@ -7,7 +7,7 @@ export interface ModalState {}
export type Effect = (
action: AnyAction,
effects: EffectsCommandMap & { select: <T>(func: (state: ModalState) => T) => T }
effects: EffectsCommandMap & { select: <T>(func: (state: ModalState) => T) => T },
) => void;
export interface ModelType {
......
......@@ -5,9 +5,9 @@
}
.heading {
margin: 0 0 16px 0;
font-size: 14px;
line-height: 22px;
margin: 0 0 16px 0;
}
.steps:global(.ant-steps) {
......@@ -16,9 +16,9 @@
}
.errorIcon {
cursor: pointer;
color: @error-color;
margin-right: 24px;
color: @error-color;
cursor: pointer;
i {
margin-right: 4px;
}
......@@ -27,18 +27,18 @@
.errorPopover {
:global {
.ant-popover-inner-content {
padding: 0;
min-width: 256px;
max-height: 290px;
padding: 0;
overflow: auto;
min-width: 256px;
}
}
}
.errorListItem {
padding: 8px 16px;
list-style: none;
border-bottom: 1px solid @border-color-split;
padding: 8px 16px;
cursor: pointer;
transition: all 0.3s;
&:hover {
......@@ -48,16 +48,16 @@
border: 0;
}
.errorIcon {
color: @error-color;
float: left;
margin-top: 4px;
margin-right: 12px;
padding-bottom: 22px;
color: @error-color;
}
.errorField {
font-size: 12px;
color: @text-color-secondary;
margin-top: 2px;
color: @text-color-secondary;
font-size: 12px;
}
}
......
......@@ -37,7 +37,7 @@ const DescriptionList: React.SFC<DescriptionListProps> & {
{title ? <div className={styles.title}>{title}</div> : null}
<Row gutter={gutter}>
{React.Children.map(children, (child: any) =>
child ? React.cloneElement(child, { column }) : child
child ? React.cloneElement(child, { column }) : child,
)}
</Row>
</div>
......
export interface AdvancedOperation1 {
export interface advancedoperation1 {
key: string;
type: string;
name: string;
......@@ -7,7 +7,7 @@ export interface AdvancedOperation1 {
memo: string;
}
export interface AdvancedOperation2 {
export interface advancedoperation2 {
key: string;
type: string;
name: string;
......@@ -16,7 +16,7 @@ export interface AdvancedOperation2 {
memo: string;
}
export interface AdvancedOperation3 {
export interface advancedoperation3 {
key: string;
type: string;
name: string;
......@@ -25,7 +25,7 @@ export interface AdvancedOperation3 {
memo: string;
}
export interface AdvancedProfileData {
export interface advancedprofiledata {
advancedOperation1: AdvancedOperation1[];
advancedOperation2: AdvancedOperation2[];
advancedOperation3: AdvancedOperation3[];
......
......@@ -85,17 +85,6 @@ const description = (
</DescriptionList>
);
const tabList = [
{
key: 'detail',
tab: '详情',
},
{
key: 'rule',
tab: '规则',
},
];
/**
* render Footer tabList
* In order to be compatible with the old version of the PageHeader
......@@ -173,7 +162,7 @@ const customDot = (
status,
}: {
status: string;
}
},
) =>
status === 'process' ? (
<Popover placement="topLeft" arrowPointAtCenter content={popoverContent}>
......@@ -244,7 +233,7 @@ const columns = [
}) => ({
BLOCK_NAME_CAMEL_CASE,
loading: loading.effects['BLOCK_NAME_CAMEL_CASE/fetchAdvanced'],
})
}),
)
class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
{ loading: boolean; BLOCK_NAME_CAMEL_CASE: AdvancedProfileData; dispatch: Dispatch },
......@@ -263,7 +252,6 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
componentDidMount() {
const { dispatch, BLOCK_NAME_CAMEL_CASE } = this.props;
console.log(BLOCK_NAME_CAMEL_CASE);
dispatch({
type: 'BLOCK_NAME_CAMEL_CASE/fetchAdvanced',
});
......@@ -344,7 +332,20 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
margin: -24,
}}
extra={action}
footer={<RenderFooter tabList={tabList} />}
footer={
<RenderFooter
tabList={[
{
key: 'detail',
tab: '详情',
},
{
key: 'rule',
tab: '规则',
},
]}
/>
}
>
<div
style={{
......
......@@ -7,7 +7,7 @@ import { AdvancedProfileData } from './data';
export type Effect = (
action: AnyAction,
effects: EffectsCommandMap & { select: <T>(func: (state: AdvancedProfileData) => T) => T }
effects: EffectsCommandMap & { select: <T>(func: (state: AdvancedProfileData) => T) => T },
) => void;
export interface ModelType {
......
......@@ -14,14 +14,14 @@
.noData {
color: @disabled-color;
text-align: center;
line-height: 64px;
font-size: 16px;
line-height: 64px;
text-align: center;
i {
font-size: 24px;
margin-right: 16px;
position: relative;
top: 3px;
margin-right: 16px;
font-size: 24px;
}
}
......@@ -31,10 +31,10 @@
}
.stepDescription {
font-size: 14px;
position: relative;
left: 38px;
padding-top: 8px;
font-size: 14px;
text-align: left;
> div {
......
......@@ -28,6 +28,8 @@ class Bar extends Component<
state = {
autoHideXLabels: false,
};
root: HTMLDivElement | undefined;
node: HTMLDivElement | undefined;
componentDidMount() {
window.addEventListener('resize', this.resize, { passive: true });
......@@ -36,11 +38,9 @@ class Bar extends Component<
componentWillUnmount() {
window.removeEventListener('resize', this.resize);
}
root: HTMLDivElement | undefined;
handleRoot = (n: HTMLDivElement) => {
this.root = n;
};
node: HTMLDivElement | undefined;
handleRef = (n: HTMLDivElement) => {
this.node = n;
};
......
......@@ -45,6 +45,8 @@ class Pie extends Component<IPieProps, IPieState> {
};
requestRef: number | undefined;
root!: HTMLDivElement;
chart: G2.Chart | undefined;
componentDidMount() {
window.addEventListener(
......@@ -52,7 +54,7 @@ class Pie extends Component<IPieProps, IPieState> {
() => {
this.requestRef = requestAnimationFrame(() => this.resize());
},
{ passive: true }
{ passive: true },
);
}
......@@ -123,8 +125,6 @@ class Pie extends Component<IPieProps, IPieState> {
legendData,
});
};
root!: HTMLDivElement;
chart: G2.Chart | undefined;
// for window resize auto responsive legend
@Bind()
......
......@@ -34,6 +34,11 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
height: 0,
width: 0,
};
isUnmount!: boolean;
requestRef!: number;
root: HTMLDivElement | undefined;
imageMask: HTMLImageElement | undefined;
componentDidMount() {
requestAnimationFrame(() => {
......@@ -49,20 +54,16 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
this.renderChart(this.props);
}
}
isUnmount!: boolean;
componentWillUnmount() {
this.isUnmount = true;
window.cancelAnimationFrame(this.requestRef);
window.removeEventListener('resize', this.resize);
}
requestRef!: number;
resize = () => {
this.requestRef = requestAnimationFrame(() => {
this.renderChart(this.props);
});
};
root: HTMLDivElement | undefined;
saveRootRef = (node: HTMLDivElement) => {
this.root = node;
};
......@@ -91,7 +92,7 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
(Shape as any).registerShape('point', 'cloud', {
drawShape(
cfg: { x: any; y: any },
container: { addShape: (arg0: string, arg1: { attrs: any }) => void }
container: { addShape: (arg0: string, arg1: { attrs: any }) => void },
) {
const attrs = getTextAttrs(cfg);
return container.addShape('text', {
......@@ -103,7 +104,6 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
},
});
};
imageMask: HTMLImageElement | undefined;
@Bind()
@Debounce(500)
......
......@@ -41,7 +41,7 @@ class TimelineChart extends React.Component<ITimelineChartProps> {
if (data[0] && data[0].y1 && data[0].y2) {
max = Math.max(
[...data].sort((a, b) => b.y1 - a.y1)[0].y1,
[...data].sort((a, b) => b.y2 - a.y2)[0].y2
[...data].sort((a, b) => b.y2 - a.y2)[0].y2,
);
}
......
......@@ -18,6 +18,9 @@ class WaterWave extends Component<IWaterWaveProps> {
state = {
radio: 1,
};
timer: number = 0;
root: HTMLDivElement | undefined | null;
node: HTMLCanvasElement | undefined | null;
componentDidMount() {
this.renderChart();
......@@ -27,7 +30,7 @@ class WaterWave extends Component<IWaterWaveProps> {
() => {
requestAnimationFrame(() => this.resize());
},
{ passive: true }
{ passive: true },
);
}
......@@ -56,7 +59,6 @@ class WaterWave extends Component<IWaterWaveProps> {
});
}
};
timer: number = 0;
renderChart(type?: string) {
const { percent, color = '#1890FF' } = this.props;
const data = percent / 100;
......@@ -199,8 +201,6 @@ class WaterWave extends Component<IWaterWaveProps> {
}
render();
}
root: HTMLDivElement | undefined | null;
node: HTMLCanvasElement | undefined | null;
render() {
const { radio } = this.state;
const { percent, title, height = 1 } = this.props;
......
......@@ -19,7 +19,7 @@ function getAutoHeight(n: HTMLDivElement) {
return 0;
}
let node = n;
const node = n;
let height = computeHeight(node);
const parentNode = node.parentNode as HTMLDivElement;
......@@ -36,7 +36,7 @@ interface IAutoHeightProps {
function autoHeight() {
return function<P extends IAutoHeightProps>(
WrappedComponent: React.ComponentClass<P> | React.SFC<P>
WrappedComponent: React.ComponentClass<P> | React.SFC<P>,
): React.ComponentClass<P> {
class AutoHeightComponent extends React.Component<P & IAutoHeightProps> {
state = {
......@@ -46,11 +46,11 @@ function autoHeight() {
componentDidMount() {
const { height } = this.props;
if (!height) {
const h = getAutoHeight(this.root);
let h = getAutoHeight(this.root);
// eslint-disable-next-line
this.setState({ computedHeight: h });
if (h < 1) {
const h = getAutoHeight(this.root);
h = getAutoHeight(this.root);
this.setState({ computedHeight: h });
}
}
......
......@@ -25,7 +25,7 @@ const Trend: React.SFC<ITrendProps> = ({
[styles.trendItemGrey]: !colorful,
[styles.reverseColor]: reverseColor && colorful,
},
className
className,
);
return (
<div {...rest} className={classString} title={typeof children === 'string' ? children : ''}>
......
export interface IVisitData {
export interface ivisitdata {
x: string;
y: number;
}
export interface IVisitData2 {
export interface ivisitdata2 {
x: string;
y: number;
}
export interface ISalesData {
export interface isalesdata {
x: string;
y: number;
}
export interface ISearchData {
export interface isearchdata {
index: number;
keyword: string;
count: number;
......@@ -21,39 +21,39 @@ export interface ISearchData {
status: number;
}
export interface IOfflineData {
export interface iofflinedata {
name: string;
cvr: number;
}
export interface IOfflineChartData {
export interface iofflinechartdata {
x: any;
y1: number;
y2: number;
}
export interface ISalesTypeData {
export interface isalestypedata {
x: string;
y: number;
}
export interface ISalesTypeDataOnline {
export interface isalestypedataonline {
x: string;
y: number;
}
export interface ISalesTypeDataOffline {
export interface isalestypedataoffline {
x: string;
y: number;
}
export interface IRadarData {
export interface iradardata {
name: string;
label: string;
value: number;
}
export interface IAnalysisData {
export interface ianalysisdata {
visitData: IVisitData[];
visitData2: IVisitData2[];
salesData: ISalesData[];
......
......@@ -18,7 +18,7 @@ const OfflineData = React.lazy(() => import('./components/OfflineData'));
interface BLOCK_NAME_CAMEL_CASEProps {
BLOCK_NAME_CAMEL_CASE: IAnalysisData;
dispatch: Dispatch;
dispatch: Dispatch<any>;
loading: boolean;
}
......@@ -40,7 +40,7 @@ interface BLOCK_NAME_CAMEL_CASEState {
}) => ({
BLOCK_NAME_CAMEL_CASE,
loading: loading.effects['BLOCK_NAME_CAMEL_CASE/fetch'],
})
}),
)
class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
BLOCK_NAME_CAMEL_CASEProps,
......
......@@ -6,7 +6,7 @@ import { AnyAction } from 'redux';
export type Effect = (
action: AnyAction,
effects: EffectsCommandMap & { select: <T>(func: (state: IAnalysisData) => T) => T }
effects: EffectsCommandMap & { select: <T>(func: (state: IAnalysisData) => T) => T },
) => void;
export interface ModelType {
......
......@@ -3,10 +3,10 @@
.iconGroup {
i {
transition: color 0.32s;
margin-left: 16px;
color: @text-color-secondary;
cursor: pointer;
margin-left: 16px;
transition: color 0.32s;
&:hover {
color: @text-color;
}
......@@ -19,37 +19,38 @@
list-style: none;
li {
.clearfix();
margin-top: 16px;
display: flex;
align-items: center;
margin-top: 16px;
span {
color: @text-color;
font-size: 14px;
line-height: 22px;
}
.rankingItemNumber {
background-color: @background-color-base;
border-radius: 20px;
display: inline-block;
font-size: 12px;
font-weight: 600;
margin-right: 16px;
width: 20px;
height: 20px;
margin-top: 1.5px;
margin-right: 16px;
font-weight: 600;
font-size: 12px;
line-height: 20px;
width: 20px;
text-align: center;
margin-top: 1.5px;
background-color: @background-color-base;
border-radius: 20px;
&.active {
background-color: #314659;
color: #fff;
background-color: #314659;
}
}
.rankingItemTitle {
flex: 1;
margin-right: 8px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
margin-right: 8px;
}
}
}
......@@ -58,8 +59,8 @@
display: inline-block;
margin-right: 24px;
a {
color: @text-color;
margin-left: 24px;
color: @text-color;
&:hover {
color: @primary-color;
}
......@@ -117,14 +118,14 @@
border-bottom: none;
}
.ant-tabs-nav-container-scrolling {
padding-left: 40px;
padding-right: 40px;
padding-left: 40px;
}
.ant-tabs-tab-prev-icon:before {
.ant-tabs-tab-prev-icon::before {
position: relative;
left: 6px;
}
.ant-tabs-tab-next-icon:before {
.ant-tabs-tab-next-icon::before {
position: relative;
right: 6px;
}
......
......@@ -6,6 +6,7 @@ import { yuan } from '../components/Charts';
export default class Yuan extends React.Component<{
children: React.ReactText;
}> {
main: HTMLSpanElement | undefined | null;
componentDidMount() {
this.renderToHtml();
}
......@@ -13,7 +14,6 @@ export default class Yuan extends React.Component<{
componentDidUpdate() {
this.renderToHtml();
}
main: HTMLSpanElement | undefined | null;
renderToHtml = () => {
const { children } = this.props;
if (this.main) {
......
.textOverflow() {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
word-break: break-all;
white-space: nowrap;
}
.textOverflowMulti(@line: 3, @bg: #fff) {
overflow: hidden;
position: relative;
line-height: 1.5em;
max-height: @line * 1.5em;
text-align: justify;
margin-right: -1em;
padding-right: 1em;
&:before {
background: @bg;
content: '...';
padding: 0 1px;
overflow: hidden;
line-height: 1.5em;
text-align: justify;
&::before {
position: absolute;
right: 14px;
bottom: 0;
padding: 0 1px;
background: @bg;
content: '...';
}
&:after {
background: white;
content: '';
margin-top: 0.2em;
&::after {
position: absolute;
right: 14px;
width: 1em;
height: 1em;
margin-top: 0.2em;
background: white;
content: '';
}
}
......@@ -36,15 +36,15 @@
// ------------------------
.clearfix() {
zoom: 1;
&:before,
&:after {
content: ' ';
&::before,
&::after {
display: table;
content: ' ';
}
&:after {
&::after {
clear: both;
visibility: hidden;
font-size: 0;
height: 0;
font-size: 0;
visibility: hidden;
}
}
......@@ -32,9 +32,9 @@ export function getTimeDistance(type: 'today' | 'week' | 'month' | 'year'): Rang
return [moment(beginTime), moment(beginTime + (7 * oneDay - 1000))];
}
const year = now.getFullYear();
if (type === 'month') {
const year = now.getFullYear();
const month = now.getMonth();
const nextDate = moment(now).add(1, 'months');
const nextYear = nextDate.year();
......@@ -46,6 +46,5 @@ export function getTimeDistance(type: 'today' | 'week' | 'month' | 'year'): Rang
];
}
const year = now.getFullYear();
return [moment(`${year}-01-01 00:00:00`), moment(`${year}-12-31 23:59:59`)];
}
......@@ -25,7 +25,7 @@ const { TextArea } = Input;
interface PAGE_NAME_UPPER_CAMEL_CASEProps extends FormComponentProps {
submitting: boolean;
dispatch: Dispatch;
dispatch: Dispatch<any>;
}
@connect(({ loading }: { loading: { effects: { [key: string]: boolean } } }) => ({
......@@ -102,7 +102,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
formatMessage({ id: 'BLOCK_NAME.placeholder.start' }),
formatMessage({ id: 'BLOCK_NAME.placeholder.end' }),
]}
/>
/>,
)}
</FormItem>
<FormItem {...formItemLayout} label={<FormattedMessage id="BLOCK_NAME.goal.label" />}>
......@@ -118,7 +118,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
style={{ minHeight: 32 }}
placeholder={formatMessage({ id: 'BLOCK_NAME.goal.placeholder' })}
rows={4}
/>
/>,
)}
</FormItem>
<FormItem
......@@ -137,7 +137,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
style={{ minHeight: 32 }}
placeholder={formatMessage({ id: 'BLOCK_NAME.standard.placeholder' })}
rows={4}
/>
/>,
)}
</FormItem>
<FormItem
......@@ -155,7 +155,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
}
>
{getFieldDecorator('client')(
<Input placeholder={formatMessage({ id: 'BLOCK_NAME.client.placeholder' })} />
<Input placeholder={formatMessage({ id: 'BLOCK_NAME.client.placeholder' })} />,
)}
</FormItem>
<FormItem
......@@ -170,7 +170,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
}
>
{getFieldDecorator('invites')(
<Input placeholder={formatMessage({ id: 'BLOCK_NAME.invites.placeholder' })} />
<Input placeholder={formatMessage({ id: 'BLOCK_NAME.invites.placeholder' })} />,
)}
</FormItem>
<FormItem
......@@ -189,7 +189,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
placeholder={formatMessage({ id: 'BLOCK_NAME.weight.placeholder' })}
min={0}
max={100}
/>
/>,
)}
<span className="ant-form-text">%</span>
</FormItem>
......@@ -212,7 +212,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<Radio value="3">
<FormattedMessage id="BLOCK_NAME.radio.private" />
</Radio>
</Radio.Group>
</Radio.Group>,
)}
<FormItem style={{ marginBottom: 0 }}>
{getFieldDecorator('publicUsers')(
......@@ -233,7 +233,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<Option value="3">
<FormattedMessage id="BLOCK_NAME.option.C" />
</Option>
</Select>
</Select>,
)}
</FormItem>
</div>
......
......@@ -7,7 +7,7 @@ export interface ModalState {}
export type Effect = (
action: AnyAction,
effects: EffectsCommandMap & { select: <T>(func: (state: ModalState) => T) => T }
effects: EffectsCommandMap & { select: <T>(func: (state: ModalState) => T) => T },
) => void;
export interface ModelType {
......
......@@ -5,9 +5,9 @@
}
.heading {
margin: 0 0 16px 0;
font-size: 14px;
line-height: 22px;
margin: 0 0 16px 0;
}
.steps:global(.ant-steps) {
......@@ -16,9 +16,9 @@
}
.errorIcon {
cursor: pointer;
color: @error-color;
margin-right: 24px;
color: @error-color;
cursor: pointer;
i {
margin-right: 4px;
}
......@@ -27,18 +27,18 @@
.errorPopover {
:global {
.ant-popover-inner-content {
padding: 0;
min-width: 256px;
max-height: 290px;
padding: 0;
overflow: auto;
min-width: 256px;
}
}
}
.errorListItem {
padding: 8px 16px;
list-style: none;
border-bottom: 1px solid @border-color-split;
padding: 8px 16px;
cursor: pointer;
transition: all 0.3s;
&:hover {
......@@ -48,16 +48,16 @@
border: 0;
}
.errorIcon {
color: @error-color;
float: left;
margin-top: 4px;
margin-right: 12px;
padding-bottom: 22px;
color: @error-color;
}
.errorField {
font-size: 12px;
color: @text-color-secondary;
margin-top: 2px;
color: @text-color-secondary;
font-size: 12px;
}
}
......
export interface Member {
export interface member {
avatar: string;
name: string;
id: string;
}
export interface BasicListItemDataType {
export interface basiclistitemdatatype {
id: string;
owner: string;
title: string;
......
......@@ -37,7 +37,7 @@ const { Search, TextArea } = Input;
interface PAGE_NAME_UPPER_CAMEL_CASEProps extends FormComponentProps {
BLOCK_NAME_CAMEL_CASE: IStateType;
dispatch: Dispatch;
dispatch: Dispatch<any>;
loading: boolean;
}
interface PAGE_NAME_UPPER_CAMEL_CASEState {
......@@ -57,7 +57,7 @@ interface PAGE_NAME_UPPER_CAMEL_CASEState {
}) => ({
BLOCK_NAME_CAMEL_CASE,
loading: loading.models.BLOCK_NAME_CAMEL_CASE,
})
}),
)
class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
PAGE_NAME_UPPER_CAMEL_CASEProps,
......@@ -69,6 +69,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
labelCol: { span: 7 },
wrapperCol: { span: 13 },
};
addBtn: HTMLButtonElement | undefined | null;
componentDidMount() {
const { dispatch } = this.props;
......@@ -135,7 +136,6 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
payload: { id },
});
};
addBtn: HTMLButtonElement | undefined | null;
render() {
const {
......@@ -216,11 +216,11 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
);
const MoreBtn: React.SFC<{
current: BasicListItemDataType;
}> = ({ current }) => (
item: BasicListItemDataType;
}> = ({ item }) => (
<Dropdown
overlay={
<Menu onClick={({ key }) => editAndDelete(key, current)}>
<Menu onClick={({ key }) => editAndDelete(key, item)}>
<Menu.Item key="edit">编辑</Menu.Item>
<Menu.Item key="delete">删除</Menu.Item>
</Menu>
......@@ -266,7 +266,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
placeholder="请选择"
format="YYYY-MM-DD HH:mm:ss"
style={{ width: '100%' }}
/>
/>,
)}
</FormItem>
<FormItem label="任务负责人" {...this.formLayout}>
......@@ -277,7 +277,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
<Select placeholder="请选择">
<SelectOption value="付晓晓">付晓晓</SelectOption>
<SelectOption value="周毛毛">周毛毛</SelectOption>
</Select>
</Select>,
)}
</FormItem>
<FormItem {...this.formLayout} label="产品描述">
......@@ -338,6 +338,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
<List.Item
actions={[
<a
key="edit"
onClick={e => {
e.preventDefault();
this.showEditModal(item);
......@@ -345,7 +346,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
>
编辑
</a>,
<MoreBtn current={item} />,
<MoreBtn key="more" item={item} />,
]}
>
<List.Item.Meta
......
......@@ -10,7 +10,7 @@ export interface IStateType {
export type Effect = (
action: AnyAction,
effects: EffectsCommandMap & { select: <T>(func: (state: IStateType) => T) => T }
effects: EffectsCommandMap & { select: <T>(func: (state: IStateType) => T) => T },
) => void;
export interface ModelType {
......
......@@ -7,15 +7,15 @@
border-bottom: none;
}
.ant-card-head-title {
line-height: 32px;
padding: 24px 0;
line-height: 32px;
}
.ant-card-extra {
padding: 24px 0;
}
.ant-list-pagination {
text-align: right;
margin-top: 24px;
text-align: right;
}
.ant-avatar-lg {
width: 48px;
......@@ -27,35 +27,35 @@
position: relative;
text-align: center;
& > span {
color: @text-color-secondary;
display: inline-block;
margin-bottom: 4px;
color: @text-color-secondary;
font-size: @font-size-base;
line-height: 22px;
margin-bottom: 4px;
}
& > p {
margin: 0;
color: @heading-color;
font-size: 24px;
line-height: 32px;
margin: 0;
}
& > em {
background-color: @border-color-split;
position: absolute;
height: 56px;
width: 1px;
top: 0;
right: 0;
width: 1px;
height: 56px;
background-color: @border-color-split;
}
}
.listContent {
font-size: 0;
.listContentItem {
color: @text-color-secondary;
display: inline-block;
vertical-align: middle;
font-size: @font-size-base;
margin-left: 40px;
color: @text-color-secondary;
font-size: @font-size-base;
vertical-align: middle;
> span {
line-height: 20px;
}
......@@ -67,8 +67,8 @@
}
}
.extraContentSearch {
margin-left: 16px;
width: 272px;
margin-left: 16px;
}
}
......@@ -103,8 +103,8 @@
@media screen and (max-width: @screen-sm) {
.standardList {
.extraContentSearch {
margin-left: 0;
width: 100%;
margin-left: 0;
}
.headerInfo {
margin-bottom: 16px;
......@@ -180,8 +180,8 @@
.ant-form-item {
margin-bottom: 12px;
&:last-child {
padding-top: 4px;
margin-bottom: 32px;
padding-top: 4px;
}
}
}
......
.textOverflow() {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
word-break: break-all;
white-space: nowrap;
}
.textOverflowMulti(@line: 3, @bg: #fff) {
overflow: hidden;
position: relative;
line-height: 1.5em;
max-height: @line * 1.5em;
text-align: justify;
margin-right: -1em;
padding-right: 1em;
&:before {
background: @bg;
content: '...';
padding: 0 1px;
overflow: hidden;
line-height: 1.5em;
text-align: justify;
&::before {
position: absolute;
right: 14px;
bottom: 0;
padding: 0 1px;
background: @bg;
content: '...';
}
&:after {
background: white;
content: '';
margin-top: 0.2em;
&::after {
position: absolute;
right: 14px;
width: 1em;
height: 1em;
margin-top: 0.2em;
background: white;
content: '';
}
}
......@@ -36,15 +36,15 @@
// ------------------------
.clearfix() {
zoom: 1;
&:before,
&:after {
content: ' ';
&::before,
&::after {
display: table;
content: ' ';
}
&:after {
&::after {
clear: both;
visibility: hidden;
font-size: 0;
height: 0;
font-size: 0;
visibility: hidden;
}
}
......@@ -37,7 +37,7 @@ const DescriptionList: React.SFC<DescriptionListProps> & {
{title ? <div className={styles.title}>{title}</div> : null}
<Row gutter={gutter}>
{React.Children.map(children, (child: any) =>
child ? React.cloneElement(child, { column }) : child
child ? React.cloneElement(child, { column }) : child,
)}
</Row>
</div>
......
export interface BasicGood {
export interface basicgood {
id: string;
name: string;
barcode: string;
......@@ -7,7 +7,7 @@ export interface BasicGood {
amount: string | number;
}
export interface BasicProgress {
export interface basicprogress {
key: string;
time: string;
rate: string;
......@@ -16,7 +16,7 @@ export interface BasicProgress {
cost: string;
}
export interface BasicProfileDataType {
export interface basicprofiledatatype {
basicGoods: BasicGood[];
basicProgress: BasicProgress[];
}
......@@ -44,7 +44,7 @@ const progressColumns = [
interface PAGE_NAME_UPPER_CAMEL_CASEProps {
loading: boolean;
dispatch: Dispatch;
dispatch: Dispatch<any>;
BLOCK_NAME_CAMEL_CASE: BasicProfileDataType;
}
interface PAGE_NAME_UPPER_CAMEL_CASEState {
......@@ -63,7 +63,7 @@ interface PAGE_NAME_UPPER_CAMEL_CASEState {
}) => ({
BLOCK_NAME_CAMEL_CASE,
loading: loading.effects['BLOCK_NAME_CAMEL_CASE/fetchBasic'],
})
}),
)
class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
PAGE_NAME_UPPER_CAMEL_CASEProps,
......
......@@ -10,7 +10,7 @@ export interface IStateType {
export type Effect = (
action: AnyAction,
effects: EffectsCommandMap & { select: <T>(func: (state: IStateType) => T) => T }
effects: EffectsCommandMap & { select: <T>(func: (state: IStateType) => T) => T },
) => void;
export interface ModelType {
......
@import '~antd/lib/style/themes/default.less';
.title {
margin-bottom: 16px;
color: @heading-color;
font-size: 16px;
font-weight: 500;
margin-bottom: 16px;
font-size: 16px;
}
export interface Member {
export interface member {
avatar: string;
name: string;
id: string;
}
export interface CardListItemDataType {
export interface cardlistitemdatatype {
id: string;
owner: string;
title: string;
......
......@@ -12,7 +12,7 @@ import styles from './style.less';
interface PAGE_NAME_UPPER_CAMEL_CASEProps {
BLOCK_NAME_CAMEL_CASE: IStateType;
dispatch: Dispatch;
dispatch: Dispatch<any>;
loading: boolean;
}
interface PAGE_NAME_UPPER_CAMEL_CASEState {
......@@ -33,7 +33,7 @@ interface PAGE_NAME_UPPER_CAMEL_CASEState {
}) => ({
BLOCK_NAME_CAMEL_CASE,
loading: loading.models.list,
})
}),
)
class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
PAGE_NAME_UPPER_CAMEL_CASEProps,
......@@ -98,7 +98,11 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
renderItem={item =>
item ? (
<List.Item key={item.id}>
<Card hoverable className={styles.card} actions={[<a>操作一</a>, <a>操作二</a>]}>
<Card
hoverable
className={styles.card}
actions={[<a key="option1">操作一</a>, <a key="option2">操作二</a>]}
>
<Card.Meta
avatar={<img alt="" className={styles.cardAvatar} src={item.avatar} />}
title={<a>{item.title}</a>}
......
......@@ -10,7 +10,7 @@ export interface IStateType {
export type Effect = (
action: AnyAction,
effects: EffectsCommandMap & { select: <T>(func: (state: IStateType) => T) => T }
effects: EffectsCommandMap & { select: <T>(func: (state: IStateType) => T) => T },
) => void;
export interface ModelType {
......
......@@ -9,9 +9,9 @@
.ant-card-meta-title {
margin-bottom: 12px;
& > a {
color: @heading-color;
display: inline-block;
max-width: 100%;
color: @heading-color;
}
}
.ant-card-actions {
......@@ -36,21 +36,21 @@
}
.extraImg {
width: 155px;
margin-top: -20px;
text-align: center;
width: 155px;
img {
width: 100%;
}
}
.newButton {
width: 100%;
height: 188px;
color: @text-color-secondary;
background-color: #fff;
border-color: @border-color-base;
border-radius: @border-radius-sm;
color: @text-color-secondary;
width: 100%;
height: 188px;
}
.cardAvatar {
......@@ -76,8 +76,8 @@
}
}
img {
vertical-align: middle;
margin-right: 8px;
vertical-align: middle;
}
}
......@@ -100,8 +100,8 @@
}
.contentLink {
position: absolute;
left: 0;
bottom: -4px;
left: 0;
width: 1000px;
a {
margin-right: 16px;
......
.textOverflow() {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
word-break: break-all;
white-space: nowrap;
}
.textOverflowMulti(@line: 3, @bg: #fff) {
overflow: hidden;
position: relative;
line-height: 1.5em;
max-height: @line * 1.5em;
text-align: justify;
margin-right: -1em;
padding-right: 1em;
&:before {
background: @bg;
content: '...';
padding: 0 1px;
overflow: hidden;
line-height: 1.5em;
text-align: justify;
&::before {
position: absolute;
right: 14px;
bottom: 0;
padding: 0 1px;
background: @bg;
content: '...';
}
&:after {
background: white;
content: '';
margin-top: 0.2em;
&::after {
position: absolute;
right: 14px;
width: 1em;
height: 1em;
margin-top: 0.2em;
background: white;
content: '';
}
}
......@@ -36,15 +36,15 @@
// ------------------------
.clearfix() {
zoom: 1;
&:before,
&:after {
content: ' ';
&::before,
&::after {
display: table;
content: ' ';
}
&:after {
&::after {
clear: both;
visibility: hidden;
font-size: 0;
height: 0;
font-size: 0;
visibility: hidden;
}
}
......@@ -13,8 +13,8 @@
zoom: 1;
&::before,
&::after {
content: ' ';
display: table;
content: ' ';
}
&::after {
clear: both;
......
......@@ -71,7 +71,7 @@ class Exception extends React.Component<ExceptionProps, any> {
to: redirect,
href: redirect,
},
<Button type="primary">{backText}</Button>
<Button type="primary">{backText}</Button>,
)}
</div>
</div>
......
......@@ -13,8 +13,8 @@
zoom: 1;
&::before,
&::after {
content: ' ';
display: table;
content: ' ';
}
&::after {
clear: both;
......
......@@ -71,7 +71,7 @@ class Exception extends React.Component<ExceptionProps, any> {
to: redirect,
href: redirect,
},
<Button type="primary">{backText}</Button>
<Button type="primary">{backText}</Button>,
)}
</div>
</div>
......
......@@ -13,8 +13,8 @@
zoom: 1;
&::before,
&::after {
content: ' ';
display: table;
content: ' ';
}
&::after {
clear: both;
......
......@@ -71,7 +71,7 @@ class Exception extends React.Component<ExceptionProps, any> {
to: redirect,
href: redirect,
},
<Button type="primary">{backText}</Button>
<Button type="primary">{backText}</Button>,
)}
</div>
</div>
......
......@@ -12,15 +12,15 @@
}
.activeChartLegend {
position: relative;
font-size: 0;
margin-top: 8px;
height: 20px;
margin-top: 8px;
font-size: 0;
line-height: 20px;
span {
display: inline-block;
width: 33.33%;
font-size: 12px;
text-align: center;
width: 33.33%;
}
span:first-child {
text-align: left;
......@@ -31,9 +31,9 @@
}
.dashedLine {
position: relative;
height: 1px;
top: -70px;
left: -3px;
height: 1px;
.line {
position: absolute;
......
......@@ -24,12 +24,12 @@ export default class ActiveChart extends Component {
state = {
activeData: getActiveData(),
};
timer: number | undefined;
requestRef: number | undefined;
componentDidMount() {
this.loopData();
}
timer: number | undefined;
requestRef: number | undefined;
componentWillUnmount() {
clearTimeout(this.timer);
if (this.requestRef) {
......@@ -46,7 +46,7 @@ export default class ActiveChart extends Component {
},
() => {
this.loopData();
}
},
);
}, 1000);
});
......
......@@ -45,6 +45,8 @@ class Pie extends Component<IPieProps, IPieState> {
};
requestRef: number | undefined;
root!: HTMLDivElement;
chart: G2.Chart | undefined;
componentDidMount() {
window.addEventListener(
......@@ -52,7 +54,7 @@ class Pie extends Component<IPieProps, IPieState> {
() => {
this.requestRef = requestAnimationFrame(() => this.resize());
},
{ passive: true }
{ passive: true },
);
}
......@@ -123,8 +125,6 @@ class Pie extends Component<IPieProps, IPieState> {
legendData,
});
};
root!: HTMLDivElement;
chart: G2.Chart | undefined;
// for window resize auto responsive legend
@Bind()
......
......@@ -34,6 +34,11 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
height: 0,
width: 0,
};
isUnmount!: boolean;
requestRef!: number;
root: HTMLDivElement | undefined;
imageMask: HTMLImageElement | undefined;
componentDidMount() {
requestAnimationFrame(() => {
......@@ -49,20 +54,16 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
this.renderChart(this.props);
}
}
isUnmount!: boolean;
componentWillUnmount() {
this.isUnmount = true;
window.cancelAnimationFrame(this.requestRef);
window.removeEventListener('resize', this.resize);
}
requestRef!: number;
resize = () => {
this.requestRef = requestAnimationFrame(() => {
this.renderChart(this.props);
});
};
root: HTMLDivElement | undefined;
saveRootRef = (node: HTMLDivElement) => {
this.root = node;
};
......@@ -91,7 +92,7 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
(Shape as any).registerShape('point', 'cloud', {
drawShape(
cfg: { x: any; y: any },
container: { addShape: (arg0: string, arg1: { attrs: any }) => void }
container: { addShape: (arg0: string, arg1: { attrs: any }) => void },
) {
const attrs = getTextAttrs(cfg);
return container.addShape('text', {
......@@ -103,7 +104,6 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
},
});
};
imageMask: HTMLImageElement | undefined;
@Bind()
@Debounce(500)
......
......@@ -18,6 +18,9 @@ class WaterWave extends Component<IWaterWaveProps> {
state = {
radio: 1,
};
timer: number = 0;
root: HTMLDivElement | undefined | null;
node: HTMLCanvasElement | undefined | null;
componentDidMount() {
this.renderChart();
......@@ -27,7 +30,7 @@ class WaterWave extends Component<IWaterWaveProps> {
() => {
requestAnimationFrame(() => this.resize());
},
{ passive: true }
{ passive: true },
);
}
......@@ -56,7 +59,6 @@ class WaterWave extends Component<IWaterWaveProps> {
});
}
};
timer: number = 0;
renderChart(type?: string) {
const { percent, color = '#1890FF' } = this.props;
const data = percent / 100;
......@@ -199,8 +201,6 @@ class WaterWave extends Component<IWaterWaveProps> {
}
render();
}
root: HTMLDivElement | undefined | null;
node: HTMLCanvasElement | undefined | null;
render() {
const { radio } = this.state;
const { percent, title, height = 1 } = this.props;
......
......@@ -19,7 +19,7 @@ function getAutoHeight(n: HTMLDivElement) {
return 0;
}
let node = n;
const node = n;
let height = computeHeight(node);
const parentNode = node.parentNode as HTMLDivElement;
......@@ -36,7 +36,7 @@ interface IAutoHeightProps {
function autoHeight() {
return function<P extends IAutoHeightProps>(
WrappedComponent: React.ComponentClass<P> | React.SFC<P>
WrappedComponent: React.ComponentClass<P> | React.SFC<P>,
): React.ComponentClass<P> {
class AutoHeightComponent extends React.Component<P & IAutoHeightProps> {
state = {
......@@ -46,11 +46,10 @@ function autoHeight() {
componentDidMount() {
const { height } = this.props;
if (!height) {
const h = getAutoHeight(this.root);
// eslint-disable-next-line
let h = getAutoHeight(this.root);
this.setState({ computedHeight: h });
if (h < 1) {
const h = getAutoHeight(this.root);
h = getAutoHeight(this.root);
this.setState({ computedHeight: h });
}
}
......
export interface ITag {
export interface itag {
name: string;
value: string;
type: string;
......
......@@ -18,7 +18,7 @@ const targetTime = new Date().getTime() + 3900000;
interface PAGE_NAME_UPPER_CAMEL_CASEProps {
BLOCK_NAME_CAMEL_CASE: IStateType;
dispatch: Dispatch;
dispatch: Dispatch<any>;
loading: boolean;
}
......@@ -34,7 +34,7 @@ interface PAGE_NAME_UPPER_CAMEL_CASEProps {
}) => ({
BLOCK_NAME_CAMEL_CASE,
loading: loading.models.monitor,
})
}),
)
class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEProps> {
componentDidMount() {
......
......@@ -10,7 +10,7 @@ export interface IStateType {
export type Effect = (
action: AnyAction,
effects: EffectsCommandMap & { select: <T>(func: (state: IStateType) => T) => T }
effects: EffectsCommandMap & { select: <T>(func: (state: IStateType) => T) => T },
) => void;
export interface ModelType {
......
@import '~antd/lib/style/themes/default.less';
.mapChart {
padding-top: 24px;
height: 452px;
padding-top: 24px;
text-align: center;
img {
display: inline-block;
......
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
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