pgfqe6ch8/app/views/subjects/show.html.erb

<%= stylesheet_link_tag '/editormd/css/editormd','/editormd/css/editormd.min.css' %>
<%= javascript_include_tag '/editormd/lib/marked.min.js','/editormd/lib/prettify.min.js','/editormd/lib/raphael.min.js','/editormd/lib/underscore.min.js','/editormd/lib/sequence-diagram.min.js',
                           '/editormd/lib/flowchart.min.js','/editormd/lib/jquery.flowchart.min.js','/editormd/editormd.js'%>
<div class="with65 fl">
  <!--简介-->
  <% if !@subject.description.blank? || @is_member %>
      <div class="produce-content mb30">
        <p class="clearfix mb20">
          <span class="fl font-18 font-bd">简介</span>
          <% if @is_member %>
              <a href="<%= edit_subject_path(@subject) %>" class="ring-green fr mt10">
                <img src="/images/educoder/icon/edit.svg" class="fl mt3 ml2">
              </a>
          <% end %>
        </p>
        <div class="color-grey-6 clearfix <%= @subject.description.blank? ? 'color-light-grey' : '' %> ">
          <div id="shixuns_propaedeutics" class="new_li fl" style="padding: 0px;text-align: justify;">
            <textarea name="subject[description]" style="display: none"><%= @subject.description.blank? ? "暂未填写" : (@subject.description) %></textarea>
          </div>
        </div>
      </div>
  <% end %>
  <!--新版阶段列表-->
  <div class="lesson-saved-list edu-back-white" id="paths_list">
    <%= render :partial => "subjects/paths_list" %>
  </div>

  <% if @is_member %>
      <div class="lesson-edit-content">
        <% if @stages.count == 0 %>
            <%= form_for('', :url => {:controller => 'stages', :action => 'create', :subject => @subject.id}, :method => "post", :html => {:id => 'new_stage_form'}) do |f| %>
                <div class="clearfix edu-back-white bor-top-greyE pt37">
                  <p class="clearfix mb20 font-18 font-bd pl25 pr25">
                    <a href="javascript:void(0)" class="fl ring-green mr10 mt9">
                      <img src="/images/educoder/icon/charpter-white.svg" class="fl ml3 mt3">
                    </a>
                    第1部分</p>
                  <div class="pl50 pr20 clearfix">
                    <p class="color-grey-6 font-16 mb20">章节名称</p>
                    <div class="df mb30">
                      <span class="mr30 color-orange pt10">*</span>
                      <div class="flex1 mr20">
                        <input type="text" class="input-100-45 greyInput" name="stage_name" placeholder="请输入第一阶段名称">
                      </div>
                      <span class="color-orange none mt8" id="stage_name_notice"><i class="fa fa-exclamation-circle mr3"></i>必填项</span>
                    </div>
                    <p class="color-grey-6 font-16 mb20">描述</p>
                    <div class="width89 mb30">
                      <textarea class="winput-100-130" name="stage_des"></textarea>
                      <!--<p class="edu-txt-right color-grey-c font-12">数据已于 09:23:29 保存</p>-->
                    </div>
                    <p class="clearfix mb30">
                      <a href="<%= choose_subject_shixun_subject_path(@subject) %>" class="fl defalutGreyBorder color-grey-6" data-remote="true"><i class="iconfont icon-tianjiafangda fl mr5"></i>选择实训</a>
                      <span id="sx_notice" class="fl ml20 color-grey-9 mt2">选择实训后，在页面上通过拖拽进行排序调整</span>
                    </p>
                  </div>
                  <div class="adding-stage-item clearfix" id="sortable"></div>
                  <p class="clearfix pl50 mb40">
                    <a href="javascript:void(0)" class="fl task-btn task-btn-orange" onclick="saveeidtsatge(this)">保存</a>
                  </p>
                </div>
            <% end %>
        <% end %>
      </div>
      <% if @stages.count > 0 %>
          <div class="click_add color-grey-9">
            <span class="color-blue_4C">+点击新建阶段</span>（选择1至多个实训项目，组成一个阶段）
          </div>
      <% end %>
  <% end %>
</div>
<div class="with35 fr pl20">
  <div class="edu-back-white mustlearn mb10">
    <p class="clearfix mb30">
      <span class="font-16">课程须知</span>
      <% if @is_member %>
          <a href="<%= edit_subject_path(@subject) %>" class="ring-green fr mt10">
            <img src="/images/educoder/icon/edit.svg" class="fl mt3 ml2">
          </a>
      <% end %>
    </p>
    <div id="subject_learning_notes" class="color-grey-6 new_li" style="margin-bottom: 20px;padding: 0px;text-align: justify;">
      <textarea name="subject[learning_notes]" style="display: none"><%= @subject.learning_notes.blank? ? "暂未填写" : @subject.learning_notes %></textarea>
    </div>
  </div>

  <% if @challenge_tags.size > 0 %>
    <% user_get_tags = user_get_tags Challenge.where(:shixun_id => @subject.shixuns.where(:status => 2).pluck(:id)).pluck(:id) %>
    <%= render :partial => "challenges/challenge_tags", :locals => {:challenge_tags => @challenge_tags, :user_get_tags => user_get_tags} %>
  <% end %>

  <% if @subject.status == 2 && @subject.stage_shixuns_count > 0 %>
  <div class="edu-back-white myProgress padding40-20 mb10">
    <p class="mb20"><span class="font-16 mr10">我的进展</span><span class="color-green" data-tip-down="获得经验值/总经验值"><%= "#{@subject.my_subject_score} / #{@subject.subject_shixun_score}" %></span></p>
    <p class="clearfix"><span class="fl color-green">已学 <%= @subject.my_subject_progress %>%</span><span class="fr color-grey-9" id="time-consuming"></span></p>
    <div class="myProgressNav"><div class="myProgressGreen" style="width: <%= @subject.my_subject_progress %>%"></div></div>
  </div>
 <% end %>
  <div class="teacherTeam edu-back-white clearfix" id="subject_members">
    <%= render :partial => "subject_members" %>
  </div>

  <% if @admin %>
      <div class="edu-back-white bor-top-greyE addTeamMember">
        <a href="<%= add_collaborators_subject_path(@subject) %>" data-remote="true" class="color-blue">
          + 添加合作者
        </a>
      </div>
  <% end %>
</div>
<script>

    /* -------------- 简介Md -------------------- */
    var shixunPro = editormd.markdownToHTML("shixuns_propaedeutics", {
        htmlDecode: "style,script,iframe",  // you can filter tags decode
        taskList: true,
        tex: true,  // 默认不解析
        flowChart: true,  // 默认不解析
        sequenceDiagram: true // 默认不解析
    });
    /* -------------- 课程须知MD -------------------- */
    var shixunPro = editormd.markdownToHTML("subject_learning_notes", {
        htmlDecode: "style,script,iframe",  // you can filter tags decode
        taskList: true,
        tex: true,  // 默认不解析
        flowChart: true,  // 默认不解析
        sequenceDiagram: true // 默认不解析
    });
    //点击新建阶段
    $(".click_add").click(function(){
        if($("#new_stage_form").length == 1){
            notice_box("请先保存正在编辑的内容");
        } else{
            var counttage = $(".lesson-saved-list-item").length + 1;
            var edithtml =
                '<%= form_for('', :url => {:controller => 'stages', :action => 'create', :subject => @subject.id}, :method => 'post', :html => {:id => 'new_stage_form'}) do |f| %>' +
                '<div class="clearfix edu-back-white bor-top-greyE pt37">' +
                '<p class="clearfix mb20 font-18 font-bd pl25 pr25">' +
                '<a href="javascript:void(0)" class="fl ring-green mr10 mt9">' +
                '<img src="/images/educoder/icon/charpter-white.svg" class="fl ml3 mt3">' +
                '</a>' +
                '第'+ counttage +'部分</p>' +
                '<div class="pl50 pr20 clearfix">' +
                '<p class="color-grey-6 font-16 mb20">章节名称</p>' +
                '<div class="df mb30">' +
                '<span class="mr30 color-orange pt10">*</span>' +
                '<div class="flex1 mr20">' +
                '<input type="text" class="input-100-45 greyInput" name="stage_name" placeholder="请输入第'+ counttage +'阶段名称">' +
                '</div>' +
                '<div style="width: 57px;"><span class="color-orange none mt8" id="stage_name_notice"><i class="fa fa-exclamation-circle mr3"></i>必填项</span></div>' +
                '</div>' +
                '<p class="color-grey-6 font-16 mb20">描述</p>' +
                '<div class="width89 mb30">' +
                '<textarea class="winput-100-130" name="stage_des"></textarea>' +
                '</div>' +
                '<p class="clearfix mb30">' +
                '<a href="<%= choose_subject_shixun_subject_path(@subject) %>" class="fl defalutGreyBorder color-grey-6" data-remote="true">' +
                '<i class="iconfont icon-tianjiafangda fl mr5"></i>选择实训</a>' +
                '<span id="sx_notice" class="fl ml20 color-grey-9 mt2">选择实训后，在页面上通过拖拽进行排序调整</span>' +
                '</p>' +
                '</div>' +
                '<div class="adding-stage-item clearfix" id="sortable"></div>' +
                '<p class="clearfix pl50 mb40">' +
                '<a href="javascript:void(0)" class="color-grey-c mr30 fl" onclick="hidden_stage_update_or_create();">取消</a>' +
                '<a href="javascript:void(0)" class="fl task-btn task-btn-orange" onclick="saveeidtsatge(this)">保存</a>' +
                '</p>' +
                '</div>' +
                '<% end %>';
            $(".lesson-edit-content").append(edithtml);
        }
    });
    //删除整个编辑部分
    function deleditstage(item){
        $("#new_stage_form").remove();
        var counttage=$(".lesson-saved-list-stage").length;
        for(var i=0;i<$(".lesson-edit-content .stage-item").length;i++){
            $(".lesson-edit-content .stage-item").eq(i).find(".stage span").html(counttage+i+1);
        }
    }

    function cancel_edit(id){
        $("#new_stage_form").parent().remove();
        $("#stage_div_" + id).show();
    }

    //保存
    function saveeidtsatge(){
        //判断是否输入阶段名称
        var status = true;
        var stagename= $("input[name='stage_name']").val().trim();
        if(stagename==""){
            status = false;
            $("#stage_name_notice").show();
        } else{
            $("#stage_name_notice").hide();
        }
        if(status && flag){
            flag = false;
            $("#new_stage_form").submit();
        }
    }

    function edit_stage(id){
        if($("#new_stage_form").length == 1){
            notice_box("请先保存正在编辑的内容");
        } else{
            $.ajax({
                url: "/stages/" + id +"/edit",
                dataType: "script",
                success:function(){
                    $("#sortable1").sortable({containment:".ui-sortable"});
                    $("#sortable1").disableSelection();
                }
            });
        }
    }

    //缩放章节实训
    function for_paragraph(item){
        $(item).parent("p").siblings(".detail_for_paragraph").slideToggle(500);
    }

    function hidden_stage_update_or_create(){
        $("#new_stage_form").remove();
    }

    function formatDuring(time){
        console.log(time)
        var days = parseInt(time / (60 * 60 * 24));
        var hours = parseInt((time % (60 * 60 * 24)) / (60 * 60));
        var minutes = parseInt((time % (60 * 60 * 24) % (60 * 60))/ ( 60));
        var seconds = parseInt((time % (60 * 60 * 24) % (60 * 60)) % (60));
        $("#time-consuming").html("耗时：" + days + " 天 " + hours + " 小时 " + minutes + " 分钟 " + seconds + " 秒 ");
    }

    window.onload=function(){
        formatDuring(<%= @subject.my_consume_time %>)
    }
</script>