@using BaseOUDAL
@model  dividendrate_record
@{
    ViewBag.Title = "批量设置模型参数";
    ViewBag.FullTitle = "系统管理";
    Layout = "~/Views/Shared/_MainLayout.cshtml";
    var pageObj = new
    {
        tradetypes = GlobalData.GetSelectItems(ConsTrade.TradeTypesForOtcOptions.ToList()),
        underlys = JsDataModel.GetUnderlyings(true, true),
        optonTypes = GlobalData.GetSelectItems(new List<string> { "全部", "看涨", "看跌" })
    };
}
@section CSS{
    <style>
        .typeface { color: #394cbd }
        .form-group input { width: 220px; }
        .form-group select { width: 220px; }
        .bootstrap-select > select { width: 1px !important; max-width: 1px; min-width: auto !important; height: 1px !important; max-height: 1px !important; min-height: auto !important; left: -1px; top: -1px; }
        .bootstrap-select .dropdown-toggle .filter-option-inner-inner { text-align: center; }
    </style>
}
@section Js{
    <script src="~/front/calendar?v=@(HtmlUtil.JsVersion)"></script>
    <script src="~/Scripts/fast/fastVue.components.js?v=@HtmlUtil.JsVersion"></script>
    <script src="~/Statics/libs/upload/js/jquery.iframe-transport.js?v=@(HtmlUtil.JsVersion)"></script>
    <script src="~/Statics/libs/upload/js/jquery.fileupload.js?v=@(HtmlUtil.JsVersion)"></script>
    <script language="JavaScript">
        const page = @Json.Serialize(pageObj);
        var record = @Json.Serialize(Model);

        const inputFormatPercent = Object.freeze({ precision: 2, append: '%', negative: true });

        var selectName = "";

        $(function () {
            record.TradeType = _.split(record.TradeType, ",");
            record.UnderlyingCode = _.split(record.UnderlyingCode, ",");
        });

        window.vue = new Vue({
            el: "#listdiv",
            data: {
                record: record,
                page: page
            },
            mounted: function () {
                var thisObj = this;
                $('#TradeType').selectpicker('val', ["雪球期权"]);
                $('#UnderlyingCode').selectpicker({ liveSearch: true, dropdownAlignRight: true });
               thisObj.record.ValueDate = new moment(this.record.ValueDate).format("YYYY-MM-DD");
            },
            methods: {
                saveRecord: function () {
                    var thisObj = this;
                    var record = Object.assign({} , thisObj.record)
                    record.TradeType = record.TradeType.join(",");
                    record.UnderlyingCode = record.UnderlyingCode.join(",");
                    if (!_.trim(record.TradeType) || !_.trim(record.UnderlyingCode)) {
                        main.alert("请填写必填项");
                        return;
                    }
                    main.confirm("是否确定更新？更新后将影响估值参数，请从修改的日期开始重新收盘。", function () {
                        main.post("/System/DividendRateUpdateQuwey", { dividendrate_Record: record }).done(function () {
                            main.alert("更新成功");
                        })
                    });
                },
                editrecord: function () {
                    record.TradeType = _.split(record.TradeType, ",");
                    record.UnderlyingCode = _.split(record.UnderlyingCode, ",");
                }
            },
            components: {
                'vue-datepicker': FastVue.vueDatePicker(),
                'vue-number-input': FastVue.vueNumberInput(),
                'vue-niceselect': FastVue.vueNiceSelect(),
            },
        });

    </script>
}
<div class="container">
    <div id="listdiv" class="yc-panel">
        <div class="row">
            <div class="col-5"><span style="font-size:25px;">模型参数调整设置</span></div>
            <div class="col-auto">
                <input type="button" class="btn btn-primary" v-on:click="saveRecord()" value="一键更新" />
                <span class="typeface">此操作将更新所有满足以上条件的交易在指定日期的模型参数值</span>
            </div>
        </div>
        <hr />
        <div class="form-group row">
            <label class="col-md-2">调整后的模型参数值</label>
            <div class="col-auto">
                <vue-number-input name="DividendRate" v-model="record.DividendRate" v-bind:format="inputFormatPercent"></vue-number-input>
            </div>
        </div>
        <hr />
        <div class="form-group row">
            <label class="col-2">参数适用日期</label>
            <div class="col-auto">
                <input type="date" v-model="record.ValueDate" />
            </div>
        </div>
        <div class="form-group row">
            <label class="col-2">结构类型</label>
            <div class="col-auto">
                <select id="TradeType" name="TradeType" v-model="record.TradeType" multiple>
                    <option v-for="item in page.tradetypes" :value="item.Value">{{item.Text}}</option>
                </select>
                <span class="typeface">请至少选择一项</span>
            </div>
        </div>
        <div class="form-group row">
            <label class="col-2">标的代码</label>
            <div class="col-auto">
                <select id="UnderlyingCode" name="UnderlyingCode" v-model="record.UnderlyingCode" multiple>
                    <option v-for="item in page.underlys" :value="item.Code">{{item.Code}}</option>
                </select>
                <span class="typeface">请至少选择一项</span>
            </div>
        </div>
        <div class="form-group row">
            <label class="col-2">看涨看跌</label>
            <div class="col-auto">
                <select name="TradeType" v-model="record.OptionType">
                    <option v-for="item in page.optonTypes" :value="item.Value">{{item.Text}}</option>
                </select>
            </div>
        </div>
    </div>
</div>