* updated 'indicator/templates/indicator/NewDeleteIndex.html':

  o page_condition: "all", "category", "search"
  o make use of django templates to generate contents
* updated 'indicator.views': GET, POST methods for NewDeleteIndex page
* indicator.search_indexes: changed 'categories' to 'categories_id'

4 files changed, 111 insertions, 290 deletions

diff --git a/97suifangqa/apps/indicator/search_indexes.py b/97suifangqa/apps/indicator/search_indexes.py
index b7a8437..67d5723 100644
--- a/97suifangqa/apps/indicator/search_indexes.py
+++ b/97suifangqa/apps/indicator/search_indexes.py
@@ -33,7 +33,7 @@ class IndicatorIndex(indexes.SearchIndex, indexes.Indexable):
     text = indexes.CharField(document=True, use_template=True)
     addByUser = indexes.CharField(model_attr='addByUser')
     dataType = indexes.CharField(model_attr='dataType')
-    categories = indexes.MultiValueField()
+    categories_id = indexes.MultiValueField()
 
     def get_model(self):
         return im.Indicator
diff --git a/97suifangqa/apps/indicator/templates/indicator/NewDeleteIndex.html b/97suifangqa/apps/indicator/templates/indicator/NewDeleteIndex.html
index 8fd3e4c..c2a219a 100644
--- a/97suifangqa/apps/indicator/templates/indicator/NewDeleteIndex.html
+++ b/97suifangqa/apps/indicator/templates/indicator/NewDeleteIndex.html
@@ -79,7 +79,7 @@
       <div class="index_container">
         <!-- 所有的展示 -->
         <!-- 若url的参数tab 为 all， 则把该div的 display style 设为block； 不然，则设为none -->
-        <div class="all_condition" style="display: block;">
+        <div class="all_condition" style="display: {% if page_condition == "all" %}block{% else %}none{% endif %};">
           <div class="index_all_title">所有指标</div>
           <div class="index_all_letter">
             <div>A</div>
@@ -110,10 +110,13 @@
             <div>Z</div>
           </div> <!-- end: index_all_letter -->
           <div style="clear:both;"></div>
+          {# display all indicators if in 'all' condition #}
+          {# NOTE: 'indicators' is in 'P[inyin] dict format #}
+          {% if page_condition == "all" %}
           <div class="index_letter_container">
-            {# display all indicator by letter index #}
+            {# display all indicators by letter index #}
             {% for l in letters %}
-              {% with l_inds=indicators_pdict|dict_get:l %}
+              {% with l_inds=indicators|dict_get:l %}
                 {% if l_inds|length >= 1 %}
                   <div class="index_lines {{ l|upper }}">
                     <div class="letter_title">{{ l|upper }}</div>
@@ -128,267 +131,56 @@
                   </div>
                 {% endif %}
               {% endwith %}
-            {% endfor %}
-            {# end: display all indicator #}
-
-            {% comment %}{# vim: {{{ #}
-            <!-- begin: index_lines: [A-Z] -->
-            <div class="index_lines A">
-              <div class="letter_title">A</div>
-              <div class="index_line" index_id="1">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines B">
-              <div class="letter_title">B</div>
-              <div class="index_line" index_id="2">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines C">
-              <div class="letter_title">C</div>
-              <div class="index_line" index_id="3">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines D">
-              <div class="letter_title">D</div>
-              <div class="index_line" index_id="4">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines E">
-              <div class="letter_title">E</div>
-              <div class="index_line" index_id="5">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines F">
-              <div class="letter_title">F</div>
-              <div class="index_line" index_id="6">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines G">
-              <div class="letter_title">G</div>
-              <div class="index_line" index_id="7">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines H">
-              <div class="letter_title">H</div>
-              <div class="index_line" index_id="8">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines I">
-              <div class="letter_title">I</div>
-              <div class="index_line" index_id="9">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines J">
-              <div class="letter_title">J</div>
-              <div class="index_line" index_id="10">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines K">
-              <div class="letter_title">K</div>
-              <div class="index_line" index_id="11">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines L">
-              <div class="letter_title">L</div>
-              <div class="index_line" index_id="12">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines M">
-              <div class="letter_title">M</div>
-              <div class="index_line" index_id="13">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines N">
-              <div class="letter_title">N</div>
-              <div class="index_line" index_id="14">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines O">
-              <div class="letter_title">O</div>
-              <div class="index_line" index_id="15">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines P">
-              <div class="letter_title">P</div>
-              <div class="index_line" index_id="16">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines Q">
-              <div class="letter_title">Q</div>
-              <div class="index_line" index_id="17">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines R">
-              <div class="letter_title">R</div>
-              <div class="index_line" index_id="18">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines S">
-              <div class="letter_title">S</div>
-              <div class="index_line" index_id="19">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines T">
-              <div class="letter_title">T</div>
-              <div class="index_line" index_id="20">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines U">
-              <div class="letter_title">U</div>
-              <div class="index_line" index_id="21">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines V">
-              <div class="letter_title">V</div>
-              <div class="index_line" index_id="22">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines W">
-              <div class="letter_title">W</div>
-              <div class="index_line" index_id="23">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines X">
-              <div class="letter_title">X</div>
-              <div class="index_line" index_id="24">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines Y">
-              <div class="letter_title">Y</div>
-              <div class="index_line" index_id="25">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
-                <div class="icon"></div>
-                <div style="clear:both"></div>
-              </div>
-            </div>
-            <div class="index_lines Z">
-              <div class="letter_title">Z</div>
-              <div class="index_line" index_id="26">
-                <div class="index_name">乙肝病毒表面抗原</div>
-                <div class="index_category">两对半</div>
+            {% endfor %} {# end: display all indicators #}
+          </div> <!-- end: index_letter_container -->
+          {% endif %} {# end: page_condition == all #}
+        </div> <!-- end: all_condition -->
+        
+        <!-- category view, 点击"指标类型"页面的左侧显示 -->
+        <!-- 如若kw参数为空，且tab不等于all（即点击指标类型后的页面），则把 <div class="index_category">XXXX</div> 隐藏掉即可 -->
+        {# page_condition == "category" #}
+        <div class="category_condition" style="display: {% if page_condition == "category" %}block{% else %}none{% endif %};">
+          <div class="index_title_container">
+            <div class="index_title">{{ selected_category.name }}</div>
+            <div class="example_sheet">仿真化验单</div>
+            <div style="clear:both;"></div>
+          </div>
+          <!-- list of indicators of the category -->
+          <div class="index_lines left">
+            {% for ind in indicators %}
+              <div class="index_line" index_id="{{ ind.id }}">
+                <div class="index_name">{{ ind.name }}</div>
+                <div class="index_category"></div>
                 <div class="icon"></div>
                 <div style="clear:both"></div>
               </div>
-            </div>
-            <!-- end: index_lines: [A-Z] -->
-            {% endcomment %}{# vim: }}} #}
+            {% endfor %}
+          </div> <!-- end: index_lines left -->
+        </div> <!-- end: category_condition -->
 
-          </div> <!-- end: index_letter_container -->
-        </div> <!-- end: all_condition -->
-        
         <!-- 搜索后左边的展示 -->
         <!-- 若url的参数tab 不等于 all，或者 url的参数 kw 不为空，则把该div的 display设置为block；不然，则设为none -->
-        <div class="search_condition" style="display: none;">
+        {# page_condition == "search" #}
+        <div class="search_condition" style="display: {% if page_condition == "search" %}block{% else %}none{% endif %};">
           <div class="index_title_container">
             <div class="index_title">搜索指标</div>
             <div class="example_sheet">仿真化验单</div>
             <div style="clear:both;"></div>
           </div>
+          <!-- list of indicators returned by search -->
           <div class="index_lines left">
-            <!-- 如若kw参数为空，且tab不等于all（即点击指标类型后的页面），则把 <div class="index_category">XXXX</div> 隐藏掉即可 -->
-            <div class="index_line" index_id="1">
-              <div class="index_name">乙肝病毒表面抗原</div>
-              <div class="index_category">两对半</div>
-              <div class="icon"></div>
-              <div style="clear:both"></div>
-            </div>
+            {# 'indicators': list made up by the dumps of indicator #}
+            {% for ind in indicators %}
+              <!-- TODO -->
+              <div class="index_line" index_id="{{ ind|dict_get:"id" }}">
+                <div class="index_name">{{ ind|dict_get:"name" }}</div>
+                <div class="index_category">
+                  <a href="?tab={{ ind|dict_get:"categories_id"|first }}">{{ ind|dict_get:"categories_name"|first }}</a>
+                </div>
+                <div class="icon"></div>
+                <div style="clear:both"></div>
+              </div>
+            {% endfor %}
             <div class="index_line" index_id="2">
               <div class="index_name">乙肝病毒S蛋白定量</div>
               <div class="index_category">血常规</div>
@@ -401,33 +193,10 @@
               <div class="icon"></div>
               <div style="clear:both"></div>
             </div>
-            <div class="index_line" index_id="4">
-              <div class="index_name">乙肝病毒e抗原</div>
-              <div class="index_category">两对半</div>
-              <div class="icon"></div>
-              <div style="clear:both"></div>
-            </div>
-            <div class="index_line" index_id="5">
-              <div class="index_name">乙肝病毒e抗体</div>
-              <div class="index_category">两对半</div>
-              <div class="icon"></div>
-              <div style="clear:both"></div>
-            </div>
-            <div class="index_line" index_id="6">
-              <div class="index_name">乙肝病毒核心抗体IaM</div>
-              <div class="index_category">两对半</div>
-              <div class="icon"></div>
-              <div style="clear:both"></div>
-            </div>
-            <div class="index_line" index_id="7">
-              <div class="index_name">乙肝病毒核算定量（PCR）</div>
-              <div class="index_category">血常规</div>
-              <div class="icon"></div>
-              <div style="clear:both"></div>
-            </div>
-          </div>
-        </div>
-      </div>
+          </div> <!-- end: index_lines left -->
+        </div> <!-- end: search_condition -->
+      </div> <!-- end: index_container -->
+
       <div class="add_concerned_icon"></div>
       <div class="index_container">
         <div class="index_title_container">
diff --git a/97suifangqa/apps/indicator/templates/indicator/test.html b/97suifangqa/apps/indicator/templates/indicator/test.html
index 65340b9..d7b349f 100644
--- a/97suifangqa/apps/indicator/templates/indicator/test.html
+++ b/97suifangqa/apps/indicator/templates/indicator/test.html
@@ -13,7 +13,12 @@
         <li>{{ l }}</li>
         <ul>
         {% for i in indicators %}
-          <li>id: {{ i|dict_get:"id" }}; name: {{ i|dict_get:"name" }}</li>
+          <li>
+          id: {{ i|dict_get:"id" }};
+          name: {{ i|dict_get:"name" }};
+          category_id: {{ i|dict_get:"categories_id"|first }};
+          category_name: {{ i|dict_get:"categories_name"|first }};
+          </li>
         {% endfor %}
         </ul>
       {% endif %}
@@ -27,6 +32,13 @@
     <li>id: {{ fi|dict_get:"id" }}; name: {{ fi|dict_get:"name" }}</li>
   {% endfor %}
   </ul>
+
+  <h3>ul 3</h3>
+  <ul>
+    {% for i in list %}
+      <li>i</li>
+    {% endfor %}
+  </ul>
 </body>
 </html>
 
diff --git a/97suifangqa/apps/indicator/views.py b/97suifangqa/apps/indicator/views.py
index 8f2cf88..f222d10 100644
--- a/97suifangqa/apps/indicator/views.py
+++ b/97suifangqa/apps/indicator/views.py
@@ -456,6 +456,11 @@ def indicator_status(request):
 def follow_indicator(request):
     """
     follow/unfollow indicator
+
+    Note:
+    * when 'page_condition == all',
+      indicators -> indicators_pdict, in 'P[inyin] dict' format
+    * other 'page_condition', 'indicators' a object list
     """
     template = 'indicator/NewDeleteIndex.html'
     letters = map(chr, range(ord('a'), ord('z')+1))
@@ -463,6 +468,9 @@ def follow_indicator(request):
     # get 7 categories (page can only contains 1+7 categories)
     categories = im.IndicatorCategory.objects.all().\
             order_by('id')[:7]
+    # set default value for 'selected_cat*'
+    selected_catid = None
+    selected_category = None
     # get indicators, P[inyin] dict format
     indicators_pdict = get_indicator()
     # get followed indicator, P[inyin] dict format
@@ -472,22 +480,51 @@ def follow_indicator(request):
     for l in letters:
         followed_indicators += followed_indicators_pdict[l]
 
-    # selected category, default "all"
-    if request.GET.get('tab'):
-        selected_catid = request.GET.get('tab')
-        if selected_catid != "all":
-            selected_catid = int(selected_catid)
+    # get/post views
+    if request.method == 'GET':
+        if request.GET.get('tab'):
+            # tab: selected category, default "all"
+            selected_catid = request.GET.get('tab')
+            if selected_catid == "all":
+                page_condition = "all"
+                indicators = indicators_pdict
+            else:
+                selected_catid = int(selected_catid)
+                selected_category = get_object_or_404(
+                        im.IndicatorCategory, id=selected_catid)
+                page_condition = "category"
+                # get indicators of the category
+                indicators = selected_category.indicators.\
+                        all().order_by('pinyin')
+        elif request.GET.get('kw'):
+            # kw: search keyword to find indicator
+            search_kw = request.GET.get('kw')
+            page_condition = "search"
+            # TODO
+            indicators = []
+        else:
+            # default page_condition: "all"
+            selected_catid = "all"
+            page_condition = "all"
+            indicators = indicators_pdict
+    elif request.method == 'POST':
+        # do post process
+        # TODO
+        pass
     else:
-        selected_catid = "all"
+        # XXX
+        raise Http404
 
     data = {
+        'page_condition': page_condition,
         'categories': categories,
+        'selected_category': selected_category,
         'selected_catid': selected_catid,
         'letters': letters,
-        'indicators_pdict': indicators_pdict,
+        'indicators': indicators,
         'followed_indicators': followed_indicators,
     }
-
+    # render page
     return render(request, template, data)
 # }}}
 
@@ -644,13 +681,16 @@ def test_view(request, **kwargs):
     followed_indicators_pdict = get_followed_indicator(request.user.id)
     # convert to list
     followed_indicators = []
-    for l in letters:
+    for l in all_letters:
         followed_indicators += followed_indicators_pdict[l]
 
+    list = []
+
     data = {
         'all_letters': all_letters,
         'all_indicators': all_indicators,
         'followed_indicators': followed_indicators,
+        'list': list,
     }
     return render(request, template, data)