<template>
  <div style="overflow:hidden">
    <div id="recruit">


      <div class="recruit-bg flex-column" style="align-items: center">
        <img src="../assets/image/img/recurit.png" alt="" style="width: 100%">
        <div class="recruit-list" v-if="!showInfo">

          <div class="info" @click="goToInfo()">
            <div class="info-1">应届毕业生（预决算方向）</div>
            <div class="info-2 flex-row">
              <div class="info-address">工作地区：上海</div>
              <div class="info-year"> 薪资：6k-8k</div>
            </div>
            <div class="info-3 flex-row">
              <div class="info-3-money">工作年限：不限</div>
              <div class="info-3-study">学历要求：本科</div>
            </div>
            <div class="line"></div>
            <div class="info-4 flex-row">
              <div class="info-4-1">6K-8K</div>
              <div class="info-4-2">发布于 2021-05-12</div>
            </div>

          </div>
          <div class="info" @click="goToInfo()">
            <div class="info-1">应届毕业生（预决算方向）</div>
            <div class="info-2 flex-row">
              <div class="info-address">工作地区：上海</div>
              <div class="info-year"> 薪资6k-8k</div>
            </div>
            <div class="info-3 flex-row">
              <div class="info-3-money">工作年限：不限</div>
              <div class="info-3-study">学历要求：本科</div>
            </div>
            <div class="line"></div>
            <div class="info-4 flex-row">
              <div class="info-4-1">6K-8K</div>
              <div class="info-4-2">发布于 2021-05-12</div>
            </div>

          </div>
          <div class="info" @click="goToInfo()">
            <div class="info-1">应届毕业生（预决算方向）</div>
            <div class="info-2 flex-row">
              <div class="info-address">工作地区：上海</div>
              <div class="info-year"> 薪资6k-8k</div>
            </div>
            <div class="info-3 flex-row">
              <div class="info-3-money">工作年限：不限</div>
              <div class="info-3-study">学历要求：本科</div>
            </div>
            <div class="line"></div>
            <div class="info-4 flex-row">
              <div class="info-4-1">6K-8K</div>
              <div class="info-4-2">发布于 2021-05-12</div>
            </div>

          </div>
          <div class="info" @click="goToInfo()">
            <div class="info-1">应届毕业生（预决算方向）</div>
            <div class="info-2 flex-row">
              <div class="info-address">工作地区：上海</div>
              <div class="info-year"> 薪资6k-8k</div>
            </div>
            <div class="info-3 flex-row">
              <div class="info-3-money">工作年限：不限</div>
              <div class="info-3-study">学历要求：本科</div>
            </div>
            <div class="line"></div>
            <div class="info-4 flex-row">
              <div class="info-4-1">6K-8K</div>
              <div class="info-4-2">发布于 2021-05-12</div>
            </div>

          </div>
          <div class="info" @click="goToInfo()">
            <div class="info-1">应届毕业生（预决算方向）</div>
            <div class="info-2 flex-row">
              <div class="info-address">工作地区：上海</div>
              <div class="info-year"> 薪资6k-8k</div>
            </div>
            <div class="info-3 flex-row">
              <div class="info-3-money">工作年限：不限</div>
              <div class="info-3-study">学历要求：本科</div>
            </div>
            <div class="line"></div>
            <div class="info-4 flex-row">
              <div class="info-4-1">6K-8K</div>
              <div class="info-4-2">发布于 2021-05-12</div>
            </div>

          </div>
          <div class="info" @click="goToInfo()">
            <div class="info-1">应届毕业生（预决算方向）</div>
            <div class="info-2 flex-row">
              <div class="info-address">工作地区：上海</div>
              <div class="info-year"> 薪资6k-8k</div>
            </div>
            <div class="info-3 flex-row">
              <div class="info-3-money">工作年限：不限</div>
              <div class="info-3-study">学历要求：本科</div>
            </div>
            <div class="line"></div>
            <div class="info-4 flex-row">
              <div class="info-4-1">6K-8K</div>
              <div class="info-4-2">发布于 2021-05-12</div>
            </div>

          </div>
          <div class="info" @click="goToInfo()">
            <div class="info-1">应届毕业生（预决算方向）</div>
            <div class="info-2 flex-row">
              <div class="info-address">工作地区：上海</div>
              <div class="info-year"> 薪资6k-8k</div>
            </div>
            <div class="info-3 flex-row">
              <div class="info-3-money">工作年限：不限</div>
              <div class="info-3-study">学历要求：本科</div>
            </div>
            <div class="line"></div>
            <div class="info-4 flex-row">
              <div class="info-4-1">6K-8K</div>
              <div class="info-4-2">发布于 2021-05-12</div>
            </div>

          </div>
        </div>


        <div class="detail flex-column" v-if="showInfo">
          <div class="goToList" @click="goToList()">返回列表</div>
          <div class="detail-title">应届毕业生</div>
          <div class="flex-row" style="justify-content: left">
              <div style="width: 200px">工作地区：上海</div>
              <div >薪资：6k-8k</div>
          </div>
          <div  class="flex-row" style="justify-content: left">
            <div style="width: 200px">工作经验：不限</div>
            <div>学历要求：本科</div>
          </div>
          <div class="detail-line"></div>

          <div>职位要求：</div>
          <div  class="info-content">
            1、工程预算专业毕业，大专及以上学历，有预算员、造价员证者优先考虑；<br/>
            2、有工程预算及工程管理经验者优先；<br/>
            3、具备工程师。决算和工程管理的专业知识、熟悉相关行业资料类型；<br/>
            4、熟悉使用常用计价软件，WORD、EXCEL、AUTOCAD等办公软件；<br/>
            5、良好的语言表达能力、沟通能力；<br/>
            6、品格端正，有强烈的团队意识，具备上进心、吃苦耐劳、学习意识强烈、态度端正；<br/>
          </div>
          <div>公司地址： 上海市松江区望东南路111号</div>
          <div>联系人： 鲍先生</div>
          <div>联系电话： 021-67675666</div>
          <div style="margin-bottom: 80px">联系邮箱： gxm@pocc.co</div>
        </div>

        <el-pagination
            v-if="!showInfo"
            class="mb40"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page.sync="currentPage3"
            :page-size="100"
            layout="prev, pager, next, jumper"
            :total="1000">
        </el-pagination>
      </div>


    </div>
  </div>
</template>

<script>
import '../assets/css/recruit.scss'

export default {
  data() {
    return {
      showInfo:false,
      currentPage3:1
    }
  },
  created() {

  },

  mounted: function () {


  },
  methods: {
    goToInfo(){
      this.showInfo = true;
    },
    goToList(){
      this.showInfo = false;
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
    }
  },
  destroyed() {

  },
  components: {
    // introduce,
    // shopthumb,
    // productthumb,
    // "el-card": Card
  }
}


</script>

<style lang="scss">
</style>
