chenhaodong / mew-iview

Commit cc27c42a0d4a983831f522d9f3a5b36619b2240f

Authored by 梁灏
1 parent 457fe087

Badge add type prop, close #3425

Showing 4 changed files with 51 additions and 2 deletions   Show diff stats
Inline Side-by-side
examples/routers/badge.vue
  Show/Hide comments   View file @cc27c42
@@ -52,6 +52,29 @@ @@ -52,6 +52,29 @@
52 <a href="//iviewui.com">我是一个链接</a> 52 <a href="//iviewui.com">我是一个链接</a>
53 </Badge> 53 </Badge>
54 </div> 54 </div>
  55 + <div>
  56 + <Badge :count="count" type="primary">
  57 + <a href="#" class="demo-badge"></a>
  58 + </Badge>
  59 + <Badge :count="count" type="success">
  60 + <a href="#" class="demo-badge"></a>
  61 + </Badge>
  62 + <Badge :count="count" type="normal">
  63 + <a href="#" class="demo-badge"></a>
  64 + </Badge>
  65 + <Badge :count="count" type="info">
  66 + <a href="#" class="demo-badge"></a>
  67 + </Badge>
  68 + <Badge :count="count" type="error">
  69 + <a href="#" class="demo-badge"></a>
  70 + </Badge>
  71 + <Badge :count="count" type="warning">
  72 + <a href="#" class="demo-badge"></a>
  73 + </Badge>
  74 + <Badge :count="count">
  75 + <a href="#" class="demo-badge"></a>
  76 + </Badge>
  77 + </div>
55 </div> 78 </div>
56 </template> 79 </template>
57 <script> 80 <script>
src/components/badge/badge.vue
  Show/Hide comments   View file @cc27c42
@@ -42,6 +42,11 @@ @@ -42,6 +42,11 @@
42 return oneOf(value, ['success', 'processing', 'default', 'error', 'warning']); 42 return oneOf(value, ['success', 'processing', 'default', 'error', 'warning']);
43 } 43 }
44 }, 44 },
  45 + type: {
  46 + validator (value) {
  47 + return oneOf(value, ['success', 'primary', 'normal', 'error', 'warning', 'info']);
  48 + }
  49 + },
45 offset: { 50 offset: {
46 type: Array 51 type: Array
47 } 52 }
@@ -58,7 +63,8 @@ @@ -58,7 +63,8 @@
58 `${prefixCls}-count`, 63 `${prefixCls}-count`,
59 { 64 {
60 [`${this.className}`]: !!this.className, 65 [`${this.className}`]: !!this.className,
61 - [`${prefixCls}-count-alone`]: this.alone 66 + [`${prefixCls}-count-alone`]: this.alone,
  67 + [`${prefixCls}-count-${this.type}`]: !!this.type
62 } 68 }
63 ]; 69 ];
64 }, 70 },
src/styles/components/badge.less
  Show/Hide comments   View file @cc27c42
@@ -38,6 +38,26 @@ @@ -38,6 +38,26 @@
38 position: relative; 38 position: relative;
39 transform: translateX(0); 39 transform: translateX(0);
40 } 40 }
  41 +
  42 + &-primary{
  43 + background: @primary-color;
  44 + }
  45 + &-success{
  46 + background: @success-color;
  47 + }
  48 + &-error{
  49 + background: @error-color;
  50 + }
  51 + &-warning{
  52 + background: @warning-color;
  53 + }
  54 + &-info{
  55 + background: @info-color;
  56 + }
  57 + &-normal{
  58 + background: @normal-color;
  59 + color: @subsidiary-color;
  60 + }
41 } 61 }
42 62
43 &-dot { 63 &-dot {
src/styles/custom.less
  Show/Hide comments   View file @cc27c42
@@ -9,7 +9,7 @@ @@ -9,7 +9,7 @@
9 @processing-color : @primary-color; 9 @processing-color : @primary-color;
10 @warning-color : #ff9900; 10 @warning-color : #ff9900;
11 @error-color : #ed3f14; 11 @error-color : #ed3f14;
12 -@normal-color : #d9d9d9; 12 +@normal-color : #e6ebf1;
13 @link-color : #2D8cF0; 13 @link-color : #2D8cF0;
14 @link-hover-color : tint(@link-color, 20%); 14 @link-hover-color : tint(@link-color, 20%);
15 @link-active-color : shade(@link-color, 5%); 15 @link-active-color : shade(@link-color, 5%);