@{
    ViewBag.Title = "期权交易";
    ViewBag.Menu = "交易管理-期权交易";

    Layout = "~/Views/Shared/_MainLayout.cshtml";

    var pageObj = new
    {
        TabIndex = ViewBag.TabIndex,
        tabIndexSelect = ViewBag.TabIndex,
        trade_yizhixing = ConsTrade.已执行,
        trade_yidaoqi = ConsTrade.已到期,
        trade_yipingcang = ConsTrade.已平仓,
        trade_querenchengjiao = ConsTrade.确认成交,
        trade_pingcangdaifuhe = ConsTrade.平仓待复核,
        trade_xingquandaifuhe = ConsTrade.行权待复核,
        trade_tiqianzhongzhi = ConsTrade.提前终止拒绝,
        AllTradeStatus = string.Join(",", ConsTrade.AllTradeStatus),
        abstractCompanyName = PS.Config.CompanyName ?? "",
        IsTradeVol = YLErp.PS.Config.IsTradeVol,
        TradeTabIndexEnum_cwqqjy = (int)TradeTabIndexEnum.场外成交记录,
        TradeTabIndexEnum_cwlj = (int)TradeTabIndexEnum.场外了结记录,
        configcolumn_data_cwcj = configcolumn_data.场外成交记录,
        configcolumn_data_cwlj = configcolumn_data.场外了结记录,
        setGroup = CurUser.交易管理_分组设置,
        isSw = YLErp.PS.Config.Is申万,
        isDongZheng = YLErp.PS.Config.Is润和,
        showUnderlyingVariety = PS.Config.IsGuoJun,
        isBroker = YLErp.PS.Config.ComponentVersion == YLErp.Configuration.ComponentVersion.Broker,
        valueDate = valuedateBLL.ValueDate.ToString("yyyy-MM-dd"),
        tradeCash = new trade_cash(),
        trade = new trade(),
        buttonStr = YLErp.PS.Config.Company == CompanyEnum.天风 ? "交易录入" : "交易特批",
        IsUseDisplayNotional = PS.Config.IsUseDisplayNotional,
        ViewTagPermission = CurUser.交易管理_交易标签查看权限,
        isHaiTong = PS.Config.Company == CompanyEnum.海通
    };

    var unwindTypes = new List<SelectListItem> { };
    unwindTypes.Add(new SelectListItem() { Text = "全部", Value = "全部" });
    unwindTypes.Add(new SelectListItem() { Text = "终止", Value = "终止" });
    unwindTypes.Add(new SelectListItem() { Text = "到期", Value = "到期" });
    unwindTypes.Add(new SelectListItem() { Text = "票息", Value = "票息" });

    var generateAmendDoc = PS.Config.TradeElement.IsGenerateAmendDoc;
    var needSendChangeEmail = PS.Config.TradeElement.IsAmendableAfterConfirm && PS.Config.TradeElement.IsGenerateAmendDoc;


}

@section JS{
    <script src="~/Scripts/app/tradeHelper.js?v=@HtmlUtil.JsVersion"></script>
    <script src="~/Statics/libs/export/excellentexport.js?v=@(HtmlUtil.JsVersion)"></script>
    <script>
        const page = @Json.Serialize(pageObj);
        page.tradeCash.ValueDate = page.valueDate;
        var generateAmendDoc= '@(generateAmendDoc?"1":"")';
        var needSendChangeEmail = '@(needSendChangeEmail ? "1":"")';
        var saleMode = "@((int)PS.Config.ErpElement.SaleMode)"
        var settleDate = "@ViewBag.settleDate";
        var tradeType = "@ViewBag.TradeType";
        var isUseStockEqvNotionalMax = "@PS.Config.ErpElement.UseStockEqvNotionalMax" =="True";
    </script>
    <script src="~/front/calendar?v=@(HtmlUtil.JsVersion)"></script>
    <script src="~/Scripts/app/trade/tradeList.js?v=@HtmlUtil.JsVersion"></script>
}

@section CSS{
    <link href="~/Style/Css/settag.css?v=@(HtmlUtil.JsVersion)" rel="stylesheet" />
    <style>
        #modalGroupTradeCashSave .modal-dialog {
            margin-top: 200px;
            margin-left: 500px;
        }

        #modalGroupTradeCashSave .form-group {
            float: left;
        }

        .ChildrenBG {
            background-color: #ADADAD !important;
        }
        .tag-item{
            height:17px;
            line-height:14px;
        }
        .tag-add {
            height: 17px;
            line-height: 14px;
        }
        .tag-context {
            padding: 0px;
        }

        #listGrid tr.jqgrow {
            height: 25px !important;
        }

        #listGrid tr.jqgrow > td {
            height: 25px !important;
            line-height: 20px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
    </style>
}

@*国泰君安期权交易tab筛选条件配置*@
@if (ViewBag.TabIndex == ((int)TradeTabIndexEnum.场外成交记录))
{
    <div class="searchdiv">
        <div class="first-wrap-gtja client">
            @Html.MyAceDropdownInput("AssetId", "簿记账户", AssetunitController.GetClientassetunit())

            @if (YLErp.PS.Config.Is东兴)
            {
                @Html.ShortInput("ContractCode", "合约编号")
            }
            else
            {
                @Html.ShortInput("TradeNumber", "交易编号")
            }
            @Html.MyAceDropdownInput("TraderName", "交易员", GlobalData.GetAllTrader())
            @Html.MyAceDropdownInput("ClientId", "交易对手方", ClientDataModel.GetAllClient())
            @Html.SearchDateRange("TradeDate", "成交日期")
            @Html.SearchDateRange("ExerciseDate", "到期日期")
            @Html.SearchDateRange("UnwindDate", "了结日期")
            @Html.MyAceDropdownInput2("ExerciseMode", "行权方式", ConsTrade.ExerciseType.GetSelectItems())
            @{
                var types = ConsTrade.OptionTradeTypes.Concat(new[] { /*"结构化交易",*/ "黑箱结构" }).ToList();
                if (PS.Config.Is润和)
                {
                    types.Add("结构化产品");
                }
            }
            @Html.MyAceDropdownInput("TradeTypes", "结构类型", GlobalData.GetSelectItems(types))
            @Html.ShortInput("StructureType", "组合类型")
            <div class="search-group">
                <span class="search-label">标的代码</span>
                <select class="" data-placeholder="请选择 标的代码" id="UnderlyingId" name="UnderlyingId" multiple></select>
            </div>
            @Html.MyAceDropdownInput("TradeStatus", "交易状态", GlobalData.GetSelectItems(ConsTrade.AllTradeStatus), true)
            <a class="btn btn-sm btn-outline-danger mx-4" data-toggle="collapse" href="#moreFieldDiv" role="button" aria-expanded="false" aria-controls="moreFieldDiv">
                更多...
            </a>
            <div class="collapse" id="moreFieldDiv">
                @Html.ShortInput("UnWindTimes", "了结次数")

                @Html.MyAceDropdownInput2("OptionType", "看涨看跌", GlobalData.GetSelectItems(new List<string> { "看涨", "看跌" }))
                @if (CurUser.交易管理_分组设置)
                {
                    @Html.ShortInput("GroupNames", "分组名")
                }

                @Html.MyAceDropdownInput("GroupId", "簿记账户组", AssetUnitModel.GetAllAssetUnitGroupItem())
            </div>
            @Html.MyAceDropdownInput("TagIds", "标签值", TagController.GetTradeTagList(CurUser))
        </div>
    </div>
    <div class="searchdiv">
        <div>
            @MyControls.SearchBtn()
            &emsp;
            @if (CurUser.交易管理_交易新增)
            {
                @MyControls.Btn("新增", "startAddtrade()")
            }
            @if (CurUser.交易管理_交易导入)
            {
                @MyControls.Btn("导入", "uploadTrade()")
            }
            @if (CurUser.交易管理_交易导出)
            {
                @MyControls.Btn("导出", "exportTradeChoose()")
            }
            @if (CurUser.交易管理_并表数据上报)
            {
                @MyControls.Btn("并表数据上报", "Customexport()")
            }
            &emsp;
            @if (PS.Config.Company == CompanyEnum.国投)
            {
                @MyControls.Btn("日终数据采集", "ExportClientEodPosition()")
            }

            @MyControls.Btn("今日交易", "openTradeConfirmList()")
            &emsp;
            @if (CurUser.交易管理_特批批量确认)
            {
                @MyControls.Btn("批量确认", "confirmAllSelect()")
            }
            @if (CurUser.交易管理_批量了结)
            {
                @MyControls.Btn("批量了结", "uploadFinishedTrades()")
            }
            @if (CurUser.交易管理_批量设置观察价格)
            {
                @MyControls.Btn("批量设置观察价格", "batchSetObservationPrice()")
            }
            @if (CurUser.交易管理_批量风险维护)
            {
                @MyControls.Btn("批量风险维护", "uploadEodTradeRiskManualExcel()")
            }
            @if (CurUser.交易管理_批量波动率导入)
            {
                @MyControls.Btn("批量波动率导入", "uploadTradeVolExcel()")
            }
            @if (CurUser.交易管理_批量对冲波动率导入)
            {
                @MyControls.Btn("批量对冲波动率导入", "uploadTradeHedgeVolExcel()")
            }

            @MyControls.Btn("批量分红率和无风险利率导入", "UploadDividendRateAndNoRiskRateExcel()")
            &emsp;
            @if (CurUser.交易管理_分组设置)
            {
                if (PS.Config.Company != CompanyEnum.国泰君安)
                {
                    @MyControls.Btn("加入分组", "addTradeGroup()")
                    @MyControls.Btn("取消分组", "cancelTradeGroup()")
                }
                @MyControls.Btn("新增分组交易", "addGroupTrade()")
                @MyControls.Btn("拆解分组交易", "dismissGroupTrade()")
                @MyControls.Btn("分组了结", "addGroupTradeCash()")
                @MyControls.Btn("分组了结列表", "groupTradeCashActionList()")
            }
            &emsp;
            @if (YLErp.PS.Config.ClientElement.InterfaceApprovalMode > 0 && CurUser.风险控制_接口审批列表)
            {
                @MyControls.Btn("匹配审批", "approvalList()")
            }

            <div style="width: 30px; display: inline;margin-right:20px;" onclick="showcolumnChooser();return false;">
                <img src="~/Images/configure.png" />
            </div>
            <div class="mt-1">
                <label>波动率类型:</label>
                <select class="VolTypes" change="changeVolType()" id="VolTypes">
                    <option value="持仓">持仓</option>
                </select>
            </div>
        </div>
    </div>
}

<table id="excelTable" style="display:none"></table>
<a onfocus="this.blur();" download="code.csv" id="createInvote" class="ipt-todo hide">code</a>
<a onfocus="this.blur();" style="display:none;" download="code.xls" id="createInvote2" class="ipt-todo hide">code</a>
@if (ViewBag.TabIndex == ((int)TradeTabIndexEnum.场外了结记录))
{
    <div class="searchdiv">
        <div class="first-wrap client">
            @Html.ShortInput("TradeNumber", "交易编号:")
            @Html.MyAceDropdownInput("ClientId", "交易对手方:", ClientDataModel.GetAllClient())
            @Html.SearchDateRange("TradeDate", "成交日期:")
            @Html.SearchDateRange("ExerciseDate", "到期日期:")
            @Html.MyAceDropdownInput2("ExerciseMode", "行权方式:", ConsTrade.ExerciseType.GetSelectItems())
            @{ var types = ConsTrade.OptionTradeTypes.Concat(new[] { /*"结构化交易",*/ "黑箱结构" }).ToList();}
            @Html.MyAceDropdownInput("TradeTypes", "结构类型", GlobalData.GetSelectItems(types))
            @Html.ShortInput("StructureType", "组合类型")
            <div class="search-group">
                <span class="search-label">标的代码</span>
                <select class="" data-placeholder="请选择 标的代码" id="UnderlyingId" name="UnderlyingId" multiple></select>
            </div>
            @Html.MyAceDropdownInput("TradeStatus", "交易状态:", GlobalData.GetSelectItems(ConsTrade.AllTradeStatus), true)
            @Html.SearchDateRange("UnwindDate", "了结日期")
            @Html.MyAceDropdownInput2("UnWindType", "了结方式:", unwindTypes, appendEmptyAll: false)
            @Html.ShortInput("UnWindTimes", "了结次数")
            @Html.MyAceDropdownInput("TagIds", "标签值", TagController.GetTradeTagList(CurUser))
        </div>
    </div>
    <div class="searchdiv">
        <div>
            @MyControls.SearchBtn()
            @if (CurUser.交易管理_交易导出)
            {
                <button onclick="exportTrade()" class="btn btn-primary">导出当前字段</button>
                <button onclick="exportUnwindMultiFactors()" class="btn btn-primary">导出全部字段</button>
                <button onclick="exporttradetype()" class="btn btn-primary">导出交易简讯</button>
            }

            &emsp;
            <div style="width: 30px; display: inline;" onclick="showcolumnChooser();return false;">
                <img src="~/Images/configure.png" />
            </div>
        </div>
    </div>
}

<div class="tabbable">
    <ul id="myTab" class="nav-main" style="display:inline-block;">
        <li @(ViewBag.TabIndex == (int)TradeTabIndexEnum.场外成交记录 ? "class=active" : "")>
            <a href="/trade/tradeList?tabIndex=@((int)TradeTabIndexEnum.场外成交记录)">场外成交记录</a>
        </li>
        <li @(ViewBag.TabIndex == (int)TradeTabIndexEnum.场外了结记录 ? "class=active" : "")>
            <a href="/trade/tradeList?tabIndex=@((int)TradeTabIndexEnum.场外了结记录)">场外了结记录</a>
        </li>
        <li @(ViewBag.TabIndex == (int)TradeTabIndexEnum.场内成交记录 ? "class=active" : "")>
            <a href="/trade/tradeList?tabIndex=@((int)TradeTabIndexEnum.场内成交记录)&sourceType=1">场内成交记录</a>
        </li>
    </ul>
    @if (CurUser.交易管理_交易标签调整权限)
    {
        <div class="batch-tag" onclick="BatchSetTradeTag();">
            <img src="~/Images/tag.jpg" /><span>标记</span>
        </div>
    }
</div>

@Html.Raw(JqGridSimple.OutTable())

<script type="text/html" id="exportTpl">
    <div style="padding:20px">
        <p><input class="btn btn-primary  " type="button" onclick="previewTradeAbstract();return false;" value="交易简讯"></p>
        <p><input class="btn btn-primary  " type="button" onclick="exportTrade();return false;" value="导出当前字段"><span class="text-muted small">上限10000条</span></p>
        <p><input class="btn btn-primary  " type="button" onclick="exportTradeMultiFactors();return false;" value="导出全部字段"></p>
    </div>
</script>

<!--录入组合交易了结信息-->
<div class="modal" tabindex="-1" id="modalGroupTradeCashSave" data-backdrop="static">
    <div class="modal-dialog">
        <div class="modal-content" style="width:1020px;">
            <div class="modal-header">
                <h5 class="modal-title">录入组合交易了结信息</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form class="mx-auto form-layout form-layout-save p-0 m-0 border-0" style="width:1000px;border-radius:0;box-shadow:none">
                    <div style="margin: unset;">
                        <div class="form-group col-6">
                            <label class="formlabel">了结类型</label>
                            <select class="form-input" v-model="tradeCash.Action='全部平仓'">
                                <option value="全部平仓">全部平仓</option>
                                <option value="部分平仓">部分平仓</option>
                                <option value="全部提前行权">全部提前行权</option>
                                <option value="部分提前行权">部分提前行权</option>
                                <option value="到期行权">到期行权</option>
                                <option value="到期">到期</option>
                            </select>
                        </div>
                        <div class="form-group col-6">
                            <label class="form-label">标的代码</label>
                            <input type="text" class="form-input" v-model="trade.UnderlyingCode" disabled />
                        </div>
                        <div class="form-group col-6">
                            <label class="formlabel">标的价格</label>
                            <vue-number-input class="form-input" v-model="tradeCash.FinalPrice" v-bind:format="{ precision: otcformat.trading.umprice.precision, append: '' }"></vue-number-input>
                            <a href="javascript:void(0)" v-on:click="refreshUnderlyingPrice()">
                                <span title="使用系统标的价格" class="glyphicon glyphicon-refresh"></span>
                            </a>
                        </div>
                        <div class="form-group col-6">
                            <label class="formlabel">执行价格</label>
                            <vue-number-input class="form-input" v-model="trade.Strike" disabled v-bind:format="inputFormatStrike"></vue-number-input>
                        </div>
                        <div class="form-group col-6">
                            <label class="formlabel">开仓数量</label>
                            <vue-number-input class="form-input" v-model="trade.TradeOriginalAmount" disabled v-bind:format="inputFormatTradeAmount"></vue-number-input>
                        </div>
                        <div class="form-group col-6">
                            <label class="formlabel">开仓名义本金</label>
                            <vue-number-input class="form-input" v-model="trade.OriginalStockEqvNotional" disabled v-bind:format="inputFormatEqvNotional"></vue-number-input>
                        </div>
                        <div class="form-group col-6">
                            <label class="formlabel">持仓数量</label>
                            <vue-number-input class="form-input" v-model="tradeCash.TradeAmount" disabled v-bind:format="inputFormatTradeAmount"></vue-number-input>
                        </div>
                        <div class="form-group col-6">
                            <label class="formlabel">持仓名义本金</label>
                            <vue-number-input class="form-input" v-model="trade.StockEqvNotional" disabled v-bind:format="inputFormatEqvNotional"></vue-number-input>
                        </div>
                        <div class="form-group col-6">
                            <label class="formlabel">了结日期</label>
                            <vue-datepicker class="text-box form-input" v-model="tradeCash.ValueDate" />
                        </div>
                        <div v-if="childTradeCashs.length>0">
                            <div class="form-group col-6">
                                <label class="formlabel">了结方式</label>
                                <select class="form-input" v-model="trade.IsUsePremiumRate" v-on:change="changeIsUsePremiumRate">
                                    <option :value="false">数量平仓</option>
                                    <option :value="true">名义本金平仓</option>
                                </select>
                            </div>
                            <div class="form-group col-6">
                                <label class="formlabel">了结总额</label>
                                <vue-number-input class="form-input" v-model="tradeCash.Amount" v-bind:format="inputFormatTradeAmount" v-on:input="changeAmount"></vue-number-input>
                            </div>
                        </div>
                        <div v-if="trade.IsUsePremiumRate=='true'||trade.IsUsePremiumRate==true">
                            <div class="form-group col-md-6" v-show="!tradeCash.IsUnwindStockEqvNotional">
                                <label class="formlabel">平仓比例</label>
                                <vue-number-input class="text-box" v-model="tradeCash.UnwindPercentRate" v-on:input="changeUnwindPercentRate" v-bind:format="inputFormatPremiumRate"></vue-number-input><span v-on:click="exchangeToUnwindStockEqvNotional">%</span>
                            </div>
                            <div class="form-group col-md-6" v-show="tradeCash.IsUnwindStockEqvNotional">
                                <label class="formlabel">平仓名义本金</label>
                                <vue-number-input class="form-input" v-model="tradeCash.UnwindStockEqvNotional" v-bind:format="inputFormatEqvNotional"></vue-number-input><span v-on:click="exchangeToUnwindPercentRate">￥</span>
                            </div>
                        </div>
                        <div v-else>
                            <div class="form-group col-6">
                                <label class="formlabel">了结数量</label>
                                <vue-number-input class="form-input" v-model="tradeCash.UnwindTradeAmount" v-on:input="changeUnwindTradeAmount" v-bind:format="inputFormatTradeAmount"></vue-number-input>
                            </div>
                        </div>
                        <div v-if="childTradeCashs.length>0">
                            <table class="table table-client mt-4">
                                <thead>
                                    <tr>
                                        <th>操作</th>
                                        <th>交易编号</th>
                                        <th>期权类型</th>
                                        <th>持仓数量</th>
                                        <th>持仓名义本金</th>
                                        <th style="width: 80px">了结数量</th>
                                        <th style="width: 100px">了结名义本金</th>
                                        <th style="width: 100px">了结总额</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr v-for="item in childTradeCashs">
                                        <td> <button class="btn btn-primary btn-sm mr-2" type="button" v-on:click="starttradeView(item.EncryptId)">查看</button></td>
                                        <td>{{item.TradeNumber}}</td>
                                        <td>{{item.TradeType}}</td>
                                        <td>{{item.TradeAmount}}</td>
                                        <td>{{item.StockEqvNotional}}</td>
                                        <td><vue-number-input class="form-input" style="width: 80px" v-model="item.UnwindTradeAmount" v-on:input="changeChildUnwindTradeAmount(item)" v-bind:format="inputFormatTradeAmount"></vue-number-input></td>
                                        <td><vue-number-input class="form-input" style="width: 100px" v-model="item.UnwindStockEqvNotional" v-on:input="changeChildUnwindStockEqvNotional(item)" v-bind:format="inputFormatEqvNotional"></vue-number-input></td>
                                        <td><vue-number-input class="form-input" style="width: 100px" v-model="item.Amount" v-on:input="changeChildAmount" v-bind:format="inputFormatTradeAmount"></vue-number-input></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <div class="mx-auto">
                    <button type="button" class="btn btn-primary btn-save" data-dismiss="modal" v-on:click="saveGroupTradeCash()">保存</button>
                    <button type="button" class="btn btn-primary btn-close" data-dismiss="modal">关闭</button>
                </div>
            </div>
        </div>
    </div>
</div>