系统配置

src/api/user.js

@@ -36,4 +36,14 @@ export function getMyUserInfo() {
 // 更改我的用户密码
 export function updatePwd(data) {
   return http.post(`${process.env.VUE_APP_EepServer}?MethodName=user_manager-UpdateMyUserPassword`,data);
+}
+
+// 得到邮箱配置
+export function getSysConfigMailbox() {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=sys_config_manager-GetSysConfig_Mailbox`);
+}
+
+// 设置邮箱配置
+export function setSysConfigMailbox(data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=sys_config_manager-SetSysConfig_Mailbox`,data);
 }

src/icons/svg/eye-invisible.svg

@@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.69245 10.5896L11.5886 12.4858L12.4136 11.6608L8.76992 8.01719C8.94265 7.71751 9.04147 7.36985 9.04147 6.99912C9.04147 5.87154 8.12738 4.95745 6.9998 4.95745C6.62907 4.95745 6.28141 5.05627 5.98173 5.22899L2.41094 1.6582L1.58598 2.48316L3.25853 4.15571C2.55853 4.79671 1.88292 5.67724 1.25401 6.69177L1.06348 6.99912L1.25401 7.30647C2.86656 9.90772 4.77155 11.3741 6.9998 11.3741C7.94774 11.3741 8.84757 11.1059 9.69245 10.5896ZM8.83776 9.73494L7.9233 8.82048C7.64597 8.96137 7.33216 9.04078 6.9998 9.04078C5.87222 9.04078 4.95814 8.1267 4.95814 6.99912C4.95814 6.66676 5.03755 6.35295 5.17844 6.07562L4.0844 4.98158C3.55007 5.46205 2.99377 6.14725 2.4409 6.99858C3.90335 9.23478 5.43199 10.2075 6.9998 10.2075C7.6259 10.2075 8.23701 10.0545 8.83776 9.73494ZM6.97663 7.87382C6.51179 7.86173 6.13719 7.48713 6.1251 7.02228L6.97663 7.87382ZM7.86726 7.11452C7.87224 7.07676 7.8748 7.03824 7.8748 6.99912C7.8748 6.51587 7.48305 6.12412 6.9998 6.12412C6.96068 6.12412 6.92216 6.12668 6.8844 6.13166L7.86726 7.11452ZM6.98099 2.62412L6.9998 2.62412C9.22805 2.62412 11.133 4.09051 12.7456 6.69177L12.9361 6.99912L12.7456 7.30647C12.2127 8.16614 11.6515 8.89739 11.0593 9.493L10.232 8.67044C10.6811 8.21866 11.1238 7.66312 11.5583 6.99909C10.096 4.76329 8.56748 3.79079 6.9998 3.79079C6.66259 3.79079 6.34571 3.79208 6.06142 3.83801C5.77517 3.88425 5.60085 3.96471 5.50082 4.06236L4.68584 3.22755C5.03395 2.8877 5.48456 2.7494 5.87536 2.68627C6.26046 2.62406 6.66432 2.62409 6.98099 2.62412Z" fill="currentColor"/>
+</svg>

src/views/system_config/index.vue

@@ -1,14 +1,134 @@
 <template>
-  <div class="system_config"></div>
+  <div class="system_config">
+    <div class="btn-box">
+      <el-button type="primary" @click="getInfo" :loading="refresh_loading">刷新</el-button>
+      <el-button type="primary" :loading="loading" @click="onSubmit">应用</el-button>
+    </div>
+    <el-form :model="configForm" ref="configForm" label-width="100px" class="config-form">
+      <el-form-item label="邮箱地址" prop="address">
+        <el-input
+          v-model="configForm.address"
+          autocomplete="off"
+          placeholder="请输入邮箱地址"
+          @blur="handleTrim('configForm', 'address')"
+          maxlength="100"
+        >
+        </el-input>
+      </el-form-item>
+      <el-form-item label="SMTP 服务器" prop="smtp">
+        <el-input
+          v-model="configForm.smtp"
+          autocomplete="off"
+          placeholder="请输入SMTP 服务器"
+          @blur="handleTrim('configForm', 'smtp')"
+          maxlength="200"
+        >
+        </el-input>
+      </el-form-item>
+      <el-form-item label="邮箱登录名" prop="user_name">
+        <el-input
+          v-model="configForm.user_name"
+          autocomplete="off"
+          placeholder="请输入邮箱登录名"
+          @blur="handleTrim('configForm', 'user_name')"
+          maxlength="100"
+        >
+        </el-input>
+      </el-form-item>
+      <el-form-item label="邮箱登录密码" prop="password">
+        <el-input
+          v-model="configForm.password"
+          :type="newPwdFlag ? 'text' : 'password'"
+          autocomplete="off"
+          placeholder="请输入密码"
+          @blur="handleTrim('configForm', 'password')"
+          maxlength="100"
+        >
+          <i slot="suffix" class="el-icon-view show-icon" @click="changeIcon('newPwdFlag')" v-if="newPwdFlag"></i>
+          <i slot="suffix" class="show-icon" @click="changeIcon('newPwdFlag')" v-else>
+            <svg-icon icon-class="eye-invisible"></svg-icon>
+          </i>
+        </el-input>
+      </el-form-item>
+    </el-form>
+  </div>
 </template>
 
 <script>
+import { getSysConfigMailbox, setSysConfigMailbox } from '@/api/user';
 export default {
   name: 'SystemConfig',
   data() {
-    return {};
+    const validateEmail = (rule, value, callback) => {
+      if (value === '') {
+        callback();
+      } else {
+        let reg = /^[a-zA-Z0-9_\.-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
+        let result = reg.test(value);
+        if (result) {
+          callback();
+        } else {
+          callback(new Error('请输入正确的邮箱地址'));
+        }
+      }
+    };
+    return {
+      configForm: {
+        address: '',
+        smtp: '',
+        user_name: '',
+        password: '',
+      },
+      rules: {
+        address: [{ validator: validateEmail, trigger: 'blur' }],
+      },
+      newPwdFlag: false, // 查看新密码
+      loading: false,
+      refresh_loading: false,
+    };
+  },
+  methods: {
+    // 去掉前后空格
+    handleTrim(form, fild) {
+      this[form][fild] = this[form][fild].trim();
+    },
+    changeIcon(flag) {
+      this[flag] = !this[flag];
+    },
+    getInfo() {
+      this.refresh_loading = true;
+      getSysConfigMailbox()
+        .then((res) => {
+          this.refresh_loading = false;
+          if (res.status === 1) {
+            this.configForm.address = res.address;
+            this.configForm.smtp = res.smtp;
+            this.configForm.user_name = res.user_name;
+            this.configForm.password = res.password;
+          }
+        })
+        .catch(() => {
+          this.refresh_loading = false;
+        });
+    },
+    // 应用
+    onSubmit() {
+      this.loading = true;
+      setSysConfigMailbox(this.configForm)
+        .then((res) => {
+          this.loading = false;
+          if (res.status === 1) {
+            this.$message.success('操作成功!');
+          }
+        })
+        .catch(() => {
+          this.loading = false;
+        });
+    },
+  },
+  created() {
+    this.getInfo();
   },
-  methods: {},
 };
 </script>
 
@@ -17,5 +137,23 @@ export default {
 
 .system_config {
   @include page-base;
+
+  .btn-box {
+    width: 100%;
+    max-width: 1148px;
+    padding: 20px 0;
+    margin: 10px auto;
+    border-bottom: $border;
+  }
+
+  .config-form {
+    width: 100%;
+    max-width: 1148px;
+    margin: 10px auto;
+
+    :deep .el-input--small {
+      width: 304px;
+    }
+  }
 }
 </style>