<template>
  <search-white-board @search="handleSearch">
    <div slot="base">
      <el-row>
        <el-col class="toolbar-txt txt-right" :span="2">所属科室</el-col>
        <el-col :span="6">
          <el-select
            v-model="form.dept"
            placeholder="请选择"
            style="width: 100%;"
          >
            <el-option
              v-for="item in deptOptions"
              :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.showStatus"
            placeholder="请选择"
            style="width: 100%;"
          >
            <el-option
              v-for="item in showOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-col>
      </el-row>
    </div>
  </search-white-board>
</template>

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

export default {
  name: 'DoctorToolbar',

  mixins: [mxField()],

  props: {
    deptOptions: {
      type: Array,
      default: () => []
    }
  },

  data() {
    return {
      form: {
        dept: null,
        showStatus: null
      },
      apiForm: {
        dept: 'dept',
        showStatus: 'isShow'
      },
      showOptions: setStatus(['全部状态', '展示中', '未展示'], [null, true, false])
    }
  },

  methods: {
  }
}
</script>

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