123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211 |
- <template>
- <div class="manage-root personnel-create">
- <Header />
- <div class="manage-root-contain">
- <nav-menu class="manage-root-contain-left" :activeMenuIndex="activeMenuIndex"></nav-menu>
- <div class="manage-root-contain-right">
- <breadcrumb :breadcrumbList="breadcrumbList" class="breadcrumb-box"></breadcrumb>
- <div class="create-bottom">
- <h3>邮箱配置</h3>
- <el-form :model="registerForm" :rules="rulesRegister" ref="registerForm" label-width="100px" class="registerForm" label-position="top">
- <el-form-item label="邮箱地址" prop="email">
- <el-input v-model="registerForm.email" autocomplete="off" placeholder="请输入邮箱地址" @blur="handleTrim('registerForm','email')" >
- </el-input>
- </el-form-item>
- <el-form-item label="SMTP 服务器" prop="smtp">
- <el-input v-model="registerForm.smtp" autocomplete="off" placeholder="请输入SMTP 服务器" @blur="handleTrim('registerForm','smtp')" >
- </el-input>
- </el-form-item>
- <el-form-item label="邮箱登录名" prop="emailName">
- <el-input v-model="registerForm.emailName" autocomplete="off" placeholder="请输入邮箱登录名" @blur="handleTrim('registerForm','emailName')" >
- </el-input>
- </el-form-item>
- <el-form-item label="邮箱登录密码" prop="newPwd">
- <el-input v-model="registerForm.newPwd" :type="newPwdFlag?'text':'password'" autocomplete="off" placeholder="请输入密码" @blur="handleTrim('registerForm','newPwd')" >
- <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-item>
- <el-button type="primary" @click="onSubmit('registerForm')" size="small" :loading="loading">保存</el-button>
- <el-button @click="onCancel('registerForm')" size="small">取消</el-button>
- </el-form-item>
- </el-form>
- </div>
- </div>
- </div>
- </div>
- </template>
- <script>
- //这里可以导入其它文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
- //例如:import 《组件名称》from ‘《组件路径》';
- import Header from "../../components/Header.vue";
- import NavMenu from "../../components/NavMenu.vue"
- import Breadcrumb from '../../components/Breadcrumb.vue';
- import { getLogin } from "@/api/ajax";
- export default {
- //import引入的组件需要注入到对象中才能使用
- components: { Header, NavMenu, Breadcrumb },
- props: {},
- data() {
- //这里存放数据
- 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 {
- activeMenuIndex: "email_setting",
- breadcrumbList:[
- {
- icon:'setting',
- url:'',
- text:''
- },
- {
- icon:'',
- url:'',
- notLink: true,
- text:'系统配置'
- },
- {
- icon:'',
- url:'',
- text:'邮箱配置'
- }
- ],
- registerForm:{
- email: '',
- smtp: '',
- emailName: '',
- newPwd: ''
- },
- rulesRegister:{
- email:[
- { validator: validateEmail, trigger: 'blur' },
- ],
- },
- newPwdFlag: false, // 查看新密码
- loading: false
- }
- },
- //计算属性 类似于data概念
- computed: {
-
- },
- //监控data中数据变化
- watch: {
-
- },
- //方法集合
- methods: {
- // 去掉前后空格
- handleTrim(form,fild){
- this[form][fild] = this[form][fild].trim()
- },
- changeIcon(flag){
- this[flag] = !this[flag]
- },
- // 提交表单
- onSubmit(formName){
- this.$refs[formName].validate((valid) => {
- if (valid) {
- this.loading = true
- let MethodName = "/OrgServer/Manager/SysConfigManager/SetSysConfig_Mailbox";
- let data = {
- address: this.registerForm.email,
- smtp: this.registerForm.smtp,
- user_name: this.registerForm.emailName,
- password: this.registerForm.newPwd
- }
- getLogin(MethodName, data)
- .then((res) => {
- this.loading = false
- if(res.status===1){
- this.$message.success("保存成功")
- }
- }).catch((res) =>{
- this.loading = false
- })
- } else {
- return false;
- }
- });
- },
- // 取消 恢复到修改前状态
- onCancel(formName){
- this.$refs[formName].resetFields();
- },
- // 得到配置信息
- getInfo(){
- let MethodName = "/OrgServer/Manager/SysConfigManager/GetSysConfig_Mailbox";
- getLogin(MethodName, {})
- .then((res) => {
- if(res.status===1){
- this.registerForm.email = res.address
- this.registerForm.smtp = res.smtp,
- this.registerForm.emailName = res.user_name,
- this.registerForm.newPwd = res.password
- }
- }).catch((res) =>{
-
- })
- }
- },
- //生命周期 - 创建完成(可以访问当前this实例)
- created() {
- this.getInfo()
- },
- //生命周期 - 挂载完成(可以访问DOM元素)
- mounted() {
- },
- //生命周期-创建之前
- beforeCreated() { },
- //生命周期-挂载之前
- beforeMount() { },
- //生命周期-更新之前
- beforUpdate() { },
- //生命周期-更新之后
- updated() { },
- //生命周期-销毁之前
- beforeDestory() { },
- //生命周期-销毁完成
- destoryed() { },
- //如果页面有keep-alive缓存功能,这个函数会触发
- activated() { }
- }
- </script>
- <style lang="scss" scoped>
- /* @import url(); 引入css类 */
- .create-bottom{
- padding: 40px 40px;
- background: #FFFFFF;
- border-radius: 4px;
- height: calc(100vh - 140px);
- overflow: auto;
- h3{
- font-size: 20px;
- font-weight: 500;
- line-height: 28px;
- margin: 0 0 28px 0;
- color: #1D2129;
- }
- }
- </style>
- <style lang="scss">
- </style>
|