<style>
  .recruitStick .content {
    background: #fff;
    margin-top: 10px;
    padding: 15px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  .recruitContent {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
  }

</style>
<template>
  <div class="recruitStick">
    <div class="head-title">
      <span @click="CommonJump('recruitStick')" class="blue point">招募贴</span> / 报名列表
    </div>
    <div style="margin-top:10px;padding: 20px;background: #fff;">
      <el-table :data="tableData" header-cell-class-name="headClass" style="width: 100%" border>
        <el-table-column prop="Name" label="姓名">
          <template slot-scope="scope">
            <div style="display:flex;align-items:center;">
              <img :src="scope.row.Photo" alt=""
                style="width:30px;height:30px;border-radius:50%;margin-right:5px;" />{{scope.row.Name}}
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="Mobile" label="电话">
        </el-table-column>
        <el-table-column prop="UserName" label="用户名">
        </el-table-column>
        <el-table-column prop="Remark" label="内容">
          <template slot-scope="scope">
            <div class="recruitContent">{{scope.row.Remark}}</div>
          </template>
        </el-table-column>
        <el-table-column prop="CreateDate" label="创建时间">
        </el-table-column>
      </el-table>
      <el-pagination style="text-align:right" background @current-change="handleCurrentChange" :page-size="msg.pageSize"
        layout="prev, pager, next" :current-page.sync="msg.pageIndex" :total="count">
      </el-pagination>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        count: 0,
        msg: {
          pageIndex: 1,
          pageSize: 20,
          ActivityId: 0
        },
        tableData: []
      }
    },
    created() {},
    mounted() {
      if (this.$route.query.Id) {
        this.msg.ActivityId = this.$route.query.Id;
      }
      this.getList()
    },
    methods: {
      getList() {
        this.apipost("/api/Miai/GetActivityEnrollPageList", this.msg, res => {
          if (res.data.resultCode == 1) {
            this.count = res.data.data.pageCount;
            this.tableData = res.data.data.pageData;
          } else {
            this.Error(res.data.message);
          }
        })
      },
      handleCurrentChange(val) {
        this.msg.pageIndex = val;
        this.getList();
      }
    },
  }

</script>
