<template>
  <div id="index">
    <list-tab :tab="tabsTitle">
      <template v-slot:title>
        双选会
      </template>
      <template v-slot:main1>
        <list :dataList="myList" :totalRow="myTotalRow" @changePage="search" @delete="handleDelete" type="my" @receipt="receipt"></list>
      </template>
      <template v-slot:main2>
        <list :dataList="firstList" :totalRow="firstTotalRow" @changePage="search" type="first"></list>
      </template>
    </list-tab>
  </div>
</template>

<script>
import list from './list.vue';
import listTab from '@/layout/list-tab.vue';
import { mapActions, mapState } from 'vuex';
export default {
  name: 'index',
  // metaInfo: {
  //   title: '招聘会管理',
  // },
  components: {
    list,
    listTab,
  },
  data: () => ({
    firstTotalRow: 60,
    myTotalRow: 30,
    tabsTitle: ['我的报名', '我要报名'],
    firstList: [],
    myList: [],
  }),
  async created() {
    await this.search({ type: 'my' });
    await this.search({ type: 'first' });
  },
  computed: {
    ...mapState(['user']),
  },
  methods: {
    ...mapActions(['jobfairOperation']),
    async search({ type, currentPage }) {
      let skip = 0;
      if (currentPage) {
        skip = (currentPage - 1) * this.$limit;
      }
      let newType = type === 'my' ? 'myList' : 'list';
      let result = await this.jobfairOperation({
        type: newType,
        data: { corpid: type === 'my' ? this.user.corpid : undefined, skip: skip, limit: this.$limit, status: type !== 'my' ? '0' : undefined },
      });
      if (`${result.errcode}` === '0') {
        //给this=>vue的实例下在中的list属性，赋予result。data的值
        this.$set(this, `${type}TotalRow`, result.total);
        let newList;
        if (type === 'my') {
          newList = await this.proMyList(result.data);
        } else {
          newList = result.data;
        }
        this.$set(this, `${type}List`, newList);
      } else {
        this.$message.error(result.errmsg ? result.errmsg : 'error');
      }
      if (type === 'first') {
        let arr = this.firstList.map(item => {
          let res = this.myList.filter(fil => fil.fairid === item.id);
          item.is_join = res.length > 0 ? '已申请' : '未申请';
          return item;
        });
        this.$set(this, `${type}List`, arr);
      }
    },
    async proMyList(list) {
      let arr = [];
      for (const item of list) {
        let object = await this.searchJobfair(item);
        arr.push(object);
      }
      return arr;
    },
    async searchJobfair(object) {
      let result = await this.jobfairOperation({ type: 'search', data: { id: object.fairid } });
      if (`${result.errcode}` === '0') {
        //需要myList显示什么东西,少的自己来这加
        let { title, organizer, city, schname, time } = result.data;
        object = { ...object, title, organizer, city, schname, time };
      }
      return object;
    },
    async handleDelete({ id }) {
      this.$confirm('是否删除该宣讲会?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          this.toDelete(id);
        })
        .catch(() => {});
    },
    async toDelete(id) {
      let result = await this.jobfairOperation({ type: 'delete', data: { id: id } });
      if (`${result.errcode}` === '0') {
        this.$message.success('删除成功');
        this.search();
      } else {
        this.$message.error(result.errmsg ? result.errmsg : '删除失败');
      }
    },
    async receipt(item) {
      let result = await this.jobfairOperation({ type: 'applyUpdate', data: { id: item.id, info: { receipt_letter: item.receipt_letter } } });
      if (`${result.errcode}` === '0') {
        this.$message.success('保存回执');
      } else {
        this.$message.error(result.errmsg || '操作失败');
      }
    },
  },
};
</script>

<style lang="less" scoped>
li {
  list-style: none;
}
p {
  margin: 0;
  padding: 0;
}
.tit h4 {
  color: #333;
  font-size: 15px;
}
.search {
  width: 100%;
  float: left;
  height: 33px;
  margin-bottom: 10px;
  color: #333;
  font-size: 15px;
  margin-bottom: 10px;
}
/deep/.searchInput .el-input__inner {
  height: 33px;
  line-height: 33px;
  border: 1px solid #ccc;
  border-radius: 0px;
}
/deep/.searchBtn .el-button {
  width: 35px;
  height: 33px;
  border: 1px solid #ccc;
  border-radius: 0px;
  padding: 6px 7px;
  color: #555555;
  font-weight: bold;
  font-size: 15px;
  background-color: #eeeeee;
}
.add {
  float: right;
  width: 69px;
  height: 34px;
}
.add .el-button {
  float: right;
  padding: 0;
  width: 69px;
  height: 34p;
  height: 34px;
  text-align: center;
  background: #44b549;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
}
.talkli {
  float: left;
}
.Name {
  float: left;
  width: 100%;
}
.row_pagination {
  text-align: right;
  margin-top: 1rem;
}
</style>
