@model ClientPricingParam
@{
    ViewBag.Title = "客户报价参数 | 编辑";
    Layout = "~/Views/Shared/_InfoLayout.cshtml";
}
@section CSS{
    <link href="~/Statics/libs/datetime/clndr/clndr.css" rel="stylesheet" />
    <style>
        #spdayinfo { margin: 0; }
        .dayin { background: #fff; }
        .dayin input { background: #3A96FF; color: #fff; }
        .dayin { background: #fff; }
        .dayin input { background: #3A96FF; color: #fff; }
        .today { background-color: transparent !important; }
    </style>
}
@section JS{
    <script src="~/Statics/libs/datetime/moment/moment.min.js"></script>
    <script src="~/Statics/libs/datetime/moment/zh-cn.js"></script>
    <script src="~/Statics/libs/datetime/clndr/clndr.js"></script>

    <script type="text/javascript">
        var submitclick_client_pricing_param = false;
        $(function () {
            $(".datepicker").datepicker({ changeMonth: true, changeYear: true, showButtonPanel: true, showOtherMonths: true, selectOtherMonths: true });
            SetAceDropDown(false);
            $("#option_exercisedate").change(function () {
                setDays();
            });
            $("#option_startdate").change(function () {
                setDays();
            });
            main.post("/calendar/GetCalendars").done(function (res) {
                Calendar = res[2]; //今年
                $("#yeardiv").html("{0}年 {1}".template(Calendar.Year, Calendar.Country));
                initialCalendar();
            });
        });

        $(function () {
            $("#option_exercisedate").parent().append("<p id='spdayinfo'>{0}</p>".template(""));
            setDays();
            $("#bid_tuning_day #ask_tuning_day").blur(function () {
                setInfo();
            });
            $("#ask_tuning_day").blur(function () {
                setInfo();
            });
        });

        function setDays() {
            var from = $("#option_startdate").val();
            var to = $("#option_exercisedate").val();
            if (!from || !to) return;
            main.post("/calendar/GetWorkDays", { from: from, to: to }).done(function (res) {
                from = moment(from);
                to = moment(to);
                var normalday = moment.duration(to.diff(from));
                $("#workday").val(res.obj);
                $("#normalday").val(normalday.asDays());
                setInfo(res.obj, normalday.asDays());
            });
        }
        function setInfo() {
            var workday = numeral($("#workday").val()).value();
            var normalday = numeral($("#normalday").val()).value();
            var bid_tunningday = numeral($("#bid_tuning_day").val()).value();
            var ask_tunningday = numeral($("#ask_tuning_day").val()).value();
            var tempdata = "工作日间隔{0}天，买价调整{1}天，卖价调整{2}天".template(workday, bid_tunningday + workday, ask_tunningday + workday);
            $("#spdayinfo").html(tempdata);
            $("#spdayinfo").prop("title", tempdata);
        }

        function checkSubmitData() {
            //调整天数不能超过间隔
            var bid_tuning_day = Math.abs($("#bid_tuning_day").val());
            var ask_tuning_day = Math.abs($("#ask_tuning_day").val());
            var workday = numeral($("#workday").val()).value();
            if (bid_tuning_day > workday || ask_tuning_day > workday) {
                main.message("调整差值不能超过工作日间隔");
                return false;
            }

            var pass = $('#client_pricing_paramEditForm').valid();
            return pass;
        }

        function saveclient_pricing_param() {
            if (!checkSubmitData()) return false;

            var data = $("#client_pricing_paramEditForm").serialize();
            main.post("/client_pricing_param/client_pricing_paramEditJson", data).done(function (res) { window.location.href = "/client_pricing_param/client_pricing_paramview?enid=" + res.obj.EncryptId; try { window.parent.reloadclient_pricing_param(); } catch (e) { } });
        }

        function initialCalendar() {
            main.clndr = {};
            for (var month = 1; month <= 12; month++) {
                setMonthCalendar(Calendar.Year, month, "month" + month);
            }

            //今天显示样式补丁
            $(".today").removeClass("today");
        }

        function setMonthCalendar(year, month, id) {
            //var month = 1;
            //var year = Calendar.Year;
            //一月份所有事件
            var momentMonth = moment({ year: year, month: (month - 1) });
            var monthpad = (month + "").padStart(2, "0");
            var startDate = "{0}-{1}-01".template(year, monthpad);
            var endDate = "{0}-{1}-{2}".template(year, monthpad, momentMonth.daysInMonth());
            var eventArray1 = [];  //控件需要日期
            Calendar.HolidyObj = JSON.parse(Calendar.HolidayJson);
            var monthArray = [year, monthpad];
            var holidays1 = $.grep(Calendar.HolidyObj, function (val) {
                return val.indexOf(monthArray.join(",")) >= 0;
            });

            $.each(holidays1, function (i, d) {
                eventArray1.push({ startDate: d, endDate: d });
            });
            //main.clndr.passInATemplate =
            $('#' + id).clndr({
                template: $('#clndr-template').html(),
                events: eventArray1,
                constraints: {
                    startDate: startDate,
                    endDate: endDate
                },
                multiDayEvents: {
                    singleDay: 'date',
                    endDate: 'endDate',
                    startDate: 'startDate'
                },
                clickEvents: {
                    click: function (target) {
                        //今天显示样式补丁
                        $(".today").removeClass("today");
                    },
                    today: function () {
                    },
                    nextMonth: function () {
                    },
                    previousMonth: function () {
                    },
                    onMonthChange: function () {
                    },
                    nextYear: function () {
                    },
                    previousYear: function () {
                    },
                    onYearChange: function () {
                    },
                    nextInterval: function () {
                    },
                    previousInterval: function () {
                    },
                    onIntervalChange: function () {
                    }
                }
            });

        }
    </script>
}

@using (Html.BeginForm("client_pricing_paramEdit", "client_pricing_param", FormMethod.Post, new { id = "client_pricing_paramEditForm", autocomplete = "off" }))
{
    <div class="well">
        <fieldset>
            <legend>客户报价参数修改</legend>
            <div class="form-layout col2">
                <input type="hidden" value="@Model.id" name="id" id="id" />
                @Html.HiddenFor(model => model.EncryptId)
                @Html.MyDateFor(model => model.option_startdate, true)
                @Html.MyDateFor(model => model.option_exercisedate, true)
                @Html.MyIntFor(model => model.bid_tuning_day)
                @Html.MyIntFor(model => model.ask_tuning_day)
                @Html.MyDropdownFor1(model => model.validstate, ConsGlobal.ValidStates(), appendBlank: false)
                <input type="hidden" value="" id="workday" />
                <input type="hidden" value="" id="normalday" />
            </div>
        </fieldset>
    </div>
    <div class="clearfix"></div>
    <div class="form-buttons">
        @MyControls.Btn("保存", "saveclient_pricing_param()")
        @MyControls.Btn("关闭", "layer.closeMe()")
    </div>
    <div id="yeardiv"></div>
    <div class="well" style="margin:0px auto;margin-top:10px;" id="divyearmonth">
        <div class="form-group row">
            <div class="col-3">
                <div id="month1" class="cal2"></div>
            </div>
            <div class="col-3">
                <div id="month2" class="cal2"></div>
            </div>
            <div class="col-3">
                <div id="month3" class="cal2"></div>
            </div>
            <div class="col-3">
                <div id="month4" class="cal2"></div>
            </div>
        </div>
        <div class="form-group row">
            <div class="col-3">
                <div id="month5" class="cal2"></div>
            </div>
            <div class="col-3">
                <div id="month6" class="cal2"></div>
            </div>
            <div class="col-3">
                <div id="month7" class="cal2"></div>
            </div>
            <div class="col-3">
                <div id="month8" class="cal2"></div>
            </div>
        </div>
        <div class="form-group row">
            <div class="col-3">
                <div id="month9" class="cal2"></div>
            </div>
            <div class="col-3">
                <div id="month10" class="cal2"></div>
            </div>
            <div class="col-3">
                <div id="month11" class="cal2"></div>
            </div>
            <div class="col-3">
                <div id="month12" class="cal2"></div>
            </div>
        </div>
    </div>

    <script type="text/template" id="clndr-template">
        <div class="clndr-controls">
            <div class="month"><%= month %></div>
        </div>
        <div class="clndr-grid">
            <div class="days-of-the-week">
                <% _.each(daysOfTheWeek, function (day) { %>
                <div class="header-day"><%= day %></div>
                <% }); %>
                <div class="days">
                    <% _.each(days, function (day) { %>
                    <div class="<%= day.classes %>"><%= day.day %></div>
                    <% }); %>
                </div>
            </div>
        </div>
    </script>
}