<template>
<div style="padding-left:10px;padding-right:10px">
    <CompatTree v-if="hackReset" :data="data" :render="renderContent" class="demo-tree-render" @update:data="treeData = $event"></CompatTree>
</div>
</template>
<script>
import CompatTree from '../tree/CompatTree.vue';
import { resolveComponent } from 'vue';
    export default {
        name:'conditionfilterbox',
        components : {CompatTree},
        props:{
            config: {
                type: Object,
                default () {
                    return {};
                }
            },
            dictData: {
                type: Object,
                default:null
            }
        } ,
        data () {
            return {
                hackReset:true,
                myConfig:{
                    dbtype:'oracle',
                    rootName:'',
                    selector:[],
                    items:[]
                },
                root:{
                    title: '',
                    isConnector:false,
                    expand: true,
                    selectorClass:1,
                    render:this.renderRootContent
                },
                data: [],
                selectorConfig:{}
            };
        },
        created () {
            this.init();
        },
        methods: {
            init () {
                this.myConfig = Object.assign({}, this.myConfig, this.config);
                if (this.dictData) {
                    this.myConfig.items.forEach(el => {
                        if (el.dictkey) {
                            if (el.data === undefined) {
                                let dictkey = el.dictkey;
                                if (el.customDictkey) {
                                    dictkey = el.customDictkey;
                                }
                                if (this.dictData[dictkey]) {
                                    el.data = this.dictData[dictkey];
                                }
                            }
                        }
                    });
                }
                if (this.myConfig.selector && this.myConfig.selector.length > 0) {
                    this.myConfig.selector.forEach(el => {
                        if (!this.selectorConfig[el.code]) {
                            this.selectorConfig[el.code] = {};
                            this.selectorConfig[el.code].items = [];
                        }
                        this.myConfig.items.forEach(el2 => {
                            if (el.code === el2.selector) {
                                this.selectorConfig[el.code].items.push(el2);
                            }
                        });
                    });
                } else {
                    this.myConfig.selector = [];
                    let  obj = {};
                    obj.code = '1';
                    obj.name = '筛选条件';
                    if (this.myConfig.rootName){
                        obj.name = this.myConfig.rootName;
                    }
                    this.myConfig.selector.push(obj);
                    this.selectorConfig[obj.code] = {};
                    this.selectorConfig[obj.code].items = [];
                    this.myConfig.items.forEach(el2 => {
                        el2.selector = obj.code;
                        this.selectorConfig[obj.code].items.push(el2);
                    });
                }
                this.initData();
            },
            initData() {
                this.hackReset = false;
                this.data = [];
                let root = {};
                if (this.myConfig.selector.length === 1) {
                    root.title =  this.myConfig.selector[0].name;
                    root.isConnector =false;
                    root.expand =true;
                    root.selector = this.myConfig.selector[0].code;
                    root.selectorClass = 1;
                    root.render = this.renderRootStaticContent;
                    root.children = [];
                    let obj = {
                        title:'连接关系',
                        operflag:true,
                        selectorClass:2,
                        selector:this.myConfig.selector[0].code,
                        isConnector:true,
                        expand: true,
                        form:{'connector':'$and'},
                        render:this.renderContent,
                        children:[
                            {
                                title:'条件',
                                operflag:true,
                                isConnector:false,
                                expand: true,
                                selector:this.myConfig.selector[0].code,
                                selectorClass:3,
                            }
                        ]
                    };
                    root.children.push(obj);
                }
                if (this.myConfig.selector.length > 1) {
                    if (this.myConfig.rootName) {
                        root.title =  this.myConfig.rootName;
                    } else {
                        root.title =  '筛选条件';
                    }
                    root.expand =true;
                    root.children = [];
                    root.render = this.renderRootStaticContent;
                    root.children.push({
                        title: '连接关系',
                        isConnector:true,
                        expand: true,
                        operflag:false,
                        selector:'-',
                        selectorClass:1,
                        form:{'connector':'$and'},
                        render:this.renderContent
                    });
                    root.children[0].children = [];
                    this.myConfig.selector.forEach(el => {
                        let obj = {};
                        obj.title = el.name,
                        obj.expand = true;
                        obj.selectorClass = 2;
                        obj.selector = el.code;
                        obj.operflag = false;
                        obj.render=this.renderRootStaticContent;
                        obj.children = [];
                        let temp = {
                            title:'连接关系',
                            operflag:true,
                            selectorClass:3,
                            selector:el.code,
                            isConnector:true,
                            expand: true,
                            form:{'connector':'$and'},
                            render:this.renderContent,
                            children:[
                                {
                                    title:'条件',
                                    operflag:true,
                                    isConnector:false,
                                    expand: true,
                                    selector:el.code,
                                    selectorClass:4,
                                }
                            ]
                        };
                        obj.children.push(temp);
                        root.children[0].children.push(obj);
                    });
                }
                this.data.push(root);
                this.$nextTick(() =>{
                    this.hackReset = true;
                });
            },

             // eslint-disable-next-line no-unused-vars
            renderRootContent (h, {root, node, data }) {
                let buttonConfig = Object.assign({}, this.buttonProps, {icon: 'ios-add',type: 'primary'});
                buttonConfig.style = { width: '64px'};
                buttonConfig.onClick = () => { this.append(data); };
                return h('div', {
                    style: {
                        display: 'block',
                        width: '100%',
                        'line-height':'34px'
                    }
                }, [h('span',data.title),
                    h('span', {
                        style: {
                            display: 'inline-block',
                            float: 'right',
                            marginRight: '32px'
                        }
                    }, [
                        h(resolveComponent('Button'), buttonConfig)
                    ])
                ]);
            },
            renderContent (h, { root, node, data }) {
                return h('div',{
                    style: {
                        display: 'block',
                        width: '100%',
                        'line-height':'34px'
                    }
                }, [h('span', {
                    style: {
                        'vertical-align':'middle'
                    }
                },data.title),
                    h('span',{
                        style: {
                            display: 'inline-block',
                            float: 'right',
                            width:'90%',
                            marginRight: '32px'
                        }},[h(resolveComponent('ConditionSelectorBox'),{
                            isConnector:data.isConnector,
                            operflag:data.operflag,
                            config:this.selectorConfig[data.selector],
                            setOperData:this.setOperData,
                            valueData:data.form,
                            onDoAction:(val) =>{
                                    if (val.name === 'doAdd') {
                                        this.append(data);
                                    }
                                    if (val.name === 'doDel') {
                                        this.remove(root, node, data);
                                    }
                            },
                            onClick:(form) => {
                                    if (!data.form) {
                                        data.form = {};
                                    }
                                    Object.assign(data.form, form);
                            }
                        })])]);
            },
            // eslint-disable-next-line no-unused-vars
            renderRootStaticContent (h, { root, node, data }) {
                return h('span',{
                    style: {
                        display: 'inline-block',
                        width: '100%',
                        'line-height':'34px'
                    }
                }, [h('span', data.title)]);
            },
            append (data) {
                const children = data.children || [];
                let nextClass = Number(data.selectorClass) + 1;
                let isConnector = !data.isConnector;
                let title ='条件';
                if (isConnector) {
                    title = '连接关系';
                    let flag = false;
                    for (let i=0; i<children.length; i++) {
                        if (children[i].isConnector) {
                            flag = true;
                            break;
                        }
                    }
                    if (flag) {
                        return;
                    }
                }
                let obj = {
                    title:title,
                    operflag:true,
                    selectorClass:nextClass,
                    selector:data.selector,
                    isConnector:isConnector,
                    expand: true
                };
                if (isConnector) {
                    obj.form = {'connector':'$and'};
                }
                children.push(obj);
                Object.assign(data,{'children':children});
            },
            setOperData (el, tempData) {
                if (this.myConfig.setOperData) {
                    return this.myConfig.setOperData(el, tempData);
                } else {
                    return tempData;
                }
            },
            remove (root, node, data) {
                const parentKey = root.find(el => el === node).parent;
                const parent = root.find(el => el.nodeKey === parentKey).node;
                const index = parent.children.indexOf(data);
                parent.children.splice(index, 1);
            },
            getQuerySearchParam () {
                let para = {};
                if (this.myConfig.selector.length === 1){
                    if (this.data[0].children === undefined) {
                        return para;
                    } else {
                        this.creatSearchParam(this.data[0],para,1);
                    }
                } else {
                    if (this.data[0].children[0].children === undefined) {
                        return para;
                    } else {
                        this.creatSearchParam(this.data[0].children[0],para,2);
                    }
                }
                let temp = [];
                this.myConfig.selector.forEach(el=> {
                    if (para[el.code]) {
                        temp.push(para[el.code]);
                    }
                });
                if (temp.length === 0) {
                    return {};
                } else if (temp.length === 1) {
                    return this.$Method.copy(temp[0]);
                } else  {
                    let  obj = {};
                    obj[this.data[0].children[0].form.connector] = temp;
                    return obj;
                }
            },
            getQuerySearchParamToString () {
                let obj = this.getQuerySearchParam();
                let str = '';
                str = this.setParaSring(obj,str);
                return str;
            },
            setParaSring(obj,str) {
                if (obj.constructor === Array) {
                    let temp = '';
                    if (str === '$and') {
                        str = ' and ';
                    } else if (str === '$or') {
                        str = '  or ';
                    }
                    obj.forEach(el => {
                        temp = temp + this.setParaSring(el) + ' ' +str + ' ';
                    });
                    if (temp) {
                        temp = temp.substring(0, temp.length - 5);
                    }
                    return temp;
                } else {
                    for (let pro in obj) {
                        let value = this.$Method.copy(obj[pro]);
                        if (value.constructor === Array){
                            return '( ' + this.setParaSring(value,pro) + ' )';
                        } else {
                            return this.getCommomParamString(pro,value);
                        }
                    }
                }
            },
            getCommomParamString (pro,obj) {
                let str = pro ;
                for(let temp in obj) {
                    if (temp === '==') {
                        str =str + ' = ';
                    }  else {
                        str =str +' ' + temp + ' ';
                    }
                    let v = obj[temp];
                    let index = this.myConfig.items.findIndex(el => el.name === pro);
                    if (index > -1) {
                        if (this.myConfig.dbtype === 'oracle') {
                            if (this.myConfig.items[index].type === 'DateBox') {
                                let format = 'yyyy-MM-dd';
                                if (this.myConfig.items[index].vtype === 'date') {
                                    format = 'yyyy-MM-dd';
                                } else if (this.myConfig.items[index].vtype === 'datetime') {
                                    format = 'yyyy-MM-dd hh:mm:ss';
                                } else if (this.myConfig.items[index].vtype ==='month') {
                                    format = 'yyyy-MM';
                                }
                                if (this.myConfig.items[index].format) {
                                    format = this.myConfig.items[index].format;
                                }
                                v = 'to_date(\'' + v + '\',\'' +format +'\')';
                            } else {
                                v = '\'' + v + '\'';
                            }
                        } else {
                            v = '\'' + v + '\'';
                        }
                        str = str  + v;
                        return str;
                    }
                }
                return '';
            },
            getCommomParam (obj) {
                let param = {};
                if (obj.oper === 'LIKE') {
                    param[obj.field] = {};
                    param[obj.field][obj.oper] = '%' + obj.value + '%';
                } else  {
                    param[obj.field] = {};
                    if (obj.value.value !== undefined) {
                        param[obj.field][obj.oper] = obj.value.value;
                    } else {
                        param[obj.field][obj.oper] = obj.value;
                    }
                }
                return param;
            },
            creatSearchParam(data,obj,flag) {
                data.children.forEach(el => {
                    if (el.children && el.children.length > 0) {
                        let temp = null;
                        if (flag === 2) {
                            temp = el.children[0];
                        } else {
                            temp = el;
                        }
                        obj[el.selector] = {};
                        obj[el.selector][temp.form.connector] = [];
                        this.creatSearchParamCommon(temp.children,obj[el.selector][temp.form.connector]);
                        if (obj[el.selector][temp.form.connector].length === 0) {
                            delete obj[el.selector];
                        }
                    }
                });
            },
            creatSearchParamCommon(data,obj) {
                if (data && data.length > 0) {
                    for (let i=0;i<data.length;i++) {
                        let temp = {};
                        if (data[i].isConnector) {
                            temp[data.form.connector] = [];
                            this.creatSearchParamCommon(data[i].children,temp[data[i].form.connector]);
                            if (temp[data.form.connector].length > 0) {
                                obj.push(temp);
                            }
                        } else {
                            if (data[i].form && data[i].form.value) {
                                if (data[i].children && data[i].children.length > 0) {
                                    let temp = {};
                                    temp[data[i].children[0].form.connector] = [];
                                    this.creatSearchParamCommon(data[i].children[0].children,temp[data[i].children[0].form.connector]);
                                    if (temp[data[i].children[0].form.connector].length > 0) {
                                        temp[data[i].children[0].form.connector].push(this.getCommomParam(data[i].form));
                                        obj.push(temp);
                                    } else {
                                        obj.push(this.getCommomParam(data[i].form));
                                    }
                                } else {
                                    obj.push(this.getCommomParam(data[i].form));
                                }
                            }
                        }
                    }
                }
            },
            clearData() {
                this.initData();
            }
        }
    };
</script>
<style>
    .demo-tree-render .ivu-tree-title{
        width: 98%;
    }
</style>
