<template>
  <div class="from-body">
    <el-form :inline="true" :model="formInline" label-width="80" class="demo-form-inline">
      <el-row :gutter="20">
        <el-col :span="12">
          <div class="grid-content bg-purple">
            <el-form-item>
              <el-input  v-model="formInline.user" placeholder="输入检索服务项"></el-input>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="12">
          <div class="grid-content bg-purple">
            <el-form-item>
            <el-input  v-model="formInline.user" placeholder="输入检索颜色"></el-input>
            </el-form-item>
          </div>
        </el-col>
      </el-row>

      <el-row :gutter="20">
        <el-col :span="12">
          <div class="grid-content bg-purple">
            <el-form-item>
              <el-input  v-model="formInline.user" placeholder="输入检索品牌"></el-input>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="12">
          <div class="grid-content bg-purple">
            <el-form-item>
            <el-select  v-model="formInline.region" placeholder="分类">
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
            </el-form-item>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="12">
          <div class="grid-content bg-purple">
            <el-form-item>
              <el-select  v-model="formInline.region" placeholder="部位">
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="12">
          <div class="grid-content bg-purple">
            <el-form-item>
            <el-select  v-model="formInline.region" placeholder="材质">
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
            </el-form-item>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="12">
          <div class="grid-content bg-purple">
            <el-form-item>
              <el-select  v-model="formInline.region" placeholder="症状">
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="12">
          <div class="grid-content bg-purple">
            <el-form-item>
            <el-input  v-model="formInline.user" placeholder="订单号"></el-input>
            </el-form-item>
          </div>
        </el-col>
      </el-row>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">搜索</el-button>
      </el-form-item>
    </el-form>
  </div>  
</template>

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

<style lang="stylus" scoped>
.from-body
  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;
    }
  }
</style>