From 58b77885308c944a029caf5c2d8b5d3263b6f64d Mon Sep 17 00:00:00 2001 From: Alvin Li Date: Sun, 25 Aug 2013 01:25:27 +0800 Subject: * improved the popup page 'EditHistoryData.html': o improvd page styles; o updated related view: 'indicator.views.indicator_edithistorydata()'; o updated related css styles; o added styles 'valid' and 'invalid'; o added 'jquery-ui: datepicker' to select date; o added 'reason_input' field to get the reason for modification; o implemented validation for 'date' and 'reason' field; * added testing record data for testing 'detail_card'; * added 'cursor: pointer' for 'ui-datepicker-trigger'; * small style change to the 'see_more_button' of SheetDefault.html; * added umcompressed 'jquery-1.9.1.js' for backup; * added param 'type' for 'indicator.tools.format_data()'; TODO: EditHistoryData.html: o to show original record data properly; o to add validation for data field o to implement ajax POST data and related view --- .../indicator/static/javascripts/card_chart.js | 2 + .../static/javascripts/edit_history_data.js | 228 +++++++++++++-------- 2 files changed, 144 insertions(+), 86 deletions(-) (limited to '97suifangqa/apps/indicator/static/javascripts') diff --git a/97suifangqa/apps/indicator/static/javascripts/card_chart.js b/97suifangqa/apps/indicator/static/javascripts/card_chart.js index a8fe9f1..8398345 100644 --- a/97suifangqa/apps/indicator/static/javascripts/card_chart.js +++ b/97suifangqa/apps/indicator/static/javascripts/card_chart.js @@ -362,12 +362,14 @@ function get_card_data_table(type, num, begin, end, append){ $("#detail_card_table tr").not(".first_line").remove(); // reset to enable button $(".see_more_btn").removeAttr('disabled'); + $(".see_more_btn").attr('value', '浏览更多记录'); } //console.log('data_html: ', data_html); $("#detail_card_table").append(data_html); // disable button if has no more data if (! dataJson.has_earlier) { $(".see_more_btn").attr('disabled', 'disabled'); + $(".see_more_btn").attr('value', '无更多记录'); } } }); diff --git a/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js b/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js index 204f404..83a87e2 100644 --- a/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js +++ b/97suifangqa/apps/indicator/static/javascripts/edit_history_data.js @@ -1,90 +1,146 @@ $(document).ready(function(){ - //点大叉，关闭弹层页面 - $(".edit_history_data_close").bind("click", function(){ - parent.TB_remove(); - return false; - }); - $("#edit_btn").bind("click", function(){ - var this_edit_data_div = $(this).parent(); - var data_fir = $(this).siblings(".data_fir").text(); - var data_sec = $(this).siblings(".data_sec").text(); - var this_editing_data_div = this_edit_data_div.siblings(".editing_data"); - var input_container = this_editing_data_div.children(".input_container"); - input_container.children(".edit_input_main").val(parseInt(data_fir)); - input_container.children(".edit_input_sub").val(parseInt(data_sec)); - this_editing_data_div.show(); - this_edit_data_div.hide(); - return false; - }); - //点击指数+1 icon - $(".add_icon").bind("click", function(){ - var this_edit_input_sub = $(this).closest(".editing_data").children(".input_container").children(".edit_input_sub"); - var origin_value = parseInt(this_edit_input_sub.val()); - this_edit_input_sub.val(origin_value+1); - return false; - }); - //点击 指数-1 icon - $(".minus_icon").bind("click", function(){ - var this_edit_input_sub = $(this).closest(".editing_data").children(".input_container").children(".edit_input_sub"); - var origin_value = parseInt(this_edit_input_sub.val()); - var after_value = origin_value-1; - if(after_value >= 0){ - this_edit_input_sub.val(origin_value-1); - } - return false; - }); - //编辑数据的底数验证：只允许两位小数，非空 - $(".edit_input_main").bind("keyup", function(){ - var val = $(this).val(); - val = val.replace(/[^\d.]/g,"");//清除"数字"和"."以外的字符 - val = val.replace(/^\./g,"");//验证第一个字符是数字而不是.. - val = val.replace(/\.{2,}/g,".");//只保留第一个. 清除多余的 - val = val.replace(".","$#$").replace(/\./g,"").replace("$#$","."); - val = val.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3'); - $(this).val(val); - return false; - }); - //编辑数据的指数验证：只允许整数 - $(".edit_input_sub").bind("keyup", function(){ - $(this).val($(this).val().replace(/[^\d]/g, '')); - return false; - }); - $("#save_btn").bind("click", function(){ - var data_input_fir = $(".edit_input_main"); - var data_input_sec = $(".edit_input_sub"); - var data_input_fir_val = data_input_fir.val(); - var data_input_sec_val = data_input_sec.val(); - - if(data_input_fir_val == '' || data_input_fir_val == 0){ - data_input_fir.addClass("error"); - }else{ - data_input_fir.removeClass("error"); - } - if(data_input_sec_val == ''){ - data_input_sec.addClass("error"); - }else{ - data_input_sec.removeClass("error"); - } - if($(".error").length > 0){ - return false; - } - - var date = new Date(); - var time = date.getTime(); - $.ajax({ - type: 'get', - url: indicator_url + 'ajax/edit_history_data', - data: 'time='+time, - success: function(data){ - if(data == 'success'){ - parent.TB_remove(); - parent.redraw_chart(parent.detail_chart, "2013-08-04", "2013-08-10"); //这边需要穿过来起始，结束时间，以便刷新图表和表格 - } - } - }); - - return false; - }); + //点大叉，关闭弹层页面 + $(".edit_history_data_close").bind("click", function(){ + parent.TB_remove(); + return false; + }); + // jquery-ui: datepicker + $("#editing_date_picker").datepicker({ + showOn: "both", + buttonImage: static_url + "images/calendar.png", + buttonImageOnly: true + }); + // edit button + $("#edit_btn").bind("click", function(){ + var this_edit_data_div = $(this).closest(".edit_data"); + //var data_fir = $(this).siblings(".data_fir").text(); + //var data_sec = $(this).siblings(".data_sec").text(); + var data_fir = 0; + var data_sec = 0; + var this_editing_data_div = this_edit_data_div.siblings(".editing_data"); + var input_container = this_editing_data_div.children(".input_container"); + input_container.children(".edit_input_main").val(parseInt(data_fir)); + input_container.children(".edit_input_sub").val(parseInt(data_sec)); + this_editing_data_div.show(); + this_edit_data_div.hide(); + return false; + }); + // save botton + $("#save_btn").bind("click", function(){ + var data_input_fir = $(".edit_input_main"); + var data_input_sec = $(".edit_input_sub"); + var data_input_fir_val = data_input_fir.val(); + var data_input_sec_val = data_input_sec.val(); + + if(data_input_fir_val == '' || data_input_fir_val == 0){ + data_input_fir.addClass("error"); + }else{ + data_input_fir.removeClass("error"); + } + if(data_input_sec_val == ''){ + data_input_sec.addClass("error"); + }else{ + data_input_sec.removeClass("error"); + } + if($(".error").length > 0){ + return false; + } + + var time = moment().valueOf(); + $.ajax({ + type: 'get', + url: indicator_url + 'ajax/edit_history_data', + data: 'time='+time, + success: function(data){ + if(data == 'success'){ + parent.TB_remove(); + //parent.redraw_chart(parent.detail_chart, "2013-08-04", "2013-08-10"); //这边需要穿过来起始，结束时间，以便刷新图表和表格 + } + } + }); + return false; + }); + + // set datepicker 'date_input' value + var date_init = $.datepicker.parseDate('yy-mm-dd', + $(".date_input").attr('value')); + $(".date_input").datepicker("setDate", date_init); + + // data validate {{{ + // validate date + $(".date_input").focus(function() { + $(this).removeClass("valid invalid"); + }); + $(".date_input").change(function() { + var date_str = $(this).val(); + var date_mm = moment(date_str, 'YYYY-MM-DD'); + var today_mm = moment(); + //console.log('date_str: ', date_str); + // date cannot beyond today + if (date_mm.isValid() && !date_mm.isAfter(today_mm)) { + $(this).removeClass("invalid"); + $(this).addClass("valid"); + } + else { + // date invalid + $(this).removeClass("valid"); + $(this).addClass("invalid"); + } + }); + // validate data + $(".data_input").focus(function() { + $(this).removeClass("valid invalid"); + }); + $(".data_input").change(function() { + //$(this).removeClass("valid invalid"); + }); + // validate reason + $(".reason_input").focus(function() { + $(this).removeClass("valid invalid"); + }); + $(".reason_input").blur(function() { + var reason_str = $(this).val(); + if (is_str_blank(reason_str)) { + // reason not given or blank + $(this).removeClass("valid"); + $(this).addClass("invalid"); + } + else { + // reason given and not blank + $(this).removeClass("invalid"); + $(this).addClass("valid"); + } + }); + // }}} + + //编辑数据的底数验证：只允许两位小数，非空 + $(".edit_input_main").bind("keyup", function(){ + var val = $(this).val(); + val = val.replace(/[^\d.]/g,""); //清除"数字"和"."以外的字符 + val = val.replace(/^\./g,""); //验证第一个字符是数字而不是.. + val = val.replace(/\.{2,}/g,"."); //只保留第一个. 清除多余的 + val = val.replace(".","$#$").replace(/\./g,"").replace("$#$","."); + val = val.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3'); + $(this).val(val); + return false; + }); + //编辑数据的指数验证：只允许整数 + $(".edit_input_sub").bind("keyup", function(){ + var val = $(this).val().replace(/[^\d]/g, ''); + $(this).val(val); + return false; + }); }); +// help functions +// check if a string is empty, null or undefined +function is_str_empty(str) { + return (!str || 0 === str.length); +} + +// check if a string is blank, null or undefined +function is_str_blank(str) { + return (!str || /^\s*$/.test(str)); +} + // vim: set ts=4 sw=4 tw=0 fenc=utf-8 ft=javascript: // -- cgit v1.2.2