锘?/鏁版嵁绫诲瀷 var frameUi_validateForm = window.frameUi_validateForm || {}; frameUi_validateForm.validateIdx =1; var validateDataTypes = {}; //楠岃瘉鎸囧畾 Vue.directive('validate', { //鍒濆鍖栨垨缁勪欢涓殑key鏀瑰彉鏃朵細瑙﹀彂 bind: function (el, binding, vnode, oldVnode) { var vue = vnode.context; var config = binding.value; var validateFormItems = vue.validateFormItems; if (validateFormItems == undefined) { validateFormItems = []; vue.validateFormItems = validateFormItems; } config.el = el; var idx = frameUi_validateForm.validateIdx; var oldIdx = -1; if (binding.oldValue && binding.oldValue.idx) { oldIdx = binding.oldValue.idx; } else { oldIdx = binding.value.idx; } if (oldIdx == undefined) { oldIdx = -1; } if (oldIdx >= 0) { config.idx = oldIdx;//搴忓彿 config.binded = true; var arrayIndex = validateFormItems.findIndex(function (item) { return item.idx == oldIdx}); if (arrayIndex >= 0) { validateFormItems[arrayIndex] = config; } } else { config.binded = true; config.idx = idx;//搴忓彿 validateFormItems.push(config); } frameUi_validateForm.validateIdx++; }, unbind: function (el, binding, vnode, oldVnode) { //v-if鎴杒ey鏀瑰彉浼氳Е鍙 var idx = -1; if (binding.oldValue != undefined) { idx = binding.oldValue.idx; } else { idx=binding.value.idx; } if (idx == undefined) { return; } var vue = vnode.context; var validateFormItems = vue.validateFormItems; var itemIdx = validateFormItems.findIndex(function (item) { return item.idx == idx }); if (itemIdx >= 0) { var config = binding.value; config.binded = false; validateFormItems[itemIdx] = config; } }, update: function (el, binding, vnode, oldVnode) { var vue = vnode.context; var validateFormItems = vue.validateFormItems; var idx = binding.oldValue.idx; var config = binding.value; config.el = el; config.idx = idx;//搴忓彿 config.binded = true; if (idx>=0) { var arrayIndex = validateFormItems.findIndex(function (item) { return item.idx == idx }); { validateFormItems[arrayIndex] = config; } } } }); //vue鍏ㄥ眬楠岃瘉 Vue.mixin({ methods: { //楠岃瘉 validateForm: function (thisOptions, validateIndex) { var vue = this; var defaultOptions = { showAllError: true, dataTypes: {},//杩欓噷澹版槑鐨勬槸灞€閮ㄦ暟鎹被鍨?涔熷彲浠ラ€氳繃鍏ㄥ眬validateDataTypes鍦ㄥ閮ㄥ0鏄 tipsStyle: 1, //0,锛歛lert锛 1锛歮sg 2,琛ㄥ崟鍓嶅悗 ,3锛歛ll errorClass: "validate-error", tipsErrorAddClass: "validate-tips-error", allTipsBoxTarget: ".validate-all-tips-box", beforeCheck: null, beforeSubmit: null }; var defaultOptions = extend({}, defaultOptions, thisOptions); vue.validateFormConfig = defaultOptions; var showAllError = defaultOptions.showAllError; var dataTypes = defaultOptions.dataTypes; var tipsStyle = defaultOptions.tipsStyle; if (tipsStyle != 2) { showAllError = false; } var beforeCheck = defaultOptions.beforeCheck; var beforeSubmit = defaultOptions.beforeSubmit; var errorClass = defaultOptions.errorClass; //楠岃瘉鍑洪敊鍚庤〃鍗曟坊鍔犵殑鏍峰紡 var tipsErrorClass = defaultOptions.tipsErrorAddClass; //閿欒鎻愮ず娣诲姞鐨勬牱寮忥紝tipsStyle涓?鏃舵湁鏁 var allTipsBoxTarget = defaultOptions.allTipsBoxTarget; //form绗竴琛屾垨鏈€鍚庝竴琛屾彁绀轰俊鎭殑ul鏍峰紡锛宼ipsStyle涓?鏃舵湁鏁 var validateFormItems = vue.validateFormItems; //console.log(validateFormItems) if (validateFormItems == undefined) { return true; } //寮€濮嬮獙璇 var startValidate = function () { var canExecute = true; if (typeof (beforeCheck) == "string") { if (beforeCheck != "") { canExecute = eval(beforeExecute); } } else if (typeof (beforeCheck) == "function") { canExecute = beforeCheck(); } if (typeof canExecute != "boolean") { canExecute = true; } var validaResult; if (canExecute) { validaResult = validating(); //寮€濮嬮亶鍘嗛獙璇 } else { return false; } if (!validaResult) { return false; } if (typeof (beforeSubmit) == "string") { if (beforeSubmit != "") { canExecute = eval(beforeSubmit); } } else if (typeof (beforeSubmit) == "function") { canExecute = beforeSubmit(); } if (typeof canExecute != "boolean") { canExecute = true; } return canExecute; }; //閬嶅巻鎵€鏈夋暟鎹紝杩涜楠岃瘉 var validating = function () { var errorIndex = 0; //鑾峰彇鍒伴敊璇殑搴忓彿 var validateResult = true; var $allTipsBoxTarget = null; if (allTipsBoxTarget) { document.querySelector(allTipsBoxTarget); } if ($allTipsBoxTarget != null) { $allTipsBoxTarget.innerHTML = ""; } for (var i = 0; i < validateFormItems.length; i++) { var validateConfig = validateFormItems[i]; if (!validateConfig.binded) { continue; } var result = validateItem(validateConfig, errorIndex); if (!result) { errorIndex++; validateResult = validateResult && result; } if (!showAllError) { if (result == false) { return false; //濡傛灉涓嶉渶瑕佹樉绀烘墍鏈夐敊璇俊鎭紝鍒欏姞return false璺冲嚭each寰幆 } } } return validateResult; }; var validateItem = function (validateConfig, errorIndex) { var defaultConfig = { dataType: "*", focusTarget: "", tipsTarget: "", regexp: "", getLengthByByte:false,minLength:0,maxLength: 0, nullMsg: "鍊间笉鑳戒负绌猴紒", errorMsg: "濉啓閿欒锛?, autoTruncated: true, maxLengthErrorMsg: "涓嶈兘瓒呰繃涓獅0}瀛楃锛?, minLengthErrorMsg: "鏈€灏戣緭鍏ヤ釜{0}瀛楃锛?, ignore: false, ignoreEmpty: false,compare: null, checkUrl: "", checkData: null, checkError: "", additionals: "", beforeExecute: null, execute: null }; validateConfig = extend(defaultConfig, validateConfig); var $el = validateConfig.el; var validateTarget = validateConfig.validateTarget; var ignore = validateConfig.ignore; var focusTarget = validateConfig.focusTarget; var $focusTarget = null; if (focusTarget) { $focusTarget = document.querySelector(focusTarget); } else { $focusTarget = $el.querySelector(".el-input__inner"); } if (ignore) { return true;//缁х画涓嬩竴涓惊鐜 } var result = validateDataType(validateConfig); if ($focusTarget != null) { if (showAllError) { if (errorIndex == 0) { if (result) { $focusTarget.classList.remove(errorClass); } else { $focusTarget.focus(); $focusTarget.classList.add(errorClass); } } } else { if (result) { $focusTarget.classList.remove(errorClass); } else { $focusTarget.focus(); $focusTarget.classList.add(errorClass); } } } return result; }; //楠岃瘉鏁版嵁绫诲瀷锛屽湪Validating涓皟鐢紝琛ㄥ崟鐨勭殑input鍜 propertychange浜嬩欢浼氬悓鏃惰Е鍙 var validateDataType = function (validateConfig) { var dataType = validateConfig.dataType.trim(); var regExpStr = validateConfig.regexp; var getLengthByByte = validateConfig.getLengthByByte; var minLength = validateConfig.minLength; var maxLength = validateConfig.maxLength; var minLengthErrorMsg = validateConfig.minLengthErrorMsg; var maxLengthErrorMsg = validateConfig.maxLengthErrorMsg; var autoTruncated = validateConfig.autoTruncated; //瓒呰繃鏈€澶ч暱搴︽槸鍚﹁嚜鍔ㄦ埅鏂 var nullMsg = validateConfig.nullMsg; var errorMsg = validateConfig.errorMsg; var ignoreEmpty = validateConfig.ignoreEmpty; var compare = validateConfig.compare; var checkUrl = validateConfig.checkUrl; var checkError = validateConfig.checkError; var checkAdditionals = validateConfig.additionals; var tipsTarget = validateConfig.tipsTarget; //琛ㄥ崟鎻愮ず淇℃伅鐨剆pan瀹瑰櫒鏍峰紡锛屾病鏈夊畾涔夊垯鍔ㄦ€佹坊鍔狅紝tipsStyle涓?鏃舵湁鏁 var validateTarget = validateConfig.validateTarget; var beforeExecute = validateConfig.beforeExecute; var execute = validateConfig.execute; var result = false; var gets = validateConfig.data; var resultType; if (gets === undefined || gets === null) { gets = ""; } var noMoreValidate = false;//琛ㄧず鏄惁缁х画鍚庨潰鐨勯獙璇侊紝瀵硅〃鍗曞姣旓紝杩滅▼ajax if (!validateConfig.hasOwnProperty("data")) { noMoreValidate = true; result = true; } if (!noMoreValidate) { if (gets == "" && ignoreEmpty == true) //鍏堣繘琛岄潪绌哄拷鐣ラ獙璇 { noMoreValidate = true; result = true; } } //鎵ц鍓 if (!noMoreValidate && !isNullOrEmpty(beforeExecute)) { if (typeof (beforeExecute) == "string") { if (beforeExecute != "") { result = eval(beforeExecute); } } else if (typeof (beforeExecute) == "function") { result = beforeExecute(validateConfig); } resultType = typeof (result); if (resultType != "boolean") { noMoreValidate = true; } else if (!result) { noMoreValidate = true; } } //鎺ヤ笅鏉ヨ繘琛屾渶灏忛暱搴﹂獙璇 if (!noMoreValidate) { if (minLength > 0) { var currentLength = gets.strLength(getLengthByByte); if (currentLength == 0) { result = nullMsg; } else if (currentLength < minLength) { result = minLengthErrorMsg.replace("{0}", minLength); } else { result = true; } resultType = typeof (result); if (resultType != "boolean") { noMoreValidate = true; } else if (!result) { noMoreValidate = true; } } } //鎺ヤ笅鏉ヨ繘琛屾渶澶ч暱搴︽埅鍙 if (!noMoreValidate && typeof (gets) == "string") { var currentLength = gets.strLength(getLengthByByte); if (maxLength > 0 && currentLength > maxLength) { if (autoTruncated) { //鑷姩鎴柇 var $input = validateConfig.el.querySelector(".el-input__inner"); if ($input != null) { $input.value = gets.left(maxLength,getLengthByByte); $input.dispatchEvent(new Event("input"));//瑙﹀彂v-model $input.dispatchEvent(new Event("change"));//瑙﹀彂v-model } } else { result = maxLengthErrorMsg.replace("{0}", maxLength); noMoreValidate = true; } } } //鐒跺悗鍐嶈繘琛屾暟鎹被鍨嬮獙璇 if (!noMoreValidate) { if (regExpStr != "")//鏈夋鍒欎紭鍏堢敤姝e垯鍖归厤 { var reg = new RegExp(regExpStr); result = reg.test(gets); } else { switch (dataType) { case "": case "*": result = validateDataTypes.defaultDataType(gets, validateConfig); break; default: var dataTypeFun = dataTypes[dataType]; //鍏堟娴媎ataTypes鍐呴儴鏄惁鏈夊畾涔夛紝涔熷彲浠ョ敤dataTypes.hasOwnProperty(dataType)鍒ゆ柇 if (dataTypeFun == undefined) //濡傛灉鎵句笉鍒板垯鍒皏alidateDataTypes涓幓鎵 { dataTypeFun = validateDataTypes[dataType]; } if (typeof (dataTypeFun) != "function") { alert(dataType + "鏁版嵁绫诲瀷鏈畾涔?); return false; } else { result = dataTypeFun(gets, validateConfig);//鍙兘杩斿洖瀛楃涓诧紝true鎴杅lase,瀛楃涓查粯璁や负false; if (typeof (result) == "string") { errorMsg = result; result = false; } } break; } } } resultType = typeof (result); if (resultType != "boolean") { noMoreValidate = true; } else if (!result) { noMoreValidate = true; } ///鐒跺悗鍐嶈繘琛屾瘮杈冮獙璇 if (!noMoreValidate) { if (compare != null)//鍜屽叾浠栧€煎鍒 { if (gets != compare) { result = errorMsg; } } } resultType = typeof (result); if (resultType != "boolean") { noMoreValidate = true; } else if (!result) { noMoreValidate = true; } //杩涜execute楠岃瘉 if (!noMoreValidate) { if (typeof (execute) == "string") { if (execute != "") { result = eval(execute); } } else if (typeof (execute) == "function") { result = execute(validateConfig); } } resultType = typeof (result); if (resultType != "boolean") { noMoreValidate = true; } else if (!result) { noMoreValidate = true; } //杩涜杩滅▼楠岃瘉 if (!noMoreValidate) { if (checkUrl != "" && gets != "")//杩滅▼楠岃瘉 { var serverData = { data: gets }; var checkResult = ajax({ type: "post", url: checkUrl, data: serverData, async: false });//鍚屾鏂规硶 checkResult = jsonParse(checkResult); if (checkResult.State == 1) { } else if (checkResult.State == 0) { if (checkError != "") { result = checkError; } else { result = checkResult.Msg; } } else { result = checkResult.Msg; } } } resultType = typeof (result); //姣忔楠岃瘉鍚庨兘闇€瑕侀噸鏂拌幏鍙 if (resultType == "boolean") { } else if (resultType == "string") //杩斿洖瀛楃涓插垯琛ㄧず涓嶆垚鍔 { nullMsg = errorMsg = result; result = false; } else { result = false; nullMsg = errorMsg = "濉啓閿欒锛堟暟鎹被鍨嬪繀椤昏繑鍥瀊ool鎴栧瓧绗︿覆)锛?; } showTips(result, gets, nullMsg, errorMsg, validateConfig); return result; }; //鏄剧ず鎻愮ず淇℃伅 var showTips = function (result, gets, nullMsg, errorMsg, validateConfig) { var tipsMsg = ""; if (gets.toString() == "") { tipsMsg = nullMsg; } else { tipsMsg = errorMsg } switch (tipsStyle.toString()) { case "1": tipsStyle1(result, tipsMsg, validateConfig); //渚濊禆layer.js break; case "2": //html鏄剧ず tipsStyle2(result, tipsMsg, validateConfig); break; case "3": // tipsStyle3(result, tipsMsg, validateConfig); break; default: defaultTipsStyle(result, tipsMsg, validateConfig); break; } }; //榛樿椋庢牸锛岄噰鐢╝lert var defaultTipsStyle = function (result, tipsMsg, validateConfig) { if (result) { return; } //console.log(validateConfig.el); alert(tipsMsg); }; var tipsStyle1 = function (result, tipsMsg, validateConfig) { if (result) { return; } //console.log(validateConfig.el); vue.$message({ message: tipsMsg, type: "warning", showClose: true }); }; //瀹瑰櫒鍐呴儴鏄剧ず var tipsStyle2 = function (result, tipsMsg, validateConfig) { var tipsTarget = validateConfig.tipsTarget; var $item = validateConfig.el; var $tipBox = null; if (tipsTarget) { $tipBox = document.querySelector(tipsTarget); } if ($tipBox != null) { var defaultText = $tipBox.getAttribute("data-default-text"); if (defaultText == undefined) { defaultText = $tipBox.innerHTML; $tipBox.setAttribute("data-default-text", defaultText); } if (result) { $tipBox.innerHTML = defaultText $tipBox.classList.remove(tipsErrorClass); } else { $tipBox.innerHTML = tipsMsg; $tipBox.classList.add(tipsErrorClass); } showAllError = true; } else { if (!result) { console.log(validateConfig.el); ui.msg({ content: tipsMsg, type: "warning" }); showAllError = false; } } }; //椤堕儴鏄剧ず var tipsStyle3 = function (result, tipsMsg) { var $tipsBox = document.querySelector(allTipsBoxTarget); if ($tipsBox != null) { if (result) { $tipsBox.innerHTML = ""; //閬垮厤椤甸潰璺冲姩 return; } //console.log(validateConfig.el); $tipsBox.innerHTML = tipsMsg; } }; if (validateIndex == undefined) { return startValidate(); } else { if (tipsStyle == 2) { return validateItem(validateFormItems[validateIndex], 0); //寮瑰嚭鎻愮ず涓嶉渶瑕佸崟涓獙璇侊紒 } } }, } }) //榛樿楠岃瘉 validateDataTypes.defaultDataType = function (gets, itemConfig) { if (Array.isArray(gets)) { if (gets.length == 0) { gets = ""; } } if (gets == null || gets == undefined) { return false; } if (gets.toString().trim() == "") { return false; } return true; } //鍖归厤瀛楃涓 validateDataTypes.string = function (gets, itemConfig) { if (isStr(gets)) { return true } else { return false; } } //鍖归厤鏁板€煎瀷,榛樿鏈€灏忓€兼槸-2147483647锛岄粯璁ゆ渶澶у€兼槸2147483647,鏀寔灏忔暟 validateDataTypes.numeric = function (gets, itemConfig) { var defaultOptions = { max: 2147483647, min: -2147483647 }; defaultOptions = extend({}, defaultOptions, itemConfig); var max = defaultOptions.max; var min = defaultOptions.min; if (!isNumeric(gets)) { return false } if (typeof (gets) == "string"){ gets = parseFloat(gets); } if (gets > max) { return false; } else if (gets < min) { return false; } return true; } //鍖归厤璐у竵绫诲瀷 validateDataTypes.money = function (gets, itemConfig) { var reg = /^([\u0024\u00A2\u00A3\u00A4\u20AC\u00A5\u20B1\20B9\uFFE5]\s*)(\d+,?)+\.?\d*\s*$/; return reg.test(gets) } //鍖归厤涓枃 validateDataTypes.chinese = function (gets, itemConfig) { var reg = /^[\u4e00-\u9fa5]+$/; return reg.test(gets) } validateDataTypes.email = function (gets, itemConfig) { if (isEmail(gets)) { return true; } else { return false; } } validateDataTypes.mobile = function (gets, itemConfig) { if (isMobile(gets)) { return true; } else { return false; } } validateDataTypes.editor = function (gets, itemConfig) { var editorId = itemConfig.el.getAttribute("name"); if (gets == "") { if (editorId != null) { var editorObj = UE.getEditor(editorId); editorObj.focus(true); } return false; } else { return true; } } validateDataTypes.username = function (gets, itemConfig) { if (isNullOrEmpty(gets)) { return "璇峰~鍐欑敤鎴峰悕!"; } else if (isNumeric(gets)) { return "鐢ㄦ埛鍚嶄笉鑳戒负绾暟瀛?"; } var len = gets.strLength(true); if (len < 4) { return "鐢ㄦ埛鍚嶆渶灏戠敱4涓瓧绗︾粍鎴愶紝涓枃鍗犱袱涓瓧绗︼紒"; } else if (len > 16) { return "鐢ㄦ埛鍚嶄笉鑳借秴杩?6涓瓧绗︼紝涓枃鍗犱袱涓瓧绗?"; } if (!isUserName(gets)) { return "鐢ㄦ埛鍚嶄粎鏀寔涓嫳鏂囥€佹暟瀛楀拰涓嬪垝绾?"; } return true; } validateDataTypes.password = function (gets, itemConfig) { if (isNullOrEmpty(gets)) { return "璇峰~鍐欏瘑鐮?"; } if (includeChinese(gets)) { return "瀵嗙爜涓嶈兘鍖呭惈涓枃瀛楃!"; } var len = gets.strLength(); if (len < 6) { return "瀵嗙爜鏈€灏戠敱6涓瓧绗︾粍鎴?"; } else if (len > 20) { return "瀵嗙爜涓嶈兘瓒呰繃20涓瓧绗?"; } return true; } validateDataTypes.datetime = function (gets, itemConfig) { if (isDateTime(gets)) { return true; } else { return false; } } validateDataTypes.date = function (gets, itemConfig) { if (isDate(gets)) { return true; } else { return false; } } validateDataTypes.file = function (gets, itemConfig) { if (gets.indexOf(".") > 0 && gets.length >= 4 && gets.indexOf(".") < (gets.length - 1)) { return true; } else { return false } } //鍖归厤韬唤璇 validateDataTypes.idcard = function (gets, itemConfig) { var Wi = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2, 1];// 鍔犳潈鍥犲瓙; var ValideCode = [1, 0, 10, 9, 8, 7, 6, 5, 4, 3, 2];// 韬唤璇侀獙璇佷綅鍊硷紝10浠h〃X; if (gets.length == 15) { return isValidityBrithBy15IdCard(gets); } else if (gets.length == 18) { var a_idCard = gets.split("");// 寰楀埌韬唤璇佹暟缁 if (isValidityBrithBy18IdCard(gets) && isTrueValidateCodeBy18IdCard(a_idCard)) { return true; } return false; } return false; function isTrueValidateCodeBy18IdCard(a_idCard) { var sum = 0; // 澹版槑鍔犳潈姹傚拰鍙橀噺 if (a_idCard[17].toLowerCase() == 'x') { a_idCard[17] = 10;// 灏嗘渶鍚庝綅涓簒鐨勯獙璇佺爜鏇挎崲涓?0鏂逛究鍚庣画鎿嶄綔 } for (var i = 0; i < 17; i++) { sum += Wi[i] * a_idCard[i];// 鍔犳潈姹傚拰 } valCodePosition = sum % 11;// 寰楀埌楠岃瘉鐮佹墍浣嶇疆 if (a_idCard[17] == ValideCode[valCodePosition]) { return true; } return false; } function isValidityBrithBy18IdCard(idCard18) { var year = idCard18.substring(6, 10); var month = idCard18.substring(10, 12); var day = idCard18.substring(12, 14); var temp_date = new Date(year, parseFloat(month) - 1, parseFloat(day)); // 杩欓噷鐢╣etFullYear()鑾峰彇骞翠唤锛岄伩鍏嶅崈骞磋櫕闂 if (temp_date.getFullYear() != parseFloat(year) || temp_date.getMonth() != parseFloat(month) - 1 || temp_date.getDate() != parseFloat(day)) { return false; } return true; } function isValidityBrithBy15IdCard(idCard15) { var year = idCard15.substring(6, 8); var month = idCard15.substring(8, 10); var day = idCard15.substring(10, 12); var temp_date = new Date(year, parseFloat(month) - 1, parseFloat(day)); // 瀵逛簬鑰佽韩浠借瘉涓殑浣犲勾榫勫垯涓嶉渶鑰冭檻鍗冨勾铏棶棰樿€屼娇鐢╣etYear()鏂规硶 if (temp_date.getYear() != parseFloat(year) || temp_date.getMonth() != parseFloat(month) - 1 || temp_date.getDate() != parseFloat(day)) { return false; } return true; } } validateDataTypes.table = function (gets, itemConfig) { gets = gets.toString().trim(); if (isLStr(gets)) { return checkKey(gets); } else { return "琛ㄥ悕鍙兘鐢卞瓧姣嶏紝鏁板瓧鍜屼笅鍒掔嚎缁勬垚锛岃€屼笖棣栧瓧姣嶅繀椤绘槸鑻辨枃锛?; } } validateDataTypes.field = function (gets, itemConfig) { gets = gets.toString().trim(); if (isLStr(gets)) { return checkKey(gets); } else { return "瀛楁鍙兘鐢卞瓧姣嶏紝鏁板瓧缁勬垚锛岃€屼笖棣栧瓧姣嶅繀椤绘槸鑻辨枃锛?; } } function checkKey(str) { str = str.toLowerCase(); var keys = new Array("in", "as", "currentpage", "page", "pagesize", "order", "sa", "dbo", "system", "index", "by", "select", "from", "table", "tableid", "table_", "field_", "top", "asc", "desc", "count", "sum", "link", "update", "insert", "to", "values", "where", "delete", "join", "charge", "guid", "parentguid", "id"); if (keys.findIndex(function (item) { item == str }) >= 0) { return "瀵逛笉璧凤紝" + str + "涓鸿〃鍚嶆垨瀛楁鍚嶇殑灞忚斀璇嶏紝璇烽噸鍐欒缃?" } else { return true; } }