auto redraw chart when:

* added new record
* modified record data/date
* deleted record

EditHistoryData page:
* added 'delete button' (#delete_btn)
* added 'indicator.views.ajax_delete_record()'
* updated css style for delete button
* updated css style for record 'state'

* added check for 'unit' when save 'IndicatorRecord'

5 files changed, 128 insertions, 33 deletions

diff --git a/97suifangqa/apps/indicator/static/css/edit_history_data.css b/97suifangqa/apps/indicator/static/css/edit_history_data.css
index 0209ca7..e1caa9f 100644
--- a/97suifangqa/apps/indicator/static/css/edit_history_data.css
+++ b/97suifangqa/apps/indicator/static/css/edit_history_data.css
@@ -94,12 +94,23 @@ input[type="radio"]:checked + label {
 }
 .edit_history_data_content .edit_data .state .normal {
 	background-color: #B8DB70;
+	padding: 2px;
 }
 .edit_history_data_content .edit_data .state .abnormal {
 	background-color: #FFB3B3;
+	padding: 2px;
 }
 .edit_history_data_content .edit_data .state .unknown {
 	background-color: #B3D9FF;
+	padding: 2px;
+}
+.edit_history_data_content .edit_data #delete_btn {
+	float: right;
+	height: 26px;
+	line-height: 22px;
+	padding: 1px 26px;
+	margin-right: 8px;
+	background-color: #E64848;
 }
 .edit_history_data_content .edit_data #edit_btn, .edit_history_data_content .editing_data #save_btn {
 	float: right;
diff --git a/97suifangqa/apps/indicator/static/css/sheet_default.css b/97suifangqa/apps/indicator/static/css/sheet_default.css
index b83dd6a..82d8fbb 100644
--- a/97suifangqa/apps/indicator/static/css/sheet_default.css
+++ b/97suifangqa/apps/indicator/static/css/sheet_default.css
@@ -249,6 +249,18 @@ input[type="radio"]:checked + label {
 	height: 29px;
 	color: #FFFFFF;
 }
+.detail_card_info .table_div table .state .normal {
+	background-color: #B8DB70;
+	padding: 2px;
+}
+.detail_card_info .table_div table .state .abnormal {
+	background-color: #FFB3B3;
+	padding: 2px;
+}
+.detail_card_info .table_div table .state .unknown {
+	background-color: #B3D9FF;
+	padding: 2px;
+}
 .detail_card_info .see_more {
 	margin-top: 5px;
 }
diff --git a/97suifangqa/apps/indicator/static/javascripts/card_chart.js b/97suifangqa/apps/indicator/static/javascripts/card_chart.js
index 75cbf78..92a91c0 100644
--- a/97suifangqa/apps/indicator/static/javascripts/card_chart.js
+++ b/97suifangqa/apps/indicator/static/javascripts/card_chart.js
@@ -129,7 +129,7 @@ $(document).ready(function(){
                             //console.log(event);
                             //console.log(this);
                             var date = moment(this.x).utc().format('YYYY-MM-DD');
-                            TB_show(false, indicator_url+'popup/edithistorydata?card_id='+detail_card_id+'&date='+date+'&no_title=true&TB_iframe=true&height=351&width=630', false);
+                            TB_show(false, indicator_url+'popup/edithistorydata?card_id='+detail_card_id+'&date='+date+'&no_title=true&TB_iframe=true&height=360&width=632', false);
                         }
                     }
                 }
@@ -138,9 +138,9 @@ $(document).ready(function(){
         var getdata_type = "num";
         var getdata_num = 10;
         detail_chart_getdata_draw(detail_chart_str,
-            detail_chart_options_str,
-            getdata_type, getdata_num,
-            begin_date_str, end_date_str
+                detail_chart_options_str,
+                getdata_type, getdata_num,
+                begin_date_str, end_date_str
         );
         $(".act_card_container").addClass("move_div_2_left");
         return false;
@@ -152,17 +152,14 @@ $(document).ready(function(){
         $(this).removeClass("unselected");
         var begin_str = $(this).attr("begin_date");
         var end_date = $(this).attr("end_date");
-        // add 2 days to 'end_str'
-        // otherwise xAxis maybe incomplete to show the last data point
         var end_mm = moment(end_date);
-        end_mm.add('days', 2);
         var end_str = end_mm.format('YYYY-MM-DD');
         var getdata_type = "date";
         var getdata_num = null;
         detail_chart_getdata_draw(detail_chart_str,
-            detail_chart_options_str,
-            getdata_type, getdata_num,
-            begin_str, end_str
+                detail_chart_options_str,
+                getdata_type, getdata_num,
+                begin_str, end_str
         );
         return false;
     });
@@ -172,17 +169,14 @@ $(document).ready(function(){
         $(".shift_date").addClass("unselected");
         var begin_str = $("#search_begin_date").val();
         var end_date = $("#search_end_date").val();
-        // add 2 days to 'end_str'
-        // otherwise xAxis maybe incomplete to show the last data point
         var end_mm = moment(end_date);
-        end_mm.add('days', 2);
         var end_str = end_mm.format('YYYY-MM-DD');
         var getdata_type = "date";
         var getdata_num = null;
         detail_chart_getdata_draw(detail_chart_str,
-            detail_chart_options_str,
-            getdata_type, getdata_num,
-            begin_str, end_str
+                detail_chart_options_str,
+                getdata_type, getdata_num,
+                begin_str, end_str
         );
         return false;
     });
@@ -226,6 +220,7 @@ $(document).ready(function(){
     });
 });
 
+// detail_chart_getdata_draw {{{
 // destroy the original chart and new.
 // chart_str: (string),
 //   name of global var of chart to draw;
@@ -256,27 +251,34 @@ function detail_chart_getdata_draw(chart_str, options_str, type, num, begin, end
             //console.log(dataJson);
             if (dataJson.failed || dataJson.number_rsp == 0) {
                 // getdata failed or get no data
+                // XXX: tooltip??
                 return false;
             }
             else {
                 var begin_dt = moment(dataJson.begin_rsp);
                 var end_dt = moment(dataJson.end_rsp);
+                var begin_dt_axis = begin_dt.clone();
+                var end_dt_axis = end_dt.clone();
                 if (dataJson.number_rsp == 1) {
                     // only one data point
                     // (3days) dp_date (4days)
-                    begin_dt.subtract('days', 3);
-                    end_dt.add('days', 4);
+                    begin_dt_axis.subtract('days', 3);
+                    end_dt_axis.add('days', 4);
                 }
                 else {
                     var diff_days = end_dt.diff(begin_dt, 'days');
                     var days_toadd = Math.floor(diff_days*0.10) + 1;
-                    end_dt.add('days', days_toadd);
+                    end_dt_axis.add('days', days_toadd);
                 }
                 // type == "date"
                 if (type == "date") {
                     // use date of request instead
                     begin_dt = moment(dataJson.begin_req);
                     end_dt = moment(dataJson.end_req);
+                    // add 2 days to 'end_dt'
+                    // otherwise xAxis maybe incomplete
+                    // to show the last data point
+                    end_dt_axis = end_dt.clone().add('days', 2);
                 }
 
                 // update datepicker
@@ -291,8 +293,8 @@ function detail_chart_getdata_draw(chart_str, options_str, type, num, begin, end
 
                 // set chart data
                 window[options_str].chart.renderTo = chart_str;
-                window[options_str].xAxis.min = begin_dt.valueOf();
-                window[options_str].xAxis.max = end_dt.valueOf();
+                window[options_str].xAxis.min = begin_dt_axis.valueOf();
+                window[options_str].xAxis.max = end_dt_axis.valueOf();
                 window[options_str].series[0].data = dataJson.data;
                 // destroy original chart and
                 // redraw with new options and data
@@ -305,11 +307,12 @@ function detail_chart_getdata_draw(chart_str, options_str, type, num, begin, end
         }
     });
 }
+// }}}
 
-// get data for detail card table
+// get data for detail card table {{{
 // if append=true, then keep original data,
 // otherwise, replace original data with new data
-function get_card_data_table(type, num, begin, end, append){
+function get_card_data_table(type, num, begin, end, append) {
     var type2 = type || "num";   // default get data by 'num'
     var num2 = num || "";
     var begin2 = begin || "";
@@ -343,13 +346,13 @@ function get_card_data_table(type, num, begin, end, append){
                 }
                 var record_html = r.value_html + unit_str;
                 if (r.is_normal == true) {
-                    var state = '正常';
+                    var state = '<span class="normal">正常</span>';
                 }
                 else if (r.is_normal == false) {
-                    var state = '不正常';
+                    var state = '<span class="abnormal">不正常</span>';
                 }
                 else {
-                    var state = '未知';
+                    var state = '<span class="unknwon">未知</span>';
                 }
                 // tr_html
                 var tr_html = '<tr id="record_' + r.id + '">';
@@ -357,7 +360,7 @@ function get_card_data_table(type, num, begin, end, append){
                 tr_html += '<td class="record">' + record_html + '</td>';
                 tr_html += '<td class="state">' + state + '</td>';
                 tr_html += '</tr>';
-                //console.log('tr_html: ', tr_html);
+                //console.log('tr_html: '+tr_html);
                 data_html += tr_html + '\n';
             }
             // update table
@@ -377,5 +380,6 @@ function get_card_data_table(type, num, begin, end, append){
         }
     });
 }
+// }}}
 
 // vim: set ts=8 sw=4 tw=0 fenc=utf-8 ft=javascript: //
diff --git a/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js b/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js
index b85bced..d4ccdf5 100644
--- a/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js
+++ b/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js
@@ -21,6 +21,37 @@ $(document).ready(function(){
         maxDate: 0      // 0->today, 1->tomorrow
     });
 
+    // delete button
+    $("#delete_btn").bind("click", function(){
+        // delete record (ajax)
+        var time = moment().valueOf();
+        $.ajax({
+            type: 'get',
+            url: indicator_url + 'ajax/delete_record/',
+            data: 'record_id='+record_id + '&time='+time,
+            success: function(data) {
+                if (data == 'success') {
+                    // redraw chart
+                    var begin_str = $("#search_begin_date", window.parent.document).val();
+                    var end_str = $("#search_end_date", window.parent.document).val();
+                    //console.log("begin_str: "+begin_str);
+                    //console.log("end_str: "+end_str);
+                    var getdata_type = "date";
+                    var getdata_num = null;
+                    parent.detail_chart_getdata_draw(
+                            parent.detail_chart_str,
+                            parent.detail_chart_options_str,
+                            getdata_type, getdata_num,
+                            begin_str, end_str
+                    );
+                    // close popup window
+                    parent.TB_remove();
+                }
+            }
+        });
+        return false;
+    });
+
     // edit button
     $("#edit_btn").bind("click", function(){
         var this_edit_data_div = $(this).closest(".edit_data");
@@ -63,10 +94,25 @@ $(document).ready(function(){
                     // tooltip
                 }
                 else {
+                    // redraw chart
+                    var begin_str = $("#search_begin_date", window.parent.document).val();
+                    var end_str = $("#search_end_date", window.parent.document).val();
+                    var end_mm = moment(end_str);
+                    var record_date_mm = moment(record_data.date);
+                    if (record_date_mm.isAfter(end_mm)) {
+                        end_str = record_date_mm.format('YYYY-MM-DD');
+                    }
+                    //
+                    var getdata_type = "date";
+                    var getdata_num = null;
+                    parent.detail_chart_getdata_draw(
+                            parent.detail_chart_str,
+                            parent.detail_chart_options_str,
+                            getdata_type, getdata_num,
+                            begin_str, end_str
+                    );
                     // successfully modified
                     parent.TB_remove();
-                    // update the detail chart
-                    //parent.redraw_chart(parent.detail_chart, "2013-08-04", "2013-08-10"); //这边需要穿过来起始，结束时间，以便刷新图表和表格
                 }
             }
         });
diff --git a/97suifangqa/apps/indicator/static/javascripts/sheet_default.js b/97suifangqa/apps/indicator/static/javascripts/sheet_default.js
index e5d9e9e..4d1683a 100644
--- a/97suifangqa/apps/indicator/static/javascripts/sheet_default.js
+++ b/97suifangqa/apps/indicator/static/javascripts/sheet_default.js
@@ -70,7 +70,7 @@ $(document).ready(function(){
         var time = date.getTime();
         $.ajax({  //数据库还是cookie，都可以，建议使用cookie，html中是否显示sub_title也由后端读取的cookie决定
             type: 'get',
-            url: indicator_url + 'ajax/close_sub_title',
+            url: indicator_url + 'ajax/close_sub_title/',
             data: 'time='+time,
             success: function(data){
                 if(data == 'success'){
@@ -419,7 +419,7 @@ $(document).ready(function(){
     });
     // }}}
 
-    //点击提交icon
+    //点击提交icon {{{
     $(".confirm_edit_icon").bind("click", function(){
         var this_editing_data_div = $(this).closest(".editing_data");
         var card = $(this).closest(".index_card");
@@ -488,8 +488,13 @@ $(document).ready(function(){
                     // refresh_icon
                     this_edit_data_div.find(".refresh_icon").show();
                     // edit_icon_container & chart
-                    this_editing_data_div.siblings(".edit_icon_container").hide();
-                    this_editing_data_div.siblings(".chart").show();
+                    toggle_edit_hint(id, "hide");
+                    // redraw chart
+                    chart_getdata_draw("chart_"+id, id,
+                            "options_chart_"+id,
+                            chart_getdata_type, chart_dp_num,
+                            null, null
+                    );
                 }
             }
         });
@@ -497,6 +502,7 @@ $(document).ready(function(){
 
         return false;
     });
+    // }}}
 
     //日期控件
     $(".datepicker_container>.datepicker").datepicker({
@@ -526,6 +532,22 @@ $(document).ready(function(){
     });
 });
 
+// toggle 'edit_hint'
+function toggle_edit_hint(card_id, action) {
+    var card = $("#index_card_"+card_id);
+    var edit_hint = card.find(".edit_icon_container");
+    var chart = card.find(".chart");
+    if (action === 'show') {
+        chart.hide();
+        edit_hint.show();
+    }
+    else if (action === 'hide') {
+        edit_hint.hide();
+        chart.show();
+    }
+    return false;
+}
+
 //
 function delete_card(){
     var card = $("#index_card_"+card_2_delete_id);