bri-components 1.2.2 → 1.2.3

package/package.json

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

package/src/abolish/DshCascaders.vue

@@ -22,6 +22,9 @@
         <dsh-tags
             class="dsh-margin-top5"
             :list="tags"
+            :propsObj="{
+                closable: true
+            }"
             @delete="$dispatchEvent(operationMap.deleteTag, arguments)"
         ></dsh-tags>
     </div>

package/src/abolish/DshTexts.vue

@@ -19,6 +19,9 @@
         <dsh-tags
             class="dsh-margin-top5"
             :list="value[propsObj._key]"
+            :propsObj="{
+                closable: true
+            }"
             @delete="$dispatchEvent(operationMap.deleteTag, arguments)"
         ></dsh-tags>
     </div>

package/src/components/controls/base/BriUpload/BriUploadImage.vue

@@ -140,7 +140,7 @@
         computed: {
             modalPropsObj () {
                 return {
-                    title: this.propsObj._name,
+                    title: this.propsObj._name || "修改头像",
                     class: "bri-modal",
                     width: 450
                 };

package/src/components/controls/base/BriUpload/uploadMixin.js

@@ -64,7 +64,8 @@ export default {
                 callback: res => {
                     this.inputType = "file";
                     if (res.ossType === "ali-oss") {
-                        // 上传到阿里云
+                        console.log(this.computedOssType, res);
+                        // 上传到阿里云res
                         this[this.computedOssType](file, res, callback);
                     } else if (res.ossType === "local") {
                         this.localUpload(file, res, callback);
@@ -259,7 +260,7 @@ export default {
         binaryMultipartUpload (file, res, callback) {
             let type = "jpg";
             let remoteName = `${this.randomTimeStampFn()}.${type}`;
-
+            console.log("调binaryMultipartUpload");
             // 上传成功的回调参数
             let callbackBody = {
                 name: remoteName,
@@ -277,7 +278,7 @@ export default {
                 callbackBodyType: "application/json",
                 callbackBody: this.transferCallBody(callbackBody)
             };
-
+            console.log("调binaryMultipartUpload22");
             new this.$aliOss(res.ossConfig).multipartUpload(remoteName, file, {
                 progress: (percentage) => {
                     this.inProgress(Number((percentage * 100).toFixed(0)));

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

@@ -25,6 +25,8 @@
                             'DshCascader-edit-multiple-edit': true,
                             'DshCascader-row-edit': isMultipleRow,
                         }"
+                        @mouseenter="isHover = true"
+                        @mouseleave="isHover = false"
                         @click="clickInput"
                     >
                         <!-- 有值 -->
@@ -37,17 +39,26 @@
                                 }"
                                 @delete="deleteItem"
                             ></dsh-tags>
-
-                            <Icon
-                                class="icon-default"
-                                type="ios-arrow-down"
-                            />
                         </template>
-
                         <!-- 无值 -->
                         <template v-else>
                             {{ emptyShowVal }}
                         </template>
+
+                        <!-- 图标 -->
+                        <template>
+                            <Icon
+                                v-if="!$isEmptyData(curValList) && selfPropsObj._clearable && isHover"
+                                class="icon-close"
+                                type="ios-close-circle"
+                                @click.stop="clickClear"
+                            />
+                            <Icon
+                                v-else
+                                class="icon-default"
+                                :type="inputIcon"
+                            />
+                        </template>
                     </div>
                 </Cascader>
             </template>
@@ -74,7 +85,7 @@
                         <Icon
                             v-if="selfPropsObj._clearable && isHover"
                             class="icon-close"
-                            type="md-close"
+                            type="ios-close-circle"
                             @click.stop="clickClear"
                         />
                         <Icon
@@ -139,9 +150,6 @@
                             v-if="!$isEmptyData(curValList)"
                             class="text"
                             :list="curValNameList"
-                            :propsObj="{
-                                closable: false
-                            }"
                         ></dsh-tags>
 
                         <!-- 无值 -->
@@ -229,7 +237,7 @@
                 return {
                     _filterable: true,
                     _showMode: false,
-                    _transfer: false,
+                    _transfer: true,
                     ...this.propsObj,
                     ...this.commonDealPropsObj
                 };
@@ -268,6 +276,9 @@
             showMode () {
                 return this.selfPropsObj._showMode;
             },
+            inputIcon () {
+                return this.isVisible ? "ios-arrow-up" : "ios-arrow-down";
+            },
 
             // 多选用 名字组成的列表
             curValNameList () {

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

@@ -95,9 +95,6 @@
                         v-if="!$isEmptyData(curValList)"
                         class="text"
                         :list="curValObjList"
-                        :propsObj="{
-                            closable: false
-                        }"
                     ></dsh-tags>
 
                     <!-- 无值 -->

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

@@ -11,7 +11,7 @@
                     ...commonClass,
                     'DshCoordinates-edit': true
                 }"
-               @click.stop="clickOpenModal"
+                @click.stop="clickOpenModal"
             >
                 <div class="text">
                     {{ showText }}
@@ -20,7 +20,7 @@
                 <Icon
                     v-if="finalCanEdit && selfPropsObj._clearable"
                     class="icon-close"
-                    type="md-close"
+                    type="ios-close-circle"
                     @click.stop="clickDelete"
                 />
             </div>

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

@@ -40,7 +40,7 @@
                     <span class="DshDaterange-item-icon">
                         <Icon
                             v-show="val0"
-                            type="md-close"
+                            type="ios-close-circle"
                             @click.stop="clickClear('', 0)"
                         />
                         <Icon
@@ -77,7 +77,7 @@
                     <span class="DshDaterange-item-icon">
                         <Icon
                             v-show="val1"
-                            type="md-close"
+                            type="ios-close-circle"
                             @click.stop="clickClear('', 1)"
                         />
                         <Icon

package/src/components/controls/controlMixin.js

@@ -70,6 +70,12 @@ export default {
         controlKey () {
             return this.propsObj._key;
         },
+        // 字段的真实key
+        fieldKey () {
+            return this.controlKey === "_default"
+                ? this.value._key
+                : (this.propsObj.__realKey__ || this.controlKey);
+        },
         controlType () {
             return this.propsObj._type;
         },
@@ -111,6 +117,9 @@ export default {
         },
 
         // 部分控件或部分条件下 才使用的属性
+        isCore () {
+            return !!this.propsObj.isCore;
+        },
         inTable () {
             return !!this.propsObj.inTable;
         },

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

@@ -7,7 +7,7 @@
                 class="BriLabels-dropdown"
                 trigger="custom"
                 placement="bottom-start"
-                :visible="listVisible"
+                :visible="isVisible"
                 transfer
                 @on-clickoutside="clickInput"
             >
@@ -17,59 +17,68 @@
                         ...commonClass,
                         'BriLabels-edit': true
                     }"
+                    @mouseenter="isHover = true"
+                    @mouseleave="isHover = false"
                     @click="clickInput"
                 >
-                    <template v-if="!$isEmptyData(val)">
+                    <!-- 有值 -->
+                    <template v-if="!$isEmptyData(curValList)">
                         <dsh-tags
                             class="overflow"
-                            :list="val"
+                            :list="curValList"
                             :propsObj="{
                                 disabled: !finalCanEdit
                             }"
                             :autoEllipsis="true"
                             @delete="clickDeleteItem"
-                        >
-                            <span slot-scope="{ tagItem }">
-                                {{ tagItem.name }}
-                            </span>
-                        </dsh-tags>
+                        ></dsh-tags>
+                    </template>
+                    <!-- 无值 -->
+                    <template v-else>
+                        {{ emptyShowVal }}
+                    </template>
 
+                    <!-- 图标 -->
+                    <template>
+                        <Icon
+                            v-if="!$isEmptyData(curValList) && selfPropsObj._clearable && isHover"
+                            class="icon-close"
+                            type="ios-close-circle"
+                            @click.stop="clickClear"
+                        />
                         <Icon
+                            v-else
                             class="icon-default"
                             :type="inputIcon"
                         />
                     </template>
-
-                    <template v-else>
-                        {{ emptyShowVal }}
-                    </template>
                 </div>
 
                 <template #list>
                     <DropdownMenu class="BriLabels-dropdown-menu">
                         <DropdownItem
-                            v-for="item in listData"
-                            :key="item._key"
+                            v-for="listItem in listData"
+                            :key="listItem._key"
                             :class="{
                                 'item': true,
-                                'item-active': !!val.find(i=>i._key == item._key)
+                                'item-active': !!curValList.find(item => item._key === listItem._key)
                             }"
-                            @click.native="clickItem(item)"
+                            @click.native="clickItem(listItem)"
                         >
 
                             <div
-                                v-if="item.isEdit"
+                                v-if="listItem.isEdit"
                                 class="item-edit"
                             >
                                 <Input
-                                    v-model="item.name"
+                                    v-model="listItem.name"
                                     @click.native="clickEditInput($event)"
                                 >
                                 <template #suffix>
                                     <Icon
                                         color="#3DB8C5"
                                         custom="bri bri-duigou"
-                                        @click.native.stop="clickConfirm(item)"
+                                        @click.native.stop="clickConfirm(listItem)"
                                     />
                                 </template>
                                 </Input>
@@ -79,13 +88,13 @@
                                 v-else
                                 class="item-show"
                             >
-                                {{ item.name }}
+                                {{ listItem.name }}
                                 <span class="item-show-icons">
                                     <Icon
-                                        v-if="!item.coreLabel"
+                                        v-if="!listItem.coreLabel"
                                         class="item-show-icons-edit"
                                         custom="bri bri-bianji"
-                                        @click.stop="clickEditIcon(item)"
+                                        @click.stop="clickEditIcon(listItem)"
                                     />
                                     <!-- 暂时不需要删除 -->
                                     <!-- <Icon
@@ -97,7 +106,7 @@
                         </DropdownItem>
 
                         <div
-                            v-if="!selfPropsObj._onlySelect"
+                            v-if="!onlySelect"
                             class="btns"
                         >
                             <bri-button
@@ -117,7 +126,7 @@
         <!-- 查看 -->
         <template v-else>
             <bri-tooltip
-                :content="showValStr"
+                :content="showVal"
                 maxWidth="200"
                 :transfer="true"
             >
@@ -126,17 +135,10 @@
                     'BriLabels-show': true
                 }">
                     <dsh-tags
-                        v-if="!$isEmptyData(val)"
+                        v-if="!$isEmptyData(curValList)"
                         class="text"
-                        :list="val"
-                        :propsObj="{
-                            closable: false
-                        }"
-                    >
-                        <span slot-scope="{ tagItem }">
-                            {{ tagItem.name }}
-                        </span>
-                    </dsh-tags>
+                        :list="curValList"
+                    ></dsh-tags>
 
                     <template v-else>
                         {{ emptyShowVal }}
@@ -157,97 +159,99 @@
         ],
         data () {
             return {
+                isHover: false,
+
                 listData: [],
-                listVisible: false,
-                inputIcon: "ios-arrow-down",
+                isVisible: false,
                 renderList: false
             };
         },
         computed: {
             selfPropsObj () {
                 return {
+                    _labelType: "entity",
+                    _onlySelect: false,
+                    _originLabels: [],
+
                     ...this.propsObj,
                     ...this.commonDealPropsObj
                 };
             },
-            val: {
-                get () {
-                    return this.value[this.controlKey] || [];
-                },
-                set (val) {
-                    this.value[this.controlKey] = val;
-                }
-            },
 
-            isCore () {
-                return this.selfPropsObj.isCore;
+            labelType () {
+                return this.selfPropsObj._labelType;
+            },
+            onlySelect () {
+                return this.selfPropsObj._onlySelect;
             },
-            showValStr () {
-                let valArr = this.val && this.val.map(item => item.name);
-                return valArr && valArr.join("、");
+            originLabels () {
+                return this.selfPropsObj._originLabels;
+            },
+            inputIcon () {
+                return this.isVisible ? "ios-arrow-up" : "ios-arrow-down";
+            },
+
+            showVal () {
+                return this.$isEmptyData(this.curValList)
+                    ? this.emptyShowVal
+                    : this.curValList.map(item => item.name).join("、");
             }
         },
         created () {},
         methods: {
-            init () {
-                if (this.isCore) {
-                    this.listData = this.selfPropsObj._originLabels.map(item => {
-                        return {
-                            ...item,
-                            isEdit: false
-                        };
-                    });
-                } else {
-                    this.getListData();
-                }
-            },
-
             clickInput () {
-                if (!this.finalCanEdit) return;
-                if (!this.renderList) {
-                    this.init();
-                }
-                this.renderList = true;
-                this.listVisible = !this.listVisible;
-                if (this.listVisible) {
-                    this.inputIcon = "ios-arrow-up";
-                } else {
-                    this.inputIcon = "ios-arrow-down";
+                if (this.finalCanEdit) {
+                    if (!this.renderList) {
+                        if (this.isCore) {
+                            this.listData = this.originLabels.map(item => {
+                                return {
+                                    ...item,
+                                    isEdit: false
+                                };
+                            });
+                        } else {
+                            this.getListData();
+                        }
+                    }
+                    this.renderList = true;
+                    this.isVisible = !this.isVisible;
                 }
             },
             clickEditInput (e) {
                 e.stopPropagation();
             },
-            clickEditIcon (item) {
-                item.isEdit = true;
+            clickEditIcon (listItem) {
+                listItem.isEdit = true;
                 this.$forceUpdate();
             },
-            clickConfirm (item) {
-                if (item.name == "") return;
-                item.isEdit = false;
-                this.$forceUpdate();
-                this.change();
+            clickConfirm (listItem) {
+                if (listItem.name) {
+                    listItem.isEdit = false;
+                    this.$forceUpdate();
+                };
             },
 
-            clickItem (item) {
-                if (this.val.findIndex(i => i._key == item._key) > -1) {
-                    this.val = this.val.filter(i => i._key != item._key);
+            clickItem (listItem) {
+                if (this.curValList.some(item => item._key === listItem._key)) {
+                    this.curValList = this.curValList.filter(item => item._key !== listItem._key);
                 } else {
-                    this.val.push(item);
+                    this.curValList = [...this.curValList, listItem];
                 }
-                this.change();
-            },
-            clickDeleteItem (item) {
-                this.change();
             },
             clickAddItem () {
                 this.listData.push({
                     _key: this.$randomB36("Labels"),
                     isEdit: true,
                     name: "",
-                    labelType: this.selfPropsObj._labelType
+                    labelType: this.labelType
                 });
-                this.change();
+            },
+            clickDeleteItem (deleteItem) {
+                this.curValList = this.curValList.filter(item => item._key !== deleteItem._key);
+            },
+            // 点击清除选择项
+            clickClear () {
+                this.curValList = [];
             },
 
             // 接口 -获取列表数据
@@ -259,10 +263,10 @@
                     },
                     params: {
                         search: {
-                            entityKey: this.entityKey, // 当前工作表关联的数据表Key
-                            fieldKey: this.selfPropsObj._key === "_default" ? this.value._key : (this.selfPropsObj.__realKey__ || this.selfPropsObj._key), // 当前字段Key
-                            labelType: this.selfPropsObj._labelType,
-                            modKey: this.modKey
+                            entityKey: this.entityKey,
+                            modKey: this.modKey,
+                            fieldKey: this.fieldKey, // 当前字段Key
+                            labelType: this.labelType
                         },
                         pagination: {
                             page: 1,

package/src/components/controls/senior/selectDepartments.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>
@@ -93,7 +94,7 @@
                         </span>
                         <Icon
                             class="item-delete"
-                            type="md-close"
+                            type="ios-close-circle"
                             @click="deleteSelect(selectItem, selectIndex, newValList)"
                         />
                     </span>
@@ -246,6 +247,10 @@
             highSearch () {
                 return this.selfPropsObj._highSearch;
             },
+            inputIcon () {
+                return this.multiple ? "ios-people" : "ios-person";
+            },
+
             // 暂时没配置
             isCascader () {
                 return this.selfPropsObj._isCascader;