<template>
  <div>
    <save-form inline :model="search" @submit="submit" @reset="reset">
      <el-form-item prop="organIds">
        <el-select
          multiple
          clearable
          filterable
          collapse-tags
          v-model="search.organIds"
          placeholder="请选择分部"
        >
          <el-option v-for="(item,index) in selects.branchs"
            :key="index"
            :label="item.name"
            :value="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item prop="organIds">
        <el-select
          v-model.trim="search.teacherIdList"
          clearable
          filterable
          placeholder="请选择老师"
        >
          <el-option v-for="(item, index) in selects.teachers"
            :key="index"
            :value="item.id"
            :label="item.realName"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item prop="month">
        <el-date-picker
          v-model="search.month"
          type="month"
          placeholder="请选择月份">
        </el-date-picker>
      </el-form-item>
      <el-button native-type="submit" type="primary">搜索</el-button>
      <el-button native-type="reset" type="danger">重置</el-button>
    </save-form>
    <el-button type="primary" @click="visible = true">添加任务</el-button>
    <el-table
      :data="list"
      style="width: 100%;margin-top: 20px;"
      :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
    >
      <el-table-column
        label="分部"
        prop="分部"
      ></el-table-column>
      <el-table-column
        label="工作周期"
        prop="工作周期"
      ></el-table-column>
      <el-table-column
        label="乐团主管"
        prop="乐团主管"
      ></el-table-column>
      <el-table-column
        label="任务事项数量"
        prop="任务事项数量"
      ></el-table-column>
      <el-table-column
        label="任务总次数"
        prop="任务总次数"
      ></el-table-column>
      <el-table-column
        label="操作"
        prop="操作"
      >
        <template slot-scope="scope">
          <el-button type="text">查看</el-button>
          <el-button type="text">修改任务</el-button>
          <el-button type="text">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-dialog
      :visible.sync="visible"
      title="创建任务"
      width="800px"
    >
      <create/>
    </el-dialog>
  </div>
</template>
<script>
import create from './modals/create'
const initSearch = {
  organIds: [],
  month: '',
}
export default {
  components: {
    create
  },
  data() {
    return {
      search: {...initSearch},
      list: [],
      visible: false,
    }
  },
  mounted() {
    this.FetchList()
    this.$store.dispatch('setBranchs')
    this.$store.dispatch('setTeachers')
  },
  methods: {
    submit() {
      this.FetchList()
    },
    reset() {
      this.search = {...initSearch}
      this.FetchList()
    },
    async FetchList() {
      try {

      } catch (error) {}
    }
  }
}
</script>
