<!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>
            .xm-toolbar .toolbar-tag {
                width: 100%;
                display: flex;
                justify-content: center;
                background-color: #1E9FFF!important;
                color: #fff!important;
            }
        </style>
    </head>

    <body style="position: absolute;top:0;bottom: 0;left:0;right: 0;">
    <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">
                                <div id="org_name"></div>
                                <input id="org_id" type="hidden" />
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">流量卡号</label>
                            <div class="layui-input-block">
                                <input type="text" id="card_num" 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="card_status">
                                    <option value="">请选择</option>
                                    <option value="0" >未绑定</option>
                                    <option value="1" >已绑定</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">运营商</label>
                            <div class="layui-input-block">
                                <select id="operator">
                                    <option value="">请选择</option>
                                    <option value="0" >中国移动</option>
                                    <option value="1" >中国联通</option>
                                    <option value="2" >中国电信</option>
                                    <option value="3" >其他</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>

                    <!-- 表格+头部按钮 -->
                    <div class="layui-card-body" style="padding:0;">
                        <div style="padding-bottom: 10px;">
                            <button class="layui-btn layuiadmin-btn-admin" lay-submit lay-filter="add" sptg:security="device:flowCard:add">添加流量卡</button>
                        </div>
                        <table id="data_entity_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="${onLineUser.orgId}" />
    </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-manage.js'}" charset="utf-8"></script>

    <!-- 运营商 -->
    <script type="text/html" id="device_flowCard_operator">
        {{#  if(d.operator == 0){ }}
        <span>中国移动</span>
        {{# } else if(d.operator == 1){ }}
        <span>中国联通</span>
        {{# } else if(d.operator == 2){ }}
        <span>中国电信</span>
        {{#  } }}
    </script>

    <!-- 号码状态 -->
    <script type="text/html" id="device_flowCard_cardStatus">
        {{#  if(d.cardStatus == 0){ }}
        <span class="layui-badge layui-bg-black">未绑定</span>
        {{# } else if(d.cardStatus == 1){ }}
        <span class="layui-badge layui-bg-green">已绑定</span>
        {{#  } }}
    </script>

    <!--操作-->
    <script type="text/html" id="table-operate">
        <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit" sptg:security="device:flowCard:update">修改</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete" sptg:security="device:flowCard:delete">删除</a>
        <a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="bind" sptg:security="device:flowCard:bind">绑定设备</a>
    </script>
</body>

</html>