saas_entrepot_admin/src/views/system/user/profile/email.vue

<template>
  <el-form ref="form" :model="configValue" :rules="rules" label-width="140px">
    <el-form-item label="邮箱账号" prop="postAccount">
      <el-input
        v-model="configValue.postAccount"
        placeholder="请输入邮箱账号"
      />
    </el-form-item>
    <el-form-item label="授权密码" prop="postPassword">
      <el-input
        v-model="configValue.postPassword"
        placeholder="请输入授权密码"
      />
    </el-form-item>
    <el-form-item label="STMP服务期地址" prop="STMPserver">
      <el-input
        v-model="configValue.STMPserver"
        placeholder="请输入STMP服务期地址"
      />
    </el-form-item>
    <el-form-item label="端口号" prop="post">
      <el-input v-model="configValue.post" placeholder="请确认端口号" />
    </el-form-item>
    <el-form-item>
      <el-button type="primary" size="mini" @click="submit">保存</el-button>
      <el-button type="danger" size="mini" @click="close">关闭</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
import { updateConfig } from "@/api/system/config";

export default {
  props: {
    info: {
      type: Object,
      default: () => {
        return {};
      },
    },
    configValue: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  data() {
    const emailValidator = (rule, value, callback) => {
      var reg = /^\w{3,}(\.\w+)*@[A-z0-9]+(\.[A-z]{2,5}){1,2}$/;
      if (reg.test(value)) {
        callback();
      } else {
        callback(new Error("邮箱账号格式错误，请检查邮箱账号格式"));
      }
    };
    return {
      test: "1test",
      // 表单校验
      rules: {
        postAccount: [
          { required: true, message: "请输入邮箱账号", trigger: "blur" },
          { validator: emailValidator, trigger: "blur" },
        ],
        postPassword: [
          { required: true, message: "请输入授权密码", trigger: "blur" },
        ],
        STMPserver: [
          { required: true, message: "请输入STMP服务器地址", trigger: "blur" },
        ],
        post: [{ required: true, message: "请输入端口", trigger: "blur" }],
      },
    };
  },
  methods: {
    submit() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          let data = JSON.parse(JSON.stringify(this.configValue));
          let copySubmitData = JSON.parse(JSON.stringify(this.info));
          copySubmitData.configValue = JSON.stringify(data);
          updateConfig(copySubmitData).then(() => {
            this.$message.success("保存成功");
          });
        }
      });
    },
    close() {
      this.$store.dispatch("tagsView/delView", this.$route);
      this.$router.push({ path: "/index" });
    },
  },
};
</script>