<template>
  <div class="sonnel">
     <div class="sonnerHeader">
       <p class="xiangq ">报表详情</p>
       <div class="sonnelNave">
         <div class="sonnelacr">
           <p>报表名称：</p>
           <p>潜山市教育局 人员信息列表</p>
         </div>
         <div class="sonnelacr">
           <p>报表模板：</p>
           <p class="aet">
             <a href="#">下载模板</a>
             <span>
                <img src="../../../assets/images/icon_xq_wj.png" alt="" class="index_navTimeimg" />
                <i>潜山市教育局 人员信息报表.xls</i>
             </span>
           </p>
         </div>
         <div class="sonnelacr">
           <p>开始时间：</p>
           <p>2021-08-17</p>
         </div>
         <div class="sonnelacr">
           <p>截止时间：</p>
           <p>2021-08-23</p>
         </div>
         <div class="sonnelacr">
           <p>注意事项：</p>
           <p>请各单位认真如实填写人员信息，务必在截止日期前提交！</p>
         </div>
         <div class="sonnelacr">
           <p>参与人员：</p>
           <p>潜山市源潭中心小学：沈明熙、刘晓旭、王思、李敏、韩晓辉、李启民、沈明熙、刘晓旭、王思、李敏、韩晓辉、李启民、沈明熙； 潜山市梅</p>
         </div>
         <div class="sonnelacr">
           <p>已填报单位：</p>
           <p class="djiwui">
             <span class="jeiut">
               <span>潜山市源潭中心小学 沈明熙</span>
               <img src="../../../assets/images/icon_xq_wj.png" alt="" class="index_navTimeimg" />
               <i>潜山市教育局 人员信息报表.xls</i>
               <img src="../../../assets/images/icon_xq_xz.png" alt="" class="index_navTimeimgrt" />
             </span>
             <span class="jeiut">
               <span>潜山市源潭中心小学 沈明熙</span>
               <img src="../../../assets/images/icon_xq_wj.png" alt="" class="index_navTimeimg" />
               <i>潜山市教育局 人员信息报表.xls</i>
               <img src="../../../assets/images/icon_xq_xz.png" alt="" class="index_navTimeimgrt" />
               </span>

             </p>
         </div>
         <div class="sonnelacr">
           <p>未填报单位：</p>
           <p>潜山市源潭中心小学：沈明熙、刘晓旭、王思、李敏、韩晓辉、李启民、沈明熙、刘晓旭、王思、李敏、韩晓辉、李启民、沈明熙； 潜山市梅</p>
         </div>
       </div>
       <div style="text-align: center;">
         <el-button type="success"  size="medium" @click="handleQuery">查看汇总信息</el-button>
       </div>
     </div>
  </div>
</template>

<script>

</script>

<style lang="scss" scoped>
  .sonnel{
    background-color:#eaeefa;
    padding: 16px;
  }
  .sonnerHeader{
    padding: 30px;
    background-color: #fff;
    border-radius: 6px;
    .sonnelacr{
      display: flex;
      margin-bottom: 25px;
      p:nth-child(1){
        font-size: 16px;
        font-family: PingFang SC;
        font-weight: bold;
        color: #343434;
        width: 10%;
        text-align: right;
      }
      p:nth-child(2){
        flex: 1;
        font-size: 16px;
        font-family: PingFang SC;
        font-weight: 400;
        color: #343434;

      }
      .aet{
        display: flex;
        align-items: center;
        a{
          width: 100px;
          height: 40px;
          background: #1890FF;
          border-radius: 10px;
          font-size: 16px;
          font-family: PingFang SC;
          font-weight: 400;
          color: #FFFFFF;
          text-align: center;
          line-height: 40px;
        }
        i{
          font-size: 13px;
          font-family: PingFang SC;
          font-weight: 400;
          color: #343434;
          font-style:normal;
        }
      }
      .djiwui{
         display: flex;
         flex-direction: column;
         line-height: 25px;
         .jeiut{
           display: flex;
           align-items: center;
         }
        i{
          font-size: 13px;
          font-family: PingFang SC;
          font-weight: 400;
          color: #343434;
          font-style:normal;
        }
      }
    }
  }
  .xiangq{
    border-left: 4px solid #1890FF;
    padding-left: 6px;
    font-size: 19px;
    font-family: PingFang SC;
    font-weight: bold;
    color: #343434;
    margin-bottom: 38px;
  }
  .index_navTimeimg{
    width: 14px;
    height: 16px;
    margin: 0 11px;
  }
  .index_navTimeimgrt{
    width: 12px;
    height: 14px;
    margin: 0 17px;
  }
</style>
