<template>
    <div style="display: inline-block;">
        <!--日期选择-->
        <v-f9-date-picker v-if="internalOption.rangeSelection.isShow" @datePickerConfirm="datePickerConfirm()">

            <v-f9-groupbox v-model="internalOption.rangeSelection.groupboxValue" label="变动日期" group-name="变动日期"
                           v-show="isShowDateType">

                <v-radio-group v-model="dateTypeSelect">
                    <v-radio v-for="item in internalOption.rangeSelection.dateType" :key="item.label"
                             :label="item.label">{{item.label}}
                    </v-radio>
                </v-radio-group>
            </v-f9-groupbox>

            <v-f9-groupbox v-model="internalOption.rangeSelection.groupboxValue" label="报告期"
                           group-name="报&ensp;告&ensp;期" v-if="isShowReportDate">
                <v-f9-date-input
                        v-model="internalOption.rangeSelection.startDate"
                        :max-date="internalOption.rangeSelection.endDate"
                        label="开始日期"
                        placeholder="选择时间">
                </v-f9-date-input>
                <v-f9-date-input
                        v-model="internalOption.rangeSelection.endDate"
                        :min-date="internalOption.rangeSelection.startDate" 
                        label="结束日期"
                        placeholder="选择时间"></v-f9-date-input>
            </v-f9-groupbox>


            <v-f9-groupbox disabled label="上市前后" group-name="上市前后" v-show="isShowListedType">

                <v-checkbox-group v-model="listedTypeSelect">

                    <v-checkbox v-for="(item,index) in internalOption.rangeSelection.listedType" :label="item.value" :key="index" >
                        {{item.label}}
                    </v-checkbox>

                </v-checkbox-group>
            </v-f9-groupbox>

        </v-f9-date-picker>

        <!--报告期-->
        <v-select v-if="internalOption.reportPeriodType.isShow"
                  style="margin-left: 15px;"
                  isMultiple
                  :min="internalOption.reportPeriodType.min"
                  @change="selectChange"
                  v-model="internalOption.reportPeriodType.data"
                  placeholder="报告期"
        >
        </v-select>

        <!--报告类型-->
        <v-select
                v-if="internalOption.reportTypeInScope.isShow"
                style="margin-left: 15px;"
                isMultiple
                :min="internalOption.reportTypeInScope.min"
                @change="selectChange"
                v-model="internalOption.reportTypeInScope.data"
                placeholder="报告类型"
        >
        </v-select>

        <!--汇率、币种 CNY-->
        <v-select
                v-if="internalOption.exchangeRate.isShow"
                style="margin-left: 15px;"
                @change="selectChange"
                v-model="internalOption.exchangeRate.data"
                text-align="center"
                placeholder="币种"
        >
        </v-select>

        <!--单位-->
        <v-select
                v-if="internalOption.unitType.isShow"
                style="margin-left: 15px;"
                @change="selectChange"
                v-model="internalOption.unitType.data"
                placeholder="单位"
        >
        </v-select>

        <!--普通报表-->
        <v-select
                v-if="internalOption.reportForm.isShow"
                style="margin-left: 15px;"
                @change="selectChange"
                v-model="internalOption.reportForm.data"
        >
        </v-select>


    </div>
</template>

<script>
    import mixin from './mixin.js'

    import VSelect from "../../../../BaseComponents/lib/v-select/src/select.vue";
    import VF9DatePicker from "../../v-f9-date-picker/src/f9-date-picker.vue";
    import VF9Groupbox from "../../v-f9-groupbox/src/f9-groupbox.vue";
    import VF9DateInput from "../../v-f9-date-input/src/f9-date-input.vue";
    import VRadio from "../../../../BaseComponents/lib/v-radio/src/radio.vue";
    import VRadioGroup from "../../../../BaseComponents/lib/v-radio-group/src/radio-group.vue";
    import VCheckbox from "../../../../BaseComponents/lib/v-checkbox/src/checkbox.vue";
    import VCheckboxGroup from "../../../../BaseComponents/lib/v-checkbox-group/src/checkbox-group.vue";

    import {ALL_OPTION_ETTING, mergeOption} from './util'

    export default {
        name: 'v-f9-operation-tools',
        mixins: [mixin],
        props: {
            // 配置项
            option: {
                type: Object,
                require: true
            }
        },

        data(){
            return {

                // 返回处理后的参数
                params: {
                    //startDate:'2015'     // 开始日期
                    //endDate:'2017'       // 结束日期
                    //listedType:'1,2',    // 上市前后
                    //reportPeriodType:'1,2,3,4,5,6,7' // 报告期
                    //reportTypeInScope:'1,2,3' // 报告期类型
                    //exchangeRate:'' // 汇率、币种
                    //unitType:0 // 单位
                    //reportForm:'1,2' // 普通报表
                },

                // 需要挪到 internalOption 对象里，现在放进去radio-group选中失效
                dateTypeSelect: '', // 当前选中的‘变动日期’
                listedTypeSelect: [], // 当前选中的‘上市前后’

                // 默认配置
                defaultOption: {
                    // 范围选择
                    rangeSelection: {
                        isShow: false,

                        // 当前选中的groupbox 组
                        groupboxValue: '变动日期',

                        // 时间类型
                        dateType: [],

                        // 当前选中的时间类型
                        /*        dateTypeSelect: '',*/

                        // 开始日期(默认3年前)
                        startDate: (new Date().getFullYear() - 1).toString(),
                        // 结束日期(默认当年)
                        endDate:(new Date().getFullYear()).toString(),

                        // 默认选择上市后
                        listedType: ['上市后']

                    },

                    // 报告期 （一季度、中报 ...）
                    reportPeriodType: {
                        isShow: false,
                        data: [],
                        // 最少选中数量
                        min: 1
                    },

                    // 报告类型（合并报表、母公司报表 ...）
                    reportTypeInScope: {
                        isShow: false,
                        data: [],
                        // 最少选中数量
                        min: 1
                    },

                    // 汇率、币种 （CNY、USD ...）
                    exchangeRate: {
                        isShow: false,
                        data: []
                    },

                    // 单位（元、千元 ...）
                    unitType: {
                        isShow: false,
                        data: []
                    },

                    // 普通报表、销售百分比 ...
                    reportForm: {
                        isShow: false,
                        data: []
                    }

                },

                // 内部配置
                internalOption: null

            }
        },

        computed: {

            // 是否显示时间范围中的变动日期
            isShowDateType(){

                let result = false;

                var internalOption = this.internalOption;

                // 变动日期、上市前后的处理
                if (internalOption.rangeSelection.isShow) {

                    if (Array.isArray(internalOption.rangeSelection.dateType) && internalOption.rangeSelection.dateType.length > 0) {

                        result = true;
                    }
                }

                return result;
            },

            // 是否显示时间范围中的报告期
            isShowReportDate(){

                let result = false;

                var internalOption = this.internalOption;

                // 变动日期、上市前后的处理
                if (internalOption.rangeSelection.isShow) {

                    if (this.option.rangeSelection.startDate || this.option.rangeSelection.endDate){

                        return true;
                    }
                }

                return result;
            },

            // 是否显示时间范围中的‘上市前后’
            isShowListedType(){

                let result = false;

                var internalOption = this.internalOption;

                // 变动日期、上市前后的处理
                if (internalOption.rangeSelection.isShow) {

                    if (Array.isArray(internalOption.rangeSelection.listedType) && internalOption.rangeSelection.listedType.length > 0) {

                        result = true;
                    }
                }

                return result;
            }

        },

        methods: {

            // 配置初始化
            initOption(){

                var tempOption = Object.assign({}, this.defaultOption, this.option);

                this.internalOption = mergeOption(tempOption);

                var internalOption = this.internalOption;

                // 变动日期、上市前后的处理
                if (internalOption.rangeSelection.isShow) {

                    if (this.isShowDateType) {

                        var selectItem = internalOption.rangeSelection.dateType.find(x => x.selected);

                        if (selectItem) {
                            this.dateTypeSelect = selectItem.label;
                        }
                    }

                    if (this.isShowListedType) {

                        internalOption.rangeSelection.listedType.filter(item => {
                            if (item.selected) {
                                this.listedTypeSelect.push(item.value);
                            }
                        })
                    }
                }

                this.setParams();

            },

            // 范围选择确定时
            datePickerConfirm(){
                this.setParams();
            },

            // select 选择变化时
            selectChange(){
                this.setParams();
            },

            // 设置参数
            setParams(){
                var params = this.params,
                    internalOption = this.internalOption;


                // 范围选择
                if (internalOption.rangeSelection.isShow) {

                    if (internalOption.rangeSelection.groupboxValue === '变动日期' && this.isShowDateType) {

                        var selectItem = internalOption.rangeSelection.dateType.find(x => x.label === this.dateTypeSelect);

                        var dateInfo = this.getDateInfo(selectItem.start, selectItem.end);

                        params.startDate = dateInfo.startDate + '-01-01';
                        params.endDate = dateInfo.endDate + '-12-31';

                    } else if (internalOption.rangeSelection.groupboxValue === '报告期' && this.isShowReportDate) {
                        params.startDate = internalOption.rangeSelection.startDate + '-01-01';
                        params.endDate = internalOption.rangeSelection.endDate + '-12-31';
                    }

                    if (this.isShowListedType) {
                        params.listedType = this.listedTypeSelect.join();
                    }
                }

                // 报告期
                if (internalOption.reportPeriodType.isShow) {
                    var reportPeriodType = [];

                    internalOption.reportPeriodType.data.filter(function (item) {
                        if (item.selected) {
                            reportPeriodType.push(item.value);
                        }
                    });

                    params.reportPeriodType = reportPeriodType.join();
                }

                // 报告期类型
                if (internalOption.reportTypeInScope.isShow) {
                    var reportTypeInScope = [];

                    internalOption.reportTypeInScope.data.filter(function (item) {
                        if (item.selected) {
                            reportTypeInScope.push(item.value);
                        }
                    });

                    params.reportTypeInScope = reportTypeInScope.join();
                }

                // 汇率、币种
                if (internalOption.exchangeRate.isShow) {
                    var selectItem = internalOption.exchangeRate.data.find(x => x.selected);

                    if (selectItem) {
                        params.exchangeRate = selectItem.value;
                        params.exchangeRateLabel=selectItem.label.split(':')[0];
                    }
                }

                // 单位
                if (internalOption.unitType.isShow) {
                    var selectItem = internalOption.unitType.data.find(x => x.selected);

                    if (selectItem) {
                        params.unitType = selectItem.value;
                    }
                }

                // 普通报表
                if (internalOption.reportForm.isShow) {
                    var selectItem = internalOption.reportForm.data.find(x => x.selected);

                    if (selectItem) {
                        params.reportForm = selectItem.value;
                    }
                }


                this.$emit('change', params);
            }
        },

        components: {
            VCheckboxGroup,
            VCheckbox,
            VRadioGroup,
            VRadio,
            VF9DateInput,
            VF9Groupbox,
            VF9DatePicker,
            VSelect
        },

        created(){
            this.initOption();

        }
    }
</script>