<template>
  <div id="detail">
    <recruitdetail-layout>
      <template v-slot:mainInfoTop>
        <el-row>
          <el-col :span="24">
            <el-breadcrumb separator-class="el-icon-arrow-right">
              <el-breadcrumb-item :to="{ path: '/' }"
                ><i class="el-icon-s-home"></i>
                <span>网站首页</span>
              </el-breadcrumb-item>
              <el-breadcrumb-item><span>在线招聘</span></el-breadcrumb-item>
              <el-breadcrumb-item class="webDetail">详情</el-breadcrumb-item>
            </el-breadcrumb>
          </el-col>
        </el-row>
        <share></share>
      </template>
      <template v-slot:mainLeft>
        <jobinfo-context :info="info"></jobinfo-context>
        <!-- <web-jobs title="招聘职位" :info="info"> </web-jobs> -->
        <web-jobs title="招聘职位" :info="jobList" type="2" :origin="info.id"> </web-jobs>
      </template>
      <template v-slot:mainRight>
        <corpInfo :corpid="info.corpid"></corpInfo>
      </template>
    </recruitdetail-layout>
  </div>
</template>

<script>
import corpInfo from '@/layout/corpInfo.vue';
import share from '@/layout/share.vue';
import recruitdetailLayout from '@/layout/recruitdetail-layout.vue';
import jobinfoContext from '@/layout/detail/jobinfo/context.vue';
import webJobs from '@/layout/detail/web-jobs.vue';
import { mapActions, mapState } from 'vuex';

export default {
  name: 'detail',
  props: {},
  components: {
    recruitdetailLayout,
    jobinfoContext,
    webJobs,
    corpInfo,
    share,
  },
  data: () => ({
    info: [],
    corpInfo: {},
    jobList: [],
  }),
  created() {
    this.search();
  },
  computed: {},
  methods: {
    ...mapActions(['jobinfoOperation', 'postOperation']),
    async search() {
      //1直接拿着参数发送请求
      let result = await this.jobinfoOperation({ type: 'search', data: { id: this.$route.query.id } });
      if (`${result.errcode}` === '0') {
        //给this=>vue的实例下在中的list属性，赋予result.data的值
        this.$set(this, `info`, result.data);
        // this.searchCorpInfo();
        this.searchJobs();
      } else {
        this.$message.error(result.errmsg ? result.errmsg : 'error');
      }
    },
    async searchJobs() {
      let result;
      let jobIds = this.info.jobs.length > 0 ? this.info.jobs : [];
      let jobList = [];
      for (const item of jobIds) {
        result = await this.postOperation({ type: 'search', data: { id: item } });
        if (`${result.errcode}` === '0') {
          jobList.push(result.data);
        }
      }
      this.$set(this, `jobList`, jobList);
    },
  },
};
</script>

<style lang="less" scoped></style>
