From c5fec828f03f1d282deee853daf0ad126e591070 Mon Sep 17 00:00:00 2001 From: Kagol Date: Sun, 12 Dec 2021 18:42:42 +0800 Subject: [PATCH 001/122] Update README.md --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index b04d6e0fb9..9b5d4831a3 100644 --- a/README.md +++ b/README.md @@ -18,6 +18,8 @@ DevUI 官方网站：[https://devui.design](https://devui.design) - ⭐ 参与到开源社区中来 - 🎊 结识一群热爱学习、热爱开源的朋友 +[贡献指南](https://github.com/DevCloudFE/vue-devui/wiki/%E8%B4%A1%E7%8C%AE%E6%8C%87%E5%8D%97) + # 快速开始 ## 1 安装依赖 From 9e0531141d7c43ca3eda60b0df84a094e559ab8a Mon Sep 17 00:00:00 2001 From: Zcating Date: Tue, 14 Dec 2021 10:08:04 +0800 Subject: [PATCH 002/122] =?UTF-8?q?=E3=80=90Button=E3=80=91Add=20new=20sty?= =?UTF-8?q?le,=20'success'=20&=20'warning'=20(#9)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat(button): 添加 "success" 和 "warning" 两种风格 * doc(button): 优化文档，新增按钮展示 --- .../devui/button/src/button-types.ts | 2 +- .../devui-vue/devui/button/src/button.scss | 28 +++++- .../devui-vue/devui/style/theme/_color.scss | 6 ++ .../devui-vue/docs/components/button/index.md | 93 +++++++++++-------- 4 files changed, 86 insertions(+), 43 deletions(-) diff --git a/packages/devui-vue/devui/button/src/button-types.ts b/packages/devui-vue/devui/button/src/button-types.ts index 2c09d2a67a..e0e117e309 100644 --- a/packages/devui-vue/devui/button/src/button-types.ts +++ b/packages/devui-vue/devui/button/src/button-types.ts @@ -1,7 +1,7 @@ import { ExtractPropTypes, PropType } from 'vue'; export type IButtonType = 'button' | 'submit' | 'reset'; -export type IButtonStyle = 'common' | 'primary' | 'text' | 'text-dark' | 'danger'; +export type IButtonStyle = 'common' | 'primary' | 'text' | 'text-dark' | 'danger' | 'success' | 'warning'; export type IButtonPosition = 'left' | 'right' | 'default'; export type IButtonSize = 'lg' | 'md' | 'sm' | 'xs'; diff --git a/packages/devui-vue/devui/button/src/button.scss b/packages/devui-vue/devui/button/src/button.scss index a29c626694..eb1415eb01 100644 --- a/packages/devui-vue/devui/button/src/button.scss +++ b/packages/devui-vue/devui/button/src/button.scss @@ -57,12 +57,12 @@ $devui-btn-normal-config: ( background-color: $devui-contrast ), success: ( - color: $devui-light-text, + color: $devui-dark-text, min-width: $devui-btn-min-width, background-color: $devui-success ), warning: ( - color: $devui-light-text, + color: $devui-dark-text, min-width: $devui-btn-min-width, background-color: $devui-warning ), @@ -170,6 +170,28 @@ $devui-btn-pseudo-config: ( active: ( background-color: $devui-contrast-active ) + ), + success: ( + hover: ( + background-color: $devui-success-hover + ), + focus: ( + background-color: $devui-success-hover + ), + active: ( + background-color: $devui-success-active + ) + ), + warning: ( + hover: ( + background-color: $devui-warning-hover + ), + focus: ( + background-color: $devui-warning-hover + ), + active: ( + background-color: $devui-warning-active + ) ) ); @@ -189,7 +211,7 @@ $devui-btn-pseudo-config: ( } } } - @each $type in text, text-dark, common, stress, primary, danger { + @each $type in text, text-dark, common, stress, primary, danger, success, warning, { &.devui-btn-#{$type} { @each $pseudo, $value in map-get($devui-btn-pseudo-config, $type) { &:#{$pseudo} { diff --git a/packages/devui-vue/devui/style/theme/_color.scss b/packages/devui-vue/devui/style/theme/_color.scss index 3245ca181f..307debe65c 100755 --- a/packages/devui-vue/devui/style/theme/_color.scss +++ b/packages/devui-vue/devui/style/theme/_color.scss @@ -26,8 +26,14 @@ $devui-block: var(--devui-block, #ffffff); // 大面 $devui-area: var(--devui-area, #f8f8f8); // 可折叠区块的背景色（展开区域颜色） $devui-danger: var(--devui-danger, #f66f6a); // 失败、错误、告警 $devui-warning: var(--devui-warning, #fac20a); // 警告、需注意类型提示 +$devui-warning-hover: var(--devui-warning, #fac20a); // 警告、需注意类型提示 +$devui-warning-active: var(--devui-warning, #fac20a); +$devui-warning-active-focus: var(--devui-warning, #fac20a); $devui-waiting: var(--devui-waiting, #9faad7); // 等待中 $devui-success: var(--devui-success, #50d4ab); // 成功、正确 +$devui-success-hover: var(--devui-warning, #50d4ab); // 成功、 +$devui-success-active: var(--devui-warning, #50d4ab); +$devui-success-active-focus: var(--devui-warning, #50d4ab); $devui-info: var(--devui-info, #5e7ce0); // 通知、一般提示、执行中 $devui-initial: var(--devui-initial, #e9edfa); // 初始化、未执行 $devui-unavailable: var(--devui-unavailable, #f5f5f6); // 不可用、禁用状态 diff --git a/packages/devui-vue/docs/components/button/index.md b/packages/devui-vue/docs/components/button/index.md index 23204dabbe..8b8f6edba5 100644 --- a/packages/devui-vue/docs/components/button/index.md +++ b/packages/devui-vue/docs/components/button/index.md @@ -51,6 +51,23 @@ ``` ::: +### 警示按钮 +用于标识系统中的关键操作，例如购买场景。 +:::demo +```vue + +``` +::: + ### 文字按钮 用于标识系统中的关键操作，例如购买场景。 :::demo @@ -112,51 +129,44 @@ :::demo ```vue -``` - -::: - -### 自定义色彩 - -### 通过修改文本颜色来动态改变 - -:::demo - -```vue - -``` - -::: - - -### 应用于其他组件 - -Button 组件 - -:::demo - -```vue - -``` - -::: - -Card 组件 - -:::demo -```vue - - -``` - -::: - - - -### API - -| 参数 | 类型 | 默认 | 说明 | -| :-------------: | :-------: | :---------: | :-------------------------------- | -| color | `string` | `#00000050` | 可选，默认当前文本颜色 | -| initial-opacity | `number` | `0.1` | 可选，初始交互效果透明度大小 | -| final-opacity | `number` | `0.1` | 可选，结束交互效果长按透明度大小 | -| duration | `number` | `0.4s` | 可选，持续时间 | -| easing | `string` | `ease-out` | 可选，缓动动画 | -| delay-time | `number` | `75ms` | 可选，延迟 debouceTime 时间后调用 | -| disabled | `boolean` | `false` | 可选，禁止水波效果 | +# Ripple 水波纹指令 + +`v-ripple` 指令 用于用户动作交互场景, 可以应用于任何块级元素 `注：只能作用于块级元素` + +### 使用 + +:::demo 用户 可以在组件 或者 HTML 元素上任意使用 `v-ripple` 指令 使用基本的 `v-ripple` 指令， `v-ripple` 接收 一个对象 + +```vue + + +``` + +::: + +### 自定义色彩 + +### 通过修改文本颜色来动态改变 + +:::demo + +```vue + +``` + +::: + + +### 应用于其他组件 + +Button 组件 + +:::demo + +```vue + +``` + +::: + +Card 组件 + +:::demo +```vue + + +``` + +::: + + + +### API + +| 参数 | 类型 | 默认 | 说明 | +| :-------------: | :-------: | :---------: | :-------------------------------- | +| color | `string` | `#00000050` | 可选，默认当前文本颜色 | +| initial-opacity | `number` | `0.1` | 可选，初始交互效果透明度大小 | +| final-opacity | `number` | `0.1` | 可选，结束交互效果长按透明度大小 | +| duration | `number` | `0.4s` | 可选，持续时间 | +| easing | `string` | `ease-out` | 可选，缓动动画 | +| delay-time | `number` | `75ms` | 可选，延迟 debouceTime 时间后调用 | +| disabled | `boolean` | `false` | 可选，禁止水波效果 | diff --git a/packages/devui-vue/docs/en-US/components/ripple/index.md b/packages/devui-vue/docs/en-US/components/ripple/index.md index 193770a83f..dfae7982b3 100644 --- a/packages/devui-vue/docs/en-US/components/ripple/index.md +++ b/packages/devui-vue/docs/en-US/components/ripple/index.md @@ -1,221 +1,211 @@ -# RippleDirective - -`v-ripple`The v-ripple directive is used to show action from a user. It can be applied to any block level element.`tips: It can be applied to any block level element.` - -### When to Use - -:::demo User can be use Basic ripple functionality can be enabled just by using v-ripple directive on a component or an HTML element `v-ripple`Basic ripple functionality `v-ripple` Directive `v-ripple` Accept an object - -```vue - - -``` - -::: - -### Custom color - -### Change the ripple color dynamically by changing the text color or the ripple color - -:::demo - -```vue - -``` - -::: - - -### Ripple in components - -### Some components provide the ripple prop that allows you to control the ripple effect. - -Button Component - -:::demo - -```vue - -``` - -::: - -Card Component - -:::demo -```vue - - -``` - -::: - - - -### API - -| 参数 | 类型 | 默认 | 说明 | -| :-------------: | :-------: | :---------: | :---------------------------------------------------------------------------- | -| color | `string` | `#00000050` | Choose Default current text color | -| initial-opacity | `number` | `0.1` | Choose Initial interaction Opacity size | -| final-opacity | `number` | `0.1` | Choose, end the interactive effect and press the Opacity size for a long time | -| duration | `number` | `0.4s` | Choose, duration | -| easing | `string` | `ease-out` | Choose, animation easing | -| delay-time | `number` | `75ms` | Choose, slow animation is delayed after debouceTime time. | -| disabled | `boolean` | `false` | Choose, disabled ripple effect | +# RippleDirective + +`v-ripple`The v-ripple directive is used to show action from a user. It can be applied to any block level element.`tips: It can be applied to any block level element.` + +### When to Use + +:::demo User can be use Basic ripple functionality can be enabled just by using v-ripple directive on a component or an HTML element `v-ripple`Basic ripple functionality `v-ripple` Directive `v-ripple` Accept an object + +```vue + + +``` + +::: + +### Custom color + +### Change the ripple color dynamically by changing the text color or the ripple color + +:::demo + +```vue + +``` + +::: + + +### Ripple in components + +### Some components provide the ripple prop that allows you to control the ripple effect. + +Button Component + +:::demo + +```vue + +``` + +::: + +Card Component + +:::demo +```vue + + +``` + +::: + + + +### API + +| 参数 | 类型 | 默认 | 说明 | +| :-------------: | :-------: | :---------: | :---------------------------------------------------------------------------- | +| color | `string` | `#00000050` | Choose Default current text color | +| initial-opacity | `number` | `0.1` | Choose Initial interaction Opacity size | +| final-opacity | `number` | `0.1` | Choose, end the interactive effect and press the Opacity size for a long time | +| duration | `number` | `0.4s` | Choose, duration | +| easing | `string` | `ease-out` | Choose, animation easing | +| delay-time | `number` | `75ms` | Choose, slow animation is delayed after debouceTime time. | +| disabled | `boolean` | `false` | Choose, disabled ripple effect | From aa094e272f90693627e18f007ecffd69838be74a Mon Sep 17 00:00:00 2001 From: TinsFox <33956589+TinsFox@users.noreply.github.com> Date: Tue, 21 Dec 2021 15:46:35 +0800 Subject: [PATCH 018/122] chore: add Github Action Sync to Gitee (#48) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * chore: add Github Action Sync to Gitee * chore: 增加同步触发的分支`dev` --- .github/workflows/sync-gitee.yml | 20 +++++ CODE_OF_CONDUCT.md | 132 +++++++++++++++++++++++++++++++ CODE_OF_CONDUCT.zh-CN.md | 87 ++++++++++++++++++++ 3 files changed, 239 insertions(+) create mode 100644 .github/workflows/sync-gitee.yml create mode 100644 CODE_OF_CONDUCT.md create mode 100644 CODE_OF_CONDUCT.zh-CN.md diff --git a/.github/workflows/sync-gitee.yml b/.github/workflows/sync-gitee.yml new file mode 100644 index 0000000000..2b725b7ea8 --- /dev/null +++ b/.github/workflows/sync-gitee.yml @@ -0,0 +1,20 @@ +name: Sync to Gitee + +on: + push: + branches: [dev, main, gh-pages] + +jobs: + build: + runs-on: ubuntu-latest + steps: + - name: Sync to Gitee + uses: wearerequired/git-mirror-action@master + env: + # 在 Settings->Secrets 配置 GITEE_RSA_PRIVATE_KEY + SSH_PRIVATE_KEY: ${{ secrets.GITEE_RSA_PRIVATE_KEY }} + with: + # GitHub 源仓库地址 + source-repo: git@github.com:DevCloudFE/vue-devui.git + # Gitee 目标仓库地址 + destination-repo: git@gitee.com:devui/vue-devui.git diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md new file mode 100644 index 0000000000..35b5167093 --- /dev/null +++ b/CODE_OF_CONDUCT.md @@ -0,0 +1,132 @@ +# Contributor Covenant Code of Conduct + +## Our Pledge + +We as members, contributors, and leaders pledge to make participation in our +community a harassment-free experience for everyone, regardless of age, body +size, visible or invisible disability, ethnicity, sex characteristics, gender +identity and expression, level of experience, education, socio-economic status, +nationality, personal appearance, race, caste, color, religion, or sexual +identity and orientation. + +We pledge to act and interact in ways that contribute to an open, welcoming, +diverse, inclusive, and healthy community. + +## Our Standards + +Examples of behavior that contributes to a positive environment for our +community include: + +* Demonstrating empathy and kindness toward other people +* Being respectful of differing opinions, viewpoints, and experiences +* Giving and gracefully accepting constructive feedback +* Accepting responsibility and apologizing to those affected by our mistakes, + and learning from the experience +* Focusing on what is best not just for us as individuals, but for the overall + community + +Examples of unacceptable behavior include: + +* The use of sexualized language or imagery, and sexual attention or advances of + any kind +* Trolling, insulting or derogatory comments, and personal or political attacks +* Public or private harassment +* Publishing others' private information, such as a physical or email address, + without their explicit permission +* Other conduct which could reasonably be considered inappropriate in a + professional setting + +## Enforcement Responsibilities + +Community leaders are responsible for clarifying and enforcing our standards of +acceptable behavior and will take appropriate and fair corrective action in +response to any behavior that they deem inappropriate, threatening, offensive, +or harmful. + +Community leaders have the right and responsibility to remove, edit, or reject +comments, commits, code, wiki edits, issues, and other contributions that are +not aligned to this Code of Conduct, and will communicate reasons for moderation +decisions when appropriate. + +## Scope + +This Code of Conduct applies within all community spaces, and also applies when +an individual is officially representing the community in public spaces. +Examples of representing our community include using an official e-mail address, +posting via an official social media account, or acting as an appointed +representative at an online or offline event. + +## Enforcement + +Instances of abusive, harassing, or otherwise unacceptable behavior may be +reported to the community leaders responsible for enforcement at +[INSERT CONTACT METHOD]. +All complaints will be reviewed and investigated promptly and fairly. + +All community leaders are obligated to respect the privacy and security of the +reporter of any incident. + +## Enforcement Guidelines + +Community leaders will follow these Community Impact Guidelines in determining +the consequences for any action they deem in violation of this Code of Conduct: + +### 1. Correction + +**Community Impact**: Use of inappropriate language or other behavior deemed +unprofessional or unwelcome in the community. + +**Consequence**: A private, written warning from community leaders, providing +clarity around the nature of the violation and an explanation of why the +behavior was inappropriate. A public apology may be requested. + +### 2. Warning + +**Community Impact**: A violation through a single incident or series of +actions. + +**Consequence**: A warning with consequences for continued behavior. No +interaction with the people involved, including unsolicited interaction with +those enforcing the Code of Conduct, for a specified period of time. This +includes avoiding interactions in community spaces as well as external channels +like social media. Violating these terms may lead to a temporary or permanent +ban. + +### 3. Temporary Ban + +**Community Impact**: A serious violation of community standards, including +sustained inappropriate behavior. + +**Consequence**: A temporary ban from any sort of interaction or public +communication with the community for a specified period of time. No public or +private interaction with the people involved, including unsolicited interaction +with those enforcing the Code of Conduct, is allowed during this period. +Violating these terms may lead to a permanent ban. + +### 4. Permanent Ban + +**Community Impact**: Demonstrating a pattern of violation of community +standards, including sustained inappropriate behavior, harassment of an +individual, or aggression toward or disparagement of classes of individuals. + +**Consequence**: A permanent ban from any sort of public interaction within the +community. + +## Attribution + +This Code of Conduct is adapted from the [Contributor Covenant][homepage], +version 2.1, available at +[https://www.contributor-covenant.org/version/2/1/code_of_conduct.html][v2.1]. + +Community Impact Guidelines were inspired by +[Mozilla's code of conduct enforcement ladder][Mozilla CoC]. + +For answers to common questions about this code of conduct, see the FAQ at +[https://www.contributor-covenant.org/faq][FAQ]. Translations are available at +[https://www.contributor-covenant.org/translations][translations]. + +[homepage]: https://www.contributor-covenant.org +[v2.1]: https://www.contributor-covenant.org/version/2/1/code_of_conduct.html +[Mozilla CoC]: https://github.com/mozilla/diversity +[FAQ]: https://www.contributor-covenant.org/faq +[translations]: https://www.contributor-covenant.org/translations diff --git a/CODE_OF_CONDUCT.zh-CN.md b/CODE_OF_CONDUCT.zh-CN.md new file mode 100644 index 0000000000..c2b0fa0cdf --- /dev/null +++ b/CODE_OF_CONDUCT.zh-CN.md @@ -0,0 +1,87 @@ +# 贡献者公约 + +## 我们的承诺 + +身为项目成员、贡献者、负责人，我们保证参与此社区的每个人都不受骚扰，不论其年龄、体型、身体条件、民族、性征、性别认同与表现、经验水平、教育程度、社会地位、国籍、相貌、种族、宗教信仰及性取向如何。 + +我们承诺致力于建设开放、友善、多元、包容、健康的社区环境。 + +## 我们的准则 + +有助于促进本社区积极环境的行为包括但不限于： + +* 与人为善、推己及人 +* 尊重不同的主张、观点和经历 +* 积极提出、耐心接受有益批评 +* 面对过失，承担责任、认真道歉、从中学习 +* 关注社区共同诉求，而非一己私利 + +不当行为包括但不限于： + +* 发布与性有关的言论或图像，以及任何形式的献殷勤或勾引 +* 挑衅行为、侮辱或贬损的言论、人身及政治攻击 +* 公开或私下骚扰 +* 未获明确授权擅自发布他人的资料，如地址、电子邮箱等 +* 其他有理由认定为违反职业操守的不当行为 + +## 落实之义务 + +社区负责人有责任诠释何谓“妥当行为”，并据此准则，妥善公正地认定与处置不当、威胁、冒犯及有害的行为。 + +社区负责人有权利和义务删除、编辑、拒绝违背本公约的评论（comment）、提交（commit）、代码、维基（wiki）编辑、问题（issue）等贡献。如有必要，需告知采取措施之理由。 + +## 适用范围 + +此行为标准适用于本社区全部场合，以及在其他场合代表本社区的个人。 + +代表本社区的情形包括但不限于：使用官方电子邮件与社交平台、作为指定代表参与在线或线下活动。 + +## 贯彻落实 + +如遇滥用、骚扰等不当行为，请通过［在此输入联系方式］向纪律检查委员举报。 +纪委将迅速审议并调查全部投诉。 + +社区全体负责人有义务保密举报者信息。 + +## 指导方针 + +社区负责人将依据下列方案判断并处置违纪行为： + +### 一、督促 + +**社区影响**：用语不当、举止不符合职业道德或不受社区欢迎。 + +**处理意见**：由社区负责人予以非公开的书面警告，阐明违纪事由、解释举止如何不妥。或将要求公开道歉。 + +### 二、警告 + +**社区影响**：一起或多起事件中的违纪行为。 + +**处理意见**：警告继续违纪之后果、违纪者在特定时间内禁止与当事人往来、不得擅自与社区执法者往来，禁令涵盖社区内外、社交网络在内的一切联络。如有违反，可致封禁乃至开除。 + +### 三、封禁 + +**社区影响**：严重违纪行为，包括屡教不改。 + +**处理意见**：违纪者在特定时间内禁止与社区的任何往来或公开联络，禁止任何与当事人公开或私下往来，不得擅自与社区执法者往来。如有违反，可致开除。 + +### 四、开除 + +**社区影响**：典型违纪行为，例如屡教不改、骚扰某个人、敌对或贬低某个群体。 + +**处理意见**：无限期禁止违纪者与项目社区的一切公开往来。 + +## 来源 + +本行为标准改编自[参与者公约][homepage]2.0版，可在此查阅：[https://www.contributor-covenant.org/zh-cn/version/2/0/code_of_conduct.html][v2.0] + +指导方针借鉴自[Mozilla纪检分级][Mozilla CoC]。 + +此行为标准常见问题请洽：[https://www.contributor-covenant.org/faq][FAQ]。 +另有诸译本：[https://www.contributor-covenant.org/translations][translations]。 + +[homepage]:https://www.contributor-covenant.org +[v2.0]: https://www.contributor-covenant.org/version/2/0/code_of_conduct.html +[Mozilla CoC]: https://github.com/mozilla/diversity +[FAQ]: https://www.contributor-covenant.org/faq +[translations]: https://www.contributor-covenant.org/translations From a1be149202bc64319b4e65c96db9a390b582c8fd Mon Sep 17 00:00:00 2001 From: classheadmaster Date: Tue, 21 Dec 2021 15:50:27 +0800 Subject: [PATCH 019/122] fix: del global style pollution in accordion (#47) --- packages/devui-vue/devui/accordion/src/accordion.scss | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/devui-vue/devui/accordion/src/accordion.scss b/packages/devui-vue/devui/accordion/src/accordion.scss index 34a19882a3..4e6f0030d1 100644 --- a/packages/devui-vue/devui/accordion/src/accordion.scss +++ b/packages/devui-vue/devui/accordion/src/accordion.scss @@ -5,10 +5,12 @@ @import '../../style/theme/corner'; @import '../../style/core/animation'; -.devui-accordion-menu ol, ul { - margin: 0 !important; - line-height: 0 !important; - font-size: 12px; +.devui-accordion-menu { + ol, ul{ + margin: 0 !important; + line-height: 0 !important; + font-size: 12px; + } } :host { From 6249ce5c5da66dc372bc5c78996803adafe18e24 Mon Sep 17 00:00:00 2001 From: TinsFox <33956589+TinsFox@users.noreply.github.com> Date: Tue, 21 Dec 2021 15:51:36 +0800 Subject: [PATCH 020/122] chore: update ISSUE_TEMPLATE config (#46) --- .github/ISSUE_TEMPLATE/bug-report.yml | 3 ++- .github/ISSUE_TEMPLATE/config.yml | 5 +++++ .github/ISSUE_TEMPLATE/feature-request.yml | 3 ++- 3 files changed, 9 insertions(+), 2 deletions(-) create mode 100644 .github/ISSUE_TEMPLATE/config.yml diff --git a/.github/ISSUE_TEMPLATE/bug-report.yml b/.github/ISSUE_TEMPLATE/bug-report.yml index d5518cfa16..3320bc3620 100644 --- a/.github/ISSUE_TEMPLATE/bug-report.yml +++ b/.github/ISSUE_TEMPLATE/bug-report.yml @@ -1,5 +1,6 @@ -name: '🐞 Bug report' +name: '🐛 Bug report' description: Create a report to help us improve vue-devui +title: "🐛 [Bug]: " labels: ['bug'] body: - type: markdown diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml new file mode 100644 index 0000000000..f53f178517 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -0,0 +1,5 @@ +blank_issues_enabled: true +contact_links: + - name: Questions or need help + url: https://github.com/DevCloudFE/vue-devui/discussions + about: Add this WeChat(devui-official), we will invite you to the WeChat discussion group later. diff --git a/.github/ISSUE_TEMPLATE/feature-request.yml b/.github/ISSUE_TEMPLATE/feature-request.yml index b55727d7c3..a4a06e6a0a 100644 --- a/.github/ISSUE_TEMPLATE/feature-request.yml +++ b/.github/ISSUE_TEMPLATE/feature-request.yml @@ -1,5 +1,6 @@ -name: '💡 Feature Request' +name: ✨ Feature Request description: Propose new features to vue-devui to improve it. +title: "✨ [Feature]: " labels: ['feature'] body: - type: textarea From 2d8093da2e8128d2cc06635148635a4f757fb443 Mon Sep 17 00:00:00 2001 From: TinsFox <33956589+TinsFox@users.noreply.github.com> Date: Tue, 21 Dec 2021 15:59:29 +0800 Subject: [PATCH 021/122] docs: add doc CONTRIBUTING.md (#45) --- CONTRIBUTING.md | 1 + .../devui-vue/docs/.vitepress/config/nav.ts | 7 +-- packages/devui-vue/docs/CONTRIBUTING.md | 45 +++++++++++++++++++ 3 files changed, 50 insertions(+), 3 deletions(-) create mode 120000 CONTRIBUTING.md create mode 100644 packages/devui-vue/docs/CONTRIBUTING.md diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md new file mode 120000 index 0000000000..6a6d479819 --- /dev/null +++ b/CONTRIBUTING.md @@ -0,0 +1 @@ +packages/devui-vue/docs/CONTRIBUTING.md \ No newline at end of file diff --git a/packages/devui-vue/docs/.vitepress/config/nav.ts b/packages/devui-vue/docs/.vitepress/config/nav.ts index 5453cb438a..78af79d4b5 100644 --- a/packages/devui-vue/docs/.vitepress/config/nav.ts +++ b/packages/devui-vue/docs/.vitepress/config/nav.ts @@ -1,7 +1,8 @@ const nav = [ { text: '组件', link: '/' }, - { text: '版本历程', link: 'https://github.com/DevCloudFE/vue-devui/releases' }, - { text: '设计规范', link: 'https://devui.design/design-cn/start' }, + { text: '贡献指南', link: '/CONTRIBUTING' }, + { text: '更新日志', link: 'https://github.com/DevCloudFE/vue-devui/releases' }, + { text: '设计规范', link: 'https://devui.design/design-cn/start' } ] -export default nav \ No newline at end of file +export default nav diff --git a/packages/devui-vue/docs/CONTRIBUTING.md b/packages/devui-vue/docs/CONTRIBUTING.md new file mode 100644 index 0000000000..2d20ed6322 --- /dev/null +++ b/packages/devui-vue/docs/CONTRIBUTING.md @@ -0,0 +1,45 @@ +# Vue Devui 贡献指南 + +你好！ 我们很高兴你有兴趣为 Vue Devui 做出贡献。 在提交你的贡献之前，请务必花点时间阅读以下指南： + +## 快速上手 + +Vue Devui 使用 `lerna.json` + `yarn` 构建 `monorepo` 仓库，你应该使用 [yarn](https://yarn.bootcss.com/) 包管理器，以确保不会因为包管理器的不同而引发异常 +如果你想参与 `devui-vue` 的开发或者测试： + +1. 点击Github右上角的Fork按钮，将仓库Fork仓库到个人空间 +2. Clone个人空间项目到本地：`git clone git@github.com:username/vue-devui.git` +3. 在 Vue Devui 的根目录下运行`yarn i`, 安装node依赖 +4. 进入 `packages/devui-vue` 目录下，运行 `yarn run dev`，这个脚本将会启动 `vitepress` 和组件库的开发环境下构建 +5. 使用浏览器访问：http://localhost:3000（如遇白屏，请手动刷新页面） + +```bash +# username 为用户名，执行前请替换 +git clone git@github.com:username/vue-devui.git +cd vue-devui +git remote add upstream git@github.com:DevCloudFE/vue-devui.git +yarn i +yarn run dev +# 或者（推荐） +cd packages/devui-vue && yarn run dev +``` + +## 参与贡献 + +Vue Devui 是一个多人合作的开源项目，为了避免多人同时开发同一个组件/功能，请先在 [issues 列表](https://github.com/DevCloudFE/vue-devui/issues) 中选择自己感兴趣的任务，在评论区认领 + +1. 请确保你已经完成快速上手中的步骤，并且正常访问 http://localhost:3000 +2. 创建新分支 `git checkout -b username/feature1`，分支名字建议为`username/feat-xxx`/`username/fix-xxx` +3. 本地编码 +4. 遵循 [Angular Commit Message Format](https://github.com/angular/angular/blob/master/CONTRIBUTING.md#commit) 进行提交（**不符合规范的提交将不会被合并到dev分支**） +5. 提交到远程仓库，也就是Fork 后的仓库，`git push origin branchName` +6. (可选) 同步上游仓库dev分支最新代码，`git pull upstream dev` +7. 打开上游仓库提交[PR](https://github.com/DevCloudFE/vue-devui/pulls) +> 如果涉及新组件或组件的新特性，则需要： +9. 完善组件中英文文档 +10. 完善组件的单元测试 +11. 完成组件[自检清单](https://github.com/DevCloudFE/vue-devui/wiki/%E7%BB%84%E4%BB%B6%E8%87%AA%E6%A3%80%E6%B8%85%E5%8D%95) +12. 仓库管理员进行Code Review，并提出意见 +13. PR 发起人根据意见调整代码（一个分支发起了PR后，后续的commit会自动同步，不需要重新PR） +14. 仓库管理员合并PR +15. 贡献流程结束，感谢你的贡献 From f917743b7bd0a47f5df9c02ba279d30b5e5685aa Mon Sep 17 00:00:00 2001 From: TinsFox <33956589+TinsFox@users.noreply.github.com> Date: Tue, 21 Dec 2021 16:07:38 +0800 Subject: [PATCH 022/122] Add allcontributors reboot to generate list of contributors (#43) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * chore: add all-contributors reboot * docs: update README.md 处理标题级别 --- .all-contributorsrc | 26 ++++++++++++++++++++ README.md | 59 +++++++++++++++++++++++++++++++-------------- package.json | 9 ++++--- yarn.lock | 55 +++++++++++++++++++++++++++++++++++++++--- 4 files changed, 123 insertions(+), 26 deletions(-) create mode 100644 .all-contributorsrc diff --git a/.all-contributorsrc b/.all-contributorsrc new file mode 100644 index 0000000000..d1cae53925 --- /dev/null +++ b/.all-contributorsrc @@ -0,0 +1,26 @@ +{ + "projectName": "vue-devui", + "projectOwner": "DevCloudFE", + "repoType": "github", + "repoHost": "https://github.com", + "files": [ + "README.md" + ], + "imageSize": 100, + "commit": true, + "commitConvention": "gitmoji", + "contributors": [ + { + "login": "kagol", + "name": "Kagol", + "avatar_url": "https://avatars.githubusercontent.com/u/9566362?v=4", + "profile": "https://juejin.cn/user/712139267650141", + "contributions": [ + "maintenance", + "code", + "doc" + ] + } + ], + "contributorsPerLine": 7 +} diff --git a/README.md b/README.md index 9b5d4831a3..dd2bbb3464 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,7 @@

+ +[![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors-) + DevUI Logo @@ -8,7 +11,7 @@ Vue DevUI 是 Vue3 版本的 DevUI 组件库，基于 [https://github.com/devclo DevUI 官方网站：[https://devui.design](https://devui.design) -# 当前状态: Beta +## 当前状态: Beta 该项目还处于孵化和演进阶段，欢迎大家参与到 Vue DevUI 项目的建设中来！🎉🎉 @@ -20,9 +23,9 @@ DevUI 官方网站：[https://devui.design](https://devui.design) [贡献指南](https://github.com/DevCloudFE/vue-devui/wiki/%E8%B4%A1%E7%8C%AE%E6%8C%87%E5%8D%97) -# 快速开始 +## 快速开始 -## 1 安装依赖 +### 1 安装依赖 ``` yarn(推荐) @@ -32,7 +35,7 @@ or npm i ``` -## 2 启动 +### 2 启动 ``` yarn dev(推荐) @@ -42,11 +45,11 @@ or npm run dev ``` -## 3 访问 +### 3 访问 [http://localhost:3000/](http://localhost:3000/) -## 4 生产打包 +### 4 生产打包 ``` yarn build(推荐) @@ -56,15 +59,15 @@ or npm run build ``` -# 使用 Vue DevUI +## 使用 Vue DevUI -## 1. 安装 +### 1. 安装 ``` yarn add vue-devui ``` -## 2. 全量引入 +### 2. 全量引入 在`main.ts`文件中编写以下代码： ``` @@ -81,7 +84,7 @@ createApp(App) .mount('#app') ``` -## 3. 按需引入 +### 3. 按需引入 除了全量引入，我们也支持单个组件按需引入。 @@ -101,7 +104,7 @@ createApp(App) .mount('#app') ``` -## 4. 配置自动按需引入`unplugin-vue-components`（推荐） +### 4. 配置自动按需引入`unplugin-vue-components`（推荐） 配置`unplugin-vue-components`插件可以无需引入Vue DevUI就可以直接按需使用其中的组件，具体使用方式如下： @@ -126,7 +129,7 @@ export default defineConfig({ 配置了以上插件，就可以直接在代码中使用`Vue DevUI`的组件，而无需在`main.ts`文件中引入`Vue DevUI`。 -## 5. 使用 +### 5. 使用 ``` ``` -# 图标库 +## 图标库 图标库推荐使用[DevUI图标库](https://devui.design/icon/ruleResource)，也可以使用第三方图标库，比如：iconfont。 -## 使用DevUI图标库 +### 使用DevUI图标库 -### 安装 +#### 安装 ``` yarn add @devui-design/icons(推荐) @@ -150,7 +153,7 @@ or npm i @devui-design/icons ``` -### 引入 +#### 引入 在`main.ts`文件中，编写以下代码： @@ -158,12 +161,32 @@ npm i @devui-design/icons import '@devui-design/icons/icomoon/devui-icon.css' ``` -### 使用 +#### 使用 ``` ``` -# License +## Contributors ✨ + +Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): + + + + + + + + +

Kagol
🚧 💻 📖
+ + + + + + +This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome! + +## License [MIT](https://github.com/DevCloudFE/vue-devui/blob/dev/LICENSE) diff --git a/package.json b/package.json index f56d4c26b0..03116a9d92 100644 --- a/package.json +++ b/package.json @@ -11,18 +11,19 @@ "stylelint": "stylelint --fix \"{packages}/**/*.{scss,css}\"" }, "devDependencies": { - "lerna": "^4.0.0", - "husky": "^7.0.4", "@ls-lint/ls-lint": "^1.10.0", + "all-contributors-cli": "^6.20.0", "esbuild-register": "^2.6.0", "eslint": "^7.28.0", "eslint-plugin-import": "^2.24.2", "eslint-plugin-vue": "^7.11.1", + "husky": "^7.0.4", + "lerna": "^4.0.0", + "lint-staged": "^11.0.0", "stylelint": "^13.13.1", "stylelint-config-recommended-scss": "^4.3.0", "stylelint-config-standard": "^22.0.0", - "stylelint-scss": "^3.20.1", - "lint-staged": "^11.0.0" + "stylelint-scss": "^3.20.1" }, "workspaces": [ "packages/*" diff --git a/yarn.lock b/yarn.lock index dec2f8c758..6edab38029 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1011,6 +1011,13 @@ dependencies: regenerator-runtime "^0.13.4" +"@babel/runtime@^7.14.6", "@babel/runtime@^7.7.6": + version "7.16.5" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.16.5.tgz#7f3e34bf8bdbbadf03fbb7b1ea0d929569c9487a" + integrity sha512-TXWihFIS3Pyv5hzR7j6ihmeLkZfrXGxAr5UfSl8CHf+6q/wpiYDkUau0czckpYG8QmnCIuPpdLtuA9VmuGGyMA== + dependencies: + regenerator-runtime "^0.13.4" + "@babel/template@^7.0.0", "@babel/template@^7.12.7", "@babel/template@^7.16.0", "@babel/template@^7.3.3": version "7.16.0" resolved "https://registry.npmjs.org/@babel/template/-/template-7.16.0.tgz#d16a35ebf4cd74e202083356fab21dd89363ddd6" @@ -3186,6 +3193,22 @@ algoliasearch@^4.0.0: "@algolia/requester-node-http" "4.11.0" "@algolia/transporter" "4.11.0" +all-contributors-cli@^6.20.0: + version "6.20.0" + resolved "https://registry.yarnpkg.com/all-contributors-cli/-/all-contributors-cli-6.20.0.tgz#9bc98dda38cb29cfe8afc8a78c004e14af25d2f6" + integrity sha512-trEQlL1s1u8FSWSwY2w9uL4GCG7Fo9HIW5rm5LtlE0SQHSolfXQBzJib07Qes5j52/t72wjuE6sEKkuRrwiuuQ== + dependencies: + "@babel/runtime" "^7.7.6" + async "^3.0.1" + chalk "^4.0.0" + didyoumean "^1.2.1" + inquirer "^7.0.4" + json-fixer "^1.5.1" + lodash "^4.11.2" + node-fetch "^2.6.0" + pify "^5.0.0" + yargs "^15.0.1" + ansi-colors@^4.1.1: version "4.1.1" resolved "https://registry.npmjs.org/ansi-colors/-/ansi-colors-4.1.1.tgz#cbb9ae256bf750af1eab344f229aa27fe94ba348" @@ -3352,6 +3375,11 @@ async-validator@^4.0.2: resolved "https://registry.npmjs.org/async-validator/-/async-validator-4.0.7.tgz#034a0fd2103a6b2ebf010da75183bec299247afe" integrity sha512-Pj2IR7u8hmUEDOwB++su6baaRi+QvsgajuFB9j95foM1N2gy5HM4z60hfusIO0fBPG5uLAEl6yCJr1jNSVugEQ== +async@^3.0.1: + version "3.2.2" + resolved "https://registry.yarnpkg.com/async/-/async-3.2.2.tgz#2eb7671034bb2194d45d30e31e24ec7e7f9670cd" + integrity sha512-H0E+qZaDEfx/FY4t7iLRv1W2fFI6+pyCeTw1uN20AQPiwqwM6ojPxHxdLv4z8hi2DtnW9BOckSspLucW7pIE5g== + asynckit@^0.4.0: version "0.4.0" resolved "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79" @@ -4385,6 +4413,11 @@ diacritics@^1.3.0: resolved "https://registry.npmjs.org/diacritics/-/diacritics-1.3.0.tgz#3efa87323ebb863e6696cebb0082d48ff3d6f7a1" integrity sha1-PvqHMj67hj5mls67AILUj/PW96E= +didyoumean@^1.2.1: + version "1.2.2" + resolved "https://registry.yarnpkg.com/didyoumean/-/didyoumean-1.2.2.tgz#989346ffe9e839b4555ecf5666edea0d3e8ad037" + integrity sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw== + diff-sequences@^26.6.2: version "26.6.2" resolved "https://registry.npmjs.org/diff-sequences/-/diff-sequences-26.6.2.tgz#48ba99157de1923412eed41db6b6d4aa9ca7c0b1" @@ -5725,7 +5758,7 @@ init-package-json@^2.0.2: validate-npm-package-license "^3.0.4" validate-npm-package-name "^3.0.0" -inquirer@^7.3.3: +inquirer@^7.0.4, inquirer@^7.3.3: version "7.3.3" resolved "https://registry.npmjs.org/inquirer/-/inquirer-7.3.3.tgz#04d176b2af04afc157a83fd7c100e98ee0aad003" integrity sha512-JG3eIAj5V9CwcGvuOmoo6LB9kbAYT8HXffUl6memuszlwDC/qvFAJw49XJ5NROSFNPxp3iQg1GqkFhaY/CR0IA== @@ -6621,6 +6654,15 @@ jsesc@~0.5.0: resolved "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz#e7dee66e35d6fc16f710fe91d5cf69f70f08911d" integrity sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0= +json-fixer@^1.5.1: + version "1.6.13" + resolved "https://registry.yarnpkg.com/json-fixer/-/json-fixer-1.6.13.tgz#27d2f0e837aec54afbc9ec1cd8c1dd965bf534c9" + integrity sha512-DKQ71M+0uwAG3QsUkeVgh6XREw/OkpnTfHfM+sdmxRjHvYZ8PlcMVF4ibsHQ1ckR63NROs68qUr1I0u6yPVePQ== + dependencies: + "@babel/runtime" "^7.14.6" + chalk "^4.1.2" + pegjs "^0.10.0" + json-parse-better-errors@^1.0.1: version "1.0.2" resolved "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9" @@ -6931,7 +6973,7 @@ lodash.truncate@^4.4.2: resolved "https://registry.npmjs.org/lodash.truncate/-/lodash.truncate-4.4.2.tgz#5a350da0b1113b837ecfffd5812cbe58d6eae193" integrity sha1-WjUNoLERO4N+z//VgSy+WNbq4ZM= -lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.21, lodash@^4.7.0: +lodash@^4.11.2, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.21, lodash@^4.7.0: version "4.17.21" resolved "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c" integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg== @@ -7414,7 +7456,7 @@ neo-async@^2.6.0: resolved "https://registry.npmjs.org/neo-async/-/neo-async-2.6.2.tgz#b4aafb93e3aeb2d8174ca53cf163ab7d7308305f" integrity sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw== -node-fetch@^2.6.1: +node-fetch@^2.6.0, node-fetch@^2.6.1: version "2.6.6" resolved "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.6.tgz#1751a7c01834e8e1697758732e9efb6eeadfaf89" integrity sha512-Z8/6vRlTUChSdIgMa51jxQ4lrw/Jy5SOW10ObaA47/RElsAN2c5Pn8bTgFGWn/ibwzXTE8qwr1Yzx28vsecXEA== @@ -8032,6 +8074,11 @@ path-type@^4.0.0: resolved "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b" integrity sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw== +pegjs@^0.10.0: + version "0.10.0" + resolved "https://registry.yarnpkg.com/pegjs/-/pegjs-0.10.0.tgz#cf8bafae6eddff4b5a7efb185269eaaf4610ddbd" + integrity sha1-z4uvrm7d/0tafvsYUmnqr0YQ3b0= + performance-now@^2.1.0: version "2.1.0" resolved "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b" @@ -10499,7 +10546,7 @@ yargs-parser@^20.2.2, yargs-parser@^20.2.3: resolved "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz#2eb7dc3b0289718fc295f362753845c41a0c94ee" integrity sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w== -yargs@^15.1.0: +yargs@^15.0.1, yargs@^15.1.0: version "15.4.1" resolved "https://registry.npmjs.org/yargs/-/yargs-15.4.1.tgz#0d87a16de01aee9d8bec2bfbf74f67851730f4f8" integrity sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A== From 5a9c23244c160d37a7ff053701f6aa1af802c320 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BA=B3=E6=92=B8=E5=A4=9A?= Date: Tue, 21 Dec 2021 16:13:49 +0800 Subject: [PATCH 023/122] =?UTF-8?q?fix(splitter):=20=E4=BF=AE=E5=A4=8D=20c?= =?UTF-8?q?ollasped=20api=20=E4=B8=8D=E8=B5=B7=E4=BD=9C=E7=94=A8=E7=9A=84?= =?UTF-8?q?=E9=97=AE=E9=A2=98=E3=80=81=E6=B7=BB=E5=8A=A0=E8=8B=B1=E6=96=87?= =?UTF-8?q?=E6=96=87=E6=A1=A3=20(#40)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix(splitter): 修复 collasped api 不起作用的问题, 优化 splitter-bar 代码 * feat(splitter): 添加英文文档 * feat(splitter): 添加展开和收起提示文字 --- .../devui/splitter/src/splitter-bar.tsx | 56 +-- .../devui/splitter/src/splitter-pane.tsx | 6 +- .../docs/en-US/components/splitter/index.md | 324 ++++++++++++++++++ 3 files changed, 360 insertions(+), 26 deletions(-) create mode 100644 packages/devui-vue/docs/en-US/components/splitter/index.md diff --git a/packages/devui-vue/devui/splitter/src/splitter-bar.tsx b/packages/devui-vue/devui/splitter/src/splitter-bar.tsx index f98f9311bb..363a131e33 100644 --- a/packages/devui-vue/devui/splitter/src/splitter-bar.tsx +++ b/packages/devui-vue/devui/splitter/src/splitter-bar.tsx @@ -2,23 +2,27 @@ import { defineComponent, ref, watch, - nextTick, reactive, computed, withDirectives, onMounted, inject, } from 'vue' -import type { SplitterStore } from './splitter-store' + +import DToolTip from '../../tooltip/src/tooltip' import { setStyle } from '../../shared/util/set-style' +import type { SplitterStore } from './splitter-store' import { addClass, removeClass } from '../../shared/util/class' import dresize, { ResizeDirectiveProp } from './util/d-resize-directive' -import './splitter-bar.scss' import { splitterBarProps, SplitterBarProps } from './splitter-bar-type' +import './splitter-bar.scss' export default defineComponent({ name: 'DSplitterBar', props: splitterBarProps, + components: { + DToolTip, + }, setup(props: SplitterBarProps) { const store: SplitterStore = inject('splitterStore') const state = reactive({ @@ -109,8 +113,6 @@ export default defineComponent({ // 计算前面板收起操作样式 const prevClass = computed(() => { const { pane, nearPane } = queryPanes(props.index, props.index + 1) - // TODO 提示文字 - // 第一个面板或者其它面板折叠方向不是向后的， 显示操作按钮 const showIcon = pane?.component?.props?.collapseDirection !== 'after' || @@ -121,8 +123,6 @@ export default defineComponent({ // 计算相邻面板收起操作样式 const nextClass = computed(() => { const { pane, nearPane } = queryPanes(props.index + 1, props.index) - // TODO 提示文字 - // 最后一个面板或者其它面板折叠方向不是向前的显示操作按钮 const showIcon = pane?.component?.props?.collapseDirection !== 'before' || @@ -157,29 +157,41 @@ export default defineComponent({ handleCollapsePrePane(true) handleCollapseNextPane(true) } - + onMounted(() => { initialCollapseStatus() }) + + const renderCollapsedTip = () => { + const { pane, nearPane } = queryPanes(props.index, props.index + 1) + const isCollapsed = + pane?.component?.props?.collapsed || + nearPane?.component?.props?.collapsed + return isCollapsed ? '展开' : '收起' + } return () => { return withDirectives(

- {props.showCollapseButton ? ( -
{ - handleCollapsePrePane() - }} - >
- ) : null} + {props.showCollapseButton && ( + +
{ + handleCollapsePrePane() + }} + >
+ + )}
- {props.showCollapseButton ? ( -
handleCollapseNextPane()} - >
- ) : null} + {props.showCollapseButton && ( + +
handleCollapseNextPane()} + >
+ + )}
, [[dresize, resizeProp]] ) diff --git a/packages/devui-vue/devui/splitter/src/splitter-pane.tsx b/packages/devui-vue/devui/splitter/src/splitter-pane.tsx index 98ee3893e0..89c9e652f4 100644 --- a/packages/devui-vue/devui/splitter/src/splitter-pane.tsx +++ b/packages/devui-vue/devui/splitter/src/splitter-pane.tsx @@ -77,10 +77,8 @@ export default defineComponent({ }; - watch( - () => props.collapsed, - (collapsed: boolean) => { - const ele = domRef.value; + watch([() => props.collapsed, domRef], + ([collapsed, ele]) => { if (!ele) { return; } diff --git a/packages/devui-vue/docs/en-US/components/splitter/index.md b/packages/devui-vue/docs/en-US/components/splitter/index.md new file mode 100644 index 0000000000..e3ce6a3abe --- /dev/null +++ b/packages/devui-vue/docs/en-US/components/splitter/index.md @@ -0,0 +1,324 @@ +# Splitter + +Split page. + +**When To Use** + +When you want to dynamically adjust the size of different page layout areas. + +### Basic Usage + +:::demo + +```vue + + + + + +``` +::: + +### Vertical Layout Usage + +:::demo + +```vue + + + + + +``` + +::: + +### Combination Layout Usage + +:::demo + +```vue + + + + + +``` + +::: + +### Specifies the folding direction + +:::demo + +```vue + + + + + +``` + +::: + +### Collapse and collapse menu 【TODO】 + +### API + +### d-splitter parameters + +| Parameter | Type | Default | Description | Jump to Demo | +| :----------------: | :----------: | :-----------: | :-------------------------------: | :--------------------------------------------- | +| orientation | `'vertical' \| 'horizontal'` | 'horizontal' | Optional. It specifies the split direction of the splitter. The value can be'vertical'\|'horizontal' | [Basic usage](#basic-usage)| +| splitBarSize | `string` | '2px' | Optional. The default value is 2px. | [Basic usage](#basic-usage) | +| disabledBarSize | `string` | '1px' | Optional. This parameter is valid when the unadjustable width is set for the panel. | [Vertical layout usage](#vertical-layout-usage) | +| showCollapseButton | `boolean` | true | Optional. Whether to display the collapse/expand button | [Collapse and collapse menu](#collapse-and-collapse-menu-todo) | + +### d-splitter-pane parameters + +| Parameter | Type | Default | Description | Jump to Demo | +| :---------------: | :--------: | :------: | :---------------------------------------------------: | :------------------------------------ | +| size | `string` | -- | Optional. Specifies the width of the pane and sets the pixel value or percentage. | [Basic usage](#basic-usage) | +| minSize | `string` | -- | Optional. Specifies the minimum width of the pane and sets the pixel value or percentage. | [Basic usage](#basic-usage) | +| maxSize | `string` | -- | Optional. This parameter specifies the maximum width of the pane and sets the pixel value or percentage. | [Basic usage](#basic-usage) | +| resizable | `boolean` | true | Optional. Specifies whether the size of a pane can be adjusted, which affects adjacent panes. | [Vertical layout usage](#vertical-layout-usage) | +| collapsible | `boolean` | false | Optional. Specifies whether the pane can be collapsed or collapsed. | [Basic usage](#basic-usage) | +| collapsed | `boolean` | false | Optional. Specifies whether to collapse the pane during initialization. This parameter is used together with `collapsible`. | [Vertical layout usage](#vertical-layout-usage) | +| collapseDirection | `'before' \| 'after' \| 'both'` | 'both' | Optional. This parameter specifies the folding direction of a non-edge pane. This parameter is used together with `collapsible`. | [Collapse and collapse menu](#collapse-and-collapse-menu-todo) + +### d-splitter-pane event + +| Event | Type | Description | Jump to Demo | +| :----------------: | :---------------------: | :-----------------------------------------: | ------------------------------------- | +| sizeChange | `EventEmitter` | When the size changes, the changed value (pixel value or percentage) is returned. | [Basic usage](#basic-usage) | +| collapsedChange | `EventEmitter` | Whether the current pane is collapsed or expanded. | [Basic usage](#basic-usage) | From c1e3ae1965336fddab6b96ea95e8a0e0f75949ab Mon Sep 17 00:00:00 2001 From: TinsFox <33956589+TinsFox@users.noreply.github.com> Date: Wed, 22 Dec 2021 10:37:34 +0800 Subject: [PATCH 024/122] docs(README): remove unless section (#52) --- README.md | 3 --- 1 file changed, 3 deletions(-) diff --git a/README.md b/README.md index dd2bbb3464..179e5ede61 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,4 @@

- -[![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors-) - DevUI Logo From dd344fc17b6fa19ffc706b9bfbcd0708a914fb86 Mon Sep 17 00:00:00 2001 From: Zcating Date: Wed, 22 Dec 2021 14:30:51 +0800 Subject: [PATCH 025/122] =?UTF-8?q?fix(modal=20&=20button):=20dLoading=20?= =?UTF-8?q?=E9=9C=80=E8=A6=81=E5=8D=95=E7=8B=AC=E5=BC=95=E5=85=A5=20&=20?= =?UTF-8?q?=E9=BB=98=E8=AE=A4=E7=82=B9=E5=87=BB=E8=83=8C=E6=99=AF=E5=8F=AF?= =?UTF-8?q?=E4=BB=A5=20modal=20=E5=85=B3=E9=97=AD=20(#36)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix(modal & button): dLoading 需要单独引入 * fix(modal): modal 默认应该是，点击背景可关闭modal --- packages/devui-vue/devui/button/src/button.tsx | 10 +++++++++- packages/devui-vue/devui/modal/src/dialog-types.ts | 2 +- packages/devui-vue/devui/modal/src/modal-types.ts | 4 ++-- packages/devui-vue/devui/modal/src/modal.tsx | 1 - 4 files changed, 12 insertions(+), 5 deletions(-) diff --git a/packages/devui-vue/devui/button/src/button.tsx b/packages/devui-vue/devui/button/src/button.tsx index 554a99b2a6..a132922eb4 100644 --- a/packages/devui-vue/devui/button/src/button.tsx +++ b/packages/devui-vue/devui/button/src/button.tsx @@ -1,11 +1,15 @@ import { computed, defineComponent, ref } from 'vue'; import { Icon } from '../../icon'; +import loadingDirective from '../../loading/src/directive'; import { buttonProps } from './button-types'; import './button.scss'; export default defineComponent({ name: 'DButton', + directives: { + devLoading: loadingDirective + }, props: buttonProps, setup(props, ctx) { const buttonContent = ref(null); @@ -49,13 +53,17 @@ export default defineComponent({ width } = props; return ( -

+