ocpview-plus 0.0.1

package/src/components/masterplate/levelreport.vue

@@ -0,0 +1,510 @@
+<template>
+  <Card :padding="0"  dis-hover :bordered="false"  :style="'background:#fff;overflow:hidden;height:' + clientHeight +'px'">
+     <div ref="toolbarcard" >
+         <Card :padding="0" style="padding-top:14px;padding-left:16px;padding-right:16px;border-radius:0px;" :bordered="false" dis-hover>
+            <ListBtnToolbar ref="menutoolbar" :config="menuToolbar"  :moduleMethod="moduleMethod"   @doAction="doAction"/>
+            <Divider style="margin-top:16px;margin-bottom:0px;" />
+        </Card>
+    </div>
+    <div ref="formcard">
+    <Card v-show="showSearchPara"  :bordered="false" :padding="0" style="padding-left:14px;padding-right:14px;padding-top:0px;padding-bottom:0px" dis-hover>
+        <Formcards  ref="form"  :config="myConfig.formConfig" :dictData="dictData" />
+    </Card>
+    </div>
+    <div ref="bread">
+        <Card :padding="0" dis-hover  :bordered="false" style="padding-left:14px;padding-right:14px;padding-top:0px;padding-bottom:0px" >
+            <Breadcrumb >
+                <BreadcrumbItem v-for="(temp,index) in levelData" to="click" :key="index" @click="levelClick(temp)">
+                    <span v-if="index === (levelData.length - 1)" style="text-decoration: underline;" class="efuture-leveltextname">{{temp.name}}</span>
+                    <span v-else style="text-decoration: underline;color:#303133">{{temp.name}}</span>
+                </BreadcrumbItem>
+            </Breadcrumb>
+        </Card>
+    </div>
+    <Card :padding="0" :bordered="false" style="padding:14px 16px" dis-hover>
+        <SimpleViewGrid v-if="reset" ref="grid" :config="gridConfig"  :dictData="dictData" @dbclick="dbclick" />
+    </Card>
+  </Card>
+</template>
+
+<script>
+import ListBtnToolbar from './listbtntoolbar.vue';
+import Formcards from './formcard.vue';
+import elementResizeDetectorMaker from 'element-resize-detector';
+export default {
+    name:'mlevelreport',
+    components:{ListBtnToolbar, Formcards},
+    data () {
+        return {
+            levelName:'level',
+            levelIdName:'levelid',
+            levelFidName:'levelfid',
+            levelTextName:'levelname',
+            levelData:[],
+            initLevelData:[],
+            myConfig:{
+                titleType:2,
+                divStyle:'padding:5px',
+                showMaxRow:2,
+                title:'查询条件',
+                showAsyncImportExport:false
+            },
+            menuToolbar:{},
+            gridToolbar:{},
+            frontBtn: [{
+                name:'searchData',text:'查询',icon:'custom-search'
+            },{
+                name:'clearData',text:'清除',icon:'custom-clean'
+            }],
+            oldLevelidSearchBefore:null,
+            showSearchPara:true,
+            reset:true,
+            resetGridFlag:false,
+            hideItems:[]
+        };
+    },
+    props:{
+        config:{
+            type:Object,
+            default:null
+        },
+        dictData:{
+            type:Object,
+            default:null
+        },
+        moduleMethod:{
+            type:Array,
+            default:() => {
+                return [];
+            }
+        }
+    },
+    computed:{
+        clientHeight () {
+            return this.$Store.state.app.clientHeight;
+        },
+        gridConfig () {
+            let num = this.levelData.length;
+            if (num === 0) {
+                return this.$Method.copy(this.myConfig.gridConfig);
+            } else {
+                if (this.levelData[num - 1].gridName) {
+                    return this.$Method.copy(this.myConfig[this.levelData[num - 1].gridName]);
+                } else {
+                    return this.$Method.copy(this.myConfig.gridConfig);
+                }
+            }
+        }
+    },
+    created () {
+        this.myConfig = Object.assign({}, this.myConfig, this.config);
+        if (this.myConfig.levelIdName) {
+            this.levelIdName = this.myConfig.levelIdName;
+        }
+        if (this.myConfig.levelFidName) {
+            this.levelFidName = this.myConfig.levelFidName;
+        }
+        if (this.myConfig.levelTextName) {
+            this.levelTextName = this.myConfig.levelTextName;
+        }
+        if (this.myConfig.levelName) {
+            this.levelName = this.myConfig.levelName;
+        }
+        this.initGridMyConfig('gridConfig');
+        this.myConfig.formConfig.titleType = this.myConfig.titleType;
+        if (this.myConfig.formConfig.title === undefined) {
+            this.myConfig.formConfig.title = this.myConfig.title;
+        }
+        if (this.myConfig.menuToolbar && this.myConfig.menuToolbar.items) {
+            this.menuToolbar = this.$Method.copy(this.myConfig.menuToolbar);
+        }
+        let frontBtn = []
+        this.frontBtn.forEach(el => {
+            let index = this.menuToolbar.items.findIndex(el2 => el2.name === el);
+            if (index === -1) {
+                frontBtn.push(el);
+            }
+        });
+        this.menuToolbar.items = frontBtn.concat(this.menuToolbar.items);
+        this.menuToolbar.mainButton = 'searchData';
+        this.menuToolbar.mainButtonText ='查询';
+        this.menuToolbar.ignoreModule = ['searchData','clearData'];
+
+        let index = this.myConfig.formConfig.items.findIndex(el => el.name === this.levelIdName);
+        if (index > -1) {
+            if (this.myConfig.formConfig.items[index].searchBefore) {
+                this.oldLevelidSearchBefore = this.myConfig.formConfig.items[index].searchBefore;
+            }
+            if (!this.myConfig.formConfig.items[index].textName) {
+                this.myConfig.formConfig.items[index].textName = this.levelTextName;
+            }
+            this.myConfig.formConfig.items[index].searchBefore = this.levelidSearchBefore;
+        }
+        if (this.myConfig.initLevelData !== undefined) {
+            this.initLevelData = this.$Method.copy(this.myConfig.initLevelData);
+        }
+        if (this.initLevelData.length > 0) {
+            this.levelData.push(this.$Method.copy(this.initLevelData[0]));
+        }
+        let obj = {};
+        this.initLevelData.forEach(el => {
+            if (el.gridName && el.gridName !== 'gridConfig') {
+                if (!obj[el.gridName]) {
+                    obj[el.gridName] = {};
+                    this.initGridMyConfig(el.gridName);
+                    if (!this.resetGridFlag) {
+                        this.resetGridFlag = true;
+                    }
+                }
+            }
+        });
+
+        let lineNum = this.myConfig.formConfig.lineNum;
+        let culLineNum = 0;
+        let flag = true;
+        this.myConfig.formConfig.items.forEach(el => {
+            if (el.colNum) {
+                culLineNum = culLineNum + Number(el.colNum)
+            } else {
+                culLineNum++;
+            }
+            if (flag && culLineNum > Number(lineNum)* Number(this.myConfig.showMaxRow)) {
+                flag = false
+            } 
+            if (!flag){
+                el.visible = false;
+                this.hideItems.push(el);
+            }
+        });
+        if (this.hideItems.length > 0) {
+            this.myConfig.formConfig.items.push({
+                type:'Divider',
+                orientation:'right',
+                hide:true,
+                style: 'margin:2px 0',
+                doHide:this.doHide,
+                dividerName:'hidedivider'
+            });
+        }
+    },
+    methods:{
+        doHide(obj) {
+            let items = [];
+            this.hideItems.forEach(el => {
+                let item = {};
+                if (el.sname) {
+                    item.sname = el.sname;
+                }
+                if (el.name) {
+                    item.name = el.name;
+                }
+                el.visible = obj.value;
+                item.visible = obj.value;
+                items.push(item);
+            });
+            if (this.$parent.doHide) {
+                items = this.$parent.doHide(items);
+            }
+            this.$refs.form.updateItemsConfig(items);
+        },
+        initGridMyConfig (name) {
+            this.myConfig[name].headStyle = '';
+            this.myConfig[name].showCondition = false;
+            this.myConfig[name].onSelectionChange = this.gridOnSelectionChange;
+            if (this.myConfig[name].resources === undefined) {
+                this.myConfig[name].resources = this.config.resources;
+            }
+            if (this.myConfig[name].method === undefined) {
+                this.myConfig[name].method = this.config.classPrefix + '.' + 'query';
+            }
+            if (this.myConfig[name].response === undefined) {
+                this.myConfig[name].response = this.config.response;
+            }
+            this.myConfig[name].height = 1;
+            this.myConfig[name].width = 1;
+            this.myConfig[name].adjustHeight = 0;
+            this.myConfig[name].adjustWidth = 0;
+            this.myConfig[name].pageSize='small';
+
+            if (this.myConfig[name].pageSizeNum === undefined) {
+                this.myConfig[name].pageSizeNum = 20;
+            }
+            this.myConfig[name].items.forEach(el => {
+                if (el.type !== 'CheckBox') {
+                    if (el.tooltip === undefined) {
+                        el.tooltip = true;
+                    }
+                }
+                if (el.name === this.myConfig.levelTextName) {
+                    el.cellClassName= 'efuture-leveltextname';
+                }
+            });
+        },
+        levelClick (temp) {
+            let last = this.levelData.length - 1;
+            let index = this.levelData.findIndex(el => el[this.levelIdName] === temp[this.levelIdName]);
+            if (last === index) {
+                return false;
+            }
+            if (index > -1) {
+                this.levelData.splice(index, last - index);
+            }
+            let curlIndex = -1;
+            if (this.levelData.length > 0) {
+                curlIndex = this.levelData.length - 1;
+            }
+            
+            if (curlIndex > -1) {
+                let preLevel = this.$Method.copy(this.initLevelData[curlIndex]);
+                if (temp[this.levelFidName]) {
+                    preLevel[this.levelFidName] = temp[this.levelFidName];
+                }
+                let level = {};
+                level.newLevel = preLevel;
+                level.oldLevel = curlIndex;
+                this.levelData.splice(curlIndex, 1, preLevel);
+                if (this.resetGridFlag) {
+                    this.reset = false;
+                    this.$nextTick(() => {
+                        this.reset = true;
+                        this.$nextTick(() => {
+                            this.setGridHeight();
+                            this.doCommonLevelChange();
+                            this.levelClickAfter(level);
+                        });
+                    });
+                } else {
+                    this.doCommonLevelChange();
+                    this.levelClickAfter(level);
+                }
+            } else {
+                return false;
+            }
+        },
+        doCommonLevelChange () {
+            let num = this.levelData.length - 1;
+            this.$refs.grid.updateColPro(this.levelTextName, {label:this.initLevelData[num].name});
+            if (num === 0) {
+                this.$refs.menutoolbar.setReadOnly('clearData', false);
+            } else {
+                this.$refs.menutoolbar.setReadOnly('clearData', true);
+            }
+            let obj = [];
+            let tempLevelConfig = {};
+            this.myConfig.formConfig.items.forEach(el => {
+                if (el.required || el.notLevelFlag) {
+                    let temp = {};
+                    if (el.name) {
+                        temp.name = el.name;
+                    } else {
+                        if (el.sname) {
+                            temp.name = el.sname;
+                        }
+                    }
+                    if (num === 0) {
+                        temp.readOnly = false;
+                        if (el.required !== undefined) {
+                            temp.required = true;
+                        }
+                    } else {
+                        temp.readOnly = true;
+                        if (el.required !== undefined) {
+                            temp.required = false;
+                        }
+                    }
+                    obj.push(temp);
+                }
+                if (el.name === this.levelIdName) {
+                    Object.assign(tempLevelConfig, el);
+                }
+            });
+            if (this.initLevelData[num].levelConfig) {
+                Object.assign(tempLevelConfig, this.initLevelData[num].levelConfig);
+            }
+            tempLevelConfig.label = this.initLevelData[num].name;
+            obj.push(tempLevelConfig);
+            this.$refs.form.updateItemsConfig(obj);
+            this.$nextTick(() => {
+                this.$refs.form.setValue(this.levelIdName, '');
+                this.$refs.form.setValue(this.levelTextName, '');
+                this.searchData();
+            });
+        },
+        levelidSearchBefore (that, obj) {
+            if (this.oldLevelidSearchBefore) {
+                let flag = this.oldLevelidSearchBefore(that, obj);
+                if (flag) {
+                    if (!that.searchParam) {
+                        that.searchParam = {};
+                    }
+                    Object.assign(that.searchParam, this.getLevelPara(true));
+                }
+                return flag;
+            } else {
+                if (!that.searchParam) {
+                    that.searchParam = {};
+                }
+                Object.assign(that.searchParam, this.getLevelPara(true));
+            }
+            return true;
+        },
+        doMenuToolbar () {
+            if (this.$refs.menutoolbar) {
+                this.$refs.menutoolbar.addBtnObject(this.frontBtn, 'front');
+            }
+        },
+        doAction (obj) {
+            const method = obj.name;
+            if (this.$parent[method]) {
+                this.$parent[method](obj);
+            } else {
+                if (this[method]) {
+                    this[method](obj);
+                }
+            }
+        },
+        clearData () {
+            this.$refs.form.clearData();
+            this.$refs.grid.clearSearchBeforeSearchParam();
+            this.$refs.grid.clearData();
+        },
+        searchData () {
+            this.$refs.form.checkValidate();
+            let flag = this.$refs.form.isError();
+            if (flag) {
+                this.alert('必填项不允许为空');
+                return false;
+            }
+            let data = this.$refs.form.getData();
+            let searchParam = {};
+            for (let pro in data) {
+                if (data[pro] || data[pro] === 0) {
+                    searchParam[pro] = data[pro];
+                }
+            }
+            Object.assign(searchParam, this.getLevelPara());
+            this.$refs.grid.clearSearchBeforeSearchParam();
+            this.$refs.grid.setSearchBeforeSearchParam(searchParam);
+            this.$refs.grid.refurbish();
+        },
+        getLevelPara (flag) {
+            let para = {};
+            if (this.levelData.length > 0) {
+                let num = this.levelData.length - 1;
+                if (this.levelData[num][this.levelName]) {
+                    para[this.levelName] = this.levelData[num][this.levelName];
+                }
+                if (this.levelData[num][this.levelFidName]) {
+                    para[this.levelFidName] = this.levelData[num][this.levelFidName];
+                }
+            }
+            if (this.myConfig.customSearchParam) {
+                return this.myConfig.customSearchParam(this.levelData, para, flag);
+            } else {
+                return para;
+            }
+        },
+        exportData () {
+            let data = this.$refs.grid.getData();
+            if (data.length === 0) {
+                this.alert('请先查询数据');
+                return false;
+            }
+            if (this.myConfig.showAsyncImportExport) {
+                if (this.$parent.asyncExport) {
+                    this.$parent.asyncExport(grid)
+                    return;
+                }
+            } else {
+                this.$refs.grid.export();
+            }
+           
+        },
+        refurbish () {
+            this.searchData();
+        },
+        getGrid () {
+            return this.$refs.grid;
+        },
+        getForm () {
+            return this.$refs.form;
+        },
+        setGridHeight () {
+            let height = this.$refs.toolbarcard.offsetHeight + this.$refs.formcard.offsetHeight+ this.$refs.bread.offsetHeight + 43;
+            if (this.hideItems && this.hideItems.length > 0) {
+                height = height + 20;
+            }
+            if (this.$refs.grid.showSummary) {
+                height = height + 36;
+            }
+            this.$refs.grid.setOutsideHeight(height);
+        },
+        dbclick (e) {
+            let name = e[this.levelTextName];
+            let num = this.levelData.length - 1;
+            let nextLevelNum = num + 1;
+            if (nextLevelNum >= this.initLevelData.length) {
+                return;
+            }
+            let curl = {};
+            curl[this.levelIdName] = e[this.levelIdName];
+            if (this.levelData[num][this.levelFidName]) {
+                curl[this.levelFidName] = this.levelData[num][this.levelFidName];
+            }
+            curl.name = name;
+            this.levelData.splice(num, 1, curl);
+            let nextLevel = this.$Method.copy(this.initLevelData[nextLevelNum]);
+            nextLevel[this.levelFidName] = curl[this.levelIdName];
+            this.levelData.push(nextLevel);
+            let level = {};
+            level.newLevel = nextLevelNum;
+            level.oldLevel = num;
+            if (this.resetGridFlag) {
+                this.reset = false;
+                this.$nextTick(() => {
+                    this.reset = true;
+                    this.$nextTick(() => {
+                        this.setGridHeight();
+                        this.doCommonLevelChange();
+                        this.dbclickAfter(e, level);
+                    });
+                });
+            } else {
+                this.setGridHeight();
+                this.doCommonLevelChange();
+                this.dbclickAfter(e, level);
+            }
+
+        },
+        dbclickAfter (e,level) {
+            let obj = {};
+            obj.name ='gridDbClick';
+            obj.rowinfo = {};
+            obj.rowinfo.row = e;
+            obj.rowinfo.gridObject = this.$refs.grid;
+            obj.level = level;
+            this.doAction(obj);
+        },
+        levelClickAfter(level) {
+            let obj = {};
+            obj.name ='levelClick';
+            obj.level = level;
+            this.doAction(obj);
+        },
+        setHideDividerValue(value) {
+            this.$refs.form.setHideDividerValue(value);
+        }
+    },
+    mounted () {
+        this.observer = elementResizeDetectorMaker();
+        if (this.$refs.formcard) {
+            this.observer.listenTo(this.$refs.formcard, this.setGridHeight);
+        }
+    },
+    beforeUnmount() {
+        if (this.$refs.formcard) {
+            this.observer.removeListener(this.$refs.formcard, this.setGridHeight);
+        }
+    }
+};
+</script>