Commit f7404bc5 authored by 陈帅's avatar 陈帅

lint all file

parent 7e6b9aa0
**/*.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;
......
@import '~antd/lib/style/themes/default.less';
.standardFormRow {
border-bottom: 1px dashed @border-color-split;
padding-bottom: 16px;
margin-bottom: 16px;
display: flex;
margin-bottom: 16px;
padding-bottom: 16px;
border-bottom: 1px dashed @border-color-split;
:global {
.ant-form-item {
margin-right: 24px;
}
.ant-form-item-label label {
color: @text-color;
margin-right: 0;
color: @text-color;
}
.ant-form-item-label,
.ant-form-item-control {
......@@ -20,16 +20,16 @@
}
}
.label {
flex: 0 0 auto;
margin-right: 24px;
color: @heading-color;
font-size: @font-size-base;
margin-right: 24px;
flex: 0 0 auto;
text-align: right;
& > span {
display: inline-block;
height: 32px;
line-height: 32px;
&:after {
&::after {
content: ':';
}
}
......@@ -45,9 +45,9 @@
}
.standardFormRowLast {
border: none;
padding-bottom: 0;
margin-bottom: 0;
padding-bottom: 0;
border: none;
}
.standardFormRowBlock {
......
......@@ -59,13 +59,6 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
},
};
static Option: TagSelectOption = TagSelectOption;
constructor(props: TagSelectProps) {
super(props);
this.state = {
expand: false,
value: props.value || props.defaultValue || [],
};
}
static getDerivedStateFromProps(nextProps: TagSelectProps) {
if ('value' in nextProps) {
......@@ -73,6 +66,13 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
}
return null;
}
constructor(props: TagSelectProps) {
super(props);
this.state = {
expand: false,
value: props.value || props.defaultValue || [],
};
}
onChange = (value: (string | number)[]) => {
const { onChange } = this.props;
......@@ -93,7 +93,7 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
};
getAllTags() {
let { children } = this.props;
const { children } = this.props;
const childrenArray = React.Children.toArray(children) as React.ReactElement<TagSelectOption>[];
const checkedTags = childrenArray
.filter(child => this.isTagSelectOption(child))
......
......@@ -4,7 +4,7 @@ export interface Member {
id: string;
}
export interface ListItemDataType {
export interface ListItemDatatype {
id: string;
owner: string;
title: string;
......
......@@ -4,7 +4,6 @@ import { connect } from 'dva';
import { Row, Col, Form, Card, Select, Icon, Avatar, List, Tooltip, Dropdown, Menu } from 'antd';
import TagSelect from './components/TagSelect';
import StandardFormRow from './components/StandardFormRow';
import { formatWan } from './utils/utils';
import styles from './style.less';
import { IStateType } from './model';
import { Dispatch } from 'redux';
......@@ -14,8 +13,34 @@ import { ListItemDataType } from './data';
const { Option } = Select;
const FormItem = Form.Item;
export function formatWan(val: number) {
const v = val * 1;
if (!v || Number.isNaN(v)) return '';
let result = val;
if (val > 10000) {
result = (
<span>
{Math.floor(val / 10000)}
<span
style={{
position: 'relative',
top: -2,
fontSize: 14,
fontStyle: 'normal',
marginLeft: 2,
}}
>
</span>
</span>
);
}
return result;
}
interface PAGE_NAME_UPPER_CAMEL_CASEProps extends FormComponentProps {
dispatch: Dispatch;
dispatch: Dispatch<any>;
BLOCK_NAME_CAMEL_CASE: IStateType;
loading: boolean;
}
......@@ -89,7 +114,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<StandardFormRow title="所属类目" block style={{ paddingBottom: 11 }}>
<FormItem>
{getFieldDecorator('category')(
<TagSelect expandable={true}>
<TagSelect expandable>
<TagSelect.Option value="cat1">类目一</TagSelect.Option>
<TagSelect.Option value="cat2">类目二</TagSelect.Option>
<TagSelect.Option value="cat3">类目三</TagSelect.Option>
......@@ -102,7 +127,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<TagSelect.Option value="cat10">类目十</TagSelect.Option>
<TagSelect.Option value="cat11">类目十一</TagSelect.Option>
<TagSelect.Option value="cat12">类目十二</TagSelect.Option>
</TagSelect>
</TagSelect>,
)}
</FormItem>
</StandardFormRow>
......@@ -113,7 +138,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
{getFieldDecorator('author', {})(
<Select placeholder="不限" style={{ maxWidth: 200, width: '100%' }}>
<Option value="lisa">王昭君</Option>
</Select>
</Select>,
)}
</FormItem>
</Col>
......@@ -123,7 +148,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<Select placeholder="不限" style={{ maxWidth: 200, width: '100%' }}>
<Option value="good">优秀</Option>
<Option value="normal">普通</Option>
</Select>
</Select>,
)}
</FormItem>
</Col>
......@@ -143,16 +168,16 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
hoverable
bodyStyle={{ paddingBottom: 20 }}
actions={[
<Tooltip title="下载">
<Tooltip key="download" title="下载">
<Icon type="download" />
</Tooltip>,
<Tooltip title="编辑">
<Tooltip key="edit" title="编辑">
<Icon type="edit" />
</Tooltip>,
<Tooltip title="分享">
<Tooltip title="分享" key="share">
<Icon type="share-alt" />
</Tooltip>,
<Dropdown overlay={itemMenu}>
<Dropdown key="ellipsis" overlay={itemMenu}>
<Icon type="ellipsis" />
</Dropdown>,
]}
......@@ -196,5 +221,5 @@ export default connect(
}) => ({
BLOCK_NAME_CAMEL_CASE,
loading: loading.models.BLOCK_NAME_CAMEL_CASE,
})
}),
)(WarpForm);
......@@ -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 {
......
......@@ -20,23 +20,24 @@
}
.cardInfo {
.clearfix();
margin-top: 16px;
margin-left: 40px;
& > div {
position: relative;
text-align: left;
float: left;
width: 50%;
text-align: left;
p {
line-height: 32px;
font-size: 24px;
margin: 0;
font-size: 24px;
line-height: 32px;
}
p:first-child {
margin-bottom: 4px;
color: @text-color-secondary;
font-size: 12px;
line-height: 20px;
margin-bottom: 4px;
}
}
}
......
import React from 'react';
export function formatWan(val) {
const v = val * 1;
if (!v || Number.isNaN(v)) return '';
let result = val;
if (val > 10000) {
result = Math.floor(val / 10000);
result = (
<span>
{result}
<span
style={{
position: 'relative',
top: -2,
fontSize: 14,
fontStyle: 'normal',
marginLeft: 2,
}}
>
</span>
</span>
);
}
return result;
}
.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;
}
}
......@@ -2,25 +2,25 @@
.listContent {
.description {
line-height: 22px;
max-width: 720px;
line-height: 22px;
}
.extra {
color: @text-color-secondary;
margin-top: 16px;
color: @text-color-secondary;
line-height: 22px;
& > :global(.ant-avatar) {
vertical-align: top;
margin-right: 8px;
width: 20px;
height: 20px;
position: relative;
top: 1px;
width: 20px;
height: 20px;
margin-right: 8px;
vertical-align: top;
}
& > em {
margin-left: 16px;
color: @disabled-color;
font-style: normal;
margin-left: 16px;
}
}
}
......@@ -30,8 +30,8 @@
.extra {
& > em {
display: block;
margin-left: 0;
margin-top: 8px;
margin-left: 0;
}
}
}
......
@import '~antd/lib/style/themes/default.less';
.standardFormRow {
border-bottom: 1px dashed @border-color-split;
padding-bottom: 16px;
margin-bottom: 16px;
display: flex;
margin-bottom: 16px;
padding-bottom: 16px;
border-bottom: 1px dashed @border-color-split;
:global {
.ant-form-item {
margin-right: 24px;
}
.ant-form-item-label label {
color: @text-color;
margin-right: 0;
color: @text-color;
}
.ant-form-item-label,
.ant-form-item-control {
......@@ -20,16 +20,16 @@
}
}
.label {
flex: 0 0 auto;
margin-right: 24px;
color: @heading-color;
font-size: @font-size-base;
margin-right: 24px;
flex: 0 0 auto;
text-align: right;
& > span {
display: inline-block;
height: 32px;
line-height: 32px;
&:after {
&::after {
content: ':';
}
}
......@@ -45,9 +45,9 @@
}
.standardFormRowLast {
border: none;
padding-bottom: 0;
margin-bottom: 0;
padding-bottom: 0;
border: none;
}
.standardFormRowBlock {
......
......@@ -59,13 +59,6 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
},
};
static Option: TagSelectOption = TagSelectOption;
constructor(props: TagSelectProps) {
super(props);
this.state = {
expand: false,
value: props.value || props.defaultValue || [],
};
}
static getDerivedStateFromProps(nextProps: TagSelectProps) {
if ('value' in nextProps) {
......@@ -73,6 +66,13 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
}
return null;
}
constructor(props: TagSelectProps) {
super(props);
this.state = {
expand: false,
value: props.value || props.defaultValue || [],
};
}
onChange = (value: (string | number)[]) => {
const { onChange } = this.props;
......@@ -93,7 +93,7 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
};
getAllTags() {
let { children } = this.props;
const { children } = this.props;
const childrenArray = React.Children.toArray(children) as React.ReactElement<TagSelectOption>[];
const checkedTags = childrenArray
.filter(child => this.isTagSelectOption(child))
......
export interface Member {
export interface member {
avatar: string;
name: string;
id: string;
}
export interface ListItemDataType {
export interface listitemdatatype {
id: string;
owner: string;
title: string;
......
......@@ -17,7 +17,7 @@ const FormItem = Form.Item;
const pageSize = 5;
interface PAGE_NAME_UPPER_CAMEL_CASEProps extends FormComponentProps {
dispatch: Dispatch;
dispatch: Dispatch<any>;
BLOCK_NAME_CAMEL_CASE: IStateType;
loading: boolean;
}
......@@ -134,7 +134,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<TagSelect.Option value="cat10">类目十</TagSelect.Option>
<TagSelect.Option value="cat11">类目十一</TagSelect.Option>
<TagSelect.Option value="cat12">类目十二</TagSelect.Option>
</TagSelect>
</TagSelect>,
)}
</FormItem>
</StandardFormRow>
......@@ -155,7 +155,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
{owner.name}
</Option>
))}
</Select>
</Select>,
)}
<a className={styles.selfTrigger} onClick={this.setOwner}>
只看自己的
......@@ -171,7 +171,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
{getFieldDecorator('user', {})(
<Select placeholder="不限" style={{ maxWidth: 200, width: '100%' }}>
<Option value="lisa">李三</Option>
</Select>
</Select>,
)}
</FormItem>
</Col>
......@@ -180,7 +180,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
{getFieldDecorator('rate', {})(
<Select placeholder="不限" style={{ maxWidth: 200, width: '100%' }}>
<Option value="good">优秀</Option>
</Select>
</Select>,
)}
</FormItem>
</Col>
......@@ -204,9 +204,9 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<List.Item
key={item.id}
actions={[
<IconText type="star-o" text={item.star} />,
<IconText type="like-o" text={item.like} />,
<IconText type="message" text={item.message} />,
<IconText key="star" type="star-o" text={item.star} />,
<IconText key="like" type="like-o" text={item.like} />,
<IconText type="message" key="message" text={item.message} />,
]}
extra={<div className={styles.listItemExtra} />}
>
......@@ -257,5 +257,5 @@ export default connect(
}) => ({
BLOCK_NAME_CAMEL_CASE,
loading: loading.models.BLOCK_NAME_CAMEL_CASE,
})
}),
)(WarpForm);
......@@ -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 {
......
......@@ -60,7 +60,7 @@ const AvatarList: React.SFC<AvatarListProps> & { Item: typeof Item } = ({
const childrenWithProps = childrenArray.slice(0, numToShow).map(child =>
React.cloneElement(child, {
size,
})
}),
);
if (numToShow < numOfChildren) {
......@@ -69,7 +69,7 @@ const AvatarList: React.SFC<AvatarListProps> & { Item: typeof Item } = ({
childrenWithProps.push(
<li key="exceed" className={cls}>
<Avatar size={size} style={excessItemsStyle}>{`+${numOfChildren - maxLength}`}</Avatar>
</li>
</li>,
);
}
......
@import '~antd/lib/style/themes/default.less';
.standardFormRow {
border-bottom: 1px dashed @border-color-split;
padding-bottom: 16px;
margin-bottom: 16px;
display: flex;
margin-bottom: 16px;
padding-bottom: 16px;
border-bottom: 1px dashed @border-color-split;
:global {
.ant-form-item {
margin-right: 24px;
}
.ant-form-item-label label {
color: @text-color;
margin-right: 0;
color: @text-color;
}
.ant-form-item-label,
.ant-form-item-control {
......@@ -20,16 +20,16 @@
}
}
.label {
flex: 0 0 auto;
margin-right: 24px;
color: @heading-color;
font-size: @font-size-base;
margin-right: 24px;
flex: 0 0 auto;
text-align: right;
& > span {
display: inline-block;
height: 32px;
line-height: 32px;
&:after {
&::after {
content: ':';
}
}
......@@ -45,9 +45,9 @@
}
.standardFormRowLast {
border: none;
padding-bottom: 0;
margin-bottom: 0;
padding-bottom: 0;
border: none;
}
.standardFormRowBlock {
......
......@@ -59,13 +59,6 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
},
};
static Option: TagSelectOption = TagSelectOption;
constructor(props: TagSelectProps) {
super(props);
this.state = {
expand: false,
value: props.value || props.defaultValue || [],
};
}
static getDerivedStateFromProps(nextProps: TagSelectProps) {
if ('value' in nextProps) {
......@@ -73,6 +66,13 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
}
return null;
}
constructor(props: TagSelectProps) {
super(props);
this.state = {
expand: false,
value: props.value || props.defaultValue || [],
};
}
onChange = (value: (string | number)[]) => {
const { onChange } = this.props;
......@@ -93,7 +93,7 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
};
getAllTags() {
let { children } = this.props;
const { children } = this.props;
const childrenArray = React.Children.toArray(children) as React.ReactElement<TagSelectOption>[];
const checkedTags = childrenArray
.filter(child => this.isTagSelectOption(child))
......
export interface Member {
export interface member {
avatar: string;
name: string;
id: string;
}
export interface ListItemDataType {
export interface listitemdatatype {
id: string;
owner: string;
title: string;
......
......@@ -15,7 +15,7 @@ const FormItem = Form.Item;
const { Paragraph } = Typography;
interface PAGE_NAME_UPPER_CAMEL_CASEProps extends FormComponentProps {
dispatch: Dispatch;
dispatch: Dispatch<any>;
BLOCK_NAME_CAMEL_CASE: IStateType;
loading: boolean;
}
......@@ -107,7 +107,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<TagSelect.Option value="cat10">类目十</TagSelect.Option>
<TagSelect.Option value="cat11">类目十一</TagSelect.Option>
<TagSelect.Option value="cat12">类目十二</TagSelect.Option>
</TagSelect>
</TagSelect>,
)}
</FormItem>
</StandardFormRow>
......@@ -118,7 +118,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
{getFieldDecorator('author', {})(
<Select placeholder="不限" style={{ maxWidth: 200, width: '100%' }}>
<Option value="lisa">王昭君</Option>
</Select>
</Select>,
)}
</FormItem>
</Col>
......@@ -128,7 +128,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<PAGE_NAME_UPPER_CAMEL_CASEPro
<Select placeholder="不限" style={{ maxWidth: 200, width: '100%' }}>
<Option value="good">优秀</Option>
<Option value="normal">普通</Option>
</Select>
</Select>,
)}
</FormItem>
</Col>
......@@ -165,5 +165,5 @@ export default connect(
}) => ({
BLOCK_NAME_CAMEL_CASE,
loading: loading.models.BLOCK_NAME_CAMEL_CASE,
})
}),
)(WarpForm);
......@@ -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,15 +9,15 @@
.ant-card-meta-title {
margin-bottom: 4px;
& > a {
color: @heading-color;
display: inline-block;
max-width: 100%;
color: @heading-color;
}
}
.ant-card-meta-description {
height: 44px;
line-height: 22px;
overflow: hidden;
line-height: 22px;
}
}
......@@ -32,13 +32,13 @@
.cardItemContent {
display: flex;
height: 20px;
margin-top: 16px;
margin-bottom: -4px;
line-height: 20px;
height: 20px;
& > span {
color: @text-color-secondary;
flex: 1;
color: @text-color-secondary;
font-size: 12px;
}
.avatarList {
......
.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;
}
}
@import '~antd/lib/style/themes/default.less';
.stepForm {
margin: 40px auto 0;
max-width: 500px;
margin: 40px auto 0;
}
.stepFormText {
......@@ -16,8 +16,8 @@
}
.result {
margin: 0 auto;
max-width: 560px;
margin: 0 auto;
padding: 24px 0 8px;
}
......@@ -25,9 +25,9 @@
padding: 0 56px;
color: @text-color-secondary;
h3 {
font-size: 16px;
margin: 0 0 12px 0;
color: @text-color-secondary;
font-size: 16px;
line-height: 32px;
}
h4 {
......@@ -57,9 +57,9 @@
}
}
.label {
padding-right: 8px;
color: @heading-color;
text-align: right;
padding-right: 8px;
@media screen and (max-width: @screen-sm) {
text-align: left;
}
......@@ -67,9 +67,9 @@
}
.money {
font-family: 'Helvetica Neue', sans-serif;
font-weight: 500;
font-size: 20px;
font-family: 'Helvetica Neue', sans-serif;
line-height: 14px;
}
......
......@@ -18,7 +18,7 @@ const formItemLayout = {
};
interface Step1Props extends FormComponentProps {
data?: IStateType['step'];
dispatch?: Dispatch;
dispatch?: Dispatch<any>;
}
class Step1 extends React.PureComponent<Step1Props> {
......@@ -52,7 +52,7 @@ class Step1 extends React.PureComponent<Step1Props> {
})(
<Select placeholder="test@example.com">
<Option value="ant-design@alipay.com">ant-design@alipay.com</Option>
</Select>
</Select>,
)}
</Form.Item>
<Form.Item {...formItemLayout} label="收款账户">
......
@import '~antd/lib/style/themes/default.less';
.stepForm {
margin: 40px auto 0;
max-width: 500px;
margin: 40px auto 0;
}
.stepFormText {
......@@ -16,8 +16,8 @@
}
.result {
margin: 0 auto;
max-width: 560px;
margin: 0 auto;
padding: 24px 0 8px;
}
......@@ -25,9 +25,9 @@
padding: 0 56px;
color: @text-color-secondary;
h3 {
font-size: 16px;
margin: 0 0 12px 0;
color: @text-color-secondary;
font-size: 16px;
line-height: 32px;
}
h4 {
......@@ -57,9 +57,9 @@
}
}
.label {
padding-right: 8px;
color: @heading-color;
text-align: right;
padding-right: 8px;
@media screen and (max-width: @screen-sm) {
text-align: left;
}
......@@ -67,9 +67,9 @@
}
.money {
font-family: 'Helvetica Neue', sans-serif;
font-weight: 500;
font-size: 20px;
font-family: 'Helvetica Neue', sans-serif;
line-height: 14px;
}
......
......@@ -16,7 +16,7 @@ const formItemLayout = {
};
interface Step2Props extends FormComponentProps {
data?: IStateType['step'];
dispatch?: Dispatch;
dispatch?: Dispatch<any>;
submitting?: boolean;
}
......@@ -28,17 +28,18 @@ class Step2 extends React.Component<Step2Props> {
}
const { getFieldDecorator, validateFields } = form;
const onPrev = () => {
dispatch &&
if (dispatch) {
dispatch({
type: 'BLOCK_NAME_CAMEL_CASE/saveCurrentStep',
payload: 'info',
});
}
};
const onValidateForm = (e: React.FormEvent) => {
e.preventDefault();
validateFields((err, values) => {
if (!err) {
dispatch &&
if (dispatch) {
dispatch({
type: 'BLOCK_NAME_CAMEL_CASE/submitStepForm',
payload: {
......@@ -47,6 +48,7 @@ class Step2 extends React.Component<Step2Props> {
},
});
}
}
});
};
return (
......@@ -115,5 +117,5 @@ export default connect(
}) => ({
submitting: loading.effects['BLOCK_NAME_CAMEL_CASE/submitStepForm'],
data: BLOCK_NAME_CAMEL_CASE.step,
})
}),
)(Form.create()(Step2));
@import '~antd/lib/style/themes/default.less';
.stepForm {
margin: 40px auto 0;
max-width: 500px;
margin: 40px auto 0;
}
.stepFormText {
......@@ -16,8 +16,8 @@
}
.result {
margin: 0 auto;
max-width: 560px;
margin: 0 auto;
padding: 24px 0 8px;
}
......@@ -25,9 +25,9 @@
padding: 0 56px;
color: @text-color-secondary;
h3 {
font-size: 16px;
margin: 0 0 12px 0;
color: @text-color-secondary;
font-size: 16px;
line-height: 32px;
}
h4 {
......@@ -57,9 +57,9 @@
}
}
.label {
padding-right: 8px;
color: @heading-color;
text-align: right;
padding-right: 8px;
@media screen and (max-width: @screen-sm) {
text-align: left;
}
......@@ -67,9 +67,9 @@
}
.money {
font-family: 'Helvetica Neue', sans-serif;
font-weight: 500;
font-size: 20px;
font-family: 'Helvetica Neue', sans-serif;
line-height: 14px;
}
......
......@@ -8,7 +8,7 @@ import { Dispatch } from 'redux';
interface Step3Props {
data?: IStateType['step'];
dispatch?: Dispatch;
dispatch?: Dispatch<any>;
}
@connect(
......@@ -21,7 +21,7 @@ interface Step3Props {
};
}) => ({
data: BLOCK_NAME_CAMEL_CASE.step,
})
}),
)
class Step3 extends React.Component<Step3Props> {
render() {
......@@ -30,11 +30,12 @@ class Step3 extends React.Component<Step3Props> {
return;
}
const onFinish = () => {
dispatch &&
if (dispatch) {
dispatch({
type: 'BLOCK_NAME_CAMEL_CASE/saveCurrentStep',
payload: 'info',
});
}
};
const information = (
<div className={styles.information}>
......
......@@ -15,7 +15,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 {
......
......@@ -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;
}
}
......
......@@ -31,10 +31,10 @@ function getRule(
arg0: {
list: TableListItem[];
pagination: { total: number; pageSize: number; current: number };
}
},
) => void;
},
u: any
u: any,
) {
let url = u;
if (!url || Object.prototype.toString.call(url) !== '[object String]') {
......@@ -65,7 +65,7 @@ function getRule(
return true;
}
return false;
})
}),
);
});
dataSource = filterDataSource;
......@@ -75,9 +75,9 @@ function getRule(
dataSource = dataSource.filter(data => data.name.indexOf(params.name) > -1);
}
let pageSize = 10;
let pageSize: number = 10;
if (params.pageSize) {
pageSize = parseInt(params.pageSize) * 1;
pageSize = parseInt(params.pageSize + '', 0);
}
const result = {
......@@ -96,7 +96,7 @@ function postRule(
req: { url: any; body: any },
res: { json: (arg0: { list: TableListItem[]; pagination: { total: number } }) => void },
u: any,
b: { body: any }
b: { body: any },
) {
let url = u;
if (!url || Object.prototype.toString.call(url) !== '[object String]') {
......
......@@ -9,7 +9,7 @@ interface CreateFormProps extends FormComponentProps {
handleAdd: (
fieldsValue: {
desc: string;
}
},
) => void;
handleModalVisible: () => void;
}
......
......@@ -40,17 +40,6 @@ interface StandardTableState {
}
class StandardTable extends Component<StandardTableProps<TableListItem>, StandardTableState> {
constructor(props: StandardTableProps<TableListItem>) {
super(props);
const { columns } = props;
const needTotalList = initTotalList(columns);
this.state = {
selectedRowKeys: [],
needTotalList,
};
}
static getDerivedStateFromProps(nextProps: StandardTableProps<TableListItem>) {
// clean state
if (nextProps.selectedRows.length === 0) {
......@@ -62,6 +51,16 @@ class StandardTable extends Component<StandardTableProps<TableListItem>, Standar
}
return null;
}
constructor(props: StandardTableProps<TableListItem>) {
super(props);
const { columns } = props;
const needTotalList = initTotalList(columns);
this.state = {
selectedRowKeys: [],
needTotalList,
};
}
handleRowSelectChange = (selectedRowKeys: string[], selectedRows: TableListItem[]) => {
let { needTotalList } = this.state;
......
......@@ -72,7 +72,7 @@ class UpdateForm extends Component<UpdateFormProps, UpdateFormState> {
} else {
handleUpdate(formVals);
}
}
},
);
});
};
......@@ -102,7 +102,7 @@ class UpdateForm extends Component<UpdateFormProps, UpdateFormState> {
<Select style={{ width: '100%' }}>
<Option value="0">表一</Option>
<Option value="1">表二</Option>
</Select>
</Select>,
)}
</FormItem>,
<FormItem key="template" {...this.formLayout} label="规则模板">
......@@ -112,7 +112,7 @@ class UpdateForm extends Component<UpdateFormProps, UpdateFormState> {
<Select style={{ width: '100%' }}>
<Option value="0">规则模板一</Option>
<Option value="1">规则模板二</Option>
</Select>
</Select>,
)}
</FormItem>,
<FormItem key="type" {...this.formLayout} label="规则类型">
......@@ -122,7 +122,7 @@ class UpdateForm extends Component<UpdateFormProps, UpdateFormState> {
<RadioGroup>
<Radio value="0"></Radio>
<Radio value="1"></Radio>
</RadioGroup>
</RadioGroup>,
)}
</FormItem>,
];
......@@ -138,7 +138,7 @@ class UpdateForm extends Component<UpdateFormProps, UpdateFormState> {
showTime
format="YYYY-MM-DD HH:mm:ss"
placeholder="选择开始时间"
/>
/>,
)}
</FormItem>,
<FormItem key="frequency" {...this.formLayout} label="调度周期">
......@@ -148,7 +148,7 @@ class UpdateForm extends Component<UpdateFormProps, UpdateFormState> {
<Select style={{ width: '100%' }}>
<Option value="month"></Option>
<Option value="week"></Option>
</Select>
</Select>,
)}
</FormItem>,
];
......
export interface TableListItem {
export interface tablelistitem {
key: number;
disabled?: boolean;
href: string;
......@@ -14,18 +14,18 @@ export interface TableListItem {
progress: number;
}
export interface TableListPagination {
export interface tablelistpagination {
total: number;
pageSize: number;
current: number;
}
export interface TableListDate {
export interface tablelistdate {
list: TableListItem[];
pagination: Partial<TableListPagination>;
}
export interface TableListParams {
export interface tablelistparams {
sorter: string;
status: string;
name: string;
......
......@@ -40,7 +40,7 @@ const statusMap = ['default', 'processing', 'success', 'error'];
const status = ['关闭', '运行中', '已上线', '异常'];
interface TableListProps extends FormComponentProps {
dispatch: Dispatch;
dispatch: Dispatch<any>;
loading: boolean;
BLOCK_NAME_CAMEL_CASE: IStateType;
}
......@@ -69,7 +69,7 @@ interface TableListState {
}) => ({
BLOCK_NAME_CAMEL_CASE,
loading: loading.models.rule,
})
}),
)
class TableList extends Component<TableListProps, TableListState> {
state: TableListState = {
......@@ -152,7 +152,7 @@ class TableList extends Component<TableListProps, TableListState> {
handleStandardTableChange = (
pagination: Partial<TableListPagination>,
filtersArg: Record<keyof TableListItem, string[]>,
sorter: SorterResult<TableListItem>
sorter: SorterResult<TableListItem>,
) => {
const { dispatch } = this.props;
const { formValues } = this.state;
......@@ -310,7 +310,7 @@ class TableList extends Component<TableListProps, TableListState> {
<Select placeholder="请选择" style={{ width: '100%' }}>
<Option value="0">关闭</Option>
<Option value="1">运行中</Option>
</Select>
</Select>,
)}
</FormItem>
</Col>
......@@ -350,7 +350,7 @@ class TableList extends Component<TableListProps, TableListState> {
<Select placeholder="请选择" style={{ width: '100%' }}>
<Option value="0">关闭</Option>
<Option value="1">运行中</Option>
</Select>
</Select>,
)}
</FormItem>
</Col>
......@@ -364,7 +364,7 @@ class TableList extends Component<TableListProps, TableListState> {
<Col md={8} sm={24}>
<FormItem label="更新日期">
{getFieldDecorator('date')(
<DatePicker style={{ width: '100%' }} placeholder="请输入更新日期" />
<DatePicker style={{ width: '100%' }} placeholder="请输入更新日期" />,
)}
</FormItem>
</Col>
......@@ -374,7 +374,7 @@ class TableList extends Component<TableListProps, TableListState> {
<Select placeholder="请选择" style={{ width: '100%' }}>
<Option value="0">关闭</Option>
<Option value="1">运行中</Option>
</Select>
</Select>,
)}
</FormItem>
</Col>
......@@ -384,7 +384,7 @@ class TableList extends Component<TableListProps, TableListState> {
<Select placeholder="请选择" style={{ width: '100%' }}>
<Option value="0">关闭</Option>
<Option value="1">运行中</Option>
</Select>
</Select>,
)}
</FormItem>
</Col>
......
......@@ -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 {
......
......@@ -13,13 +13,13 @@
.tableListForm {
:global {
.ant-form-item {
margin-bottom: 24px;
margin-right: 0;
display: flex;
margin-right: 0;
margin-bottom: 24px;
> .ant-form-item-label {
width: auto;
line-height: 32px;
padding-right: 8px;
line-height: 32px;
}
.ant-form-item-control {
line-height: 32px;
......@@ -31,8 +31,8 @@
}
.submitButtons {
display: block;
white-space: nowrap;
margin-bottom: 24px;
white-space: nowrap;
}
}
......
.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;
}
}
......@@ -7,7 +7,7 @@ export default {
req: { body: { password: any; userName: any; type: any } },
res: {
send: (data: any) => void;
}
},
) => {
const { password, userName, type } = req.body;
if (password === 'ant.design' && userName === 'admin') {
......
......@@ -42,6 +42,7 @@ class WrapFormItem extends Component<LoginItemProps, LoginItemState> {
getCaptchaButtonText: 'captcha',
getCaptchaSecondText: 'second',
};
interval: number | undefined;
constructor(props: LoginItemProps) {
super(props);
......@@ -49,7 +50,6 @@ class WrapFormItem extends Component<LoginItemProps, LoginItemState> {
count: 0,
};
}
interval: number | undefined;
componentDidMount() {
const { updateActive, name = '' } = this.props;
if (updateActive) {
......@@ -122,7 +122,6 @@ class WrapFormItem extends Component<LoginItemProps, LoginItemState> {
...restProps
} = this.props;
if (!name) {
console.warn('name is required!');
return null;
}
if (!form) {
......@@ -170,7 +169,6 @@ Object.keys(ItemMap).forEach(key => {
LoginItem[key] = (props: LoginItemProps) => (
<LoginContext.Consumer>
{context => {
console.log(context);
return (
<WrapFormItem
customProps={item.props}
......
......@@ -18,14 +18,16 @@ interface LoginTabProps extends TabPaneProps {
}
class LoginTab extends Component<LoginTabProps> {
uniqueId: string;
constructor(props: LoginTabProps) {
super(props);
this.uniqueId = generateId('login-tab-');
}
uniqueId: string;
componentDidMount() {
const { tabUtil } = this.props;
tabUtil && tabUtil.addTab(this.uniqueId);
if (tabUtil) {
tabUtil.addTab(this.uniqueId);
}
}
render() {
......
......@@ -14,7 +14,7 @@ export interface LoginProps {
style?: React.CSSProperties;
onSubmit?: (error: any, values: any) => void;
className?: string;
form?: FormComponentProps['form'];
form: FormComponentProps['form'];
children: React.ReactElement<LoginTab>[];
}
......@@ -57,7 +57,7 @@ class Login extends Component<LoginProps, LoginState> {
if (onTabChange) {
onTabChange(type);
}
}
},
);
};
......@@ -97,10 +97,13 @@ class Login extends Component<LoginProps, LoginState> {
const { active = {}, type = '' } = this.state;
const { form, onSubmit } = this.props;
const activeFields = active[type] || [];
form &&
if (form) {
form.validateFields(activeFields, { force: true }, (err, values) => {
onSubmit && onSubmit(err, values);
if (onSubmit) {
onSubmit(err, values);
}
});
}
};
render() {
......@@ -119,7 +122,7 @@ class Login extends Component<LoginProps, LoginState> {
} else {
otherChildren.push(child);
}
}
},
);
return (
<LoginContext.Provider value={this.getContext()}>
......@@ -151,4 +154,4 @@ class Login extends Component<LoginProps, LoginState> {
Login[item] = LoginItem[item];
});
export default Form.create<Partial<LoginProps>>()(Login);
export default Form.create<LoginProps>()(Login);
......@@ -12,12 +12,12 @@ import { CheckboxChangeEvent } from 'antd/lib/checkbox';
const { Tab, UserName, Password, Mobile, Captcha, Submit } = Login;
interface BLOCK_NAME_CAMEL_CASEProps {
dispatch: Dispatch;
interface PAGE_NAME_UPPER_CAMEL_CASEProps {
dispatch: Dispatch<any>;
BLOCK_NAME_CAMEL_CASE: IStateType;
submitting: boolean;
}
interface BLOCK_NAME_CAMEL_CASEState {
interface PAGE_NAME_UPPER_CAMEL_CASEState {
type: string;
autoLogin: boolean;
}
......@@ -42,21 +42,21 @@ export interface FromDataType {
}) => ({
BLOCK_NAME_CAMEL_CASE,
submitting: loading.effects['BLOCK_NAME_CAMEL_CASE/login'],
})
}),
)
class BLOCK_NAME_CAMEL_CASE extends Component<
BLOCK_NAME_CAMEL_CASEProps,
BLOCK_NAME_CAMEL_CASEState
class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
PAGE_NAME_UPPER_CAMEL_CASEProps,
PAGE_NAME_UPPER_CAMEL_CASEState
> {
state: BLOCK_NAME_CAMEL_CASEState = {
state: PAGE_NAME_UPPER_CAMEL_CASEState = {
type: 'account',
autoLogin: true,
};
loginForm: FormComponentProps['form'] | undefined | null;
onTabChange = (type: string) => {
this.setState({ type });
};
loginForm: FormComponentProps['form'] | undefined | null;
onGetCaptcha = () =>
new Promise((resolve, reject) => {
if (!this.loginForm) {
......@@ -120,7 +120,7 @@ class BLOCK_NAME_CAMEL_CASE extends Component<
loginType === 'account' &&
!submitting &&
this.renderMessage(
formatMessage({ id: 'BLOCK_NAME.login.message-invalid-credentials' })
formatMessage({ id: 'BLOCK_NAME.login.message-invalid-credentials' }),
)}
<UserName
name="userName"
......@@ -151,7 +151,7 @@ class BLOCK_NAME_CAMEL_CASE extends Component<
loginType === 'mobile' &&
!submitting &&
this.renderMessage(
formatMessage({ id: 'BLOCK_NAME.login.message-invalid-verification-code' })
formatMessage({ id: 'BLOCK_NAME.login.message-invalid-verification-code' }),
)}
<Mobile
name="mobile"
......@@ -208,4 +208,4 @@ class BLOCK_NAME_CAMEL_CASE extends Component<
}
}
export default BLOCK_NAME_CAMEL_CASE;
export default PAGE_NAME_UPPER_CAMEL_CASE;
......@@ -14,7 +14,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 {
......
......@@ -8,9 +8,9 @@
}
.icon {
font-size: 24px;
color: rgba(0, 0, 0, 0.2);
margin-left: 16px;
color: rgba(0, 0, 0, 0.2);
font-size: 24px;
vertical-align: middle;
cursor: pointer;
transition: color 0.3s;
......@@ -21,9 +21,9 @@
}
.other {
text-align: left;
margin-top: 24px;
line-height: 22px;
text-align: left;
.register {
float: right;
......
export default {
'POST /api/BLOCK_NAME/register': (
req: any,
res: { send: (arg0: { status: string; currentAuthority: string }) => void }
res: { send: (arg0: { status: string; currentAuthority: string }) => void },
) => {
res.send({ status: 'ok', currentAuthority: 'user' });
},
......
......@@ -41,7 +41,7 @@ const passwordProgressMap: {
};
interface BLOCK_NAME_CAMEL_CASEProps extends FormComponentProps {
dispatch: Dispatch;
dispatch: Dispatch<any>;
BLOCK_NAME_CAMEL_CASE: IStateType;
submitting: boolean;
}
......@@ -76,7 +76,7 @@ export interface IUserRegisterParams {
}) => ({
BLOCK_NAME_CAMEL_CASE,
submitting: loading.effects['BLOCK_NAME_CAMEL_CASE/submit'],
})
}),
)
class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
BLOCK_NAME_CAMEL_CASEProps,
......@@ -89,9 +89,10 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
help: '',
prefix: '86',
};
interval: number | undefined;
componentDidUpdate() {
const { form, BLOCK_NAME_CAMEL_CASE } = this.props;
const { BLOCK_NAME_CAMEL_CASE } = this.props;
if (BLOCK_NAME_CAMEL_CASE.status === 'ok') {
message.success('注册成功!');
}
......@@ -100,7 +101,6 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
componentWillUnmount() {
clearInterval(this.interval);
}
interval: number | undefined;
onGetCaptcha = () => {
let count = 59;
this.setState({ count });
......@@ -193,6 +193,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
return value && value.length ? (
<div className={styles[`progress-${passwordStatus}`]}>
<Progress
default={passwordProgressMap[passwordStatus]}
status={passwordProgressMap[passwordStatus]}
className={styles.progress}
strokeWidth={6}
......@@ -229,7 +230,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
<Input
size="large"
placeholder={formatMessage({ id: 'BLOCK_NAME.email.placeholder' })}
/>
/>,
)}
</FormItem>
<FormItem help={help}>
......@@ -261,7 +262,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
size="large"
type="password"
placeholder={formatMessage({ id: 'BLOCK_NAME.password.placeholder' })}
/>
/>,
)}
</Popover>
</FormItem>
......@@ -281,7 +282,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
size="large"
type="password"
placeholder={formatMessage({ id: 'BLOCK_NAME.confirm-password.placeholder' })}
/>
/>,
)}
</FormItem>
<FormItem>
......@@ -311,7 +312,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
size="large"
style={{ width: '80%' }}
placeholder={formatMessage({ id: 'BLOCK_NAME.phone-number.placeholder' })}
/>
/>,
)}
</InputGroup>
</FormItem>
......@@ -329,7 +330,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
<Input
size="large"
placeholder={formatMessage({ id: 'BLOCK_NAME.verification-code.placeholder' })}
/>
/>,
)}
</Col>
<Col span={8}>
......
......@@ -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 {
......
......@@ -11,8 +11,8 @@
}
h3 {
font-size: 16px;
margin-bottom: 20px;
font-size: 16px;
}
.getCaptcha {
......
......@@ -4,11 +4,11 @@
padding: 20px 0 8px 24px;
font-size: 0;
& > a {
color: @text-color;
display: inline-block;
font-size: @font-size-base;
margin-bottom: 13px;
width: 25%;
margin-bottom: 13px;
color: @text-color;
font-size: @font-size-base;
&:hover {
color: @primary-color;
}
......
......@@ -33,8 +33,8 @@ class EditableLinkGroup extends PureComponent<EditableLinkGroupProps> {
to: link.href,
href: link.href,
},
link.title
)
link.title,
),
)}
{
<Button size="small" type="primary" ghost onClick={onAdd} icon="plus">
......
......@@ -20,11 +20,7 @@ const PageHeaderWrapper: React.SFC<IPageHeaderWrapperProps> = ({
<RouteContext.Consumer>
{value => (
<div style={{ margin: '-24px -24px 0' }}>
<PageHeader
title={title}
{...restProps}
{...value}
>
<PageHeader title={title} {...restProps} {...value}>
<div className={styles.detail}>
<div className={styles.main}>
<div className={styles.row}>
......
......@@ -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 });
}
}
......
......@@ -34,6 +34,8 @@ class Radar extends Component<IRadarProps, IRadarState> {
state: IRadarState = {
legendData: [],
};
chart: G2.Chart | undefined;
node: HTMLDivElement | undefined;
componentDidMount() {
this.getLegendData();
......@@ -45,7 +47,6 @@ class Radar extends Component<IRadarProps, IRadarState> {
this.getLegendData();
}
}
chart: G2.Chart | undefined;
getG2Instance = (chart: G2.Chart) => {
this.chart = chart;
......@@ -75,7 +76,6 @@ class Radar extends Component<IRadarProps, IRadarState> {
legendData,
});
};
node: HTMLDivElement | undefined;
handleRef = (n: HTMLDivElement) => {
this.node = n;
......@@ -86,7 +86,7 @@ class Radar extends Component<IRadarProps, IRadarState> {
checked: boolean;
name: string;
},
i: string | number
i: string | number,
) => {
const newItem = item;
newItem.checked = !newItem.checked;
......
export interface ITag {
export interface itag {
key: string;
label: string;
}
export interface IProvince {
export interface iprovince {
label: string;
key: string;
}
export interface ICity {
export interface icity {
label: string;
key: string;
}
export interface Geographic {
export interface geographic {
province: IProvince;
city: ICity;
}
export interface INotice {
export interface inotice {
id: string;
title: string;
logo: string;
......@@ -29,7 +29,7 @@ export interface INotice {
memberLink: string;
}
export interface ICurrentUser {
export interface icurrentuser {
name: string;
avatar: string;
userid: string;
......@@ -47,13 +47,13 @@ export interface ICurrentUser {
phone: string;
}
export interface IMember {
export interface imember {
avatar: string;
name: string;
id: string;
}
export interface IActivities {
export interface iactivities {
id: string;
updatedAt: string;
user: {
......@@ -68,10 +68,11 @@ export interface IActivities {
name: string;
link: string;
};
template: string;
}
export interface IRadarData {
export interface iradardata {
label: string;
name: string;
value: number;
......
......@@ -45,7 +45,7 @@ interface BLOCK_NAME_CAMEL_CASEProps {
projectNotice: INotice[];
activities: IActivities[];
radarData: IRadarData[];
dispatch: Dispatch;
dispatch: Dispatch<any>;
currentUserLoading: boolean;
projectLoading: boolean;
activitiesLoading: boolean;
......@@ -66,7 +66,7 @@ interface BLOCK_NAME_CAMEL_CASEProps {
currentUserLoading: loading.effects['BLOCK_NAME_CAMEL_CASE/fetchUserCurrent'],
projectLoading: loading.effects['BLOCK_NAME_CAMEL_CASE/fetchProjectNotice'],
activitiesLoading: loading.effects['BLOCK_NAME_CAMEL_CASE/fetchActivitiesList'],
})
}),
)
class PAGE_NAME_UPPER_CAMEL_CASE extends PureComponent<BLOCK_NAME_CAMEL_CASEProps> {
componentDidMount() {
......
......@@ -12,7 +12,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 {
......@@ -61,7 +61,7 @@ const Model: ModelType = {
type: 'save',
payload: {
projectNotice: Array.isArray(response) ? response : [],
}
},
});
},
*fetchActivitiesList(_, { call, put }) {
......@@ -70,7 +70,7 @@ const Model: ModelType = {
type: 'save',
payload: {
activities: Array.isArray(response) ? response : [],
}
},
});
},
*fetchChart(_, { call, put }) {
......
......@@ -17,65 +17,66 @@
flex: 0 1 72px;
margin-bottom: 8px;
& > span {
border-radius: 72px;
display: block;
width: 72px;
height: 72px;
border-radius: 72px;
}
}
.content {
position: relative;
top: 4px;
margin-left: 24px;
flex: 1 1 auto;
margin-left: 24px;
color: @text-color-secondary;
line-height: 22px;
.contentTitle {
margin-bottom: 12px;
color: @heading-color;
font-weight: 500;
font-size: 20px;
line-height: 28px;
font-weight: 500;
color: @heading-color;
margin-bottom: 12px;
}
}
}
.extraContent {
.clearfix();
float: right;
white-space: nowrap;
.statItem {
padding: 0 32px;
position: relative;
display: inline-block;
padding: 0 32px;
> p:first-child {
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: 30px;
line-height: 38px;
margin: 0;
> span {
color: @text-color-secondary;
font-size: 20px;
}
}
&:after {
background-color: @border-color-split;
&::after {
position: absolute;
top: 8px;
right: 0;
width: 1px;
height: 40px;
background-color: @border-color-split;
content: '';
}
&:last-child {
padding-right: 0;
&:after {
&::after {
display: none;
}
}
......@@ -85,16 +86,16 @@
.members {
a {
display: block;
margin: 12px 0;
height: 24px;
margin: 12px 0;
color: @text-color;
transition: all 0.3s;
.textOverflow();
.member {
margin-left: 12px;
font-size: @font-size-base;
line-height: 24px;
vertical-align: top;
margin-left: 12px;
}
&:hover {
color: @primary-color;
......@@ -105,22 +106,22 @@
.projectList {
:global {
.ant-card-meta-description {
color: @text-color-secondary;
height: 44px;
line-height: 22px;
overflow: hidden;
color: @text-color-secondary;
line-height: 22px;
}
}
.cardTitle {
font-size: 0;
a {
color: @heading-color;
display: inline-block;
height: 24px;
margin-left: 12px;
color: @heading-color;
font-size: @font-size-base;
line-height: 24px;
height: 24px;
display: inline-block;
vertical-align: top;
font-size: @font-size-base;
&:hover {
color: @primary-color;
}
......@@ -131,25 +132,25 @@
}
.projectItemContent {
display: flex;
height: 20px;
margin-top: 8px;
overflow: hidden;
font-size: 12px;
height: 20px;
line-height: 20px;
.textOverflow();
a {
color: @text-color-secondary;
display: inline-block;
flex: 1 1 0;
color: @text-color-secondary;
.textOverflow();
&:hover {
color: @primary-color;
}
}
.datetime {
color: @disabled-color;
flex: 0 0 auto;
float: right;
color: @disabled-color;
}
}
}
......@@ -186,7 +187,7 @@
.statItem {
padding: 0 16px;
text-align: left;
&:after {
&::after {
display: none;
}
}
......
.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;
}
}
const glob = require('glob');
const getPrettierFiles = () => {
let files = [];
const jsFiles = glob.sync('**/*.js*', { ignore: ['**/node_modules/**', 'build/**'] });
const tsFiles = glob.sync('**/*.ts*', { ignore: ['**/node_modules/**', 'build/**'] });
const configFiles = glob.sync('config/**/*.js*', { ignore: ['**/node_modules/**', 'build/**'] });
const scriptFiles = glob.sync('scripts/**/*.js');
const lessFiles = glob.sync('**/*.less*', { ignore: ['**/node_modules/**', 'build/**'] });
const mdFiles = glob.sync('**/*.md*', { ignore: ['**/node_modules/**', 'build/**'] });
files = files.concat(jsFiles);
files = files.concat(tsFiles);
files = files.concat(configFiles);
files = files.concat(scriptFiles);
files = files.concat(lessFiles);
files = files.concat(mdFiles);
if (!files.length) {
return;
}
return files;
};
module.exports = getPrettierFiles;
......@@ -8,20 +8,22 @@
const prettier = require('prettier');
const fs = require('fs');
const chalk = require('chalk');
const prettierConfigPath = require.resolve('../.prettierrc');
const files = process.argv.slice(2);
let didError = false;
let didWarn = false;
files.forEach(file => {
const options = prettier.resolveConfig.sync(file, {
Promise.all([
prettier.resolveConfig(file, {
config: prettierConfigPath,
});
try {
const fileInfo = prettier.getFileInfo.sync(file);
}),
prettier.getFileInfo(file),
])
.then(resolves => {
const [options, fileInfo] = resolves;
if (fileInfo.ignored) {
return;
}
......@@ -30,17 +32,19 @@ files.forEach(file => {
...options,
parser: fileInfo.inferredParser,
};
const isPrettier = prettier.check(input, withParserOptions);
if (!isPrettier) {
console.log(`\x1b[31m ${file} is no prettier, please use npm run prettier and git add !\x1b[0m`);
didWarn = true;
const output = prettier.format(input, withParserOptions);
if (output !== input) {
fs.writeFileSync(file, output, 'utf8');
console.log(chalk.green(`${file} is prettier`));
}
} catch (e) {
})
.catch(e => {
didError = true;
})
.finally(() => {
if (didError) {
process.exit(1);
}
console.log(chalk.hex('#1890FF')('prettier success!'));
});
});
if (didWarn || didError) {
process.exit(1);
}
console.log('\x1b[32m lint prettier success!\x1b[0m');
......@@ -6,27 +6,15 @@
*----------*****--------------
*/
const glob = require('glob');
const prettier = require('prettier');
const fs = require('fs');
const getPrettierFiles = require('./getPrettierFiles');
const prettierConfigPath = require.resolve('../.prettierrc');
const chalk = require('chalk');
let didError = false;
let files = [];
const jsFiles = glob.sync('**/src/*.js*', {
ignore: ['**/node_modules/**', 'build/**', '**/.umi/**'],
});
const tsFiles = glob.sync('**/src/*.ts*', {
ignore: ['**/node_modules/**', 'build/**', '**/.umi/**'],
});
files = files.concat(jsFiles);
files = files.concat(tsFiles);
if (!files.length) {
return;
}
const files = getPrettierFiles();
files.forEach(file => {
const options = prettier.resolveConfig.sync(file, {
......@@ -45,9 +33,10 @@ files.forEach(file => {
const output = prettier.format(input, withParserOptions);
if (output !== input) {
fs.writeFileSync(file, output, 'utf8');
console.log(`\x1b[34m ${file} is prettier`);
console.log(chalk.green(`${file} is prettier`));
}
} catch (e) {
console.log(e);
didError = true;
}
});
......@@ -55,4 +44,4 @@ files.forEach(file => {
if (didError) {
process.exit(1);
}
console.log('\x1b[32m prettier success!');
console.log(chalk.hex('#1890FF')('prettier success!'));
......@@ -2,12 +2,16 @@
"private": true,
"scripts": {
"dev": "cross-env PAGES_PATH='Workplace/src' umi dev",
"lint": "eslint --ext .js src mock tests && npm run lint:style",
"lint": "npm run lint:ts && npm run lint:style && npm run lint:prettier",
"lint-staged": "lint-staged",
"lint-staged:js": "eslint --ext .js",
"lint:fix": "eslint --fix --ext .js src mock tests && npm run lint:style",
"lint:style": "stylelint \"src/**/*.less\" --syntax less",
"prettier": "node ./_scripts/prettier.js"
"lint-staged:ts": "tslint",
"lint:fix": "npm run tslint:fix && npm run lint:style",
"lint:prettier": "check-prettier lint",
"lint:style": "stylelint --syntax less --fix **/**.less ",
"lint:ts": "tslint -p . -c tslint.yml",
"prettier": "node ./_scripts/prettier.js",
"tslint": "npm run tslint:fix",
"tslint:fix": "tslint -p . -c tslint.yml --fix "
},
"husky": {
"hooks": {
......@@ -16,40 +20,40 @@
},
"lint-staged": {
"**/*.less": "stylelint --syntax less",
"x/**/*.{js,jsx}": "npm run lint-staged:js",
"x/**/*.{js,ts,tsx,json,jsx,less}": [
"node ./_scripts/lint-prettier.js",
"**/*.{js,ts,tsx,json,jsx,less}": [
"node ./scripts/lint-prettier.js",
"git add"
]
],
"**/*.{ts,tsx}": "npm run lint-staged:ts"
},
"dependencies": {
"cross-env": "^5.2.0"
},
"peerDependencies": {
"antd": "^3.16.3"
},
"devDependencies": {
"@types/classnames": "^2.2.7",
"babel-eslint": "^10.0.1",
"eslint": "^5.4.0",
"eslint-config-airbnb": "^17.0.0",
"eslint-config-prettier": "^3.0.1",
"eslint-plugin-babel": "^5.3.0",
"eslint-plugin-compat": "^2.6.2",
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-jsx-a11y": "^6.1.2",
"eslint-plugin-markdown": "^1.0.0-beta.6",
"eslint-plugin-react": "^7.11.1",
"glob": "^7.1.3",
"husky": "^1.2.0",
"husky": "^2.2.0",
"lint-staged": "^8.1.0",
"prettier": "1.15.2",
"stylelint": "^9.8.0",
"stylelint-config-prettier": "^4.0.0",
"stylelint-config-standard": "^18.0.0",
"umi": "^2.3.0-0",
"stylelint": "^10.0.1",
"stylelint-config-css-modules": "^1.4.0",
"stylelint-config-prettier": "^5.1.0",
"stylelint-config-rational-order": "^0.1.2",
"stylelint-config-standard": "^18.3.0",
"stylelint-declaration-block-no-ignored-properties": "^2.1.0",
"stylelint-order": "^3.0.0",
"tslint": "^5.12.1",
"tslint-config-prettier": "^1.17.0",
"tslint-eslint-rules": "^5.4.0",
"tslint-react": "^3.6.0",
"typescript": "^3.4.5",
"umi": "^2.6.17",
"umi-plugin-block-dev": "^2.0.2",
"umi-plugin-react": "^1.3.0-0",
"umi-plugin-react": "^1.7.6",
"umi-request": "^1.0.0"
},
"peerDependencies": {
"antd": "^3.17.0"
}
}
......@@ -5,7 +5,7 @@ extends:
- tslint-config-prettier
jsRules:
rules:
class-name: true
class-name: false
eofline: true
forin: true
jsdoc-format: false
......
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