vue 弹窗表格

 <!-- <a-button type="primary" @click="showModal2('导入领导干部', 'examine/yxyLdgbb/importExcel')">
        表格导入领导干部
      </a-button> -->
    <!-- 导入用户标签 -->
    <a-modal v-model="visible2" :title="visibleTitle" @ok="handleOk" :footer="null">
      <a-row>
        <a-col :span="24">
          <a-form-item label="权限" :labelCol="labelCol" :wrapperCol="wrapperCol">
            <a-select v-model="uploadSSId" style="width: 100%" placeholder="请选择">
              <a-select-option v-for="v in cpryqxList" :key="v.id" :value="v.id">
                {{ v.name }}
              </a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="24">
          <a-form-item label="模板下载" :labelCol="labelCol" :wrapperCol="wrapperCol">
            <a-button
              type="primary"
              icon="download"
              @click="handleTemplateXls('领导干部导入', '/examine/yxyLdgbb/exportTemplate')"
              >导入模板</a-button
            >
          </a-form-item>
        </a-col>
        <a-col :span="24">
          <a-form-item label="导入文件" :labelCol="labelCol" :wrapperCol="wrapperCol">
            <a-upload
              :disabled="uploadSSId ? false : true"
              name="file"
              :showUploadList="false"
              :multiple="false"
              :headers="tokenHeader"
              :action="importExcelUrl"
              @change="handleUserScoringImportExcel"
            >
              <a-button type="primary" icon="import">导入</a-button>
            </a-upload>
          </a-form-item>
        </a-col>
      </a-row>
    </a-modal>
      // 表格导入 start
      uploadSSId: '',
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      visible2: false,
      visibleTitle: ''
      // 表格导入 end


    // 导入表格 start
 
    showModal2(name, url) {
      this.visible2 = true
      this.visibleTitle = name
      this.uploadSSId = undefined
      this.url.importExcelUrl = url
    },
    handleOk2(e) {
      console.log(e)
      this.visible2 = false
    }
    // 导入表格  end

     // 导入 
     handleUserScoringImportExcel(info) {
      // console.log(this.uploadSSData,'uploadSSData')
      if (info.file.status !== 'uploading') {
        console.log(info.file, info.fileList);
      }
      if (info.file.status === 'done') {
        if (info.file.response.success) {
          // this.$message.success(`${info.file.name} 文件上传成功`);
          if (info.file.response.code === 201) {
            let { message, result: { msg, fileUrl, fileName } } = info.file.response
            let href = window._CONFIG['domianURL'] + fileUrl
            this.$warning({
              title: message,
              content: (
                <div>
                  <span>{msg}</span><br/>
                  <span>具体详情请 <a href={href} target="_blank" download={fileName}>点击下载</a> </span>
                </div>
              )
            })
          } else {
            if (info.file.response.message.indexOf('失败') != -1) {
                          this.$warning({
                            title: '提示',
                            content:info.file.response.message
                          })
            } else {
              this.$message.success(info.file.response.message || `${info.file.name} 文件上传成功`)
            }
          }
          this.loadData()
        } else {
          this.$message.error(`${info.file.name} ${info.file.response.message}.`);
        }
      } else if (info.file.status === 'error') {
        if (info.file.response.status === 500) {
          let data = info.file.response
          const token = Vue.ls.get(ACCESS_TOKEN)
          if (token && data.message.includes("Token失效")) {
            Modal.error({
              title: '登录已过期',
              content: '很抱歉,登录已过期,请重新登录',
              okText: '重新登录',
              mask: false,
              onOk: () => {
                store.dispatch('Logout').then(() => {
                  Vue.ls.remove(ACCESS_TOKEN)
                  window.location.reload();
                })
              }
            })
          }
        } else {
          this.$message.error(`文件上传失败: ${info.file.msg} `);
        }
      }
    },

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值