{% extends base %}


{% block body_left %}
{% init show_back = True %}
{% init created_notes = [] %}
{% init sticky_position = "left" %} 

    <script type="text/javascript" src="/static/js/plan/plan.js?ts={{_ts}}"></script>

    <script type="text/template" id="select_note_tpl">
        <div class="row note-search-dialog-body" style="padding-top: 10px;">
            {{!each itemList item}}
            <h3 class="card-title-2">{{!item.title}}</h3>

                {{!each item.children subItem }}
                <p class="card-row share-dialog-row">
                    <i class="fa {{!subItem.icon}}"></i>
                    <a href="{{!subItem.url}}">{{!subItem.name}}</a>
                    <input type="checkbox"
                        class="select-note-checkbox float-right" 
                        data-id="{{!subItem.id}}">
                <p>
                {{!/each}}
            {{!/each}}
        </div>
    </script>

    <div id="select-note-dialog" class="hide" style="padding: 10px;">
        <div class="row">
            <input type="text" class="nav-search-input" id="plan-note-search-text" placeholder="搜索笔记" 
                onkeyup="xnote.action.plan.searchNote(this);">
            <button class="nav-search-btn btn-default" onclick="xnote.action.plan.searchNote(this)">
                <i class="fa fa-search"></i>
            </button>
        </div>

        <div id="select-note-dialog-body">
            <!-- ajax内容 -->
        </div>
    </div>

    <div class="card">
        <div class="card-title">
            <span>月度计划</span>
            <div class="float-right">
                <a class="btn btn-default" href="{{_server_home}}/note/group?type=year">笔记日历</a>
                {% if show_back %}
                    {% include common/button/back_button.html %}
                {% end %}
            </div>
        </div>
    </div>

    {% include common/date/month_picker.html %}

    <div class="card">
        <div class="card-title">
            <span>关注</span>
            <div class="float-right">
                <button class="btn btn-default" onclick="xnote.action.plan.addNote(this)">添加笔记</button>
            </div>
        </div>

        <div class="row">
            {% for item in record.notes %}
                <a class="list-item" href="{{_server_home}}{{item.url}}">
                    <i class="fa {{item.icon}}"></i>
                    <span>{{item.name}}</span>
                    {% include note/component/note_list_item_tags.html %}
                    <div class="float-right">
                        <button class="btn btn-default" data-id="{{item.id}}" 
                            onclick="xnote.action.plan.removeNote(this)">移除</button>
                    </div>
                </a>
            {% end %}

        </div>
    </div>

    <div class="card">
        <div class="x-tab-box" data-content-id="tab-content">
            <a class="x-tab" data-content-id="create-list" data-default="true">创建</a>
            <a class="x-tab" data-content-id="update-list">更新</a>
        </div>
    </div>

    <div id="tab-content" class="card"></div>

    <div id="create-list" class="hide">
        {% set-global files = created_notes %}
        {% include note/component/note_list_no_card.html %}
    </div>

    <div id="update-list" class="hide">
        {% set-global files = updated_notes %}
        {% include note/component/note_list_no_card.html %}
    </div>

    <script type="text/javascript">
        PlanView.state.id = "{{record._id}}";
        xnote.on("date.month.selected", function (event) {
            var dateStr = event.target;
            var href = xnote.addUrlParam(window.location.href, "date", dateStr);
            window.location.href = href;
        });
    </script>

{% end %}

{% block body_right %}
    {% include note/component/sidebar/group_list_sidebar.html %}
{% end %}