refactor: progress

refactor-progress
tangjinzhou 2021-07-12 17:04:51 +08:00
parent a0d9372f46
commit 25eea2a63b
7 changed files with 16 additions and 19 deletions

View File

@ -1,17 +1,12 @@
import type { CSSProperties, ExtractPropTypes } from 'vue';
import type { CSSProperties } from 'vue';
import { computed, defineComponent } from 'vue';
import { presetPrimaryColors } from '@ant-design/colors';
import { Circle as VCCircle } from '../vc-progress';
import { getSuccessPercent, validProgress } from './utils';
import type { ProgressProps } from './props';
import { progressProps } from './props';
import PropTypes from '../_util/vue-types';
const circleProps = {
...progressProps,
prefixCls: PropTypes.string,
// progressStatus: PropTypes.string,
};
export type CircleProps = Partial<ExtractPropTypes<typeof circleProps>>;
export type CircleProps = ProgressProps;
function getPercentage({ percent, success, successPercent }: CircleProps) {
const realSuccessPercent = validProgress(getSuccessPercent({ success, successPercent }));
@ -19,8 +14,8 @@ function getPercentage({ percent, success, successPercent }: CircleProps) {
}
export default defineComponent({
props: progressProps,
inheritAttrs: false,
props: progressProps(),
setup(props, { slots }) {
const gapDeg = computed(() => {
// Support gapDeg = 0 when type = 'dashboard'

View File

@ -7,7 +7,7 @@ import { progressProps } from './props';
import { getSuccessPercent, validProgress } from './utils';
const lineProps = {
...progressProps,
...progressProps(),
prefixCls: PropTypes.string,
direction: {
type: String as PropType<Direction>,
@ -68,8 +68,8 @@ export const handleGradient = (strokeColor: ProgressGradient, directionConfig: D
};
export default defineComponent({
props: lineProps,
name: 'Line',
props: lineProps,
setup(props, { slots }) {
const backgroundProps = computed(() => {
const { strokeColor, direction } = props;

View File

@ -1,11 +1,12 @@
import { computed, ExtractPropTypes, PropType, VNodeChild } from 'vue';
import type { ExtractPropTypes, PropType, VNodeChild } from 'vue';
import { computed } from 'vue';
import { defineComponent } from 'vue';
import PropTypes from '../_util/vue-types';
import type { ProgressSize } from './props';
import { progressProps } from './props';
const stepsProps = {
...progressProps,
...progressProps(),
steps: PropTypes.number,
size: {
type: String as PropType<ProgressSize>,

View File

@ -15,7 +15,7 @@ import { progressProps, progressStatuses } from './props';
export default defineComponent({
name: 'AProgress',
props: initDefaultProps(progressProps, {
props: initDefaultProps(progressProps(), {
type: 'line',
percent: 0,
showInfo: true,

View File

@ -17,7 +17,7 @@ export interface SuccessProps {
strokeColor?: string;
}
export const progressProps = {
export const progressProps = () => ({
prefixCls: PropTypes.string,
type: PropTypes.oneOf(ProgressType),
percent: PropTypes.number,
@ -41,6 +41,6 @@ export const progressProps = {
steps: PropTypes.number,
/** @deprecated Use `success` instead */
successPercent: PropTypes.number,
};
});
export type ProgressProps = Partial<ExtractPropTypes<typeof progressProps>>;
export type ProgressProps = Partial<ExtractPropTypes<ReturnType<typeof progressProps>>>;

View File

@ -1,5 +1,6 @@
import { useTransitionDuration, defaultProps } from './common';
import { propTypes, GapPositionType } from './types';
import type { GapPositionType } from './types';
import { propTypes } from './types';
import { computed, defineComponent, ref } from 'vue';
import initDefaultProps from '../../_util/props-util/initDefaultProps';
import { useRef } from '../../_util/hooks/useRef';

2
v2-doc

@ -1 +1 @@
Subproject commit d2c096476ee3e8d27fbb9e1cb7933887501b1fab
Subproject commit 57c08127bf0e3e826b03f845df3e1332820964e5