From dddbefaf3f272c8dfcff4b5fc02bc3ccd07bcc43 Mon Sep 17 00:00:00 2001 From: devin974 <1123303669@qq.com> Date: Sat, 22 Jan 2022 23:24:52 +0800 Subject: [PATCH 1/3] =?UTF-8?q?docs:=20=E5=AE=8C=E5=96=84Progress=E6=96=87?= =?UTF-8?q?=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../__tests__/__snapshots__/card.spec.ts.snap | 39 +++++++ packages/devui-vue/devui/progress/index.ts | 2 +- .../devui-vue/devui/progress/src/progress.tsx | 2 +- .../docs/components/progress/index.md | 22 ++-- .../docs/en-US/components/progress/index.md | 103 ++++++++++++++++++ 5 files changed, 156 insertions(+), 12 deletions(-) create mode 100644 packages/devui-vue/devui/card/__tests__/__snapshots__/card.spec.ts.snap create mode 100644 packages/devui-vue/docs/en-US/components/progress/index.md diff --git a/packages/devui-vue/devui/card/__tests__/__snapshots__/card.spec.ts.snap b/packages/devui-vue/devui/card/__tests__/__snapshots__/card.spec.ts.snap new file mode 100644 index 0000000000..76e8d750da --- /dev/null +++ b/packages/devui-vue/devui/card/__tests__/__snapshots__/card.spec.ts.snap @@ -0,0 +1,39 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`card should render correctly 1`] = ` +
+ +
+ +
+
+ +
+
+ +
+
+
+ +
+ +
+
+ +
+
+`; diff --git a/packages/devui-vue/devui/progress/index.ts b/packages/devui-vue/devui/progress/index.ts index 420816c02b..700912363d 100644 --- a/packages/devui-vue/devui/progress/index.ts +++ b/packages/devui-vue/devui/progress/index.ts @@ -1,5 +1,5 @@ import type { App } from 'vue' -import Progress from './src/progress' +import { Progress } from './src/progress' Progress.install = function(app: App) { app.component(Progress.name, Progress) diff --git a/packages/devui-vue/devui/progress/src/progress.tsx b/packages/devui-vue/devui/progress/src/progress.tsx index 2c380bdc03..f558d460b8 100644 --- a/packages/devui-vue/devui/progress/src/progress.tsx +++ b/packages/devui-vue/devui/progress/src/progress.tsx @@ -13,7 +13,7 @@ interface data { strokePath: any } -export default defineComponent({ +export const Progress = defineComponent({ name: 'DProgress', props: { height: { diff --git a/packages/devui-vue/docs/components/progress/index.md b/packages/devui-vue/docs/components/progress/index.md index 893a00372b..d4184bbf80 100644 --- a/packages/devui-vue/docs/components/progress/index.md +++ b/packages/devui-vue/docs/components/progress/index.md @@ -8,19 +8,19 @@ 3. 当需要显示一个操作完成的百分比或已完成的步骤/总步骤时。 ### 基本用法 +基本的进度和文字配置。 - -::: demo 基本的进度和文字配置。 +::: demo ```vue +``` +::: + +### Circle Usage +Basic progress and text configuration. + +::: demo +```vue + + +``` +::: + +### API +#### d-progress parameter +| Parameter | Type | Default | Description | Jump to Demo | +| :---: | :---: | :---: | :---: | :---: | +| percentage | `number` | 0 | Optional. The maximum value of the progress bar is 100. | [Basic Usage](#basic-usage) | +| percentageText | `string` | -- | Optional. Text description of the current value of the progress bar, for example, '30%'\|'4/5' | [Basic Usage](#basic-usage) | +| barBgColor | `string` | #5170ff | Optional. Color of the progress bar. The default value is sky blue. | [Basic Usage](#basic-usage) | +| height | `string` | 20px | Optional. The default value is 20px. | [Basic Usage](#basic-usage) | +| isCircle | `boolean` | false | Optional. Whether the progress bar is displayed in a circle. | [Circle Usage](#circle-usage) | +| strokeWidth | `number` | 6 | Optional. Sets the width of the progress bar. The unit is the percentage of the progress bar to the width of the canvas. | [Circle Usage](#circle-usage) | +| showContent | `boolean` | true | Optional. Sets whether to display content in the circle progress bar. | [Circle Usage](#circle-usage) | From 764ddcda1d2f23be2bfad8e30278b6051a3c7ded Mon Sep 17 00:00:00 2001 From: devin974 <1123303669@qq.com> Date: Sat, 22 Jan 2022 23:29:12 +0800 Subject: [PATCH 2/3] =?UTF-8?q?fix:=20=E5=AE=8C=E5=96=84progress=E5=8D=95?= =?UTF-8?q?=E5=85=83=E6=B5=8B=E8=AF=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../devui/progress/__tests__/progress.spec.ts | 94 +++++++++++-------- 1 file changed, 57 insertions(+), 37 deletions(-) diff --git a/packages/devui-vue/devui/progress/__tests__/progress.spec.ts b/packages/devui-vue/devui/progress/__tests__/progress.spec.ts index 2ade6e88ef..02ebd17849 100644 --- a/packages/devui-vue/devui/progress/__tests__/progress.spec.ts +++ b/packages/devui-vue/devui/progress/__tests__/progress.spec.ts @@ -1,53 +1,73 @@ import { mount } from '@vue/test-utils'; -import Progress from '../progress'; +import { Progress } from '../src/progress'; -describe('d-progress', () => { - it('height', () => { - const wrapper = mount(Progress, { - props: { height: '20px' }, +describe('progress', () => { + describe('progress basic', () => { + const TestComponent = { + components: { + 'd-progress': Progress, + }, + template: ` +
+ +
+ `, + } + const wrapper = mount(TestComponent) + it('Progress demo has created successfully', async () => { + expect(wrapper).toBeTruthy() + }) + }) + + describe('read only', () => { + it('percentage should be rendered correctly', () => { + const wrapper = mount(Progress, { + props: { percentage: 20 }, + }); + expect(wrapper.props().percentage).toBe(20); }); - expect(wrapper.props().height).toBe('20px'); - }); - it('percentage', () => { - const wrapper = mount(Progress, { - props: { percentage: 20 }, + it('percentageText should be rendered correctly', () => { + const wrapper = mount(Progress, { + props: { percentageText: '30%' }, + }); + expect(wrapper.props().percentageText).toBe('30%'); }); - expect(wrapper.props().percentage).toBe(20); - }); - it('percentageText', () => { - const wrapper = mount(Progress, { - props: { percentageText: '30%' }, + it('barbgcolor should be rendered correctly', () => { + const wrapper = mount(Progress, { + props: { barBgColor: '#5170ff' }, + }); + expect(wrapper.props().barBgColor).toBe('#5170ff'); }); - expect(wrapper.props().percentageText).toBe('30%'); - }); - it('barbgcolor', () => { - const wrapper = mount(Progress, { - props: { barbgcolor: '#5170ff' }, + it('height should be rendered correctly', () => { + const wrapper = mount(Progress, { + props: { height: '20px' }, + }); + expect(wrapper.props().height).toBe('20px'); }); - expect(wrapper.props().barbgcolor).toBe('#5170ff'); - }); - it('isCircle', () => { - const wrapper = mount(Progress, { - props: { isCircle: false }, + it('isCircle should be rendered correctly', () => { + const wrapper = mount(Progress, { + props: { isCircle: false }, + }); + expect(wrapper.props().isCircle).toBe(false); }); - expect(wrapper.props().isCircle).toBe(false); - }); - it('strokeWidth', () => { - const wrapper = mount(Progress, { - props: { strokeWidth: 6 }, + it('strokeWidth should be rendered correctly', () => { + const wrapper = mount(Progress, { + props: { strokeWidth: 6 }, + }); + expect(wrapper.props().strokeWidth).toBe(6); }); - expect(wrapper.props().strokeWidth).toBe(6); - }); - it('showContent', () => { - const wrapper = mount(Progress, { - props: { showContent: true }, + it('showContent should be rendered correctly', () => { + const wrapper = mount(Progress, { + props: { showContent: true }, + }); + expect(wrapper.props().showContent).toBe(true); }); - expect(wrapper.props().showContent).toBe(true); - }); + }) }); + From afd1acead7694b4be71e31d23dafa47db26c0686 Mon Sep 17 00:00:00 2001 From: devin974 <1123303669@qq.com> Date: Tue, 15 Feb 2022 15:22:14 +0800 Subject: [PATCH 3/3] =?UTF-8?q?fix:=20=E6=9B=B4=E6=94=B9progress=E7=BB=84?= =?UTF-8?q?=E4=BB=B6=E5=AE=9A=E4=B9=89=E6=96=B9=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/devui-vue/devui/progress/__tests__/progress.spec.ts | 2 +- packages/devui-vue/devui/progress/src/progress.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/devui-vue/devui/progress/__tests__/progress.spec.ts b/packages/devui-vue/devui/progress/__tests__/progress.spec.ts index 02ebd17849..bbba5df871 100644 --- a/packages/devui-vue/devui/progress/__tests__/progress.spec.ts +++ b/packages/devui-vue/devui/progress/__tests__/progress.spec.ts @@ -1,5 +1,5 @@ import { mount } from '@vue/test-utils'; -import { Progress } from '../src/progress'; +import Progress from '../src/progress'; describe('progress', () => { describe('progress basic', () => { diff --git a/packages/devui-vue/devui/progress/src/progress.tsx b/packages/devui-vue/devui/progress/src/progress.tsx index f558d460b8..2c380bdc03 100644 --- a/packages/devui-vue/devui/progress/src/progress.tsx +++ b/packages/devui-vue/devui/progress/src/progress.tsx @@ -13,7 +13,7 @@ interface data { strokePath: any } -export const Progress = defineComponent({ +export default defineComponent({ name: 'DProgress', props: { height: {