<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sptg="http://www.thymeleaf.org">
    <head>
        <script th:replace="common/head"></script>
        <style>
            .titleSpan {
                margin-left: 10%;
                font-weight: bolder;
            }
        </style>
    </head>

    <body>
        <div class="layui-fluid">
            <!-- 下拉树 -->
            <div th:replace="common/org-tree"></div>
            <div class="x-body per-table">
                <div class="layui-card">
                    <div class="layui-form layui-card-header layuiadmin-card-header-auto"  style="padding:0;">
                        <!-- 查询条件 -->
                        <div class="layui-form-item border-b">
                            <div class="layui-inline">
                                <label class="layui-form-label">设备名称</label>
                                <div class="layui-input-block">
                                    <input type="text" id="name" placeholder="请输入设备名称" autocomplete="off" class="layui-input">
                                </div>
                            </div>

                            <div class="layui-inline">
                                <label class="layui-form-label">设备序列号</label>
                                <div class="layui-input-block">
                                    <input type="text" id="serial_number" placeholder="请输入设备序列号" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">设备状态</label>
                                <div class="layui-input-block">
                                    <select id="on_line_status" >
                                        <option value="" selected>全部</option>
                                        <option value="1" >在线</option>
                                        <option value="0" >离线</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-inline" style="margin-left: 38px;">
                                <button class="layui-btn layuiadmin-btn-useradmin"  lay-submit lay-filter="query">查询</button>
                                <button class="layui-btn  layui-btn-primary"  lay-submit lay-filter="reset">重置</button>
                            </div>
                        </div>
                        <fieldset class="layui-elem-field">
                            <fieldset class="layui-elem-field layui-field-title">
                                <legend style="font-size: 18px">当前绑定设备</legend>
                            </fieldset>
                            <div class="layui-field-box">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">设备名称：</label>
                                    <div class="layui-input-inline" style="width: auto">
                                        <span class="detail-info" id="device_name"></span>
                                    </div>
                                    <label class="layui-form-label">设备别名：</label>
                                    <div class="layui-input-inline" style="width: auto">
                                        <span class="detail-info" id="device_alias"></span>
                                    </div>
                                    <label class="layui-form-label">设备序列号：</label>
                                    <div class="layui-input-inline" style="width: auto">
                                        <span class="detail-info" id="device_serial_number"></span>
                                    </div>
                                    <span id="bind_btn" style="float: right;margin-right: 20px">
                                        <a id="re_bind" class="layui-btn layui-btn-danger layui-btn-xs" lay-event="reBind">取消绑定</a>
                                    </span>
                                </div>
                            </div>
                        </fieldset>
                        <div class="layui-card-body" style="padding:0;">
                            <table id="data_table" lay-filter="data_table_event"></table>
                        </div>
                    </div>
                </div>
            </div>
            <!--/*@thymesVar id="onLineUser" type="com.sptg.permissions.api.entity.Account"*/-->
            <input type="hidden" id="user_org_id" th:value="${orgId}" />
            <input type="hidden" name="id" th:value="${id}" />
            <input type="hidden" name="deviceId"/>
        </div>

        <!-- javascript -->
        <script type="text/javascript" th:src="@{'/layui/layui.js'}" charset="utf-8"></script>
        <script type="text/javascript">
            layui.config({
                base: '/' //静态资源所在路径
            });
        </script>
        <script type="text/javascript" th:src="@{'/js/device/device-flowcard-bind.js'}" charset="utf-8"></script>

        <!-- 设备类型 -->
        <!--<script type="text/html" id="device_type">
            {{#  if(d.unitId!=null){ }}
            <span>单元机</span>
            {{# } else{ }}
            <span>小区机</span>
            {{#  } }}
        </script>-->
        <script type="text/html" id="device_type">
            {{#  if(d.unitId!=null){ }}
            <span>单元机</span>
            {{# }else{  }}
            <span>小区机</span>
            {{# } }}
        </script>

        <!-- 设备朝向 -->
        <script type="text/html" id="device_is_out">
            {{#  if(d.isOut == 1){ }}
            <span>进</span>
            {{# } else if(d.isOut == 2){ }}
            <span>出</span>
            {{#  } }}
        </script>

        <!--操作-->
        <script type="text/html" id="table-operate">
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="bind" sptg:security="device:flowCard:bind">绑定</a>
        </script>


    </body>

</html>
