* updated 'indicator.views' for front pages

* use 'render' instead of 'render_to_response'
* updated 'indicator/templates/indicator/NewDeleteIndex.html' to
  show all indicators and followed indicators

2 files changed, 498 insertions, 407 deletions

diff --git a/97suifangqa/apps/indicator/templates/indicator/NewDeleteIndex.html b/97suifangqa/apps/indicator/templates/indicator/NewDeleteIndex.html
index 29c15d0..8fd3e4c 100644
--- a/97suifangqa/apps/indicator/templates/indicator/NewDeleteIndex.html
+++ b/97suifangqa/apps/indicator/templates/indicator/NewDeleteIndex.html
@@ -1,5 +1,6 @@
 {% extends "base.html" %}
 {% load static from staticfiles %}
+{% load dict_get %}
 
 {% block title %}
 指标状态 | 随访工具 | 97 随访
@@ -31,416 +32,473 @@
 
 {% block page %}
   <!--
-	<iframe align="left" width="420" height="720" src="SideBar.html" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
+  <iframe align="left" width="420" height="720" src="SideBar.html" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
   -->
   <iframe align="left" width="420" height="720" src="{% url indicator_sidebar %}" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
-	<div id="new_delete_container">
-		<div class="new_delete_title">
-			<div class="content">添加或删除关注指标</div>
-			<div class="search">
-				<input type="text" value="" placeholder="直接搜索指标" id="search_kw" autocomplete="off" />
+
+  {% comment %}
+    Description:
+    index -> Indicator
+    tab   -> IndicatorCategory
+  {% endcomment %}
+
+  <div id="new_delete_container">
+    <div class="new_delete_title">
+      <div class="content">添加或删除关注指标</div>
+      <div class="search">
+        <input type="text" value="" placeholder="直接搜索指标" id="search_kw" autocomplete="off" />
         <img id="search_btn" src="{% static "images/search.png" %}">
-			</div>
-			<div style="clear: both;"></div>
-		</div>
-		<div class="index_navigation">
-			<!-- 根据url的参数tab，给对应div的class加 selected 样式 -->
-			<div class="index_type selected"><a href="?tab=1">血常规</a></div>
-			<div class="index_type"><a href="?tab=2">两对半</a></div>
-			<div class="index_type"><a href="?tab=3">肝功能</a></div>
-			<div class="index_type"><a href="?tab=4">肝穿刺</a></div>
-			<div class="index_type"><a href="?tab=5">血常规</a></div>
-			<div class="index_type"><a href="?tab=6">两对半</a></div>
-			<div class="index_type"><a href="?tab=7">肝功能</a></div>
-			<div class="index_type" id="index_all"><a href="?tab=all">所有指标</a></div>
-			<div style="clear:both;"></div>
-		</div>
-		<div class="show_indexes">
-			<div class="index_container">
-				<!-- 所有的展示 -->
-				<!-- 若url的参数tab 为 all， 则把该div的 display style 设为block； 不然，则设为none -->
-				<div class="all_condition" style="display: block;">
-					<div class="index_all_title">所有指标</div>
-					<div class="index_all_letter">
-						<div>A</div>
-						<div>B</div>
-						<div>C</div>
-						<div>D</div>
-						<div>E</div>
-						<div>F</div>
-						<div>G</div>
-						<div>H</div>
-						<div>I</div>
-						<div>J</div>
-						<div>K</div>
-						<div>L</div>
-						<div>M</div>
-						<div>N</div>
-						<div>O</div>
-						<div>P</div>
-						<div>Q</div>
-						<div>R</div>
-						<div>S</div>
-						<div>T</div>
-						<div>U</div>
-						<div>V</div>
-						<div>W</div>
-						<div>X</div>
-						<div>Y</div>
-						<div>Z</div>
-					</div>
-					<div style="clear:both;"></div>
-					<div class="index_letter_container">
-						<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>
-								<div class="icon"></div>
-								<div style="clear:both"></div>
-							</div>
-						</div>
-					</div>
-				</div>
-				
-				<!-- 搜索后左边的展示 -->
-				<!-- 若url的参数tab 不等于 all，或者 url的参数 kw 不为空，则把该div的 display设置为block；不然，则设为none -->
-				<div class="search_condition" style="display: none;">
-					<div class="index_title_container">
-						<div class="index_title">搜索指标</div>
-						<div class="example_sheet">仿真化验单</div>
-						<div style="clear:both;"></div>
-					</div>
-					<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>
-						<div class="index_line" index_id="2">
-							<div class="index_name">乙肝病毒S蛋白定量</div>
-							<div class="index_category">血常规</div>
-							<div class="icon"></div>
-							<div style="clear:both"></div>
-						</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 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 class="add_concerned_icon"></div>
-			<div class="index_container">
-				<div class="index_title_container">
-					<div class="index_title">已关注指标</div>
-					<div class="index_btn">
-						<form id="index_form" method="post" action="">
-							<input type="button" id="submitIndexBtn" value="提交" />
-							<input type="hidden" id="commit_index" name="commit_index" value="" />
-						</form>
-					</div>
-					<div style="clear:both;"></div>
-				</div>
-				<div class="index_lines right">
-					<div class="index_line" index_id="1">
-						<div class="index_name">V-谷丙氨酰转氨酶</div>
-						<div class="icon"></div>
-						<div style="clear:both"></div>
-					</div>
-					<div class="index_line" index_id="2">
-						<div class="index_name">总胆红素</div>
-						<div class="icon"></div>
-						<div style="clear:both"></div>
-					</div>
-					<div class="index_line" index_id="3">
-						<div class="index_name">乙肝病毒表面抗原</div>
-						<div class="icon"></div>
-						<div style="clear:both"></div>
-					</div>
-					<div class="index_line" index_id="4">
-						<div class="index_name">乙肝病毒表面抗体</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="icon"></div>
-						<div style="clear:both"></div>
-					</div>
-					<div class="index_line" index_id="6">
-						<div class="index_name">乙肝病毒核算定量（PCR）</div>
-						<div class="icon"></div>
-						<div style="clear:both"></div>
-					</div>
-					<div class="index_line" index_id="7">
-						<div class="index_name">乙肝病毒基因型C型</div>
-						<div class="icon"></div>
-						<div style="clear:both"></div>
-					</div>
-					<div class="index_line" index_id="8">
-						<div class="index_name">乙肝病毒型混合型</div>
-						<div class="icon"></div>
-						<div style="clear:both"></div>
-					</div>
-				</div>
-			</div>
-			<div style="clear:both;"></div>
-		</div>
-	</div>
+      </div>
+      <div style="clear: both;"></div>
+    </div>
+    <div class="index_navigation">
+      <!-- 根据url的参数tab，给对应div的class加 selected 样式 -->
+      <!--
+      <div class="index_type selected" id="index_all"><a href="?tab=all">所有指标</a></div>
+      <div class="index_type"><a href="?tab=1">血常规</a></div>
+      <div class="index_type"><a href="?tab=2">两对半</a></div>
+      <div class="index_type"><a href="?tab=3">肝功能</a></div>
+      <div class="index_type"><a href="?tab=4">肝穿刺</a></div>
+      <div class="index_type"><a href="?tab=5">血常规</a></div>
+      <div class="index_type"><a href="?tab=6">两对半</a></div>
+      <div class="index_type"><a href="?tab=7">肝功能</a></div>
+      -->
+      <!-- 所有指标 -->
+      <div class="index_type {% if selected_catid == "all" %}selected{% endif %}">
+        <a href="?tab=all">所有指标</a>
+      </div>
+      <!-- 指标类别，页面只能容纳 7 个 -->
+      {% for cat in categories %}
+      <div class="index_type {% if selected_catid == cat.id %}selected{% endif %}">
+        <a href="?tab={{ cat.id }}">{{ cat.name }}</a>
+      </div>
+      {% endfor %}
+      <div style="clear:both;"></div>
+    </div>
+    <div class="show_indexes">
+      <div class="index_container">
+        <!-- 所有的展示 -->
+        <!-- 若url的参数tab 为 all， 则把该div的 display style 设为block； 不然，则设为none -->
+        <div class="all_condition" style="display: block;">
+          <div class="index_all_title">所有指标</div>
+          <div class="index_all_letter">
+            <div>A</div>
+            <div>B</div>
+            <div>C</div>
+            <div>D</div>
+            <div>E</div>
+            <div>F</div>
+            <div>G</div>
+            <div>H</div>
+            <div>I</div>
+            <div>J</div>
+            <div>K</div>
+            <div>L</div>
+            <div>M</div>
+            <div>N</div>
+            <div>O</div>
+            <div>P</div>
+            <div>Q</div>
+            <div>R</div>
+            <div>S</div>
+            <div>T</div>
+            <div>U</div>
+            <div>V</div>
+            <div>W</div>
+            <div>X</div>
+            <div>Y</div>
+            <div>Z</div>
+          </div> <!-- end: index_all_letter -->
+          <div style="clear:both;"></div>
+          <div class="index_letter_container">
+            {# display all indicator by letter index #}
+            {% for l in letters %}
+              {% with l_inds=indicators_pdict|dict_get:l %}
+                {% if l_inds|length >= 1 %}
+                  <div class="index_lines {{ l|upper }}">
+                    <div class="letter_title">{{ l|upper }}</div>
+                    {% for ind in l_inds %}
+                      <div class="index_line" index_id="{{ ind|dict_get:"id" }}">
+                        <div class="index_name">{{ ind|dict_get:"name" }}</div>
+                        <div class="index_category"></div>
+                        <div class="icon"></div>
+                        <div style="clear:both"></div>
+                      </div>
+                    {% endfor %}
+                  </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>
+                <div class="icon"></div>
+                <div style="clear:both"></div>
+              </div>
+            </div>
+            <!-- end: index_lines: [A-Z] -->
+            {% endcomment %}{# vim: }}} #}
+
+          </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;">
+          <div class="index_title_container">
+            <div class="index_title">搜索指标</div>
+            <div class="example_sheet">仿真化验单</div>
+            <div style="clear:both;"></div>
+          </div>
+          <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>
+            <div class="index_line" index_id="2">
+              <div class="index_name">乙肝病毒S蛋白定量</div>
+              <div class="index_category">血常规</div>
+              <div class="icon"></div>
+              <div style="clear:both"></div>
+            </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 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 class="add_concerned_icon"></div>
+      <div class="index_container">
+        <div class="index_title_container">
+          <div class="index_title">已关注指标</div>
+          <div class="index_btn">
+            <form id="index_form" method="post" action="">
+              {% csrf_token %}
+              <input type="button" id="submitIndexBtn" value="提交" />
+              <input type="hidden" id="commit_index" name="commit_index" value="" />
+            </form>
+          </div>
+          <div style="clear:both;"></div>
+        </div>
+        <div class="index_lines right">
+          <!-- followed indicators for logged in user -->
+          {% for fi in followed_indicators %}
+            <div class="index_line" index_id="{{ fi|dict_get:"id" }}">
+              <div class="index_name">{{ fi|dict_get:"name" }}</div>
+              <div class="icon"></div>
+              <div style="clear:both"></div>
+            </div>
+          {% endfor %}
+
+          {% comment %}{# vim: {{{ #}
+          <div class="index_line" index_id="1">
+            <div class="index_name">V-谷丙氨酰转氨酶</div>
+            <div class="icon"></div>
+            <div style="clear:both"></div>
+          </div>
+          <div class="index_line" index_id="2">
+            <div class="index_name">总胆红素</div>
+            <div class="icon"></div>
+            <div style="clear:both"></div>
+          </div>
+          <div class="index_line" index_id="3">
+            <div class="index_name">乙肝病毒表面抗原</div>
+            <div class="icon"></div>
+            <div style="clear:both"></div>
+          </div>
+          <div class="index_line" index_id="4">
+            <div class="index_name">乙肝病毒表面抗体</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="icon"></div>
+            <div style="clear:both"></div>
+          </div>
+          <div class="index_line" index_id="6">
+            <div class="index_name">乙肝病毒核算定量（PCR）</div>
+            <div class="icon"></div>
+            <div style="clear:both"></div>
+          </div>
+          <div class="index_line" index_id="7">
+            <div class="index_name">乙肝病毒基因型C型</div>
+            <div class="icon"></div>
+            <div style="clear:both"></div>
+          </div>
+          <div class="index_line" index_id="8">
+            <div class="index_name">乙肝病毒型混合型</div>
+            <div class="icon"></div>
+            <div style="clear:both"></div>
+          </div>
+          {% endcomment %}{# vim: }}} #}
+        </div> <!-- end: index_lines right -->
+
+      </div>
+      <div style="clear:both;"></div>
+    </div>
+  </div>
 {% endblock page %}
 
 {# vim: set ts=2 sw=2 tw=0 fenc=utf-8 ft=htmldjango.html: #}
diff --git a/97suifangqa/apps/indicator/templates/indicator/test.html b/97suifangqa/apps/indicator/templates/indicator/test.html
new file mode 100644
index 0000000..65340b9
--- /dev/null
+++ b/97suifangqa/apps/indicator/templates/indicator/test.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+{% load dict_get %}
+<html>
+<head>
+  <title>Test</title>
+</head>
+<body>
+  <h3>ul 1</h3>
+  <ul>
+  {% for l in all_letters %}
+    {% with indicators=all_indicators|dict_get:l %}
+      {% if indicators|length >= 1 %}
+        <li>{{ l }}</li>
+        <ul>
+        {% for i in indicators %}
+          <li>id: {{ i|dict_get:"id" }}; name: {{ i|dict_get:"name" }}</li>
+        {% endfor %}
+        </ul>
+      {% endif %}
+    {% endwith %}
+  {% endfor %}
+  </ul>
+
+  <h3>ul 2</h3>
+  <ul>
+  {% for fi in followed_indicators %}
+    <li>id: {{ fi|dict_get:"id" }}; name: {{ fi|dict_get:"name" }}</li>
+  {% endfor %}
+  </ul>
+</body>
+</html>
+
+<!-- vim: set ts=8 sw=2 tw=0 fenc= ft=htmldjango.html: -->