bri-components 1.5.22 → 1.6.0

package/src/components/small/DshTags.vue

@@ -1,251 +1,251 @@
-<template>
-    <div
-        ref="DshTags"
-        :class="{
-            'DshTags': true,
-            'DshTags-auto': autoEllipsis
-        }"
-    >
-        <Tag
-            v-for="(tagItem, tagIndex) in computedList"
-            :key="tagIndex"
-            ref="tagItem"
-            :style="tagItem.style"
-            :class="itemClass || tagItem.class"
-            :disabled="getItemDisabled(tagItem)"
-            :name="tagIndex"
-            :type="propsObj.type"
-            :closable="getItemClosable(tagItem)"
-            :checkable="propsObj.checkable"
-            :checked="propsObj.checked"
-            :color="propsObj.color || tagItem.color || 'default'"
-            :fade="propsObj.fade || false"
-            :size="propsObj.size || 'medium'"
-            @click.native="clickTag($event, tagItem, tagIndex)"
-            @on-close="deleteTag($event, tagItem, tagIndex)"
-            @on-change="changeChecked"
-        >
-            <slot :tagItem="tagItem">
-                <Icon
-                    v-if="getItemIcon(tagItem)"
-                    :type="getItemIcon(tagItem)"
-                />
-                {{ getItemName(tagItem) }}
-            </slot>
-        </Tag>
-
-        <!-- 更多 -->
-        <Tag
-            v-if="subList.length"
-            :type="propsObj.type"
-            :checkable="propsObj.checkable"
-            :checked="propsObj.checked"
-            :color="propsObj.color || 'default'"
-            :fade="propsObj.fade || false"
-            :size="propsObj.size || 'medium'"
-            :disabled="propsObj.disabled"
-        >
-            <Poptip
-                :transfer="true"
-                :width="200"
-                trigger="hover"
-                word-wrap
-                placement="bottom"
-                popper-class="DshTags-poptip"
-            >
-                <dsh-icons :list="[{
-                    customIcon: 'bico-gengduo'
-                }]" />
-                {{ subList.length }}项
-
-                <div slot="content">
-                    <Tag
-                        v-for="(tagItem, tagIndex) in subList"
-                        :key="tagIndex"
-                        :disabled="getItemDisabled(tagItem)"
-                        :name="tagIndex"
-                        :type="propsObj.type"
-                        :closable="getItemClosable(tagItem)"
-                        :checkable="propsObj.checkable"
-                        :checked="propsObj.checked"
-                        :color="propsObj.color || 'default'"
-                        :fade="propsObj.fade || false"
-                        :size="propsObj.size || 'medium'"
-                        class="DshTags-poptip-tag"
-                        @on-close="deleteTag($event, tagItem, tagIndex + computedList.length)"
-                        @on-change="changeChecked"
-                    >
-                        <slot :tagItem="tagItem">
-                            <Icon
-                                v-if="getItemIcon(tagItem)"
-                                :type="getItemIcon(tagItem)"
-                            />
-                            {{ getItemName(tagItem) }}
-                        </slot>
-                    </Tag>
-                </div>
-            </Poptip>
-        </Tag>
-    </div>
-</template>
-
-<script>
-    export default {
-        name: "DshTags",
-        props: {
-            list: {
-                type: Array,
-                default () {
-                    return [];
-                }
-            },
-            propsObj: {
-                type: Object,
-                default () {
-                    return {};
-                }
-            },
-            itemClass: {
-                type: String
-            },
-            autoEllipsis: {
-                type: Boolean,
-                default: false
-            }
-        },
-        model: {
-            prop: "list",
-            event: "change"
-        },
-        data () {
-            return {
-                maxTagCount: undefined,
-
-                getItemDisabled (item) {
-                    return !!(this.propsObj.disabled || item._disabled || item.disabled);
-                },
-                getItemClosable (item) {
-                    return this.getItemDisabled(item) === false && this.propsObj.closable;
-                },
-                getItemIcon (item) {
-                    return (
-                        this.$dataType(item) === "object"
-                            ? item.icon || item._icon
-                            : undefined
-                    ) || this.propsObj.icon;
-                },
-                getItemName (item) {
-                    return this.$dataType(item) === "object"
-                        ? item.realname || item.full_name || item.name || item._name || item._id
-                        : item;
-                }
-            };
-        },
-        computed: {
-            computedList () {
-                return this.list.slice(0, this.maxTagCount);
-            },
-            subList () {
-                return this.autoEllipsis && this.maxTagCount
-                    ? this.list.slice(this.maxTagCount)
-                    : [];
-            }
-        },
-        created () {},
-        mounted () {
-            this.callEliipsis();
-
-            window.addEventListener("resize", this.callEliipsis, true);
-        },
-        destroyed () {
-            window.removeEventListener("resize", this.callEliipsis, true);
-        },
-        watch: {
-            list: function () {
-                this.callEliipsis();
-            }
-        },
-        methods: {
-            // 点击标签
-            clickTag (event, item, index) {
-                this.$emit("clickItem", item, index);
-            },
-            // 删除标签
-            deleteTag (event, item, index) {
-                const cb = () => {
-                    this.list.splice(index, 1);
-                    this.callEliipsis();
-                    this.$emit("change", [...this.list]);
-                    this.$emit("delete", item, index);
-                };
-
-                if (this.propsObj.useDeleteTip === true) {
-                    this.$Modal.confirm({
-                        title: "提示",
-                        content: `确定删除"${this.getItemName(item)}"吗？`,
-                        onOk: () => {
-                            cb();
-                        }
-                    });
-                } else {
-                    cb();
-                }
-            },
-            // 改变标签状态
-            changeChecked (checked, name) {
-
-            },
-
-            callEliipsis () {
-                if (this.autoEllipsis) {
-                    this.maxTagCount = undefined;
-                    this.$nextTick(() => {
-                        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;
-                        }
-                    }
-                }
-            }
-        }
-    };
-</script>
-
-<style lang="less">
-    .DshTags {
-        &-auto {
-            overflow: hidden;
-            width: 100%;
-        }
-
-        &-poptip {
-            &-tag {
-                margin: 2px 0;
-                .dsh-flex-row-between-center();
-            }
-            .ivu-tag-text {
-                .dsh-ellipsis();
-            }
-        }
-    }
-</style>
+<template>
+    <div
+        ref="DshTags"
+        :class="{
+            'DshTags': true,
+            'DshTags-auto': autoEllipsis
+        }"
+    >
+        <Tag
+            v-for="(tagItem, tagIndex) in computedList"
+            :key="tagIndex"
+            ref="tagItem"
+            :style="tagItem.style"
+            :class="itemClass || tagItem.class"
+            :disabled="getItemDisabled(tagItem)"
+            :name="tagIndex"
+            :type="propsObj.type"
+            :closable="getItemClosable(tagItem)"
+            :checkable="propsObj.checkable"
+            :checked="propsObj.checked"
+            :color="propsObj.color || tagItem.color || 'default'"
+            :fade="propsObj.fade || false"
+            :size="propsObj.size || 'medium'"
+            @click.native="clickTag($event, tagItem, tagIndex)"
+            @on-close="deleteTag($event, tagItem, tagIndex)"
+            @on-change="changeChecked"
+        >
+            <slot :tagItem="tagItem">
+                <Icon
+                    v-if="getItemIcon(tagItem)"
+                    :type="getItemIcon(tagItem)"
+                />
+                {{ getItemName(tagItem) }}
+            </slot>
+        </Tag>
+
+        <!-- 更多 -->
+        <Tag
+            v-if="subList.length"
+            :type="propsObj.type"
+            :checkable="propsObj.checkable"
+            :checked="propsObj.checked"
+            :color="propsObj.color || 'default'"
+            :fade="propsObj.fade || false"
+            :size="propsObj.size || 'medium'"
+            :disabled="propsObj.disabled"
+        >
+            <Poptip
+                :transfer="true"
+                :width="200"
+                trigger="hover"
+                word-wrap
+                placement="bottom"
+                popper-class="DshTags-poptip"
+            >
+                <dsh-icons :list="[{
+                    customIcon: 'bico-gengduo'
+                }]" />
+                {{ subList.length }}项
+
+                <div slot="content">
+                    <Tag
+                        v-for="(tagItem, tagIndex) in subList"
+                        :key="tagIndex"
+                        :disabled="getItemDisabled(tagItem)"
+                        :name="tagIndex"
+                        :type="propsObj.type"
+                        :closable="getItemClosable(tagItem)"
+                        :checkable="propsObj.checkable"
+                        :checked="propsObj.checked"
+                        :color="propsObj.color || 'default'"
+                        :fade="propsObj.fade || false"
+                        :size="propsObj.size || 'medium'"
+                        class="DshTags-poptip-tag"
+                        @on-close="deleteTag($event, tagItem, tagIndex + computedList.length)"
+                        @on-change="changeChecked"
+                    >
+                        <slot :tagItem="tagItem">
+                            <Icon
+                                v-if="getItemIcon(tagItem)"
+                                :type="getItemIcon(tagItem)"
+                            />
+                            {{ getItemName(tagItem) }}
+                        </slot>
+                    </Tag>
+                </div>
+            </Poptip>
+        </Tag>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: "DshTags",
+        props: {
+            list: {
+                type: Array,
+                default () {
+                    return [];
+                }
+            },
+            propsObj: {
+                type: Object,
+                default () {
+                    return {};
+                }
+            },
+            itemClass: {
+                type: String
+            },
+            autoEllipsis: {
+                type: Boolean,
+                default: false
+            }
+        },
+        model: {
+            prop: "list",
+            event: "change"
+        },
+        data () {
+            return {
+                maxTagCount: undefined,
+
+                getItemDisabled (item) {
+                    return !!(this.propsObj.disabled || item._disabled || item.disabled);
+                },
+                getItemClosable (item) {
+                    return this.getItemDisabled(item) === false && this.propsObj.closable;
+                },
+                getItemIcon (item) {
+                    return (
+                        this.$dataType(item) === "object"
+                            ? item.icon || item._icon
+                            : undefined
+                    ) || this.propsObj.icon;
+                },
+                getItemName (item) {
+                    return this.$dataType(item) === "object"
+                        ? item.realname || item.full_name || item.name || item._name || item._id
+                        : item;
+                }
+            };
+        },
+        computed: {
+            computedList () {
+                return this.list.slice(0, this.maxTagCount);
+            },
+            subList () {
+                return this.autoEllipsis && this.maxTagCount
+                    ? this.list.slice(this.maxTagCount)
+                    : [];
+            }
+        },
+        created () {},
+        mounted () {
+            this.callEliipsis();
+
+            window.addEventListener("resize", this.callEliipsis, true);
+        },
+        destroyed () {
+            window.removeEventListener("resize", this.callEliipsis, true);
+        },
+        watch: {
+            list: function () {
+                this.callEliipsis();
+            }
+        },
+        methods: {
+            // 点击标签
+            clickTag (event, item, index) {
+                this.$emit("clickItem", item, index);
+            },
+            // 删除标签
+            deleteTag (event, item, index) {
+                const cb = () => {
+                    this.list.splice(index, 1);
+                    this.callEliipsis();
+                    this.$emit("change", [...this.list]);
+                    this.$emit("delete", item, index);
+                };
+
+                if (this.propsObj.useDeleteTip === true) {
+                    this.$Modal.confirm({
+                        title: "提示",
+                        content: `确定删除"${this.getItemName(item)}"吗？`,
+                        onOk: () => {
+                            cb();
+                        }
+                    });
+                } else {
+                    cb();
+                }
+            },
+            // 改变标签状态
+            changeChecked (checked, name) {
+
+            },
+
+            callEliipsis () {
+                if (this.autoEllipsis) {
+                    this.maxTagCount = undefined;
+                    this.$nextTick(() => {
+                        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;
+                        }
+                    }
+                }
+            }
+        }
+    };
+</script>
+
+<style lang="less">
+    .DshTags {
+        &-auto {
+            overflow: hidden;
+            width: 100%;
+        }
+
+        &-poptip {
+            &-tag {
+                margin: 2px 0;
+                .dsh-flex-row-between-center();
+            }
+            .ivu-tag-text {
+                .dsh-ellipsis();
+            }
+        }
+    }
+</style>

package/src/components/small/DshTitle.vue

@@ -1,50 +1,50 @@
-<template>
-    <div class="DshTitle">
-        <slot name="prepend"></slot>
-        <Icon
-            class="DshTitle-icon"
-            :type="propsObj.icon"
-            :custom="propsObj.customIcon ? `bico-font ' ${propsObj.customIcon}` : undefined"
-            :color="propsObj.color"
-            :size="propsObj.size || 14"
-        />
-        <slot>
-            <span class="DshTitle-name">{{ propsObj.name || propsObj._name }}</span>
-            <slot name="append"></slot>
-        </slot>
-    </div>
-</template>
-
-<script>
-    export default {
-        name: "DshTitle",
-        props: {
-            propsObj: {
-                type: Object,
-                default () {
-                    return {};
-                }
-            }
-        },
-        data () {
-            return {};
-        },
-        computed: {},
-        created () {},
-        methods: {}
-    };
-</script>
-
-<style lang="less" scoped>
-    .DshTitle {
-        height: 100%;
-        display: flex;
-        align-items: center;
-        cursor: pointer;
-
-        &-name {
-            margin-left: 8px;
-            font-size: @smallTitleSize;
-        }
-    }
-</style>
+<template>
+    <div class="DshTitle">
+        <slot name="prepend"></slot>
+        <Icon
+            class="DshTitle-icon"
+            :type="propsObj.icon"
+            :custom="propsObj.customIcon ? `bico-font ' ${propsObj.customIcon}` : undefined"
+            :color="propsObj.color"
+            :size="propsObj.size || 14"
+        />
+        <slot>
+            <span class="DshTitle-name">{{ propsObj.name || propsObj._name }}</span>
+            <slot name="append"></slot>
+        </slot>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: "DshTitle",
+        props: {
+            propsObj: {
+                type: Object,
+                default () {
+                    return {};
+                }
+            }
+        },
+        data () {
+            return {};
+        },
+        computed: {},
+        created () {},
+        methods: {}
+    };
+</script>
+
+<style lang="less" scoped>
+    .DshTitle {
+        height: 100%;
+        display: flex;
+        align-items: center;
+        cursor: pointer;
+
+        &-name {
+            margin-left: 8px;
+            font-size: @smallTitleSize;
+        }
+    }
+</style>

package/src/components/small/render.js

@@ -1,20 +1,20 @@
-export default {
-    name: "DshRender",
-    functional: true,
-    props: {
-        // formItem: {
-        //     type: Object,
-        //     default () {}
-        // },
-        render: {
-            type: Function,
-            default () {}
-        }
-    },
-    data () {
-        return {};
-    },
-    render: (h, ctx) => {
-        return ctx.props.render(h, ctx.props, ctx);
-    }
-};
+export default {
+    name: "DshRender",
+    functional: true,
+    props: {
+        // formItem: {
+        //     type: Object,
+        //     default () {}
+        // },
+        render: {
+            type: Function,
+            default () {}
+        }
+    },
+    data () {
+        return {};
+    },
+    render: (h, ctx) => {
+        return ctx.props.render(h, ctx.props, ctx);
+    }
+};