quanwei
2 days ago 04102f7237efefa744090ed7c25f7b5d0807b679
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
<template>
  <!--
        作者:luoyiming
        时间:2019-10-25
        描述:代理商管理-编辑代理商
    -->
  <el-dialog title="编辑代理商" :visible.sync="dialogVisible" @close='dialogFormVisible' :close-on-click-modal="false"
    :close-on-press-escape="false">
    <el-form size="small" :model="form" ref="form" :rules="rules">
      <!--去除浏览器默认-->
      <div style="height: 0; overflow: hidden;">
        <input type="password">
      </div>
      <el-form-item label="代理商姓名" :label-width="formLabelWidth" prop="agent_name">
        <el-input v-model="form.agent_name" autocomplete="off" placeholder="请输入代理商姓名"></el-input>
      </el-form-item>
      <el-form-item label="代理商手机号" :label-width="formLabelWidth" prop="agent_phone">
        <el-input v-model="form.agent_phone" autocomplete="off" placeholder="请输入代理商手机号"></el-input>
      </el-form-item>
      <el-form-item label="代理商邮箱" :label-width="formLabelWidth" prop="email">
        <el-input v-model="form.email" autocomplete="off" placeholder="请输入代理商邮箱"></el-input>
      </el-form-item>
      <el-form-item label="到期时间" :label-width="formLabelWidth" prop="duetime"
        :rules="[{ required: true, message: '请选择到期时间', trigger: 'change' }]">
        <el-date-picker
          v-model="form.duetime"
          type="datetime"
          placeholder="到期时间"
          format="yyyy-MM-dd HH:mm"
          value-format="yyyy-MM-dd HH:mm"></el-date-picker>
      </el-form-item>
      <el-form-item label="代理商账户名" :label-width="formLabelWidth" prop="user_name">
        <el-input v-model="form.user_name" autocomplete="off" placeholder="请输入代理商账户名"></el-input>
        <p class="gray">注:代理商后台用户名</p>
      </el-form-item>
      <el-form-item label="代理商账户密码" :label-width="formLabelWidth" prop="password">
        <el-input type="password" v-model="form.password" autocomplete="off" placeholder="请输入密码"></el-input>
        <p class="gray">注:代理商后台用户密码</p>
      </el-form-item>
      <el-form-item label="确认密码" :label-width="formLabelWidth" prop="password_confirm">
        <el-input type="password" v-model="form.password_confirm" autocomplete="off" placeholder="请输入确认密码"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogFormVisible">取 消</el-button>
      <el-button type="primary" @click="addClick()" :loading="loading">确 定</el-button>
    </div>
  </el-dialog>
</template>
 
<script>
  import AgentApi from '@/api/agent.js';
  export default {
    data() {
      /*验证代理商姓名*/
      let checkAppName = (rule, value, callback) =>{
          if(!value){
              return callback(new Error('请输入代理商姓名'));
          }else{
              if(this.$filter.isAllSpace(value)){
                  return callback(new Error('不能全是空格'));
              }else{
                  callback();
              }
          }
      };
 
      /*验证用户名*/
      let checkUsername = (rule, value, callback) =>{
          if (!this.$filter.replaceSpace(value)) {
              return callback(new Error('代理商账户名'));
          } else {
              if(this.$filter.hasSpace(value)){
                  return callback(new Error('不能包含空格'));
              }else{
                  callback();
              }
          }
      };
 
      /*密码验证*/
      let checkPassword = (rule, value, callback) => {
          if (!value) {
              callback();
          } else {
              if(this.$filter.hasSpace(value)){
                  return callback(new Error('不能包含空格'));
              }else if(value.length<6){
                  return callback(new Error('长度不能小于6位'));
              }else{
                  callback();
              }
          }
      };
 
      /*确认新密码验证*/
      let checkPasswordConfirm = (rule, value, callback) => {
          if (!this.form.password) {
              callback();
          } else if (value !== this.form.password) {
              callback(new Error('确认密码不一致'));
          } else {
              callback();
          }
      };
      return {
        form: {},
        /*左边长度*/
        formLabelWidth: '120px',
        /*是否显示*/
        dialogVisible: false,
        /*是否正在加载*/
        loading: false,
        /*验证规则*/
        rules: {
            agent_name: [{ validator:checkAppName, required: true, trigger: 'blur' }],
            user_name: [{ validator:checkUsername, required: true, trigger: 'blur' }],
          password: [{ validator:checkPassword, trigger: 'change' }],
          password_confirm: [{ validator:checkPasswordConfirm, trigger: 'blur' }]
        },
      };
    },
    props: ['open_edit','curModel'],
    created() {
      this.dialogVisible = this.open_edit;
      this.form=this.curModel;
    },
    methods: {
      /*添加代理商*/
      addClick() {
        let self = this;
        let params = this.form;
        self.$refs.form.validate((valid) => {
          if (valid) {
            self.loading = true;
            AgentApi.editAgent(params, true).then(res => {
                self.loading = false;
                self.$message({
                  message: '恭喜你,修改成功',
                  type: 'success'
                });
                self.dialogFormVisible(true);
              })
              .catch(error => {
                self.loading = false;
              });
          }
        });
 
      },
      /*关闭弹窗*/
      dialogFormVisible(e) {
        if (e) {
          this.$emit('closeDialog', {
            type: 'success',
            openDialog: false
          })
        } else {
          this.$emit('closeDialog', {
            type: 'error',
            openDialog: false
          })
        }
      }
 
    }
  };
</script>
 
<style></style>