@{
    ViewBag.Title = "Form";
    Layout = "~/Views/Shared/_Form.cshtml";
}

<style type="text/css">
    .ui-select .ui-select-text {
        margin-bottom:5px;
    }
</style>

<script type="text/javascript">
    var keyValue = request('keyValue');


    $(function () {
        initControl();
    })

    //初始化控件
    function initControl() {

        //类型
        $("#ValveStatus").ComboBox({
            description: "==请选择类型==",
            height: "170px"
        });

        //表类型
        $("#MeterTypeID").ComboBoxTree({
            url: "/NBManage/NBMeterTypeManage/GetAllMeterType",
            id: "ItemValue",
            text: "ItemName",
            description: "==请选择==",
            height: "200px"
        });
        //NB表类型
        $("#NBDevType").ComboBoxTree({
            url: "/NBManage/NBMeterTypeManage/GetNBDevType",
            description: "==请选择==",
            height: "200px",
            allowSearch: true,
        }).bind("change", function () {
            var value = $(this).attr('data-value');
            //加载NB设备厂商名称
            $("#NBDevManufacturer").ComboBoxTree({
                url: "/NBManage/NBMeterTypeManage/GetDevManufacturerByNBDevTypeID?NBDevTypeID=" + value,
                description: "==请选择==",
                allowSearch: true
            })
        });

        //NB设备厂商名称
        $("#NBDevManufacturer").ComboBoxTree({
            description: "==请选择==",
            height: "200px",
            allowSearch: true
        }).bind("change", function () {
            var value = $(this).attr('data-value');
            //加载NB设备厂商ID
            $("#NBDevManufacturerCode").ComboBoxTree({
                url: "/NBManage/NBMeterTypeManage/GetNBDevManufacturerCodeByNBDevManufacturerID?NBDevManufacturerID=" + value,
                description: "==请选择==",
                allowSearch: true
            });
        });


        //NB设备厂商ID
        $("#NBDevManufacturerCode").ComboBoxTree({
            description: "==请选择==",
            height: "200px",
            allowSearch: true
        }).bind("change", function () {
            var value = $(this).attr('data-value');
            //加载型号
            $("#NBTypeCode").ComboBoxTree({
                url: "/NBManage/NBMeterTypeManage/GetNBTypeCodeByNBDevManufacturerCodeID?NBDevManufacturerCodeID=" + value,
                description: "==请选择==",
                allowSearch: true
            });
        });

        //型号
        $("#NBTypeCode").ComboBox({
            description: "==请选择==",
            height: "200px",
            allowSearch: true
        })

        if (keyValue) {            
            $.SetForm({
                url: "/NBManage/NBUserManage/GetMeterByMeterId?keyValue=" + keyValue,//路径
                param: { keyValue: keyValue },
                success: function (data) {
                    $("#form1").SetWebControls(data);
                    //表地址 imei号不可修改
                    $("#ElecAddress").attr("Readonly", "Readonly");
                    $("#IMEI").attr("Readonly", "Readonly");
                }
            });
        }
    }
    //保存表单
    function AcceptApmtClick() {
        if (!$('#form1').Validform()) {
            return false;
        }
        var postData = $("#form1").GetWebControls(keyValue);
        //postData 格式化 将&nbsp; 替换为 ""
        for (var i in postData) {
            if (postData[i] == "&nbsp;") {
                postData[i] = "";
            }
        }
        $.SaveForm({
            url: "/NBManage/NBUserManage/SaveMeterForm",
            param: { "keyValue": keyValue, "parentId": parentId, "data": JSON.stringify(postData) },
            loading: "正在保存数据...",
            success: function () {
                //$.currentIframe().$("#pointGridTable").resetSelection();
                //$.currentIframe().$("#pointGridTable").trigger("reloadGrid");
                $.currentIframe().GetTree();
            }
        })
    }
</script>
<div style="margin-left: 10px; margin-top: 20px; margin-right: 30px;">
    <table id="form1" class="form">
        <tr>
            <th class="formTitle">表类型<font face="宋体">*</font></th>
            <td class="formValue">
                <div id="MeterTypeID" type="select" class="ui-select" isvalid="yes" checkexpession="NotNull" errormsg="表类型">
                </div>
            </td>
            <th class="formTitle">表地址<font face="宋体">*</font></th>
            <td class="formValue">
                <input id="ElecAddress" type="text" class="form-control" placeholder="请输入表地址" isvalid="yes" checkexpession="NotNull" errormsg="表地址"/>
            </td>
        </tr>
        <tr>
            <th class="formTitle">IMEI<font face="宋体">*</font></th>
            <td class="formValue">
                <input id="IMEI" type="text" class="form-control" isvalid="yes" checkexpession="NotNull" errormsg="IMEI号" placeholder="请输入IMEI" />
            </td>
            <th class="formTitle">ICCID<font face="宋体">*</font></th>
            <td class="formValue">
                <input id="ICCID" type="text" class="form-control" isvalid="yes" checkexpession="NotNull" errormsg="IMEI号" placeholder="请输入ICCID" />
            </td>
        </tr>
        <tr>
            <th class="formTitle">NB表类型<font face="宋体">*</font></th>
            <td class="formValue" colspan="3">
                <div id="NBDevType" type="select" class="ui-select" isvalid="yes" checkexpession="NotNull" errormsg="NB表类型" style="float: left; width: 24%; margin-right: 3px;">
                </div>
                <div id="NBDevManufacturer" type="select" class="ui-select" isvalid="yes" checkexpession="NotNull" errormsg="NB设备厂商名称" style="float: left; width: 24%; margin-right: 3px;">
                </div>
                <div id="NBDevManufacturerCode" type="select" class="ui-select" isvalid="yes" checkexpession="NotNull" errormsg="NB设备厂商ID" style="float: left; width: 24%; margin-right: 3px;">
                </div>
                <div id="NBTypeCode" type="select" class="ui-select" isvalid="yes" checkexpession="NotNull" errormsg="型号" style="float: left; width: 24%; margin-right: 3px;">
                </div>
            </td>
        </tr>
        <tr>
            <th class="formTitle">表编号</th>
            <td class="formValue">
                <input id="MeterNo" type="text" class="form-control" placeholder="请输入表编号" />
            </td>
            <th class="formTitle">安装位置</th>
            <td class="formValue">
                <input id="MeterLoc" type="text" class="form-control" placeholder="请输入安装位置" />
            </td>
        </tr>
        <tr>
            <th class="formTitle">当前读数</th>
            <td class="formValue">
                <input id="NowReading" type="text" class="form-control" placeholder="请输入当前读数" value="0" />
            </td>
            <th class="formTitle">抄表时间</th>
            <td class="formValue">
                <input id="NowRadingDT" type="text" class="form-control input-wdatepicker" onfocus="WdatePicker({maxDate:'%y-%M-%d',dateFmt:'yyyy-MM-dd HH:mm:ss'})" />
            </td>
        </tr>
        <tr>
            <th class="formTitle">阀门状态</th>
            <td class="formValue">
                <div id="ValveStatus" type="select" class="ui-select">
                    <ul>
                        <li data-value="0">开</li>
                        <li data-value="1">关</li>
                    </ul>
                </div>
            </td>
            <th class="formTitle">倍率</th>
            <td class="formValue">
                <input id="MeterRatio" type="text" class="form-control" placeholder="请输入倍率" />
            </td>
        </tr>
        <tr>
            <th class="formTitle">电池电压</th>
            <td class="formValue">
                <input id="BatteryVoltage" type="text" class="form-control" placeholder="请输入电池电压" />
            </td>
            <th class="formTitle">铅封号</th>
            <td class="formValue">
                <input id="SealNo" type="text" class="form-control" placeholder="请输入铅封号" />
            </td>
        </tr>
        @*<tr>
            <th class="formTitle">通讯状态
            <td class="formValue">*@
        <input id="CommunicationState" type="hidden" class="form-control" />
        @*</td>
            <th class="formTitle">仪表状态
            <td class="formValue">*@
        <input id="MeterState" type="hidden" class="form-control" />
        @*</td>
            </tr>*@
    </table>
</div>