美文网首页
开发商授权 图片上传

开发商授权 图片上传

作者: 曹锦花 | 来源:发表于2020-09-28 10:49 被阅读0次
    <el-upload
      action="/"
      :http-request="uploadIdcard2"
      :file-list="fileList"
      list-type="picture-card"
      :auto-upload="true">
        <i slot="default" class="el-icon-plus"></i>
        <div slot="file" slot-scope="{file}">
          <img
            class="el-upload-list__item-thumbnail"
            :src="file.url" alt=""
          >
          <span class="el-upload-list__item-actions">
            <span
              class="el-upload-list__item-preview"
              @click="handlePictureCardPreview(file)"
            >
              <i class="el-icon-zoom-in"></i>
            </span>
            <span
              v-if="!disabled"
              class="el-upload-list__item-delete"
              @click="handleRemove(file)"
            >
              <i class="el-icon-delete"></i>
            </span>
          </span>
        </div>
    </el-upload>
      <el-dialog :visible.sync="dialogVisible">
        <img width="100%" :src="dialogImageUrl" alt />
      </el-dialog>
_________________________________
import { upLoad } from '@/libs/upLoad'

  data() {
    return {
      dialogImageUrl: "",
      dialogVisible: false,
      fileList: [], //缓存区文件
      houseId: this.$route.query.houseId,

    };
  },

  methods: {
    async uploadIdcard2 (params) {
      const res = await upLoad(params, 'busFile')
      let idc_img2 = ''
      idc_img2 = res.data.length > 0 ? res.data[0].fileUrl : ''
     this.fileList.push({url: idc_img2})
      console.log(idc_img2)
    },
}

'@/libs/upLoad'

import { uploadFile } from '@/api/public_api'
import { Notification } from 'element-ui'
export const upLoad = async (params, type) => {
  if (!type) type = 'busFile'
  console.log('文件参数:======================', params)
  const file = params.file
  const fileType = file.type
  const isImage = fileType.indexOf('image') != -1
  const isLt5M = file.size / 1024 / 1024 < 5
  // 这里常规检验,看项目需求而定
  if (!isImage) {
    this.$message.error('只能上传图片格式png、jpg、gif!')
    return
  }
  if (!isLt5M) {
    this.$message.error('只能上传小于5M的图片')
    return
  }
  const myform = new FormData()
  myform.append(type + '-' + file.name, file)

  const result = await uploadFile(myform)
  if (result.code !== 200) {
    Notification.error({
      title: '错误',
      message: result.message
    })
    return false
  }
  return result
}

相关文章

网友评论

      本文标题:开发商授权 图片上传

      本文链接:https://www.haomeiwen.com/subject/izhduktx.html