<template>
  <div id="resumeJob">
    <el-row>
      <el-col :span="24" class="jobTop">
        <el-col :span="5">
          <el-avatar :size="60" :src="circleUrl"></el-avatar>
        </el-col>
        <el-col :span="19" class="topRight">
          <el-col :span="24"><span style="font-size: 16px;">于奇&nbsp;&nbsp;(男)</span></el-col>
          <el-col :span="24"><span style="color: #7CFC00;">没有</span></el-col>
          <el-col :span="24">
            <el-col :span="6"><span>长春大学</span></el-col>
            <el-col :span="18"><el-tag class="isStu" style="color: #00bfff;">未认证为本校生</el-tag></el-col>
          </el-col>
          <el-col :span="24"><span>政治面貌：&nbsp;共青团员</span></el-col>
        </el-col>
      </el-col>
      <el-col style="border-bottom: 1px solid #ccc;">
        <el-col :span="24" class="jobBottom">
          <el-col :span="24" class="itemDetail">
            <el-col :span="24" class="jobItem"><span>求职意向</span></el-col>
            <el-col :span="24" class="itemList">
              <el-col :span="2" class="itemPoint"><span></span></el-col>
              <el-col :span="22" class="itemTit">期望职业：程序员</el-col>
            </el-col>
            <el-col :span="24" class="itemList">
              <el-col :span="2" class="itemPoint"><span></span></el-col>
              <el-col :span="22" class="itemTit">期望薪资：6K</el-col>
            </el-col>
            <el-col :span="24" class="itemList">
              <el-col :span="2" class="itemPoint"><span></span></el-col>
              <el-col :span="22" class="itemTit">期望城市：长春</el-col>
            </el-col>
          </el-col>
          <el-col :span="24" class="itemDetail">
            <el-col :span="24" class="jobItem"><span>专业技能</span></el-col>
            <el-col :span="24" style="padding: 10px;">
              <el-tag effect="plain" class="jobSkill" style="color: #606266;">思维敏捷</el-tag>
            </el-col>
          </el-col>
          <el-col :span="24" class="itemDetail">
            <el-col :span="24" class="jobItem"><span>教育经历</span></el-col>
            <el-col :span="24" class="itemList">
              <el-col :span="2" class="itemPoint"><span></span></el-col>
              <el-col :span="22" class="itemTit">2015年7月至2019年7月&nbsp;&nbsp;长春大学&nbsp;&nbsp;本科</el-col>
            </el-col>
          </el-col>
          <el-col :span="24" class="itemDetail">
            <el-col :span="24" class="jobItem"><span>工作\项目经历</span></el-col>
            <el-col :span="24" class="itemList">
              <el-col :span="2" class="itemPoint"><span></span></el-col>
              <el-col :span="22" class="itemTit">2018年12月至2019年7月&nbsp;&nbsp;长春市福瑞科技有限公司&nbsp;&nbsp;测试</el-col>
            </el-col>
          </el-col>
          <el-col :span="24" class="itemDetail">
            <el-col :span="24" class="jobItem" style="margin-top: 20px;"><span>证书或荣誉</span></el-col>
            <el-col :span="24" style="padding: 10px;">
              <el-tag effect="plain" class="jobSkill" style="color: #606266;">三等奖学金</el-tag>
            </el-col>
          </el-col>
          <el-col :span="24" class="itemDetail">
            <el-col :span="24" class="jobItem"><span>自我介绍</span></el-col>
            <el-col :span="24" class="itemList" style="padding-left: 10px;"><span class="itemTit">你好</span></el-col>
          </el-col>
          <el-col :span="24" class="itemDetail">
            <el-col :span="24" class="jobItem"><span>能力介绍</span></el-col>
            <el-col :span="24" class="itemList" style="padding-left: 10px;"><span class="itemTit">无</span></el-col>
          </el-col>
        </el-col>
      </el-col>
      <el-col :span="24" style="text-align: center; padding: 10px;">
        <el-col :span="12"><el-button class="noBtn">暂不考虑</el-button></el-col>
        <el-col :span="12"><el-button class="yesBtn">合格</el-button></el-col>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'resumeJob',
  props: {},
  components: {},
  data: () => ({
    circleUrl: 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png',
  }),
  created() {},
  computed: {},
  methods: {},
};
</script>

<style lang="less" scoped>
.jobTop {
  background-color: rgb(0, 191, 255);
  border-bottom-right-radius: 10%;
  border-bottom-left-radius: 10%;
  padding: 15px;
}
.jobBottom {
  padding: 15px 0 0 15px;
}
.topRight span {
  color: #fff;
  font-size: 14px;
}
.isStu {
  background-color: #fff;
  height: 20px;
  line-height: 20px;
  padding: 0 5px;
}
.itemDetail {
  margin-bottom: 20px;
}
.jobItem {
  margin-bottom: 5px;
}
.itemPoint {
  text-align: center;
}
.itemList {
  height: 25px;
  line-height: 25px;
}
.itemTit {
  font-size: 14px;
  color: #606266;
}
.itemPoint span {
  width: 5px;
  height: 5px;
  background-color: rgb(0, 191, 255);
  border-radius: 90px;
  display: inline-block;
  margin: 2px 0;
}
.jobSkill {
  border: 1px solid #ebeef5;
  border-radius: 30px;
  height: 23px;
  line-height: 23px;
}
.noBtn {
  width: 95%;
  background-color: #ff1493;
  color: white;
}
.yesBtn {
  width: 95%;
  background-color: #3cb371;
  color: white;
}
</style>
