unserver-unify/src/app/course/knowledge/knowledgescate.html

<!-- <div class="col-md-12 " ng-controller="KnowledgesCtrl as ctrl">
  <div class="panel profile" style="background: transparent;">
    <div class="panel-heading overflow-h">
      <h2 class="panel-title heading-sm pull-left" style="width: 50%">
        {{ 'Knowledges' | translate }} {{ (ctrl.practice.name)?' - '+ctrl.practice.name:''}}
      </h2>
      <p class="quick_info">
        {{ 'Skills' | translate }}:
        <span>
          {{ctrl.Knowledges.length}}&nbsp;&nbsp;
        </span>
        {{ 'Questions' | translate }}:
        <span>
          {{ctrl.totalq}}&nbsp;&nbsp;
        </span>
        {{ 'Scores' | translate }}:
        <span>
          {{ctrl.totalscore|number:0}}
        </span>
      </p>
    </div>
    <div class="panel-body knowledge_node">
      <div class="row">
        <div class="row">
          <div class="col-md-12">
            <ol id="tree-root" class="column_2" ng-model="ctrl.Knowledges" style="padding:0; padding-left: 0.5%;">
              <li class="list-group-item node_container" ng-if="node.key" ng-include="'app/course/knowledge/node.html'" ng-repeat="node in ctrl.Knowledges">
              </li>
            </ol>
          </div>
        </div>
      </div>
    </div>
  </div>
</div> -->

<div ng-controller="KnowledgesCateCtrl as ctrl">
  <div class="category_filter" ng-class="{'t6_category' : loginService.school.theme=='t6'}">
    <div class="container relative">
      <ul class="relative">
        <li ng-class="{'current' :(ctrl.breadKrumKey.length!=0&&ctrl.breadKrumKey[ctrl.breadKrumKey.length-1]==key) }" ng-repeat="(key, value) in ctrl.topCate" ng-if="$index < 8" ng-click="ctrl.headerCateSearch(key)">
          <a href="javascript:void(0);">{{ key }}</a>
        </li> 
      </ul>
        <!-- <li ng-repeat="key in ctrl.topCate | limitTo:8">
          <a href="">{{ key }}</a>
        </li>  -->     
        <div class="category_list_more">
          <a href=""><i class="fa fa-ellipsis-v"></i></a>
          <ul>
            <li ng-repeat="(key, value) in ctrl.topCate" ng-click="ctrl.headerCateSearch(key)" class="transition">
              <a href="">{{ key }}</a>
            </li>
          </ul>
        </div>
    </div>
  </div>
  <div class="container">
    <ul class="category_breadcrumb">
      <li>
        <a ng-if="ctrl.breadKrumKey.length!=0" style="cursor: pointer;" ng-click="ctrl.allCategory()" translate="">Knowledge Level - All</a>
        <span ng-if="ctrl.breadKrumKey.length==0" translate="">Knowledge Level - All</span>
      </li>
      <li style="cursor: pointer;" ng-repeat="key in ctrl.breadKrumKey" ng-click="ctrl.breadSearch($index)">
        <a ng-if="$index!=(ctrl.breadKrumKey.length-1)">{{ key }}</a>
        <span ng-if="$index==(ctrl.breadKrumKey.length-1)">{{ key }}</span>
      </li>
    </ul>
    <div class="tab-content">
      <div class="row category_courselist category_list">
          <div class="col-lg-12">
            <div class="overview_category" ng-if="ctrl.cateQuestCount">
              <h3 class="text-center">{{ ctrl.breadKrumKey[ctrl.breadKrumKey.length-1] }}</h3>
              <h4 class="overview_correct">
                <span class="coverage" ng-class="{'color-green':ctrl.catResult.correctRate>70,'color-orange':ctrl.catResult.correctRate>30&&ctrl.catResult.correctRate<=70,'color-red':ctrl.catResult.correctRate<=30 || !ctrl.catResult.correctRate}">
                  {{'Correct' | translate}} ({{ ((ctrl.catResult.correctRate)?ctrl.catResult.correctRate:0)|number:2 }} %)
                </span>
              </h4>
              <h4 class="overview_coverage">
                <span class="coverage" ng-class="{'color-blue':ctrl.catResult.completeRate>70,'color-orange':ctrl.catResult.completeRate>30&&ctrl.catResult.completeRate<=70,'color-red':ctrl.catResult.completeRate<=30}">
                  &nbsp;{{'Coverage' | translate}} ({{ ctrl.catResult.qs || 0 }} / {{ ctrl.cateQuestCount }})
                </span>
              </h4>
            </div>
            <div class="clearfix"></div>
            <div class="col-inline">
              <div class="col-md-2 col-sm-3 col-xs-4 padding-left-0 padding-right-8" ng-if="ctrl.cateQuestCount" ng-click="ctrl.gotoLearn()">
                <div class="home_category knowledge_level2" style="background: url('{{ ctrl.defaultpic }}') no-repeat center center; background-size: cover;">
                  <i class="fa fa-book"></i>
                  <div class="category_content">                  
                    <h4>
                      {{'Learn' | translate}}
                    </h4>
                  </div>
                </div>
              </div>
              <div class="col-md-2 col-sm-3 col-xs-4 padding-left-0 padding-right-8" ng-if="ctrl.cateQuestCount" ng-click="ctrl.gotoPractise()">
                <div class="home_category knowledge_level3" style="background: url('{{ ctrl.defaultpic }}') no-repeat center center; background-size: cover;">
                  <i class="fa fa-pencil-square-o"></i>
                  <div class="category_content">                  
                    <h4>
                      {{'Practice' | translate}}
                    </h4>
                  </div>
                </div>
              </div>
              <div class="col-md-2 col-sm-3 col-xs-4 padding-left-0 padding-right-8" ng-click="ctrl.gotoTest()" ng-if="ctrl.cateQuestCount">
                <div class="home_category knowledge_level4" style="background: url('{{ ctrl.defaultpic }}') no-repeat center center; background-size: cover;">
                  <i class="fa fa fa-check-square-o"></i>
                  <div class="category_content">                  
                    <h4>
                      {{ {eng:'Quiz',chn:'测验'} | trans }}
                    </h4>
                  </div>
                </div>
              </div>
              <hr ng-if="ctrl.Knowledges.length!=0 && ctrl.cateQuestCount">
              <div class="col-md-2 col-sm-3 col-xs-4 padding-left-0 padding-right-8" ng-repeat="cat in ctrl.Knowledges" ng-click="ctrl.searchCategory(cat.key)">
                <div class="home_category knowledge_level" ng-class="{'knowledge-green':cat.correctRate>80,'knowledge-yellow':cat.correctRate>60&&cat.correctRate<=80,'knowledge-orange':cat.correctRate<=60 && cat.qs!=0,'knowledge-gray':cat.qs==0}">
                  <div class="category_content">
                    <h4>
                      <span class="knldg_crct">{{ cat.correctRate|number:1 }}<span class="font-11">%</span></span>
                      {{ cat.key }}
                    </h4>
                    <div>
                      <span class="font-11 pull-right">{{ cat.qs }} / {{ ctrl.counters[cat.key] || 0 }} {{'Covered' | translate}}</span>
                      <div class="clearfix"></div>
                      <div class="progress progress-u progress-xs">
                        <div aria-valuemax="100" aria-valuemin="0" aria-valuenow="{{cat.qs / ctrl.counters[cat.key] * 100}}" class="progress-bar progress-bar-info" role="progressbar" style="width: {{cat.qs / ctrl.counters[cat.key] * 100 }}%; float: left; height: 5px;">
                        </div>
                      </div>
                    </div>
                    <div class="cat_info">
                      <p><b>{{ {eng:'Skills',chn:'下级知识点数'} | trans }}: </b> {{ cat.items.length || 0 }}</p>
                      <p><b>{{ {eng:'Questions',chn:'问题数'} | trans }}: </b> {{ (ctrl.counters[cat.key])?ctrl.counters[cat.key]:0 }}</p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
      </div>
      <div class="clearfix"></div>
    <div class="col-md-12 no_record" translate="" ng-if="ctrl.Knowledges.length==0&&!ctrl.cateQuestCount">
      No Record
    </div>    
    <div class="clearfix">
    </div>    
    </div>
  </div>
</div>