<template>
  <div id="talk-context">
    <el-row>
      <el-col class="webMessage">
        {{ title }}
      </el-col>
      <el-col style="padding: 3.125rem .9375rem;">
        <el-col class="comDetail">
          <span v-html="info.content">
            {{ info && info.content ? info.content : '' }}
          </span>
        </el-col>

        <!-- <el-col class="comTitle">
          <span style="font-weight: bold;">{{ detail && detail.tit ? detail.tit : '' }} </span>
        </el-col>
        <el-col><span class="comView">公司简介：</span></el-col>
        <el-col class="comDetail">
          <span>{{ detail && detail.abs ? detail.abs : '' }}</span>
        </el-col>
        <el-col><span class="comView">发展历程：</span></el-col>
        <el-col class="comDetail">
          <span>
            {{ detail && detail.dev ? detail.dev : '' }}
          </span>
        </el-col>
        <el-col><span class="comView">全球布局：</span></el-col>
        <el-col class="comDetail">
          <span>
            {{ detail && detail.glo ? detail.glo : '' }}
          </span>
        </el-col>
        <el-col><span class="comView">产品系列：</span></el-col>
        <el-col class="comDetail">
          <span>
            {{ detail && detail.ser ? detail.ser : '' }}
          </span>
        </el-col>
        <el-col><span class="comView">全球客户：</span></el-col>
        <el-col class="comDetail">
          <span>
            {{ detail && detail.cli ? detail.cli : '' }}
          </span>
        </el-col>
        <el-col :span="24"><span>&nbsp;</span></el-col>
        <el-col><span class="comView">岗位需求：</span></el-col>
        <el-col :span="24"><span>&nbsp;</span></el-col>
        <el-col>
          <el-table :data="detail.tableData" :span-method="objectSpanMethod" border style="width: 80%; margin-top: 1.25rem;">
            <el-table-column prop="id" label="岗位序列" width="180"> </el-table-column>
            <el-table-column prop="name" label="岗位名称"> </el-table-column>
            <el-table-column prop="major" label="需求专业"> </el-table-column>
            <el-table-column prop="edu" label="学历"> </el-table-column>
            <el-table-column prop="worspace" label="工作地点"> </el-table-column>
            <el-table-column prop="require" label="语言要求"> </el-table-column>
          </el-table>
        </el-col>
        <el-col style="margin-top: 2rem;"><span class="comView">宣讲时间地点：</span></el-col>
        <el-col class="comDetail">
          <span style="text-indent: 0;">
            宣讲时间：{{ detail && detail.intime ? detail.intime : '' }} 宣讲地点：{{ detail && detail.inplace ? detail.inplace : '' }}
          </span>
        </el-col>
        <el-col><span class="comView">联系方式：</span></el-col>
        <el-col class="comDetail">
          <span style="text-indent: 0;">网址：</span>
          <span style="font-family: 微软雅黑; text-indent: 0;">{{ detail && detail.inweb ? detail.inweb : '' }}</span>
        </el-col>
        <el-col class="comDetail">
          <span style="text-indent: 0;">总部地址：</span>
          <span style="text-indent: 0;">{{ detail && detail.inadd ? detail.inadd : '' }}</span>
        </el-col>
        <el-col class="comDetail">
          <span style="text-indent: 0;">招聘负责人：</span>
          <span style="text-indent: 0;">{{ detail && detail.inmail ? detail.inmail : '' }}</span>
        </el-col>
        <el-col style="text-align: center;margin: 1.25rem 0rem">
          <a href="#" class="btnComplaint">
            <el-image class="report" :src="pic"></el-image>
            <span style="color: #fff;font-size: .875rem;">校园招聘违规举报</span>
          </a>
        </el-col> -->
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'talk-context',
  props: {
    title: {
      type: String,
    },
    info: {
      type: Object,
      default: () => {},
    },
  },
  components: {},
  data: () => ({
    detail: {},
    pic: require('@/assets/safity.png'),
  }),
  mounted() {
    // this.$set(this, `detail`, this.info);
  },
  created() {},
  computed: {},
  methods: {
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        if (rowIndex % 2 === 0) {
          return {
            rowspan: 2,
            colspan: 1,
          };
        } else {
          return {
            rowspan: 0,
            colspan: 0,
          };
        }
      }
    },
  },
};
</script>

<style lang="less" scoped>
.el-link:hover {
  text-decoration: underline;
  color: #850000;
}
.btnComplaint {
  color: #fff !important;
  display: inline-block;
  background-color: #77b911;
  height: 2.5rem;
  line-height: 2.5rem;
  padding: 0 1.25rem;
  border-radius: 0.1875rem;
  font-size: 0.875rem;
}
.report {
  width: 1.5425rem;
  height: 1.875rem;
  float: left;
  margin: 0.3125rem 0.3125rem 0 0;
}
a {
  text-decoration: none;
}
/deep/ .el-breadcrumb__inner {
  color: #999;
}
.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;
}
/deep/.el-button--mini {
  padding: 0.625rem 0.9375rem;
}
.firmLogo {
  width: 100%;
  height: 5.125rem;
  text-align: center;
}
.firmLogo .el-image__inner {
  width: 5.125rem;
  border: 0.0625rem solid #f6f6f6;
}
/deep/.el-button--danger {
  background-color: #850000;
}
/deep/.el-button--mini {
  padding: 0.5rem 0.3125rem;
}

.sizeA {
  font-size: 0.875rem;
}
.comTitle {
  font-size: 1.3125rem;
  font-weight: bold;
  color: #000;
  font-family: 宋体;
  text-align: center;
}
.comView {
  font-size: 1rem;
  font-family: 宋体;
  font-weight: bold;
}

.comDetail span {
  display: inline-block;
  font-size: 1rem;
  line-height: 1.5rem;
  height: 1.5rem;
  font-family: 宋体;
  color: #333333;
  text-indent: 1.875rem;
}
</style>
