<!--
 * @Descripttion: 当前组件信息
 * @version: 1.0.0
 * @Author: 无尘
 * @Date: 2019-11-12 11:02:27
 * @LastEditors: 无尘
 * @LastEditTime: 2019-12-15 13:52:51
 -->
<template>
  <div class="invited-log common-wrap">
    <nav-crumb :navpath="navpath"></nav-crumb>
    <div class="right-content border-box">
      <div class="right-box border-box">
        <div class="invited-data">
          <div class="invited-data-img flex flex-align-center flex-pack-center"><img
              :src="invitedData.headUrl"
              alt=""
            ></div>
          <div class="invited-data-name text-center font-14 color-606266">-{{invitedData.nickName}}/{{invitedData.realName}}-</div>
        </div>
        <div class="invited-log-table">
          <el-table
            class="select-table"
            ref="multipleTable"
            :data="tableData"
            tooltip-effect="dark"
            :style="{ width: '100%'}"
          >

            <el-table-column
              prop=""
              label="操作时间"
              show-overflow-tooltip
            >
              <template slot-scope="scope">
                <div class="cell">
                  <div>{{ scope.row.transTime | timeStampToYmd }}</div>
                  <div>{{ scope.row.transTime | timeStampToHms }}</div>
                </div>
              </template>
            </el-table-column>
            <el-table-column
              prop=""
              label="转化进度"
              show-overflow-tooltip
            >
              <template slot-scope="scope">{{ scope.row.transName || '--' }}</template>
            </el-table-column>
            <el-table-column
              prop=""
              label="详情"
              show-overflow-tooltip
            >
              <template slot-scope="scope">{{scope.row.orderNo ? '订单编号：' : ''}}{{ scope.row.orderNo || '--' }}</template>
            </el-table-column>
          </el-table>
          <!-- <div
        class="block common-wrap__page text-right m-t-24"
        v-if="tableData.length != 0"
      >
        <dm-pagination
          background
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[20, 40, 60, 80]"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
        > </dm-pagination>
      </div> -->
        </div>
      </div>
    </div>
    <vue-gic-footer></vue-gic-footer>
  </div>
</template>
<script>
import navCrumb from '@/components/nav/nav.vue';
import { getRequest } from '@/api/api';
import errMsg from '@/common/js/error';
export default {
  name: 'invited-log',
  components: {
    navCrumb,
  },
  data() {
    return {
      // 面包屑参数
      navpath: [
        {
          name: '分享有礼',
          path: `/shareIndex`,
          /*relocation: true */
        },
        {
          name: '受邀人日志',
          /*relocation: true */
        },
      ],
      invitedData: {
        headUrl: '',
        realName: ''
      },
      // 分页参数
      tableData: [],
      currentPage: 1,
      pageSize: 20,
      total: 0,
    }
  },
  methods: {
    /**
     * 分页---页码变化
     */
    handleSizeChange(val) {
      const that = this;
      that.pageSize = val;
      that.getTableList();
    },

    /**
     * 分页---当前页变化
     */
    handleCurrentChange(val) {
      const that = this;
      that.currentPage = val;
      that.getTableList();
    },

    /**
     * 获取列表数据
     */
    getInvitedData() {
      const that = this;
      let para = {
        activityId: that.$route.query.activityId,
        openId: that.$route.query.invitedId
      };
      getRequest('/sharing-core-web/get-activity-invited', para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            that.invitedData = resData.result || {
              headUrl: '',
              realName: ''
            };
            return false;
          }
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    },
    /**
     * 获取列表数据
     */
    getTableList() {
      const that = this;
      let para = {
        openId: that.$route.query.invitedId,
        activityId: that.$route.query.activityId
      };
      getRequest('/sharing-core-web/list-activity-invited-trans', para)
        .then(res => {
          let resData = res.data;
          if (resData.errorCode == 1) {
            that.tableData = resData.result || [];
            return false;
          }
          errMsg.errorMsg(resData);
        })
        .catch(function(error) {
          that.$message.error({
            duration: 1000,
            message: error.message
          });
        });
    }
  },
  mounted() {
    const that = this;
    that.getInvitedData();
    that.getTableList();
  }
}
</script>
<style lang="less" scoped>
.invited-log {
  width: 100%;
  .invited-data {
    width: 100%;
    height: 152px;
    .invited-data-img {
      width: 100px;
      height: 100px;
      margin: 0 auto;
      border-radius: 50%;
      img {
        max-width: 100px;
        max-height: 100px;
        border-radius: 50%;
      }
    }
    .invited-data-name {
      margin-top: 10px;
    }
  }
}
</style>
