Commit cf5d3b0e authored by 陈帅's avatar 陈帅

run eslint fix

parent 8ae5c0b9
This source diff could not be displayed because it is too large. You can view the blob instead.
/functions/mock/**
/scripts
/config
\ No newline at end of file
/config
**/node_modules/**
_scripts
\ No newline at end of file
const fabric = require('@umijs/fabric');
module.exports = {
parser: 'babel-eslint',
extends: ['airbnb', 'prettier', 'plugin:compat/recommended'],
env: {
browser: true,
node: true,
es6: true,
mocha: true,
jest: true,
jasmine: true,
...fabric.default,
rules: {
...fabric.default.rules,
},
globals: {
APP_TYPE: true,
ANT_DESIGN_PRO_ONLY_DO_NOT_USE_IN_YOUR_PRODUCTION: true,
page: true,
},
rules: {
'react/jsx-filename-extension': [1, { extensions: ['.js'] }],
'react/jsx-wrap-multilines': 0,
'react/prop-types': 0,
'react/forbid-prop-types': 0,
'react/jsx-one-expression-per-line': 0,
'import/no-unresolved': [2, { ignore: ['^@/', '^umi/'] }],
'import/no-extraneous-dependencies': [
2,
{
optionalDependencies: true,
devDependencies: ['**/tests/**.js', '/mock/**.js', '**/**.test.js'],
},
],
'jsx-a11y/no-noninteractive-element-interactions': 0,
'jsx-a11y/click-events-have-key-events': 0,
'jsx-a11y/no-static-element-interactions': 0,
'jsx-a11y/anchor-is-valid': 0,
'linebreak-style': 0,
},
settings: {
polyfills: ['fetch', 'promises', 'url'],
},
};
{
"singleQuote": true,
"trailingComma": "all",
"printWidth": 100,
"proseWrap": "never",
"overrides": [
{
"files": ".prettierrc",
"options": {
"parser": "json"
}
}
]
}
\ No newline at end of file
const fabric = require('@umijs/fabric');
module.exports = {
...fabric.prettier,
};
const fabric = require('@umijs/fabric');
module.exports = {
...fabric.stylelint,
};
{
"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": {
"no-descending-specificity": null,
"plugin/declaration-block-no-ignored-properties": true
}
}
......@@ -119,7 +119,7 @@ function fakeList(count: number): ListItemDataType[] {
owner: user[i % 10],
title: titles[i % 8],
avatar: avatars[i % 8],
cover: parseInt(i / 4 + '', 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
cover: parseInt(`${i / 4}`, 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
status: ['active', 'exception', 'normal'][i % 3] as
| 'normal'
| 'exception'
......
......@@ -19,7 +19,7 @@ export interface AvatarListProps {
maxLength?: number;
excessItemsStyle?: React.CSSProperties;
style?: React.CSSProperties;
children: React.ReactElement<AvatarItemProps> | Array<React.ReactElement<AvatarItemProps>>;
children: React.ReactElement<AvatarItemProps> | React.ReactElement<AvatarItemProps>[];
}
const avatarSizeToClassName = (size?: SizeType) =>
......@@ -54,9 +54,7 @@ const AvatarList: React.SFC<AvatarListProps> & { Item: typeof Item } = ({
}) => {
const numOfChildren = React.Children.count(children);
const numToShow = maxLength >= numOfChildren ? numOfChildren : maxLength;
const childrenArray = React.Children.toArray(children) as Array<
React.ReactElement<AvatarItemProps>
>;
const childrenArray = React.Children.toArray(children) as React.ReactElement<AvatarItemProps>[];
const childrenWithProps = childrenArray.slice(0, numToShow).map(child =>
React.cloneElement(child, {
size,
......
......@@ -138,6 +138,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends PureComponent<
inputValue: '',
});
};
renderChildrenByTabKey = (tabKey: BLOCK_NAME_CAMEL_CASEState['tabKey']) => {
if (tabKey === 'projects') {
return <Projects />;
......@@ -150,6 +151,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends PureComponent<
}
return null;
};
render() {
const { newTags, inputVisible, inputValue, tabKey } = this.state;
const { currentUser, currentUserLoading } = this.props;
......@@ -184,9 +186,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends PureComponent<
<Divider dashed />
<div className={styles.tags}>
<div className={styles.tagsTitle}>标签</div>
{currentUser.tags.concat(newTags).map(item => {
return <Tag key={item.key}>{item.label}</Tag>;
})}
{currentUser.tags.concat(newTags).map(item => <Tag key={item.key}>{item.label}</Tag>)}
{inputVisible && (
<Input
ref={ref => this.saveInputRef(ref)}
......
import { queryCurrent, queryFakeList } from './service';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { CurrentUser, ListItemDataType } from './data';
import { queryCurrent, queryFakeList } from './service';
export interface ModalState {
currentUser: Partial<CurrentUser>;
list: ListItemDataType[];
}
import { Reducer } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
export type Effect = (
action: AnyAction,
effects: EffectsCommandMap & { select: <T>(func: (state: ModalState) => T) => T },
......
......@@ -5,7 +5,7 @@ export async function queryCurrent() {
}
export async function queryFakeList(params: { count: number }) {
return request(`/api/fake_list`, {
return request('/api/fake_list', {
params,
});
}
import React, { Component } from 'react';
import { Select, Spin } from 'antd';
import { connect } from 'dva';
import styles from './GeographicView.less';
import { Dispatch } from 'redux';
import styles from './GeographicView.less';
import { ProvinceData, CityData } from '../data';
const { Option } = Select;
interface SelectItem {
......
......@@ -7,6 +7,7 @@ import styles from './BaseView.less';
import GeographicView from './GeographicView';
import PhoneView from './PhoneView';
import { CurrentUser } from '../data';
const FormItem = Form.Item;
const { Option } = Select;
......@@ -71,6 +72,7 @@ interface BaseViewProps extends FormComponentProps {
}))
class BaseView extends Component<BaseViewProps> {
view: HTMLDivElement | undefined;
componentDidMount() {
this.setBaseInfo();
}
......
......@@ -34,6 +34,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
PAGE_NAME_UPPER_CAMEL_CASEState
> {
main: HTMLDivElement | undefined;
constructor(props: PAGE_NAME_UPPER_CAMEL_CASEProps) {
super(props);
const menuMap = {
......
import { query as queryUsers, queryCurrent, queryProvince, queryCity } from './service';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { query as queryUsers, queryCurrent, queryProvince, queryCity } from './service';
import { CurrentUser, City, Province } from './data';
export interface ModalState {
......
......@@ -10,10 +10,10 @@ export interface IBarProps {
color?: string;
padding?: [number, number, number, number];
height?: number;
data: Array<{
data: {
x: string;
y: number;
}>;
}[];
forceFit?: boolean;
autoLabel?: boolean;
style?: React.CSSProperties;
......@@ -28,7 +28,9 @@ class Bar extends Component<
state = {
autoHideXLabels: false,
};
root: HTMLDivElement | undefined;
node: HTMLDivElement | undefined;
componentDidMount() {
......@@ -38,9 +40,11 @@ class Bar extends Component<
componentWillUnmount() {
window.removeEventListener('resize', this.resize);
}
handleRoot = (n: HTMLDivElement) => {
this.root = n;
};
handleRef = (n: HTMLDivElement) => {
this.node = n;
};
......
......@@ -112,7 +112,7 @@ class Gauge extends React.Component<IGaugeProps> {
label={{
offset: -12,
formatter,
textStyle: textStyle,
textStyle,
}}
/>
<Guide>
......
......@@ -23,10 +23,10 @@ export interface IMiniAreaProps {
scale?: { x: any; y: any };
yAxis?: IAxis;
borderWidth?: number;
data: Array<{
data: {
x: number | string;
y: number;
}>;
}[];
}
class MiniArea extends React.Component<IMiniAreaProps> {
......
......@@ -6,10 +6,10 @@ import styles from '../index.less';
export interface IMiniBarProps {
color?: string;
height?: number;
data: Array<{
data: {
x: number | string;
y: number;
}>;
}[];
forceFit?: boolean;
style?: React.CSSProperties;
}
......
......@@ -17,8 +17,7 @@ const MiniProgress: React.SFC<IMiniProgressProps> = ({
color = 'rgb(19, 194, 194)',
strokeWidth,
percent,
}) => {
return (
}) => (
<div className={styles.miniProgress}>
<Tooltip title={targetLabel}>
<div className={styles.target} style={{ left: target ? `${target}%` : undefined }}>
......@@ -38,6 +37,5 @@ const MiniProgress: React.SFC<IMiniProgressProps> = ({
</div>
</div>
);
};
export default MiniProgress;
......@@ -9,6 +9,7 @@ import Bind from 'lodash-decorators/bind';
import autoHeight from '../autoHeight';
import styles from './index.less';
export interface IPieProps {
animate?: boolean;
color?: string;
......@@ -19,10 +20,10 @@ export interface IPieProps {
hasLegend?: boolean;
padding?: [number, number, number, number];
percent?: number;
data?: Array<{
data?: {
x: string | string;
y: number;
}>;
}[];
inner?: number;
lineWidth?: number;
forceFit?: boolean;
......@@ -35,7 +36,7 @@ export interface IPieProps {
subTitle?: React.ReactNode;
}
interface IPieState {
legendData: Array<{ checked: boolean; x: string; color: string; percent: number; y: string }>;
legendData: { checked: boolean; x: string; color: string; percent: number; y: string }[];
legendBlock: boolean;
}
class Pie extends Component<IPieProps, IPieState> {
......@@ -45,7 +46,9 @@ class Pie extends Component<IPieProps, IPieState> {
};
requestRef: number | undefined;
root!: HTMLDivElement;
chart: G2.Chart | undefined;
componentDidMount() {
......@@ -104,6 +107,7 @@ class Pie extends Component<IPieProps, IPieState> {
legendData,
});
};
handleRoot = (n: HTMLDivElement) => {
this.root = n;
};
......@@ -118,7 +122,7 @@ class Pie extends Component<IPieProps, IPieState> {
const filteredLegendData = legendData.filter(l => l.checked).map(l => l.x);
if (this.chart) {
this.chart.filter('x', val => filteredLegendData.indexOf(val + '') > -1);
this.chart.filter('x', val => filteredLegendData.indexOf(`${val}`) > -1);
}
this.setState({
......@@ -216,11 +220,11 @@ class Pie extends Component<IPieProps, IPieState> {
data = [
{
x: '占比',
y: parseFloat(percent + ''),
y: parseFloat(`${percent}`),
},
{
x: '反比',
y: 100 - parseFloat(percent + ''),
y: 100 - parseFloat(`${percent}`),
},
];
}
......
......@@ -13,10 +13,10 @@ import styles from './index.less';
const imgUrl = 'https://gw.alipayobjects.com/zos/rmsportal/gWyeGLCdFFRavBGIDzWk.png';
export interface ITagCloudProps {
data: Array<{
data: {
name: string;
value: number;
}>;
}[];
height?: number;
className?: string;
style?: React.CSSProperties;
......@@ -34,10 +34,13 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
height: 0,
width: 0,
};
isUnmount!: boolean;
requestRef!: number;
root: HTMLDivElement | undefined;
imageMask: HTMLImageElement | undefined;
componentDidMount() {
......@@ -54,16 +57,19 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
this.renderChart(this.props);
}
}
componentWillUnmount() {
this.isUnmount = true;
window.cancelAnimationFrame(this.requestRef);
window.removeEventListener('resize', this.resize);
}
resize = () => {
this.requestRef = requestAnimationFrame(() => {
this.renderChart(this.props);
});
};
saveRootRef = (node: HTMLDivElement) => {
this.root = node;
};
......
......@@ -6,11 +6,11 @@ import autoHeight from '../autoHeight';
import styles from './index.less';
export interface ITimelineChartProps {
data: Array<{
data: {
x: number;
y1: number;
y2: number;
}>;
}[];
title?: string;
titleMap: { y1: string; y2: string };
padding?: [number, number, number, number];
......
......@@ -18,8 +18,11 @@ class WaterWave extends Component<IWaterWaveProps> {
state = {
radio: 1,
};
timer: number = 0;
root: HTMLDivElement | undefined | null;
node: HTMLCanvasElement | undefined | null;
componentDidMount() {
......@@ -59,6 +62,7 @@ class WaterWave extends Component<IWaterWaveProps> {
});
}
};
renderChart(type?: string) {
const { percent, color = '#1890FF' } = this.props;
const data = percent / 100;
......@@ -201,6 +205,7 @@ class WaterWave extends Component<IWaterWaveProps> {
}
render();
}
render() {
const { radio } = this.state;
const { percent, title, height = 1 } = this.props;
......
......@@ -7,10 +7,10 @@ export type IReactComponent<P = any> =
function computeHeight(node: HTMLDivElement) {
node.style.height = '100%';
const totalHeight = parseInt(getComputedStyle(node).height + '', 10);
const totalHeight = parseInt(`${getComputedStyle(node).height}`, 10);
const padding =
parseInt(getComputedStyle(node).paddingTop + '', 10) +
parseInt(getComputedStyle(node).paddingBottom + '', 10);
parseInt(`${getComputedStyle(node).paddingTop}`, 10) +
parseInt(`${getComputedStyle(node).paddingBottom}`, 10);
return totalHeight - padding;
}
......@@ -35,14 +35,16 @@ interface IAutoHeightProps {
}
function autoHeight() {
return function<P extends IAutoHeightProps>(
return function<P extends IAutoHeightProps> (
WrappedComponent: React.ComponentClass<P> | React.SFC<P>,
): React.ComponentClass<P> {
class AutoHeightComponent extends React.Component<P & IAutoHeightProps> {
state = {
computedHeight: 0,
};
root!: HTMLDivElement;
componentDidMount() {
const { height } = this.props;
if (!height) {
......@@ -55,9 +57,11 @@ function autoHeight() {
}
}
}
handleRoot = (node: HTMLDivElement) => {
this.root = node;
};
render() {
const { height } = this.props;
const { computedHeight } = this.state;
......
import React from 'react';
import { Row, Col, Icon, Tooltip } from 'antd';
import { FormattedMessage } from 'umi-plugin-react/locale';
import Charts from './Charts';
import numeral from 'numeral';
import Charts from './Charts';
import styles from '../style.less';
import Yuan from '../utils/Yuan';
import Trend from './Trend';
import { IVisitData } from '../data.d';
const { ChartCard, MiniArea, MiniBar, MiniProgress, Field } = Charts;
const topColResponsiveProps = {
......@@ -18,8 +19,7 @@ const topColResponsiveProps = {
style: { marginBottom: 24 },
};
const IntroduceRow = ({ loading, visitData }: { loading: boolean; visitData: IVisitData[] }) => {
return (
const IntroduceRow = ({ loading, visitData }: { loading: boolean; visitData: IVisitData[] }) => (
<Row gutter={24}>
<Col {...topColResponsiveProps}>
<ChartCard
......@@ -160,6 +160,5 @@ const IntroduceRow = ({ loading, visitData }: { loading: boolean; visitData: IVi
</Col>
</Row>
);
};
export default IntroduceRow;
......@@ -2,6 +2,7 @@ import React from 'react';
import { Icon } from 'antd';
import classNames from 'classnames';
import styles from './index.less';
export interface NumberInfoProps {
title?: React.ReactNode | string;
subTitle?: React.ReactNode | string;
......
......@@ -5,6 +5,7 @@ import Charts from './Charts';
import styles from '../style.less';
import NumberInfo from './NumberInfo';
import { IOfflineData, IOfflineChartData } from '../data';
const { TimelineChart, Pie } = Charts;
const CustomTab = ({
......@@ -13,8 +14,7 @@ const CustomTab = ({
}: {
data: IOfflineData;
currentTabKey: string;
}) => {
return (
}) => (
<Row gutter={8} style={{ width: 138, margin: '8px 0' }}>
<Col span={12}>
<NumberInfo
......@@ -42,7 +42,6 @@ const CustomTab = ({
</Col>
</Row>
);
};
const { TabPane } = Tabs;
......
import React from 'react';
import { Card, Radio } from 'antd';
import Charts from './Charts';
import { FormattedMessage } from 'umi-plugin-react/locale';
import { RadioChangeEvent } from 'antd/es/radio';
import Charts from './Charts';
import styles from '../style.less';
import Yuan from '../utils/Yuan';
import { RadioChangeEvent } from 'antd/es/radio';
import { ISalesData } from '../data';
const { Pie } = Charts;
......@@ -21,8 +21,7 @@ const ProportionSales = ({
salesType: 'all' | 'online' | 'stores';
salesPieData: ISalesData[];
handleChangeSalesType?: (e: RadioChangeEvent) => void;
}) => {
return (
}) => (
<Card
loading={loading}
className={styles.salesCard}
......@@ -74,6 +73,5 @@ const ProportionSales = ({
</div>
</Card>
);
};
export default ProportionSales;
......@@ -2,8 +2,8 @@ import React from 'react';
import { Row, Col, Card, Tabs, DatePicker } from 'antd';
import { FormattedMessage, formatMessage } from 'umi-plugin-react/locale';
import numeral from 'numeral';
import Charts from './Charts';
import { RangePickerValue } from 'antd/es/date-picker/interface';
import Charts from './Charts';
import { ISalesData } from '../data';
import styles from '../style.less';
......
import React from 'react';
import { Row, Col, Table, Tooltip, Card, Icon } from 'antd';
import { FormattedMessage } from 'umi-plugin-react/locale';
import numeral from 'numeral';
import Charts from './Charts';
import Trend from './Trend';
import NumberInfo from './NumberInfo';
import numeral from 'numeral';
import styles from '../style.less';
import { ISearchData, IVisitData2 } from '../data';
......
......@@ -2,13 +2,13 @@ import React, { Component, Suspense } from 'react';
import { connect } from 'dva';
import { Row, Col, Icon, Menu, Dropdown } from 'antd';
import { RangePickerValue } from 'antd/es/date-picker/interface';
import { Dispatch } from 'redux';
import { RadioChangeEvent } from 'antd/es/radio';
import { GridContent } from '@ant-design/pro-layout';
import { getTimeDistance } from './utils/utils';
import styles from './style.less';
import PageLoading from './components/PageLoading';
import { Dispatch } from 'redux';
import { IAnalysisData } from './data.d';
import { RadioChangeEvent } from 'antd/es/radio';
import { GridContent } from '@ant-design/pro-layout';
const IntroduceRow = React.lazy(() => import('./components/IntroduceRow'));
const SalesCard = React.lazy(() => import('./components/SalesCard'));
......@@ -51,8 +51,11 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
currentTabKey: '',
rangePickerValue: getTimeDistance('year'),
};
reqRef!: number;
timeoutId!: number;
componentDidMount() {
const { dispatch } = this.props;
this.reqRef = requestAnimationFrame(() => {
......
import { fakeChartData } from './service';
import { IAnalysisData } from './data';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { IAnalysisData } from './data';
import { fakeChartData } from './service';
export type Effect = (
action: AnyAction,
......
......@@ -7,6 +7,7 @@ export default class Yuan extends React.Component<{
children: React.ReactText;
}> {
main: HTMLSpanElement | undefined | null;
componentDidMount() {
this.renderToHtml();
}
......@@ -14,6 +15,7 @@ export default class Yuan extends React.Component<{
componentDidUpdate() {
this.renderToHtml();
}
renderToHtml = () => {
const { children } = this.props;
if (this.main) {
......
import React, { Component } from 'react';
import Charts from '../Charts';
import { Statistic } from 'antd';
import Charts from '../Charts';
import styles from './index.less';
const { MiniArea } = Charts;
......@@ -24,12 +24,15 @@ export default class ActiveChart extends Component {
state = {
activeData: getActiveData(),
};
timer: number | undefined;
requestRef: number | undefined;
componentDidMount() {
this.loopData();
}
componentWillUnmount() {
clearTimeout(this.timer);
if (this.requestRef) {
......
......@@ -112,7 +112,7 @@ class Gauge extends React.Component<IGaugeProps> {
label={{
offset: -12,
formatter,
textStyle: textStyle,
textStyle,
}}
/>
<Guide>
......
......@@ -24,10 +24,10 @@ export interface IMiniAreaProps {
scale?: { x?: any; y?: any };
yAxis?: Partial<IAxis>;
borderWidth?: number;
data: Array<{
data: {
x: number | string;
y: number;
}>;
}[];
}
class MiniArea extends React.Component<IMiniAreaProps> {
......
......@@ -9,6 +9,7 @@ import Bind from 'lodash-decorators/bind';
import autoHeight from '../autoHeight';
import styles from './index.less';
export interface IPieProps {
animate?: boolean;
color?: string;
......@@ -19,10 +20,10 @@ export interface IPieProps {
hasLegend?: boolean;
padding?: [number, number, number, number];
percent?: number;
data?: Array<{
data?: {
x: string | string;
y: number;
}>;
}[];
inner?: number;
lineWidth?: number;
forceFit?: boolean;
......@@ -35,7 +36,7 @@ export interface IPieProps {
subTitle?: React.ReactNode;
}
interface IPieState {
legendData: Array<{ checked: boolean; x: string; color: string; percent: number; y: string }>;
legendData: { checked: boolean; x: string; color: string; percent: number; y: string }[];
legendBlock: boolean;
}
class Pie extends Component<IPieProps, IPieState> {
......@@ -45,7 +46,9 @@ class Pie extends Component<IPieProps, IPieState> {
};
requestRef: number | undefined;
root!: HTMLDivElement;
chart: G2.Chart | undefined;
componentDidMount() {
......@@ -104,6 +107,7 @@ class Pie extends Component<IPieProps, IPieState> {
legendData,
});
};
handleRoot = (n: HTMLDivElement) => {
this.root = n;
};
......@@ -118,7 +122,7 @@ class Pie extends Component<IPieProps, IPieState> {
const filteredLegendData = legendData.filter(l => l.checked).map(l => l.x);
if (this.chart) {
this.chart.filter('x', val => filteredLegendData.indexOf(val + '') > -1);
this.chart.filter('x', val => filteredLegendData.indexOf(`${val}`) > -1);
}
this.setState({
......@@ -216,11 +220,11 @@ class Pie extends Component<IPieProps, IPieState> {
data = [
{
x: '占比',
y: parseFloat(percent + ''),
y: parseFloat(`${percent}`),
},
{
x: '反比',
y: 100 - parseFloat(percent + ''),
y: 100 - parseFloat(`${percent}`),
},
];
}
......
......@@ -13,10 +13,10 @@ import styles from './index.less';
const imgUrl = 'https://gw.alipayobjects.com/zos/rmsportal/gWyeGLCdFFRavBGIDzWk.png';
export interface ITagCloudProps {
data: Array<{
data: {
name: string;
value: string;
}>;
}[];
height?: number;
className?: string;
style?: React.CSSProperties;
......@@ -34,10 +34,13 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
height: 0,
width: 0,
};
isUnmount!: boolean;
requestRef!: number;
root: HTMLDivElement | undefined;
imageMask: HTMLImageElement | undefined;
componentDidMount() {
......@@ -54,16 +57,19 @@ class TagCloud extends Component<ITagCloudProps, ITagCloudState> {
this.renderChart(this.props);
}
}
componentWillUnmount() {
this.isUnmount = true;
window.cancelAnimationFrame(this.requestRef);
window.removeEventListener('resize', this.resize);
}
resize = () => {
this.requestRef = requestAnimationFrame(() => {
this.renderChart(this.props);
});
};
saveRootRef = (node: HTMLDivElement) => {
this.root = node;
};
......
......@@ -18,8 +18,11 @@ class WaterWave extends Component<IWaterWaveProps> {
state = {
radio: 1,
};
timer: number = 0;
root: HTMLDivElement | undefined | null;
node: HTMLCanvasElement | undefined | null;
componentDidMount() {
......@@ -59,6 +62,7 @@ class WaterWave extends Component<IWaterWaveProps> {
});
}
};
renderChart(type?: string) {
const { percent, color = '#1890FF' } = this.props;
const data = percent / 100;
......@@ -201,6 +205,7 @@ class WaterWave extends Component<IWaterWaveProps> {
}
render();
}
render() {
const { radio } = this.state;
const { percent, title, height = 1 } = this.props;
......
......@@ -7,10 +7,10 @@ export type IReactComponent<P = any> =
function computeHeight(node: HTMLDivElement) {
node.style.height = '100%';
const totalHeight = parseInt(getComputedStyle(node).height + '', 10);
const totalHeight = parseInt(`${getComputedStyle(node).height}`, 10);
const padding =
parseInt(getComputedStyle(node).paddingTop + '', 10) +
parseInt(getComputedStyle(node).paddingBottom + '', 10);
parseInt(`${getComputedStyle(node).paddingTop}`, 10) +
parseInt(`${getComputedStyle(node).paddingBottom}`, 10);
return totalHeight - padding;
}
......@@ -35,14 +35,16 @@ interface IAutoHeightProps {
}
function autoHeight() {
return function<P extends IAutoHeightProps>(
return function<P extends IAutoHeightProps> (
WrappedComponent: React.ComponentClass<P> | React.SFC<P>,
): React.ComponentClass<P> {
class AutoHeightComponent extends React.Component<P & IAutoHeightProps> {
state = {
computedHeight: 0,
};
root!: HTMLDivElement;
componentDidMount() {
const { height } = this.props;
if (!height) {
......@@ -54,9 +56,11 @@ function autoHeight() {
}
}
}
handleRoot = (node: HTMLDivElement) => {
this.root = node;
};
render() {
const { height } = this.props;
const { computedHeight } = this.state;
......
......@@ -3,6 +3,7 @@ import Gauge from './Gauge';
import WaterWave from './WaterWave';
import TagCloud from './TagCloud';
import MiniArea from './MiniArea';
const Charts = {
Pie,
WaterWave,
......
......@@ -4,11 +4,11 @@ import { formatMessage, FormattedMessage } from 'umi-plugin-react/locale';
import { Row, Col, Card, Statistic, Tooltip } from 'antd';
import numeral from 'numeral';
import { Dispatch } from 'redux';
import { GridContent } from '@ant-design/pro-layout';
import { IStateType } from './model';
import ActiveChart from './components/ActiveChart';
import styles from './style.less';
import Charts from './components/Charts';
import { GridContent } from '@ant-design/pro-layout';
const { Countdown } = Statistic;
......
import { queryTags } from './service';
import { ITag } from './data';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { ITag } from './data';
import { queryTags } from './service';
export interface IStateType {
tags: ITag[];
......
......@@ -7,10 +7,10 @@ export type IReactComponent<P = any> =
function computeHeight(node: HTMLDivElement) {
node.style.height = '100%';
const totalHeight = parseInt(getComputedStyle(node).height + '', 10);
const totalHeight = parseInt(`${getComputedStyle(node).height}`, 10);
const padding =
parseInt(getComputedStyle(node).paddingTop + '', 10) +
parseInt(getComputedStyle(node).paddingBottom + '', 10);
parseInt(`${getComputedStyle(node).paddingTop}`, 10) +
parseInt(`${getComputedStyle(node).paddingBottom}`, 10);
return totalHeight - padding;
}
......@@ -35,14 +35,16 @@ interface IAutoHeightProps {
}
function autoHeight() {
return function<P extends IAutoHeightProps>(
return function<P extends IAutoHeightProps> (
WrappedComponent: React.ComponentClass<P> | React.SFC<P>,
): React.ComponentClass<P> {
class AutoHeightComponent extends React.Component<P & IAutoHeightProps> {
state = {
computedHeight: 0,
};
root!: HTMLDivElement;
componentDidMount() {
const { height } = this.props;
if (!height) {
......@@ -55,9 +57,11 @@ function autoHeight() {
}
}
}
handleRoot = (node: HTMLDivElement) => {
this.root = node;
};
render() {
const { height } = this.props;
const { computedHeight } = this.state;
......
......@@ -9,11 +9,11 @@ export interface IRadarProps {
height?: number;
padding?: [number, number, number, number];
hasLegend?: boolean;
data: Array<{
data: {
name: string;
label: string;
value: string | number;
}>;
}[];
colors?: string[];
animate?: boolean;
forceFit?: boolean;
......@@ -21,20 +21,22 @@ export interface IRadarProps {
style?: React.CSSProperties;
}
interface IRadarState {
legendData: Array<{
legendData: {
checked: boolean;
name: string;
color: string;
percent: number;
value: string;
}>;
}[];
}
/* eslint react/no-danger:0 */
class Radar extends Component<IRadarProps, IRadarState> {
state: IRadarState = {
legendData: [],
};
chart: G2.Chart | undefined;
node: HTMLDivElement | undefined;
componentDidMount() {
......@@ -97,7 +99,7 @@ class Radar extends Component<IRadarProps, IRadarState> {
const filteredLegendData = legendData.filter(l => l.checked).map(l => l.name);
if (this.chart) {
this.chart.filter('name', val => filteredLegendData.indexOf(val + '') > -1);
this.chart.filter('name', val => filteredLegendData.indexOf(`${val}`) > -1);
this.chart.repaint();
}
......
......@@ -5,11 +5,11 @@ import Link from 'umi/link';
import { Row, Col, Card, List, Avatar } from 'antd';
import { Dispatch } from 'redux';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import EditableLinkGroup from './components/EditableLinkGroup';
import Radar from './components/Radar';
import { ModalState } from './model';
import { ICurrentUser, IActivities, IRadarData, INotice } from './data';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import styles from './style.less';
......@@ -209,9 +209,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends PureComponent<BLOCK_NAME_CAMEL_CASEProp
>
<List<IActivities>
loading={activitiesLoading}
renderItem={item => {
return this.renderActivities(item);
}}
renderItem={item => this.renderActivities(item)}
dataSource={activities}
className={styles.activitiesList}
size="large"
......
......@@ -7,6 +7,7 @@ flow
```sh
umi block add ant-design-pro/flow
```
## SNAPSHOT
![SNAPSHOT](./snapshot.png)
......
......@@ -3,8 +3,7 @@ import { NodeMenu, EdgeMenu, GroupMenu, MultiMenu, CanvasMenu, ContextMenu } fro
import MenuItem from './MenuItem';
import styles from './index.less';
const FlowContextMenu = () => {
return (
const FlowContextMenu = () => (
<ContextMenu className={styles.contextMenu}>
<NodeMenu>
<MenuItem command="copy" />
......@@ -31,6 +30,5 @@ const FlowContextMenu = () => {
</CanvasMenu>
</ContextMenu>
);
};
export default FlowContextMenu;
......@@ -3,9 +3,7 @@ import { Command } from 'gg-editor';
import IconFont from '../../common/IconFont';
import styles from './index.less';
const upperFirst = (str: string) => {
return str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
};
const upperFirst = (str: string) => str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
interface MenuItemProps {
command: string;
......
......@@ -3,8 +3,7 @@ import { NodeMenu, CanvasMenu, ContextMenu } from 'gg-editor';
import MenuItem from './MenuItem';
import styles from './index.less';
const MindContextMenu = () => {
return (
const MindContextMenu = () => (
<ContextMenu className={styles.contextMenu}>
<NodeMenu>
<MenuItem command="append" text="Topic" />
......@@ -19,6 +18,5 @@ const MindContextMenu = () => {
</CanvasMenu>
</ContextMenu>
);
};
export default MindContextMenu;
......@@ -3,9 +3,7 @@ import { Card, Form, Input, Select } from 'antd';
import { withPropsAPI } from 'gg-editor';
import { FormComponentProps } from 'antd/es/form';
const upperFirst = (str: string) => {
return str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
};
const upperFirst = (str: string) => str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
const { Item } = Form;
const { Option } = Select;
......@@ -60,15 +58,13 @@ class DetailForm extends React.Component<DetailFormProps> {
}, 0);
};
renderEdgeShapeSelect = () => {
return (
renderEdgeShapeSelect = () => (
<Select onChange={this.handleSubmit}>
<Option value="flow-smooth">Smooth</Option>
<Option value="flow-polyline">Polyline</Option>
<Option value="flow-polyline-round">Polyline Round</Option>
</Select>
);
};
renderNodeDetail = () => {
const { form } = this.props;
......
......@@ -4,8 +4,7 @@ import { NodePanel, EdgePanel, GroupPanel, MultiPanel, CanvasPanel, DetailPanel
import DetailForm from './DetailForm';
import styles from './index.less';
const FlowDetailPanel = () => {
return (
const FlowDetailPanel = () => (
<DetailPanel className={styles.detailPanel}>
<NodePanel>
<DetailForm type="node" />
......@@ -24,6 +23,5 @@ const FlowDetailPanel = () => {
</CanvasPanel>
</DetailPanel>
);
};
export default FlowDetailPanel;
......@@ -4,8 +4,7 @@ import { NodePanel, CanvasPanel, DetailPanel } from 'gg-editor';
import DetailForm from './DetailForm';
import styles from './index.less';
const MindDetailPanel = () => {
return (
const MindDetailPanel = () => (
<DetailPanel className={styles.detailPanel}>
<NodePanel>
<DetailForm type="node" />
......@@ -15,6 +14,5 @@ const MindDetailPanel = () => {
</CanvasPanel>
</DetailPanel>
);
};
export default MindDetailPanel;
......@@ -3,8 +3,7 @@ import { Card } from 'antd';
import { ItemPanel, Item } from 'gg-editor';
import styles from './index.less';
const FlowItemPanel = () => {
return (
const FlowItemPanel = () => (
<ItemPanel className={styles.itemPanel}>
<Card bordered={false}>
<Item
......@@ -50,6 +49,5 @@ const FlowItemPanel = () => {
</Card>
</ItemPanel>
);
};
export default FlowItemPanel;
......@@ -3,8 +3,7 @@ import { Card } from 'antd';
import { ItemPanel, Item } from 'gg-editor';
import styles from './index.less';
const KoniItemPanel = () => {
return (
const KoniItemPanel = () => (
<ItemPanel className={styles.itemPanel}>
<Card bordered={false}>
<Item
......@@ -49,6 +48,5 @@ const KoniItemPanel = () => {
</Card>
</ItemPanel>
);
};
export default KoniItemPanel;
......@@ -2,12 +2,10 @@ import React from 'react';
import { Card } from 'antd';
import { Minimap } from 'gg-editor';
const EditorMinimap = () => {
return (
const EditorMinimap = () => (
<Card type="inner" size="small" title="Minimap" bordered={false}>
<Minimap height={200} />
</Card>
);
};
export default EditorMinimap;
......@@ -4,8 +4,7 @@ import { Toolbar } from 'gg-editor';
import ToolbarButton from './ToolbarButton';
import styles from './index.less';
const FlowToolbar = () => {
return (
const FlowToolbar = () => (
<Toolbar className={styles.toolbar}>
<ToolbarButton command="undo" />
<ToolbarButton command="redo" />
......@@ -27,6 +26,5 @@ const FlowToolbar = () => {
<ToolbarButton command="unGroup" icon="ungroup" text="Ungroup" />
</Toolbar>
);
};
export default FlowToolbar;
......@@ -4,8 +4,7 @@ import { Toolbar } from 'gg-editor';
import ToolbarButton from './ToolbarButton';
import styles from './index.less';
const FlowToolbar = () => {
return (
const FlowToolbar = () => (
<Toolbar className={styles.toolbar}>
<ToolbarButton command="undo" />
<ToolbarButton command="redo" />
......@@ -22,6 +21,5 @@ const FlowToolbar = () => {
<ToolbarButton command="expand" text="Unfold" />
</Toolbar>
);
};
export default FlowToolbar;
......@@ -4,9 +4,7 @@ import { Command } from 'gg-editor';
import IconFont from '../../common/IconFont';
import styles from './index.less';
const upperFirst = (str: string) => {
return str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
};
const upperFirst = (str: string) => str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
interface ToolbarButtonProps {
command: string;
......
import React from 'react';
import { Row, Col } from 'antd';
import GGEditor, { Flow } from 'gg-editor';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { formatMessage } from 'umi-plugin-react/locale';
import EditorMinimap from './components/EditorMinimap';
import { FlowContextMenu } from './components/EditorContextMenu';
import { FlowToolbar } from './components/EditorToolbar';
import { FlowItemPanel } from './components/EditorItemPanel';
import { FlowDetailPanel } from './components/EditorDetailPanel';
import styles from './index.less';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { formatMessage } from 'umi-plugin-react/locale';
GGEditor.setTrackable(false);
export default () => {
return (
<PageHeaderWrapper
content={formatMessage({
id: 'BLOCK_NAME.description',
defaultMessage: 'description',
})}
>
<GGEditor className={styles.editor}>
<Row type="flex" className={styles.editorHd}>
<Col span={24}>
<FlowToolbar />
</Col>
</Row>
<Row type="flex" className={styles.editorBd}>
<Col span={4} className={styles.editorSidebar}>
<FlowItemPanel />
</Col>
<Col span={16} className={styles.editorContent}>
<Flow className={styles.flow} />
</Col>
<Col span={4} className={styles.editorSidebar}>
<FlowDetailPanel />
<EditorMinimap />
</Col>
</Row>
<FlowContextMenu />
</GGEditor>
</PageHeaderWrapper>
);
};
export default () => (
<PageHeaderWrapper
content={formatMessage({
id: 'BLOCK_NAME.description',
defaultMessage: 'description',
})}
>
<GGEditor className={styles.editor}>
<Row type="flex" className={styles.editorHd}>
<Col span={24}>
<FlowToolbar />
</Col>
</Row>
<Row type="flex" className={styles.editorBd}>
<Col span={4} className={styles.editorSidebar}>
<FlowItemPanel />
</Col>
<Col span={16} className={styles.editorContent}>
<Flow className={styles.flow} />
</Col>
<Col span={4} className={styles.editorSidebar}>
<FlowDetailPanel />
<EditorMinimap />
</Col>
</Row>
<FlowContextMenu />
</GGEditor>
</PageHeaderWrapper>
);
......@@ -7,6 +7,7 @@ flow
```sh
umi block add ant-design-pro/flow
```
## SNAPSHOT
![SNAPSHOT](./snapshot.png)
......
......@@ -3,8 +3,7 @@ import { NodeMenu, EdgeMenu, GroupMenu, MultiMenu, CanvasMenu, ContextMenu } fro
import MenuItem from './MenuItem';
import styles from './index.less';
const FlowContextMenu = () => {
return (
const FlowContextMenu = () => (
<ContextMenu className={styles.contextMenu}>
<NodeMenu>
<MenuItem command="copy" />
......@@ -31,6 +30,5 @@ const FlowContextMenu = () => {
</CanvasMenu>
</ContextMenu>
);
};
export default FlowContextMenu;
......@@ -3,9 +3,8 @@ import { Command } from 'gg-editor';
import IconFont from '../../common/IconFont';
import styles from './index.less';
const upperFirst = (str: string) => {
return str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
};
const upperFirst = (str: string) =>
str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
interface MenuItemProps {
command: string;
......
......@@ -3,8 +3,7 @@ import { NodeMenu, CanvasMenu, ContextMenu } from 'gg-editor';
import MenuItem from './MenuItem';
import styles from './index.less';
const MindContextMenu = () => {
return (
const MindContextMenu = () => (
<ContextMenu className={styles.contextMenu}>
<NodeMenu>
<MenuItem command="append" text="Topic" />
......@@ -19,6 +18,5 @@ const MindContextMenu = () => {
</CanvasMenu>
</ContextMenu>
);
};
export default MindContextMenu;
......@@ -3,9 +3,7 @@ import { Card, Form, Input, Select } from 'antd';
import { withPropsAPI } from 'gg-editor';
import { FormComponentProps } from 'antd/es/form';
const upperFirst = (str: string) => {
return str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
};
const upperFirst = (str: string) => str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
const { Item } = Form;
const { Option } = Select;
......@@ -60,15 +58,13 @@ class DetailForm extends React.Component<DetailFormProps> {
}, 0);
};
renderEdgeShapeSelect = () => {
return (
renderEdgeShapeSelect = () => (
<Select onChange={this.handleSubmit}>
<Option value="flow-smooth">Smooth</Option>
<Option value="flow-polyline">Polyline</Option>
<Option value="flow-polyline-round">Polyline Round</Option>
</Select>
);
};
renderNodeDetail = () => {
const { form } = this.props;
......
......@@ -4,8 +4,7 @@ import { NodePanel, EdgePanel, GroupPanel, MultiPanel, CanvasPanel, DetailPanel
import DetailForm from './DetailForm';
import styles from './index.less';
const FlowDetailPanel = () => {
return (
const FlowDetailPanel = () => (
<DetailPanel className={styles.detailPanel}>
<NodePanel>
<DetailForm type="node" />
......@@ -24,6 +23,5 @@ const FlowDetailPanel = () => {
</CanvasPanel>
</DetailPanel>
);
};
export default FlowDetailPanel;
......@@ -4,8 +4,7 @@ import { NodePanel, CanvasPanel, DetailPanel } from 'gg-editor';
import DetailForm from './DetailForm';
import styles from './index.less';
const MindDetailPanel = () => {
return (
const MindDetailPanel = () => (
<DetailPanel className={styles.detailPanel}>
<NodePanel>
<DetailForm type="node" />
......@@ -15,6 +14,5 @@ const MindDetailPanel = () => {
</CanvasPanel>
</DetailPanel>
);
};
export default MindDetailPanel;
......@@ -3,8 +3,7 @@ import { Card } from 'antd';
import { ItemPanel, Item } from 'gg-editor';
import styles from './index.less';
const FlowItemPanel = () => {
return (
const FlowItemPanel = () => (
<ItemPanel className={styles.itemPanel}>
<Card bordered={false}>
<Item
......@@ -50,6 +49,5 @@ const FlowItemPanel = () => {
</Card>
</ItemPanel>
);
};
export default FlowItemPanel;
......@@ -3,8 +3,7 @@ import { Card } from 'antd';
import { ItemPanel, Item } from 'gg-editor';
import styles from './index.less';
const KoniItemPanel = () => {
return (
const KoniItemPanel = () => (
<ItemPanel className={styles.itemPanel}>
<Card bordered={false}>
<Item
......@@ -49,6 +48,5 @@ const KoniItemPanel = () => {
</Card>
</ItemPanel>
);
};
export default KoniItemPanel;
......@@ -2,12 +2,10 @@ import React from 'react';
import { Card } from 'antd';
import { Minimap } from 'gg-editor';
const EditorMinimap = () => {
return (
const EditorMinimap = () => (
<Card type="inner" size="small" title="Minimap" bordered={false}>
<Minimap height={200} />
</Card>
);
};
export default EditorMinimap;
......@@ -4,8 +4,7 @@ import { Toolbar } from 'gg-editor';
import ToolbarButton from './ToolbarButton';
import styles from './index.less';
const FlowToolbar = () => {
return (
const FlowToolbar = () => (
<Toolbar className={styles.toolbar}>
<ToolbarButton command="undo" />
<ToolbarButton command="redo" />
......@@ -27,6 +26,5 @@ const FlowToolbar = () => {
<ToolbarButton command="unGroup" icon="ungroup" text="Ungroup" />
</Toolbar>
);
};
export default FlowToolbar;
......@@ -4,8 +4,7 @@ import { Toolbar } from 'gg-editor';
import ToolbarButton from './ToolbarButton';
import styles from './index.less';
const FlowToolbar = () => {
return (
const FlowToolbar = () => (
<Toolbar className={styles.toolbar}>
<ToolbarButton command="undo" />
<ToolbarButton command="redo" />
......@@ -22,6 +21,5 @@ const FlowToolbar = () => {
<ToolbarButton command="expand" text="Unfold" />
</Toolbar>
);
};
export default FlowToolbar;
......@@ -4,9 +4,7 @@ import { Command } from 'gg-editor';
import IconFont from '../../common/IconFont';
import styles from './index.less';
const upperFirst = (str: string) => {
return str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
};
const upperFirst = (str: string) => str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
interface ToolbarButtonProps {
command: string;
......
import React from 'react';
import { Row, Col } from 'antd';
import GGEditor, { Koni } from 'gg-editor';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { formatMessage } from 'umi-plugin-react/locale';
import EditorMinimap from './components/EditorMinimap';
import { KoniContextMenu } from './components/EditorContextMenu';
import { KoniToolbar } from './components/EditorToolbar';
import { KoniItemPanel } from './components/EditorItemPanel';
import { KoniDetailPanel } from './components/EditorDetailPanel';
import styles from './index.less';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { formatMessage } from 'umi-plugin-react/locale';
GGEditor.setTrackable(false);
export default () => {
return (
export default () => (
<PageHeaderWrapper
content={formatMessage({
id: 'BLOCK_NAME.description',
......@@ -42,4 +41,3 @@ export default () => {
</GGEditor>
</PageHeaderWrapper>
);
};
......@@ -7,6 +7,7 @@ flow
```sh
umi block add ant-design-pro/flow
```
## SNAPSHOT
![SNAPSHOT](./snapshot.png)
......
......@@ -3,8 +3,7 @@ import { NodeMenu, EdgeMenu, GroupMenu, MultiMenu, CanvasMenu, ContextMenu } fro
import MenuItem from './MenuItem';
import styles from './index.less';
const FlowContextMenu = () => {
return (
const FlowContextMenu = () => (
<ContextMenu className={styles.contextMenu}>
<NodeMenu>
<MenuItem command="copy" />
......@@ -31,6 +30,5 @@ const FlowContextMenu = () => {
</CanvasMenu>
</ContextMenu>
);
};
export default FlowContextMenu;
......@@ -3,9 +3,7 @@ import { Command } from 'gg-editor';
import IconFont from '../../common/IconFont';
import styles from './index.less';
const upperFirst = (str: string) => {
return str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
};
const upperFirst = (str: string) => str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
interface MenuItemProps {
command: string;
......
......@@ -3,8 +3,7 @@ import { NodeMenu, CanvasMenu, ContextMenu } from 'gg-editor';
import MenuItem from './MenuItem';
import styles from './index.less';
const MindContextMenu = () => {
return (
const MindContextMenu = () => (
<ContextMenu className={styles.contextMenu}>
<NodeMenu>
<MenuItem command="append" text="Topic" />
......@@ -19,6 +18,5 @@ const MindContextMenu = () => {
</CanvasMenu>
</ContextMenu>
);
};
export default MindContextMenu;
......@@ -3,9 +3,7 @@ import { Card, Form, Input, Select } from 'antd';
import { withPropsAPI } from 'gg-editor';
import { FormComponentProps } from 'antd/es/form';
const upperFirst = (str: string) => {
return str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
};
const upperFirst = (str: string) => str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
const { Item } = Form;
const { Option } = Select;
......@@ -60,15 +58,13 @@ class DetailForm extends React.Component<DetailFormProps> {
}, 0);
};
renderEdgeShapeSelect = () => {
return (
renderEdgeShapeSelect = () => (
<Select onChange={this.handleSubmit}>
<Option value="flow-smooth">Smooth</Option>
<Option value="flow-polyline">Polyline</Option>
<Option value="flow-polyline-round">Polyline Round</Option>
</Select>
);
};
renderNodeDetail = () => {
const { form } = this.props;
......
......@@ -4,8 +4,7 @@ import { NodePanel, EdgePanel, GroupPanel, MultiPanel, CanvasPanel, DetailPanel
import DetailForm from './DetailForm';
import styles from './index.less';
const FlowDetailPanel = () => {
return (
const FlowDetailPanel = () => (
<DetailPanel className={styles.detailPanel}>
<NodePanel>
<DetailForm type="node" />
......@@ -24,6 +23,5 @@ const FlowDetailPanel = () => {
</CanvasPanel>
</DetailPanel>
);
};
export default FlowDetailPanel;
......@@ -4,8 +4,7 @@ import { NodePanel, CanvasPanel, DetailPanel } from 'gg-editor';
import DetailForm from './DetailForm';
import styles from './index.less';
const MindDetailPanel = () => {
return (
const MindDetailPanel = () => (
<DetailPanel className={styles.detailPanel}>
<NodePanel>
<DetailForm type="node" />
......@@ -15,6 +14,5 @@ const MindDetailPanel = () => {
</CanvasPanel>
</DetailPanel>
);
};
export default MindDetailPanel;
......@@ -3,8 +3,7 @@ import { Card } from 'antd';
import { ItemPanel, Item } from 'gg-editor';
import styles from './index.less';
const FlowItemPanel = () => {
return (
const FlowItemPanel = () => (
<ItemPanel className={styles.itemPanel}>
<Card bordered={false}>
<Item
......@@ -50,6 +49,5 @@ const FlowItemPanel = () => {
</Card>
</ItemPanel>
);
};
export default FlowItemPanel;
......@@ -3,8 +3,7 @@ import { Card } from 'antd';
import { ItemPanel, Item } from 'gg-editor';
import styles from './index.less';
const KoniItemPanel = () => {
return (
const KoniItemPanel = () => (
<ItemPanel className={styles.itemPanel}>
<Card bordered={false}>
<Item
......@@ -49,6 +48,5 @@ const KoniItemPanel = () => {
</Card>
</ItemPanel>
);
};
export default KoniItemPanel;
......@@ -2,12 +2,10 @@ import React from 'react';
import { Card } from 'antd';
import { Minimap } from 'gg-editor';
const EditorMinimap = () => {
return (
const EditorMinimap = () => (
<Card type="inner" size="small" title="Minimap" bordered={false}>
<Minimap height={200} />
</Card>
);
};
export default EditorMinimap;
......@@ -4,8 +4,7 @@ import { Toolbar } from 'gg-editor';
import ToolbarButton from './ToolbarButton';
import styles from './index.less';
const FlowToolbar = () => {
return (
const FlowToolbar = () => (
<Toolbar className={styles.toolbar}>
<ToolbarButton command="undo" />
<ToolbarButton command="redo" />
......@@ -27,6 +26,5 @@ const FlowToolbar = () => {
<ToolbarButton command="unGroup" icon="ungroup" text="Ungroup" />
</Toolbar>
);
};
export default FlowToolbar;
......@@ -4,8 +4,7 @@ import { Toolbar } from 'gg-editor';
import ToolbarButton from './ToolbarButton';
import styles from './index.less';
const FlowToolbar = () => {
return (
const FlowToolbar = () => (
<Toolbar className={styles.toolbar}>
<ToolbarButton command="undo" />
<ToolbarButton command="redo" />
......@@ -22,6 +21,5 @@ const FlowToolbar = () => {
<ToolbarButton command="expand" text="Unfold" />
</Toolbar>
);
};
export default FlowToolbar;
......@@ -4,9 +4,7 @@ import { Command } from 'gg-editor';
import IconFont from '../../common/IconFont';
import styles from './index.less';
const upperFirst = (str: string) => {
return str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
};
const upperFirst = (str: string) => str.toLowerCase().replace(/( |^)[a-z]/g, (l: string) => l.toUpperCase());
interface ToolbarButtonProps {
command: string;
......
import React from 'react';
import { Row, Col } from 'antd';
import GGEditor, { Mind } from 'gg-editor';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { formatMessage } from 'umi-plugin-react/locale';
import EditorMinimap from './components/EditorMinimap';
import { MindContextMenu } from './components/EditorContextMenu';
import { MindToolbar } from './components/EditorToolbar';
import { MindDetailPanel } from './components/EditorDetailPanel';
import data from './worldCup2018.json';
import styles from './index.less';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { formatMessage } from 'umi-plugin-react/locale';
GGEditor.setTrackable(false);
export default () => {
return (
export default () => (
<PageHeaderWrapper
content={formatMessage({
id: 'BLOCK_NAME.description',
......@@ -39,4 +38,3 @@ export default () => {
</GGEditor>
</PageHeaderWrapper>
);
};
......@@ -2,9 +2,9 @@ import { Button } from 'antd';
import classNames from 'classnames';
import * as H from 'history';
import React, { createElement } from 'react';
import Link from 'umi/link';
import styles from './index.less';
import config from './typeConfig';
import Link from 'umi/link';
export interface ExceptionProps<
L = {
......
......@@ -2,9 +2,9 @@ import { Button } from 'antd';
import classNames from 'classnames';
import * as H from 'history';
import React, { createElement } from 'react';
import Link from 'umi/link';
import styles from './index.less';
import config from './typeConfig';
import Link from 'umi/link';
export interface ExceptionProps<
L = {
......
......@@ -2,9 +2,9 @@ import { Button } from 'antd';
import classNames from 'classnames';
import * as H from 'history';
import React, { createElement } from 'react';
import Link from 'umi/link';
import styles from './index.less';
import config from './typeConfig';
import Link from 'umi/link';
export interface ExceptionProps<
L = {
......
......@@ -13,9 +13,11 @@ class TableForm extends PureComponent {
value: nextProps.value,
};
}
index = 0;
cacheOriginData = {};
columns = [
{
title: '成员姓名',
......@@ -230,6 +232,7 @@ class TableForm extends PureComponent {
this.setState({ data: newData });
this.clickedCancel = false;
}
render() {
const { loading, data } = this.state;
......
......@@ -13,12 +13,12 @@ import {
Popover,
} from 'antd';
import { connect } from 'dva';
import TableForm from './components/TableForm';
import styles from './style.less';
import { FormComponentProps } from 'antd/es/form';
import { Dispatch } from 'redux';
import FooterToolbar from './components/FooterToolbar';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import TableForm from './components/TableForm';
import styles from './style.less';
import FooterToolbar from './components/FooterToolbar';
const { Option } = Select;
const { RangePicker } = DatePicker;
......
import { message } from 'antd';
import { fakeSubmitForm } from './service';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { fakeSubmitForm } from './service';
export interface ModalState {}
......
......@@ -14,9 +14,9 @@ import {
Tooltip,
} from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import styles from './style.less';
import { FormComponentProps } from 'antd/es/form';
import { Dispatch } from 'redux';
import styles from './style.less';
const FormItem = Form.Item;
const { Option } = Select;
......
import { message } from 'antd';
import { fakeSubmitForm } from './service';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { fakeSubmitForm } from './service';
export interface ModalState {}
......
import React, { Fragment } from 'react';
import { connect } from 'dva';
import { Form, Input, Button, Select, Divider } from 'antd';
import styles from './index.less';
import { FormComponentProps } from 'antd/es/form';
import { IStateType } from '../../model';
import { Dispatch } from 'redux';
import styles from './index.less';
import { IStateType } from '../../model';
const { Option } = Select;
......
import React from 'react';
import { connect } from 'dva';
import { Form, Input, Button, Alert, Divider, Statistic } from 'antd';
import styles from './index.less';
import { Form, Input, Button, Alert, Divider } from 'antd';
import { FormComponentProps } from 'antd/es/form';
import { IStateType } from '../../model';
import { Dispatch } from 'redux';
import styles from './index.less';
import { IStateType } from '../../model';
const formItemLayout = {
labelCol: {
......
import React, { Fragment } from 'react';
import { connect } from 'dva';
import { Button, Row, Col } from 'antd';
import { Dispatch } from 'redux';
import Result from '../Result';
import styles from './index.less';
import { IStateType } from '../../model';
import { Dispatch } from 'redux';
interface Step3Props {
data?: IStateType['step'];
......
import { fakeSubmitForm } from './service';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { fakeSubmitForm } from './service';
export interface IStateType {
current?: string;
......
......@@ -56,7 +56,7 @@ function fakeList(count: number): BasicListItemDataType[] {
owner: user[i % 10],
title: titles[i % 8],
avatar: avatars[i % 8],
cover: parseInt(i / 4 + '', 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
cover: parseInt(`${i / 4}`, 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
status: ['active', 'exception', 'normal'][i % 3] as
| 'normal'
| 'exception'
......@@ -100,7 +100,7 @@ function fakeList(count: number): BasicListItemDataType[] {
return list;
}
let sourceData: Array<BasicListItemDataType> = [];
let sourceData: BasicListItemDataType[] = [];
function getFakeList(req: { query: any }, res: { json: (arg0: BasicListItemDataType[]) => void }) {
const params = req.query;
......
......@@ -21,11 +21,11 @@ import {
Select,
} from 'antd';
import { FormComponentProps } from 'antd/es/form';
import { IStateType } from './model';
import { Dispatch } from 'redux';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { IStateType } from './model';
import { BasicListItemDataType } from './data';
import Result from './Result';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import styles from './style.less';
......@@ -69,6 +69,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
labelCol: { span: 7 },
wrapperCol: { span: 13 },
};
addBtn: HTMLButtonElement | undefined | null;
componentDidMount() {
......
import { queryFakeList, removeFakeList, addFakeList, updateFakeList } from './service';
import { BasicListItemDataType } from './data';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { BasicListItemDataType } from './data';
import { queryFakeList, removeFakeList, addFakeList, updateFakeList } from './service';
export interface IStateType {
list: BasicListItemDataType[];
......
......@@ -56,7 +56,7 @@ function fakeList(count: number): CardListItemDataType[] {
owner: user[i % 10],
title: titles[i % 8],
avatar: avatars[i % 8],
cover: parseInt(i / 4 + '', 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
cover: parseInt(`${i / 4}`, 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
status: ['active', 'exception', 'normal'][i % 3] as
| 'normal'
| 'exception'
......
import React, { Component } from 'react';
import { connect } from 'dva';
import { Dispatch } from 'redux';
import { IStateType } from './model';
import { CardListItemDataType } from './data';
import { Card, Button, Typography, Icon, List } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
const { Paragraph } = Typography;
import { IStateType } from './model';
import { CardListItemDataType } from './data';
import styles from './style.less';
const { Paragraph } = Typography;
interface PAGE_NAME_UPPER_CAMEL_CASEProps {
BLOCK_NAME_CAMEL_CASE: IStateType;
dispatch: Dispatch<any>;
......@@ -96,7 +96,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
grid={{ gutter: 24, lg: 3, md: 2, sm: 1, xs: 1 }}
dataSource={[nullData, ...list]}
renderItem={item =>
item && item.id ? (
(item && item.id ? (
<List.Item key={item.id}>
<Card
hoverable
......@@ -120,7 +120,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
<Icon type="plus" /> 新增产品
</Button>
</List.Item>
)
))
}
/>
</div>
......
import { queryFakeList } from './service';
import { CardListItemDataType } from './data';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { CardListItemDataType } from './data';
import { queryFakeList } from './service';
export interface IStateType {
list: CardListItemDataType[];
......
import request from 'umi-request';
export async function queryFakeList(params: { count: number }) {
return request(`/api/fake_list`, {
return request('/api/fake_list', {
params,
});
}
......@@ -55,7 +55,7 @@ function fakeList(count: number): ListItemDataType[] {
owner: user[i % 10],
title: titles[i % 8],
avatar: avatars[i % 8],
cover: parseInt(i / 4 + '', 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
cover: parseInt(`${i / 4}`, 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
status: ['active', 'exception', 'normal'][i % 3] as
| 'normal'
| 'exception'
......
......@@ -27,7 +27,7 @@ export interface TagSelectProps {
};
className?: string;
Option?: TagSelectOptionProps;
children?: React.ReactElement<TagSelectOption> | Array<React.ReactElement<TagSelectOption>>;
children?: React.ReactElement<TagSelectOption> | React.ReactElement<TagSelectOption>[];
}
const TagSelectOption: React.SFC<TagSelectOptionProps> & {
......@@ -58,6 +58,7 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
selectAllText: '全部',
},
};
static Option: TagSelectOption = TagSelectOption;
static getDerivedStateFromProps(nextProps: TagSelectProps) {
......@@ -66,6 +67,7 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
}
return null;
}
constructor(props: TagSelectProps) {
super(props);
this.state = {
......
......@@ -2,12 +2,12 @@ import React, { Component } from 'react';
import numeral from 'numeral';
import { connect } from 'dva';
import { Row, Col, Form, Card, Select, Icon, Avatar, List, Tooltip, Dropdown, Menu } from 'antd';
import { Dispatch } from 'redux';
import { FormComponentProps } from 'antd/es/form';
import TagSelect from './components/TagSelect';
import StandardFormRow from './components/StandardFormRow';
import styles from './style.less';
import { IStateType } from './model';
import { Dispatch } from 'redux';
import { FormComponentProps } from 'antd/es/form';
import { ListItemDataType } from './data';
const { Option } = Select;
......
import { queryFakeList } from './service';
import { ListItemDataType } from './data';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { ListItemDataType } from './data';
import { queryFakeList } from './service';
export interface IStateType {
list: ListItemDataType[];
......
import request from 'umi-request';
import { ListItemDataType } from './data';
export async function queryFakeList(params: ListItemDataType) {
return request(`/api/fake_list`, {
return request('/api/fake_list', {
params,
});
}
......@@ -55,7 +55,7 @@ function fakeList(count: number): ListItemDataType[] {
owner: user[i % 10],
title: titles[i % 8],
avatar: avatars[i % 8],
cover: parseInt(i / 4 + '', 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
cover: parseInt(`${i / 4}`, 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
status: ['active', 'exception', 'normal'][i % 3] as
| 'normal'
| 'exception'
......
......@@ -27,7 +27,7 @@ export interface TagSelectProps {
};
className?: string;
Option?: TagSelectOptionProps;
children?: React.ReactElement<TagSelectOption> | Array<React.ReactElement<TagSelectOption>>;
children?: React.ReactElement<TagSelectOption> | React.ReactElement<TagSelectOption>[];
}
const TagSelectOption: React.SFC<TagSelectOptionProps> & {
......@@ -58,6 +58,7 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
selectAllText: '全部',
},
};
static Option: TagSelectOption = TagSelectOption;
static getDerivedStateFromProps(nextProps: TagSelectProps) {
......@@ -66,6 +67,7 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
}
return null;
}
constructor(props: TagSelectProps) {
super(props);
this.state = {
......
......@@ -2,12 +2,12 @@ import React, { Component } from 'react';
import { connect } from 'dva';
import { Form, Card, Select, List, Tag, Icon, Row, Col, Button } from 'antd';
import { Dispatch } from 'redux';
import { FormComponentProps } from 'antd/es/form';
import TagSelect from './components/TagSelect';
import StandardFormRow from './components/StandardFormRow';
import ArticleListContent from './components/ArticleListContent';
import styles from './style.less';
import { Dispatch } from 'redux';
import { FormComponentProps } from 'antd/es/form';
import { ListItemDataType } from './data';
import { IStateType } from './model';
......
import { queryFakeList } from './service';
import { ListItemDataType } from './data';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { ListItemDataType } from './data';
import { queryFakeList } from './service';
export interface IStateType {
list: ListItemDataType[];
......
......@@ -2,7 +2,7 @@ import request from 'umi-request';
import { ListItemDataType } from './data';
export async function queryFakeList(params: ListItemDataType) {
return request(`/api/fake_list`, {
return request('/api/fake_list', {
params,
});
}
......@@ -55,7 +55,7 @@ function fakeList(count: number): ListItemDataType[] {
owner: user[i % 10],
title: titles[i % 8],
avatar: avatars[i % 8],
cover: parseInt(i / 4 + '', 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
cover: parseInt(`${i / 4}`, 10) % 2 === 0 ? covers[i % 4] : covers[3 - (i % 4)],
status: ['active', 'exception', 'normal'][i % 3] as
| 'normal'
| 'exception'
......
......@@ -19,7 +19,7 @@ export interface AvatarListProps {
maxLength?: number;
excessItemsStyle?: React.CSSProperties;
style?: React.CSSProperties;
children: React.ReactElement<AvatarItemProps> | Array<React.ReactElement<AvatarItemProps>>;
children: React.ReactElement<AvatarItemProps> | React.ReactElement<AvatarItemProps>[];
}
const avatarSizeToClassName = (size?: SizeType) =>
......@@ -54,9 +54,7 @@ const AvatarList: React.SFC<AvatarListProps> & { Item: typeof Item } = ({
}) => {
const numOfChildren = React.Children.count(children);
const numToShow = maxLength >= numOfChildren ? numOfChildren : maxLength;
const childrenArray = React.Children.toArray(children) as Array<
React.ReactElement<AvatarItemProps>
>;
const childrenArray = React.Children.toArray(children) as React.ReactElement<AvatarItemProps>[];
const childrenWithProps = childrenArray.slice(0, numToShow).map(child =>
React.cloneElement(child, {
size,
......
......@@ -27,7 +27,7 @@ export interface TagSelectProps {
};
className?: string;
Option?: TagSelectOptionProps;
children?: React.ReactElement<TagSelectOption> | Array<React.ReactElement<TagSelectOption>>;
children?: React.ReactElement<TagSelectOption> | React.ReactElement<TagSelectOption>[];
}
const TagSelectOption: React.SFC<TagSelectOptionProps> & {
......@@ -58,6 +58,7 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
selectAllText: '全部',
},
};
static Option: TagSelectOption = TagSelectOption;
static getDerivedStateFromProps(nextProps: TagSelectProps) {
......@@ -66,6 +67,7 @@ class TagSelect extends Component<TagSelectProps, TagSelectState> {
}
return null;
}
constructor(props: TagSelectProps) {
super(props);
this.state = {
......
......@@ -2,14 +2,15 @@ import React, { Component } from 'react';
import moment from 'moment';
import { connect } from 'dva';
import { Row, Col, Form, Card, Select, List, Typography } from 'antd';
import { Dispatch } from 'redux';
import { FormComponentProps } from 'antd/es/form';
import StandardFormRow from './components/StandardFormRow';
import TagSelect from './components/TagSelect';
import AvatarList from './components/AvatarList';
import styles from './style.less';
import { IStateType } from './model';
import { Dispatch } from 'redux';
import { FormComponentProps } from 'antd/es/form';
import { ListItemDataType } from './data';
const { Option } = Select;
const FormItem = Form.Item;
const { Paragraph } = Typography;
......
import { queryFakeList } from './service';
import { ListItemDataType } from './data';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { ListItemDataType } from './data';
import { queryFakeList } from './service';
export interface IStateType {
list: ListItemDataType[];
......
import request from 'umi-request';
export async function queryFakeList(params: { count: number }) {
return request(`/api/fake_list`, {
return request('/api/fake_list', {
params,
});
}
......@@ -61,7 +61,7 @@ function getRule(
status.forEach((s: string) => {
filterDataSource = filterDataSource.concat(
dataSource.filter(item => {
if (parseInt(item.status + '', 10) === parseInt(s.split('')[0], 10)) {
if (parseInt(`${item.status}`, 10) === parseInt(s.split('')[0], 10)) {
return true;
}
return false;
......@@ -75,9 +75,9 @@ function getRule(
dataSource = dataSource.filter(data => data.name.indexOf(params.name) > -1);
}
let pageSize: number = 10;
let pageSize = 10;
if (params.pageSize) {
pageSize = parseInt(params.pageSize + '', 0);
pageSize = parseInt(`${params.pageSize}`, 0);
}
const result = {
......
......@@ -9,7 +9,7 @@ type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
export interface StandardTableProps<T> extends Omit<TableProps<T>, 'columns'> {
columns: StandardTableColumnProps[];
data: {
list: Array<TableListItem>;
list: TableListItem[];
pagination: StandardTableProps<TableListItem>['pagination'];
};
selectedRows: TableListItem[];
......@@ -51,6 +51,7 @@ class StandardTable extends Component<StandardTableProps<TableListItem>, Standar
}
return null;
}
constructor(props: StandardTableProps<TableListItem>) {
super(props);
const { columns } = props;
......
import React, { Component } from 'react';
import { Input, Select, Button, DatePicker, Form, Modal, Steps, Radio } from 'antd';
import { TableListItem } from '../data';
import { FormComponentProps } from 'antd/es/form';
import { TableListItem } from '../data';
export type IFormValsType = {
target?: string;
......@@ -34,10 +34,12 @@ class UpdateForm extends Component<UpdateFormProps, UpdateFormState> {
handleUpdateModalVisible: () => {},
values: {},
};
formLayout = {
labelCol: { span: 7 },
wrapperCol: { span: 13 },
};
constructor(props: UpdateFormProps) {
super(props);
......
......@@ -20,14 +20,14 @@ import {
} from 'antd';
import { FormComponentProps } from 'antd/es/form';
import { SorterResult } from 'antd/es/table';
import { Dispatch } from 'redux';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import StandardTable, { StandardTableColumnProps } from './components/StandardTable';
import { TableListItem, TableListParams, TableListPagination } from './data';
import { Dispatch } from 'redux';
import { IStateType } from './model';
import styles from './style.less';
import UpdateForm, { IFormValsType } from './components/UpdateForm';
import CreateForm from './components/CreateForm';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
const FormItem = Form.Item;
const { Option } = Select;
......@@ -50,7 +50,7 @@ interface TableListState {
modalVisible: boolean;
updateModalVisible: boolean;
expandForm: boolean;
selectedRows: Array<TableListItem>;
selectedRows: TableListItem[];
formValues: { [key: string]: string };
stepFormValues: Partial<TableListItem>;
}
......
import { queryRule, removeRule, addRule, updateRule } from './service';
import { TableListDate } from './data';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { TableListDate } from './data';
import { queryRule, removeRule, addRule, updateRule } from './service';
export interface IStateType {
data: TableListDate;
......
......@@ -2,7 +2,7 @@ import request from 'umi-request';
import { TableListParams } from './data';
export async function queryRule(params: TableListParams) {
return request(`/api/rule`, {
return request('/api/rule', {
params,
});
}
......
......@@ -122,13 +122,13 @@ const customDot = (
status: string;
},
) =>
status === 'process' ? (
(status === 'process' ? (
<Popover placement="topLeft" arrowPointAtCenter content={popoverContent}>
{dot}
</Popover>
) : (
dot
);
));
const operationTabList = [
{
......@@ -161,11 +161,11 @@ const columns = [
dataIndex: 'status',
key: 'status',
render: (text: string) =>
text === 'agree' ? (
(text === 'agree' ? (
<Badge status="success" text="成功" />
) : (
<Badge status="error" text="驳回" />
),
)),
},
{
title: '操作时间',
......@@ -225,6 +225,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
onOperationTabChange = (key: string) => {
this.setState({ operationKey: key });
};
setStepDirection = () => {
const { stepDirection } = this.state;
const w = getWindowWidth();
......
import { queryAdvancedProfile } from './service';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { queryAdvancedProfile } from './service';
import { AdvancedProfileData } from './data';
......
......@@ -2,9 +2,9 @@ import React, { Component } from 'react';
import { connect } from 'dva';
import { Card, Badge, Table, Descriptions, Divider } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { Dispatch } from 'redux';
import styles from './style.less';
import { BasicProfileDataType, BasicGood } from './data';
import { Dispatch } from 'redux';
const progressColumns = [
{
......@@ -22,11 +22,11 @@ const progressColumns = [
dataIndex: 'status',
key: 'status',
render: (text: string) =>
text === 'success' ? (
(text === 'success' ? (
<Badge status="success" text="成功" />
) : (
<Badge status="processing" text="进行中" />
),
)),
},
{
title: '操作员ID',
......
import { queryBasicProfile } from './service';
import { BasicGood } from './data';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { BasicGood } from './data';
import { queryBasicProfile } from './service';
export interface IStateType {
basicGoods: BasicGood[];
......
import React, { Fragment } from 'react';
import { formatMessage, FormattedMessage } from 'umi-plugin-react/locale';
import { Button, Row, Col, Icon, Steps, Card } from 'antd';
import Result from './Result';
import { GridContent } from '@ant-design/pro-layout';
import Result from './Result';
import styles from './index.less';
const { Step } = Steps;
......
import React, { Component } from 'react';
import { Form, Input, Button, Row, Col } from 'antd';
import omit from 'omit.js';
import { FormComponentProps } from 'antd/es/form';
import styles from './index.less';
import ItemMap from './map';
import LoginContext, { ILoginContext } from './LoginContext';
import { FormComponentProps } from 'antd/es/form';
type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
......@@ -43,6 +43,7 @@ class WrapFormItem extends Component<LoginItemProps, LoginItemState> {
getCaptchaButtonText: 'captcha',
getCaptchaSecondText: 'second',
};
interval: number | undefined;
constructor(props: LoginItemProps) {
......@@ -51,6 +52,7 @@ class WrapFormItem extends Component<LoginItemProps, LoginItemState> {
count: 0,
};
}
componentDidMount() {
const { updateActive, name = '' } = this.props;
if (updateActive) {
......@@ -77,7 +79,7 @@ class WrapFormItem extends Component<LoginItemProps, LoginItemState> {
getFormItemOptions = ({ onChange, defaultValue, customProps = {}, rules }: LoginItemProps) => {
const options: {
rules?: Array<any>;
rules?: any[];
onChange?: LoginItemProps['onChange'];
initialValue?: LoginItemProps['defaultValue'];
} = {
......@@ -171,8 +173,7 @@ Object.keys(ItemMap).forEach(key => {
const item = ItemMap[key];
LoginItem[key] = (props: LoginItemProps) => (
<LoginContext.Consumer>
{context => {
return (
{context => (
<WrapFormItem
customProps={item.props}
rules={item.rules}
......@@ -181,8 +182,7 @@ Object.keys(ItemMap).forEach(key => {
{...context}
updateActive={context.updateActive}
/>
);
}}
)}
</LoginContext.Consumer>
);
});
......
import React from 'react';
import classNames from 'classnames';
import { Button, Form } from 'antd';
import styles from './index.less';
import { ButtonProps } from 'antd/es/button';
import styles from './index.less';
const FormItem = Form.Item;
interface LoginSubmitProps extends ButtonProps {
......
......@@ -19,10 +19,12 @@ interface LoginTabProps extends TabPaneProps {
class LoginTab extends Component<LoginTabProps> {
uniqueId: string;
constructor(props: LoginTabProps) {
super(props);
this.uniqueId = generateId('login-tab-');
}
componentDidMount() {
const { tabUtil } = this.props;
if (tabUtil) {
......
import React, { Component } from 'react';
import { Form, Tabs } from 'antd';
import classNames from 'classnames';
import { FormComponentProps } from 'antd/es/form';
import LoginItem, { LoginItemType, LoginItemProps } from './LoginItem';
import LoginTab from './LoginTab';
import styles from './index.less';
import LoginContext, { ILoginContext } from './LoginContext';
import { FormComponentProps } from 'antd/es/form';
import LoginSubmit from './LoginSubmit';
export interface LoginProps {
......@@ -21,16 +21,22 @@ export interface LoginProps {
interface LoginState {
tabs?: string[];
type?: string;
active?: { [key: string]: Array<any> };
active?: { [key: string]: any[] };
}
class Login extends Component<LoginProps, LoginState> {
public static Tab = LoginTab;
public static Submit = LoginSubmit;
public static UserName: React.FunctionComponent<LoginItemProps>;
public static Password: React.FunctionComponent<LoginItemProps>;
public static Mobile: React.FunctionComponent<LoginItemProps>;
public static Captcha: React.FunctionComponent<LoginItemProps>;
static defaultProps = {
className: '',
defaultActiveKey: '',
......@@ -150,7 +156,7 @@ class Login extends Component<LoginProps, LoginState> {
}
}
(Object.keys(LoginItem) as Array<keyof LoginItemType>).forEach(item => {
(Object.keys(LoginItem) as (keyof LoginItemType)[]).forEach(item => {
Login[item] = LoginItem[item];
});
......
......@@ -3,12 +3,12 @@ import { connect } from 'dva';
import { formatMessage, FormattedMessage } from 'umi-plugin-react/locale';
import Link from 'umi/link';
import { Checkbox, Alert, Icon } from 'antd';
import LoginComponents from './components/Login';
import styles from './style.less';
import { Dispatch } from 'redux';
import { IStateType } from './model';
import { FormComponentProps } from 'antd/es/form';
import { CheckboxChangeEvent } from 'antd/es/checkbox';
import LoginComponents from './components/Login';
import styles from './style.less';
import { IStateType } from './model';
const { Tab, UserName, Password, Mobile, Captcha, Submit } = LoginComponents;
......@@ -52,11 +52,13 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
type: 'account',
autoLogin: true,
};
loginForm: FormComponentProps['form'] | undefined | null;
onTabChange = (type: string) => {
this.setState({ type });
};
onGetCaptcha = () =>
new Promise((resolve, reject) => {
if (!this.loginForm) {
......
import { routerRedux } from 'dva/router';
import { getPageQuery, setAuthority } from './utils/utils';
import { fakeAccountLogin, getFakeCaptcha } from './service';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { fakeAccountLogin, getFakeCaptcha } from './service';
import { getPageQuery, setAuthority } from './utils/utils';
export interface IStateType {
status?: 'ok' | 'error';
......
......@@ -3,11 +3,11 @@ import { connect } from 'dva';
import { formatMessage, FormattedMessage } from 'umi-plugin-react/locale';
import Link from 'umi/link';
import { Form, Input, message, Button, Select, Row, Col, Popover, Progress } from 'antd';
import styles from './style.less';
import { Dispatch } from 'redux';
import { IStateType } from './model';
import { FormComponentProps } from 'antd/es/form';
import router from 'umi/router';
import { IStateType } from './model';
import styles from './style.less';
const FormItem = Form.Item;
const { Option } = Select;
......@@ -90,6 +90,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
help: '',
prefix: '86',
};
interval: number | undefined;
componentDidUpdate() {
......@@ -109,6 +110,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
componentWillUnmount() {
clearInterval(this.interval);
}
onGetCaptcha = () => {
let count = 59;
this.setState({ count });
......@@ -244,7 +246,7 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends Component<
<FormItem help={help}>
<Popover
getPopupContainer={node =>
node && node.parentNode ? (node.parentNode as HTMLElement) : node
(node && node.parentNode ? (node.parentNode as HTMLElement) : node)
}
content={
<div style={{ padding: '4px 0' }}>
......
import { fakeRegister } from './service';
import { Reducer } from 'redux';
import { Reducer, AnyAction } from 'redux';
import { EffectsCommandMap } from 'dva';
import { AnyAction } from 'redux';
import { fakeRegister } from './service';
export interface IStateType {
status?: 'ok' | 'error';
......
......@@ -12,7 +12,8 @@
},
"dependencies": {
"react": "^16.6.3",
"antd": "^3.16.3"
"antd": "^3.16.3",
"classnames": "^2.2.6"
},
"devDependencies": {
"umi": "^2.6.9",
......@@ -23,4 +24,4 @@
"blockConfig": {
"specVersion": "0.1"
}
}
}
\ No newline at end of file
......@@ -2,9 +2,9 @@ import React from 'react';
import { formatMessage, FormattedMessage } from 'umi-plugin-react/locale';
import { Button } from 'antd';
import Link from 'umi/link';
import { RouteChildrenProps } from 'react-router';
import Result from './Result';
import styles from './style.less';
import { RouteChildrenProps } from 'react-router';
const actions = (
<div className={styles.actions}>
......
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;
/**
* copy to https://github.com/facebook/react/blob/master/scripts/prettier/index.js
* prettier api doc https://prettier.io/docs/en/api.html
*----------*****--------------
* lint file is prettier
*----------*****--------------
*/
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;
files.forEach(file => {
Promise.all([
prettier.resolveConfig(file, {
config: prettierConfigPath,
}),
prettier.getFileInfo(file),
])
.then(resolves => {
const [options, fileInfo] = resolves;
if (fileInfo.ignored) {
return;
}
const input = fs.readFileSync(file, 'utf8');
const withParserOptions = {
...options,
parser: fileInfo.inferredParser,
};
const output = prettier.format(input, withParserOptions);
if (output !== input) {
fs.writeFileSync(file, output, 'utf8');
console.log(chalk.green(`${file} is prettier`));
}
})
.catch(e => {
didError = true;
})
.finally(() => {
if (didError) {
process.exit(1);
}
console.log(chalk.hex('#1890FF')('prettier success!'));
});
});
/**
* copy to https://github.com/facebook/react/blob/master/scripts/prettier/index.js
* prettier api doc https://prettier.io/docs/en/api.html
*----------*****--------------
* prettier all js and all ts.
*----------*****--------------
*/
const prettier = require('prettier');
const fs = require('fs');
const getPrettierFiles = require('./getPrettierFiles');
const prettierConfigPath = require.resolve('../.prettierrc');
const chalk = require('chalk');
let didError = false;
const files = getPrettierFiles();
files.forEach(file => {
const options = prettier.resolveConfig.sync(file, {
config: prettierConfigPath,
});
const fileInfo = prettier.getFileInfo.sync(file);
if (fileInfo.ignored) {
return;
}
try {
const input = fs.readFileSync(file, 'utf8');
const withParserOptions = {
...options,
parser: fileInfo.inferredParser,
};
const output = prettier.format(input, withParserOptions);
if (output !== input) {
fs.writeFileSync(file, output, 'utf8');
console.log(chalk.green(`${file} is prettier`));
}
} catch (e) {
console.log(e);
didError = true;
}
});
if (didError) {
process.exit(1);
}
console.log(chalk.hex('#1890FF')('prettier success!'));
/* eslint-disable eslint-comments/disable-enable-pair */
/* eslint-disable @typescript-eslint/no-var-requires */
/* eslint-disable eslint-comments/no-unlimited-disable */
const { spawn } = require('child_process');
const puppeteer = require('puppeteer');
const { join, dirname } = require('path');
......@@ -22,7 +20,7 @@ let browser;
const startServer = async path => {
let once = false;
return new Promise(resolve => {
env.PAGES_PATH = path + '/src';
env.PAGES_PATH = `${path}/src`;
console.log(path);
const startServer = spawn(/^win/.test(process.platform) ? 'npm.cmd' : 'npm', ['run', 'start'], {
env,
......@@ -44,13 +42,11 @@ const startServer = async path => {
});
};
const autoScroll = page => {
return page.evaluate(() => {
return new Promise((resolve, reject) => {
var totalHeight = 0;
var distance = 100;
const autoScroll = page => page.evaluate(() => new Promise((resolve, reject) => {
let totalHeight = 0;
const distance = 100;
var timer = setInterval(() => {
var scrollHeight = document.body.scrollHeight;
const { scrollHeight } = document.body;
window.scrollBy(0, distance);
totalHeight += distance;
if (totalHeight >= scrollHeight) {
......@@ -58,9 +54,7 @@ const autoScroll = page => {
resolve();
}
}, 100);
});
});
};
}));
const getImage = async (page, path) => {
kill(env.PORT || 8000);
......@@ -119,14 +113,14 @@ getAllFile().then(async dirList => {
const page = await openBrowser();
const loopGetImage = async index => {
try {
console.log('install ' + dirList[index] + ' dependencies');
console.log(`install ${dirList[index]} dependencies`);
await execa('yarn', ['install', `--registry=${registry}`], {
cwd: join(__dirname, '../' + dirList[index]),
cwd: join(__dirname, `../${dirList[index]}`),
});
await getImage(page, dirList[index]);
if (dirList.length > index && dirList[index + 1]) {
console.log('Screenshot ' + dirList[index]);
console.log(`Screenshot ${dirList[index]}`);
return loopGetImage(index + 1);
}
......
......@@ -3,15 +3,13 @@
"scripts": {
"dev": "cross-env PAGES_PATH='ProfileAdvanced/src' umi dev",
"start": "umi dev",
"lint": "npm run lint:ts && npm run lint:style && npm run lint:prettier",
"lint-staged": "lint-staged",
"lint-staged:ts": "tslint",
"lint:fix": "npm run lint:style",
"lint:prettier": "check-prettier write",
"lint:style": "stylelint --syntax less --fix **/**.less ",
"lint:ts": "tslint -p . -c tslint.yml",
"prettier": "node ./_scripts/prettier.js",
"tslint": "npm run tslint:fix"
"lint": "npm run lint:js && npm run lint:style && npm run lint:prettier",
"lint-staged:js": "eslint --ext .js,.jsx,.ts,.tsx",
"lint:fix": "eslint --fix --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./ && npm run lint:style",
"lint:js": "eslint --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./",
"lint:style": "stylelint --fix \"src/**/*.less\" --syntax less",
"prettier": "prettier -c --write **/*"
},
"husky": {
"hooks": {
......@@ -20,11 +18,12 @@
},
"lint-staged": {
"**/*.less": "stylelint --syntax less",
"**/*.{js,ts,tsx,json,jsx,less}": [
"node ./_scripts/lint-prettier.js",
"**/*.{js,jsx,tsx,ts,less,md,json}": [
"prettier --write",
"git add"
],
"**/*.{ts,tsx}": "npm run lint-staged:ts"
"**/*.{js,jsx}": "npm run lint-staged:js",
"**/*.{js,ts,tsx}": "npm run lint-staged:js"
},
"dependencies": {
"@types/react-dom": "^16.8.4",
......@@ -38,7 +37,6 @@
"devDependencies": {
"@types/classnames": "^2.2.7",
"@types/numeral": "^0.0.25",
"babel-eslint": "^10.0.1",
"check-prettier": "^1.0.3",
"cross-port-killer": "^1.1.1",
"execa": "^1.0.0",
......@@ -48,21 +46,13 @@
"lint-staged": "^8.1.0",
"prettier": "1.15.2",
"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",
"eslint": "^5.16.0",
"typescript": "^3.5.1",
"umi": "^2.6.17",
"umi-plugin-block-dev": "^2.1.11",
"umi-plugin-react": "^1.7.6",
"umi-request": "^1.0.0"
"umi-request": "^1.0.0",
"@umijs/fabric": "^1.0.4"
},
"peerDependencies": {
"antd": "^3.17.0"
......@@ -72,4 +62,4 @@
"**/*.less",
"**/*.md"
]
}
}
\ No newline at end of file
......@@ -10,7 +10,7 @@ declare module '*.gif';
declare module '*.bmp';
declare module '*.tiff';
declare var APP_TYPE: string;
let var APP_TYPE: string;
declare module 'react-fittext';
declare module '@antv/data-set';
......
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