{% if Demeter.isset('span') == 0 %}<label><span>选择设备:</span></label>{% end %}
<div class="flex-cont">
    <div class="scroller">
        <ul>
            {% for v in data['gateway'] %}
            <li tab-id="{{v['id']}}" id="gateway_{{v['id']}}"><a href="javascript:;">{{v['name']}}</a></li>
            {% end %}
        </ul>
    </div>
    <div class="scroller tab-cont">
        {% for k,v in enumerate(data['gateway']) %}
        <ul tab-cont-id="{{v['id']}}" {% if k == 0 %}style="display: block;"{% else %}style="display: none;"{% end %}>
            {% if data['device'] and v['id'] in data['device'] %}
            {% for d in data['device'][v['id']] %}
            <li><label><input type="checkbox" name="update_devices" ids="update_devices" value="{{d['id']}}" data-parent="{{v['id']}}" {% if 'devices' in data['info'] and d['id'] in data['info']['devices'] %}checked{% end %}><span>{{d['name']}}</span></label></li>
            {% end %}
            {% end %}
        </ul>
        {% end %}
    </div>
</div>

<script type="text/javascript">
    $('.scroller').on('click','[tab-id]',function(){
        var tabid = $(this).attr('tab-id');
        $('.tab-cont [tab-cont-id="'+tabid+'"]').show().siblings().hide();
    })
</script>