eoss-ui 0.6.94 → 0.6.96

package/packages/main/src/simplicity/userinfo.vue

@@ -1,308 +1,356 @@
-<template>
-  <es-form
-    ref="form"
-    :model="model"
-    :contents="forms"
-    class="es-user-info"
-    :autocomplete="false"
-    @submit="handleFormSubmit"
-  >
-    <template slot="other">
-      <slot></slot>
-    </template>
-  </es-form>
-</template>
-<script>
-import { updateUserInfo } from 'eoss-ui/src/config/api.js';
-import util from 'eoss-ui/src/utils/util';
-
-export default {
-  name: 'UserInfo',
-  props: {
-    secret: {
-      type: Boolean,
-      default: true
-    },
-    contents: Array,
-    value: {
-      type: Object,
-      default() {
-        return {};
-      }
-    }
-  },
-  data() {
-    return {
-      model: this.value
-    };
-  },
-  computed: {
-    forms() {
-      return this.contents
-        ? this.contents
-        : [
-            {
-              name: 'orgName',
-              label: '所属机构',
-              type: 'text',
-              disabled: true,
-              col: 6
-            },
-            {
-              name: 'depName',
-              label: '所属部门',
-              type: 'text',
-              disabled: true,
-              col: 6
-            },
-            {
-              name: 'idCard',
-              label: '身份证号',
-              type: 'text',
-              disabled: true,
-              col: 6
-            },
-            {
-              name: 'outCode',
-              label: '工号',
-              type: 'text',
-              disabled: true,
-              col: 6
-            },
-            {
-              name: 'phone',
-              placeholder: '联系电话',
-              label: '联系电话',
-              type: 'text',
-              col: 6
-            },
-            {
-              name: 'email',
-              placeholder: '电子邮箱',
-              label: '电子邮箱',
-              type: 'text',
-              rules: {
-                type: 'email',
-                message: '请输入正确的邮箱地址',
-                trigger: 'blur'
-              },
-              col: 6
-            },
-            {
-              name: 'officeTel',
-              placeholder: '座机号',
-              label: '座机号',
-              type: 'text',
-              rules: {
-                type: 'telephone'
-                //message: '请输入正确的邮箱地址',
-                //trigger: 'blur'
-              },
-              col: 6
-            },
-            {
-              name: 'oldpassword',
-              placeholder: '旧密码',
-              label: '旧密码',
-              type: 'text',
-              col: 6,
-              rules:
-                this.model.password || this.model.repassword
-                  ? {
-                      required: true,
-                      message: '请输入旧密码'
-                    }
-                  : {},
-              events: {
-                change: () => {
-                  if (
-                    !this.model.repassword &&
-                    !this.model.oldpassword &&
-                    !this.model.repassword
-                  ) {
-                    this.$refs.form.clearValidate();
-                  }
-                }
-              }
-            },
-            {
-              name: 'password',
-              placeholder: '新密码',
-              label: '新密码',
-              type: 'text',
-              col: 6,
-              rules: [
-                this.model.repassword || this.model.oldpassword
-                  ? {
-                      required: true,
-                      message: '请输入新密码'
-                    }
-                  : {},
-                {
-                  pattern: this.checkPassword,
-                  message: this.checkPasswordMsg
-                    ? this.checkPasswordMsg
-                    : '密码格式不合法',
-                  trigger: 'blur'
-                }
-              ],
-              events: {
-                change: () => {
-                  if (
-                    !this.model.repassword &&
-                    !this.model.oldpassword &&
-                    !this.model.repassword
-                  ) {
-                    this.$refs.form.clearValidate();
-                  }
-                }
-              }
-            },
-            {
-              name: 'repassword',
-              placeholder: '确认新密码',
-              label: '确认新密码',
-              type: 'text',
-              col: 6,
-              rules: [
-                this.model.password || this.model.oldpassword
-                  ? {
-                      required: true,
-                      message: '请再次输入新密码'
-                    }
-                  : {},
-                { validator: this.repassword, trigger: 'blur' },
-                this.checkPassword
-                  ? {
-                      pattern: this.checkPassword,
-                      message: this.checkPasswordMsg
-                        ? this.checkPasswordMsg
-                        : '密码格式不合法',
-                      trigger: 'blur'
-                    }
-                  : {}
-              ],
-              events: {
-                change: () => {
-                  if (
-                    !this.model.repassword &&
-                    !this.model.oldpassword &&
-                    !this.model.repassword
-                  ) {
-                    this.$refs.form.clearValidate();
-                  }
-                }
-              }
-            }
-          ];
-    }
-  },
-  created() {},
-  mounted() {},
-  methods: {
-    handleFormSubmit() {
-      let initLogin = util.getStorage('initLogin');
-      initLogin && (initLogin = JSON.parse(initLogin));
-      util
-        .ajax({
-          url: updateUserInfo,
-          params: {
-            email: this.model.email,
-            officeTel: this.model.officeTel,
-            phone: this.model.phone,
-            oldPassword:
-              this.secret &&
-              initLogin &&
-              initLogin.secret &&
-              this.model.oldpassword
-                ? util.esmEncrypt({
-                    data: this.model.oldpassword,
-                    key: initLogin.secret
-                  })
-                : this.model.oldpassword,
-            password:
-              this.secret &&
-              initLogin &&
-              initLogin.secret &&
-              this.model.password
-                ? util.esmEncrypt({
-                    data: this.model.password,
-                    key: initLogin.secret
-                  })
-                : this.model.password
-          }
-        })
-        .then((res) => {
-          if (res.rCode === 0) {
-            if (this.model.oldpassword && this.model.password) {
-              this.$confirm('密码修改成功,请重新登录！', '提示', {
-                confirmButtonText: '确定',
-                cancelButtonText: '取消',
-                closeOnClickModal: false,
-                type: 'warning'
-              })
-                .then(() => {
-                  const loginPage =
-                    util.getStorage('login') || util.getStorage('loginPage');
-                  try {
-                    if (loginPage) {
-                      let src;
-                      if (!util.startWith(loginPage, ['http', '/'], true)) {
-                        let pathname = util.win.top.location.pathname;
-                        if (pathname !== '/') {
-                          pathname = pathname.split('/');
-                          pathname.splice(pathname.length - 1);
-                          pathname = pathname.join('/');
-                          src = pathname + '/' + loginPage.replace('./', '');
-                        } else {
-                          src = pathname + loginPage.replace('./', '');
-                        }
-                      } else {
-                        src = loginPage;
-                      }
-                      util.win.top.location.href = src;
-                    } else if (
-                      util.win.top.location.href.indexOf('main.html') > -1
-                    ) {
-                      util.win.top.location.href = './login.html';
-                    } else {
-                      const hash = util.win.top.location.hash;
-                      if (hash) {
-                        const len = util.win.top.location.href.indexOf(hash);
-                        util.win.top.location.href =
-                          util.win.location.href.slice(0, len) + '#/login';
-                      } else {
-                        util.win.top.location.href = '/login.html';
-                      }
-                    }
-                  } catch (error) {
-                    util.win.top.postMessage({ type: 1 }, '*');
-                  }
-                })
-                .catch((e) => {});
-            } else {
-              this.$message({
-                message: res.msg,
-                type: 'success',
-                onClose: () => {
-                  this.$emit('success', this.model);
-                }
-              });
-            }
-          } else {
-            let msg = res.msg || '系统错误，请联系管理员！';
-            this.$message.error(msg);
-          }
-        });
-    },
-    repassword(rule, value, callback) {
-      if (this.model.oldpassword && this.model.password && value) {
-        util.identical({ value: [value, this.model.password], callback });
-      } else {
-        callback();
-        return true;
-      }
-    }
-  }
-};
-</script>
+<template>
+  <es-form
+    ref="form"
+    class="es-user-info"
+    :validate-on-rule-change="false"
+    :model="model"
+    :contents="forms"
+    :autocomplete="false"
+    :rules="formRules"
+    :events="events"
+    @submit="handleFormSubmit"
+  >
+    <template slot="other">
+      <slot></slot>
+    </template>
+  </es-form>
+</template>
+<script>
+import { updateUserInfo } from 'eoss-ui/src/config/api.js';
+import util from 'eoss-ui/src/utils/util';
+
+export default {
+  name: 'UserInfo',
+  props: {
+    secret: {
+      type: Boolean,
+      default: true
+    },
+    contents: Array,
+    value: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    rules: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    rules: {
+      type: Object,
+      default() {
+        return {};
+      }
+    }
+  },
+  data() {
+    return {
+      model: this.value,
+      events: {
+        oldpassword: {
+          change: () => {
+            if (
+              !this.model.repassword &&
+              !this.model.oldpassword &&
+              !this.model.repassword
+            ) {
+              this.$refs.form.clearValidate();
+            }
+          }
+        },
+        password: {
+          change: () => {
+            if (
+              !this.model.repassword &&
+              !this.model.oldpassword &&
+              !this.model.repassword
+            ) {
+              this.$refs.form.clearValidate();
+            }
+          }
+        },
+        repassword: {
+          change: () => {
+            if (
+              !this.model.repassword &&
+              !this.model.oldpassword &&
+              !this.model.repassword
+            ) {
+              this.$refs.form.clearValidate();
+            }
+          }
+        }
+      }
+    };
+  },
+  computed: {
+    formRules() {
+      return {
+        idCard: {
+          pattern: new RegExp('(^\\d{15}$)|(^\\d{18}$)|(^\\d{17}(\\d|X|x)$)'),
+          message: '身份证号不合法'
+        },
+        phone: {
+          pattern: new RegExp('^[1][3, 4, 5, 6, 7, 8, 9][0-9]{9}$'),
+          message: '手机号不合法',
+          trigger: 'blur'
+        },
+        email: {
+          type: 'email',
+          message: '请输入正确的邮箱地址',
+          trigger: 'blur'
+        },
+        officeTel: {
+          pattern: new RegExp(
+            '^(?:\\(?0([1-9]\\d{1,2})\\)?[- ]?)?([2-9]\\d{6,7})$'
+          ),
+          message: '座机号不合法',
+          trigger: 'blur'
+        },
+
+        oldpassword:
+          this.model.password || this.model.repassword
+            ? {
+                required: true,
+                message: '请输入旧密码'
+              }
+            : {},
+
+        password: [
+          this.model.repassword || this.model.oldpassword
+            ? {
+                required: true,
+                message: '请输入新密码'
+              }
+            : {},
+          ,
+          {
+            pattern: this.checkPassword,
+            message: this.checkPasswordMsg
+              ? this.checkPasswordMsg
+              : '密码格式不合法',
+            trigger: 'blur'
+          }
+        ],
+        repassword: [
+          this.model.password || this.model.oldpassword
+            ? {
+                required: true,
+                message: '请再次输入新密码'
+              }
+            : {},
+          { validator: this.repassword, trigger: 'blur' },
+          this.checkPassword
+            ? {
+                pattern: this.checkPassword,
+                message: this.checkPasswordMsg
+                  ? this.checkPasswordMsg
+                  : '密码格式不合法',
+                trigger: 'blur'
+              }
+            : {}
+        ],
+        ...this.rules
+      };
+    },
+    forms() {
+      return this.contents
+        ? this.contents
+        : [
+            {
+              name: 'orgName',
+              label: '所属机构',
+              type: 'text',
+              disabled: true,
+              col: 6
+            },
+            {
+              name: 'depName',
+              label: '所属部门',
+              type: 'text',
+              disabled: true,
+              col: 6
+            },
+            {
+              name: 'idCard',
+              label: '身份证号',
+              type: 'text',
+              disabled: true,
+              col: 6
+            },
+            {
+              name: 'outCode',
+              label: '工号',
+              type: 'text',
+              disabled: true,
+              col: 6
+            },
+            {
+              name: 'phone',
+              placeholder: '联系电话',
+              label: '联系电话',
+              type: 'text',
+              col: 6
+            },
+            {
+              name: 'email',
+              placeholder: '电子邮箱',
+              label: '电子邮箱',
+              type: 'text',
+              col: 6
+            },
+            {
+              name: 'officeTel',
+              placeholder: '座机号',
+              label: '座机号',
+              type: 'text',
+              col: 6
+            },
+            {
+              name: 'oldpassword',
+              placeholder: '旧密码',
+              label: '旧密码',
+              type: 'text',
+              col: 6
+            },
+            {
+              name: 'password',
+              placeholder: '新密码',
+              label: '新密码',
+              type: 'text',
+              col: 6
+            },
+            {
+              name: 'repassword',
+              placeholder: '确认新密码',
+              label: '确认新密码',
+              type: 'text',
+              col: 6
+            }
+          ];
+    },
+    formKey() {
+      let keys = this.forms
+        .filter((item) => {
+          return (
+            item.disabled !== true &&
+            item.readonly !== true &&
+            !['oldpassword', 'password', 'repassword'].includes(item.name)
+          );
+        })
+        .map((item) => item.name);
+      return keys;
+    }
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    handleFormSubmit() {
+      let initLogin = util.getStorage('initLogin');
+      initLogin && (initLogin = JSON.parse(initLogin));
+      let { oldpassword, password } = this.model;
+      let data = {
+        ...Object.fromEntries(
+          Object.entries(this.model).filter(([key]) =>
+            this.formKey.includes(key)
+          )
+        )
+      };
+      util
+        .ajax({
+          url: updateUserInfo,
+          params: {
+            ...data,
+            oldPassword:
+              this.secret && initLogin && initLogin.secret && oldpassword
+                ? util.esmEncrypt({
+                    data: oldpassword,
+                    key: initLogin.secret
+                  })
+                : oldpassword,
+            password:
+              this.secret && initLogin && initLogin.secret && password
+                ? util.esmEncrypt({
+                    data: password,
+                    key: initLogin.secret
+                  })
+                : password
+          }
+        })
+        .then((res) => {
+          if (res.rCode === 0) {
+            if (oldpassword && password) {
+              this.$confirm('密码修改成功,请重新登录！', '提示', {
+                confirmButtonText: '确定',
+                cancelButtonText: '取消',
+                closeOnClickModal: false,
+                type: 'warning'
+              })
+                .then(() => {
+                  const loginPage =
+                    util.getStorage('login') || util.getStorage('loginPage');
+                  try {
+                    if (loginPage) {
+                      let src;
+                      if (!util.startWith(loginPage, ['http', '/'], true)) {
+                        let pathname = util.win.top.location.pathname;
+                        if (pathname !== '/') {
+                          pathname = pathname.split('/');
+                          pathname.splice(pathname.length - 1);
+                          pathname = pathname.join('/');
+                          src = pathname + '/' + loginPage.replace('./', '');
+                        } else {
+                          src = pathname + loginPage.replace('./', '');
+                        }
+                      } else {
+                        src = loginPage;
+                      }
+                      util.win.top.location.href = src;
+                    } else if (
+                      util.win.top.location.href.indexOf('main.html') > -1
+                    ) {
+                      util.win.top.location.href = './login.html';
+                    } else {
+                      const hash = util.win.top.location.hash;
+                      if (hash) {
+                        const len = util.win.top.location.href.indexOf(hash);
+                        util.win.top.location.href =
+                          util.win.location.href.slice(0, len) + '#/login';
+                      } else {
+                        util.win.top.location.href = '/login.html';
+                      }
+                    }
+                  } catch (error) {
+                    util.win.top.postMessage({ type: 1 }, '*');
+                  }
+                })
+                .catch((e) => {});
+            } else {
+              this.$message({
+                message: res.msg,
+                type: 'success',
+                onClose: () => {
+                  this.$emit('success', this.model);
+                }
+              });
+            }
+          } else {
+            let msg = res.msg || '系统错误，请联系管理员！';
+            this.$message.error(msg);
+          }
+        });
+    },
+    repassword(rule, value, callback) {
+      if (this.model.oldpassword && this.model.password && value) {
+        util.identical({ value: [value, this.model.password], callback });
+      } else {
+        callback();
+        return true;
+      }
+    }
+  }
+};
+</script>