<template>
  <a-spin :spinning="spinningAdd">
    <div>
      <a-page-header
        style="background-color: #FFFFFF;"
        title="客户资料导入"
        sub-title="1、先选择客户资料，进行导入前预览。2、信息无误后再确认导入"
        @back="goBack"
      >
        <a-alert message="导入表格中机主姓名、号码、漫游被关停日期、三级部门、复开时间为必填项。" type="warning" show-icon />
        <a-divider style="margin: 6px;"/>
      </a-page-header>

      <a-card :bordered="false" style="margin-top: -22px;">
        <!-- 操作按钮区域 start -->
        <div class="table-operator">
          <a-button type="primary" icon="import"
                    @click="downloadTemplat">下载导入模版
          </a-button>

          <a-upload name="file"
                    :showUploadList="false"
                    :multiple="false"
                    :headers="tokenHeader"
                    :action="url.importExcel"
                    @change="uploadChange">
            <a-button type="primary" icon="upload">客户资料选择</a-button>
          </a-upload>
          <a-button type="primary" icon="import"
                    @click="importInfo">确定导入
          </a-button>
        </div>
        <!-- 操作按钮区域 end -->

        <!-- table区域 begin -->
        <div>
          <a-table
            ref="table"
            size="middle"
            bordered
            :scroll="{x:true}"
            :columns="columns"
            :dataSource="dataSource"
            :pagination="false"
            :loading="loading"
            class="j-table-force-nowrap"
            :rowClassName='getRowBackGround'
            @change="handleTableChange">

          </a-table>
        </div>
        <!-- table区域 end -->

      </a-card>

    </div>
  </a-spin>


</template>

<script>

import {JeecgListMixin} from '@/mixins/JeecgListMixin'
import {getAction, httpAction} from '@api/manage'

export default {
  name: 'TaskImport',
  mixins: [JeecgListMixin],
  data() {
    return {
      //加载属性
      spinningAdd: false,
      description: '导入页面',
      autoSearch: false,
      dataSource: [],
      errorCount: 0,
      task: {},
      // 表头
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: "center",
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          }
        },
        {
          title: '机主姓名',
          align: "center",
          dataIndex: 'customerName'
        },
        {
          title: '号码',
          align: "center",
          dataIndex: 'smsNumber'
        },
        {
          title: '有无特审单/签报',
          align: "center",
          dataIndex: 'materialLabel'
        },
        {
          title: '是否自查实名制合规',
          align: "center",
          dataIndex: 'nameFindCompliance'
        },
        {
          title: '导入结果',
          align: "center",
          dataIndex: 'result',
          customRender: function (text, record, index) {
            if (text == "1") {
              return '成功'
            } else if (text == "0") {
              return '失败'
            }
            return '';
          }
        },
        {
          title: '错误结果',
          align: "center",
          dataIndex: 'errorMsg'
        },
      ],
      url: {
        importExcel: window._CONFIG['domainURL'] + "/special/examination/importCustomerExcel", //数据入库
        importData: "/special/examination/taskId/importCustomerData", //识别excel数据
        queryTask: "/smsCheck/task/queryById",
      },
    }
  },
  created() {
    this.task.id = this.$route.query.id;
    this.queryInfoById(this.task.id);
  },
  methods: {
    /**下载模版*/
    downloadTemplat(){
      const a = document.createElement('a')
      // a.href = '/static/specialExamination.xlsx'
      a.href = '/web/tnc/static/specialExamination.xlsx'
      a.setAttribute('download', '特审复开审批模版.xlsx')
      a.click();
      a.remove();
    },
    // 返回上一级
    goBack() {
      this.$router.go(-1);
      this.closeCurrent();
    },
    /**
     * 上传事件回调
     *
     * @param result 回调值
     */
    uploadChange(result) {
      let file = result.file;
      let event = result.event;
      if (event === undefined && file.status === 'uploading') {
        this.$message.info('开始上传');
      }
      if (event && file.status === 'uploading') {
        this.$message.info('上传中，请稍等……');
      }
      if (file.response) {
        let success = file.response.success;
        let message = file.response.message;
        if (!success) {
          this.$message.error(message);
        }
        if (file.status === 'done') {
          this.dataSource = file.response.result.data;
          this.errorCount = file.response.result.errorCount;
          if (this.errorCount > 0) {
            this.$message.error('导入含有错误项，请检查内容')
          } else {
            this.$message.info('上传完成');
          }
        }
      }

    },
    /**
     * 导入信息
     */
    importInfo() {
      if (this.dataSource.length === 0) {
        this.$message.error('暂无导入数据，请上传导入文件！');
        return;
      }
      if (this.errorCount !== 0) {
        this.$message.error('包含非法数据，无法导入！');
        return;
      }

      this.$message.info('开始导入，请稍等……');
      this.spinningAdd = true;
      let httpUrl = this.url.importData.replaceAll("taskId", this.task.id);
      let params = this.dataSource;
      let method = 'POST';
      let that = this;
      // 发送请求
      httpAction(httpUrl, params, method)
        .then((res) => {
          if (res.success) {
            that.dataSource = res.result
            that.$message.success(res.message);
            that.$emit('ok');
            that.visible = false;
          } else {
            that.$message.warning(res.message);
          }
          this.spinningAdd = false;
        }).finally(() => {
        that.confirmLoading = false;
        this.spinningAdd = false;
      })
    },
    /**整行换色*/
    getRowBackGround(recordAlarm) {
      switch (recordAlarm.result) {//这里根据条件改变表格背景色
        case "0":
          return "table-color-error"
      }
    },

    getTaskState(taskState) {
      if (taskState === 0) {
        this.task.taskStateColor = '#fadb14';
        this.task.taskStateText = '未开始';
      } else if (taskState === 1) {
        this.task.taskStateColor = '#1890ff';
        this.task.taskStateText = '稽核中';
      } else if (taskState === 2) {
        this.task.taskStateColor = '#52c41a';
        this.task.taskStateText = '稽核完成';
      }
    },
    queryInfoById(id) {
      let url = this.url.queryTask;
      let params = {
        id: id
      }
      let that = this;
      getAction(url, params).then(res => {
        if (res.success) {
          that.task = res.result;
          that.getTaskState(that.task.taskState);
        }
      }).finally(() => {

      })
    },
  }
}
</script>

<style>
.table-color-error {
  color: rgba(255, 0, 0, 0.82);
  /*background-color: rgba(255, 0, 0, 0.82);*/
}

</style>