bri-components 1.2.49 → 1.2.51

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "bri-components",
-    "version": "1.2.49",
+    "version": "1.2.51",
     "author": "dengshanghui",
     "description": "a component lib for vue project",
     "main": "src/index.js",
@@ -32,7 +32,7 @@
     "dependencies": {
         "ali-oss": "^6.13.1",
         "axios": "^0.23.0",
-        "bri-datas": "^1.0.41",
+        "bri-datas": "^1.0.42",
         "jshint": "^2.12.0",
         "jsonlint": "^1.6.3",
         "minio": "7.1.0",

package/src/components/controls/BriControlInput.vue

@@ -13,9 +13,9 @@
                     class="overflow"
                     :list="value"
                     :propsObj="{
-                    disabled: !canEdit,
-                    closable: true
-                }"
+                        disabled: !canEdit,
+                        closable: true
+                    }"
                     @delete="clickDeleteItem"
                 ></dsh-tags>
 
@@ -35,6 +35,7 @@
                     {{ value }}
                 </div>
             </template>
+
             <!-- 无值 -->
             <template v-else>
                 <div class="placeholder">
@@ -114,12 +115,7 @@
         .placeholder {
             flex: 1;
             min-width: 0px;
-            overflow: hidden;
-        }
-
-        .ivu-icon {
-            padding: 5px;
-            color: @placeholder-disabled-color;
+            .dsh-ellipsis();
         }
 
         .icon {
@@ -132,3 +128,11 @@
         }
     }
 </style>
+<style lang="less">
+    .BriControlInput {
+        .ivu-icon {
+            padding: 5px;
+            color: @placeholder-disabled-color;
+        }
+    }
+</style>

package/src/components/controls/base/DshCascader/DshCascader.vue

@@ -83,7 +83,7 @@
                         :load-data="loadData"
                         @on-visible-change="visibleChange"
                         @on-change="changeVal"
-                        @click.stop="clickCascader"
+                        @click="clickCascader"
                     ></Cascader>
                 </template>
             </template>
@@ -94,7 +94,7 @@
             <!-- 多选 -->
             <template v-if="multipleMode">
                 <bri-tooltip
-                    :content="showMultipleVal"
+                    :content="showMulVal"
                     placement="top"
                     maxWidth="200"
                     :transfer="true"
@@ -106,7 +106,7 @@
                     }">
                         <!-- 有值 -->
                         <dsh-tags
-                            v-if="!$isEmptyData(curValNameList)"
+                            v-if="!$isEmptyData(curValList)"
                             class="text"
                             :list="curValNameList"
                         ></dsh-tags>
@@ -140,7 +140,7 @@
 </template>
 
 <script>
-    import { regionData } from "bri-datas";
+    import { regionData, userIndustryData } from "bri-datas";
     import controlMixin from "../../controlMixin.js";
     import InfoCascader from "./InfoCascader.vue";
 
@@ -190,22 +190,37 @@
             };
         },
         computed: {
+            // 级联拼接符
+            joinSymbol () {
+                return this.propsObj._joinSymbol || "/";
+            },
+            nameKey () {
+                return this.propsObj._nameKey || "name";
+            },
+
             selfPropsObj () {
                 return {
                     _showMode: false,
-                    _changeOnSelect: false, // 每级菜单都可取值
                     _filterable: true,
-                    _renderFormat: (label) => label.join(this.propsObj._joinSymbol || "/"),
+                    _changeOnSelect: false,
+                    _renderFormat: (label) => label.join(this.joinSymbol),
                     _transfer: true,
+
                     ...this.propsObj,
                     ...this.commonDealPropsObj
                 };
             },
-            // 是否多选类型
-            multipleMode () {
-                return ["regions", "cascaders"].includes(this.propsObj._type);
+            // 每级菜单都可取值
+            changeOnSelect () {
+                return this.isOnSearch ? true : this.selfPropsObj._changeOnSelect;
             },
-            // 只有单选时有效
+            cascaderLevel () {
+                return this.selfPropsObj._cascaderLevel;
+            },
+            cascaderFilterVals () {
+                return this.selfPropsObj._cascaderFilterVals;
+            },
+            // 只有单选模式有效
             showMode () {
                 return this.selfPropsObj._showMode;
             },
@@ -213,14 +228,16 @@
                 return this.isVisible ? "ios-arrow-up" : "ios-arrow-down";
             },
 
+            originData () {
+                return ["region", "regions"].includes(this.controlType)
+                    ? regionData
+                    : ["userIndustry"].includes(this.controlType)
+                        ? userIndustryData
+                        : this.selfPropsObj._data;
+            },
             cascaderData: {
                 get () {
-                    return loop(
-                        ["region", "regions"].includes(this.propsObj._type) ? regionData : this.selfPropsObj._data,
-                        this.selfPropsObj._cascaderLevel,
-                        undefined,
-                        this.selfPropsObj._cascaderFilterVals
-                    );
+                    return loop(this.originData, this.cascaderLevel, undefined, this.cascaderFilterVals);
                 },
                 set () {}
             },
@@ -235,20 +252,20 @@
                     : this.cascaderData;
             },
             curValName () {
-                return this.$getTreeLinealDatas(this.curValList, this.cascaderData, "name").join("/");
+                return this.$getTreeLinealDatas(this.curValList, this.cascaderData, this.nameKey).join(this.joinSymbol);
             },
             showVal () {
                 return this.$isEmptyData(this.curValList)
                     ? this.emptyShowVal
                     : this.curValName;
             },
-            // 多选用 名字组成的列表
+            // 多选用
             curValNameList () {
                 return this.curValList.map(item =>
-                    this.$getTreeLinealDatas(item, this.cascaderData, "name").join("/")
+                    this.$getTreeLinealDatas(item, this.cascaderData, this.nameKey).join(this.joinSymbol)
                 );
             },
-            showMultipleVal () {
+            showMulVal () {
                 return this.$isEmptyData(this.curValList)
                     ? this.emptyShowVal
                     : this.curValNameList.join("、");
@@ -280,9 +297,9 @@
 
                 if (bool === false) {
                     if (this.selectVal.length) {
-                        if (this.curValList.some(item => JSON.stringify(item) == JSON.stringify(this.selectVal))) {
+                        if (this.curValList.some(item => JSON.stringify(item) === JSON.stringify(this.selectVal))) {
                             this.$Message.error({
-                                content: `"${this.$getTreeLinealDatas(this.selectVal, this.cascaderData, "name").join("/")}"已选择，请勿重复选择！`,
+                                content: `"${this.$getTreeLinealDatas(this.selectVal, this.cascaderData, this.nameKey).join(this.joinSymbol)}"已选择，请勿重复选择！`,
                                 duration: 5
                             });
                         } else {
@@ -353,7 +370,7 @@
             }
         },
         watch: {
-            "propsObj._cascaderLevel" () {
+            "cascaderLevel" () {
                 this.value[this.controlKey] = [];
             }
         }

package/src/components/controls/base/DshCascader/InfoCascader.vue

@@ -175,22 +175,14 @@
         },
         methods: {
             change (node) {
-                // 点击最后层级时，才出现右侧说明
-                if (node.children.length === 0) {
-                    this.curName = node.name;
-                    this.getDescription(node.codeArr);
-                    if (node.codeArr.length && this.curSelect.codeArr && this.curSelect.codeArr.length === node.codeArr.length && node.codeArr.every((code, idx) => code === this.curSelect.codeArr[idx])) {
-                        this.curSelect = {};
-                        this.description = "";
-                    } else {
-                        if (!this.propsObj._cascaderLevel || node.level == this.propsObj._cascaderLevel || !node.children.length) {
-                            this.curSelect = node;
-                        }
-                    }
-                } else {
-                    this.curName = "";
-                    this.description = "";
+                this.curName = node.name;
+                if (node.codeArr.length && this.curSelect.codeArr && this.curSelect.codeArr.length === node.codeArr.length && node.codeArr.every((code, idx) => code === this.curSelect.codeArr[idx])) {
                     this.curSelect = {};
+                } else {
+                    if (!this.propsObj._cascaderLevel || node.level == this.propsObj._cascaderLevel || !node.children.length) {
+                        this.curSelect = node;
+                        this.getDescription(node.codeArr);
+                    }
                 }
             },
             getDescription (nodeKeys) {

package/src/components/controls/base/DshDate/DshDate.vue

@@ -0,0 +1,146 @@
+<template>
+    <!-- 单选模式 -->
+    <div
+        v-if="!multipleMode"
+        class="DshDate"
+    >
+        <template v-if="show">
+            <!-- 编辑 -->
+            <template v-if="canEdit">
+                <!-- 时间子类型 -->
+                <template v-if="['time'].includes(subType)">
+                    <TimePicker
+                        class="DshDate-edit"
+                        v-model="curValDate"
+                        :type="subType"
+                        :placeholder="selfPropsObj._placeholder"
+                        :disabled="!finalCanEdit"
+                        :clearable="selfPropsObj._clearable"
+                        :transfer="selfPropsObj._transfer"
+                        @on-change="change"
+                    ></TimePicker>
+                </template>
+
+                <!-- 日期、日期时间、年、月 -->
+                <template v-else>
+                    <DatePicker
+                        class="DshDate-edit"
+                        v-model="curValDate"
+                        :type="subType"
+                        :placeholder="selfPropsObj._placeholder"
+                        :disabled="!finalCanEdit"
+                        :clearable="selfPropsObj._clearable"
+                        :options="options"
+                        :transfer="selfPropsObj._transfer"
+                        @on-change="change"
+                    ></DatePicker>
+                </template>
+            </template>
+
+            <!-- 查看 -->
+            <template v-else>
+                <bri-tooltip
+                    :content="showVal"
+                    maxWidth="200"
+                    :transfer="true"
+                >
+                    <div :class="{
+                        ...commonClass
+                    }">
+                        {{ showVal }}
+                    </div>
+                </bri-tooltip>
+            </template>
+        </template>
+    </div>
+
+    <!-- 多选模式 -->
+    <dsh-daterange
+        v-else
+        :canEdit="canEdit"
+        :value="value"
+        :propsObj="propsObj"
+        @change="change"
+    ></dsh-daterange>
+</template>
+
+<script>
+    import controlMixin from "../../controlMixin.js";
+    import DshDaterange from "./DshDaterange.vue";
+
+    export default {
+        name: "DshDate",
+        mixins: [
+            controlMixin
+        ],
+        components: {
+            DshDaterange
+        },
+        props: {},
+        data () {
+            return {
+                show: true
+            };
+        },
+        computed: {
+            selfPropsObj () {
+                return {
+                    _transfer: true,
+
+                    ...this.propsObj,
+                    ...this.commonDealPropsObj
+                };
+            },
+
+            curValDate: {
+                get () {
+                    const val = this.value[this.controlKey];
+                    return this.$transformDateCompatible(val, this.subType);
+                },
+                set (val) {
+                    this.value[this.controlKey] = this.$transformDate(val, "-", this.subType);
+                }
+            },
+            subType () {
+                return this.selfPropsObj._dateType;
+            },
+            options () {
+                return {
+                    shortcuts: [],
+                    disabledDate: (date) => {
+                        const resultObj = this.$validateComparedRule(
+                            [this.selfPropsObj],
+                            {
+                                ...this.value,
+                                [this.controlKey]: this.$transformDate(date, "/", this.subType)
+                            },
+                            this.allFormList
+                        );
+                        return !resultObj.bool;
+                    }
+                };
+            }
+        },
+        created () {},
+        methods: {},
+        watch: {
+            "subType" () {
+                this.show = false;
+                this.$nextTick(() => {
+                    this.value[this.controlKey] = this.selfPropsObj._default;
+                    this.show = true;
+                });
+            }
+        }
+    };
+</script>
+
+<style lang="less">
+    .DshDate {
+        width: 100%;
+
+        &-edit {
+            width: 100%;
+        }
+    }
+</style>

package/src/components/controls/base/{DshDaterange.vue → DshDate/DshDaterange.vue}

@@ -29,26 +29,19 @@
                 @on-change="changeVal($event, 0)"
                 @on-open-change="changeOpen($event, 0)"
             >
-                <div
-                    class="DshDaterange-item"
-                    @click="changeOpen(true, 0)"
-                >
-                    <span class="DshDaterange-item-name">
-                        {{ showVal0 }}
-                    </span>
-
-                    <span class="DshDaterange-item-icon">
-                        <Icon
-                            v-show="val0"
-                            type="ios-close-circle"
-                            @click.stop="clickClear('', 0)"
-                        />
-                        <Icon
-                            v-show="!val0"
-                            type="ios-calendar-outline"
-                        />
-                    </span>
-                </div>
+                <bri-control-input
+                    :class="{
+                        ...commonClass,
+                        'bri-control-nodata': this.$isEmptyData(this.showVal0),
+                        'DshDaterange-item': true
+                    }"
+                    :canEdit="finalCanEdit"
+                    :value="showVal0"
+                    inputIcon="ios-calendar-outline"
+                    :propsObj="selfPropsObj"
+                    @clear="clickClear('', 0)"
+                    @click.native="changeOpen(true, 0)"
+                ></bri-control-input>
             </DatePicker>
 
             <span class="DshDaterange-center"> — </span>
@@ -66,33 +59,26 @@
                 @on-change="changeVal($event, 1)"
                 @on-open-change="changeOpen($event, 1)"
             >
-                <div
-                    class="DshDaterange-item"
-                    @click="changeOpen(true, 1)"
-                >
-                    <span class="DshDaterange-item-name">
-                        {{ showVal1 }}
-                    </span>
-
-                    <span class="DshDaterange-item-icon">
-                        <Icon
-                            v-show="val1"
-                            type="ios-close-circle"
-                            @click.stop="clickClear('', 1)"
-                        />
-                        <Icon
-                            v-show="!val1"
-                            type="ios-calendar-outline"
-                        />
-                    </span>
-                </div>
+                <bri-control-input
+                    :class="{
+                        ...commonClass,
+                        'bri-control-nodata': this.$isEmptyData(this.showVal1),
+                        'DshDaterange-item': true
+                    }"
+                    :canEdit="finalCanEdit"
+                    :value="showVal1"
+                    inputIcon="ios-calendar-outline"
+                    :propsObj="selfPropsObj"
+                    @clear="clickClear('', 1)"
+                    @click.native="changeOpen(true, 1)"
+                ></bri-control-input>
             </DatePicker>
         </template>
     </div>
 </template>
 
 <script>
-    import controlMixin from "../controlMixin.js";
+    import controlMixin from "../../controlMixin.js";
 
     export default {
         name: "DshDaterange",
@@ -224,28 +210,13 @@
             };
         },
         computed: {
-            val0: {
-                get () {
-                    return this.getVal(0);
-                },
-                set (val) {
-                    this.setVal(val, 0);
-                }
-            },
-            val1: {
-                get () {
-                    return this.getVal(1);
-                },
-                set (val) {
-                    this.setVal(val, 1);
-                }
-            },
-
             selfPropsObj () {
                 return {
                     _useShortcuts: true,
+
                     ...this.propsObj,
                     ...this.commonDealPropsObj,
+
                     _type: "date"
                 };
             },
@@ -255,18 +226,34 @@
             useShortcuts () {
                 return this.selfPropsObj._useShortcuts;
             },
-
             options0 () {
                 return this.getOptions(0);
             },
             options1 () {
                 return this.getOptions(1);
             },
+
+            val0: {
+                get () {
+                    return this.getVal(0);
+                },
+                set (val) {
+                    this.setVal(val, 0);
+                }
+            },
+            val1: {
+                get () {
+                    return this.getVal(1);
+                },
+                set (val) {
+                    this.setVal(val, 1);
+                }
+            },
             showVal0 () {
-                return this.getShowVal(0);
+                return this.getShowVal(this.val0);
             },
             showVal1 () {
-                return this.getShowVal(1);
+                return this.getShowVal(this.val1);
             }
         },
         created () {},
@@ -328,9 +315,7 @@
                     }
                 };
             },
-            getShowVal (index) {
-                const val = this[`val${index}`];
-
+            getShowVal (val) {
                 return this.isDynDateKey(val)
                     ? (this.dynDate.find(dynItem => dynItem._key === val) || { name: `"${val}"dnDate不存在` }).name
                     : this.$transformDate(val, "-", this.subType);
@@ -341,3 +326,28 @@
         }
     };
 </script>
+
+<style lang="less">
+    .DshDaterange {
+        width: 100%;
+        display: flex;
+        align-items: center;
+
+        &-left,
+        &-right {
+            flex: 7;
+            min-width: 0px;
+        }
+
+        &-center {
+            flex: 1;
+            min-width: 10px;
+            text-align: center;
+            color: @textColor;
+        }
+
+        &-item {
+
+        }
+    }
+</style>

package/src/components/controls/base/DshEditor.vue

@@ -188,7 +188,7 @@
     };
 </script>
 
-<style lang="less" scoped>
+<style lang="less">
     .DshEditor {
         width: 100%;
 

package/src/components/controls/base/{BriInputs.vue → DshInput/BriInputs.vue}

@@ -46,7 +46,7 @@
 </template>
 
 <script>
-    import controlMixin from "../controlMixin.js";
+    import controlMixin from "../../controlMixin.js";
 
     export default {
         name: "BriInputs",

package/src/components/controls/base/{DshInput.vue → DshInput/DshInput.vue}

@@ -1,5 +1,9 @@
 <template>
-    <div class="DshInput">
+    <!-- 单选模式 -->
+    <div
+        v-if="!multipleMode"
+        class="DshInput"
+    >
         <!-- 编辑 -->
         <template v-if="canEdit">
             <Input
@@ -8,7 +12,7 @@
                 :type="inputType"
                 :placeholder="selfPropsObj._placeholder"
                 :readonly="selfPropsObj._readonly"
-                :disabled="!finalCanEdit || selfPropsObj._disabled"
+                :disabled="selfPropsObj._disabled"
                 :clearable="selfPropsObj._clearable"
                 :size="selfPropsObj._size"
                 :rows="selfPropsObj._rows"
@@ -76,16 +80,29 @@
             </template>
         </template>
     </div>
+
+    <!-- 多选模式 -->
+    <dsh-inputs
+        v-else
+        :canEdit="canEdit"
+        :value="value"
+        :propsObj="propsObj"
+        @change="change"
+    ></dsh-inputs>
 </template>
 
 <script>
-    import controlMixin from "../controlMixin.js";
+    import controlMixin from "../../controlMixin.js";
+    import DshInputs from "./BriInputs.vue";
 
     export default {
         name: "DshInput",
         mixins: [
             controlMixin
         ],
+        components: {
+            DshInputs
+        },
         props: {},
         data () {
             return {
@@ -95,9 +112,9 @@
         computed: {
             selfPropsObj () {
                 return {
+                    _search: false,
                     _textType: "default", // ["default", "url"]
                     _readonly: ["serialNumber"].includes(this.controlType),
-                    _disabled: ["serialNumber"].includes(this.controlType),
                     _showWordLimit: this.propsObj._showWordLimit || (!!this.propsObj._maxlength || this.propsObj._maxlength === 0),
                     _autosize: {
                         minRows: 2