<template>
  <!-- <h2>
      <div class="squrt"></div>评论列表
    </h2> -->
  <div>
    <save-form
      :inline="true"
      class="searchForm"
      :model="searchForm"
      save-key="commentManager-evaluateList"
      @submit="search"
      @reset="onReSet"
    >
      <!-- 状态 指导老师 活动方案-->
      <el-form-item>
        <el-input
          v-model.trim="searchForm.search"
          clearable
          placeholder="请输入课程组名称 ID"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <el-select
          placeholder="请选择分部"
          v-model="searchForm.organId"
          clearable
        >
          <el-option
            v-for="(item, index) in selects.branchs"
            :label="item.name"
            :value="item.id"
            :key="index"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-select
          placeholder="请选择状态"
          v-model="searchForm.isOver"
          clearable
        >
          <el-option label="已完成" value="1"></el-option>
          <el-option label="进行中" value="0"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <remote-search
          :commit="'setTeachers'"
          aria-placeholder="请选择指导老师"
          v-model="searchForm.teacherId"
          :isForzenWithQueryCondition="true"
        />
      </el-form-item>
      <el-form-item>
        <el-select
          placeholder="是否完成评价"
          v-model="searchForm.hasReport"
          clearable
        >
          <el-option label="是" value="1"></el-option>
          <el-option label="否" value="0"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-date-picker
          :clearable="false"
          v-model="searchForm.month"
          type="month"
          value-format="yyyy-MM"
          placeholder="选择年月"
        ></el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button native-type="submit" type="danger">搜索</el-button>
        <el-button native-type="reset" type="primary">重置</el-button>
      </el-form-item>
    </save-form>
    <div class="tableWrap">
      <el-table
        style="width: 100%"
        :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
        :data="tableData"
      >
        <el-table-column align="center" prop="id" label="课程组编号">
          <template slot-scope="scope">
            <copy-text>
              {{ scope.row.id }}
            </copy-text>
          </template>
        </el-table-column>
        <el-table-column align="center" prop="name" label="课程组名称">
          <template slot-scope="scope">
            <copy-text>
              {{ scope.row.name }}
            </copy-text>
          </template>
        </el-table-column>
        <el-table-column align="center" prop="organName" label="分部名称">
          <template slot-scope="scope">
            <copy-text>
              {{ scope.row.organName }}
            </copy-text>
          </template>
        </el-table-column>
        <!-- <el-table-column align="center" prop="id" label="类型"></el-table-column> -->
        <el-table-column align="center" prop="id" label="收费类型">
          <template slot-scope="scope">
            <div>{{ scope.row.buyMonths > 0 ? "付费" : "免费" }}</div>
          </template>
        </el-table-column>
        <el-table-column align="center" label="状态">
          <template slot-scope="scope">
            <div>{{ scope.row.coursesExpireDate | coursesStatus }}</div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="teacherName"
          label="指导老师"
        ></el-table-column>
        <el-table-column align="center" label="课次">
          <template slot-scope="scope">
            <div>
              {{
                scope.row.currentClassTimes + "/" + scope.row.totalClassTimes
              }}
            </div>
          </template>
        </el-table-column>
        <el-table-column align="center" prop="id" label="是否评价">
          <template slot-scope="scope">
            <div>{{ scope.row.evaluateStatus ? "是" : "否" }}</div>
          </template>
        </el-table-column>
        <el-table-column align="center" label="操作">
          <template slot-scope="scope">
            <div>
              <auth auths='evaluateList/look'>
                <el-button
                  type="text"
                  v-show="scope.row.evaluateStatus"
                  @click="gotoEvakuateDetail(scope.row)"
                  >查看</el-button
                >
              </auth>
            </div>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        save-key="commentManager-evaluateList"
        sync
        :total.sync="rules.total"
        :page.sync="rules.page"
        :limit.sync="rules.limit"
        :page-sizes="rules.page_size"
        @pagination="getList"
      />
    </div>
  </div>
</template>
<script>
import pagination from "@/components/Pagination/index";
import { getReviews, getTeacher, getEmployeeOrgan } from "@/api/buildTeam";
export default {
  components: { pagination },
  data() {
    return {
      searchForm: {
        organId: null,
        isOver: "",
        teacherId: null,
        hasReport: "",
        month: null,
        search: null,
      },
      rules: {
        // 分页规则
        limit: 10, // 限制显示条数
        page: 1, // 当前页
        total: 0, // 总条数
        page_size: [10, 20, 40, 50], // 选择限制显示条数
      },
      tableData: [],
      teacherList: [],
      subjectList: [],
      organList: [],
    };
  },
  created() {

  },
  mounted() {
      this.init();
    this.$store.dispatch("setBranchs");
  },
  methods: {
    init() {
      if (!this.searchForm.month) {
        var now = new Date();
        this.searchForm.month = new Date(
          Date.UTC(now.getFullYear(), now.getMonth(), now.getDate())
        )
          .toISOString()
          .slice(0, 7);
      }

      // 获取指导老师
      // getTeacher({}).then(res => {
      //   if (res.code == 200) {
      //     this.teacherList = res.data;
      //   }
      // });
      // 获取分部

      getEmployeeOrgan().then((res) => {
        if (res.code == 200) {
          this.organList = res.data;
        }
      });
      this.getList();
      // getReviews()
    },
    getList() {
      // 数据效验
      // let obj = {};
      // obj.hasReport = this.searchForm.hasReport || null;
      // obj.isOver = this.searchForm.isOver || null;
      // obj.month = this.searchForm.month || null;
      // obj.organId = this.searchForm.organId || null;
      // obj.page = this.rules.page;
      // obj.rows = this.rules.limit;
      // obj.search = this.searchForm.search || null;
      // obj.teacherId = this.searchForm.teacherId || null
      getReviews({...this.searchForm}).then((res) => {
        if (res.code == 200) {
          this.tableData = res.data.rows;
          this.rules.total = res.data.total;
        }
      });
    },
    search() {
      this.rules.page = 1;
      this.getList();
    },
    onReSet() {
      this.searchForm = {
        organId: null,
        isOver: "",
        teacherId: null,
        hasReport: "",
        month: null,
        search: null,
      };
      var now = new Date();
      this.searchForm.month = new Date(
        Date.UTC(now.getFullYear(), now.getMonth(), now.getDate())
      )
        .toISOString()
        .slice(0, 7);
      this.search();
    },
    gotoEvakuateDetail(row) {
      let id = row.id;
      let evaluateId = row.evaluateId;
      let search = JSON.stringify(this.searchForm);
      let rules = JSON.stringify(this.rules);
      this.$router.push({
        path: "/business/evaluateDetail",
        query: { id, evaluateId, search, rules },
      });
    },
  },
  filters: {
    coursesStatus(val) {
      return new Date().getTime() - new Date(val) > 0 ? "已完成" : "进行中";
    },
  },
};
</script>
