anhui新增按钮组件

ControlEvent.js


let ButtonBar = {
    "BUTTONBARRENDER": "buttonbar_render",
    "COUNTDOWNSTART": "countdownstart",         //对外抛出监听方法countdownstart
    "COUNTDOWNEND": "countdownend",             
    "COUNTDOWNENDCL": "countdownendcl"
}

buttons.json         ----按钮配置

{
    		"text": "倒计时",
                "actionName": "system_count_down",
                "buttonType": "auxiliary",
                "icon": "",
                "style": "0",
                "show": "default",
                "size": "",
                "isSystem": true,
                "alias": "",
                "actionArgs": "获取验证码;10;click;false;重新获取;true",
                "actionArgsHelper": "参数1：默认文字\r\n参数2：计时秒数\r\n参数3：计时触发方法(参考值：click、render)\r\n参数4：计时进行中是否可以点击(参考值：true、false)\r\n参数5：计时结束文字\r\n参数6：是否可以重复点击（true、false）"
            }

buttons.js

box.on("click", '.ds_button', barClick);//定位代码
if(!control._root.isDesign){
	for(var i=0,len=buttons.length;i<len;i++){
		let userargs = getButtonArgs(buttons[i].actionArgs);
        //当为定时器按钮的时候，自定执行
		if(buttons[i].actionName == "system_count_down" && userargs[2]=='render'){
			let evt = {target:box.find('.ds_button')[i]}
			countdown(control,buttons[i],evt)
		}
	}
}


//倒计时
let iscountdown = true;
let countdown = function(control, button, evt) {
	
	let args = getButtonArgs(button.actionArgs, (evt._data || control));
    let _evt = evt;
    let countdowndata = {
        time: args[1] || 60,
        isclick: args[2] || "click",
        isdoingclick: args[3] || "false", //是否进行中可以点击
        textafter: args[4] || "重新获取",
        isagain: args[5] || "false",
        timestart: function () {
            control.event.trigger("countdownstart", {
                "ui": control,
                "args": button
            });
        },
        timeend: function () {
            control.event.trigger("countdownend", {
                "ui": control,
                "args": button
            }); //触发
        },
        timeendcl: function () {
            //			control.event.trigger("countdownendcl", { "ui": control, "args": button});
            $(_evt.target).click(function () {
                control.event.trigger("countdownendcl", {
                    "ui": control,
                    "args": button
                });
            })

            //			page.getControl("buttonbar1").event.on(ButtonBar.COUNTDOWNENDCL,function(obj){
            //				console.log(1);
            //				console.log(obj);
            //			})
        }
    }
//  if (!iscountdown) {//第一次可以点击，如果用户配置为false,则第一次结束后就不可点击了
//      return false;
//  }
	var isclick = $(_evt.target).attr('isclick')
	if(isclick){//已经点击过
		iscountdown = args[5]=='true'?true:false//用配置的值
		if(iscountdown){
			let _btnattr = countdowndata.isdoingclick;
			let num = $(_evt.target).attr('num');
	    
			if (countdowndata.isdoingclick == 'false' && (num == 0 || num == undefined)) {
			    countdowndata.timestart();
			    _countdown(countdowndata, args, _evt)
			} else if (countdowndata.isdoingclick == 'true' && (num == 0 || num == undefined)) {
			    countdowndata.timestart();
			    _countdown(countdowndata, args, _evt)
			}
		}
	}else{//第一次点击
		let _btnattr = countdowndata.isdoingclick;
		let num = $(_evt.target).attr('num');
    
		if (countdowndata.isdoingclick == 'false' && (num == 0 || num == undefined)) {
		    countdowndata.timestart();
		    _countdown(countdowndata, args, _evt)
		} else if (countdowndata.isdoingclick == 'true' && (num == 0 || num == undefined)) {
		    countdowndata.timestart();
		    _countdown(countdowndata, args, _evt)
		}
	}
}

function _countdown(countdowndata,args,_evt) {
	if (countdowndata.time == 0) {
    	
        $(_evt.target).attr('num', countdowndata.time);
        countdowndata.timeend();
        countdowndata.timeendcl();
        $(_evt.target).attr('isdoingcl', true)
        $(_evt.target).attr('isclick', true)
        $(_evt.target).removeClass("layui-btn layui-btn-disabled ds_button_auxiliary");
        $(_evt.target).text(countdowndata.textafter);
        countdowndata.time = args[1];
    } else {
        $(_evt.target).attr('num', countdowndata.time);
        $(_evt.target).attr('isdoingcl', countdowndata.isdoingclick)
        $(_evt.target).addClass("layui-btn layui-btn-disabled ds_button_auxiliary");
        $(_evt.target).text(countdowndata.time);
        countdowndata.time--;
        setTimeout(function () {
            _countdown(countdowndata, args, _evt)
        }, 1000)
    }
}
window["countdown"] = countdown;


let handler = {
    "system_count_down": countdown,          //先注册
    "system_window_open": windowOpen
}

使用示例

!function(){
    page.event.on(PageEvent.LOADED,function(args){
      //此处编写扩展代码
      console.log(ButtonBar);  //查看有哪些可供监听的方法
		var iskeepon = true;  //iskeepon为true时继续执行， iskeepon为false时结束
 //    点击执行方法之前                     
      page.getControl("buttonbar3").event.on(ButtonBar.COUNTDOWNBRFORE,function(button){
		  
		  
		  if(!iskeepon){
			  dsf.layer.message('不能继续执行', false);
			  page.event.trigger('ready');
		  }
      })
//    //监听点击
      page.getControl("buttonbar3").event.on(ButtonBar.COUNTDOWNSTART,function(button){
		  if(iskeepon){
			 console.log('点击了按钮，还可以搞点事');
		  }
      })
      page.getControl("buttonbar3").event.on(ButtonBar.COUNTDOWNENDCL,function(button){
		  if(iskeepon){
			 console.log('倒计时正在进行，还可以搞点事');
		  }
      })
//     //监听结束
      page.getControl("buttonbar3").event.on(ButtonBar.COUNTDOWNEND,function(button){
		  if(iskeepon){
			 console.log('倒计时结束了，还可以搞点事');
		  }
      })
      
      
    });
}();