<!--
 * @Descripttion: 当前组件信息
 * @version: 1.0.0
 * @Author: 无尘
 * @Date: 2019-11-15 10:10:08
 * @LastEditors: 无尘
 * @LastEditTime: 2019-12-04 20:02:06
 -->

<template>
  <div class="data-detail common-wrap">
    <nav-crumb :navpath="navpath"></nav-crumb>
    <div class="right-content border-box">
      <div class="right-box border-box">
        <div class="data-detail-tab flex flex-space-between">
          <div class="data-detail-radios">
            <el-radio-group
              v-model="tabName"
              style="margin-bottom: 30px;"
            >
              <el-radio-button label="invite">邀请人列表</el-radio-button>
              <el-radio-button label="invited">受邀人列表</el-radio-button>
            </el-radio-group>
          </div>
          <div class="data-detail-export">
            <el-tooltip content="邀请人列表和受邀人列表里面的会员信息每天更新一次" placement="top">
              <i class="iconfont icon-xinxixianshi" style="margin-right:10px;cursor:pointer;color:#909399"></i>
            </el-tooltip>
            <el-button
              type="primary"
              @click="exportData"
            ><i class="iconfont icon-icon_yunxiazai"></i> 导出数据</el-button>
          </div>
        </div>
        <div class="data-detail-table">
          <invite-table
            ref="inviteTable"
            v-if="tabName == 'invite'"
          ></invite-table>
          <invited-table
            ref="invitedTable"
            v-if="tabName == 'invited'"
          ></invited-table>
        </div>
      </div>
    </div>
    <vue-gic-footer></vue-gic-footer>

    <vue-gic-export-excel
      :dataArr="tableData"
      :dialogVisible.sync="dialogVisible"
      :projectName="projectName"
      :type="2"
      :excelUrl="excelUrl"
      :params="params"
    >
    </vue-gic-export-excel>
  </div>
</template>
<script>
import navCrumb from '@/components/nav/nav.vue';
import inviteTable from '@/components/data-details/invite-table.vue';
import invitedTable from '@/components/data-details/invited-table.vue';
// import exportExcel from '@/components/export-excel'
// import { postExcel } from '@/api/api';
// import errMsg from '@/common/js/error';
// import showMsg from '@/common/js/showmsg';
export default {
  name: 'dataDetail',
  components: {
    navCrumb,
    inviteTable,
    invitedTable,
    // exportExcel
  },
  data() {
    return {
      tabName: 'invite',
      // 面包屑参数
      navpath: [
        {
          name: '分享有礼',
          path: `/shareIndex`
          /*relocation: true */
        },
        {
          name: '数据明细'
          /*relocation: true */
        }
      ],
      tableData: [],
      dialogVisible: false,
      excelUrl: '/sharing-core-web/export',
      params: {
        activityId: this.$route.query.activityId,
        isExportInvited: this.tabName == 'invite'? false : true,
        requestProject: 'share-config',
      },
      projectName: 'share-config'
    };
  },
  methods: {
    /**
     * 导出数据
     */
    exportData() {
      const that = this;
      that.dialogVisible = true;
      that.tableData = that.tabName == 'invite'? that.$refs.inviteTable.tableData: that.$refs.invitedTable.tableData;
      that.params = {
        activityId: that.$route.query.activityId,
        isExportInvited: that.tabName == 'invite'? false : true,
        requestProject: 'share-config',
      };
    }
  }
};
</script>
<style lang="less" scoped>
.data-detail {
  width: 100%;
  .data-detail-tab {
    width: 100%;
    height: 32px;
  }
  .data-detail-table {
    margin-top: 20px;
  }
}
</style>
