bri-components 1.2.53 → 1.2.55

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

@@ -1,319 +0,0 @@
-<template>
-    <div class="InfoCascader">
-        <dsh-modal
-            v-model="modalVal"
-            mode="middle"
-            :propsObj="modalPropsObj"
-        >
-            <dsh-input
-                class="InfoCascader-search"
-                :value="searchData"
-                :propsObj="searchPropsObj"
-            ></dsh-input>
-
-            <div class="InfoCascader-content">
-                <div class="InfoCascader-content-left">
-                    <Tree
-                        v-if="show"
-                        expand-node
-                        :data="treeData"
-                    ></Tree>
-                </div>
-
-                <div class="InfoCascader-content-right">
-                    <div class="InfoCascader-content-right-title">
-                        {{curName}}说明
-                    </div>
-                    <p
-                        class="InfoCascader-content-right-content"
-                        v-html="description"
-                    >
-                    </p>
-                </div>
-            </div>
-
-            <div class="InfoCascader-footer">
-                <dsh-buttons
-                    class="InfoCascader-footer-btns"
-                    :list="$getOperationList(['canCancel', 'canConfirm'])"
-                    @click="$dispatchEvent($event)"
-                ></dsh-buttons>
-            </div>
-        </dsh-modal>
-    </div>
-</template>
-
-<script>
-    export default {
-        name: "InfoCascader",
-        props: {
-            showModal: {
-                type: Boolean,
-                default: false
-            },
-
-            value: {
-                type: Array,
-                default () {
-                    return [];
-                }
-            },
-            data: {
-                type: Array,
-                default () {
-                    return [];
-                }
-            },
-            propsObj: {
-                type: Object,
-                default () {
-                    return {};
-                }
-            }
-        },
-        data () {
-            return {
-                searchData: {
-                    search: ""
-                },
-                searchPropsObj: {
-                    _key: "search",
-                    _name: "关键字搜索"
-                },
-                curSelect: {},
-
-                show: true,
-                curName: "",
-                description: "",
-
-                operationMap: {
-                    canCancel: {
-                        name: "取消",
-                        type: "clickCancel",
-                        event: "clickCancel",
-                        class: "z-default"
-                    },
-                    canConfirm: {
-                        name: "确定",
-                        btnType: "primary",
-                        type: "clickConfirm",
-                        event: "clickConfirm",
-                        class: "z-primary"
-                    }
-                }
-            };
-        },
-        computed: {
-            modalVal: {
-                get () {
-                    return this.showModal;
-                },
-                set (val) {
-                    this.$emit("changeShowModal", val);
-                }
-            },
-            modalPropsObj () {
-                return {
-                    title: this.propsObj._name
-                };
-            },
-            initData () {
-                return this.loop(this.data, null, this.value);
-            },
-            treeData () {
-                if (!this.searchData.search) { // 内容为空时，查询所有
-                    return this.initData;
-                }
-                let that = this;
-                const rebuildData = (value, treeList) => {
-                    that.show = false;
-                    let newarr = [];
-                    treeList.forEach(element => {
-                        if (element.children && element.children.length) {
-                            const ab = rebuildData(value, element.children);
-                            const obj = {
-                                ...element,
-                                expand: true,
-                                children: ab
-                            };
-                            if (ab && ab.length) {
-                                newarr.push(obj);
-                            } else if (element.title.indexOf(value) > -1) {
-                                element.expand = true;
-                                newarr.push(element);
-                            }
-                        } else {
-                            if (element.title.indexOf(value) > -1) {
-                                newarr.push(element);
-                            }
-                        }
-                    });
-                    that.show = true;
-                    return newarr;
-                };
-                return rebuildData(this.searchData.search, this.initData);
-            }
-        },
-        created () {
-            this.curSelect.codeArr = this.value;
-            if (this.value && this.value.length) {
-                // 回显已选择的名称
-                const loop = (arr) => {
-                    for (let item of arr) {
-                        if (item.codeArr.length == this.value.length && item.codeArr.every((code, idx) => code === this.value[idx])) {
-                            this.curName = item.name;
-                            break;
-                        }
-                        if (item.children.length) {
-                            loop(item.children);
-                        }
-                    }
-                };
-                loop(this.initData);
-                this.getDescription(this.value);
-            }
-        },
-        methods: {
-            change (node) {
-                this.curName = node.name;
-                if (node.codeArr.length && this.curSelect.codeArr && this.curSelect.codeArr.length === node.codeArr.length && node.codeArr.every((code, idx) => code === this.curSelect.codeArr[idx])) {
-                    this.curSelect = {};
-                } else {
-                    if (!this.propsObj._cascaderLevel || node.level == this.propsObj._cascaderLevel || !node.children.length) {
-                        this.curSelect = node;
-                    }
-                    this.getDescription(node.codeArr);
-                }
-            },
-            getDescription (nodeKeys) {
-                this.$https({
-                    url: {
-                        module: "sheet",
-                        name: "getResourceDescription"
-                    },
-                    params: {
-                        resourceKey: this.propsObj._resourceKey,
-                        nodeKeys
-                    },
-                    callback: data => {
-                        this.description = data;
-                    }
-                });
-            },
-            clickCancel () {
-                this.$emit("changeShowModal", false);
-            },
-            clickConfirm () {
-                if (this.curName) {
-                    this.$emit("input", this.curSelect.codeArr);
-                    this.$emit("change", this.curSelect.codeArr);
-                    this.$emit("changeShowModal", false);
-                } else {
-                    this.$Message.warning(`请选择${this.propsObj._name}!`);
-                }
-
-            },
-            loop (data = [], level, codeArr) {
-                return data
-                    ? data.reduce((arr, item) => {
-                        item.expand = false;
-                        if (this.value.length) {
-                            let arr = this.$getTreeLinealDatas(this.value, this.data);
-                            arr.forEach(i => { i.expand = true; });
-                        }
-                        const newItem = {
-                            ...item,
-                            value: item._key,
-                            title: item.name,
-                            disabled: this.propsObj._cascaderLevel ? (item.level < this.propsObj._cascaderLevel) : true,
-                            render: (h, { root, node, data }) => {
-                                return h("span", {
-                                    class: {
-                                        "ivu-tree-title-selected": this.curSelect.codeArr && this.curSelect.codeArr.length && this.curSelect.codeArr.length === data.codeArr.length && this.curSelect.codeArr.every((code, idx) => code === data.codeArr[idx])
-                                    },
-                                    style: {
-                                        display: "inline-block",
-                                        width: "100%"
-                                    },
-                                    on: {
-                                        click: () => {
-                                            this.change(data);
-                                        }
-                                    }
-                                }, data.title);
-                            }
-                        };
-                        if (!level || level > item.level) {
-                            newItem.children = this.loop(item.children, level, this.value);
-                        }
-                        arr.push(newItem);
-
-                        return arr;
-                    }, [])
-                    : [];
-            }
-        }
-    };
-</script>
-
-<style lang="less">
-    .InfoCascader {
-        height: 100%;
-
-        &-search {
-            padding: 24px 24px 0;
-            width: 100%;
-        }
-
-        &-content {
-            height: calc(100% - 142px);
-            margin: 5px 24px 24px;
-            display: flex;
-            border: 1px solid #E5E5E5;
-
-            &-left {
-                flex: 1;
-                padding: 5px 0 5px 10px;
-                overflow: auto;
-                border-right: 1px solid #E5E5E5;
-            }
-
-            &-right {
-                flex: 1;
-
-                &-title {
-                    border-bottom: 1px solid #E5E5E5;
-                    font-weight: 700;
-                    // height: 32px;
-                    // line-height: 32px;
-
-                    padding: 6px 16px;
-                }
-
-                &-content {
-                    height: calc(100% - 32px);
-                    overflow: auto;
-                    padding: 16px;
-                    white-space: pre-line;
-                }
-            }
-
-            .ivu-tree-title-selected {
-                color: #3D84EE;
-                background-color: #eee;
-            }
-
-            .ivu-tree-empty {
-                text-align: center;
-            }
-        }
-
-        &-footer {
-            &-btns {
-                display: flex;
-                justify-content: flex-end;
-                padding-right: 16px;
-            }
-        }
-    }
-</style>