bri-components 1.2.2 → 1.2.4

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "bri-components",
-    "version": "1.2.2",
+    "version": "1.2.4",
     "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,7 @@ export default {
                 callback: res => {
                     this.inputType = "file";
                     if (res.ossType === "ali-oss") {
-                        // 上传到阿里云
+                        // 上传到阿里云res
                         this[this.computedOssType](file, res, callback);
                     } else if (res.ossType === "local") {
                         this.localUpload(file, res, callback);
@@ -259,7 +259,6 @@ export default {
         binaryMultipartUpload (file, res, callback) {
             let type = "jpg";
             let remoteName = `${this.randomTimeStampFn()}.${type}`;
-
             // 上传成功的回调参数
             let callbackBody = {
                 name: remoteName,
@@ -278,7 +277,21 @@ export default {
                 callbackBody: this.transferCallBody(callbackBody)
             };
 
-            new this.$aliOss(res.ossConfig).multipartUpload(remoteName, file, {
+            let newOss = {
+                ...res.ossConfig,
+                refreshSTSToken: async () => {
+                    // 向您搭建的STS服务获取临时访问凭证。
+                    return {
+                        accessKeyId: res.ossConfig.accessKeyId, // 自己账户的accessKeyId或临时秘钥
+                        accessKeySecret: res.ossConfig.accessKeySecret, // 自己账户的accessKeySecret或临时秘钥
+                        stsToken: res.ossConfig.stsToken //  从STS服务获取的安全令牌（SecurityToken）。
+                    };
+                },
+                // 刷新临时访问凭证的时间间隔，单位为毫秒。
+                refreshSTSTokenInterval: 3600 * 1000
+            };
+
+            new this.$aliOss(newOss).multipartUpload(remoteName, file, {
                 progress: (percentage) => {
                     this.inProgress(Number((percentage * 100).toFixed(0)));
                     this.handleProgress && this.handleProgress(percentage, file);

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"
                     >
                         <!-- 有值 -->
@@ -33,21 +35,31 @@
                                 class="overflow"
                                 :list="curValNameList"
                                 :propsObj="{
-                                    disabled: !finalCanEdit
+                                    disabled: !finalCanEdit,
+                                    closable: true
                                 }"
                                 @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 +86,7 @@
                         <Icon
                             v-if="selfPropsObj._clearable && isHover"
                             class="icon-close"
-                            type="md-close"
+                            type="ios-close-circle"
                             @click.stop="clickClear"
                         />
                         <Icon
@@ -139,9 +151,6 @@
                             v-if="!$isEmptyData(curValList)"
                             class="text"
                             :list="curValNameList"
-                            :propsObj="{
-                                closable: false
-                            }"
                         ></dsh-tags>
 
                         <!-- 无值 -->
@@ -229,7 +238,7 @@
                 return {
                     _filterable: true,
                     _showMode: false,
-                    _transfer: false,
+                    _transfer: true,
                     ...this.propsObj,
                     ...this.commonDealPropsObj
                 };
@@ -268,6 +277,9 @@
             showMode () {
                 return this.selfPropsObj._showMode;
             },
+            inputIcon () {
+                return this.isVisible ? "ios-arrow-up" : "ios-arrow-down";
+            },
 
             // 多选用 名字组成的列表
             curValNameList () {

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

@@ -8,11 +8,11 @@
             <template v-if="showType === 'flat'">
                 <CheckboxGroup
                     :class="{
-                    'DshCheckbox-group': true,
-                    'DshCheckbox-group-color': useColor,
-                    'DshCheckbox-group-disabled': !canEdit,
-                    'DshCheckbox-group-scroll': selfPropsObj._span < 24 && !selfPropsObj._br,
-                }"
+                        'DshCheckbox-group': true,
+                        'DshCheckbox-group-color': useColor,
+                        'DshCheckbox-group-disabled': !canEdit,
+                        'DshCheckbox-group-scroll': selfPropsObj._span < 24 && !selfPropsObj._br,
+                    }"
                     v-model="curValList"
                 >
                     <!-- 有选项 -->
@@ -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,8 +20,8 @@
                 <Icon
                     v-if="finalCanEdit && selfPropsObj._clearable"
                     class="icon-close"
-                    type="md-close"
-                    @click.stop="clickDelete"
+                    type="ios-close-circle"
+                    @click.stop="clickClear"
                 />
             </div>
         </bri-tooltip>
@@ -81,7 +81,7 @@
                             :value="curVal.name"
                             :readonly="true"
                             :clearable="true"
-                            @on-clear="clickClear"
+                            @on-clear="clickModalClear"
                             @click.native="clickMapFitView"
                         />
                         </Col>
@@ -238,7 +238,7 @@
                 this.curVal = this.cloneValue;
             },
             // 点击删除
-            clickDelete () {
+            clickClear () {
                 this.curVal = {
                     name: "",
                     lnglat: []
@@ -246,7 +246,7 @@
                 this.$emit("change", []);
             },
             // 清除已选内容
-            clickClear () {
+            clickModalClear () {
                 this.curVal = {
                     name: "",
                     lnglat: []

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,69 @@
                         ...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
+                                disabled: !finalCanEdit,
+                                closable: true
                             }"
                             :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 +89,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 +107,7 @@
                         </DropdownItem>
 
                         <div
-                            v-if="!selfPropsObj._onlySelect"
+                            v-if="!onlySelect"
                             class="btns"
                         >
                             <bri-button
@@ -117,7 +127,7 @@
         <!-- 查看 -->
         <template v-else>
             <bri-tooltip
-                :content="showValStr"
+                :content="showVal"
                 maxWidth="200"
                 :transfer="true"
             >
@@ -126,17 +136,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 +160,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 +264,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,