Fedex / imac-vue

Go to a project
Toggle navigation Toggle navigation pinning
Elements-SY
2cb4439a 1 parent 358a2ce3

modify

Inline Side-by-side
Showing 2 changed files with 39 additions and 98 deletions
......@@ -442,18 +442,6 @@ export default {
unbind: function (el) {
el.removeEventListener("input", el.handler);
},
/*
-7 +7
0~7
或者 空
不能输入小数点
Math.abs(-7);
不能输入和选择未来日期，
不能输入和选择历史日期,
选择时间范围,
只能输入四位正整数，不能够有小数点,
只能输入四位正整数保留3位小数,
*/
},
},
filters: {
......@@ -575,6 +563,10 @@ export default {
},
// input失焦事件
inputBlur(name) {
let coin = {
minCNYCustomVal: "CNY",
minSUDCustomVal: "USD",
};
if (name == "minWeight") {
this.validateMaxWeight("maxWeight");
this.validateMinWeight(name);
......@@ -592,18 +584,10 @@ export default {
this.validateMaxPieces(name);
}
if (name == "minCNYCustomVal" || name == "minSUDCustomVal") {
let coin = {
minCNYCustomVal: "CNY",
minSUDCustomVal: "USD",
};
this.validateMaxCustomVal(coin[name]);
this.validateMinCustomVal(coin[name]);
}
if (name == "maxCNYCustomVal" || name == "maxSUDCustomVal") {
let coin = {
maxCNYCustomVal: "CNY",
maxSUDCustomVal: "USD",
};
this.validateMinCustomVal(coin[name]);
this.validateMaxCustomVal(coin[name]);
}
......
......@@ -137,79 +137,38 @@ export default {
validateMinPieces(name) {
// 校验输入的规则（只能输入正整数）
if (/^\d+$/.test(Number(this.queryForm[name]))) {
/*
【表单校验分析步骤】如下：
1、校验合规数字（只能输入正整数）；
2、校验一种所有的表单域都为空的情况下 & 所有表单域都不为空的情况下；
3、所有表单域都为空的情况下最好办，直接返回false；
4、所有表单都不为空的情况下：这种情况就是做自定义校验；
5、自定义校验符合规则的返回true否则返回false；
提示：在做校验数字规则一定要注意无理数(E & e)；
:rule="{
el: '.el' || document.querySelector(el), // 获取元素
rule: [], // 规则
value: scope.row, // 校验的值
message: '', // 提示语
style: {}, // 设置提示语文字
hoverMessage: false, // 是否通过鼠标hover时提示Error
required: true,
trigger: 'blur',
}"
通常情况下表单校验都是单列校验，也就是说每个表单域的校验都是独立的而不受其他表单域的校验的牵涉；
但是有些情况下，我们的表单校验可能有多列并行校验，比如说重量区间，最大重量和最小重量两个表单域，
最大重量不能小于最小重量。
提交表单的时候获取布尔值或者每一个表单校验的
单列校验或者多列(并行)校验，
使用自定义指令做表单校验：
当校验不合规则时，一种是插入节点给文本提示的同时让input文本框变成红色的；
一种是让文本框变成红色的同时鼠标hover的时候弹出悬浮框提示；
当提交表单的时候不合规则的表单域全部红色描边，并且报错文本提示语
提交表单的时候
*/
if (this.queryForm[name] && this.queryForm.maxNumOfPieces) {
// 左区间大于右区间
if (
Number(this.queryForm[name]) > Number(this.queryForm.maxNumOfPieces)
) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数不得大于最多件数";
} else if (
Number(this.queryForm[name]) == null &&
Number(this.queryForm.maxNumOfPieces) == null
Number(this.queryForm[name]) < 1 ||
Number(this.queryForm.maxNumOfPieces) < 1
) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能为空";
} else if (
Number(this.queryForm[name]) == 0 &&
Number(this.queryForm.maxNumOfPieces) == 0
) {
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能小于1";
} else {
this.$refs.minNumOfPieces.innerHTML = "";
return true;
}
} else if (
this.queryForm[name] !== null &&
this.queryForm[name] !== ""
) {
if (Number(this.queryForm[name]) < 1) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能为0";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能小于1";
} else if (Number(this.queryForm[name]) > 100) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能大于100";
} else {
this.$refs.minNumOfPieces.innerHTML = "";
return true;
}
} // 不能为空，不能等于0，不能大于指定的数
else if (Number(this.queryForm[name]) == null) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能为空";
} else if (Number(this.queryForm[name]) == 0) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能为0";
} else if (Number(this.queryForm[name]) > 100) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能大于100";
} else {
this.$refs.minNumOfPieces.innerHTML = "";
return true;
}
} else {
this.$refs.minNumOfPieces.innerHTML = "";
......@@ -221,45 +180,43 @@ export default {
validateMaxPieces(name) {
// 校验输入的规则（只能输入正整数）
if (/^\d+$/.test(Number(this.queryForm[name]))) {
if (this.queryForm[name] && this.queryForm.maxNumOfPieces) {
if (this.queryForm[name] && this.queryForm.minNumOfPieces) {
if (
Number(this.queryForm[name]) < Number(this.queryForm.minNumOfPieces)
) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最大件数不得小于最少件数";
} else if (
Number(this.queryForm[name]) == null &&
Number(this.queryForm.minNumOfPieces) == null
) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能为空";
} else if (
Number(this.queryForm[name]) == 0 &&
Number(this.queryForm.minNumOfPieces) == 0
Number(this.queryForm[name]) < 1 ||
Number(this.queryForm.minNumOfPieces) < 1
) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能为0";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能小于1";
return false;
} else {
this.$refs.minNumOfPieces.innerHTML = "";
return true;
}
} else if (Number(this.queryForm[name]) == null) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能为空";
} else if (Number(this.queryForm[name]) == 0) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能为0";
} else if (Number(this.queryForm[name]) > 100) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能大于100";
} else if (
this.queryForm[name] !== null &&
this.queryForm[name] !== ""
) {
if (Number(this.queryForm[name]) < 1) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能小于1";
} else if (Number(this.queryForm[name]) > 100) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能大于100";
} else {
this.$refs.minNumOfPieces.innerHTML = "";
return true;
}
} else {
this.$refs.minNumOfPieces.innerHTML = "";
return true;
}
} else {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.maxNumOfPieces.innerHTML = "请输入有效件数";
this.$refs.minNumOfPieces.innerHTML = "请输入有效件数";
return false;
}
},
......