bri-components 1.2.2 → 1.2.3

package/src/components/controls/senior/selectUsers/selectUsers.vue

@@ -17,6 +17,7 @@
                 @mouseleave="isHover = false"
                 @click="clickInput"
             >
+                <!-- 有值 -->
                 <template v-if="!$isEmptyData(curValList)">
                     <dsh-tags
                         class="text"
@@ -26,23 +27,26 @@
                         }"
                         @delete="clickDeleteItem"
                     ></dsh-tags>
+                </template>
+                <!-- 无值 -->
+                <template v-else>
+                    {{ emptyShowVal }}
+                </template>
 
+                <!-- 图标 -->
+                <template>
                     <Icon
-                        v-if="selfPropsObj._clearable && isHover"
+                        v-if="!$isEmptyData(curValList) && selfPropsObj._clearable && isHover"
                         class="icon-close"
-                        type="md-close"
+                        type="ios-close-circle"
                         @click.stop="clickClear"
                     />
                     <Icon
                         v-else
                         class="icon-default"
-                        :type="`${multiple ? 'ios-people' : 'ios-person'}`"
+                        :type="inputIcon"
                     />
                 </template>
-
-                <template v-else>
-                    {{ emptyShowVal }}
-                </template>
             </div>
 
             <!-- 查看 -->
@@ -57,9 +61,6 @@
                     v-if="!$isEmptyData(curValList)"
                     class="text"
                     :list="curValList"
-                    :propsObj="{
-                        closable: false
-                    }"
                 ></dsh-tags>
 
                 <template v-else>
@@ -121,9 +122,7 @@
                                             :indeterminate="false"
                                             :value="curCheckAll"
                                             @click.prevent.native="clickCheckAll"
-                                        >
-                                            全选
-                                        </Checkbox>
+                                        >全选</Checkbox>
                                     </div>
 
                                     <!-- 下 列表-->
@@ -182,7 +181,7 @@
                             </span>
                             <Icon
                                 class="list-item-delete"
-                                type="md-close"
+                                type="ios-close-circle"
                                 @click="clickDeleteUserItem(userItem, userIndex, newValList)"
                             />
                         </span>
@@ -293,6 +292,10 @@
             highSearch () {
                 return this.selfPropsObj._highSearch;
             },
+            inputIcon () {
+                return this.multiple ? "ios-people" : "ios-person";
+            },
+
             // 审签单定制需求使用字段
             transmit_type () {
                 return this.selfPropsObj.transmit_type;
@@ -305,7 +308,7 @@
             },
 
             curCheckAll () {
-                return this.userList.every(userItem => this.newValList.find(newItem => newItem._key == userItem._key));
+                return this.userList.every(userItem => this.newValList.find(newItem => newItem._key === userItem._key));
             },
             showVal () {
                 return this.$isEmptyData(this.curValList)

package/src/components/small/BriDrawer.vue

@@ -36,7 +36,7 @@
             v-if="selfPropsObj.closable"
             slot="close"
             class="BriDrawer-close"
-            type="md-close"
+            type="ios-close-circle"
             size="20"
             @click.stop="clickClose"
         />

package/src/components/small/DshDropdown.vue

@@ -4,6 +4,7 @@
         :trigger="trigger"
         :placement="placement"
         :transfer="transfer"
+        transfer-class-name="DshDropdown"
     >
         <slot>
             <Icon

package/src/components/small/DshModal.vue

@@ -41,7 +41,7 @@
         <Icon
             v-if="selfPropsObj.showSlotClose !== false"
             class="DshModal-close"
-            type="md-close"
+            type="ios-close-circle"
             size="20"
             @click.native.stop="visibleChange(false)"
         />

package/src/components/small/DshTags.vue

@@ -17,7 +17,7 @@
             :closable="getItemClosable(tagItem)"
             :checkable="propsObj.checkable"
             :checked="propsObj.checked"
-            :color="propsObj.color || tagItem.color || 'primary'"
+            :color="propsObj.color || tagItem.color || 'default'"
             :fade="propsObj.fade || false"
             :size="propsObj.size || 'medium'"
             @on-close="deleteTag($event, tagItem, tagIndex)"
@@ -63,7 +63,7 @@
                         :fade="propsObj.fade || false"
                         :size="propsObj.size || 'medium'"
                         class="DshTags-poptip-tag"
-                        @on-close="deleteTag($event, tagItem, tagIndex)"
+                        @on-close="deleteTag($event, tagItem, tagIndex + computedList.length)"
                         @on-change="changeChecked"
                     >
                         <slot :tagItem="tagItem">
@@ -105,7 +105,8 @@
                     return this.propsObj.disabled || item._disabled || item.disabled;
                 },
                 getItemClosable (item) {
-                    return this.getItemDisabled(item) ? false : (this.propsObj.closable !== false);
+                    return !this.getItemDisabled(item) &&
+                    (this.propsObj.closable == undefined ? true : this.propsObj.closable);
                 }
             };
         },
@@ -136,7 +137,7 @@
             // 删除标签
             deleteTag (event, item, index) {
                 this.list.splice(index, 1);
-                this.getAutoEllipsis();
+                this.callEliipsis();
                 this.$emit("delete", item, index);
             },
             // 改变标签状态
@@ -144,27 +145,6 @@
 
             },
 
-            getAutoEllipsis () {
-                let parWidth = this.$refs.DshTags.clientWidth;
-                let tags = this.$refs.tagItem;
-
-                for (let idx in tags) {
-                    let el = tags[idx]["$el"];
-                    let showEllipsis = el.clientWidth + el.offsetLeft > parWidth;
-
-                    if (showEllipsis) {
-                        // 判断加上... 是否被隐藏
-                        if (el.clientWidth + el.offsetLeft + 40 < parWidth) {
-                            this.maxTagCount = idx;
-                        } else {
-                            this.maxTagCount = idx - 1;
-                        }
-                        break;
-                    } else {
-                        this.maxTagCount = undefined;
-                    }
-                }
-            },
             callEliipsis () {
                 if (this.autoEllipsis) {
                     this.maxTagCount = undefined;
@@ -172,10 +152,34 @@
                         this.getAutoEllipsis();
                     });
                 }
+            },
+            getAutoEllipsis () {
+                if (this.autoEllipsis) {
+                    let parWidth = this.$refs.DshTags.clientWidth;
+                    let tags = this.$refs.tagItem;
+
+                    for (let idx in tags) {
+                        let el = tags[idx]["$el"];
+                        let showEllipsis = el.clientWidth + el.offsetLeft > parWidth;
+
+                        if (showEllipsis) {
+                            // 判断加上... 是否被隐藏
+                            if (el.clientWidth + el.offsetLeft + 40 < parWidth) {
+                                this.maxTagCount = idx;
+                            } else {
+                                this.maxTagCount = idx - 1;
+                            }
+                            break;
+                        } else {
+                            this.maxTagCount = undefined;
+                        }
+                    }
+                }
             }
         },
         watch: {
             list: function () {
+                console.log("ss");
                 this.callEliipsis();
             }
         },

package/src/styles/common/control.less

@@ -16,8 +16,8 @@
     cursor: pointer;
     color: @textColor;
 
-    &.bri-control-nodata {
-        .bri-control-nodata();
+    .ivu-icon {
+        color: @placeholderColor;
     }
 }
 .bri-control-disabled {
@@ -27,8 +27,12 @@
     cursor: not-allowed;
     color: @textColor;
 
+    .ivu-icon {
+        color: @placeholder-disabled-color;
+    }
+    
     &.bri-control-nodata {
-        .bri-control-disabled-placeholder();
+        color: @placeholder-disabled-color;
     }
 }
 // .bri-control-readonly {
@@ -37,24 +41,28 @@
 //     background: @inputBg-readonly;
 //     cursor: not-allowed;
 //     color: @textColor-readonly;
+    
+//     .ivu-icon {
+//         color: @textColor-readonly;
+//     }
 // }
 .bri-control-show {
     border: none;
     background-color: transparent;
 
-    &.bri-control-nodata {
-        .bri-control-nodata();
+    .ivu-icon {
+        color: @placeholderColor;
     }
 }
 .bri-control-unit {
     border: none;
     background-color: transparent;
 
-    // unit 模式下不用特殊处理颜色
-    &.bri-control-nodata {
-        .bri-control-nodata();
+    .ivu-icon {
+        color: @placeholderColor;
     }
 }
+
 // 无数据
 .bri-control-nodata {
     color: @placeholderColor;
@@ -66,10 +74,10 @@
 
 // 展示为tag标签公共样式
 #bri-control-wrap () {
-    .dsh-flex-row-between-center();
     height: 32px;
-    padding: 4px 0 4px 4px;
+    padding: 4px 0 4px 7px;
     line-height: 24px;
+    .dsh-flex-row-between-center();
 
     .text {
         .dsh-ellipsis();
@@ -83,13 +91,11 @@
     .icon {
         &-default {
             padding: 5px;
-            color: @placeholderColor;
         }
 
         &-close {
             padding: 5px;
             display: none;
-            color: @placeholderColor;
         }
     }
 
@@ -98,8 +104,4 @@
             display: block;
         }
     }
-
-    &.bri-control-nodata {
-        padding-left: 7px;
-    }
 }

package/src/styles/components/controls/base/DshCascader/DshCascader.less

@@ -35,8 +35,11 @@
 
     // 多选类型且独自一行时
     &-row {
-        &-edit,
+        &-edit {
+            // height: 68px;
+        }
         &-show {
+            height: auto;
             .text,
             .overflow {
                 width: 100%;
@@ -46,12 +49,6 @@
                 .bri-scrollbar3();
             }
         }
-        &-edit {
-            height: 68px;
-        }
-        &-show {
-            height: auto;
-        }
     }
 }
 

package/src/styles/components/controls/base/DshCheckbox.less

@@ -14,9 +14,9 @@
                 margin-bottom: 5px;
                 margin-right: 16px;
                 height: 32px;
-                line-height: 32px;
-                border-radius: 4px;
                 border: none;
+                border-radius: 4px;
+                line-height: 32px;
                 color: #FFF;
             }
 
@@ -86,38 +86,29 @@
     .ivu-select-multiple {
         .ivu-select-selection {
             height: 32px;
-    
+            .dsh-flex-row-between-center();
+            
             & > div {
-                overflow-x: auto;
-                overflow-y: hidden;
+                width: 100%;
+                word-break: keep-all;
                 white-space: nowrap;
-    
+
+                overflow: auto;
+                .bri-scrollbar3();
+
                 .ivu-tag {
-                    margin: 2px 4px 4px 0;
-                }
-    
-                &::-webkit-scrollbar {
-                    height: 8px;
-                }
-    
-                &:-webkit-scrollbar-thumb {
-                    border-radius: 3px;
-                    background: rgba(51, 51, 51, .1);
-                    background-clip: border-box;
+                    margin: 2px 4px 0px 0px;
+                    background-color: @borderColor;
                 }
             }
         }
 
-        &.ivu-select-default {
+        &.ivu-select-disabled {
             .ivu-select-selection {
-                height: 32px;
-                overflow: hidden;
-        
                 & > div {
-                    width: 100%;
-                    height: 100%;
-                    .dsh-flex-row-start-center();
-                    flex-wrap: wrap;
+                    .ivu-tag {
+                        background-color: @border-disabled;
+                    }
                 }
             }
         }

package/src/styles/components/small/DshDropdown.less

@@ -52,10 +52,11 @@
             }
         }
     }
+    &.ivu-select-dropdown {
+        border: 0.5px solid #e5e5e5;
+        box-shadow: 0 3px 14px 2px rgba(0,0,0,0.05), 0 8px 10px 1px rgba(0,0,0,0.06), 0 5px 5px -3px rgba(0,0,0,0.1);
+        max-height: 500px;
+    }
 }
 
-.ivu-select-dropdown {
-    border: 0.5px solid #e5e5e5;
-    box-shadow: 0 3px 14px 2px rgba(0,0,0,0.05), 0 8px 10px 1px rgba(0,0,0,0.06), 0 5px 5px -3px rgba(0,0,0,0.1);
-    max-height: 500px;
-}
+

package/src/styles/components/small/DshTags.less

@@ -22,8 +22,8 @@
     }
     &-size-medium {
         height: 24px;
-        line-height: 26px;
         padding: 0 8px;
+        line-height: 26px;
     }
     &[disabled] {
         background-color: @border-disabled;

package/src/styles/variables.less

@@ -40,9 +40,10 @@
 @textColor             : rgba(0, 0, 0, 0.9);
 @contentColor          : rgba(0, 0, 0, 0.6); // 正文颜色
 @titleColor            : @textColor; // title文字颜色
-@placeholderColor      : rgba(0, 0, 0, 0.4);
 @textColor-readonly    : @textColor;
 @textColor-disabled    : rgba(0, 0, 0, 0.26);
+@placeholderColor      : rgba(0, 0, 0, 0.4);
+@placeholder-disabled-color    : rgba(0, 0, 0, 0.26);
 @textWhColor           : rgba(255, 255, 255, 0.9);
 @fontWh2               : rgba(255, 255, 255, 0.55);
 @fontWh3               : rgba(255, 255, 255, 0.35);