1.1 版本

1.2 应用场景

用于移动端H5页面集成并且对筛选时间有要求的场景

1.3 功能介绍

日期控制,开始时间与结束时间不得大于一个月,并且开始时间选择后结束时间自动选择该月的最后一天

2.1 操作步骤

1.首先创建开始时间组件,控件命名为start_time,控件值写入公式:DATEINMONTH(TODAY(),1)

   然后在添加编辑结束事件,事件代码如下:

var start = this.options.form.getWidgetByName("start_time").getValue(); var end = this.options.form.getWidgetByName("end_time");  var day2 = new Date();day2.setTime(day2.getTime());var s2 = day2.getFullYear()+"-" + (day2.getMonth()+1) + "-" + day2.getDate();var s1 = start.substring(5,7);var s3 = s2.substring(5,7);var yy = start.substring(0,4);var mm = start.substr(5,2);var dd = new Date(yy,mm,0).getDate();var day3 = start.substring(0,7);var day4 = day3+ '-' +dd if(s1==s3){end.setValue(s2); }else {  end.setValue(day4); }

2.创建结束时间控件,并命名控件命名为end_time

  然后添加编辑结束事件,事件代码如下:

var start = this.options.form.getWidgetByName("start_time").getValue(); var end = this.options.form.getWidgetByName("end_time").getValue();var endtimes = this.options.form.getWidgetByName("end_time"); var day3 = start.substring(0,7); var yy = start.substring(0,4); var startmm = start.substr(5,2); var endmm = end.substr(5,2); var dd = new Date(yy,startmm,0).getDate(); var day4 = day3+ '-' +dd  var day2 = new Date();  day2.setTime(day2.getTime());  var s2 = day2.getFullYear()+"-" + (day2.getMonth()+1) + "-" + day2.getDate();  var s2mm = (day2.getMonth()+1);   FR.Msg.alert = alert;    function alert(data, callback) { //回调函数        var alert_bg = document.createElement('div');        alert_box = document.createElement('div'),            alert_text = document.createElement('div'),            alert_btn = document.createElement('div'),            textNode = document.createTextNode(data ? data : ''),            btnText = document.createTextNode('确 定');        // 控制样式        css(alert_bg, {            'position': 'fixed',            'top': '0',            'left': '0',            'right': '0',            'bottom': '0',            'background-color': 'rgba(0, 0, 0, 0.1)',            'z-index': '999999999'        });        css(alert_box, {            'width': '270px',            'max-width': '90%',            'font-size': '16px',            'text-align': 'center',            'background-color': '#fff',            'border-radius': '15px',            'position': 'absolute',            'top': '50%',            'left': '50%',            'transform': 'translate(-50%, -50%)'        });        css(alert_text, {            'padding': '10px 15px',            'border-bottom': '1px solid #ddd'        });        css(alert_btn, {            'padding': '10px 0',            'color': '#007aff',           'font-weight': '600',            'cursor': 'pointer'        });        // 内部结构套入        alert_text.appendChild(textNode);        alert_btn.appendChild(btnText);        alert_box.appendChild(alert_text);        alert_box.appendChild(alert_btn);        alert_bg.appendChild(alert_box);        // 整体显示到页面内        document.getElementsByTagName('body')[0].appendChild(alert_bg);        // 确定绑定点击事件删除标签        alert_btn.onclick = function() {            alert_bg.parentNode.removeChild(alert_bg);            if (typeof callback === 'function') {                callback(); //回调            }        }    }    function css(targetObj, cssObj) {        var str = targetObj.getAttribute("style") ? targetObj.getAttribute('style') : '';        for (var i in cssObj) {            str += i + ':' + cssObj[i] + ';';        }        targetObj.style.cssText = str;    }	var starttime = this.options.form.getWidgetByName("start_time").getValue();  			var time = starttime.substring(1,4);			var Year = new Date().getFullYear(), s = 0, d;                for (var i = 1; i < 13; i++) {                    d = new Date(time, i, 0);                    s += d.getDate();                };  				if(end > s2 || endmm != startmm  && s2mm == startmm) {  if(end > s2 && endmm == startmm){   alert("结束时间不能超过今天。"); 	  endtimes.setValue(s2);  };    if(s2mm ==startmm && endmm != startmm){	alert("不支持跨月查询，请重新查询。"); 	endtimes.setValue(s2);	};};  if(endmm != startmm && startmm != s2mm){    alert("不支持跨月查询，请重新查询。");   endtimes.setValue(day4); }

2.2 效果查看

PC端未做测试,移动端H5可以使用,App元生未测试.

AppDate.frm

4. 注意事项

移动端H5可用,PC端需需改Js事件代码