<?php $data = $this->data; ?>

<?php $pager = \Config\Services::pager(); ?>

<?= view("header.php",$data); ?>
<?= view("devManage/aside.php",$data); ?>
<div class="span9" id="content" style="width:100%;_background:pink;min-height:700px;">
    <div>
        <div style="margin:0px 10px;margin-top:10px;padding:0px 10px;">
            <button class="btn btn-primary" href="#addDevWindow" data-toggle="modal">添加设备</button>
        </div>
        <div class="row-fluid" style="width:auto;margin:0px 10px;">
            <!-- block -->
            <div class="block">
                <div class="block-content collapse in">
                    <div class="span12">
                        <table class="table table-striped">
                            <thead>
                            <tr>
                                <th>#</th>
                                <th>设备名</th>
                                <th>设备编号</th>
                                <th>品牌</th>
                                <th>型号</th>
                                <th>系统</th>
                                <th>分类</th>
                                <th>部门</th>
                                <th>签借人</th>
                                <th>编辑</th>
                            </tr>
                            </thead>
                            <tbody>
                                <?php for($i = 0;$i < count($data["devices"]);$i++){ ?>
                                <tr dev_id='<?= $data["devices"][$i]["id"] ?>'>
                                    <td><?= $i +1 ?></td>
                                    <td><?= $data["devices"][$i]["dev_name"] ?></td>
                                    <td><?= $data["devices"][$i]["dev_code"] ?></td>
                                    <td><?= $data["devices"][$i]["dev_brand"] ?></td>
                                    <td><?= $data["devices"][$i]["dev_model"] ?></td>
                                    <td><?= $data["devices"][$i]["dev_system"] ?></td>
                                    <td first_category_id="<?= $data["devices"][$i]["first_category_id"] ?>"><?= $data["devices"][$i]["category_name"] ?></td>
                                    <td><?= $data["devices"][$i]["org_section_name"] ?></td>
                                    <td><span style="padding:4px;" class="label label-success" title="系统用户">签借人</span></td>
                                    <td>
                                        <button class="btn btn-primary btn-mini" href="#editDevWindow" data-toggle="modal" onclick="showEdtiDevWindow(this)">编辑</button>
                                        <button class="btn btn-primary btn-mini" onclick="gotoDevDetail(this)">详情</button>
                                        <button class="btn btn-primary btn-mini" onclick="">借出</button>
                                        <button class="btn btn-danger btn-mini" onclick="deleteDev(this)">删除</button>
                                    </td>
                                </tr>
                                <?php } ?>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="pagination" style="text-align:right;padding-right:30px;">
                    <div>
                        <div style="display:inline;">
                            <select id="per_page" size="1" style="width:100px;margin:0px;float:right;height:30px;margin-left:5px;" onchange="perPageChange()">
                                <option value="10" <?php if($data["pageInfo"]["perPage"] == 15){ echo 'selected="selected"';}?>>10 条/页</option>
                                <option value="20"  <?php if($data["pageInfo"]["perPage"] == 20){ echo 'selected="selected"';}?>>20 条/页</option>
                                <option value="50" <?php if($data["pageInfo"]["perPage"] == 50){ echo 'selected="selected"';}?>>50 条/页</option>
                                <option value="100" <?php if($data["pageInfo"]["perPage"] == 100){ echo 'selected="selected"';}?>>100 条/页</option>
                            </select>
                        </div>
                        <?= $pager->makeLinks($data["pageInfo"]["page"], $data["pageInfo"]["perPage"],$data["pageInfo"]["total"]) ?>
                    </div>
                </div>
            </div>
            <!-- /block -->           
        </div>
    </div>
    <div id="addDevWindow" class="modal hide" style="width:800px;transform: translateX(-50%);margin:0px;left:50%;">
        <div class="modal-header">
            <button data-dismiss="modal" class="close" type="button">&times;</button>
            <h3 style="padding-left:30px;">添加设备</h3>
        </div>
        <div class="modal-body">
            <table>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;"><label style="display:inline-block;color:red;font-size:20px;margin:0px;">*</label>设备名：</label>
                        <input disable class="input-xlarge focused" id="dev_name" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;"><label style="display:inline-block;color:red;font-size:20px;margin:0px;">*</label>设备编号：</label>
                        <input disable class="input-xlarge focused" id="dev_code" placeholder="如：03-10004" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                </tr>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备品牌：</label>
                        <input disable class="input-xlarge focused" id="dev_brand" type="text" placeholder="如：华为、美的" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备型号：</label>
                        <input disable class="input-xlarge focused" id="dev_model" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                </tr>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备系统：</label>
                        <input disable class="input-xlarge focused" id="dev_system" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备版本：</label>
                        <input disable class="input-xlarge focused" id="dev_version" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                </tr>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备颜色：</label>
                        <input disable class="input-xlarge focused" id="dev_color" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备特征：</label>
                        <input disable class="input-xlarge focused" id="dev_feature" placeholder="设备功能、特点等..." type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>                   
                </tr>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;"><label style="display:inline-block;color:red;font-size:20px;margin:0px;">*</label>第一分类：</label>
                        <select id="first_category_id" style="display:inline;margin: 0px;width:282px;height:32px;" onchange="getSecondCategory_add(this)">
                        <?php for($i = 0;$i < count($data["category"]["secondCategory"]);$i++){ ?>
                            <option value='<?= $data["category"]["firstCategory"][$i]["id"];?>'><?= $data["category"]["firstCategory"][$i]["category_name"];?></option>
                            <?php } ?>
                        </select>
                    </td>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;"><label style="display:inline-block;color:red;font-size:20px;margin:0px;">*</label>第二分类：</label>
                        <select id="second_category_id" style="display:inline;margin: 0px;width:282px;height:32px;">
                            <?php for($i = 0;$i < count($data["category"]["secondCategory"]);$i++){ ?>
                            <option value='<?= $data["category"]["secondCategory"][$i]["id"];?>'><?= $data["category"]["secondCategory"][$i]["category_name"];?></option>
                            <?php } ?>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">所属部门：</label>
                        <select id="org_section_id" style="display:inline;margin: 0px;width:282px;height:32px;">
                            <option value='0'>（无）</option>
                            <?php for($i = 0;$i < count($data["orgSections"]);$i++){ ?>
                                <option value='<?= $data["orgSections"][$i]["id"];?>'><?= $data["orgSections"][$i]["org_section_name"];?></option>
                            <?php } ?>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        <label style="display:inline-block;width:90px;text-align:right;">设备描述：</label>
                        <textarea style="width:650px;height:40px;" id="dev_detail"></textarea>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" style="text-align:center;">
                        <button data-dismiss="modal" class="btn btn-primary" style="width:50%;margin-top:10px;" onclick="addDev()">添 加</button>
                    </td>
                </tr>
            </table>
        </div>
    </div>
    <!--  编辑设备弹窗  -->
    <div id="editDevWindow" class="modal hide" style="width:800px;transform: translateX(-50%);margin:0px;left:50%;">
        <div class="modal-header">
            <button data-dismiss="modal" class="close" type="button">&times;</button>
            <h3 style="padding-left:30px;">编辑设备</h3>
        </div>
        <div class="modal-body">
            <table>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备id：</label>
                        <input disabled class="input-xlarge focused" id="dev_id_edit" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                    <td></td>
                </tr>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;"><label style="display:inline-block;color:red;font-size:20px;margin:0px;">*</label>设备名：</label>
                        <input disable class="input-xlarge focused" id="dev_name_edit" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;"><label style="display:inline-block;color:red;font-size:20px;margin:0px;">*</label>设备编号：</label>
                        <input disable class="input-xlarge focused" id="dev_code_edit" placeholder="如：03-10004" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                </tr>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备品牌：</label>
                        <input disable class="input-xlarge focused" id="dev_brand_edit" type="text" placeholder="如：华为、美的" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备型号：</label>
                        <input disable class="input-xlarge focused" id="dev_model_edit" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                </tr>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备系统：</label>
                        <input disable class="input-xlarge focused" id="dev_system_edit" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备版本：</label>
                        <input disable class="input-xlarge focused" id="dev_version_edit" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                </tr>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备颜色：</label>
                        <input disable class="input-xlarge focused" id="dev_color_edit" type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">设备特征：</label>
                        <input disable class="input-xlarge focused" id="dev_feature_edit" placeholder="设备功能、特点等..." type="text" value="" style="display:inline;margin: 0px;_width:300px;">
                    </td>                   
                </tr>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;"><label style="display:inline-block;color:red;font-size:20px;margin:0px;">*</label>第一分类：</label>
                        <select id="first_category_id_edit" style="display:inline;margin: 0px;width:282px;height:32px;" onchange="getSecondCategory_edit(this)">
                            <option></option>
                        </select>
                    </td>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;"><label style="display:inline-block;color:red;font-size:20px;margin:0px;">*</label>第二分类：</label>
                        <select id="second_category_id_edit" style="display:inline;margin: 0px;width:282px;height:32px;">
                            <option></option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label style="display:inline-block;width:90px;text-align:right;">所属部门：</label>
                        <select id="org_section_id_edit" style="display:inline;margin: 0px;width:282px;height:32px;">
                            <option></option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        <label style="display:inline-block;width:90px;text-align:right;">设备描述：</label>
                        <textarea style="width:650px;height:40px;" id="dev_detail_edit"></textarea>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" style="text-align:center;">
                        <button data-dismiss="modal" class="btn btn-primary" style="width:50%;margin-top:10px;" onclick="updateDev()">更 新</button>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</div>
<?= view("footer.php",$data); ?>

<style>
.modal-body table tr td label,input,select {
    margin: 10px 0px;
}

.pagination {
    margin: 0px 0px;
}
</style>

<script>
/*****************************************************
*          添加设备
*****************************************************/
function addDev(){
    var dev_name = $("#dev_name").val();
    var dev_code = $("#dev_code").val();
    var dev_brand = $("#dev_brand").val();
    var dev_model = $("#dev_model").val();
    var dev_system = $("#dev_system").val();
    var dev_version = $("#dev_version").val();
    var dev_color = $("#dev_color").val();
    var dev_feature = $("#dev_feature").val();
    var first_category_id = $("#first_category_id").val();
    var second_category_id = $("#second_category_id").val();
    var org_section_id = $("#org_section_id").val();
    var dev_detail = $("#dev_detail").val();

    var postData = {};
    postData["dev_name"] = dev_name;
    postData["dev_code"] = dev_code;
    postData["dev_brand"] = dev_brand;
    postData["dev_model"] = dev_model;
    postData["dev_system"] = dev_system;
    postData["dev_version"] = dev_version;
    postData["dev_color"] = dev_color;
    postData["dev_feature"] = dev_feature;
    postData["first_category_id"] = first_category_id;
    postData["second_category_id"] = second_category_id;
    postData["org_section_id"] = org_section_id;
    postData["dev_detail"] = dev_detail;

    var host = window.location.host;
    var url = "http://" + host + "/devManageCtr/addDev"
    
    if(dev_name == ""){
        alert("设备名不能为空！");
    }else if(dev_code == ""){
        alert("设备编号不能为空！");
    }else if(first_category_id == ""){
        alert("设备第一分类不能为空！");
    }else if(second_category_id == ""){
        alert("设备第二分类不能为空！");
    }else{
        $.ajax({
            url: url,
            data: JSON.stringify(postData),
            type: "POST",
            dataType: "json",
            contentType:"application/json",
            success: function(data) {
                if(data.status == "200"){
                    location.reload();
                }else{
                    
                }
            }
        });
    }    
}

/*****************************************************
*          删除设备
*****************************************************/
function deleteDev(e){
    var devId = $(e).parent().parent().attr("dev_id");
    var host = window.location.host;
    var url = "http://" + host + "/devManageCtr/delDev"
    var postData = {};
    postData["devId"] = devId;
    var isSure = confirm("确定删除该设备?");
    if(isSure == true){
        $.ajax({
            url: url,
            data: JSON.stringify(postData),
            type: "DELETE",
            dataType: "json",
            contentType:"application/json",
            success: function(data) {
                if(data.status == "200"){
                    location.reload();
                }else{
                    
                }
            }
        });
    }
}

/*****************************************************
*          添加设备获取二级分类
*****************************************************/
function getSecondCategory_add(e){
    var first_category_id = $(e).val();
    var host = window.location.host;
    var url = "http://" + host + "/devManageCtr/getSecondCategoryByFirstCategoryId"
    var postData = {};
    postData["first_category_id"] = first_category_id;
    $.ajax({
        url: url,
        data: JSON.stringify(postData),
        type: "DELETE",
        dataType: "json",
        contentType:"application/json",
        success: function(data) {
            if(data.status == "200"){
                $("#second_category_id").empty();
                var items = data.data;
                for(var i = 0 ;i < items.length ;i++){
                    var content = '<option value="' + items[i]["id"] + '">' + items[i]["category_name"] + '</option>';
                    $("#second_category_id").append(content);
                }
            }else{
                
            }
        }
    });
}

/*****************************************************
*          展示编辑弹窗
*****************************************************/
function showEdtiDevWindow(e){
    var devId = $(e).parent().parent().attr("dev_id");
    $("#dev_id_edit").val(devId);
    var the_first_category_id = $($(e).parent().prevAll()[1]).attr("first_category_id");
    var host = window.location.host;
    var url = "http://" + host + "/devManageCtr/getDevInfoById"
    var postData = {};
    postData["devId"] = devId;
    $.ajax({
        url: url,
        data: JSON.stringify(postData),
        type: "DELETE",
        dataType: "json",
        contentType:"application/json",
        success: function(data) {
            if(data.status == "200"){
                var items = data.devInfo;
                $("#dev_name_edit").val(items["dev_name"]);
                $("#dev_code_edit").val(items["dev_code"]);
                $("#dev_brand_edit").val(items["dev_brand"]);
                $("#dev_model_edit").val(items["dev_model"]);
                $("#dev_system_edit").val(items["dev_system"]);
                $("#dev_version_edit").val(items["dev_version"]);
                $("#dev_color_edit").val(items["dev_color"]);
                $("#dev_feature_edit").val(items["dev_feature"]);
                $("#dev_detail_edit").val(items["dev_detail"]);
                
                var devInfoByGet = items;

                var url = "http://" + host + "/devManageCtr/getAllFirstCategory"
                postData = {};
                $.ajax({
                    url: url,
                    data: JSON.stringify(postData),
                    type: "DELETE",
                    dataType: "json",
                    contentType:"application/json",
                    success: function(data) {
                        if(data.status == "200"){
                            var items = data.data;
                            $("#first_category_id_edit").empty();
                            var items = data.data;
                            for(var i = 0 ;i < items.length ;i++){
                                var content = '<option value="' + items[i]["id"];
                                if(items[i]["id"] == devInfoByGet["first_category_id"]){
                                    content = content + '" selected="selected ';
                                }
                                content = content + '">' + items[i]["category_name"] + '</option>';
                                $("#first_category_id_edit").append(content);
                            }
                        }
                    }
                });
                var url = "http://" + host + "/devManageCtr/getSecondCategoryByFirstCategoryId"
                postData = {};
                postData["first_category_id"] = the_first_category_id;
                $.ajax({
                    url: url,
                    data: JSON.stringify(postData),
                    type: "DELETE",
                    dataType: "json",
                    contentType:"application/json",
                    success: function(data) {
                        if(data.status == "200"){
                            var items = data.data;
                            $("#second_category_id_edit").empty();
                            var items = data.data;
                            for(var i = 0 ;i < items.length ;i++){
                                var content = '<option value="' + items[i]["id"]
                                if(items[i]["id"] == devInfoByGet["second_category_id"]){
                                    content = content + '" selected="selected ';
                                }
                                content = content + '">' + items[i]["category_name"] + '</option>';
                            }
                            $("#second_category_id_edit").append(content);
                        }
                    }
                });
                var url = "http://" + host + "/orgManageCtr/getAllOrgSections"
                postData = {};
                $.ajax({
                    url: url,
                    data: JSON.stringify(postData),
                    type: "DELETE",
                    dataType: "json",
                    contentType:"application/json",
                    success: function(data) {
                        if(data.status == "200"){
                            var items = data.data;
                            var content = '';
                            $("#org_section_id_edit").empty();
                            var items = data.data;
                            if(devInfoByGet["org_section_id"] == "0"){
                                content = '<option value="0">（空）</option>';
                            }
                            for(var i = 0 ;i < items.length ;i++){
                                content = content + '<option value="' + items[i]["id"];
                                if(items[i]["id"] == devInfoByGet["org_section_id"]){
                                    content = content + '" selected="selected ';
                                }
                                content = content + '">' + items[i]["org_section_name"] + '</option>';
                            }
                            $("#org_section_id_edit").append(content);
                        }
                    }
                });
            }
        }
    });
}
/*****************************************************
*          编辑设备获取二级分类
*****************************************************/
function getSecondCategory_edit(e){
    var first_category_id = $(e).val();
    var host = window.location.host;
    var url = "http://" + host + "/devManageCtr/getSecondCategoryByFirstCategoryId"
    var postData = {};
    postData["first_category_id"] = first_category_id;
    $.ajax({
        url: url,
        data: JSON.stringify(postData),
        type: "DELETE",
        dataType: "json",
        contentType:"application/json",
        success: function(data) {
            if(data.status == "200"){
                $("#second_category_id_edit").empty();
                var items = data.data;
                for(var i = 0 ;i < items.length ;i++){
                    var content = '<option value="' + items[i]["id"] + '">' + items[i]["category_name"] + '</option>';
                    $("#second_category_id_edit").append(content);
                }
            }else{
                
            }
        }
    });
}
/*****************************************************
*          更新设备信息
*****************************************************/
function updateDev(){
    var devId = $("#dev_id_edit").val();
    var dev_name = $("#dev_name_edit").val();
    var dev_code = $("#dev_code_edit").val();
    var dev_brand = $("#dev_brand_edit").val();
    var dev_model = $("#dev_model_edit").val();
    var dev_system = $("#dev_system_edit").val();
    var dev_version = $("#dev_version_edit").val();
    var dev_color = $("#dev_color_edit").val();
    var dev_feature = $("#dev_feature_edit").val();
    var first_category_id = $("#first_category_id_edit").val();
    var second_category_id = $("#second_category_id_edit").val();
    var org_section_id = $("#org_section_id_edit").val();
    var dev_detail = $("#dev_detail_edit").val();

    var postData = {};
    postData["dev_id"] = devId;
    postData["dev_name"] = dev_name;
    postData["dev_code"] = dev_code;
    postData["dev_brand"] = dev_brand;
    postData["dev_model"] = dev_model;
    postData["dev_system"] = dev_system;
    postData["dev_version"] = dev_version;
    postData["dev_color"] = dev_color;
    postData["dev_feature"] = dev_feature;
    postData["first_category_id"] = first_category_id;
    postData["second_category_id"] = second_category_id;
    postData["org_section_id"] = org_section_id;
    postData["dev_detail"] = dev_detail;

    var host = window.location.host;
    var url = "http://" + host + "/devManageCtr/updateDev"
    
    if(dev_name == ""){
        alert("设备名不能为空！");
    }else if(dev_code == ""){
        alert("设备编号不能为空！");
    }else if(first_category_id == ""){
        alert("设备第一分类不能为空！");
    }else if(second_category_id == ""){
        alert("设备第二分类不能为空！");
    }else{
        $.ajax({
            url: url,
            data: JSON.stringify(postData),
            type: "POST",
            dataType: "json",
            contentType:"application/json",
            success: function(data) {
                if(data.status == "200"){
                    location.reload();
                }else{
                    
                }
            }
        });
    }    
}

/*****************************************************
*          改变页码后，刷新页面
*****************************************************/
function perPageChange(){
    var perPage = $("#per_page").val();
    var host = window.location.host;
    var oriParam = window.location.search;
    var paramStr = oriParam.substring(1);
    paramArr = paramStr.split("&");
    param = {};                            
    for(var i = 0;i < paramArr.length;i++){
        keyVal = paramArr[i].split("=");
        param[keyVal[0]] = keyVal[1];
    }
    var url = window.location.href.split("?")[0];
    delete param["perPage"];
    for(var key in param){
        if(url.indexOf("?") !== -1){
            url = url + "&" + key + "=" + param[key];
        }else{
            url = url + "?" +  key + "=" + param[key];
        }
    }
    if(url.indexOf("&") !== -1){
            url = url + "&perPage=" + perPage;
        }else{
            url = url + "?perPage=" + perPage;
        }
    window.location.href = url;
}
/*****************************************************
*          进入设备详情页面
*****************************************************/
function gotoDevDetail(e){
    var devId = $(e).parent().parent().attr("dev_id");
    var host = window.location.host;
    var username = $.cookie('username');
    var token = $.cookie('token');
    if(username == undefined){
        username = "";
    }
    if(token == undefined){
        token = "";
    }
    window.location.href = "http://" + host + "/devManage/devDetail" + "?username=" + username + "&token=" + token + "&devId=" + devId;
}
</script>
        
