-
-
Notifications
You must be signed in to change notification settings - Fork 3.8k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* fix: timepicker error border not show #4331 * fix(UploadDragger): fix UploadDrager no export (#4334) * refactor(switch): support customize checked value #4329 (#4332) * refactor(switch): support customize checked value #4329 * test: add test case * refactor: update props name * refactor: update ts * refactor: optimize * style: uncheckedValue to unCheckedValue * test: update snap * feat: udpate switch ts * docs: remove ie11 * fix: tree-select throw error when use slot title * fix: TypeScript definition of Table interface for typescript 4.3.5 (#4353) * fix type for typescript 4.3.5 * Update interface.ts close #4296 * fix: dropdown submenu style error #4351 close #4351 * fix(notification): 完善notification类型 (#4346) * refactor(progress): use composition API (#4355) * refactor(progress): use composition API * refactor(vc-progress): update * refactor: progress * refactor: progress * fix: timepicker error border not show #4331 * fix(UploadDragger): fix UploadDrager no export (#4334) * refactor(switch): support customize checked value #4329 (#4332) * refactor(switch): support customize checked value #4329 * test: add test case * refactor: update props name * refactor: update ts * refactor: optimize * style: uncheckedValue to unCheckedValue * test: update snap * feat: udpate switch ts * docs: remove ie11 * fix: tree-select throw error when use slot title * fix: TypeScript definition of Table interface for typescript 4.3.5 (#4353) * fix type for typescript 4.3.5 * Update interface.ts close #4296 * fix: dropdown submenu style error #4351 close #4351 * fix(notification): 完善notification类型 (#4346) * refactor(progress): use composition API (#4355) * refactor(progress): use composition API * refactor(vc-progress): update * refactor: progress * refactor: progress Co-authored-by: Jarvis <35361626+fanhaoyuan@users.noreply.github.com> Co-authored-by: John <John60676@qq.com> Co-authored-by: 艾斯特洛 <axetroy.dev@gmail.com> Co-authored-by: zanllp <qc@zanllp.cn>
- Loading branch information
1 parent
f7b39e2
commit a770eb3
Showing
50 changed files
with
1,399 additions
and
794 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -440,7 +440,6 @@ | |
|
||
### 兼容性调整 | ||
|
||
- IE 最低支持版本为 IE 11。 | ||
- Vue 最低支持版本为 Vue 3.0。 | ||
|
||
#### 调整的 API | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
102 changes: 51 additions & 51 deletions
102
components/locale-provider/__tests__/__snapshots__/index.test.js.snap
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,74 @@ | ||
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'; | ||
|
||
export type CircleProps = ProgressProps; | ||
|
||
function getPercentage({ percent, success, successPercent }: CircleProps) { | ||
const realSuccessPercent = validProgress(getSuccessPercent({ success, successPercent })); | ||
return [realSuccessPercent, validProgress(validProgress(percent) - realSuccessPercent)]; | ||
} | ||
|
||
export default defineComponent({ | ||
inheritAttrs: false, | ||
props: progressProps(), | ||
setup(props, { slots }) { | ||
const gapDeg = computed(() => { | ||
// Support gapDeg = 0 when type = 'dashboard' | ||
if (props.gapDegree || props.gapDegree === 0) { | ||
return props.gapDegree; | ||
} | ||
if (props.type === 'dashboard') { | ||
return 75; | ||
} | ||
return undefined; | ||
}); | ||
|
||
const circleStyle = computed<CSSProperties>(() => { | ||
const circleSize = props.width || 120; | ||
return { | ||
width: typeof circleSize === 'number' ? `${circleSize}px` : circleSize, | ||
height: typeof circleSize === 'number' ? `${circleSize}px` : circleSize, | ||
fontSize: `${circleSize * 0.15 + 6}px`, | ||
}; | ||
}); | ||
|
||
const circleWidth = computed(() => props.strokeWidth || 6); | ||
const gapPos = computed( | ||
() => props.gapPosition || (props.type === 'dashboard' && 'bottom') || 'top', | ||
); | ||
|
||
// using className to style stroke color | ||
const strokeColor = computed(() => [presetPrimaryColors.green, props.strokeColor || null]); | ||
const percent = computed(() => getPercentage(props)); | ||
const isGradient = computed( | ||
() => Object.prototype.toString.call(props.strokeColor) === '[object Object]', | ||
); | ||
|
||
const wrapperClassName = computed(() => ({ | ||
[`${props.prefixCls}-inner`]: true, | ||
[`${props.prefixCls}-circle-gradient`]: isGradient.value, | ||
})); | ||
|
||
return () => ( | ||
<div class={wrapperClassName.value} style={circleStyle.value}> | ||
<VCCircle | ||
percent={percent.value} | ||
strokeWidth={circleWidth.value} | ||
trailWidth={circleWidth.value} | ||
strokeColor={strokeColor.value} | ||
strokeLinecap={props.strokeLinecap} | ||
trailColor={props.trailColor} | ||
prefixCls={props.prefixCls} | ||
gapDegree={gapDeg.value} | ||
gapPosition={gapPos.value} | ||
/> | ||
{slots.default?.()} | ||
</div> | ||
); | ||
}, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,128 @@ | ||
import type { CSSProperties, ExtractPropTypes, PropType } from 'vue'; | ||
import { computed, defineComponent } from 'vue'; | ||
import type { Direction } from '../config-provider'; | ||
import PropTypes from '../_util/vue-types'; | ||
import type { StringGradients, ProgressGradient } from './props'; | ||
import { progressProps } from './props'; | ||
import { getSuccessPercent, validProgress } from './utils'; | ||
|
||
const lineProps = { | ||
...progressProps(), | ||
prefixCls: PropTypes.string, | ||
direction: { | ||
type: String as PropType<Direction>, | ||
}, | ||
}; | ||
|
||
export type LineProps = Partial<ExtractPropTypes<typeof lineProps>>; | ||
|
||
/** | ||
* { | ||
* '0%': '#afc163', | ||
* '75%': '#009900', | ||
* '50%': 'green', ====> '#afc163 0%, #66FF00 25%, #00CC00 50%, #009900 75%, #ffffff 100%' | ||
* '25%': '#66FF00', | ||
* '100%': '#ffffff' | ||
* } | ||
*/ | ||
export const sortGradient = (gradients: StringGradients) => { | ||
let tempArr = []; | ||
Object.keys(gradients).forEach(key => { | ||
const formattedKey = parseFloat(key.replace(/%/g, '')); | ||
if (!isNaN(formattedKey)) { | ||
tempArr.push({ | ||
key: formattedKey, | ||
value: gradients[key], | ||
}); | ||
} | ||
}); | ||
tempArr = tempArr.sort((a, b) => a.key - b.key); | ||
return tempArr.map(({ key, value }) => `${value} ${key}%`).join(', '); | ||
}; | ||
|
||
/** | ||
* Then this man came to realize the truth: Besides six pence, there is the moon. Besides bread and | ||
* butter, there is the bug. And... Besides women, there is the code. | ||
* | ||
* @example | ||
* { | ||
* "0%": "#afc163", | ||
* "25%": "#66FF00", | ||
* "50%": "#00CC00", // ====> linear-gradient(to right, #afc163 0%, #66FF00 25%, | ||
* "75%": "#009900", // #00CC00 50%, #009900 75%, #ffffff 100%) | ||
* "100%": "#ffffff" | ||
* } | ||
*/ | ||
export const handleGradient = (strokeColor: ProgressGradient, directionConfig: Direction) => { | ||
const { | ||
from = '#1890ff', | ||
to = '#1890ff', | ||
direction = directionConfig === 'rtl' ? 'to left' : 'to right', | ||
...rest | ||
} = strokeColor; | ||
if (Object.keys(rest).length !== 0) { | ||
const sortedGradients = sortGradient(rest as StringGradients); | ||
return { backgroundImage: `linear-gradient(${direction}, ${sortedGradients})` }; | ||
} | ||
return { backgroundImage: `linear-gradient(${direction}, ${from}, ${to})` }; | ||
}; | ||
|
||
export default defineComponent({ | ||
name: 'Line', | ||
props: lineProps, | ||
setup(props, { slots }) { | ||
const backgroundProps = computed(() => { | ||
const { strokeColor, direction } = props; | ||
return strokeColor && typeof strokeColor !== 'string' | ||
? handleGradient(strokeColor, direction) | ||
: { | ||
background: strokeColor, | ||
}; | ||
}); | ||
|
||
const trailStyle = computed(() => | ||
props.trailColor | ||
? { | ||
backgroundColor: props.trailColor, | ||
} | ||
: undefined, | ||
); | ||
|
||
const percentStyle = computed<CSSProperties>(() => { | ||
const { percent, strokeWidth, strokeLinecap, size } = props; | ||
return { | ||
width: `${validProgress(percent)}%`, | ||
height: `${strokeWidth || (size === 'small' ? 6 : 8)}px`, | ||
borderRadius: strokeLinecap === 'square' ? 0 : '', | ||
...(backgroundProps.value as any), | ||
}; | ||
}); | ||
|
||
const successPercent = computed(() => { | ||
return getSuccessPercent(props); | ||
}); | ||
const successPercentStyle = computed<CSSProperties>(() => { | ||
const { strokeWidth, size, strokeLinecap, success } = props; | ||
return { | ||
width: `${validProgress(successPercent.value)}%`, | ||
height: `${strokeWidth || (size === 'small' ? 6 : 8)}px`, | ||
borderRadius: strokeLinecap === 'square' ? 0 : '', | ||
backgroundColor: success?.strokeColor, | ||
}; | ||
}); | ||
|
||
return () => ( | ||
<> | ||
<div class={`${props.prefixCls}-outer`}> | ||
<div class={`${props.prefixCls}-inner`} style={trailStyle.value}> | ||
<div class={`${props.prefixCls}-bg`} style={percentStyle.value} /> | ||
{successPercent.value !== undefined ? ( | ||
<div class={`${props.prefixCls}-success-bg`} style={successPercentStyle.value} /> | ||
) : null} | ||
</div> | ||
</div> | ||
{slots.default?.()} | ||
</> | ||
); | ||
}, | ||
}); |
Oops, something went wrong.