From 425cff9de5e60f3562e038df63b0910a861db70a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=B1=E7=9C=A0=E5=84=80=E5=BC=8F?= <854085467@qq.com>
Date: Fri, 1 Apr 2022 22:03:02 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=20button=20=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=20border-style=20=E5=B1=9E=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 example/docs/zh-CN/components/animation.md    |  2 --
 example/docs/zh-CN/components/avatar.md       |  2 --
 example/docs/zh-CN/components/button.md       | 27 +++++++++++++++++++
 example/docs/zh-CN/components/tree.md         |  2 +-
 example/docs/zh-CN/guide/changelog.md         |  1 +
 src/component/button/index.vue                | 11 +++++++-
 src/component/transition/index.vue            |  4 +--
 .../{ => transitions}/collapseTransition.vue  |  0
 .../{ => transitions}/fadeTransition.vue      |  0
 9 files changed, 41 insertions(+), 8 deletions(-)
 rename src/component/transition/{ => transitions}/collapseTransition.vue (100%)
 rename src/component/transition/{ => transitions}/fadeTransition.vue (100%)

diff --git a/example/docs/zh-CN/components/animation.md b/example/docs/zh-CN/components/animation.md
index b5f9dac0..d921b5aa 100644
--- a/example/docs/zh-CN/components/animation.md
+++ b/example/docs/zh-CN/components/animation.md
@@ -111,7 +111,5 @@ export default {
 
 :::
 
- 
-
 ::: previousNext animation
 :::
\ No newline at end of file
diff --git a/example/docs/zh-CN/components/avatar.md b/example/docs/zh-CN/components/avatar.md
index 622fe4ef..0bb36144 100644
--- a/example/docs/zh-CN/components/avatar.md
+++ b/example/docs/zh-CN/components/avatar.md
@@ -135,7 +135,5 @@ export default {
 
 :::
 
- 
-
 ::: previousNext avatar
 :::
diff --git a/example/docs/zh-CN/components/button.md b/example/docs/zh-CN/components/button.md
index 2d5282a6..5247b07f 100644
--- a/example/docs/zh-CN/components/button.md
+++ b/example/docs/zh-CN/components/button.md
@@ -61,6 +61,33 @@ export default {
 
 :::
 
+::: title 不同边框
+:::
+
+::: demo 使用 `border` 属性设置边框主题
+
+<template>
+  <lay-button border-style="dashed">原始按钮</lay-button>
+  <lay-button border="green" border-style="dashed">默认按钮</lay-button>
+  <lay-button border="blue" border-style="dashed">百搭按钮</lay-button>
+  <lay-button border="orange" border-style="dashed">暖色按钮</lay-button>
+  <lay-button border="red" border-style="dashed">警告按钮</lay-button>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    return {
+    }
+  }
+}
+</script>
+
+:::
+
 ::: title 按钮尺寸
 :::
 
diff --git a/example/docs/zh-CN/components/tree.md b/example/docs/zh-CN/components/tree.md
index 63797573..f11742ff 100644
--- a/example/docs/zh-CN/components/tree.md
+++ b/example/docs/zh-CN/components/tree.md
@@ -238,6 +238,7 @@ function handleClick(node) {
 | onlyIconControl                  | 是否仅允许节点左侧图标控制展开收缩       | false           |
 | showLine                         | 是否开启连接线                           | true            |
 | checkedKeys(v-model:checkedKeys) | 开启 showCheckbox 后, 选中的节点         | []              |
+| collapse-transition              | 是否开启展示收起动画                     | false           |
 
 :::
 
@@ -253,7 +254,6 @@ function handleClick(node) {
 | children            | 子节点         | []              |
 | disabled            | 该节点是否禁用     | false           |
 | spread              | 该节点是否展开     | false           |
-| collapse-transition | 是否开启展示收起动画  | false           |
 
 :::
 
diff --git a/example/docs/zh-CN/guide/changelog.md b/example/docs/zh-CN/guide/changelog.md
index 0f1c99d8..c79b1703 100644
--- a/example/docs/zh-CN/guide/changelog.md
+++ b/example/docs/zh-CN/guide/changelog.md
@@ -19,6 +19,7 @@
           <li>[新增] switch 组件 onswitch-value 属性。</li>
           <li>[新增] switch 组件 unswitch-value 属性。</li>
           <li>[新增] tab 组件 position 属性, 不同方向的选项卡标题。</li>
+          <li>[新增] button 组件 border-style 属性, 可选值 dashed dotted 等。</li>
           <li>[修复] transfer 组件 showSearch 属性类型警告。</li>
           <li>[修复] upload 组件 number 属性必填警告。</li>
           <li>[修复] variable 全局变量重复导入的问题。</li>
diff --git a/src/component/button/index.vue b/src/component/button/index.vue
index e9497370..0e7cbdf5 100644
--- a/src/component/button/index.vue
+++ b/src/component/button/index.vue
@@ -26,6 +26,7 @@ export interface LayButtonProps {
   loading?: BooleanOrString;
   disabled?: BooleanOrString;
   nativeType?: ButtonNativeType;
+  borderStyle: String;
 }
 
 const props = withDefaults(defineProps<LayButtonProps>(), {
@@ -34,6 +35,7 @@ const props = withDefaults(defineProps<LayButtonProps>(), {
   loading: false,
   disabled: false,
   nativeType: "button",
+  borderStyle: "solid"
 });
 
 const emit = defineEmits(["click"]);
@@ -44,6 +46,12 @@ const onClick = (event: any) => {
   }
 };
 
+const styles = computed(() => {
+  return {
+    'border-style': props.borderStyle
+  }
+})
+
 const classes = computed(() => {
   return [
     {
@@ -63,6 +71,7 @@ const classes = computed(() => {
     class="layui-btn"
     :class="classes"
     :type="nativeType"
+    :style="styles"
     @click="onClick"
   >
     <i v-if="prefixIcon" :class="`layui-icon ${prefixIcon}`"></i>
@@ -73,4 +82,4 @@ const classes = computed(() => {
     <slot v-else></slot>
     <i v-if="suffixIcon" :class="`layui-icon ${suffixIcon}`"></i>
   </button>
-</template>
+</template>
\ No newline at end of file
diff --git a/src/component/transition/index.vue b/src/component/transition/index.vue
index 526b14b9..3db66c40 100644
--- a/src/component/transition/index.vue
+++ b/src/component/transition/index.vue
@@ -17,8 +17,8 @@ export default {
 </script>
 
 <script setup lang="ts">
-import LayCollapseTransition from "./collapseTransition.vue";
-import LayFadeTransition from "./fadeTransition.vue";
+import LayCollapseTransition from "./transitions/collapseTransition.vue";
+import LayFadeTransition from "./transitions/fadeTransition.vue";
 
 export interface LayTransitionProps {
   type?: string;
diff --git a/src/component/transition/collapseTransition.vue b/src/component/transition/transitions/collapseTransition.vue
similarity index 100%
rename from src/component/transition/collapseTransition.vue
rename to src/component/transition/transitions/collapseTransition.vue
diff --git a/src/component/transition/fadeTransition.vue b/src/component/transition/transitions/fadeTransition.vue
similarity index 100%
rename from src/component/transition/fadeTransition.vue
rename to src/component/transition/transitions/fadeTransition.vue