<template>
    <div v-if="hackReset" @keydown.enter="keyDown('enter')">
       <template  v-if="type === 'Divider'">
            <Divider
            :orientation="config.orientation"
            :dashed="config.dashed"
            :type="config.vtype"
            :id="config.id"
            :style="config.style"
        >
         <template v-if="!!config.label || !!config.hide " #default>
            <span  v-if="!!config.label" v-text="config.label"> </span>
            <div v-if="!!config.hide">
                <p   v-if="hideFlag"  @click.stop="hide"  class="efuture-hide-text">
                    <Icon type="ios-arrow-up" />
                    <span> 
                        收起查询条件
                    </span>
                </p>
                <p v-else @click.stop="hide" class="efuture-hide-text"><Icon type="ios-arrow-down" />
                    <span>展开查询条件</span>
                </p>
            </div>   
          </template>  
        </Divider>
        </template>
        <template  v-else-if="type === 'NumberRangeBox'">
            <NumberRangeBox
            ref="myControl"
            :fatherSvalue="svalue"
            :fatherEvalue="evalue"
            @inputValue="input"
            :config="config"
            ></NumberRangeBox>
        </template>
         <template  v-else-if="type === 'DateRangeBox'">
            <DateRangeBox
            ref="myControl"
            :fatherSvalue="svalue"
            :fatherEvalue="evalue"
            @inputValue="input"
            :config="config"
            ></DateRangeBox>
        </template>
         <template  v-else-if="type === 'PopTextBox'">
            <PopTextBox
            ref="myControl"
            :fatherValue="value"
            :fatherText="text"
            @inputValue="input"
            :config="config"
            ></PopTextBox>
        </template>
        <template  v-else-if="type === 'PictureBox'">
            <PictureBox
            ref="myControl"
            v-if="config.multiSelect !== true"
            :fatherValue="value"
            @inputValue="input"
            :config="config"
            :readOnly="readOnly"
            :showStyle="config.showStyle"
        ></PictureBox>
        <PictureBox
            ref="myControl"
            v-else
            :config="config"
            :readOnly="readOnly"
            :showStyle="config.showStyle"
        ></PictureBox>
        </template>
        <template  v-else-if="type === 'VideoBox'">
            <VideoBox
            ref="myControl"
            v-if="config.multiSelect !== true"
            :fatherValue="value"
            @inputValue="input"
            :config="config"
            :readOnly="readOnly"
            :showStyle="config.showStyle"
        ></VideoBox>
        <VideoBox
            ref="myControl"
            v-else
            :config="config"
            :readOnly="readOnly"
            :showStyle="config.showStyle"
        ></VideoBox>
        </template>
        <template  v-else>
            <component :is="type"  ref="myControl" :fatherValue="value" :readOnly="readOnly" @inputValue="input" :config="config"/>
        </template>
    </div>
</template>

<script>
import proBase from './probase';
export default {
    name: 'ControlBox',
    mixins: [proBase],
};
</script>
