From d8cbe91e52f94572f66e0c23c6c75737143f2b08 Mon Sep 17 00:00:00 2001
From: children117cl <278950112@qq.com>
Date: 星期四, 13 五月 2021 19:09:40 +0800
Subject: [PATCH] 新增表单验证方法，引入在rule的validator调用
---
src/components/WangEnduit/index.vue | 2
src/utils/form_validate.js | 34 ++++++++++
src/utils/form_rules_validators.js | 95 +++++++++++++++++++++++++++++++
src/styles/element-ui.scss | 15 ++++
4 files changed, 142 insertions(+), 4 deletions(-)
diff --git a/src/components/WangEnduit/index.vue b/src/components/WangEnduit/index.vue
index b5ed31b..648b738 100644
--- a/src/components/WangEnduit/index.vue
+++ b/src/components/WangEnduit/index.vue
@@ -87,7 +87,7 @@
formData.append('file', files[0])
self.postFN(
{
- url: 'admin/image/upload',
+ url: 'admin/image/upload?folderCode=IMG',
header: { 'Content-Type': 'multipart/form-data' },
params: formData,
mockData: {
diff --git a/src/styles/element-ui.scss b/src/styles/element-ui.scss
index 7b28e5b..ee9ef25 100644
--- a/src/styles/element-ui.scss
+++ b/src/styles/element-ui.scss
@@ -108,4 +108,17 @@
.el-upload-list__item-thumbnail{
object-fit: contain;
}
-}
\ No newline at end of file
+}
+
+// 璇勪环缁勪欢
+.mini-star .el-rate__icon{
+ margin-right: 0;
+}
+.large-star .el-rate{
+ line-height: 32px;
+}
+.large-star .el-rate__icon{
+ font-size: 26px;
+ margin-right: 0;
+ line-height: 32px;
+}
diff --git a/src/utils/form_rules_validators.js b/src/utils/form_rules_validators.js
new file mode 100644
index 0000000..abf613c
--- /dev/null
+++ b/src/utils/form_rules_validators.js
@@ -0,0 +1,95 @@
+/**
+ * 閫氱敤鐢熸垚琛ㄥ崟瑙勫垯楠岃瘉
+ */
+import form_validate from './form_validate'
+
+/**
+ * @description 璁剧疆椤甸潰鏁版嵁锛岄�氬父鐢ㄦ潵娓呯┖鏁版嵁
+ * @example setData.call(this)
+ * @param {string} key 璁剧疆鐨勫瓧娈�
+ * @param {object} context 浣跨敤this.$set鏃堕渶瑕佺敤鐨勫煙
+ * @param {*} value 璁剧疆鐨勫��
+ */
+// function $setData(key, context, value) {
+// if (context) {
+// this.$set(context, key, value)
+// } else {
+// this[key] = value
+// }
+// }
+
+/**
+ * @description 鍒涘缓鏈枃浠剁殑鐢熸垚validator鏂规硶
+ * @param {string} validateName 鍦� form_validate.js 涓殑閿��
+ * @param {string} def_tips 榛樿鎻愮ず
+ * @returns {function}
+ */
+function createValidatorFn(validateName, def_tips) {
+ return function(tips = def_tips) {
+ return (rule, _value, callback) => {
+ if (!form_validate[validateName](_value)) {
+ // 闃绘鎻愪氦
+ callback(new Error(tips))
+ } else {
+ callback()
+ }
+ }
+ }
+}
+
+export default {
+ /**
+ * @description 楠岃瘉鐢靛瓙閭
+ * @example form_rules_validators.validatorEmail.call(this, tips)
+ * @param {string} key 璁剧疆鐨勫瓧娈碉紝蹇呭～
+ * @param {objext} context 浣跨敤this.$set鏃堕渶瑕佺敤鐨勫煙
+ * @param {*} value 涓嶄负undefined锛屼綔涓洪噸缃瀛楁鐨勫��
+ * @param {string} tips 鎻愮ず鏂囨
+ * @returns {function} 杩斿洖涓�涓獀alidator
+ */
+ validatorEmail: createValidatorFn('validateEmail', '鐢靛瓙閭鏍煎紡涓嶆纭�'),
+
+ /**
+ * @description 楠岃瘉鎵嬫満鍙风爜
+ * @example form_rules_validators.validatorMobilePhoneNumber.call(this, tips)
+ * @param {string} key 璁剧疆鐨勫瓧娈碉紝蹇呭～
+ * @param {objext} context 浣跨敤this.$set鏃堕渶瑕佺敤鐨勫煙
+ * @param {*} value 涓嶄负undefined锛屼綔涓洪噸缃瀛楁鐨勫��
+ * @param {string} tips 鎻愮ず鏂囨
+ * @returns {function} 杩斿洖涓�涓獀alidator
+ */
+ validatorMobilePhoneNumber: createValidatorFn('validateMobilePhoneNumber', '鎵嬫満鍙风爜鏍煎紡涓嶆纭�'),
+
+ /**
+ * @description 楠岃瘉閲戦
+ * @example form_rules_validators.validatorMoney.call(this, tips)
+ * @param {string} key 璁剧疆鐨勫瓧娈碉紝蹇呭～
+ * @param {objext} context 浣跨敤this.$set鏃堕渶瑕佺敤鐨勫煙
+ * @param {*} value 涓嶄负undefined锛屼綔涓洪噸缃瀛楁鐨勫��
+ * @param {string} tips 鎻愮ず鏂囨
+ * @returns {function} 杩斿洖涓�涓獀alidator
+ */
+ validatorMoney: createValidatorFn('validateMoney', '閲戦鏍煎紡涓嶆纭�'),
+
+ /**
+ * @description 楠岃瘉姝ｆ暣鏁�
+ * @example form_rules_validators.validatorMoney.call(this, tips)
+ * @param {string} key 璁剧疆鐨勫瓧娈碉紝蹇呭～
+ * @param {objext} context 浣跨敤this.$set鏃堕渶瑕佺敤鐨勫煙
+ * @param {*} value 涓嶄负undefined锛屼綔涓洪噸缃瀛楁鐨勫��
+ * @param {string} tips 鎻愮ず鏂囨
+ * @returns {function} 杩斿洖涓�涓獀alidator
+ */
+ validatorPlusInt: createValidatorFn('validatePlusInt', '蹇呴』涓烘鏁存暟'),
+
+ /**
+ * @description 楠岃瘉澶т簬绛変簬0鐨勬暣鏁�
+ * @example form_rules_validators.validatorMoney.call(this, tips)
+ * @param {string} key 璁剧疆鐨勫瓧娈碉紝蹇呭～
+ * @param {objext} context 浣跨敤this.$set鏃堕渶瑕佺敤鐨勫煙
+ * @param {*} value 涓嶄负undefined锛屼綔涓洪噸缃瀛楁鐨勫��
+ * @param {string} tips 鎻愮ず鏂囨
+ * @returns {function} 杩斿洖涓�涓獀alidator
+ */
+ validatorPlusIntAndZero: createValidatorFn('validatePlusIntAndZero', '蹇呴』涓哄ぇ浜庣瓑浜�0鐨勬暣鏁�')
+}
diff --git a/src/utils/form_validate.js b/src/utils/form_validate.js
index bf72f9b..e4bdc7f 100644
--- a/src/utils/form_validate.js
+++ b/src/utils/form_validate.js
@@ -1,10 +1,12 @@
/**
* 閫氱敤琛ㄥ崟楠岃瘉
*/
+
export default {
/**
* 楠岃瘉鐢靛瓙閭
* @param {string} value 鐢靛瓙閭瀛楃涓�
+ * @returns {boolean}
*/
validateEmail(value) {
return /^(\w-*\.*)+@(\w-?)+(\.\w{2,})+$/.test(value)
@@ -12,10 +14,38 @@
/**
* 楠岃瘉鎵嬫満鍙风爜
- * @param {string} value 鎵嬫満鍙风爜
+ * @param {string|number} value 鎵嬫満鍙风爜
+ * @returns {boolean}
*/
validateMobilePhoneNumber(value) {
- return /^1[0-9][0-9]\d{8}$/.test(value)
+ return /^1[0-9][0-9]\d{8}$/.test(value + '')
+ },
+
+ /**
+ * 楠岃瘉閲戦锛屽厑璁�0
+ * @param {string|number} value 閲戦
+ * @returns {boolean}
+ */
+ validateMoney(value) {
+ return /^0|[1-9][0-9]*(\.\d{2})?$/.test(value + '')
+ },
+
+ /**
+ * 楠岃瘉姝ｆ暣鏁帮紝涓嶅厑璁�0
+ * @param {string|number} value 鏁板瓧
+ * @returns {boolean}
+ */
+ validatePlusInt(value) {
+ return /^[1-9][0-9]*$/.test(value + '')
+ },
+
+ /**
+ * 楠岃瘉姝ｆ暣鏁帮紝鍏佽0
+ * @param {string|number} value 鏁板瓧
+ * @returns {boolean}
+ */
+ validatePlusIntAndZero(value) {
+ return /^[0-9][0-9]*$/.test(value + '')
}
}
--
Gitblit v1.8.0