<template>
  <div id="index">
    <recruitdetail-layout :needRight="false">
      <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 class="webDetail">企业详情</el-breadcrumb-item>
            </el-breadcrumb>
          </el-col>
        </el-row>
        <share></share>
      </template>
      <template v-slot:mainLeft>
        <el-row class="webMessage" type="flex">
          <el-col :span="24">企业信息</el-col>
        </el-row>
        <el-row type="flex" class="baseRow">
          <el-col :span="3">
            <el-image style="width:5.25rem;height:5.25rem;" :src="corpInfo.logo_url" fit="fill"></el-image>
          </el-col>
          <el-col :span="18">
            <el-row id="corpname">
              <el-col :span="24">{{ corpInfo.corpname }}</el-col>
            </el-row>
            <el-row id="industry">
              <el-col :span="8">
                行业:<span>{{ corpInfo.industry }}</span>
              </el-col>
              <el-col :span="12">
                规模:<span>{{ corpInfo.scale }}</span>
              </el-col>
            </el-row>
            <el-row id="address">
              <el-col :span="8">
                城市:<span>{{ corpInfo.province }}-{{ corpInfo.city }}</span>
              </el-col>
              <el-col :span="16">
                地址:<span>{{ corpInfo.address }}</span>
              </el-col>
            </el-row>
            <el-row id="content1">
              <el-col :span="24">
                联系电话:<span>{{ corpInfo.job_tel }}</span>
              </el-col>
            </el-row>
            <el-row id="content2">
              <el-col :span="24">
                邮箱:<span>{{ corpInfo.job_email }}</span>
              </el-col>
            </el-row>
            <el-row id="other">
              <el-col :span="8">
                注册资金:<span>{{ corpInfo.reg_capital }}</span>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                企业标签:
                <el-tag v-for="(item, index) in corpInfo.tags" :key="index">{{ item }}</el-tag>
              </el-col>
            </el-row>
          </el-col>
        </el-row>
        <web-intro title="单位简介" :info="corpInfo"></web-intro>
        <web-jobs title="招聘职位" :info="jobList" @search="searchJobs"> </web-jobs>
      </template>
    </recruitdetail-layout>
  </div>
</template>

<script>
import recruitdetailLayout from '@/layout/recruitdetail-layout.vue';
import share from '@/layout/share.vue';
import webIntro from '@/layout/detail/web-intro.vue';
import webJobs from '@/layout/detail/web-jobs.vue';
import { mapActions, mapState } from 'vuex';
export default {
  name: 'index',
  props: {},
  components: {
    recruitdetailLayout,
    share,
    webIntro,
    webJobs,
  },
  data: () => ({
    corpInfo: {},
    jobList: [],
  }),
  created() {
    this.search();
  },
  computed: {},
  methods: {
    ...mapActions(['corpOperation', 'postOperation']),
    async search() {
      if (!this.$route.query.id) return;
      let result = await this.corpOperation({ type: 'component', data: { corpid: this.$route.query.id } });
      if (`${result.errcode}` === '0') {
        this.$set(this, 'corpInfo', result.data);
        this.$set(this.corpInfo, `id`, this.$route.query.id);
      } else {
        this.$message.error(result.errmsg ? result.errmsg : 'error');
      }
    },
    async searchJobs(query) {
      console.log(query);
      let result = await this.postOperation({ type: 'list', data: { corpid: this.$route.query.id, ...query } });
      if (`${result.errcode}` === '0') {
        this.$set(this, `jobList`, result);
      }
    },
  },
};
</script>

<style lang="less" scoped>
.webMessage {
  border-left: 0.1875rem solid #850000;
  font-size: 1rem;
  line-height: 1.875rem;
  height: 1.875rem;
  padding: 0 0.9375rem;
  margin: 0 0 0 -0.9375rem;
}
.baseRow {
  padding: 1.25rem;
  font-size: 0.875rem;
  color: #333333;
  span {
    padding-left: 0.5rem;
  }
}
</style>
