dy-admin-manager/src/views/indexErrDataRecord/components/historyError.vue

<template>
  <div>
    <save-form
      :inline="true"
      :model="searchForm"
      ref="searchForm"
      @submit="search"
      @reset="onReSet"
      saveKey="indexErrDataRecord-historyError"
    >
      <el-form-item prop="organIds">
        <el-select
          class="multiple"
          v-model.trim="searchForm.organIds"
          filterable
          clearable
          placeholder="请选择分部"
          @change="changeBranch"
        >
          <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>
        <el-select
          class="multiple"
          v-model.trim="searchForm.educationUserId"
          filterable
          clearable
          placeholder="请选择乐团主管"
        >
          <el-option
            v-for="(item, index) in educationList"
            :key="index"
            :label="item.userName"
            :value="item.userId"
          >
            <span style="float: left">{{ item.userName }}</span>
            <span style="float: right; color: #8492a6; font-size: 13px">{{
              item.userId
            }}</span>
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item prop="timer">
        <el-date-picker
          v-model.trim="searchForm.timer"
          type="daterange"
          value-format="yyyy-MM-dd"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :picker-options="{
            firstDayOfWeek: 1,
          }"
        ></el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button native-type="submit" type="primary">搜索</el-button>
        <el-button native-type="reset" type="danger">重置</el-button>
        <el-button
          type="primary"
          v-if="permission('export/exportIndexHistoryErrData')"
          @click="exportIndexErr"
          >导出</el-button
        >
      </el-form-item>
    </save-form>

    <statistic :col="5" class="statistic" :cols="0">
      <statistic-item>
        <span>乐团巡查事项异常剩余/总数</span>
        <span>
          {{
            statInfo.musicPatrolItemSurplus
              ? statInfo.musicPatrolItemSurplus
              : "0"
          }}
          /
          {{ statInfo.musicPatrolItem ? statInfo.musicPatrolItem : "0" }}</span
        >
      </statistic-item>
      <statistic-item>
        <span>乐团巡查任务未提交剩余/总数</span>
        <span>
          {{
            statInfo.inspectionItemPlanSurplus
              ? statInfo.inspectionItemPlanSurplus
              : "0"
          }}
          /
          {{
            statInfo.inspectionItemPlan ? statInfo.inspectionItemPlan : "0"
          }}</span
        >
      </statistic-item>
      <statistic-item>
        <span>课程考情异常剩余/总数</span>
        <span>
          {{
            statInfo.teacherExceptionAttendanceSurplus
              ? statInfo.teacherExceptionAttendanceSurplus
              : "0"
          }}
          /
          {{
            statInfo.teacherExceptionAttendance
              ? statInfo.teacherExceptionAttendance
              : "0"
          }}
        </span>
      </statistic-item>
      <statistic-item>
        <span>课程异常剩余/总数</span>
        <span>
          {{
            statInfo.teacherNotAClassSurplus
              ? statInfo.teacherNotAClassSurplus
              : "0"
          }}
          /
          {{
            statInfo.teacherNotAClass ? statInfo.teacherNotAClass : "0"
          }}</span
        >
      </statistic-item>
    </statistic>
    <el-table
      style="width: 100%"
      :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
      :data="tableList"
    >
      <el-table-column align="center" prop="month" label="日期">
        <template slot-scope="scope">
          <div>
            {{ scope.row.generateTime }}
          </div>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="organName" label="分部">
        <template slot-scope="scope">
          <div>
            <copy-text>{{ scope.row.organName }}</copy-text>
          </div>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="organName" label="乐团主管">
        <template slot-scope="scope">
          <div>
            {{ scope.row.dealUserName }}
          </div>
        </template>
      </el-table-column>
      <!--  -->

      <el-table-column
        align="center"
        prop="userName"
        label="乐团巡查事项异常剩余/总数"
      >
        <template slot-scope="scope">
          <div>
            {{
              scope.row.musicPatrolItemSurplus
                ? scope.row.musicPatrolItemSurplus
                : "0"
            }}
            / {{ scope.row.musicPatrolItem ? scope.row.musicPatrolItem : "0" }}
          </div>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        prop="item"
        label="乐团巡查任务未提交剩余/总数"
      >
        <template slot-scope="scope">
          <div>
            {{
              scope.row.inspectionItemPlanSurplus
                ? scope.row.inspectionItemPlanSurplus
                : "0"
            }}
            /
            {{
              scope.row.inspectionItemPlan ? scope.row.inspectionItemPlan : "0"
            }}
          </div>
        </template>
      </el-table-column>
      <!-- <el-table-column
        align="center"
        prop="times"
        label="回访任务未完成剩余/总数"
      >
        <template slot-scope="scope">
          <div>
            {{
              scope.row.studentVisitSurplus
                ? scope.row.studentVisitSurplus
                : "0"
            }}
            / {{ scope.row.studentVisit ? scope.row.studentVisit : "0" }}
          </div>
        </template>
      </el-table-column> -->

      <el-table-column
        align="center"
        prop="plannedTimes"
        label="课程考勤异常剩余/总数"
      >
        <template slot-scope="scope">
          <div>
            {{
              scope.row.teacherExceptionAttendanceSurplus
                ? scope.row.teacherExceptionAttendanceSurplus
                : "0"
            }}
            /
            {{
              scope.row.teacherExceptionAttendance
                ? scope.row.teacherExceptionAttendance
                : "0"
            }}
          </div>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        prop="submittedTimes"
        label="课程异常剩余/总数"
      >
        <template slot-scope="scope">
          <div>
            {{
              scope.row.teacherNotAClassSurplus
                ? scope.row.teacherNotAClassSurplus
                : "0"
            }}
            /
            {{ scope.row.teacherNotAClass ? scope.row.teacherNotAClass : "0" }}
          </div>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      sync
      :total.sync="rules.total"
      saveKey="indexErrDataRecord-historyError"
      :page.sync="rules.page"
      :limit.sync="rules.limit"
      :page-sizes="rules.page_size"
      @pagination="getList"
    />
  </div>
</template>
<script>
// import { getInspectionItem, resetInspectionItem } from "../api";
import countTo from "vue-count-to";
import { permission } from "@/utils/directivePage";
import pagination from "@/components/Pagination/index";
import {
  getIndexErrData,
  getErrDataSummarizing,
  getAllEducationUsers,
} from "../api";
import dayjs from "dayjs";
import { getTimes } from "@/utils";
import { Export } from "@/utils/downLoadFile";
import qs from "qs";
export default {
  props: ["searchType"],
  components: { pagination, "count-to": countTo },
  data() {
    return {
      searchForm: {
        organIds: "",
        timer: [],
        educationUserId: "",
      },
      tableList: [],
      handleVisible: false,
      rules: {
        // 分页规则
        limit: 10, // 限制显示条数
        page: 1, // 当前页
        total: 0, // 总条数
        page_size: [10, 20, 40, 50], // 选择限制显示条数
      },
      statInfo: {
        inspectionItemPlan: 0,
        inspectionItemPlanSurplus: 0,
        musicPatrolItem: 0,
        musicPatrolItemSurplus: 0,
        teacherExceptionAttendance: 0,
        teacherExceptionAttendanceSurplus: 0,
        teacherNotAClass: 0,
        teacherNotAClassSurplus: 0,
        studentVisit: 0,
        studentVisitSurplus: 0,
      },
      educationList: [],
    };
  },
  async mounted() {
    this.$store.dispatch("setBranchs");
    try {
      const res = await getAllEducationUsers();
      this.educationList = res.data;
    } catch (e) {}

    this.getList();
  },
  methods: {
    permission(str) {
      return permission(str);
    },
    onReSet() {
      this.$refs.searchForm.resetFields();
      this.search();
    },
    search() {
      this.rules.page = 1;
      this.getList();
    },
    async changeBranch(val) {
      this.searchForm.educationUserId = null;
      try {
        const res = await getAllEducationUsers({ organIds: val });
        this.educationList = res.data;
      } catch (e) {}
    },
    async getList() {
      let { timer, ...rest } = this.searchForm;
      let params = {
        ...rest,
        page: this.rules.page,
        rows: this.rules.limit,
        ...getTimes(timer, ["startDate", "endDate"]),
        searchType: this.searchType,
      };
      try {
        const res = await getIndexErrData(params);
        // console.log(erDate);
        this.tableList = res.data.rows;
        this.rules.total = res.data.total;
      } catch (e) {
        console.log(e);
      }
      try {
        const erDate = await getErrDataSummarizing(params);
        this.statInfo = { ...erDate.data };
      } catch (e) {
        console.log(e);
      }
    },
    resetLine(row) {
      let { id, memo } = row;
      this.handleForm = { id, memo };
      this.handleVisible = true;
    },
    // async submitHandle() {
    //   try {
    //     const res = await resetInspectionItem(this.handleForm);
    //     this.$message.success("提交成功");
    //     this.getList();
    //     this.handleVisible = false;
    //   } catch (e) {
    //     console.log(e);
    //   }
    // },
    gotoHander(row) {
      let startTime = dayjs(row.month).startOf("month").format("YYYY-MM-DD");
      let endTime = dayjs(row.month).endOf("month").format("YYYY-MM-DD");
      if (row.item == "VISIT") {
        // 学员回访
        // 跳到回访页面 搜索条件 教务老师 时间范围
        this.$router.push({
          path: "/studentManager/returnVisitList",
          query: { teacher: row.userName, timer: [startTime, endTime] },
        });
      } else {
        // 下校巡查
        this.$router.push({
          path: "/main/scheduleDetail",
          query: {
            teacher: row.userId,
            startTime,
            endTime,
            name: row.userName,
            organId: row.organId,
            itemId: row.id,
            times: row.times,
          },
        });
      }
    },
    exportIndexErr() {
      Export(
        this,
        {
          url: "/api-web/export/exportIndexHistoryErrData",
          fileName: "首页历史异常统计.xls",
          method: "post",
          params: qs.stringify({ ...this.searchForm }),
        },
        "您确定导出首页历史异常统计?"
      );
    },
  },
};
</script>
<style lang="scss" scoped>
</style>