<!--<!DOCTYPE html>-->
<!--<html>-->
<!--<head>-->
<!--  <meta charset="utf-8">-->
<!--  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />-->
<!--  <style class="text/css">-->
<!--    body{-->
<!--      font-size:14px;}-->
<!--    p{-->
<!--      margin:0;-->
<!--    }-->
<!--    .fs13{-->
<!--      font-size:13px;-->
<!--    }-->
<!--    .fs16{-->
<!--      font-size:16px;-->
<!--    }-->
<!--    .position-relative{-->
<!--      position:relative;-->
<!--    }-->
<!--    .text-center{-->
<!--      text-align:center;-->
<!--    }-->
<!--    .bdc{-->
<!--      border-bottom:1px solid #eee;-->
<!--    }-->
<!--    .plr15{-->
<!--      padding:0 15px;-->
<!--    }-->
<!--    .pd10{-->
<!--      padding:10px;-->
<!--    }-->
<!--    .pbt10{-->
<!--      padding:10px 0;-->
<!--    }-->
<!--    .pbt5{-->
<!--      padding:5px 0;-->
<!--    }-->
<!--    .mbt20{-->
<!--      margin: 20px 0;-->
<!--    }-->
<!--    .mt8{-->
<!--      margin-top:8px;-->
<!--    }-->
<!--    .mbt10{-->
<!--      margin: 10px 0;-->
<!--    }-->
<!--    .pull-right{-->
<!--      float:right;-->
<!--    }-->
<!--    .line-34{-->
<!--      line-height:34px;-->
<!--    }-->
<!--    .pull-left{-->
<!--      float:left;-->
<!--    }-->
<!--    .text-orange{-->
<!--      color: #FC7033;-->
<!--    }-->
<!--    .text-green{-->
<!--      color: #29BD8B;-->
<!--    }-->
<!--    .bgc{-->
<!--      background-color:rgb(250, 250, 250);-->
<!--    }-->
<!--    .text-black{color:#333;}-->
<!--    .flex-nowrap{-->
<!--      display:flex;-->
<!--      white-space: nowrap;-->
<!--    }-->
<!--    .text-blue{-->
<!--      color:#1890ff;-->
<!--    }-->
<!--    .text-gray{-->
<!--      color:#999 !important;-->
<!--    }-->
<!--    .mlr5{-->
<!--      margin:0 5px;-->
<!--    }-->
<!--    .ml20{-->
<!--      margin-left:20px;-->
<!--    }-->
<!--    .mr15{-->
<!--      margin-right:15px;-->
<!--    }-->
<!--    .main-height{-->
<!--      min-height:60px !important;-->
<!--    }-->
<!--    .null-answer{-->
<!--      background: #eee;-->
<!--      width: 100%;-->
<!--      display: inline-block;-->
<!--      padding: 8px 10px;-->
<!--      border-radius: 2px;-->
<!--      white-space: normal;-->
<!--    }-->
<!--    .choose-radio{-->
<!--      display: inline-block;-->
<!--      width: 12px;-->
<!--      height: 12px;-->
<!--      border-radius: 50%;-->
<!--      border: 1px solid #d9d9d9;-->
<!--      background-color: #fff;-->
<!--      vertical-align: middle;-->
<!--      margin: 0 5px 5px 0 ;-->
<!--    }-->
<!--    .choose-checkbox{-->
<!--      display: inline-block;-->
<!--      width: 12px;-->
<!--      height: 12px;-->
<!--      border-radius:2px;-->
<!--      border: 1px solid #d9d9d9;-->
<!--      background-color: #fff;-->
<!--      vertical-align: middle;-->
<!--      margin: 0 5px 5px 0 ;-->
<!--    }-->
<!--    .ques-title p:first-child{-->
<!--      display:inline-block;-->
<!--      margin-bottom:10px;-->
<!--    }-->
<!--    .choose-answer{-->
<!--      position: relative;-->
<!--      border-color: #1890ff;-->
<!--    }-->
<!--    .choose-answer:after{-->
<!--      position: absolute;-->
<!--      width: 6px;-->
<!--      height: 6px;-->
<!--      left: 3px;-->
<!--      top: 3px;-->
<!--      border-radius: 8px;-->
<!--      display: table;-->
<!--      border-top: 0;-->
<!--      border-left: 0;-->
<!--      content: " ";-->
<!--      background-color: #1890ff;-->
<!--    }-->
<!--    .choose-answer-multi{-->
<!--      background-color: #1890ff;-->
<!--      border-color: #1890ff;-->
<!--      position: relative;-->
<!--      width:12px !important;-->
<!--      height: 12px !important;-->
<!--    }-->
<!--    .choose-answer-multi:after{-->
<!--      content: "\2713";-->
<!--      color:#fff;-->
<!--      height: 9px;-->
<!--      /*width: 7px;*/-->
<!--      font-size:0.6em;-->
<!--      position: absolute;-->
<!--      display: inline-block;-->
<!--      bottom: 6px;-->
<!--      left: 1px;-->
<!--    }-->
<!--    .line-line {-->
<!--      width:15px;-->
<!--      height: 7px;-->
<!--      border-radius:6px;-->
<!--      margin-right:5px;-->
<!--      display:inline-block;-->
<!--    }-->
<!--    .bd-ee{-->
<!--      border:1px solid #eee;-->
<!--      padding:5px;-->
<!--    }-->

<!--    .bg-orange{-->
<!--      background-color:#FC7033;-->
<!--    }-->
<!--    .bg-green{-->
<!--      background-color:#29BD8B;-->
<!--    }-->
<!--    .bg-gray{-->
<!--      background-color: #ccc;-->
<!--    }-->
<!--    .right-status{-->
<!--      width:28px;-->
<!--      height:28px;-->
<!--      border-radius: 50%;-->
<!--      text-align:center;-->
<!--      margin:5px 3px;-->
<!--    }-->
<!--    .right-status span{-->
<!--      color:#fff;-->
<!--      font-size:13px;-->
<!--      line-height: 28px;-->
<!--    }-->
<!--    .inline-block{-->
<!--      display:inline-block;-->
<!--    }-->
<!--    .circle-review{-->
<!--      width:12px;-->
<!--      height:12px;-->
<!--      border-radius: 50%;-->
<!--      border:1px solid #ccc;-->
<!--      margin-right:5px;-->
<!--      display:inline-block;-->
<!--    }-->
<!--    .bd-radius{-->
<!--      border:1px solid #ccc-->
<!--    }-->
<!--    .user-score{-->
<!--      position: absolute;-->
<!--      right:0;-->
<!--      top:0;-->
<!--    }-->
<!--    .circle-score{-->
<!--      width:14px;-->
<!--      height:14px;-->
<!--      border-radius:50%;-->
<!--      position: relative;-->
<!--      display:inline-block;-->
<!--      vertical-align: middle;-->
<!--      margin-bottom: 2px;-->
<!--    }-->
<!--    .circle-wrong:after{-->
<!--      color:#fff;-->
<!--      content: "x";-->
<!--      height: 7px;-->
<!--      width: 7px;-->
<!--      position: absolute;-->
<!--      display: inline-block;-->
<!--      bottom: 10px;-->
<!--      left: 4px;-->
<!--    }-->
<!--    .circle-right:after{-->
<!--      color:#fff;-->
<!--      content: "✔";-->
<!--      height: 7px;-->
<!--      width: 7px;-->
<!--      position: absolute;-->
<!--      display: inline-block;-->
<!--      bottom: 8px;-->
<!--      left: 2px;-->
<!--    }-->
<!--    table{-->
<!--      width:100%;-->
<!--      text-align:center;-->
<!--    }-->
<!--    table, tr, td, th, tbody, thead{-->
<!--      page-break-inside: avoid;-->
<!--    }-->
<!--    table th{-->
<!--      padding:10px 0;-->
<!--    }-->
<!--    table td{-->
<!--      padding: 10px 0;-->
<!--      border-bottom: 1px solid #eee;-->
<!--    }-->
<!--    .shixun-detail td{-->
<!--      border:1px solid #eee;-->
<!--    }-->
<!--    .code_content_show{-->
<!--      width:95%;-->
<!--      height:100%;-->
<!--      line-height:1.8;-->
<!--      border:none;-->
<!--      padding-left:10px;-->
<!--      resize:none;-->
<!--      overflow: hidden;-->
<!--    }-->
<!--    .test-code{-->
<!--      position: relative;-->
<!--      width:100%;-->
<!--      display:inline-block;-->
<!--    }-->
<!--    .line-no{-->
<!--      width: 28px;-->
<!--      display: inline-block;-->
<!--      position: absolute;-->

<!--    }-->
<!--    .line-no p{-->
<!--      line-height:1.8;-->
<!--      text-align: center;-->
<!--      color:#999;-->
<!--    }-->
<!--    .pull-left{-->
<!--      float:left;-->
<!--    }-->
<!--    .shixun-detail{-->
<!--      max-height:100%;-->
<!--    }-->

<!--  </style>-->
<!--</head>-->
<!--<body>-->
<!--<div class="container" style="background-color:#fff;">-->
<!--  <div>-->
<!--    <div class="ex-title text-center mbt20">-->
<!--      <div class="mbt10">-->
<!--        <h3><%#= @exercise.try(:exercise_name) %></h3>-->
<!--      </div>-->
<!--      <div class="plr15">-->
<!--        <p class="text-gray">-->
          <%#= @exercise.try(:exercise_description).nil? ? "" : @exercise.try(:exercise_description).html_safe %>
<!--        </p>-->
<!--      </div>-->
<!--    </div>-->
<!--    <div class="mbt20 bgc">-->
<!--      <div class="ex-scores pd10 text-gray fs13">-->
<!--        <div class="inline-block pull-left">-->
          <%# if @exercise_single_ques_count > 0 %>
<!--        <span class="mr15">单选题<span class="mlr5"><%#= @exercise_single_ques_count %></span>题,-->
<!--        共<span class="mlr5"><%#= @exercise_single_ques_scores %></span>分</span>-->
          <%# end %>
          <%# if @exercise_double_ques_count > 0 %>
<!--        <span class="mr15">多选题<span class="mlr5"><%#= @exercise_double_ques_count %></span>题,-->
<!--        共<span class="mlr5"><%#= @exercise_double_ques_scores %></span>分</span>-->
          <%# end %>
          <%# if @exercise_ques_judge_count > 0 %>
<!--        <span class="mr15">判断题<span class="mlr5"><%#= @exercise_ques_judge_count %></span>题,-->
<!--        共<span class="mlr5"><%#= @exercise_ques_judge_scores %></span>分</span>-->
          <%# end %>
          <%# if @exercise_ques_null_count > 0 %>
<!--        <span class="mr15">填空题<span class="mlr5"><%#= @exercise_ques_null_count %></span>题,-->
<!--        共<span class="mlr5"><%#= @exercise_ques_null_scores %></span>分</span>-->
          <%# end %>
          <%# if @exercise_ques_main_count > 0 %>
<!--        <span class="mr15">主观题<span class="mlr5"><%#= @exercise_ques_main_count %></span>题,-->
<!--        共<span class="mlr5"><%#= @exercise_ques_main_scores %></span>分</span>-->
          <%# end %>
          <%# if @exercise_ques_shixun_count > 0 %>
<!--        <span class="mr15">实训题<span class="mlr5"><%#= @exercise_ques_shixun_count %></span>题,-->
<!--        共<span class="mlr5"><%#= @exercise_ques_shixun_scores %></span>分</span>-->
          <%# end %>
<!--        </div>-->
<!--        <div style="text-align:right;word-break:keep-all;">合计<span class="text-blue mlr5"><%#= @exercise_ques_count %></span>题,-->
<!--        共<span class="text-orange mlr5"><%#= @exercise_ques_scores %></span>分</div>-->
<!--      </div>-->
<!--    </div>-->
<!--    <div class="mbt10">-->
<!--      <div>-->
<!--        <p class="pbt10">-->
<!--          <span class="mr15">客观题</span>-->
<!--          <span class="mlr5"><span class="line-line bg-green"></span>正确</span>-->
<!--          <span class="mlr5"><span class="line-line bg-orange"></span>错误</span>-->
<!--          <span class="pull-right">总分：<span class="text-orange"><%#= @exercise.exercise_users.where(user_id:31798).first.score %>分</span></span>-->
<!--        </p>-->
<!--      </div>-->
<!--      <div class="pbt5">-->
        <%# @ex_obj_array.each do |s| %>
        <%# if s[:stand_status] == 1 %>
<!--            <div class="inline-block right-status bg-green">-->
<!--              <span><%#= s[:q_position] %></span>-->
<!--            </div>-->
          <%# else %>
<!--            <div class="inline-block right-status bg-orange">-->
<!--              <span><%#= s[:q_position] %></span>-->
<!--            </div>-->
          <%# end %>
        <%# end %>
<!--      </div>-->
      <%# if @ex_sub_array.size > 0 %>
<!--        <div>-->
<!--          <p class="pbt10">-->
<!--            <span class="mr15">主观题</span>-->
<!--            <span class="mlr5"><span class="circle-review bg-gray"></span>已评</span>-->
<!--            <span class="mlr5"><span class="circle-review"></span>未评</span>-->
<!--            <span class="pull-right text-gray">开始答题时间：<%#= @exercise_user.start_at.present? ? @exercise_user.start_at.strftime("%Y-%m-%d %H:%M") : "--" %></span>-->
<!--          </p>-->
<!--        </div>-->
<!--        <div class="pbt5">-->
          <%# @ex_sub_array.each do |s| %>
            <%# if s[:stand_status] == 1 %>
<!--              <div class="inline-block right-status bg-gray">-->
<!--                <span><%#= s[:q_position] %></span>-->
<!--              </div>-->
            <%# else %>
<!--              <div class="inline-block right-status bd-radius">-->
<!--                <span class="text-gray"><%#= s[:q_position] %></span>-->
<!--              </div>-->
            <%# end %>
          <%# end %>
<!--        </div>-->
      <%# end %>
<!--    </div>-->
<!--    <div class="mbt10">-->
      <%# @exercise_questions.each do |q| %>
        <%# user_answer = q.exercise_answers.where(user_id: 31798) %>
        <%# this_ques_status = @ex_obj_array.detect{|f| f[:q_id] == q.id} %>
<!--        <div class="bdc">-->
<!--          <div class="pbt10">-->
<!--            <div class="mbt10 position-relative">-->
<!--              <span class="text-blue">-->
                <%#= q.question_type_name %>
<!--              </span>-->
<!--              <span class="text-gray mlr5">(<%#= q.question_score %>分)</span>-->
<!--              <span class="mr5">Q<%#= q.question_number %>:&nbsp;</span>-->
              <%# if q.question_type == 5 %>
<!--                <span class="ques-title"><%#= q.shixun_name.html_safe %></span>-->
<!--                <span class="user-score">-->
                  <%# if this_ques_status.present? && this_ques_status[:stand_status] == 1 %>
<!--                    <span class="circle-score circle-right bg-green mr15"></span>-->
<!--                    <span class="text-green"><%#= this_ques_status[:user_score] %></span>分-->
                  <%# else %>
<!--                    <span class="circle-score circle-wrong bg-orange mr15"></span>-->
<!--                    <span class="text-orange">0</span>分-->
                      <%# end %>
<!--                    </span>-->
<!--                <div class="mt8 text-gray">-->
<!--                  <span><%#= q.question_title.html_safe %></span>-->
<!--                </div>-->
              <%# else %>
<!--                <span class="ques-title"><%#= q.question_title.html_safe %></span>-->
<!--                <span class="user-score">-->
                  <%# if this_ques_status.present? && this_ques_status[:stand_status] == 1 %>
<!--                    <span class="circle-score circle-right bg-green mr15"></span>-->
<!--                    <span class="text-green"><%#= this_ques_status[:user_score] %></span>分-->
                  <%# else %>
<!--                    <span class="circle-score circle-wrong bg-orange mr15"></span>-->
<!--                    <span class="text-orange">0</span>分-->
                      <%# end %>
<!--                    </span>-->
              <%# end %>
<!--            </div>-->
<!--            <div class="pbt5">-->
              <%# if q.question_type ==  0 %>
                <%# q.exercise_choices.each_with_index do |s,index| %>
                  <%# check_answer = (user_answer.present? && (s.id == user_answer.first.exercise_choice_id)) ? "choose-answer" : '' %>
<!--                    <p class="pbt5">-->
<!--                      <span class="choose-radio <%#= check_answer %>"></span>-->
<!--                      <span class="mr15"><%#= convert_to_char((index+1).to_s)%></span><%#= s.choice_text%>-->
<!--                    </p>-->
                <%# end %>
              <%# elsif q.question_type == 1 %>
                <%# q.exercise_choices.each_with_index do |s,index| %>
                  <%# check_answer = (user_answer.present? && (user_answer.pluck(:exercise_choice_id).include?(s.id))) ? true : false %>
<!--                  <p class="pbt5">-->
                    <%# if check_answer %>
<!--                      <span class="choose-checkbox choose-answer-multi" ></span>-->
                      <%# else %>
<!--                      <span class="choose-checkbox"></span>-->
                  <%# end %>
<!--                    <span class="mr15"><%#= convert_to_char((index+1).to_s)%></span><%#= s.choice_text%>-->
<!--                  </p>-->
                <%# end %>
              <%# elsif q.question_type == 2 %>
<!--                <p class="pbt5">-->
                  <%# q.exercise_choices.each_with_index do |s,index| %>
                    <%# check_answer = (user_answer.present? && (s.id == user_answer.first.exercise_choice_id)) ? "choose-answer" : '' %>
<!--                    <span class="mr15">-->
<!--                      <span class="choose-radio <%#= check_answer %>"></span>-->
<!--                      <span class="mlr5"><%#= s.choice_text %></span>-->
<!--                    </span>-->
                  <%# end %>
<!--                </p>-->
              <%# elsif q.question_type == 3 %>
                <%# st_counts = q.exercise_standard_answers.pluck(:exercise_choice_id).uniq %>
                <%# st_counts.each_with_index do |s,index| %>
                  <%# if user_answer.present? && user_answer.where(exercise_choice_id:s).present? %>
                    <%# check_answer = user_answer.where(exercise_choice_id:s).first.answer_text %>
                  <%# else %>
                    <%# check_answer = "--" %>
                  <%# end %>
<!--                  <p class="pbt10 flex-nowrap">-->
<!--                    <span class="pull-left line-34">答案（填空<%#= index+1 %>）：</span>-->
<!--                    <span class="null-answer"><%#= check_answer.html_safe %></span>-->
<!--                  </p>-->
                <%# end %>
              <%# elsif q.question_type == 4 %>
                <%# check_answer = user_answer.present?  ? user_answer.first.answer_text : '--' %>
<!--                <p class="flex-nowrap">-->
<!--                  <span class="null-answer main-height"><%#= check_answer.html_safe %></span>-->
<!--                </p>-->
              <%# else %>
<!--                <div class="mbt10">-->
<!--                  <p class="text-gray mbt10">-->
<!--                    <span>阶段成绩</span>-->
<!--                  </p>-->
<!--                  <table style="width:100%;" cellpadding="0" cellspacing="0" >-->
<!--                    <thead class="bgc">-->
<!--                    <th width="6%">关卡</th>-->
<!--                    <th width="29%" style="text-align: left;">任务名称</th>-->
<!--                    <th width="10%">评测次数</th>-->
<!--                    <th width="13%">完成时间</th>-->
<!--                    <th width="16%">耗时</th>-->
<!--                    <th width="13%">经验值</th>-->
<!--                    <th width="13%">得分/满分</th>-->
<!--                    </thead>-->
<!--                    <tbody>-->
                    <%# if @games.size > 0 %>
                      <%# @games.each_with_index do |game, index| %>
                        <%# user_score = q.exercise_shixun_answers.where(exercise_shixun_challenge_id:game.challenge.id,user_id:31798) %>
                        <%# game_score = q.exercise_shixun_challenges.where(challenge_id:game.challenge.id) %>
<!--                        <tr>-->
<!--                          <td><%#= index + 1 %></td>-->
<!--                          <td style="text-align: left;">-->
<!--                            <span class="task-hide edu-info-dark fl"><%#= game.challenge.subject %></span>-->
<!--                          </td>-->
<!--                          <td><%#= game.evaluate_count %></td>-->
<!--                          <td><%#= game.end_time.present? ? game.end_time.strftime("%Y-%m-%d %H:%M") : "--" %></td>-->
<!--                          <td><%#= ApplicationController.helpers.time_consuming game %></td>-->
<!--                          <td><span class="text-green"><%#= game.final_score %></span> / <%#= game.challenge.all_score %></td>-->
<!--                          <td><span class="text-orange"><%#= user_score.present? ? user_score.first.score : 0.0 %> /</span> <%#= game_score.first.question_score %></td>-->
<!--                        </tr>-->
                      <%# end %>
                    <%# else %>
                      <%# q.exercise_shixun_challenges.each_with_index do |game, index| %>
                        <%# game_score = q.exercise_shixun_challenges.where(challenge_id:game.challenge.id) %>
<!--                        <tr>-->
<!--                          <td><%#= index + 1 %></td>-->
<!--                          <td style="text-align: left;">-->
<!--                            <span class="task-hide edu-info-dark fl"><%#= game.challenge.subject %></span>-->
<!--                          </td>-->
<!--                          <td>0</td>-->
<!--                          <td>--</td>-->
<!--                          <td>--</td>-->
<!--                          <td><span class="text-green">0.0</span> / <%#= game.challenge.all_score %></td>-->
<!--                          <td><span class="text-orange">0.0 /</span> <%#= game_score.first.question_score %></td>-->
<!--                        </tr>-->
                      <%# end %>
                    <%# end %>

<!--                    </tbody>-->
<!--                  </table>-->
<!--                </div>-->
<!--                <div class="mbt10">-->
                  <%# @games.each_with_index do |game, index| %>
<!--                    <p class="text-gray mbt10">-->
<!--                      <span class="fl font-bd">实训详情</span>-->
<!--                    </p>-->
<!--                    <div class="mbt10">-->
<!--                      <p class="clearfix">-->
<!--                        <span class="fl mt3"><span class="font-bd mr15">第<%#= index+1 %>关</span><%#= game.challenge.subject %></span>-->
<!--                      </p>-->
<!--                      <div style="margin-left: 32px;width:100%;" class="mt8 shixun-detail">-->
                        <%# if game.outputs.present? %>
<!--                          <table style="width:100%;" cellpadding="0" cellspacing="0">-->
<!--                            <thead class="bgc">-->
<!--                            <th width="10%">评测次数</th>-->
<!--                            <th>评测信息</th>-->
<!--                            </thead>-->
<!--                            <tbody>-->
                            <%# outputs = game.outputs.group("query_index") %>
                            <%# outputs.reverse.try(:each) do |output| %>
<!--                              <tr>-->
<!--                                <td><%#= "第#{output.query_index}次" %></td>-->
<!--                                <td align="left" style="padding-left: 5px"><%#= output_detail(game, output) %></td>-->
<!--                              </tr>-->
                            <%# end %>
<!--                            </tbody>-->
<!--                          </table>-->
                        <%# end %>
                        <%# if game.try(:lastest_code).present? && game.challenge.st == 0 %>
<!--                          <div class="mbt20 inline-block" style="height:auto;width:100%;">-->
<!--                            <p class="bgc">-->
<!--                              <span class="pd10" style="display:inherit;">-->
<!--                                <span class="fl">最近通过的代码</span>-->
<!--                              <span class="pull-right"><%#= game.challenge.path %></span>-->
<!--                              </span>-->
<!--                            </p>-->
<!--                            <div class="test-code bor-top-greyE">-->
<!--                              <div class="bgc line-no" style="width:28px;">-->
                                <%# code_len =  content_line(game.try(:lastest_code).html_safe) %>
                                <%# (1..code_len).each do |c| %>
<!--                                <p><%#= c %></p>-->
                                <%# end %>
<!--                              </div>-->
<!--                              <textarea class="code_content_show pull-left ml30" rows = "<%#= code_len %>" ><%#= game.try(:lastest_code).html_safe %></textarea>-->
<!--                            </div>-->
<!--                          </div>-->
                        <%# end %>
<!--                      </div>-->
<!--                    </div>-->
                  <%# end %>
<!--                </div>-->
              <%# end %>
<!--            </div>-->
<!--          </div>-->
<!--        </div>-->
      <%# end %>
<!--    </div>-->
<!--  </div>-->
<!--</div>-->
<!--</body>-->

<!--</html>-->

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />

  <link rel="stylesheet" href="<%= Rails.root %>/app/templates/exercise_export/exercise_export.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.11.1/katex.min.css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.11.1/katex.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.11.1/contrib/auto-render.min.js"></script>
  <script>
      document.addEventListener("DOMContentLoaded", function() {
          renderMathInElement(document.getElementById('markdown_content'), {
              displayMode: true,
              delimiters: [
                  {left: "$$", right: "$$", display: true},
                  {left: "$", right: "$", display: false}
              ]
          });
          function fix_frac_line(){
              var win = window;
              var frac_lines = document.getElementsByClassName("frac-line");
              for (var i = 0; i < frac_lines.length; i++) {
                  var frac = frac_lines[i];
                  if (win.getComputedStyle) {
                      style = win.getComputedStyle(frac, '');
                      if (style['border-bottom-width'] == '0px') {
                          frac.style['border-bottom-width'] = '1px';
                      }
                  }
              }
          };

          fix_frac_line();
      })
  </script>
</head>
<body>
<div class="container" style="background-color:#fff;">
  <div>
    <div class="ex-title text-center mbt20">
      <div class="mbt10">
        <h3><%= @exercise.try(:exercise_name) %></h3>
      </div>
      <div class="plr15">
        <p class="text-gray">
          <%= @exercise.try(:exercise_description).nil? ? "" : @exercise.try(:exercise_description)&.html_safe %>
        </p>
      </div>
    </div>
    <div class="mbt20 bgc width100">
      <div class="ex-scores pd10 text-gray fs13">
        <p class="clearfix inline-block width100">
          <% if @exercise_single_ques_count > 0 %>
        <span class="mr15">单选题<span class="mlr5"><%= @exercise_single_ques_count %></span>题,
        共<span class="mlr5"><%= @exercise_single_ques_scores %></span>分</span>
          <% end %>
          <% if @exercise_double_ques_count > 0 %>
        <span class="mr15">多选题<span class="mlr5"><%= @exercise_double_ques_count %></span>题,
        共<span class="mlr5"><%= @exercise_double_ques_scores %></span>分</span>
          <% end %>
          <% if @exercise_ques_judge_count > 0 %>
        <span class="mr15">判断题<span class="mlr5"><%= @exercise_ques_judge_count %></span>题,
        共<span class="mlr5"><%= @exercise_ques_judge_scores %></span>分</span>
          <% end %>
          <% if @exercise_ques_null_count > 0 %>
        <span class="mr15">填空题<span class="mlr5"><%= @exercise_ques_null_count %></span>题,
        共<span class="mlr5"><%= @exercise_ques_null_scores %></span>分</span>
          <% end %>
          <% if @exercise_ques_main_count > 0 %>
        <span class="mr15">主观题<span class="mlr5"><%= @exercise_ques_main_count %></span>题,
        共<span class="mlr5"><%= @exercise_ques_main_scores %></span>分</span>
          <% end %>
          <% if @exercise_ques_shixun_count > 0 %>
        <span class="mr15">实训题<span class="mlr5"><%= @exercise_ques_shixun_count %></span>题,
        共<span class="mlr5"><%= @exercise_ques_shixun_scores %></span>分</span>
          <% end %>
          <% if @exercise_ques_pro_count > 0 %>
        <span class="mr15">编程题<span class="mlr5"><%= @exercise_ques_pro_count %></span>题,
        共<span class="mlr5"><%= @exercise_ques_pro_scores %></span>分</span>
          <% end %>
          <span class="pull-right">
            <% if @exercise_ques_count > 0 %>
              <span class="mr15">
                合计<span class="text-blue mlr5"><%= @exercise_ques_count %></span>题
            </span>
            <span>
                共<span class="text-orange mlr5"><%= @exercise_ques_scores %></span>分
            </span>
          <% end %>
          </span>
        </p>
      </div>
    </div>
    <div class="clearfix"></div>
    <div class="mbt10" id="markdown_content">
      <% @exercise_questions.each do |q| %>
        <div class="bdc">
          <div class="pbt5">
            <div class="pbt5">
              <span class="mr5 text-blue"><%= q.question_number %>、</span>
              <span class="text-blue">
                <%= q.question_type_name %>
              </span>
              <span class="text-gray mlr5">(<%= q&.question_score %>分)</span>
            </div>
            <div class="pbt5">
              <% if q.question_type == 5 %>
                <span class="ques-title" ><%= to_markdown(q.shixun_name,@request_url) %></span>
                <div class="mt8 text-gray">
                  <span><%= to_markdown(q.question_title,@request_url) %></span>
                </div>
              <% else %>
                <span class="ques-title"><%= to_markdown(q.question_title,@request_url) %></span>
              <% end %>
            </div>
            <div class="pbt5">
              <% if q.question_type ==  0 %>
                <% q.exercise_choices.each_with_index do |s,index| %>
                  <div class="pbt5 clearfix main-choice">
                    <span class="choose-radio pull-left mt8"></span>
                    <div class="inline-block pull-left choice-text ml10"><%= to_markdown("#{(index+65).chr}.#{s.choice_text}",@request_url) %></div>
                  </div>
                <% end %>
              <% elsif q.question_type == 1 %>
                <% q.exercise_choices.each_with_index do |s,index| %>
                  <div class="pbt5 clearfix main-choice">
                    <span class="choose-checkbox pull-left mt8"></span>
                    <div class="inline-block pull-left choice-text ml10"><%= to_markdown("#{(index+65).chr}.#{s.choice_text}",@request_url) %></div>
                  </div>
                <% end %>
              <% elsif q.question_type == 2 %>
                <div class="pbt5 clearfix">
                  <% q.exercise_choices.each_with_index do |s,index| %>
                    <span class="mr15">
                      <span class="choose-radio "></span>
                      <span class="mlr5 inline-block"><%= "#{(index+65).chr}.#{s.choice_text}" %></span>
                    </span>
                  <% end %>
                </div>
              <% elsif q.question_type == 3 %>
                <% st_counts = q.exercise_standard_answers.pluck(:exercise_choice_id).uniq %>
                <% st_counts.each_with_index do |s,index| %>
                  <p class="pbt10 flex-nowrap">
                    <span class="pull-left line-34">答案（填空<%= index+1 %>）：</span>
                    <span class="null-answer"></span>
                  </p>
                <% end %>
              <% elsif q.question_type == 4 %>
                <p class="flex-nowrap">
                  <span class="null-answer main-height"></span>
                </p>
              <% elsif q.question_type == 5 %>
                <% q.exercise_shixun_challenges.each_with_index do |c,index| %>
                  <p class="pbt5">
                    <span>第<%= index+1 %>关</span>
                    <span class="mlr5"><%= c.challenge.subject %></span>
                    <span class="ml20"><%= c&.question_score %>&nbsp;分</span>
                  </p>
                <% end %>
              <% elsif q.question_type == 6 %>
                <p class="flex-nowrap">
                  <%= to_markdown(q.hack&.description,@request_url) %>
                </p>
              <% end %>
            </div>
          </div>
        </div>
      <% end %>
    </div>
  </div>
</div>
</body>

</html>