<template>
  <div class="tabs-body">
    <search-from></search-from>
    <div style="margin-top: 10px">
    <el-row :gutter="20">
        <el-col :span="12">
          <div class="grid-content bg-purple">
            <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1557837447103&di=5da71b5a1a7f501f25969ff8348f5649&imgtype=0&src=http%3A%2F%2Fc.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2F377adab44aed2e7371d6b8698c01a18b87d6fabc.jpg" alt="">
            <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1557837447103&di=5da71b5a1a7f501f25969ff8348f5649&imgtype=0&src=http%3A%2F%2Fc.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2F377adab44aed2e7371d6b8698c01a18b87d6fabc.jpg" alt="">
          </div>
        </el-col>
        <el-col :span="12">
          <div class="grid-content bg-purple">
            <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1557837447103&di=5da71b5a1a7f501f25969ff8348f5649&imgtype=0&src=http%3A%2F%2Fc.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2F377adab44aed2e7371d6b8698c01a18b87d6fabc.jpg" alt="">
            <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1557837447103&di=5da71b5a1a7f501f25969ff8348f5649&imgtype=0&src=http%3A%2F%2Fc.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2F377adab44aed2e7371d6b8698c01a18b87d6fabc.jpg" alt="">
          </div>
        </el-col>
      </el-row>
      </div>
      <div style="margin-top: 10px">
      <el-row :gutter="20">
          <el-col :span="12">
            <div class="grid-content bg-purple">
              <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1557837447103&di=5da71b5a1a7f501f25969ff8348f5649&imgtype=0&src=http%3A%2F%2Fc.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2F377adab44aed2e7371d6b8698c01a18b87d6fabc.jpg" alt="">
              <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1557837447103&di=5da71b5a1a7f501f25969ff8348f5649&imgtype=0&src=http%3A%2F%2Fc.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2F377adab44aed2e7371d6b8698c01a18b87d6fabc.jpg" alt="">
            </div>
          </el-col>
          <el-col :span="12">
            <div class="grid-content bg-purple">
              <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1557837447103&di=5da71b5a1a7f501f25969ff8348f5649&imgtype=0&src=http%3A%2F%2Fc.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2F377adab44aed2e7371d6b8698c01a18b87d6fabc.jpg" alt="">
              <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1557837447103&di=5da71b5a1a7f501f25969ff8348f5649&imgtype=0&src=http%3A%2F%2Fc.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2F377adab44aed2e7371d6b8698c01a18b87d6fabc.jpg" alt="">
            </div>
          </el-col>
        </el-row>
      </div>
  </div>  
</template>

<script>
import searchFrom from './search-from'
export default{
    data(){
      return {
        activeName:'second',
        formInline:{},
        baseInfo:[
          {
            label:'微信昵称',
            value:'李元霸'
          },
          {
            label:'微信号',
            value:'李元霸'
          },
          {
            label:'微信备注',
            value:'李元霸'
          },
          {
            label:'来源',
            value:'李元霸'
          }
        ]
      }    
    },
    components: {
      searchFrom
    },
    methods: {
      handleClick(){
        console.log(43434)
      }
    }
}
</script>

<style lang="stylus" scoped>
.tabs-body
  height:800px;
  width:100%;
  .tool-body
    width:100%;
    height:729px;
  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }
  .clearfix:after {
    clear: both
  }
  .clearfix{
    span{
      font-weight: 800;
    }
  }
  .box-card {
    width: 100%;
  }
  .box-body{
    padding-left:10px;
    div{
      font-size:15px;
      margin-bottom:10px;
    }
  }
 .grid-content{
  img{
    width:100%;
  }
 } 
</style>