(function () {
  let form = document.getElementById("form_id");
  let createFlag = false;
  let flag;
  form.onsubmit = function (e) {
    if (createFlag) return false;
    createFlag = true;
  };
  $("select.dropdown").dropdown();
  $(document).keydown(function (event) {
    switch (event.keyCode) {
      case 13:
        return false;
    }
  });
  $(".menu .item").tab();
  $(document).ready(createParamter());
  function createParamter() {
    let params = $(".dynamic.field").data("params");
    params &&
      params.parameter.forEach((item, index) => {
        Add_parameter(index, (flag = true), item);
      });
  }
  // 参数增加、删除、修改、保存
  function Add_parameter(i, flag = false, paramsObject = {}) {
    let value = "";
    value += `<div class="two fields width85" id= "para${i}">`;
    value += '<div class="field">';
    let placeholder_value = $(".dynamic.field").data("params-value");
    let placeholder_name = $(".dynamic.field").data("params-name");
    if (flag) {
      value += `<input type="text" class="shipping_first-name"  value="${paramsObject.label}">`;
    } else {
      value +=
        '<input type="text" class="shipping_first-name" required placeholder="' +
        placeholder_name +
        '">';
    }
    value += "</div>";
    value += '<div class="field">';
    if (flag) {
      value += `<input type="text" class="shipping_last-name"  value="${paramsObject.value}">`;
    } else {
      value +=
        '<input type="text" class="shipping_last-name" required placeholder="' +
        placeholder_value +
        '">';
    }
    value += "</div>";
    value += '<span><i class="trash icon"></i></span>';
    value += "</div>";
    $(".dynamic.field").append(value);
  }

  $("#add_run_para").click(function () {
    var len = $(".dynamic.field .two.fields").length;
    Add_parameter(len);
  });

  $(".dynamic.field").on("click", ".trash.icon", function () {
    var index = $(this).parent().parent().index();
    $(this).parent().parent().remove();
    var len = $(".dynamic.field .two.fields").length;
    $(".dynamic.field .two.fields").each(function () {
      var cur_index = $(this).index();
      $(this).attr("id", "para" + cur_index);
    });
  });

  $(".question.circle.icon").hover(function () {
    $(this).popup("show");
  });

  var isValidate = false;
  function validate() {
    $(".ui.form").form({
      on: "blur",
      fields: {
        boot_file: {
          identifier: "boot_file",
          rules: [
            {
              type: "regExp[/.+.py$/g]",
            },
          ],
        },
        job_name: {
          identifier: "job_name",
          rules: [
            {
              type: "regExp[/^[a-zA-Z0-9-_]{1,36}$/]",
            },
          ],
        },
        display_job_name: {
          identifier: "display_job_name",
          rules: [
            {
              type: "regExp[/^[a-zA-Z0-9-_]{1,36}$/]",
            },
          ],
        },
        attachment: {
          identifier: "attachment",
          rules: [
            {
              type: "empty",
            },
          ],
        },
        spec_id: {
          identifier: "spec_id",
          rules: [{ type: "empty" }],
        },
      },
      onSuccess: function () {
        // $('.ui.page.dimmer').dimmer('show')
        document.getElementById("mask").style.display = "block";
        isValidate = true;
      },
      onFailure: function (e) {
        isValidate = false;
        return false;
      },
    });
  }
  document.onreadystatechange = function () {
    if (document.readyState === "complete") {
      document.getElementById("mask").style.display = "none";
    }
  };
  function send_run_para() {
    var run_parameters = [];
    var msg = {};
    let paraFlag = true;
    $(".dynamic.field .two.fields").each(function () {
      var para_name = $(this).find("input.shipping_first-name").val();
      var para_value = $(this).find("input.shipping_last-name").val();
      if (!para_name) {
        $(this).find("input.shipping_first-name").parent().addClass("error");
        paraFlag = false;
        return;
      } else {
        $(this).find("input.shipping_first-name").parent().removeClass("error");
      }
      if (!para_value) {
        $(this).find("input.shipping_last-name").parent().addClass("error");
        paraFlag = false;
        return;
      } else {
        $(this).find("input.shipping_last-name").parent().removeClass("error");
      }
      run_parameters.push({ label: para_name, value: para_value });
    });
    msg["parameter"] = run_parameters;
    msg = JSON.stringify(msg);
    $("#store_run_para").val(msg);
    return paraFlag;
  }
  function get_name() {
    let name1 = $("#engine_name .text").text();
    let name2 = $("#flaver_name .text").text();
    $("input#ai_engine_name").val(name1);
    $("input#ai_flaver_name").val(name2);
  }

  validate();
  $(".ui.create_train_job.green.button").click(function (e) {
    get_name();
    let paramNotValue = send_run_para();
    if (!paramNotValue) {
      return false;
    }
    validate();
  });
})();