<template>
  <header-collapse>
    <base-form slot="content" ref="ruleForm" :data="searchData">
      <div slot="footer">
        <el-button :loading="listLoading" icon="el-icon-search" class="xl-form-btn bgc1" @click="searchHandle">查询</el-button>
        <el-button :loading="listLoading" icon="el-icon-plus" class="xl-form-btn bgc2" @click="addHandle">单个添加</el-button>
        <el-upload
          style="display: inline-block;margin-left: 10px;"
          ref="upload"
          name="excel"
          :action="`${requireUrl}/adm/customer/import`"
          :data="{type: 'cust', token}"
          :show-file-list="false"
          :on-success="uploadSuccess"
          :on-error="uploadError"
          :before-upload="uploadBefore"
          :multiple="false"
          :limit="1"
          :on-exceed="uploadHandleExceed"
        >
          <el-button icon="el-icon-upload2" class="xl-form-btn bgc3" >批量导入</el-button>
        </el-upload>
        <!-- <el-button :loading="listLoading" icon="el-icon-plus" class="xl-form-btn bgc3" @click="addHandle">批量导入</el-button> -->
      </div>
    </base-form>
  </header-collapse>
</template>
<script>
export default {
  name: 'custIndex',
  mixins: [],
  props: {
    listLoading: Boolean
  },
  inject: ['parentData'],
  data() {
    let requireUrl = process.env.VUE_APP_BASE_API
    const token = window.sessionStorage.getItem('fp_token')
    return {
      requireUrl,
      uploadHeaders: {
        'Content-Type': 'multipart/form-data'
      },
      token,
      searchData: [
        { label: '电话', key: 'phone' },
        { label: '姓名', key: 'name' },
        { label: '性别', key: 'sex', type: 'select', options: this.$dictData.sex},
        { label: '备注', key: 'demand' },
      ]
    }
  },
  methods: {
    uploadBefore(file) {
      console.log('上传前:', file)
    },
    uploadHandleExceed(files, fileList) {
      this.$msgw(`当前限制上传 1 个文件`)
    },
    uploadSuccess(res, file) {
      this.$refs.upload.clearFiles()
      if(res.errno === 0){
        this.$msg('导入成功！', '', () => {
          this.parentData.fetchData()
        })
      } else {
        this.$msgw(res.errno + '-' + res.errmsg)
      }
    },
    uploadError(file) {
      this.$refs.upload.clearFiles();
      this.$msg('上传失败！')
      console.log('上传失败：', file)
    },
    addHandle () {
      this.parentData.isDtlShow = true
      this.parentData.curObj = {}
    },
    searchHandle() {
      const oldform = this.$refs.ruleForm.baseForm
      const newForm = { ...oldform }
      this.$emit('change', newForm)
    }
  }
}
</script>
