<template>
<div style="display: flex; align-items: center;">
    <Icon custom="iconfont icon-custom-delcond" @click.stop="doDel" size="20" color="#515a6e" style="cursor:pointer;margin-bottom:10px;padding-right:8px"/>
    <FormBox ref="form" :config="form"  @inputValue="formChanged" style="flex:1"/>
</div>
</template>
<script>
    export default {
        name: 'mbillconditionbox',
        data () {
            return {
                form:{
                    lineNum:12,
                    labelWidth:10,
                    showLabel:false,
                    items:[{
                        name:'relevance',
                        type:'ComboBox',
                        codeWithName:false,
                        data:[{code:'or',name:'或'}, {code:'and', name:'且'}],
                        colNum:1.2,
                        defaultValue:'and',
                        style:{'margin-bottom':'10px','margin-top':'0px','margin-left':'0px',},
                        transfer:true
                    },{
                        name:'field',
                        type:'ComboBox',
                        codeWithName:false,
                        valueChanged:this.fieldChanged,
                        transfer:true,
                        colNum:4,
                        isFull:true,
                         style:{'margin-bottom':'10px','margin-top':'0px'}
                    },{
                        name:'oper',
                        type:'ComboBox',
                        codeWithName:false,
                        clearable:false,
                        colNum:2,
                        data:[{
                            name: '等于',
                            code: '=='
                        }],
                        defaultValue:'==',
                        isFull:true,
                        transfer:true,
                        style:{'margin-bottom':'10px','margin-top':'0px'}
                    },{
                        name:'value',
                        type:'TextBox',
                        readOnly:true,
                        colNum:4,
                        isFull:true,
                        style:{'margin-bottom':'10px','margin-top':'0px'}
                    }]
                },
                dataType:{},
            };
        },
        created () {
            this.init();
        },
        props:{
            config: {
                type: Object,
                default () {
                    return {};
                }
            },
            valueData: {
                type: Object,
                default () {
                    return {};
                }
            },
            curIndex:{
                type:String,
                default:null
            }
        } ,
        mounted () {
            this.$nextTick(() => {
                if (this.valueData) {
                    if (this.valueData.field){
                        this.fieldChanged({value:this.valueData.field});
                    }
                }
                this.$nextTick(() => {
                    let obj = Object.assign({}, {oper:'=='}, this.valueData);
                    this.$refs.form.setData(obj);
                    this.$refs.form.setFormReadOnly(false);
                })
            });
        },
        methods:{
            formChanged(){
                let obj = {};
                obj.index = this.curIndex;
                obj.form  = this.$refs.form.getData();
                this.$emit('inputValue', obj);
            },
            init() {
               this.initField();
            },
            initField () {
                let fieldData = [];
                if (this.config.items && this.config.items.length > 0) {
                    this.config.items.forEach(el => {
                        if (el.name && el.label && el.condition) {
                            fieldData.push({code:el.name,name:el.label});
                            this.dataType[el.name] = Object.assign({},el, {name:'value'});
                            this.dataType[el.name].operData = this.getOperData(el);
                        }
                    });
                }
                this.form.items[1].data = fieldData;
            },
            getOperData(el) {
                let tempData = [];
                tempData.push({
                    name: '等于',
                    code: '=='
                });
                if (el.type === 'DateBox' || el.type === 'NumberBox') {
                    tempData.push({
                        name: '大于',
                        code: '>'
                    });
                    tempData.push({
                        name: '大于等于',
                        code: '>='
                    });
                    tempData.push({
                        name: '小于等于',
                        code: '<='
                    });
                    tempData.push({
                        name: '小于',
                        code: '<'
                    });
                    tempData.push({
                        name: '不等于',
                        code: '<>'
                    });
                }
                if (el.type === 'TextBox') {
                    tempData.push({
                        name: '不等于',
                        code: '<>'
                    });
                    tempData.push({
                        name: '包含',
                        code: 'LIKE'
                    });
                }
                if (el.setOperData) {
                    tempData =  el.setOperData(el,tempData);
                }
                return tempData;
            },
            fieldChanged(e) {
                let self = this;
                let operValue = '==';
                let obj = [];
                let oper = {};
                oper.name = 'oper';
                if (e.value) {
                    let config = Object.assign({},this.dataType[e.value]);
                    oper.data = this.$Method.copy(config.operData);
                    oper.readOnly = false;
                    obj.push(oper);
                    config.name ='value';
                    config.label = '';
                    config.readOnly = false;
                    config.visible = true;
                    config.valueChanged = '';
                    config.transfer = true;
                    obj.push(config);
                    if (e.value.indexOf('name') !== -1) {
                        operValue = 'LIKE';
                    }
                    if (config.operDefaultValue) {
                        operValue = config.operDefaultValue;
                    }
                } else {
                    oper.data = [{
                        name: '等于',
                        code: '=='
                    }];
                    oper.readOnly = true;
                    obj.push(oper);
                    let valueConfig = {
                        name:'value',
                        type:'TextBox',
                        readOnly:true,
                        isFull:true,
                        transfer:true
                    };
                    obj.push(valueConfig);
                }
                self.$refs.form.updateItemsConfig(obj);
                self.$nextTick(() => {
                    self.$refs.form.setValue('oper',operValue);
                    self.$refs.form.setValue('value','');
                });
                return true;
            },
            doAdd (){
                let obj = {};
                obj.name = 'doAdd';
                this.$emit('doAction', obj);
            },
            doDel (){
                let obj = {};
                obj.name = 'doDel';
                obj.index = this.curIndex;
                this.$emit('doAction', obj);
            },
            setRelevanceReadOnly(value) {
                this.$refs.form.setReadOnly('relevance',value);
            }
        }
    };
</script>
