<el-main>
  <!--面包屑-->
  <breadcrumb-component ></breadcrumb-component>

  <!--下面是搜索条件-->
  <el-form label-position="right" class="simple-search-form-outline" inline >
      <el-form-item label="KPI 名称">
        <el-input v-model="searchForm.name" placeholder="请输入"></el-input>
      </el-form-item>

      <el-form-item label="KPI 类型" >
        <el-select v-model="searchForm.type" placeholder="请选择" clearable>
          <el-option
            v-for="item in typeOptions"
            :key="item.id"
            :label="item.name"
            :value="item.id">
          </el-option>
        </el-select>
    </el-form-item>

    <el-form-item label="启用状态" >
      <el-select v-model="searchForm.enableStatus" placeholder="请选择" clearable>
        <el-option
          v-for="item in formatterOptions.enableStatusShow"
          :key="item.id"
          :label="item.name"
          :value="item.id">
        </el-option>
      </el-select>
    </el-form-item>

    <el-form-item label="编辑状态" >
      <el-select v-model="searchForm.editStatus" placeholder="请选择" clearable>
        <el-option
          v-for="item in formatterOptions.editStatusShow"
          :key="item.id"
          :label="item.name"
          :value="item.id">
        </el-option>
      </el-select>
    </el-form-item>

    <el-form-item label="所属主题">
      <multiple-select-tree  :treeData='treeData'  :selectedId.sync="searchForm.topicCodes" :defaultExpandAll="true" ></multiple-select-tree>
    </el-form-item>

    <el-form-item>
      <el-button type="primary" @click="getList">查询</el-button>
    </el-form-item>

  </el-form>


  <!--主列表数据-->
  <div class="table-container">
    <div class="button-container">
      <div>
        <el-button type="primary" @click="go('KPIAdd')">新建KPI</el-button>
        <el-button type="primary" @click="go('KPIBatch')">批量新建KPI</el-button>
      </div>
    </div>
    <table-component @search="search" :tableOption="tableOption" :tableData="tableData" :pageParam="pageParam" @action="action" @selectChange="selectChange" :formatterOptions="formatterOptions"></table-component>
  </div>

</el-main>
