bri-components 1.2.53 → 1.2.55

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

@@ -29,19 +29,18 @@
                 @on-change="changeVal($event, 0)"
                 @on-open-change="changeOpen($event, 0)"
             >
-                <bri-control-input
+                <dsh-control-input
                     :class="{
                         ...commonClass,
                         'bri-control-nodata': this.$isEmptyData(this.showVal0),
                         'DshDaterange-item': true
                     }"
-                    :canEdit="finalCanEdit"
                     :value="showVal0"
-                    inputIcon="ios-calendar-outline"
+                    :disabled="selfPropsObj._disabled"
                     :propsObj="selfPropsObj"
                     @clear="clickClear('', 0)"
                     @click.native="changeOpen(true, 0)"
-                ></bri-control-input>
+                ></dsh-control-input>
             </DatePicker>
 
             <span class="DshDaterange-center"> — </span>
@@ -59,19 +58,18 @@
                 @on-change="changeVal($event, 1)"
                 @on-open-change="changeOpen($event, 1)"
             >
-                <bri-control-input
+                <dsh-control-input
                     :class="{
                         ...commonClass,
                         'bri-control-nodata': this.$isEmptyData(this.showVal1),
                         'DshDaterange-item': true
                     }"
-                    :canEdit="finalCanEdit"
                     :value="showVal1"
-                    inputIcon="ios-calendar-outline"
+                    :disabled="selfPropsObj._disabled"
                     :propsObj="selfPropsObj"
                     @clear="clickClear('', 1)"
                     @click.native="changeOpen(true, 1)"
-                ></bri-control-input>
+                ></dsh-control-input>
             </DatePicker>
         </template>
     </div>
@@ -212,12 +210,11 @@
         computed: {
             selfPropsObj () {
                 return {
+                    _icon: "ios-calendar-outline",
                     _useShortcuts: true,
 
                     ...this.propsObj,
-                    ...this.commonDealPropsObj,
-
-                    _type: "date"
+                    ...this.commonDealPropsObj
                 };
             },
             subType () {
@@ -310,7 +307,13 @@
                         return val
                             ? this.isDynDateKey(val)
                                 ? true
-                                : !this.$isComparedAccord(this.selfPropsObj, this.selfPropsObj, date, val, config).bool
+                                : !this.$isComparedAccord({
+                                    ...this.selfPropsObj,
+                                    _type: "date"
+                                }, {
+                                    ...this.selfPropsObj,
+                                    _type: "date"
+                                }, date, val, config).bool
                             : false;
                     }
                 };

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

@@ -45,7 +45,7 @@
                     'DshEditor-unit': !$isEmptyData(curVal)
                 }"
             >
-                {{ $isEmptyData(curVal) ? emptyShowVal : "富文本达成纳斯达克了城市的女你说的 v 是对女生看到 v 你说的 v 说" }}
+                {{ $isEmptyData(curVal) ? emptyShowVal : "富文本" }}
             </div>
 
             <!-- 查看页里 的查看 -->

package/src/components/controls/controlMixin.js

@@ -90,7 +90,9 @@ export default {
         },
         // 是否为多选模式
         multipleMode () {
-            return ["texts", "numberange", "daterange", "checkbox", "regions", "cascaders"].includes(this.controlType) || !!this.propsObj._multiple;
+            return this.isOnDftSearch || this.isOnSearch
+                ? true
+                : ["texts", "numberange", "daterange", "checkbox", "regions", "cascaders"].includes(this.controlType) || !!this.propsObj._multiple;
         },
         commonDealPropsObj () {
             const selectControlTypes = ["date", "switch", "select", "checkbox", "file", "region", "regions", "cascader", "cascaders", "coordinates", "users", "departments"];
@@ -160,11 +162,19 @@ export default {
         modKey () {
             return this.propsObj.modKey;
         },
-        // 移动端在用 --只做校验的field框所用的propsObj
+
+        /* 移动端在用 */
+        // 只做校验而隐藏的的field框，所用的propsObj
         ruleFieldPropsObj () {
             return {
                 _rules: this.propsObj._rules
             };
+        },
+        // 只做校验而隐藏的的field框，所用的value
+        ruleFieldStr () {
+            return this.$isEmptyData(this.curVal) && this.$isEmptyData(this.curValList)
+                ? ""
+                : "有值";
         }
     },
     methods: {
@@ -180,11 +190,11 @@ export default {
         toggleModal (bool) {
             this.showModal = bool;
         },
-        // 打开弹框
+        // 打开弹框 ---！！！！pc端的selectUsers、selectDepartments控件，外部调用组件时也在使用，不能轻易删除
         openModal () {
             this.showModal = true;
         },
-        // 关闭弹框
+        // 关闭弹框 ---！！！！pc端的selectUsers、selectDepartments控件，外部调用组件时也在使用，不能轻易删除
         closeModal () {
             this.showModal = false;
         }

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

@@ -12,18 +12,15 @@
                 @on-clickoutside="clickInput"
             >
                 <!-- 可编辑 -->
-                <bri-control-input
-                    :class="{
-                        ...commonClass
-                    }"
-                    :canEdit="finalCanEdit"
+                <dsh-control-input
+                    :class="commonClass"
                     :value="curValList"
-                    :inputIcon="inputIcon"
+                    :disabled="selfPropsObj._disabled"
                     :propsObj="selfPropsObj"
                     @deleteItem="clickDeleteItem"
                     @clear="clickClear"
                     @click.native="clickInput"
-                ></bri-control-input>
+                ></dsh-control-input>
 
                 <template #list>
                     <DropdownMenu class="BriLabels-dropdown-menu">
@@ -137,6 +134,7 @@
         computed: {
             selfPropsObj () {
                 return {
+                    _icon: this.isVisible ? "ios-arrow-up" : "ios-arrow-down",
                     _labelType: "entity",
                     _onlySelect: false,
                     _originLabels: [],
@@ -154,9 +152,6 @@
             originLabels () {
                 return this.selfPropsObj._originLabels;
             },
-            inputIcon () {
-                return this.isVisible ? "ios-arrow-up" : "ios-arrow-down";
-            },
 
             showVal () {
                 return this.$isEmptyData(this.curValList)

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

@@ -39,7 +39,7 @@
                     <dsh-buttons
                         class="flatTable-btns"
                         itemClass="flatTable-btns-item"
-                        :list="$getOperationList(['canEnlarge'])"
+                        :list="$getOperationList(operationFieldList)"
                         @click="$dispatchEvent($event)"
                     ></dsh-buttons>
 
@@ -75,6 +75,14 @@
                 </template>
             </template>
         </template>
+
+        <flat-table-import-modal
+            v-if="showBatchImportModal"
+            :value="showBatchImportModal"
+            :propsObj="propsObj"
+            :importParams="importParams"
+            @input="toggleBatchImportModal"
+        ></flat-table-import-modal>
     </div>
 </template>
 
@@ -82,6 +90,7 @@
     import controlMixin from "../controlMixin.js";
     import DshBtnModal from "../../small/DshBtnModal.vue";
     import BriFlatTable from "../../list/BriFlatTable.vue";
+    import flatTableImportModal from "./flatTableImportModal.vue";
 
     export default {
         name: "flatTable",
@@ -90,7 +99,8 @@
         ],
         components: {
             DshBtnModal,
-            BriFlatTable
+            BriFlatTable,
+            flatTableImportModal
         },
         props: {},
         data () {
@@ -105,8 +115,26 @@
                         size: "small",
                         btnType: "text",
                         event: "enlarge"
+                    },
+                    canImport: {
+                        name: "导入",
+                        type: "canImport",
+                        icon: "ios-create-outline",
+                        size: "small",
+                        btnType: "text",
+                        event: "clickBatchImport"
+                    },
+                    canExport: {
+                        name: "导出",
+                        type: "canExport",
+                        icon: "md-share-alt",
+                        size: "small",
+                        btnType: "text",
+                        event: "clickExport"
                     }
-                }
+                },
+
+                showBatchImportModal: false
             };
         },
         computed: {
@@ -119,6 +147,7 @@
                 };
             },
             columns () {
+                console.log(this.propsObj);
                 return this.propsObj._subForm;
             },
 
@@ -129,10 +158,97 @@
                     showSlotClose: false,
                     closable: true
                 };
+            },
+
+            operationFieldList () {
+                let btnList = ["canEnlarge"];
+                if (this.propsObj._isExport) {
+                    btnList.unshift("canExport");
+                }
+                if (this.propsObj._isImport) {
+                    btnList.unshift("canImport");
+                }
+
+                return btnList;
+            },
+            screenKey () {
+                return this.propsObj.screenKey;
+            },
+            importParams () {
+                return {
+                    _key: this.controlKey,
+                    _id: this.value._id
+                };
             }
         },
         created () {},
         methods: {
+            clickBatchImport () {
+                this.openBatchImportModal();
+            },
+            openBatchImportModal () {
+                this.showBatchImportModal = true;
+            },
+            // 关闭批量导入模态框
+            closeBatchImportModal () {
+                this.showBatchImportModal = false;
+            },
+            // 切换批量导入模态框
+            toggleBatchImportModal (bool) {
+                bool ? this.openBatchImportModal() : this.closeBatchImportModal();
+            },
+            // 导出点击
+            clickExport (operationItem) {
+                operationItem.disabled = true;
+                this.$https({
+                    url: {
+                        module: "sheet",
+                        name: "exportFlatTableExcel"
+                    },
+                    params: {
+                        _key: this.controlKey,
+                        _id: this.value._id,
+                        screenKey: this.screenKey
+                    },
+                    callback: data => {
+                        setTimeout(() => {
+                            operationItem.disabled = false;
+                        }, 500);
+                        this.timer = setInterval(this.getTransitStatus(data.jobId, data.excel_url), 1000);
+                    }
+                });
+            },
+            getTransitStatus (id, url) {
+                let that = this;
+                return function () {
+                    that.getJobStatus(id, url);
+                };
+            },
+            getJobStatus (id, url) {
+                this.$https({
+                    url: {
+                        module: "sheet",
+                        name: "getJobStatus"
+                    },
+                    params: {
+                        jobId: id
+                    },
+                    callback: data => {
+                        if (data.status === "completed") {
+                            clearInterval(this.timer);
+                            window.location.href = data.url;
+                        } else if (data.status === "failed") {
+                            clearInterval(this.timer);
+                            // this.exportBtnLoading = false;
+                            this.$Message.info({ content: "操作失败，请稍后再试" });
+                        }
+                    },
+                    error: data => {
+                        this.timer = null;
+                    }
+                });
+            },
+
             // 校验方法 -供外部使用
             validate () {
                 return this.$refs.dshFatTable.validate();

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

@@ -0,0 +1,279 @@
+<template>
+    <div class="flatTableImportModal">
+        <dsh-modal
+            class="flatTableImportModal-modal"
+            v-model="showModal"
+            :mode="modalPropsObj.mode"
+            :propsObj="modalPropsObj"
+        >
+            <div style="padding: 20px;">
+                <Upload
+                    style="margin-bottom: 20px;"
+                    :action="window.config.apiUrl+`/app/${this.appKey}/xMod/${modKey}/member/importExcel`"
+                    :headers="undefined"
+                    :data="importParams"
+                    :name="'file_stream'"
+                    :multiple="false"
+                    :paste="false"
+                    :disabled="false"
+                    type="drag"
+                    :with-credentials="false"
+                    accept="xlsx"
+                    :format="format"
+                    :show-upload-list="true"
+                    :default-file-list="[]"
+                    :max-size="20480"
+                    :on-format-error="handleImportFormatError"
+                    :before-upload="beforeUpload"
+                >
+                    <Icon
+                        type="md-cloud-upload"
+                        size="60"
+                    />
+                    <p>点击或者拖拽文件到此处上传</p>
+                </Upload>
+
+                <div v-if="file !== null">
+                    <div class="flatTableImportModal-file">
+                        <span>文件名称: {{ file.name }}</span>
+                        <Icon
+                            class="flatTableImportModal-file-cancel"
+                            type="ios-close"
+                            @click="cacelUpload"
+                        />
+                    </div>
+                    <Button
+                        type="primary"
+                        :loading="loadingStatus"
+                        @click="handleUpload"
+                    >
+                        {{ loadingStatus ? '上传中' : '上传' }}
+                    </Button>
+                </div>
+
+                <!-- 导入说明 -->
+                <div>
+                    <p style="display: flex; padding: 5px 0px;">
+                        <strong style="width: 75px;">新增记录：</strong>
+                        <span style="flex: 1;">
+                            下载
+                            <a @click="handleExportTemplate()">
+                                《{{ tempName }}模板》
+                            </a>
+                            ，在本地新增记录后，导入文件
+                        </span>
+                    </p>
+                    <p style="display: flex; padding: 5px 0px;">
+                        <strong style="width: 75px;">更新记录：</strong>
+                        <span style="flex: 1;">在工作表中选择需要更新的记录导出，在本地更新记录后，导入文件</span>
+                    </p>
+                </div>
+            </div>
+        </dsh-modal>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: "flatTableImportModal",
+        props: {
+            value: {
+                type: Boolean,
+                default: false
+            },
+            propsObj: {
+                type: Object,
+                default () {
+                    return {};
+                }
+            },
+            importParams: {
+                type: Object,
+                default () {
+                    return {};
+                }
+            }
+        },
+        data () {
+            return {
+                modalPropsObj: {
+                    mode: "middle",
+                    title: "导入excel数据",
+                    width: "960",
+                    className: "vertical-center-modal",
+                    footerHide: true
+                },
+
+                format: ["xlsx"],
+                file: null,
+                loadingStatus: false,
+                window: window,
+                timer1: null
+            };
+        },
+        computed: {
+            showModal: {
+                get () {
+                    return this.value;
+                },
+                set (val) {
+                    this.$emit("input", val);
+                }
+            },
+            tempName () {
+                return this.propsObj._name || "";
+            },
+            modKey () {
+                return this.propsObj.modKey;
+            },
+            screenKey () {
+                return this.propsObj.screenKey;
+            },
+            appKey () {
+                return this.propsObj.appKey;
+            }
+        },
+        created () {},
+        methods: {
+            // 接口 -下载excel模板
+            handleExportTemplate () {
+                if (this.timer) return;
+                this.$https({
+                    url: {
+                        module: "sheet",
+                        name: "exportTemplate"
+                    },
+                    params: {
+                        screenKey: this.screenKey,
+                        ...this.importParams
+                    },
+                    callback: data => {
+                        this.timer = setInterval(this.getTransitStatus(data.jobId), 1000);
+                    }
+                });
+            },
+            // 上传文件before函数
+            beforeUpload (file) {
+                this.file = file;
+                return false;
+            },
+
+            cacelUpload () {
+                this.file = null;
+            },
+            // 监控上传文件的类型
+            handleImportFormatError (file) {
+                this.$Notice.warning({
+                    title: "文件格式不正确!",
+                    desc: `<span style="color: red;">${file.name}</span> 的文件格式不正确。<br/>请上传${this.format}的文件类型!`,
+                    duration: 0
+                });
+            },
+            handleUpload () {
+                this.loadingStatus = true;
+                let formData = new FormData();
+                formData.append("file_stream", this.file);
+                formData.append("modKey", this.modKey);
+                this.importParams._key && formData.append("_key", this.importParams._key);
+                this.importParams._id && formData.append("_id", this.importParams._id);
+                this.$https({
+                    url: {
+                        module: "sheet",
+                        name: "importExcel"
+                    },
+                    params: formData,
+                    content: {
+                        headers: { "Content-Type": "multipart/form-data" }
+                    },
+                    callback: data => {
+                        this.timer = setInterval(this.getTransitStatus(data.jobId, "import"), 1000);
+                    },
+                    error: data => {
+                        this.$Message.error("导入失败:" + data.msg);
+                        this.file = null;
+                        this.file = null;
+                        this.loadingStatus = false;
+                    }
+                });
+            },
+
+            getTransitStatus (id, type) {
+                let that = this;
+                return function () {
+                    if (type && type === "import") {
+                        that.getImportJobStatus(id);
+                    } else {
+                        that.getJobStatus(id);
+                    }
+                };
+            },
+            // 状态查询
+            getJobStatus (id) {
+                this.$https({
+                    url: {
+                        module: "sheet",
+                        name: "getJobStatus"
+                    },
+                    params: {
+                        jobId: id
+                    },
+                    callback: data => {
+                        if (data.status === "completed") {
+                            clearInterval(this.timer);
+                            window.location.href = data.url;
+                        } else if (data.status === "failed") {
+                            clearInterval(this.timer);
+                            this.$Message.info({ content: "操作失败，请稍后再试" });
+                        }
+                    },
+                    error: data => {
+                        this.timer = null;
+                    }
+                });
+            },
+            // 导入状态查询
+            getImportJobStatus (id) {
+                this.$https({
+                    url: {
+                        module: "sheet",
+                        name: "getImportJobStatus"
+                    },
+                    params: {
+                        jobId: id
+                    },
+                    callback: data => {
+                        if (data.status === "over") {
+                            clearInterval(this.timer);
+                            this.$Message.success("导入成功");
+                            this.file = null;
+                            this.loadingStatus = false;
+                            this.showModal = false;
+                            this.$emit("importCb");
+                        } else if (data.status === "check-fai" || data.status === "fai") {
+                            clearInterval(this.timer);
+                            this.$Message.info({ content: data.faiMsg });
+                            this.loadingStatus = false;
+                        }
+                    },
+                    error: data => {
+                        this.timer = null;
+                    }
+                });
+            }
+        }
+    };
+</script>
+
+<style lang="less">
+    .sheetBatchImportModal {
+        &-file {
+            position: relative;
+
+            &-cancel {
+                cursor: pointer;
+                float: right;
+                font-size: @titleSize;
+            }
+        }
+    }
+</style>

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

@@ -9,18 +9,15 @@
             <div @click.stop="clickInput">
                 <slot>
                     <!-- 编辑 -->
-                    <bri-control-input
+                    <dsh-control-input
                         v-if="canEdit"
-                        :class="{
-                            ...commonClass
-                        }"
-                        :canEdit="finalCanEdit"
+                        :class="commonClass"
                         :value="curValList"
-                        :inputIcon="inputIcon"
+                        :disabled="selfPropsObj._disabled"
                         :propsObj="selfPropsObj"
                         @deleteItem="clickDeleteItem"
                         @clear="clickClear"
-                    ></bri-control-input>
+                    ></dsh-control-input>
 
                     <!-- 查看 -->
                     <div
@@ -171,7 +168,7 @@
         computed: {
             selfPropsObj () {
                 return {
-                    _multiple: false,
+                    _icon: this.multipleMode ? "ios-people" : "ios-person",
                     _highSearch: false,
                     _changeOnSelect: true,
                     _searchString: "",
@@ -189,9 +186,6 @@
             searchString () {
                 return this.selfPropsObj._searchString;
             },
-            inputIcon () {
-                return this.multipleMode ? "ios-people" : "ios-person";
-            },
 
             modalPropsObj () {
                 return {
@@ -220,14 +214,6 @@
         },
         created () {},
         methods: {
-            // 外部也在使用
-            openModal () {
-                this.showModal = true;
-            },
-            closeModal () {
-                this.showModal = false;
-            },
-
             // 搜索
             search () {
                 this.getListData();