{% extends "../../base.html" %}

{% block css %}
    <style>
        .btn-primary:hover {
            color: red;
        }
    </style>
{% endblock %}

{% block crumbs %}
    <div class="row">
        <div class="col-md-12">
            <ol class="breadcrumb">
                <li>
                    <a href="/yqjr/index">主页</a>
                </li>
                <li class="active">
                    <a class="this">基础信息</a>
                </li>
                <li class="active">
                    <a class="this-page" href="/base/plan/">测试任务</a>
                </li>
                <li class="active">
                    <a class="">添加计划</a>
                </li>
            </ol>

        </div>
    </div>
{% endblock %}

{% block body %}


    <div class="row">
        <div class="col-md-12">
            <div class="panel">
                <div class="panel-heading">
                    <h3 class="panel-title">添加计划</h3>
                </div>
                <div class="panel-body">
                    <form class="form-horizontal" method="post" action="/base/plan_add/">
                        <div class="form-group">
                            <label class="col-sm-2 control-label">计划名称</label>
                            <div class="col-sm-6">
                                <input type="text" name="plan_name" class="form-control" value="{{ plan_name }}">
                            </div>
                            {% if name_error %}
                                <span style="color: red; font-size: 10px;">{{ name_error }}</span>
                            {% endif %}
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">选择项目</label>
                            <div class="col-sm-6">
                                <select class="form-control m-b" id="prj_id" required="required" name="prj_id"
                                        onchange=get_env()>
                                    <option value="">请选择项目</option>
                                    {% for prj in prj_list %}
                                        <option value="{{ prj.prj_id }}">{{ prj.prj_name }}</option>
                                    {% endfor %}
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">选择环境</label>
                            <div class="col-sm-6"><select class="form-control m-b" id="env_id" name="env_id"
                                                          required="required">
                            </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">描述</label>
                            <div class="col-sm-6">
                                <textarea name="description" placeholder="请输入内容" class="form-control"
                                          rows="3"></textarea>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">用例列表</label>
                            <a id="getcases" onclick="get_cases()" class="btn btn-primary"><i
                                    class="fa fa-get-pocket"></i>&nbsp;获取用例</a>
                            <div id="list" class="col-sm-10 col-sm-offset-2">
                            </div>
                            {% if content_error %}
                                <span style="color: red; font-size: 10px;">{{ content_error }}</span>
                            {% endif %}
                        </div>
                        <div class="form-group">
                            <div class="col-sm-offset-2 col-sm-6">
                                <button type="submit" class="btn btn-primary"><i
                                        class="fa fa-save"></i>&nbsp;保存
                                </button>
                            </div>
                        </div>
                    </form>
                </div>

            </div>

        </div>

    </div>

{% endblock %}

{% block javascript %}
    <script type="text/javascript">
        function get_env() {
            var prj_id = $('#prj_id').val();
            if (prj_id == null) {
                alert("请先选择项目");
            }
            else {
                $.ajax({
                    type: "get",
                    url: "/base/findata/",
                    data: {
                        "prj_id": prj_id,
                        "type": "get_env_by_prj_id"
                    },
                    success: function (data) {
                        var listdata = eval(data);
                        // 一个项目下多个测试环境
                        $("#env_id").empty();
                        $(listdata).each(function (i, item) {
                            console.log('========>', i, item);
                            $("#env_id").append("<option value=" + item.env_id + ">" + item.env_name + "</option>");

                        })
                    },
                    error: function () {
                        alert("获取测试环境失败！");
                    }
                });
            }

        }

        // 检查输入框
        function check(att) {
            strValue = att.replace(/\n/g, '');
            if (javaTrim(strValue) == "") {
                alert('输入有误，请检查！');
                return false;
            }
        }

        function javaTrim(str) {
            for (var i = 0; (str.charAt(i) == ' ') && i < str.length; i++);
            if (i == str.length) return ''; //whole string is space
            var newstr = str.substr(i);
            for (var i = newstr.length - 1; newstr.charAt(i) == ' ' && i >= 0; i--);
            newstr = newstr.substr(0, i + 1);
            return newstr;
        }

        function get_cases() {
            $("#list").empty();
            var prj_id = $("#prj_id").val();
            if (prj_id == null) {
                alert("请先选择项目");
            }
            else {
                $.ajax({
                    type: "get",
                    url: "/base/findata",
                    data: {
                        "prj_id": prj_id,
                        "type": "get_all_case_by_prj_id"
                    },
                    success: function (data) {
                        var listdata = eval(data);
                        $(listdata).each(function (i, item) {
                            $("#list").append("<label class='checkbox-inline'><input type='checkbox' name='case_id' value=" + item.case_id + ">" + item.case_name + "</label>");
                        })
                    },
                    error: function () {
                        alert("获取用例失败");
                    }
                });
            }
        }


    </script>
{% endblock %}