const consUnderlyingFlag = function (isSynthetic) {
    let unSelFlag = tradeHelper.UnderlyingSelectFlag;
    return unSelFlag.UseForTrading | unSelFlag.IncludeMatured | unSelFlag.UsePinYinFilter;
};

function vueItem(item) {

    var autoVariety, autoUnderlying;

    var vue = new Vue({
        data: {
            id: item.id,
            index: item.index,
            viewData: item.viewData,
            updateKey: { instrumentType: 0, variety: 0, underlying: 0 },
        },
        mounted() {
            let self = this;
            autoVariety = FastVue.autocomplete(document.getElementById('Variety_' + item.id), {
                valueField: 'Name', searchField: ['Name', '', 'Code', 'PinYin'],
                lookup: ylotc.varieties,
                onSelect(data) {
                    self.changeVariety(data, 'select');
                }
            });
            autoUnderlying = tradeHelper.UnderlyingAutoComplete('UnderlyingCode_' + item.id, { SelectFlag: consUnderlyingFlag() });
            autoUnderlying.onSelect(this.changeUnderlying);
            if (!this.viewData.UnderlyingCode) {
                this.changeInstrumentType();
            } else if (!this.viewData.VarietyName) {
                autoUnderlying.selectByCode(this.viewData.UnderlyingCode);
            }
        },
        methods: {
            //变更标的类型
            changeInstrumentType() {
                let nowTime = new Date().getTime();
                if (nowTime < this.updateKey.variety + 300 || nowTime < this.updateKey.underlying + 300) return;
                this.updateKey.instrumentType = nowTime;
                autoUnderlying.selectFirst({ InstrumentTypes: [this.viewData.InstrumentType] });
            },
            //设置标的品种
            changeVariety(variety, flag) {
                if (flag === 'select') {
                    this.updateKey.variety = new Date().getTime();
                    Object.assign(this.viewData, { InstrumentType: variety.InstrumentType, Price: '', ContractSize: '', MaturityDate: '' });
                    autoUnderlying.setVarietyId(variety.id);
                    autoUnderlying.selectFirst(variety.id);
                }
                this.viewData.VarietyName = variety ? variety.Name : '';
            },
            //变更标的
            changeUnderlying(data) {
                this.updateKey.underlying = new Date().getTime();
                this.viewData.UnderlyingId = data.id;
                this.viewData.InstrumentType = data.InstrumentType;
                Object.assign(this.viewData, { UnderlyingCode: data.Code, Price: data.Price, ContractSize: data.ContractSize, MaturityDate: data.MaturityDate });
                autoUnderlying.setVarietyId(data.VarietyId);
                this.changeVariety(data.VarietyId ? ylotc.varieties.find(x => x.id === data.VarietyId) : null);
                if (_initFlag > 0) {
                    _initFlag--;
                } else {
                    if (pageData.isHuaAn) {
                        $('#ContractSize').val(1);
                    } else {
                        this.index === 1 && $('#ContractSize').val(Math.abs(data.ContractSize * this.viewData.Coefficient));
                    }
                }
            },
            remove() {
                this.$destroy();
                this.$el.remove();
                itemManager.removeItem(this.id);
            },
            setIndex(index) {
                this.index = index;
            }
        },
        template: '#syntheticItemTPL1'
    });

    vue.$mount($('<div>').appendTo('#syntheticCont').get(0));

    return vue;
}

const itemManager = (new function () {

    var idSequence = 0;

    this.vueItems = [];

    this.addItem = function (viewData) {
        if (this.vueItems.length >= 4) return;

        let item = { id: idSequence++, index: this.vueItems.length + 1 };

        if (viewData) {
            item.viewData = viewData;
        }
        else if (this.vueItems.length) {
            item.viewData = Object.assign({}, _.last(this.vueItems).viewData);
        } else {
            item.viewData = {
                Coefficient: '1', InstrumentType: 'CommodityFutures', VarietyName: '',
                UnderlyingId: 0, UnderlyingCode: '', Price: '', ContractSize: '', MaturityDate: ''
            };
        }

        let vue = vueItem(item);

        this.vueItems.push(vue);

        $('#btnAdd').prop('disabled', this.vueItems.length >= 4);
    };

    this.removeItem = function (id) {
        let index = this.vueItems.findIndex(x => x.id === id);
        if (index >= 0) {
            this.vueItems.splice(index, 1);
            for (var i = index; i < this.vueItems.length; i++) {
                this.vueItems[i].setIndex(i + 1);
            }
        }
        $('#btnAdd').prop('disabled', false);
    };
}());

const vue2 = (new function () {

    var self = this;
    var _UpDownLimitCtrl, _MarginRateCtrl;

    $(function () {
        FastVue.numberInput('VolatilityRate', { append: '%', precision: 2, negative: false });
        _MarginRateCtrl = FastVue.numberInput('MarginRate', { append: '%', precision: 2, negative: false });
        self.changeUpDownLimitType();
    });

    self.changeUpDownLimitType = function () {
        if (!_UpDownLimitCtrl) {
            _UpDownLimitCtrl = FastVue.numberInput('UpDownLimit');
        } else {
            $('#UpDownLimit').val('');
        }
        let options = { append: $('#UpDownLimitType').val() === '百分比' ? '%' : '', precision: 2, negative: false };
        _UpDownLimitCtrl.setOptions(options);
    };

    self.getData = function () {
        return {
            Constant: _.trim($('#Constant').val()),
            ContractSize: _.trim($('#ContractSize').val()),
            MarginRate: _MarginRateCtrl.getValue(),
            VolatilityRate: _.trim($('#VolatilityRate').val()),
            UpDownLimit: _.trim($('#UpDownLimit').val())
        };
    };
});

const sumbitHandler = (new function () {
    this.saveData = function () {
        if (itemManager.vueItems.length < 2) {
            return main.message('合成标的至少需要2个标的进行组合');
        }
        let name = $("#UnderlyingCodeName").val().trim();
        if (!name) {
            return main.message("合成标的代码不能为空");
        }
        let req = {
            id: pageModel.id,
            Name: name,
            ...vue2.getData(),
            InstrumentType: ''
        };
        if (!req.VolatilityRate) {
            return main.message("波动率变化不能为空");
        }
        if (!req.UpDownLimit) {
            return main.message("涨跌停幅度不能为空");
        }
        var messages = [], unCodes = [];
        _.each(itemManager.vueItems, (item, index) => {
            let data = item.viewData;
            let index2 = index + 1;
            req['UnderlyingId' + index2] = data.UnderlyingId;
            req['UnderlyingCode' + index2] = data.UnderlyingCode;
            req['Coefficient' + index2] = data.Coefficient;

            //不能有重复的标的
            if (unCodes.includes(data.UnderlyingCode)) {
                messages.push("不能有重复的标的:" + data.UnderlyingCode);
            } else {
                unCodes.push(data.UnderlyingCode);
            }

            //系数 必须填写并且不能为0
            let coefficient = parseFloat(data.Coefficient);
            if (!coefficient || Math.abs(coefficient) < 1e-6) {
                messages.push(`S${index2}的系数 必须填写并且不能为0`);
            }
        });

        if (messages.length) {
            return main.message(messages.join('\n'));
        }
        let isModify = false;
        if (oldUnderlyingCodes.length != unCodes.length) {
            isModify = true;
        } else {
            for (var i = 0; i < oldUnderlyingCodes.length;i++) {
                if (oldUnderlyingCodes[i] != unCodes[i]) {
                    isModify = true;
                }
            }
        }
        let cfmMsg = '确认保存？';
        if (isModify && oldUnderlyingCodes.length!=0) {
            cfmMsg = '当前对构成组合的标的代码进行了调整，保存后将创建一个新的组合标的，且原组合标的仍旧保留，是否继续保存？';
        }
        main.confirm(cfmMsg, function () {
            main.post("/SyntheticUnderlying/SaveSyntheticUnderlying", req).done(function (res) {
                layer.closeMe('reloadData');
            });
        })
    }
}());