import * as API from 'api/base/accounts';
import {
  index
} from 'api/base/roles';
import {
  isPhone,
  isPsw,
  isUserName
} from 'validate';

export default {
  props: {
    show: {
      type: Boolean,
      default: false
    },
    data: {
      type: Object,
      default() {
        return null;
      }
    }
  },
  watch: {
    show(bool) {
      this.my_show = bool;
      if (bool) {
        // 获取权限组(角色列表)
        this.isShowLoading(true);
        let data = {
          limit: 0
        };
        index(data).then(res => {
          this.isShowLoading(false);
          if (res.code == 0) {
            this.roles = res.data.roles;
          }
        }).catch(err => {
          this.isShowLoading(false);
        });

        if (this.data) {
          for (let k in this.data) {
            if (k in this.params) {
              this.params[k] = this.data[k];
            }
          }

          if (this.data.roles && this.data.roles.length) {
            this.params.role_id = this.data.roles[0].id;
          }

          // 图片处理
          this.imgEvent(this.data.avatar).then(src => {
            this.img_list = [{
              src: `${src}?a=${Math.random()}`,
              loading: false,
              file: null
            }];
          }).catch(src => {
            this.img_list = [{
              src,
              loading: false,
              file: null
            }];
          });
        }
      }
    }
  },
  data() {
    return {
      my_show: false,
      loading: false,
      params: {
        username: '',
        nickname: '',
        mobile: '',
        password: '',
        current_password: '',
        confirm_password: '',
        status: 1, // 1:正常 2:禁用
        role_id: ''
      },
      img_list: [], // 图像数组
      roles: [] // 权限组
    };
  },
  methods: {
    selectImgChange(data) {
      if (data && data.length) {
        this.img_list = data;
      }
    },

    ok() {
      if (!this.params.username) {
        this.$Message.info('请填写用户名');
        return;
      }

      if (!isUserName(this.params.username)) {
        this.$Message.info('用户名填写不合法');
        return;
      }

      if (!this.params.role_id) {
        this.$Message.info('请选择权限组');
        return;
      }

      if (!this.params.nickname) {
        this.$Message.info('请填写姓名');
        return;
      }

      if (!(/[\s\S]{2,32}/.test(this.params.nickname))) {
        this.$Message.info('姓名长度在2-32之间');
        return;
      }

      if (!this.data) {
        if (!this.params.current_password) {
          this.$Message.info('请填写密码');
          return;
        }

        if (!isPsw(this.params.current_password)) {
          this.$Message.info('密码长度在6-18之间，只能包含字母、数字和下划线');
          return;
        }

        if (!this.params.confirm_password) {
          this.$Message.info('请填写确认密码');
          return;
        }

        if (this.params.current_password != this.params.confirm_password) {
          this.$Message.info('密码与确认密码填写不一致');
          return;
        }

        this.params.password = md5(this.params.current_password);

        // 添加时
        if (this.img_list.length) {
          for (let i = 0, len = this.img_list.length; i < len; i++) {
            let img = this.img_list[i];

            if (img.file && img.loading) {
              this.$Message.info('图片上传中，请稍后');
              return;
            }
          }
        }
      } else {
        if (this.params.current_password) {
          if (!isPsw(this.params.current_password)) {
            this.$Message.info('密码长度在6-18之间，只能包含字母、数字和下划线');
            return;
          }

          if (!this.params.confirm_password) {
            this.$Message.info('请填写确认密码');
            return;
          }

          if (this.params.current_password != this.params.confirm_password) {
            this.$Message.info('密码与确认密码填写不一致');
            return;
          }

          this.params.password = md5(this.params.current_password);
        }
      }

      if (this.params.mobile) {
        if (!isPhone(this.params.mobile)) {
          this.$Message.info('手机号填写不正确');
          return;
        }
      }

      let data = new FormData();
      for (let k in this.params) {
        if (k != 'current_password' || k != 'confirm_password') {
          if (this.params[k]) {
            data.append(k, this.params[k]);
          }
        }
      }

      if (this.img_list.length) {
        if (this.img_list[0].file) {
          data.append('avatar', this.img_list[0].file);
        } else if (this.data) {
          if (!this.img_list[0].src) {
            data.append('avatar', '');
          }
        }
      }

      if (this.data) {
        // 编辑
        API.update(data, this.data.id).then(res => {
          this.loading = false;
          if (res.code == 0) {
            this.$emit('update-success');
            this.$Message.success('更新成功');
            this.clear();
          }
        }).catch(err => {
          this.loading = false;
        });
      } else {
        // 添加
        API.create(data).then(res => {
          this.loading = false;
          if (res.code == 0) {
            this.$emit('add-success');
            this.$Message.success('添加成功');
            this.clear();
          }
        }).catch(err => {
          this.loading = false;
        });
      }
    },

    visibleChange(bool) {
      if (!bool) {
        this.$emit('update:show', false);
      }
    },

    clear() {
      for (let k in this.params) {
        if (k == 'status') {
          this.params[k] = 1;
        } else {
          this.params[k] = '';
        }
      }
      this.my_show = false;
      this.img_list = [];
    }
  }
};
