fair-web/views/problem_manage.ejs

<% this.title = '管理题目'; %>
<% include header %>
<div class="padding">
    <div class="ui grid">
    <div class="row">
      <div class="seven wide column">
        <form class="ui form" method="post" action=""></form>
        <% include problem_testcases %>
      </div>
      <div class="nine wide column">
        <form class="ui form" method="post" enctype="multipart/form-data" onsubmit="return checkSubmit()">
          <input type="hidden" name="type" value="<%= problem.type %>">
          <div class="ui pointing secondary menu" id="problem-type-tab" style="margin-top: -10px; ">
            <a class="<%= problem.type === 'traditional' ? 'active ' : '' %>item" data-tab="traditional">传统</a>
            <a class="<%= problem.type === 'interaction' ? 'active ' : '' %>item" data-tab="interaction">交互</a>
            <a class="<%= problem.type === 'submit-answer' ? 'active ' : '' %>item" data-tab="submit-answer">提交答案</a>
          </div>
          <div class="ui <%= problem.type !== 'submit-answer' ? 'active ' : '' %>tab" data-tab="traditional" data-tab="interaction">
            <div class="two fields">
              <div class="field">
                <label for="doc-ds-ipt-1">时间限制（单位: ms）</label>
                <input type="number" name="time_limit" value="<%= problem.time_limit %>">
              </div>
              <div class="field">
                <label for="doc-ds-ipt-1">内存限制（单位: MiB）</label>
                <input type="number" name="memory_limit" value="<%= problem.memory_limit %>">
              </div>
            </div>
            <div id="io-type"<% if (problem.type === 'interaction') { %> style="display: none; "<% } %>>
              <% if (!problem.file_io) { %>
              <div class="inline fields">
                <label>IO 方式</label>
                <div class="field">
                  <div class="ui radio checkbox">
                    <input name="io_method" value="std-io" id="std-io" type="radio" onclick="goDisable()" checked>
                    <label for="std-io">标准 IO</label>
                  </div>
                </div>
                <div class="field">
                  <div class="ui radio checkbox">
                    <input name="io_method" value="file-io" id="file-io" type="radio" onclick="goEnable()">
                    <label for="file-io">文件 IO</label>
                  </div>
                </div>
              </div>
              <div class="two fields">
                <div class="field">
                  <label for="file_io_input_name">输入文件名</label>
                  <input type="text" id="file-io-input-name" name="file_io_input_name" value="<%= problem.file_io_input_name %>" disabled>
                </div>
                <div class="field">
                  <label for="file_io_output_name">输出文件名</label>
                  <input type="text" id="file-io-output-name" name="file_io_output_name" value="<%= problem.file_io_output_name %>" disabled>
                </div>
              </div>
              <% } else { %>
              <div class="inline fields">
                <label>IO 方式</label>
                <div class="field">
                  <div class="ui radio checkbox" id="std-io-div">
                    <input name="io_method" value="std-io" id="std-io" type="radio" onclick="goDisable()">
                    <label for="std-io">标准 IO</label>
                  </div>
                </div>
                <div class="field">
                  <div class="ui radio checkbox">
                    <input name="io_method" value="file-io" id="file-io" type="radio" onclick="goEnable()" checked>
                    <label for="file-io">文件 IO</label>
                  </div>
                </div>
              </div>
              <div class="two fields">
                <div class="field">
                  <label for="file_io_input_name">输入文件名</label>
                  <input type="text" id="file-io-input-name" name="file_io_input_name" value="<%= problem.file_io_input_name %>">
                </div>
                <div class="field">
                  <label for="file_io_output_name">输出文件名</label>
                  <input type="text" id="file-io-output-name" name="file_io_output_name" value="<%= problem.file_io_output_name %>">
                </div>
              </div>
              <% } %>
            </div>
          </div>
          <div class="ui <%= problem.type === 'submit-answer' ? 'active ' : '' %>tab" data-tab="submit-answer" style="margin-bottom: 10px; ">
            <b>为了避免系统出错，已有提交的题目不允许在提交答案和非提交答案之间更改。</b><br>
            提交答案题目不需要设置时间限制、空间限制以及 IO 方式。<br>
            左侧表格中第三列为选手提交时应使用的文件名。
          </div>
          <div class="field">
            <label for="testdata">上传测试数据（请使用 ZIP 格式）</label>
            <input type="file" id="testdata" name="testdata">
          </div>
          <div class="field">
            <label for="additional_file">上传附加文件（请使用 ZIP 格式）</label>
            <input type="file" id="additional_file" name="additional_file">
          </div>
          <button type="submit" class="ui labeled icon blue button"><i class="ui edit icon"></i>提交</button>
          <a href="<%= syzoj.utils.makeUrl(['problem', problem.id]) %>" class="ui labeled icon button"><i class="ui angle left icon"></i>返回</a>
        </form>
      </div>
  </div>
<div>
<script>
function goEnable() {
  document.getElementById('file-io-input-name').disabled = false;
  document.getElementById('file-io-output-name').disabled = false;
}
function goDisable() {
  document.getElementById('file-io-input-name').disabled = true;
  document.getElementById('file-io-output-name').disabled = true;
}

$(function () {
  $('#file-io-input-name').on('input keyup change', function (e) {
    var prob = $('#file-io-input-name').val();
    if (prob.lastIndexOf('.') !== -1) prob = prob.substring(0, prob.lastIndexOf('.'));
    $('#file-io-output-name').attr('placeholder', prob + '.out');
  });
  $('#file-io-output-name').focus(function (e) {
    if (!$('#file-io-output-name').val()) {
      $('#file-io-output-name').val($('#file-io-output-name').attr('placeholder'));
    }
  });

  $('#problem-type-tab .item').tab();

  $('a[data-tab="traditional"]').click(function () {
    $('input[name=type]').val('traditional');
    if ($('div[data-tab="interaction"]').attr('data-tab', 'traditional').length) $('a[data-tab="traditional"]').click();

    $('#io-type').show();
  });

  $('a[data-tab="interaction"]').click(function () {
    $('input[name=type]').val('interaction');
    if ($('div[data-tab="traditional"]').attr('data-tab', 'interaction').length) $('a[data-tab="interaction"]').click();

    $('#io-type').hide();
  });

  $('a[data-tab="submit-answer"]').click(function () {
    $('input[name=type]').val('submit-answer');
  });
});

function checkSubmit() {
  if (!$('#file-io-output-name').val()) {
    $('#file-io-output-name').val($('#file-io-output-name').attr('placeholder'));
  }
}
</script>
<% include footer %>