初始化

該步驟將為你添加流程按鈕，并初始化按鈕的事件，無個性化需求的情況下，僅這一步即可。

方法1 （默認）：

1. 在$(function() { ... }) 中引入jsp：

$(function(){
  <%@include file="/webpage/commonModule/pc/approval_script.jsp"%>
});

2. 根據(jù)約定規(guī)則，配置元素ID

解釋：

• 頁面最外層元素id設置為：page_${random} （作為添加流程按鈕、流轉后關閉彈框的參照元素）
• t:formvalid標簽的formid設置為：form_${random}（要提交的表單元素）
• 存放業(yè)務申請ID的表單id設置為：idInput_${random}（第一步保存后，若接口返回有申請ID，將自動賦值到該元素，下次保存將與表單一同提交，避免重復新增）
• ${random}為隨機數(shù)，避免沖突

方法2 （自定義）：

1. 初始化流程對象與按鈕組對象（無需引上述的Jsp）

/* 初始化操作函數(shù) */
var workflow= new Workflow({
    datagridId: /* 上級列表id（保存、流程等操作將自動刷新） 例：'#listID' */,
    pageId: /* 頁面最外層元素id，作為添加流程按鈕、流轉后關閉彈框的參照元素  例：'#pageID' */,
    formId: /* 將要提交的表單id  例：'#formID' */
    taskId:  "${taskId}", /* 任務id，用于獲取下一步執(zhí)行人的提示 */
    taskOpinionId:  '${taskOpinion.id}', /* 意見id，用于保存意見 */
    idInput:  /* 表單保存接口返回的申請ID所存放的元素id   例：'#idInput' */
});
/* 初始化按鈕 */
var approveButton= new ApproveButton({
    pageId:  /* 頁面最外層元素id，作為添加流程按鈕、流轉后關閉彈框的參照元素  例：'#pageID' */,
    optFlag: '${param.optFlag}', // 頁面只讀/可編輯的標識
    isWorkFlow: '${isWorkFlow}', // 是否是流程任務
    isCanBack: '${isCanBack}', // 是否可駁回
    workflow: workflow
});

注意：頁面的元素id必須與所自定義配置的pageId、formId、idInput等相匹配

初始化步驟的默認流程邏輯：

• 保存：提交表單（提交id為配置項 “ formId ” 的標簽，提交前不做任何校驗）
• 提交：必填校驗 -> 保存表單 -> 發(fā)起流程 -> 刷新上級列表 -> 關閉彈窗 -> 刷新待辦 -> 提示下一步執(zhí)行人
• 流轉：判斷結論（未填則提示填寫，反對則轉入終止事件） -> 流轉 -> 刷新上級列表 -> 關閉彈窗 -> 刷新待辦 -> 提示下一步執(zhí)行人
• 駁回：駁回 -> 刷新上級列表 -> 關閉彈窗 -> 刷新待辦 -> 提示下一步執(zhí)行人
  終止：終止 -> 刷新上級列表 -> 關閉彈窗 -> 刷新待辦 -> 提示下一步執(zhí)行人

提示：若默認流程邏輯無法滿足個性化的需求，需要使用下面的方法，重置流程邏輯。

重置保存邏輯：

approveButton.setEvents({
  save: function() {
  /* 保存邏輯 */
  }
});

保存前校驗：

approveButton.setEvents({
  save: function() {
    workflow.save({
      condition: function(resolve, reject) {
        if () {
          resolve(false); // 校驗不通過
        }  else {
          resolve(true); // 校驗通過
        }
      }
    });
  }
});

保存成功回調(diào)：

approveButton.setEvents({
  save: function() {
    workflow.save({
      success: function(d) { // d為保存接口返回的數(shù)據(jù)
        /* 保存成功后的邏輯 */
      }
    });
  }
});

僅保存意見：

approveButton.setEvents({
  save: function() {
    workflow.saveOpinion();
  }
});

保存意見且不彈出提示框：

approveButton.setEvents({
  save: function() {
    workflow.saveOpinion({
      noTips: true
    });
  }
});

保存表單且保存意見：

approveButton.setEvents({
  save: function() {
    workflow.save({ // 保存表單
      success: function(d) {
        workflow.saveOpinion(); // 保存意見
      }
    });
  }
});

保存前校驗必填：

approveButton.setEvents({
  save: function() {
    workflow.save({}, false);
  }
});

保存后關閉彈窗：

approveButton.setEvents({
  save: function() {
    workflow.save({
      isClose: true
    });
  }
});

保存后不彈出提示框：

approveButton.setEvents({
  save: function() {
    workflow.save({}, undefined, {
      noTips: true
    });
  }
});

保存后不賦值申請ID：

approveButton.setEvents({
  save: function() {
    workflow.save({
      setKey: false
    });
  }
});

重置提交邏輯：

approveButton.setEvents({
  submit: function() {
  /* 提交邏輯 */
  }
});

提交前校驗：

approveButton.setEvents({
  submit: function() {
    workflow.submit({
      condition: function(resolve, reject) {
        if () {
          resolve(false); // 校驗不通過，無法提交
        }  else {
          resolve(true); // 校驗通過，繼續(xù)提交
        }
      }
    });
  }
});

提交前的保存表單前事件：

approveButton.setEvents({
  submit: function() {
    workflow.submit({
      beforeSave: function() {
        /* 保存前邏輯 */
      }
    });
  }
});

提交前的保存成功后回調(diào)邏輯：

approveButton.setEvents({
  submit: function() {
    workflow.submit({
      saveSuccess: function(d, resolve, reject) { // d為保存后接口返回的數(shù)據(jù)
        if () {
          resolve(false); // 不再提交
        }  else {
          resolve(true); // 繼續(xù)提交
        }
      }
    });
  }
});

提交成功回調(diào)：

approveButton.setEvents({
  submit: function() {
    workflow.submit({
      success: function(d) { // d為保存接口返回的數(shù)據(jù)
        /* 保存成功后的邏輯 */
      }
    });
  }
});

添加提交參數(shù)：

approveButton.setEvents({
  submit: function() {
    workflow.submit({
      params: {
        flowKey: '',
        v_I_needDsz: '',
        parentBusinessKey: '',
        businessName: '',
        voteContent: ''
      }
    });
  }
});

重置流轉邏輯：

approveButton.setEvents({
  nextFlow: function() {
  /* 提交邏輯 */
  }
});

流轉前校驗：

approveButton.setEvents({
  nextFlow: function() {
    workflow.nextFlow({
      condition: function(resolve, reject) {
        if () {
          resolve(false); // 校驗不通過，無法流轉
        }  else {
          resolve(true); // 校驗通過，往下流轉
        }
      }
    });
  }
});

流轉成功回調(diào)：

approveButton.setEvents({
  nextFlow: function() {
    workflow.nextFlow({
      success: function(d) { // d為保存接口返回的數(shù)據(jù)
        /* 保存成功后的邏輯 */
      }
    });
  }
});

添加流轉參數(shù)：

approveButton.setEvents({
  nextFlow: function() {
    workflow.nextFlow({
      params: {
        v_I_needScr: '',
        parentBusinessKey: '',
        businessName: '',
        voteContent: ''
      }
    });
  }
});

結論是反對但不終止流程：

approveButton.setEvents({
  nextFlow: function() {
    workflow.nextFlow({
      isEndProcess: 'N'
    });
  }
});

流轉前先保存表單：

approveButton.setEvents({
  nextFlow: function() {
    workflow.save({ // 保存
      success: function(d) {
        workflow.nextFlow(); // 流轉
      }
    }, false, { // false: 校驗必填
      noTips: true // 不提示保存成功
    });
  }
});

重置駁回邏輯：

approveButton.setEvents({
  reject: function() {
  /* 提交邏輯 */
  }
});

駁回前校驗：

approveButton.setEvents({
  reject: function() {
    workflow.reject({
      condition: function(resolve, reject) {
        if () {
          resolve(false); // 校驗不通過
        }  else {
          resolve(true); // 校驗通過
        }
      }
    });
  }
});

駁回前回調(diào)：

approveButton.setEvents({
  reject: function() {
    workflow.reject({
      beforeSend: function() {
        /* 駁回前的邏輯 */
      }
    });
  }
});

駁回成功回調(diào)：

approveButton.setEvents({
  reject: function() {
    workflow.reject({
      success: function(d) { // d為駁回接口返回的數(shù)據(jù)
        /* 駁回成功后的邏輯 */
      }
    });
  }
});

重置終止邏輯：

approveButton.setEvents({
  endFlow: function() {
  /* 提交邏輯 */
  }
});

終止前校驗：

approveButton.setEvents({
  endFlow: function() {
    workflow.endFlow({
      condition: function(resolve, reject) {
        if () {
          resolve(false); // 校驗不通過
        }  else {
          resolve(true); // 校驗通過
        }
      }
    });
  }
});

終止前回調(diào)：

approveButton.setEvents({
  endFlow: function() {
    workflow.endFlow({
      beforeSend: function() {
        /* 駁回前的邏輯 */
      }
    });
  }
});

終止成功回調(diào)：

approveButton.setEvents({
  endFlow: function() {
    workflow.endFlow({
      success: function(d) { // d為終止接口返回的數(shù)據(jù)
        /* 終止成功后的邏輯 */
      }
    });
  }
});

注意：流轉、駁回、終止等操作邏輯中，默認的 “結論” 表單和 “意見” 表單分別如下：

結論表單：

$(".approval_opinion [name='conclusionInput']")

意見表單：

$(".approval_opinion [name='opinionInput']")

若需要重置，則調(diào)用一下方法：

// 重置結論表單
workflow.setConclusionInput("#...");
// 重置意見表單
workflow.setOpinionInput("#...");

修改流程按鈕：

初始化時，會根據(jù)optFlag、isWorkFlow、isCanBack等配置，添加相應的流程按鈕，若需求與默認的不符，可重置流程按鈕。

添加按鈕：

approveButton.addButton({
  name: 'export',
  text: '導出',
  func: function() {
    // 按鈕點擊事件
  }
}, 2) // 2：按鈕位置（從0開始） 

刪除按鈕：

approveButton.removeButton('export'); // 傳按鈕的name值

刪除多個按鈕：

approveButton.removeButton(['save', 'submit', 'close']);

默認按鈕name:

• 保存：save
• 提交：submit
• 流轉：nextFlow
• 駁回：reject
• 關閉：close

常用輔助方法：

填充表單數(shù)據(jù)：

$.initModule({
  moduleId: '#moduleId', // 填充表單所在的模塊
  url: 'XXXXXXX', // 獲取數(shù)據(jù)的url
  params: { // 請求參數(shù)
  },
  optFlag: '${myOptFlag}', // 只讀標識， detail為只讀
  formatter: function(data) { // 格式化數(shù)據(jù)
   // 格式化邏輯
    return data;
  },
  callback: function(d) { // 獲取成功后回調(diào)，d為接口返回數(shù)據(jù)
  }
});

驗證表單：

$('#formId').formValid(<Boolean>);

參數(shù)：

• {Boolean} 是否不彈出驗證氣泡，默認flase

返回：

• {Boolean} 表單填寫是否正確

修改tab頁簽的url：

常見于保存申請表單后，開放附件頁簽并修改其url的參數(shù)

$.resetTabUrl('applyTabs', 1, ['businessKey', 'projectId'], [id1, id2]);

參數(shù)：

• {String}param1: tabs標簽ID
• {Number}param2: 要修改的tab索引
• {Array}param3: url的參數(shù)列表
• {Array}param4: 參數(shù)列表對應的值

修改datagrid的url：

常見于保存申請表單后，刷新可編輯表格

$.resetDataGridUrl('datagridId', ['projectId', 'isRegulation'], [projectId, 'true'])

參數(shù)：

• {String}param1: datagrid標簽ID
• {Array}param2: url的參數(shù)列表
• {Array}param3: 參數(shù)列表對應的值

校驗可編輯表格：

常見于保存、流轉前的校驗

if (validateDatagrid('datagridId')) { ... }

參數(shù)：

• {String}param1: datagrid標簽ID

返回：

• {Boolean}校驗結果

判斷可編輯表格是否有數(shù)據(jù)：

常見于保存、流轉前的必填校驗

if ( !$('#datagrid').datagrid('getRows').length ) {
  tip('請編輯用章信息');
  return false;
}

獲取可編輯表格的編輯數(shù)據(jù)：

常見于保存前設置可編輯表格的編輯數(shù)據(jù)

var sealInfo = getEditData("datagrid", true);
$('#pageId').find('[name="sealInput"]').val(sealInfo.insertedRows || []);
$('#pageId').find('[name="sealUpdate"]').val(sealInfo.updatedRows || []);
$('#pageId').find('[name="sealDelete"]').val(sealInfo.deletedRows || []);

禁用可編輯表格的某些列：

常見于某些流程環(huán)節(jié)的可編輯表格要禁用某些列

banColumn = ['name', 'portions', 'isStamp', 'remark'];
$.each(banColumn, function(index, item) {
  var e = $('#datagrid').datagrid('getColumnOption', item);
  e.editor = {};
});

根據(jù)projectId動態(tài)獲取下拉框選項：

$.ajax({
  url: 'XXXXXXXXXXXXX&projectId=' + projectId,
  type: 'POST',
  dataType: 'json',
  success: function(data) {
    if (Array.isArray(data))
      $(combobox).combobox('loadData', data);
  }
 })

清空tab內(nèi)容

常用于兩個頁簽調(diào)用相同模塊時產(chǎn)生沖突的情況

$('#tabId').clearTabOnSelect('項目框架資料');

$('#tabId').clearTabOnSelect(['項目框架資料', '項目明細資料']);