{% extends "portal/layout.html" %}
{% block content %}

    <link rel="stylesheet" href="{{ url_for('static', filename='select2/select2.css') }}"/>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/select2-bootstrap.css') }}"/>
    <script type="text/javascript" src="{{ url_for('static', filename='select2/select2.min.js') }}"></script>

    <input type="hidden" id="tpl_id" value="{{ data.tpl.id }}">

    <div class="panel panel-default">
        <div class="panel-heading">模板基本信息</div>
        <div class="panel-body">
            <div class="form-inline mt10" role="form">
                <div class="form-group">
                    name: <input type="text" style="width: 400px;" value="{{ data.tpl.tpl_name }}" class="form-control"
                                 id="name">
                </div>
                <div class="form-group">
                    parent:
                </div>
                <div class="form-group">
                    <input type="text" style="width: 400px;" value="{{ data.tpl.parent.id }}" class="form-control"
                           id="parent_id">
                </div>
                <div class="form-group">
                    <button class="btn btn-default" onclick="update_template();">
                        <span class="glyphicon glyphicon-floppy-disk"></span>
                        Save
                    </button>
                </div>
            </div>
        </div>
    </div>

    <div class="panel panel-default">
        <div class="panel-heading">该模板中的策略列表</div>
        <div class="panel-body">
            <div class="pull-right">
                <a class="btn btn-default" href="javascript:goto_strategy_add_div();">
                    <span class="glyphicon glyphicon-plus"></span>
                </a>
            </div>
            <div style="line-height: 35px;">
                max: 最大报警次数 P：报警级别（&lt;3: 既发短信也发邮件 &gt;=3: 只发邮件） run：生效时间，不指定就是全天生效
            </div>
        </div>
        <table class="table table-hover table-bordered table-striped" style="margin-bottom: 0px;">
            <thead>
            <tr>
                <th>metric/<span class="text-success">tags</span><span class="gray"> [note]</span></th>
                <th>condition</th>
                <th>max</th>
                <th>P</th>
                <th>run</th>
                <th>operation</th>
            </tr>
            </thead>
            <tbody>
            {% for s in data.ss %}
                <tr>
                    <td>
                        {{ s.metric }}{% if s.tags %}/<span class="text-success">{{ s.tags }}</span>{% endif %}
                        <span class="gray">{% if s.note %}[{{ s.note }}]{% endif %}</span>
                    </td>
                    <td>
                        {{ s.func }}{{ s.op }}{{ s.right_value }}
                    </td>
                    <td>{{ s.max_step }}</td>
                    <td>{{ s.priority }}</td>
                    <td>{% if s.run_begin and s.run_end %}{{ s.run_begin }}-{{ s.run_end }}{% endif %}</td>
                    <td>
                        <a href="javascript:clone_strategy('{{ s.id }}');" style="text-decoration: none;">
                            <span class="glyphicon glyphicon-duplicate orange"></span>
                        </a>
                        <span class="cut-line">¦</span>
                        <a href="javascript:modify_strategy('{{ s.id }}');" style="text-decoration: none;">
                            <span class="glyphicon glyphicon-edit orange"></span>
                        </a>
                        <span class="cut-line">¦</span>
                        <a href="javascript:delete_strategy('{{ s.id }}');" style="text-decoration: none;">
                            <span class="glyphicon glyphicon-trash orange"></span>
                        </a>
                    </td>
                </tr>
            {% else %}
                <tr>
                    <td colspan="6">no records</td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>

    <input type="hidden" id="current_sid">

    <a name="add"></a>
    <div class="panel panel-success" id="add_div" style="display: none;">
        <div class="panel-heading">策略添加/修改</div>
        <div class="panel-body">
            <div class="form-inline mt10" role="form">
                <div class="form-group">
                    metric:
                </div>
                <div class="form-group">
                    <input type="text" style="width: 300px;" class="form-control" id="metric">
                </div>
                <div class="form-group">
                    tags: <input type="text" class="form-control" id="tags">
                    Max: <input class="form-control" id="max_step" style="width: 100px;" value="3">
                    P: <input class="form-control" id="priority" style="width: 60px;" value="0">
                    note: <input class="form-control" id="note">
                </div>
            </div>

            <div class="form-inline mt10" role="form">
                <div class="form-group">
                    if <input type="text" value="all(#3)" class="form-control" id="func" style="width: 500px;">
                    <select class="form-control" id="op">
                        <option value="==">==</option>
                        <option value="!=">!=</option>
                        <option value="<">&lt;</option>
                        <option value="<=">&lt;=</option>
                        <option value=">">&gt;</option>
                        <option value=">=">&gt;=</option>
                    </select>
                    <input type="text" value="0" class="form-control" id="right_value" style="width: 100px;">
                    : alarm(); callback();
                </div>
            </div>

            <div class="form-inline mt10" role="form">
                <div class="form-group">
                    run begin(e.g. 00:00): <input type="text" class="form-control" id="run_begin">
                    run end(e.g. 24:00): <input type="text" class="form-control" id="run_end">
                    (生效时间，不指定就是全天生效)
                </div>
            </div>

            <button class="btn btn-default" onclick="save_strategy();">
                <span class="glyphicon glyphicon-floppy-disk"></span>
                Save
            </button>

        </div>
    </div>


    <div class="panel panel-warning">
        <div class="panel-heading">模板报警配置，对模板中的所有策略生效</div>
        <div class="panel-body">

            <div class="panel panel-default">
                <div class="panel-heading">def alarm(): #配置了UIC组才会发报警</div>
                <div class="panel-body">
                    报警接收组（管理报警组，<a target="_blank" href="/team/list">快捷入口</a>）：
                    <input class="form-control" id="uic" value="{{ data.tpl.action.uic }}">
                </div>
            </div>

            <div class="panel panel-default">
                <div class="panel-heading">def callback(): #高级用法，配置了callback地址才会触发回调</div>
                <div class="panel-body">
                    callback地址（只支持http get方式回调）：
                    <input class="form-control" id="callback_url" value="{{ data.tpl.action.url }}">

                    <div class="mt10">
                        <label class="checkbox-inline">
                            <input type="checkbox" id="before_callback_sms"
                                   {% if data.tpl.action.before_callback_sms == 1 %}checked="checked"{% endif %}> 回调之前发提醒短信
                        </label>
                        <label class="checkbox-inline">
                            <input type="checkbox" id="before_callback_mail"
                                   {% if data.tpl.action.before_callback_mail == 1 %}checked="checked"{% endif %}> 回调之前发提醒邮件
                        </label>
                        <label class="checkbox-inline">
                            <input type="checkbox" id="after_callback_sms"
                                   {% if data.tpl.action.after_callback_sms == 1 %}checked="checked"{% endif %}> 回调之后发结果短信
                        </label>
                        <label class="checkbox-inline">
                            <input type="checkbox" id="after_callback_mail"
                                   {% if data.tpl.action.after_callback_mail == 1 %}checked="checked"{% endif %}> 回调之后发结果邮件
                        </label>
                    </div>
                </div>
            </div>

            <button class="btn btn-default" onclick="save_action_for_tpl('{{ data.tpl.id }}');">
                <span class="glyphicon glyphicon-floppy-disk"></span>
                Save
            </button>
        </div>
    </div>

    <script>
        $(function () {
            make_select2_for_template("#parent_id");
            make_select2_for_uic_group("#uic");
            make_select2_for_metric("#metric");
        });
    </script>
{% endblock %}