#include("_user_detail_layout.html")
#@user_detail_layout("tag")

#define layout_script()
<script src="#(CPATH)/static/components/selectize/selectize.min.js"></script>
<script>
    var $select = $('.article-tags').selectize({
        plugins: ['remove_button'],
        delimiter: ',',
        persist: false,
        addPrecedence: true,
        create: true,
        render: {
            option_create: function (data, escape) {
                return '<div class="create" style="padding-left: 5px"> 添加标签：<strong style="color: #DD1144">' + escape(data.input) + '</strong> &hellip; </div>';
            }
        }
    });

    var selectize = $select[0].selectize;

    $(".newTag").each(function () {
        $(this).on('click', function () {
            selectize.createItem($(this).text());
        })
    });



</script>
#end

#define layout_css()
<link href="#(CPATH)/static/components/selectize/css/selectize.css" rel="stylesheet">
<link href="#(CPATH)/static/components/selectize/css/selectize.jpress.css" rel="stylesheet">
#end


#define detail()
<div class="box-header ">
    <h3 class="box-title"></h3>
</div>
<!-- /.box-header -->
<!-- form start -->
<form class="form-horizontal" autocomplete="off" id="userForm" action="#(CPATH)/admin/user/doUpdateUserTags">
    <input name="userId" type="hidden" value="#(user.id)">
    <div class="box-body ">

        <h4 class="page-first-header">用户标签</h4>

        <div class="form-group">
            <label class="col-sm-2 control-label"></label>
            <div class="col-sm-6">
                <select class="form-control article-tags" multiple="multiple" name="tag">
                    #for(tag : userTags)
                    <option value="#(tag.title ??)" selected>#(tag.title ??)</option>
                    #end
                </select>
                <p class="help-block">多个标签请用 “回车键” 或英文逗号（,）隔开。</p>

                <div class="tags">
                    #for(tag : hotTags)
                    <a href="javascript:;" class="newTag">#(tag.title)</a>
                    #end
                </div>
            </div>
        </div>


    </div>

    <div class="box-footer">
        <div class="col-sm-offset-2 col-sm-10 submit-block">
            <div class="box-submit">
                <button type="submit" class="btn btn-primary">提交</button>
            </div>
        </div>
    </div>

</form>
#end

