<template>
  <search-white-board @search="handleSearch">
    <div slot="base">
      <el-row class="toolbar">
        <el-col class="toolbar-txt txt-right" :span="2">载体</el-col>
        <el-col :span="6">
          <el-select v-model="form.carrier" clearable placeholder="请选择" style="width: 100%;">
            <el-option
              v-for="item in carrierOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-col>

        <el-col class="toolbar-txt txt-right" :span="2">发布状态</el-col>
        <el-col :span="6">
          <el-select v-model="form.releaseStatus" placeholder="请选择" style="width: 100%;">
            <el-option
              v-for="item in releaseOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-col>

        <el-col class="toolbar-txt txt-right" :span="2">精选状态</el-col>
        <el-col :span="6">
          <el-select v-model="form.featureStatus" placeholder="请选择" style="width: 100%;">
            <el-option
              v-for="item in featureOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-col>

        <el-col class="toolbar-txt txt-right" :span="2">每周一课</el-col>
        <el-col :span="6">
          <el-select
            v-model="form.weekStatus"
            clearable
            placeholder="请选择"
            style="width: 100%;"
          >
            <el-option
              v-for="item in weekOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-col>

        <el-col :span="8">
          <el-input v-model="form.input" placeholder="请输入内容名称/医生姓名查找" style="margin-left: 10px;" />
        </el-col>
      </el-row>
    </div>
  </search-white-board>
</template>

<script>
import CARRIERKEY from '@/const/carrierKey'

import mxField from '@/mixins/field'
import { setStatus } from '@/utils'

export default {
  name: 'ArticleToolbar',

  mixins: [mxField()],

  data() {
    return {
      form: {
        carrier: null,
        releaseStatus: null,
        featureStatus: null,
        weekStatus: null,
        input: null
      },
      apiForm: {
        carrier: 'contentType',
        releaseStatus: 'isRelease',
        featureStatus: 'isFeature',
        weekStatus: 'isWeek',
        input: 'searchText'
      },
      carrierOptions: CARRIERKEY.CARRIER,
      releaseOptions: setStatus(['全部状态', '已发布', '未发布'], [null, true, false]),
      featureOptions: setStatus(['全部状态', '设为精选', '未设精选'], [null, true, false]),
      weekOptions: setStatus(['是', '否'], [true, false])
    }
  },

  methods: {
  }
}
</script>

<style scoped>
.toolbar .el-col {
  margin-bottom: 10px;
}
.mb-10 {
  margin-bottom: 10px;
}
.toolbar-txt {
  font-size: 13px;
  padding: 5px;
  line-height: 1.7;
}
.txt-right {
  text-align: right;
}
</style>
