<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>
