@using WMS.BZWeb;
@{
    ViewBag.Title = "DOF2";
    Layout = "~/Views/Shared/_Form.cshtml";
}
<link href="~/Content/jquery/plugin/jquery-ui/jquery-ui.min.css" rel="stylesheet" />
<script src="~/Content/jquery/plugin/jquery-ui/jquery-ui.min.js"></script>
<style>
    .lr-form-wrap {
        padding-top: 3px;
    }

    .center {
        height: calc(100% - 60px);
        display: flex;
        box-sizing: border-box;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }

        .center .left {
            position: relative;
            padding-left: 177px;
            padding-top: 20px;
            display: flex;
            box-sizing: border-box;
            flex-direction: row;
            justify-content: flex-start;
            align-items: flex-start;
        }

        .center .right {
            height: 100%;
            width: 612px;
            display: flex;
            flex-direction: column;
            box-sizing: border-box;
            padding: 5px 0 0 5px;
            border-left: 1px solid #bdcadb;
        }

            .center .right .rItem {
                margin-bottom: 5px;
            }

    .circle {
        width: 50px;
        height: 50px;
        margin-left: 2px;
        border-radius: 50%;
        background-color: rgb(255, 255, 255);
        border: 2px solid rgb(0, 0, 0);
        text-align: center;
        line-height: 45px;
        cursor: pointer;
        position: absolute;
    }

    .bordercircle {
        width: 50px;
        height: 50px;
        margin-left: 2px;
        border-radius: 50%;
        background-color: rgb(255, 255, 255);
        border: 3px solid #00ffff;
        text-align: center;
        line-height: 45px;
        cursor: pointer;
        position: absolute;
    }

    .circle18 {
        width: 42px;
        height: 42px;
        margin-left: 2px;
        border-radius: 50%;
        background-color: rgb(255, 255, 255);
        border: 2px solid rgb(0, 0, 0);
        text-align: center;
        line-height: 40px;
        cursor: pointer;
        position: absolute;
    }

    .bordercircle18 {
        width: 42px;
        height: 42px;
        margin-left: 2px;
        border-radius: 50%;
        background-color: rgb(255, 255, 255);
        border: 3px solid #00ffff;
        text-align: center;
        line-height: 40px;
        cursor: pointer;
        position: absolute;
    }

    .circle34 {
        width: 46px;
        height: 46px;
        margin-left: 2px;
        border-radius: 50%;
        background-color: rgb(255, 255, 255);
        border: 2px solid rgb(0, 0, 0);
        text-align: center;
        line-height: 40px;
        cursor: pointer;
        position: absolute;
    }

    .bordercircle34 {
        width: 46px;
        height: 46px;
        margin-left: 2px;
        border-radius: 50%;
        background-color: rgb(255, 255, 255);
        border: 3px solid #00ffff;
        text-align: center;
        line-height: 40px;
        cursor: pointer;
        position: absolute;
    }

    .selectedactive {
        border-color: #05e600
    }

    .havegoods {
        background-color: #0066ff
    }

    .Sideout {
        border-color: #0066ff
    }

    .yellowCircle {
        background-color: #f59a23
    }

    .purpleCircle {
        background-color: #8400ff
    }

    .lightgreenCircle {
        background-color: #95f204
    }
</style>

<div class="lr-form-wrap">

    <div class="center">
        <div id="allcontainer" class="left" style="flex-direction: column;">
            <select id="StampChildType" style="display:inline-block;width:200px;margin-top:-15px;margin-left:-140px;text-align:center;font-size:15px;font-weight: bold;" class="lr-select"></select>


            <div id="StampChildType1" style="width:284px;height:196px; border: 1px solid #bdcadb ;margin-left:-170px;margin-top:49px">
                <div id="3" dfm="3" data-geo="" class="clickcircle circle" style=" left: 47px; top: 90px;">3</div>
                <div id="2" dfm="2" data-geo="" class="clickcircle circle" style=" left: 47px; top: 146px;">2</div>
                <div id="1" dfm="1" data-geo="" class="clickcircle circle" style=" left: 47px; top: 202px;">1</div>
                <div id="6" dfm="6" data-geo="" class="clickcircle circle" style=" left: 97px; top: 110px;">6</div>
                <div id="5" dfm="5" data-geo="" class="clickcircle circle" style=" left: 97px; top: 166px;">5</div>
                <div id="4" dfm="4" data-geo="" class="clickcircle circle" style=" left: 97px; top: 222px;">4</div>
                <div id="9" dfm="9" data-geo="" class="clickcircle circle" style=" left: 150px; top: 90px;">9</div>
                <div id="8" dfm="8" data-geo="" class="clickcircle circle" style=" left: 150px; top: 146px;">8</div>
                <div id="7" dfm="7" data-geo="" class="clickcircle circle" style=" left: 150px; top: 202px;">7</div>
                <div id="12" dfm="12" data-geo="" class="clickcircle circle" style=" left: 201px; top: 110px;">12</div>
                <div id="11" dfm="11" data-geo="" class="clickcircle circle" style=" left: 201px; top: 166px;">11</div>
                <div id="10" dfm="10" data-geo="" class="clickcircle circle" style=" left: 201px; top: 222px;">10</div>
            </div>

            <div id="StampChildType2" style="width:284px;height:196px; border: 1px solid #bdcadb ;margin-left:-170px;margin-top:49px">

                <div id="1" dfm="1" data-geo="" class="clickcircle circle" style=" left: 47px; top: 202px;">1</div>
                <div id="6" dfm="6" data-geo="" class="clickcircle circle" style=" left: 97px; top: 110px;">6</div>
                <div id="5" dfm="5" data-geo="" class="clickcircle circle" style=" left: 97px; top: 166px;">5</div>
                <div id="4" dfm="4" data-geo="" class="clickcircle circle" style=" left: 97px; top: 222px;">4</div>
                <div id="9" dfm="9" data-geo="" class="clickcircle circle" style=" left: 150px; top: 90px;">9</div>
                <div id="8" dfm="8" data-geo="" class="clickcircle circle" style=" left: 150px; top: 146px;">8</div>
                <div id="7" dfm="7" data-geo="" class="clickcircle circle" style=" left: 150px; top: 202px;">7</div>
                <div id="12" dfm="12" data-geo="" class="clickcircle circle" style=" left: 201px; top: 110px;">12</div>

            </div>

            <div id="StampChildType3" style="width:284px;height:196px; border: 1px solid #bdcadb ;margin-left:-170px;margin-top:49px">
 
                <div id="2" dfm="2" data-geo="" class="clickcircle circle" style=" left: 47px; top: 156px;">2</div>
                <div id="1" dfm="1" data-geo="" class="clickcircle circle" style=" left: 97px; top: 124px;">1</div>
                <div id="4" dfm="4" data-geo="" class="clickcircle circle" style=" left: 97px; top: 180px;">4</div>
                <div id="6" dfm="6" data-geo="" class="clickcircle circle" style=" left: 150px; top: 100px;">6</div>
                <div id="5" dfm="5" data-geo="" class="clickcircle circle" style=" left: 150px; top: 156px;">5</div>
                <div id="3" dfm="3" data-geo="" class="clickcircle circle" style=" left: 150px; top: 212px;">3</div>

                
            </div>

            <div id="StampChildType4" style="width: 284px; height: 218px; border: 1px solid rgb(189, 202, 219); margin-left: -170px; margin-top: 50px;">
                <div data-geo="" id="4" dfm="4" class="clickcircle circle" style=" left: 30px; top: 110px;">4</div>
                <div data-geo="" id="2" dfm="2" class="clickcircle circle" style=" left: 30px; top: 176px;">2</div>
                <div data-geo="" id="1" dfm="1" class="clickcircle circle" style=" left: 30px; top: 232px;">1</div>
                <div data-geo="" id="6" dfm="6" class="clickcircle circle" style=" left: 92px; top: 110px;">6</div>
                <div data-geo="" id="5" dfm="5" class="clickcircle circle" style=" left: 92px; top: 176px;">5</div>
                <div data-geo="" id="3" dfm="3" class="clickcircle circle" style=" left: 92px; top: 232px;">3</div>
                <div data-geo="" id="10" dfm="10" class="clickcircle circle" style=" left: 154px; top: 110px;">10</div>
                <div data-geo="" id="8" dfm="8" class="clickcircle circle" style=" left: 154px; top: 176px;">8</div>
                <div data-geo="" id="7" dfm="7" class="clickcircle circle" style=" left: 154px; top: 232px;">7</div>
                <div data-geo="" id="12" dfm="12" class="clickcircle circle" style=" left: 216px; top: 110px;">12</div>
                <div data-geo="" id="11" dfm="11" class="clickcircle circle" style=" left: 216px; top: 176px;">11</div>
                <div data-geo="" id="9" dfm="9" class="clickcircle circle" style=" left: 216px; top: 232px;">9</div>
            </div>
             
        </div>

        <div class="right" style="margin-left:5px;margin-top:-5px;height:666px">
            <div class="rItem" id="form">
                <div class="col-xs-12 lr-form-item" style="padding-left:50px;">
                    <div class="lr-form-item-title" style="width:100px;">垛型编码:</div>
                    <input id="Code" type="text" style="width:410px;margin-left:54px;" class="form-control" isvalid="yes" checkexpession="NotNull" placeholder="请输入垛型编码" />
                </div>
                <div class="col-xs-12 lr-form-item" style="padding-left:50px;">
                    <div class="lr-form-item-title" style="width:100px;">垛型名称:</div>
                    <input id="Name" type="text" class="form-control" style="width:410px;margin-left:54px;" isvalid="yes" checkexpession="NotNull" placeholder="请输入垛型名称" />
                </div>
                <div class="col-xs-12 lr-form-item" style="padding-left:50px;">
                    <div class="lr-form-item-title" style="width:90px;">投料信息:</div>
                    <input id="BomName" readonly class=" btn-group  form-control" type="text" style="width:372px;margin-left:55px;" placeholder="请选择投料信息" />
                    <a id="SelectBomCode" class="btn-group btn-group-sm"><i class="fa fa-search"></i>&nbsp;<span class="lrlg">查询</span></a>
                </div>
                <input id="ProMaterCode" type="text" style="display:none" />
                @* <div class="col-xs-12 lr-form-item" style="padding-left:50px;">
                <div class="lr-form-item-title" style="width:100px;">产出物料编码:</div>
                <div id="ProMaterCode" style="width:410px;margin-left:55px;" isvalid="yes" checkexpession="NotNull" placeholder="请选择产出物料编码"></div>
                </div>
                <div class="col-xs-6 lr-form-item" style="padding-left:50px;">
                <div class="lr-form-item-title" style="width:90px;">工字轮个数:</div>
                <input id="HWCountQty" type="text" class="form-control" style="width:110px;margin-left:55px;" isvalid="yes" checkexpession="NotNull" placeholder="请输入工字轮个数" />
                </div>
                *@

                <div class="col-xs-6 lr-form-item" style="padding-left:50px;">
                    <div class="lr-form-item-title" style="width:90px;">层数:</div>
                    <input id="LayerCountQty" value="1" type="text" class="form-control" style="width:115px;margin-left:55px;" isvalid="yes" checkexpession="NotNull" placeholder="请输入层数" />
                </div>
                <div class="col-xs-6 lr-form-item" style="padding-left:30px;">
                    <div class="lr-form-item-title" style="width:90px;">短编号:</div>
                    <input id="ShortCode" type="text" class="form-control" style="width:130px;margin-left:55px;" isvalid="yes" checkexpession="NotNull" placeholder="请输入短编号" />
                </div>
                <input id="TpTypeCode" type="text" class="form-control" style="width:280px;margin-left:55px;display:none" value="2" />
                <input id="Category" type="text" class="form-control" style="width:280px;margin-left:55px;display:none" value="1" />
            </div>
            <div class="rItem" style="margin-top:-215px;">
                <div class="lr-form-wrap" id="container" style="height: 130px;margin-top:-255px;margin-bottom:5px; border: 1px solid #bdcadb;">
                    <div class="col-xs-4 lr-form-item" style="padding-left:5px;">
                        <div class="lr-form-item-title" style="width:100px;">第一种湿拉物料:</div>
                        <input id="MatCode0" readonly type="text" style="margin-left:90px;width:120px" class="form-control" isvalid="yes" checkexpession="NotNull" placeholder="" />
                    </div>
                    <div class="col-xs-4 lr-form-item" style="width:240px;margin-left:20px;">
                        <div class="lr-form-item-title">钢丝直径上限: </div>
                        <input id="SilkDiam0" type="text" style="display:inline-block;width:115px" class="form-control" isvalid="yes" checkexpession="NotNull" placeholder="请输入钢丝直径上限" />
                        <span style="display:inline;float:right;margin-top:5px;">mm</span>
                    </div>
                    <div class="col-xs-4 lr-form-item" style="width:220px;margin-left:415px;margin-top:-40px;">
                        <div class="lr-form-item-title">数量上限: </div>
                        <input id="QtyMaxCount0" type="text" style="display:inline-block;width:70px" class="form-control" isvalid="yes" checkexpession="NotNull" placeholder="请输入数量上限" />
                        <span style="display:inline;float:right;margin-top:5px;margin-right:38px;">个</span>
                        @*     <a id="SaveOne" class="btn btn-default" style=" margin-left:90px;margin-top:-45px;">暂存</a>*@
                    </div>

                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">是否放置物料 </div>
                        <select id="IsEmpty0" style="width:115px;" class="lr-select"></select>

                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">工字轮型号</div>
                        <select id="SpoolType0" style="width:115px;" class="lr-select"></select>
                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">工字轮朝向</div>
                        <select id="SideNum0" style="width:115px;" class="lr-select"></select>
                    </div>

                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">是否芯股 </div>
                        <select id="IsCore0" style="width:115px;" class="lr-select"></select>
                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">单双丝</div>
                        <select id="SilkType0" style="width:115px;" class="lr-select"></select>
                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title"></div>
                        <a id="SaveOne" class="btn btn-default" style="width:115px;">暂存</a>
                    </div>

                </div>

                <div class="lr-form-wrap" id="container" style="height: 130px;margin-bottom:5px;  border: 1px solid #bdcadb;">
                    <div class="col-xs-4 lr-form-item" style="padding-left:5px;">
                        <div class="lr-form-item-title" style="width:100px;">第二种湿拉物料:</div>
                        <input id="MatCode1" readonly type="text" style="margin-left:90px;width:120px" class="form-control" isvalid="yes" checkexpession="NotNull" placeholder="" />
                    </div>
                    <div class="col-xs-4 lr-form-item" style="width:240px;margin-left:20px;">
                        <div class="lr-form-item-title">钢丝直径上限: </div>
                        <input id="SilkDiam1" type="text" style="display:inline-block;width:115px" class="form-control" isvalid="yes" checkexpession="NotNull" placeholder="请输入钢丝直径上限" />
                        <span style="display:inline;float:right;margin-top:5px;">mm</span>
                    </div>
                    <div class="col-xs-4 lr-form-item" style="width:220px;margin-left:415px;margin-top:-40px;">
                        <div class="lr-form-item-title">数量上限: </div>
                        <input id="QtyMaxCount1" type="text" style="display:inline-block;width:70px" class="form-control" isvalid="yes" checkexpession="NotNull" placeholder="请输入数量上限" />
                        <span style="display:inline;float:right;margin-top:5px;margin-right:38px;">个</span>
                    </div>


                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">是否放置物料 </div>
                        <select id="IsEmpty1" style="width:115px;" class="lr-select"></select>

                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">工字轮型号</div>
                        <select id="SpoolType1" style="width:115px;" class="lr-select"></select>
                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">工字轮朝向</div>
                        <select id="SideNum1" style="width:115px;" class="lr-select"></select>
                    </div>

                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">是否芯股 </div>
                        <select id="IsCore1" style="width:115px;" class="lr-select"></select>
                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">单双丝</div>
                        <select id="SilkType1" style="width:115px;" class="lr-select"></select>
                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title"></div>
                        <a id="SaveTwo" class="btn btn-default" style="width:115px;">暂存</a>
                    </div>


                </div>

                <div class="lr-form-wrap" id="container" style="height: 130px;margin-bottom:5px; border: 1px solid #bdcadb;">
                    <div class="col-xs-4 lr-form-item" style="padding-left:5px;">
                        <div class="lr-form-item-title" style="width:100px;">第三种湿拉物料:</div>
                        <input id="MatCode2" readonly type="text" style="margin-left:90px;width:120px" class="form-control" isvalid="yes" checkexpession="NotNull" placeholder="" />
                    </div>
                    <div class="col-xs-4 lr-form-item" style="width:240px;margin-left:20px;">
                        <div class="lr-form-item-title">钢丝直径上限: </div>
                        <input id="SilkDiam2" type="text" style="display:inline-block;width:115px" class="form-control" isvalid="yes" checkexpession="NotNull" placeholder="请输入钢丝直径上限" />
                        <span style="display:inline;float:right;margin-top:5px;">mm</span>
                    </div>
                    <div class="col-xs-4 lr-form-item" style="width:220px;margin-left:415px;margin-top:-40px;">
                        <div class="lr-form-item-title">数量上限: </div>
                        <input id="QtyMaxCount2" type="text" style="display:inline-block;width:70px" class="form-control" isvalid="yes" checkexpession="NotNull" placeholder="请输入数量上限" />
                        <span style="display:inline;float:right;margin-top:5px;margin-right:38px;">个</span>
                        @*     <a id="SaveOne" class="btn btn-default" style=" margin-left:90px;margin-top:-45px;">暂存</a>*@
                    </div>


                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">是否放置物料 </div>
                        <select id="IsEmpty2" style="width:115px;" class="lr-select"></select>

                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">工字轮型号</div>
                        <select id="SpoolType2" style="width:115px;" class="lr-select"></select>
                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">工字轮朝向</div>
                        <select id="SideNum2" style="width:115px;" class="lr-select"></select>
                    </div>

                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">是否芯股 </div>
                        <select id="IsCore2" style="width:115px;" class="lr-select"></select>
                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title">单双丝</div>
                        <select id="SilkType2" style="width:115px;" class="lr-select"></select>
                    </div>
                    <div class="col-xs-4 lr-form-item">
                        <div class="lr-form-item-title"></div>
                        <a id="SaveThree" class="btn btn-default" style="width:115px;">暂存</a>
                    </div>


                </div>


            </div>
        </div>
    </div>


</div>
<script src="~/Content/jquery/plugin/layer/layer.js"></script>
@Html.AppendJsFile("/Areas/FJManager/Views/BillBomSet/DOF2.js")