bri-components 1.1.1 → 1.1.3

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "bri-components",
-    "version": "1.1.1",
+    "version": "1.1.3",
     "author": "dengshanghui",
     "description": "a component lib for vue project",
     "main": "src/index.js",

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

@@ -1,7 +1,7 @@
 <template>
     <div :class="`DshCascader`">
         <!-- 编辑和disabled模式 -->
-        <template v-if="finalCanEdit  || $isDisabled(canEdit, selfPropsObj)">
+        <template v-if="canEdit">
             <!-- 多选 多选模式的filterable必须是false，不然出bug -->
             <template v-if="useMultiple === true">
                 <Cascader
@@ -21,7 +21,7 @@
                 >
                     <dsh-control-define
                         :value="valTags"
-                        :canEdit="finalCanEdit"
+                        :canEdit="canEdit"
                         :propsObj="{
                             ...selfPropsObj,
                             _multiplerow: selfPropsObj._span == 24 || !selfPropsObj._span
@@ -45,7 +45,7 @@
                         >
                             <span :class="{
                                 'DshCascader-single-val-text': true,
-                                'DshCascader-single-val-text-disabled': $isDisabled(canEdit, propsObj),
+                                'DshCascader-single-val-text-disabled': !finalCanEdit,
                             }">
                                 {{ $getTreeLinealDatas(value[controlKey], cascaderData, "name").join("/") }}
                             </span>
@@ -82,16 +82,16 @@
                     v-else
                     style="width: 100%;"
                     :class="{
-                        'DshCascader-disabled': $isDisabled(canEdit, selfPropsObj)
+                        'DshCascader-disabled': !finalCanEdit
                     }"
                     :value="value[controlKey]"
                     :data="renderCascaderData"
                     :placeholder="selfPropsObj._placeholder"
-                    :disabled="$isDisabled(canEdit, selfPropsObj)"
+                    :disabled="!finalCanEdit"
                     :change-on-select="selfPropsObj._changeOnSelect"
                     :clearable="selfPropsObj._clearable"
                     :size="selfPropsObj._size"
-                    :filterable="selfPropsObj._filterable && !$isDisabled(canEdit, selfPropsObj)"
+                    :filterable="selfPropsObj._filterable && finalCanEdit"
                     :transfer="selfPropsObj._transfer"
                     :transfer-class-name="selfPropsObj._transferClassName"
                     :load-data="loadData"
@@ -103,12 +103,15 @@
         </template>
 
         <!-- 查看模式 -->
-        <control-show
+        <dsh-control-define
             v-else
-            :showVal="showVal"
-            :propsObj="selfPropsObj"
-            :isUnit="isUnit"
-        ></control-show>
+            :value="valTags"
+            :canEdit="finalCanEdit"
+            :propsObj="{
+                ...selfPropsObj,
+                _multiplerow: selfPropsObj._span == 24 || !selfPropsObj._span
+            }"
+        ></dsh-control-define>
     </div>
 </template>
 

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

@@ -3,12 +3,12 @@
         <Cascader
             class="DshCascaderMultiple-control"
             v-model="cascaderVal"
-            :placeholder="$showPlaceholder(canEdit, propsObj) ? `请输入${propsObj._name}` : ''"
+            :placeholder="selfPropsObj._placeholder"
             :data="renderCascaderData"
             :load-data="loadData"
-            :change-on-select="propsObj._changeOnSelect"
-            :filterable="true"
             :disabled="!finalCanEdit"
+            :change-on-select="selfPropsObj._changeOnSelect"
+            :filterable="true"
             :clearable="true"
             :transfer="true"
         ></Cascader>
@@ -58,7 +58,9 @@
 
     export default {
         name: "DshCascaderMultiple",
-        mixins: [controlMixin],
+        mixins: [
+            controlMixin
+        ],
         props: {},
         data () {
             return {
@@ -80,6 +82,13 @@
             };
         },
         computed: {
+            selfPropsObj () {
+                return {
+                    ...this.propsObj,
+                    ...this.commonDealPropsObj
+                };
+            },
+
             cascaderData: {
                 get () {
                     return loop(

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

@@ -52,10 +52,6 @@
             <Select
                 v-else
                 v-model="value[controlKey]"
-                :class="{
-                    'DshCheckbox-select-readonly': $isReadonly(canEdit, selfPropsObj),
-                    'DshCheckbox-select-disabled': $isDisabled(canEdit, selfPropsObj)
-                }"
                 :multiple="true"
                 :placeholder="selfPropsObj._placeholder"
                 :disabled="!finalCanEdit"
@@ -105,16 +101,12 @@
                     }"
                 >{{ col.name }}</span>
             </div>
+
             <div
                 v-else
                 class="control-nodata-text dsh-ellipsis"
             >
-                <template v-if="isUnit">
-                    -
-                </template>
-                <template v-else>
-                    暂无内容
-                </template>
+                {{ emptyShowVal }}
             </div>
         </Ctooltip>
 
@@ -131,7 +123,10 @@
     // optionKind值 'flat'、'dropdown'
     export default {
         name: "DshCheckbox",
-        mixins: [controlMixin, selectMixin],
+        mixins: [
+            controlMixin,
+            selectMixin
+        ],
         props: {},
         data () {
             return {
@@ -169,24 +164,26 @@
             listData () {
                 return (this.selfPropsObj._data || []).concat(this.initListData);
             },
-
             showVal () {
                 return this.colData.map(col => col.name).join("、");
             },
             // 选项数据
             colData () {
-                return this.listData.filter(item => (this.value[this.controlKey] || []).includes(item._key));
+                return this.listData.filter(item => (this.curVal || []).includes(item._key));
             },
             flatShowAlign () {
-                return !this.propsObj._align || this.propsObj._align == "left" || !this.isUnit ? "flex-start" : this.propsObj._align == "right" ? "flex-end" : "center";
+                return !this.propsObj._align || this.propsObj._align == "left" || !this.isUnitShow
+                    ? "flex-start"
+                    : this.propsObj._align == "right"
+                        ? "flex-end"
+                        : "center";
             }
         },
-        created () {
-        },
+        created () {},
         methods: {
             // 下拉框的选择
             select (item) {
-                let val = this.value[this.controlKey];
+                let val = this.curVal;
                 if (val.includes(item.value)) {
                     let itemIndex = val.findIndex(valItem => valItem === item.value);
                     val.splice(itemIndex, 1);
@@ -199,9 +196,9 @@
 
             isDisabled (item) {
                 return !!(
+                    !this.finalCanEdit ||
                     item._disabled ||
-                    this.value[this.controlKey] && this.value[this.controlKey].length >= this.selfPropsObj._max && !this.value[this.controlKey].includes(item._key) ||
-                    !this.finalCanEdit
+                    this.curVal && this.curVal.length >= this.selfPropsObj._max && !this.curVal.includes(item._key)
                 );
             }
         }

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

@@ -1,15 +1,16 @@
 <template>
     <div class="DshCoordinates">
         <Ctooltip
+            :content="curValName"
             placement="top"
             :transfer="true"
             maxWidth="200"
-            :content="currentVal"
         >
-            <!-- 编辑模式 -->
+            <!-- 编辑 -->
             <div
-                v-if="finalCanEdit"
+                v-if="canEdit"
                 class="DshCoordinates-wrap"
+                :class="commonClass"
                 @click="clickOpenModal"
             >
                 <div
@@ -17,7 +18,7 @@
                     class="DshCoordinates-text"
                 >
                     <span class="dsh-ellipsis">
-                        {{ curVal.name }}
+                        {{ curValName}}
                     </span>
                     <Icon
                         v-if="finalCanEdit && selfPropsObj._clearable"
@@ -36,12 +37,15 @@
                 </span>
             </div>
 
-            <!-- 查看模式 -->
-            <span v-else :class="{
-                        ...commonClass,
-                        'DshCoordinates-show': !isUnit
-                        }">
-                {{ showText }}
+            <!-- 查看 -->
+            <span
+                v-else
+                :class="{
+                    ...commonClass,
+                    'DshCoordinates-show': !isUnitShow
+                }"
+            >
+                {{ curValName }}
             </span>
         </Ctooltip>
 
@@ -178,7 +182,7 @@
                     this.value[this.controlKey] = val;
                 }
             },
-            currentVal () {
+            curValName () {
                 return this.curVal && this.curVal.name;
             },
             curLnglat: {

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

@@ -3,17 +3,15 @@
         v-if="show"
         class="DshDate"
     >
-        <template v-if="finalCanEdit || $isDisabled(canEdit, selfPropsObj)">
+        <!-- 编辑 -->
+        <template v-if="canEdit">
             <template v-if="['time'].includes(subType)">
                 <TimePicker
                     style="width: 100%;"
-                    :class="{
-                        'DshDate-time-disabled': $isDisabled(canEdit, selfPropsObj)
-                    }"
                     v-model="val"
                     :type="subType"
                     :placeholder="selfPropsObj._placeholder"
-                    :disabled="$isDisabled(canEdit, selfPropsObj)"
+                    :disabled="!finalCanEdit"
                     :clearable="selfPropsObj._clearable"
                     :transfer="selfPropsObj._transfer"
                     @on-change="change"
@@ -23,13 +21,10 @@
             <template v-else>
                 <DatePicker
                     style="width: 100%;"
-                    :class="{
-                        'DshDate-date-disabled': $isDisabled(canEdit, selfPropsObj)
-                    }"
                     v-model="val"
                     :type="subType"
                     :placeholder="selfPropsObj._placeholder"
-                    :disabled="$isDisabled(canEdit, selfPropsObj)"
+                    :disabled="!finalCanEdit"
                     :clearable="selfPropsObj._clearable"
                     :options="options"
                     :transfer="selfPropsObj._transfer"
@@ -38,13 +33,14 @@
             </template>
         </template>
 
-        <!-- 查看模式 -->
-        <control-show
-            v-else
-            :showVal="showVal"
-            :propsObj="selfPropsObj"
-            :isUnit="isUnit"
-        ></control-show>
+        <!-- 查看 -->
+        <template v-else>
+            <control-show
+                :showVal="curVal"
+                :emptyShowVal="emptyShowVal"
+                :propsObj="selfPropsObj"
+            ></control-show>
+        </template>
     </div>
 </template>
 
@@ -53,21 +49,24 @@
 
     export default {
         name: "DshDate",
-        mixins: [controlMixin],
-        props: {
-            allFormList: {
-                type: Array,
-                default () {
-                    return [];
-                }
-            }
-        },
+        mixins: [
+            controlMixin
+        ],
+        props: {},
         data () {
             return {
                 show: true
             };
         },
         computed: {
+            selfPropsObj () {
+                return {
+                    _transfer: true,
+                    ...this.propsObj,
+                    ...this.commonDealPropsObj
+                };
+            },
+
             val: {
                 get () {
                     const val = this.value[this.controlKey];
@@ -77,14 +76,6 @@
                     this.value[this.controlKey] = this.$transformDate(val, "-", this.subType);
                 }
             },
-
-            selfPropsObj () {
-                return {
-                    _transfer: true,
-                    ...this.propsObj,
-                    ...this.commonDealPropsObj
-                };
-            },
             subType () {
                 return this.selfPropsObj._dateType;
             },
@@ -103,10 +94,6 @@
                         return !resultObj.bool;
                     }
                 };
-            },
-
-            showVal () {
-                return this.value[this.controlKey] || "";
             }
         },
         created () {},

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

@@ -96,7 +96,9 @@
 
     export default {
         name: "DshDaterange",
-        mixins: [controlMixin],
+        mixins: [
+            controlMixin
+        ],
         props: {},
         data () {
             return {

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

@@ -1,49 +1,75 @@
 <template>
     <div class="DshEditor">
-        <!-- 有值、无值 可编辑 -->
-        <template v-if="isUnit">
-            <div v-if="value[controlKey]" class="DshEditor-unit">
-                <span class="DshEditor-unit-text">
-                    富文本
-                </span>
-            </div>
-            <span v-else class="control-notext">
-                -
-            </span>
-        </template>
-
-        <template v-else-if="finalCanEdit">
-            <div class="DshEditor-show DshEditor-edit"
-                :class="value[controlKey] ? '': 'DshEditor-edit-placeholder'"
-                v-show="showType === 'show'"
-                v-html="editVal"
-                @click="handleEdit"
-            ></div>
-            <div v-show="showType=='edit'" class="DshEditor-wrap">
+        <!-- 编辑 -->
+        <template v-if="canEdit">
+            <!-- 可编辑 -->
+            <template v-if="finalCanEdit">
                 <div
-                    ref="toolbar"
-                    class="toolbar"
+                    class="DshEditor-show DshEditor-edit"
+                    :class="value[controlKey] ? '': 'DshEditor-edit-placeholder'"
+                    v-show="showType === 'show'"
+                    v-html="editVal"
+                    @click="handleEdit"
                 ></div>
+
                 <div
-                    ref="editor"
-                    class="text"
-                ></div>
+                    v-show="showType === 'edit'"
+                    class="DshEditor-wrap"
+                >
+                    <div
+                        ref="toolbar"
+                        class="DshEditor-wrap-toolbar"
+                    ></div>
 
-                <dsh-buttons
-                    class="DshEditor-wrap-btn"
-                    :list="$getOperationList(['save'])"
-                    @click="$dispatchEvent($event)"
-                ></dsh-buttons>
-            </div>
+                    <div
+                        ref="editor"
+                        class="DshEditor-wrap-text"
+                    ></div>
+
+                    <dsh-buttons
+                        class="DshEditor-wrap-btn"
+                        :list="$getOperationList(['canSave'])"
+                        @click="$dispatchEvent($event)"
+                    ></dsh-buttons>
+                </div>
+            </template>
+
+            <!-- 不可编辑 -->
+            <div
+                v-else
+                :class="{
+                    'DshEditor-show': true,
+                    'DshEditor-show-disabled': true
+                }"
+                v-show="showType === 'show'"
+                v-html="showText"
+            ></div>
         </template>
 
-        <div v-else
-            class="DshEditor-show"
-            :class="$isDisabled(canEdit, selfPropsObj) ? 'DshEditor-show-disabled' : value[controlKey] ? '' : 'DshEditor-show-nodata'"
-            v-show="showType === 'show'"
-            v-html="showVal"
-        ></div>
+        <!-- 查看 -->
+        <template v-else>
+            <!-- 单元格里 的查看 -->
+            <div
+                v-if="isUnitShow"
+                :class="{
+                    'DshEditor-unit': true,
+                    'DshEditor-unit-nodata': true,
+                }"
+            >
+                {{ curVal ? "富文本" : emptyShowVal }}
+            </div>
 
+            <!-- 查看页里 的查看 -->
+            <div
+                v-else
+                :class="{
+                    'DshEditor-show': true,
+                    'DshEditor-show-nodata': !curVal
+                }"
+                v-show="showType === 'show'"
+                v-html="showText"
+            ></div>
+        </template>
     </div>
 </template>
 
@@ -54,19 +80,22 @@
 
     export default {
         name: "DshEditor",
-        mixins: [controlMixin, uploadMixin],
+        mixins: [
+            controlMixin,
+            uploadMixin
+        ],
         props: {},
         data () {
             return {
                 editor: null,
                 showType: "show",
                 operationMap: {
-                    save: {
+                    canSave: {
                         name: "完成",
-                        type: "save",
+                        type: "canSave",
                         btnType: "primary",
                         size: "default",
-                        event: "save"
+                        event: "clickSave"
                     }
                 }
             };
@@ -78,14 +107,9 @@
                     ...this.commonDealPropsObj
                 };
             },
-            unitVal () {
-                return this.value[this.controlKey] ? "富文本" : "-";
-            },
-            showVal () {
-                return this.value[this.controlKey] || "暂无内容";
-            },
+
             editVal () {
-                return this.value[this.controlKey] || this.selfPropsObj._placeholder;
+                return this.curVal || this.selfPropsObj._placeholder;
             }
         },
         created () {},
@@ -160,7 +184,7 @@
                 this.editor.txt.html(this.value[this.propsObj._key]);
                 this.showType = "edit";
             },
-            save () {
+            clickSave () {
                 this.showType = "show";
             },
             // 插入代码