• 记一次需求 费劲


    一个思路

    需求是这样的:如下图 (选择加班日期,自动填充签到和签退时间)

    这是一个oa流程只能写js脚本去添加,刚开始想的是监测 input的 change事件,但是 change事件只能获取到 手动改变的, js改变值是监测不到的 (不可行)

    当点击选择日期按钮的时候,定时器开始监测选择的值,然后去调一个接口取两个时间的值(大致思路就是这样,其中细节(事件兼容性,判断有没有选择日期)见代码 纯纯的js)

    function contains(arr, obj) {
       
    
        if(arr[obj]!='undefined')
            return false;
        return true;
    }
    
    
    
    function addEvent(elm, evType, fn, useCapture) {
    if (elm.addEventListener) {
    
    elm.addEventListener(evType, fn, useCapture);
    return true;
    }
    else if (elm.attachEvent) {
    
    var r = elm.attachEvent('on' + evType, fn);
    return r;
    }
    }
    
    var listenList = new Array();
    document.ready= function (event) {
        tdControlClick(event);
      var addButton = document.getElementsByClassName("addbtn_p")[0];
    
    addEvent(addButton,'click',function(event){
        tdControlClick(event)
    })
    
    function tdControlClick(event){
        var dateControls = document.getElementsByClassName("calendar");
        if (dateControls != "undefined") {
           for (var index = 0; index < dateControls.length; index++) {
               var element = dateControls[index];
    
               var id = element.getAttribute("id");
               if (!contains(listenList, id)) {
                   listenList[id] = {
                       id: id,
                       timer: 0,
                       date: ''
                   };
                   clearInterval(listenList[id].timer);
    
                    addEvent(element,'click',function(event){
                       var event = event || window.event;
                   
                       var target = event.toElement || event.srcElement;
                       var objID = event.target.id;
    
                       var inter = setInterval(function () {
                          dateControlClick(objID);
                       }, 1000);
                       listenList[objID].timer = inter;
    
                   })
               }
            }
        }
    }
    function dateControlClick(id)
    {
    
        var fieldid = id.split('_')[0];
        var rowNo = id.split('_')[1].replace('browser', '');
    
        var dateVal = document.getElementById(fieldid + "_" + rowNo + "span").innerText;
    
        if (dateVal != listenList[id].date) {
            listenList[id].date = dateVal;
            var curdate = listenList[id].date.replace(/-/,"").replace(/-/,"");
    
            ajax_methods(curdate,rowNo);
    
            clearInterval(listenList[id].timer);
            listenList[id].timer = 0;
        }
    }
    
    function ajax_methods(date,rowNo) {
        var xhr = new XMLHttpRequest();
        var personcode =document.getElementById('field12003').value;
    
        xhr.open('post',
            'https://zqs.reignwood.com/bi-web/index/extract?indexSetCodes=INDEX171019100002&refresh=1&caller=WorkAttendFromOA'
        );
        xhr.setRequestHeader("Content-type", "application/json;charset=UTF-8");
        var data = {
            orgcode: "1",
            curdate: date,
            type: 3,
            personcode: personcode,
            personPage: "1",
            caller:'WorkAttendFromOA'
        }
        xhr.send(JSON.stringify(data));
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4 && xhr.status == 200) {
                var res = JSON.parse(xhr.responseText);
    
                setCheckTime(res.data,rowNo);
            }
        };
    }
    
    function setCheckTime(data,rowNo)
    {
        document.getElementById('field19209_'+rowNo).value=data.oneday.workStart.toString().substring(0,5);
        document.getElementById('field19209_'+rowNo + "span").innerText=data.oneday.workStart.toString().substring(0,5);
        document.getElementById('field19210_'+rowNo).value=data.oneday.workEnd.toString().substring(0,5);
        document.getElementById('field19210_'+rowNo + "span").innerText=data.oneday.workEnd.toString().substring(0,5);
    }
    
    
      }
    
    
    
  • 相关阅读:
    mysql 查询优化
    图解Java常用数据结构(一)
    mybatis 详解(五)------动态SQL
    Mybatis的ResultMap的使用
    java系统变慢的优化简略步骤
    mysql基本操作
    mysql数据库的优化 一
    tomcat的启动启动与关闭
    vueJs的简单入门以及基础语法
    Oracle常用命令-用户、表空间、赋权限、导入导出
  • 原文地址:https://www.cnblogs.com/ljh--/p/9540679.html
Copyright © 2020-2023  润新知