web-portal/src/layout/detail/talk/talk-head.vue

<template>
  <div id="talk-head">
    <el-row>
      <el-col :span="24" class="webMessage">
        {{ title }}
      </el-col>
      <el-col :span="24" style="padding: 1.25rem .9375rem;">
        <el-col :span="18">
          <span style="font-size: .875rem;">宣讲单位：{{ info && info.title ? info.title : '' }}</span>
          <el-button type="danger" icon="el-icon-search" class="btn" @click="turnTo">工商查询</el-button>
        </el-col>
        <el-col :span="6" class="ticketBtn" style="text-align:right">
          <el-button type="primary" @click="applyTicket()">领取电子入场劵</el-button>
        </el-col>
        <el-col :span="24">
          <span class="sizeA">宣讲时间：{{ info && info.time ? info.time : '' }}</span>
        </el-col>
        <!-- <el-col :span="24">
          <span class="sizeA">所在学校：{{ info && info.school ? info.school : '' }}</span>
        </el-col> -->
        <el-col :span="24">
          <span class="sizeA">宣讲地点：{{ info && info.address ? info.address : '' }}</span>
        </el-col>
        <!-- <el-col :span="24">
          <span class="sizeA">点击人次：{{ info && info.click ? info.click : '' }}</span>
        </el-col> -->
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'talk-head',
  props: {
    title: {
      type: String,
    },
    info: {
      type: Object,
      default: () => {},
    },
  },
  components: {},
  data: () => ({
    detail: {},
  }),
  created() {},
  mounted() {
    // this.$set(this, `detail`, this.info);
  },
  computed: {},
  methods: {
    applyTicket() {
      this.$emit('getTicket');
    },
    turnTo() {
      window.open('https://www.tianyancha.com/');
    },
  },
};
</script>

<style lang="less" scoped>
.btn {
  margin-left: 1.5rem;
  padding: 0.625rem 0.3125rem;
  background: #850000;
}
.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;
}
.sizeA {
  font-size: 0.875rem;
}
.ticketBtn {
  padding: 0.625rem 0 0 0;
}
/deep/.ticketBtn .el-button {
  padding: 0.5rem;
}
</style>