bri-components 1.2.58 → 1.2.60

package/src/components/controls/mixins/selectMixin.js

@@ -9,14 +9,11 @@ export default {
     props: {},
     data () {
         return {
-            initListData: [],
-            showTipTpl: false,
-            showTipModal: false,
-            dynamicContent: ""
+            initListData: []
         };
     },
     computed: {
-        selectPropsObj () {
+        basePropsObj () {
             return {
                 colorMap: resourceData.colorMap,
                 _optionKind: "dropdown", // "flat"、"dropdown"
@@ -46,17 +43,8 @@ export default {
                 : listData;
         },
 
-        openTip () {
-            return this.isOnSearch ? false : this.propsObj._openTip;
-        },
-        modalTipContent () {
-            return this.propsObj._tipContent || this.dynamicContent || "暂无信息";
-        },
-
         curValObj () {
-            return this.$isEmptyData(this.curVal)
-                ? undefined
-                : this.getItemData(this.curVal);
+            return this.getItemObj(this.curVal);
         },
         valStr: {
             get () {
@@ -77,7 +65,7 @@ export default {
         },
         // 已选择项的对象列表
         curValObjList () {
-            return this.curValList.map(key => this.getItemData(key));
+            return this.curValList.map(key => this.getItemObj(key));
         },
         valListStr () {
             return this.curValObjList.map(item => item.name || item._name).join("、");
@@ -93,129 +81,99 @@ export default {
     },
     methods: {
         init () {
-            this.getTipData();
             this.getListData();
         },
 
-        getItemData (key) {
-            const obj = this.listData.find(item => item._key === key) || {
-                _key: key,
-                name: `温馨提示：选项${key}已找不到`
-            };
-
-            return {
-                ...obj,
-                style: this.getItemStyle(obj),
-                color: undefined
-            };
+        // 单选模式 点击选项
+        clickRadioItem (item, index) {
+            if (!this.getRadioItemDisabled(item)) {
+                if (this.curVal === item._key) {
+                    if (this.clearable) {
+                        this.curVal = "";
+                    }
+                } else {
+                    this.curVal = item._key;
+                }
+            }
+        },
+        // 单选模式 取消选择项
+        cancelRadioItemSelect (item, index) {
+            if (this.curVal === item._key) {
+                this.clickRadioItem(item, index);
+            }
+        },
+        // 多选模式 点击选项
+        clickCheckItem (item, index) {
+            if (!this.getCheckItemDisabled(item)) {
+                if (this.curValList.includes(item._key)) {
+                    this.curValList = this.curValList.filter(key => key !== item._key);
+                } else {
+                    this.curValList = [...this.curValList, item._key];
+                }
+            }
         },
-        getItemStyle (item) {
+
+        /* ------- 方法 ------- */
+        // 每项的class集合 --flat方式在用
+        getItemClass (item) {
+            return [
+                this.useColor
+                    ? this.colorMap[item.color] ? item.color : "color-1"
+                    : undefined,
+                item.class
+            ];
+        },
+        // 每项的颜色相关style --flat方式在用
+        getItemColorStyle (item) {
             const color = this.colorMap[item.color] || this.colorMap["color-1"];
+            return this.useColor
+                ? {
+                    backgroundColor: this.$getColor(color, 0.1),
+                    color: color
+                }
+                : {};
+        },
+        // 每项的具体样式 -查看状态时用
+        getItemShowStyle (item) {
             return {
-                "background-color": this.useColor ? this.$getColor(color, 0.1) : "#E5E5E5",
-                color: this.useColor ? color : "rgba(0, 0, 0, 0.9)",
+                ...this.getItemColorStyle(item),
                 display: "inline-block",
                 "max-width": "100%",
                 padding: "0px 6px",
                 "border-radius": "4px"
             };
         },
-        // 获取某项的置灰状态
-        getItemDisabled (item) {
-            return !!(this.selfPropsObj._disabled || item._disabled);
-        },
+        // 获取单选项的置灰状态
+        getRadioItemDisabled (item) {
+            return !!(
+                this.selfPropsObj._disabled ||
+                item._disabled
+            );
+        },
+        // 获取多选项的置灰状态
+        getCheckItemDisabled (item) {
+            return !!(
+                this.selfPropsObj._disabled ||
+                item._disabled ||
+                (this.curValList.length >= this.selfPropsObj._max && !this.curValList.includes(item._key))
+            );
+        },
+        getItemObj (key) {
+            const obj = this.listData.find(item => item._key === key) || {
+                _key: key,
+                name: `温馨提示：选项${key}已找不到`
+            };
 
-        // 是否打开tip弹窗
-        clickOpenTip (item) {
-            if (item.__isTip__) {
-                if (this.propsObj._tipKind === "dynamic" && !this.propsObj._tipContent) {
-                    this.getTipUrl();
-                } else {
-                    this.showTipTpl = true;
-                    this.showTipModal = true;
-                }
-            }
-        },
-        getTipUrl () {
-            if (this.propsObj._tipUrl) {
-                this.$https({
-                    url: {
-                        module: "customPath",
-                        name: this.propsObj._tipUrl
-                    },
-                    params: {
-                        formData: this.value,
-                        propsObj: this.propsObj
-                    },
-                    callback: res => {
-                        this.dynamicContent = res;
-                        this.showTipTpl = true;
-                        this.showTipModal = true;
-                    }
-                });
-            } else {
-                this.$Message.warning("请配置接口路径！");
-            }
-        },
-        tipModalRender (h) {
-            return this.showTipTpl
-                ? h("dsh-modal", {
-                    props: {
-                        value: this.showTipModal,
-                        mode: "custom",
-                        propsObj: {
-                            title: "温馨提示",
-                            maskClosable: true,
-                            class: "DshSelect-modal"
-                        }
-                    },
-                    on: {
-                        input: bool => {
-                            this.showTipModal = bool;
-                        }
-                    }
-                }, [
-                    h("div", {
-                        class: "DshSelect-modal-content",
-                        domProps: {
-                            innerHTML: this.modalTipContent
-                        }
-                    }),
-                    h("div", {
-                        class: "DshSelect-modal-footer"
-                    }, [
-                        h("Button", {
-                            props: {
-                                type: "primary"
-                            },
-                            on: {
-                                click: () => {
-                                    this.showTipModal = false;
-                                }
-                            }
-                        }, "我知道了")
-                    ])
-                ])
-                : undefined;
-        },
-        getTipData () {
-            if (
-                (this.propsObj._key !== "_default") &&
-                this.finalCanEdit &&
-                this.openTip
-            ) {
-                let tipObj = {
-                    _key: "openTip",
-                    _name: this.propsObj._tipName || "其他",
-                    __isTip__: true,
-                    _disabled: true,
-                    color: "#6991cc",
-                    class: `Dsh${this.propsObj._type}-tip`
-                };
-                this.initListData.push(tipObj);
-            }
+            return this.$isEmptyData(key)
+                ? undefined
+                : {
+                    ...obj,
+                    style: this.getItemShowStyle(obj),
+                    color: undefined
+            };
         },
-        // 接口 -获取自定义的接口数据
+
+        // TODO：待删除 接口 -获取自定义的接口数据
         getListData () {
             this.selfPropsObj._customData.forEach(item => {
                 this.$https({
@@ -226,8 +184,8 @@ export default {
                             ...this.initListData,
                             ...data.list.map(dataItem =>
                                 ({
-                                    _key: dataItem[item._key || "_key"],
-                                    name: dataItem[item._name || "name"]
+                                    _key: dataItem._key,
+                                    name: dataItem.name
                                 })
                             )
                         ];

package/src/components/small/BriTooltip.vue

@@ -82,6 +82,5 @@
 <style lang="less" scoped>
     .BriTooltip {
         width: 100%;
-        display: flex;
     }
 </style>

package/src/components/unit/DshFormUnit.vue

@@ -7,7 +7,6 @@
                 'DshFormUnit-line': formItem._line
             },
             formControlClass,
-            formItem.formControlClass
         ]"
         :style="{
             width: `calc(${(formItem._br ? (formItem._span || 24)/24 : 1) * 100}% - 12px)`,
@@ -46,7 +45,7 @@
                         <!-- label后可自定义内容 -->
                         <dsh-render
                             v-if="formItem._tipsRender"
-                            :render="tipsRender(formItem,formData)"
+                            :render="tipsRender(formItem, formData)"
                         ></dsh-render>
                     </span>
                 </bri-tooltip>
@@ -211,6 +210,7 @@
 
         &-control {
             min-height: 32px;
+            overflow: hidden;
         }
 
         &-line {
@@ -227,13 +227,13 @@
 
                 &-left {
                     flex: 1;
-                    min-width: 100px;
+                    min-width: 0px;
                 }
 
                 &-right {
-                    max-width: 120px;
+                    flex: none;
+                    max-width: 80px;
                     min-width: 0px;
-                    text-align: right;
                 }
             }