export default {
  props: {
    // 文字btn上传的形式
    uploadBtn: {
      type: Boolean,
      default: false
    },
    // 背景图片
    baseImg: {
      type: String,
      default: ''
    },
    // 图片是否可上传
    disabled: {
      type: Boolean,
      default: false
    },
    // 上传按钮文案
    btnText: {
      type: String,
      default: '上传图片'
    },
    // 图片删除按钮是否显示
    showDelete: {
      type: Boolean,
      default: true
    },
    // 删除按钮的位置 left-top right-top
    delPosition: {
      type: String,
      default: 'right-top'
    },
    // 编辑图片按钮是否显示
    showEdit: {
      type: Boolean,
      default: true
    },
    // 编辑图片按钮的文案
    editText: {
      type: String,
      default: '替换'
    },
    // 图片默认
    defaultImg: [Array, String],
    // 图片的上传地址
    action: {
      type: String
    },
    showFileList: {
      type: Boolean,
      default: true
    },
    // 图片的高
    height: {
      type: Number,
      default: 96
    },
    // 图片的宽
    width: {
      type: Number,
      default: 96
    },
    // 大小M 大小1024*1024*size
    size: {
      type: Number,
      default: 5
    },
    // 图片上传格式
    accept: {
      type: String,
      default: 'image/jpg, image/jpeg, image/png, image/gif'
    },
    // 图片剪切功能
    showCropper: {
      type: Boolean,
      default: false
    },
    // 图片剪裁的按钮文案
    cropperText: {
      type: String,
      default: '剪裁'
    },
    // 下面是批量上传特有
    // 批量上传图片是否打开
    multiple: {
      type: Boolean,
      default: false
    },
    // 批量上传图片最多上传的张数
    limit: {
      type: Number,
      default: 30
    },
    // 图片拖拽排序
    showDraggable: {
      type: Boolean,
      default: false
    },
    // 上传前🪝
    beforeUpload: {
      type: Function
    }
  },
  data() {
    return {
      isShowCropper: false, // 显示图片剪切
      file: '' // 传给图片剪切图片地址
    };
  },
  methods: {
    // 校验是否可进行下一步
    isCheckout(file) {
      if (typeof this.beforeUpload === 'function') {
        return this.beforeUpload(file);
      }
      if (file.size > this.size * 1024 * 1024) {
        this.$message.warning(`图片尺寸过大，请上传小于${this.size}M的图片`);
        return false;
      } else {
        return true;
      }
    },
    // 图片fetch图片上传封装
    http(fullUrl, params) {
      const body = params;
      return fetch(fullUrl, {
        headers: {
          uid: localStorage.getItem('userId'),
          token: localStorage.getItem('token'),
          terminal: 1
        },
        body,
        method: 'post'
      }).then(res => res.json())
        .then(res => {
          if (res.code !== '1') {
            this.$message.warning(res.msg);
            throw res;
          }
          return res.data;
        });
    }
  }
};
