spring
2025-02-27 66b3c4c129b05b634d37ac7eac63eff0f0b9f426
src/views/performance/class/index.vue
@@ -4,217 +4,118 @@
      <div class="search_thing">
        <div class="search_label">选择时间:</div>
        <div class="search_input">
          <el-date-picker
            v-model="query.year"
            type="year"
            size="small"
            format="yyyy"
            placeholder="选择年"
            @change="refreshTable()"
            style="width: 140px"
            :clearable="false"
          >
          <el-date-picker v-model="query.year" type="year" size="small" format="yyyy" placeholder="选择年"
            @change="refreshTable()" style="width: 140px" :clearable="false">
          </el-date-picker>
          <el-select
            v-model="query.month"
            clearable
            placeholder="选择月"
            style="width: 140px; margin-left: 16px"
            size="small"
            @change="refreshTable()"
          >
            <el-option
              v-for="item in monthOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
          <el-select v-model="query.month" clearable placeholder="选择月" style="width: 140px; margin-left: 16px"
            size="small" @change="refreshTable()">
            <el-option v-for="item in monthOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          <el-input
            v-model="query.userName"
            placeholder="请输入人员名称"
            size="small"
            style="width: 140px; margin: 0 16px"
            clearable
            @keyup.enter.native="refreshTable()"
          ></el-input>
          <el-select
            v-model="query.laboratory"
            placeholder="请选择实验室"
            style="width: 140px"
            size="small"
            clearable
            @change="refreshTable()"
          >
            <el-option
              v-for="item in laboratory"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
          <el-input v-model="query.userName" placeholder="请输入人员名称" size="small" style="width: 140px; margin: 0 16px"
            clearable @keyup.enter.native="refreshTable()"></el-input>
          <el-select v-model="query.laboratory" placeholder="请选择实验室" style="width: 140px" size="small" clearable
            @change="refreshTable()">
            <el-option v-for="item in laboratory" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </div>
      </div>
      <div class="search_thing" style="padding-left: 30px">
        <el-button size="small" @click="refresh()">重 置</el-button>
        <el-button size="small" type="primary" @click="refreshTable()"
          >查 询</el-button
        >
        <el-button size="small" type="primary" @click="refreshTable()">查 询</el-button>
      </div>
      <div class="search_thing btns" style="padding-left: 30px">
        <el-button
          size="small"
          type="primary"
          v-if="listPower"
          @click="configTime"
          :loading="downLoading"
          >时间配置</el-button
        >
        <el-button
          size="small"
          type="primary"
          v-if="downPower"
          @click="handleDown"
          :loading="downLoading"
          >导 出</el-button
        >
        <el-button
          size="small"
          type="primary"
          @click="schedulingVisible = true"
          v-if="addPower"
          >排 班</el-button
        >
        <el-button size="small" type="primary" v-if="checkPermi(['performance:class:time'])"
          @click="configTime">时间配置</el-button>
        <el-button size="small" type="primary" v-if="checkPermi(['performance:class:down'])" @click="handleDown"
          :loading="downLoading">导 出</el-button>
        <el-button size="small" type="primary" @click="schedulingVisible = true"
          v-if="checkPermi(['performance:class:add'])">排 班</el-button>
      </div>
    </div>
    <div class="center" v-loading="pageLoading">
      <div class="clearfix" style="width: 100%" v-show="query.month">
        <div class="fixed-left">
          <div
            class="content-title"
            style="padding-left: 16px; box-sizing: border-box"
          >
          <div class="content-title" style="padding-left: 16px; box-sizing: border-box">
            人员名称
          </div>
          <div
            class="content-user"
            :class="{ hoverType: currentUserIndex == index }"
            v-for="(item, index) in list"
            :key="'e' + index"
            v-on:mouseenter="onMouseEnter(index)"
            v-on:mouseleave="currentUserIndex = null"
          >
            <div class="user-pic">{{ item.name.charAt(0) }}</div>
          <div class="content-user" :class="{ hoverType: currentUserIndex == index }" v-for="(item, index) in list"
            :key="'e' + index" v-on:mouseenter="onMouseEnter(index)" v-on:mouseleave="currentUserIndex = null">
            <div class="user-pic">
              {{ item.name ? item.name.charAt(0) : "" }}
            </div>
            <div class="user-info">
              <p style="font-size: 14px; color: #3a7bfa; line-height: 24px">
              <p style="
                  font-size: 14px;
                  color: #3a7bfa;
                  line-height: 24px;
                  margin: 0;
                ">
                {{ item.name }}
              </p>
              <p
                style="
              <p style="
                  color: #999999;
                  font-size: 12px;
                  transform: scale(0.8) translateX(-20px);
                  white-space: nowrap;
                  width: 150px;
                  overflow-x: show;
                "
              >
                  margin: 0;
                ">
                早:{{ item.day0 }},中:{{ item.day1 }},夜:{{ item.day2 }},休:{{
                  item.day3
                }},假:{{ item.day4 }},差:{{ item.day6 }}
              </p>
              <p style="margin-top: 4px">
                <span
                  style="
              <p style="margin-top: 4px; margin: 0">
                <span style="
                    color: #999999;
                    font-size: 12px;
                    display: inline-block;
                    transform: scale(0.8) translateX(-10px);
                  "
                  >合计出勤: </span
                ><span style="font-size: 16px; color: #ff4902"
                  >{{
                  ">合计出勤: </span><span style="font-size: 16px; color: #ff4902">{{
                    query.month
                      ? item.monthlyAttendance.totalAttendance
                      : item.sidebarAnnualAttendance.totalAttendance
                  }}天</span
                >
                  }}天</span>
              </p>
            </div>
          </div>
        </div>
        <div class="scroll-right">
          <div class="content">
            <div
              class="content-title content-title-right"
              style="border-bottom: 0"
            >
              <div
                class="content-title-item"
                v-for="(item, index) in weeks"
                :key="'b' + index"
              >
                <span
                  class="month"
                  style="position: absolute; top: 4px"
                  v-if="item.week == '周日'"
                  >{{ item.weekNum }}周</span
                >
            <div class="content-title content-title-right" style="border-bottom: 0">
              <div class="content-title-item" v-for="(item, index) in weeks" :key="'b' + index">
                <span class="month" style="position: absolute; top: 0px" v-if="item.week == '周日'">{{ item.weekNum
                  }}周</span>
                <p style="height: 26px; position: absolute; bottom: 12px">
                  <span class="day">{{ item.day }}</span>
                  <span class="week">{{ item.week.charAt(1) }}</span>
                </p>
              </div>
            </div>
            <div
              class="content-body"
              v-for="(item, index) in list"
              :key="'c' + index"
              v-on:mouseenter="onMouseEnter(index)"
              v-on:mouseleave="currentUserIndex = null"
            >
              <div
                class="content-body-item"
                v-for="(m, i) in item.list"
                :key="'d' + i"
                :class="{ hoverType: currentUserIndex == index }"
              >
                <el-dropdown
                  trigger="click"
                  placement="bottom"
                  @command="(e) => handleCommand(e, m)"
                  :disabled="!upPower"
                  style="width: 100%; height: 100%; cursor: pointer"
                >
                  <div
                    class="work-box"
                    :class="{
                      type0: m.shift === '0',
                      type1: m.shift === '1',
                      type2: m.shift === '2',
                      type3: m.shift === '3',
                      type4: m.shift === '4',
                      type5: m.shift === '5',
                      type6: m.shift === '6',
                    }"
                  >
                    <span
                      style="cursor: pointer"
                      :style="`opacity: ${
                        getShiftByDic(m.shift) == '无' ? 0 : 1
                      };`"
                      >{{ getShiftByDic(m.shift) }}</span
                    >
            <div class="content-body" v-for="(item, index) in list" :key="'c' + index"
              v-on:mouseenter="onMouseEnter(index)" v-on:mouseleave="currentUserIndex = null">
              <div class="content-body-item" v-for="(m, i) in item.list" :key="'d' + i"
                :class="{ hoverType: currentUserIndex == index }">
                <el-dropdown trigger="click" placement="bottom" @command="(e) => handleCommand(e, m)"
                  :disabled="!checkPermi(['performance:class:edit'])"
                  style="width: 100%; height: 100%; cursor: pointer">
                  <div class="work-box" :class="{
                    type0: m.shift === '0',
                    type1: m.shift === '1',
                    type2: m.shift === '2',
                    type3: m.shift === '3',
                    type4: m.shift === '4',
                    type5: m.shift === '5',
                    type6: m.shift === '6',
                  }">
                    <span style="cursor: pointer" :style="`opacity: ${getShiftByDic(m.shift) == '无' ? 0 : 1
                      };`">{{ getShiftByDic(m.shift) }}</span>
                  </div>
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item
                      v-for="(n, j) in classType"
                      :key="'h' + j"
                      :command="n.value"
                      >{{ n.label }}</el-dropdown-item
                    >
                    <el-dropdown-item v-for="(n, j) in classType" :key="'h' + j" :command="n.dictValue">{{ n.dictLabel
                      }}</el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
              </div>
@@ -222,57 +123,45 @@
          </div>
        </div>
      </div>
      <div
        class="clearfix year-table"
        style="width: 100%"
        v-show="!query.month"
      >
      <div class="clearfix year-table" style="width: 100%" v-show="!query.month">
        <div class="fixed-left">
          <div
            class="content-title"
            style="padding-left: 16px; box-sizing: border-box"
          >
          <div class="content-title" style="padding-left: 16px; box-sizing: border-box">
            人员名称
          </div>
          <div
            class="content-user"
            :class="{ hoverType: currentUserIndex == index }"
            v-for="(item, index) in yearList"
            :key="'e' + index"
            v-on:mouseenter="onMouseEnter(index)"
            v-on:mouseleave="currentUserIndex = null"
          >
            <div class="user-pic">{{ item.name.charAt(0) }}</div>
          <div class="content-user" :class="{ hoverType: currentUserIndex == index }" v-for="(item, index) in yearList"
            :key="'e' + index" v-on:mouseenter="onMouseEnter(index)" v-on:mouseleave="currentUserIndex = null">
            <div class="user-pic">
              {{ item.name ? item.name.charAt(0) : "" }}
            </div>
            <div class="user-info">
              <p style="font-size: 14px; color: #3a7bfa; line-height: 24px">
              <p style="
                  font-size: 14px;
                  color: #3a7bfa;
                  line-height: 24px;
                  margin: 0;
                ">
                {{ item.name }}
              </p>
              <p
                style="
              <p style="
                  color: #999999;
                  font-size: 12px;
                  transform: scale(0.8) translateX(-20px);
                  white-space: nowrap;
                  width: 150px;
                  overflow-x: show;
                "
              >
                  margin: 0;
                ">
                早:{{ item.day0 }},中:{{ item.day1 }},夜:{{ item.day2 }},休:{{
                  item.day3
                }},假:{{ item.day4 }},差:{{ item.day6 }}
              </p>
              <p style="margin-top: 4px">
                <span
                  style="
              <p style="margin-top: 4px; margin: 0">
                <span style="
                    color: #999999;
                    font-size: 12px;
                    display: inline-block;
                    transform: scale(0.8) translateX(-10px);
                  "
                  >合计出勤: </span
                ><span style="font-size: 16px; color: #ff4902"
                  >{{ item.work_time }}天</span
                >
                  ">合计出勤: </span><span style="font-size: 16px; color: #ff4902">{{ item.work_time }}天</span>
              </p>
            </div>
          </div>
@@ -280,36 +169,18 @@
        <div class="scroll-right">
          <div class="content">
            <div>
              <div
                class="content-title content-title-right"
                style="border-bottom: 0; height: 52px"
                :style="`display: grid;
                grid-template-columns: repeat(${monthList.length}, 1fr);`"
              >
                <div
                  class="content-title-item"
                  v-for="(item, index) in monthList"
                  :key="'b' + index"
                  style="height: 52px"
                >
              <div class="content-title content-title-right" style="border-bottom: 0; height: 52px" :style="`display: grid;
                grid-template-columns: repeat(${monthList.length}, 1fr);`">
                <div class="content-title-item" v-for="(item, index) in monthList" :key="'b' + index"
                  style="height: 52px">
                  <span class="month">{{ item }}月</span>
                </div>
              </div>
              <div
                class="content-body"
                v-for="(item, index) in yearList"
                :key="'c' + index"
                v-on:mouseenter="onMouseEnter(index)"
                v-on:mouseleave="currentUserIndex = null"
                :style="`display: grid;
              grid-template-columns: repeat(${monthList.length}, 1fr);`"
              >
                <div
                  class="content-body-item"
                  v-for="(m, i) in item.monthList"
                  :key="'d' + i"
                  :class="{ hoverType: currentUserIndex == index }"
                >
              <div class="content-body" v-for="(item, index) in yearList" :key="'c' + index"
                v-on:mouseenter="onMouseEnter(index)" v-on:mouseleave="currentUserIndex = null" :style="`display: grid;
              grid-template-columns: repeat(${monthList.length}, 1fr);`">
                <div class="content-body-item" v-for="(m, i) in item.monthList" :key="'d' + i"
                  :class="{ hoverType: currentUserIndex == index }">
                  <p style="color: rgb(153, 153, 153); font-size: 12px">
                    合计出勤:<span style="font-size: 14px; color: #000">{{
                      m.totalMonthAttendance
@@ -327,41 +198,23 @@
        </div>
      </div>
    </div>
    <el-pagination
      background
      @current-change="currentChange"
      :page-size="pageSize"
      :current-page="currentPage"
      layout="total, prev, pager, next, jumper"
      :total="total"
      style="margin-top: 10px; text-align: right; margin-right: 30px"
    >
    <el-pagination background @current-change="currentChange" :page-size="pageSize" :current-page="currentPage"
      layout="total, prev, pager, next, jumper" :total="total"
      style="margin-top: 10px; text-align: right; margin-right: 30px">
    </el-pagination>
    <el-dialog title="时间配置" :visible.sync="configTimeVisible" width="620px">
      <div v-loading="configTimeVisibleLoading" style="min-height: 200px">
        <div v-for="(item, index) in timeQuery">
          <div
            class="form"
            style="display: flex; justify-content: space-between"
          >
          <div class="form" style="display: flex; justify-content: space-between">
            <div style="margin-bottom: 12px; width: 200px">
              <span class="form_label">班次:</span>
              <span v-if="!item.isEdit"> {{ item.type }} </span>
              <span class="form_input" v-if="item.isEdit">
                <el-select
                  v-model="item.shift"
                  placeholder="请选择"
                  style="width: 70%; margin-right: 8px"
                  clearable
                  size="small"
                >
                  <el-option
                    v-for="obj in timeTypeList"
                    :key="obj.value"
                    :label="obj.label"
                    :value="obj.value"
                  >
                <el-select v-model="item.shift" placeholder="请选择" style="width: 70%; margin-right: 8px" clearable
                  size="small">
                  <el-option v-for="obj in timeTypeList" :key="obj.dictValue" :label="obj.dictLabel"
                    :value="obj.dictValue">
                  </el-option>
                </el-select>
              </span>
@@ -376,67 +229,36 @@
                }}
              </span>
              <span class="form_input" v-if="item.isEdit">
                <el-time-select
                  placeholder="起始时间"
                  v-model="item.startTime"
                  size="small"
                  :picker-options="{
                    start: '00:00',
                    step: '00:15',
                    end: '24:00',
                  }"
                  style="width: 120px"
                >
                <el-time-select placeholder="起始时间" v-model="item.startTime" size="small" :picker-options="{
                  start: '00:00',
                  step: '00:15',
                  end: '24:00',
                }" style="width: 120px">
                </el-time-select>
                <el-time-select
                  style="width: 120px"
                  placeholder="结束时间"
                  v-model="item.endTime"
                  size="small"
                <el-time-select style="width: 120px" placeholder="结束时间" v-model="item.endTime" size="small"
                  :picker-options="{
                    start: '00:00',
                    step: '00:15',
                    end: '24:00',
                  }"
                >
                  }">
                </el-time-select>
              </span>
            </div>
            <span>
              <i
                class="el-icon-circle-check"
                v-if="item.isEdit"
                style="margin-left: 10px; color: #4b79f2; cursor: pointer"
                @click="saveEdit(item, index)"
              ></i>
              <i
                class="el-icon-edit"
                v-if="!item.isEdit"
                style="margin-left: 10px; color: #4b79f2; cursor: pointer"
                @click="item.isEdit = true"
              ></i>
              <i
                class="el-icon-delete"
                v-if="timeQuery.length > 1"
                style="margin-left: 10px; color: #ff4902; cursor: pointer"
                @click="deleteTime(item, index)"
              ></i>
              <i class="el-icon-circle-check" v-if="item.isEdit"
                style="margin-left: 10px; color: #4b79f2; cursor: pointer" @click="saveEdit(item, index)"></i>
              <i class="el-icon-edit" v-if="!item.isEdit" style="margin-left: 10px; color: #4b79f2; cursor: pointer"
                @click="item.isEdit = true"></i>
              <i class="el-icon-delete" v-if="timeQuery.length > 1"
                style="margin-left: 10px; color: #ff4902; cursor: pointer" @click="deleteTime(item, index)"></i>
            </span>
          </div>
          <el-divider></el-divider>
          <div
            @click="addTimeForm"
            style="color: #4b79f2; cursor: pointer"
            v-if="index === timeQuery.length - 1"
          >
          <div @click="addTimeForm" style="color: #4b79f2; cursor: pointer" v-if="index === timeQuery.length - 1">
            添加时间配置
          </div>
        </div>
        <div
          @click="addTimeForm"
          style="color: #4b79f2"
          v-if="timeQuery.length === 0"
        >
        <div @click="addTimeForm" style="color: #4b79f2" v-if="timeQuery.length === 0">
          添加时间配置
        </div>
      </div>
@@ -447,13 +269,8 @@
          <span style="color: red; margin-right: 4px">*</span>周次:
        </div>
        <div class="search_input" style="width: calc(100% - 90px)">
          <el-date-picker
            v-model="schedulingQuery.week"
            type="week"
            format="yyyy 第 WW 周"
            placeholder="选择周次"
            style="width: 100%"
          >
          <el-date-picker v-model="schedulingQuery.week" type="week" format="yyyy 第 WW 周" placeholder="选择周次"
            style="width: 100%">
          </el-date-picker>
        </div>
      </div>
@@ -462,20 +279,9 @@
          <span style="color: red; margin-right: 4px">*</span>人员名称:
        </div>
        <div class="search_input" style="width: calc(100% - 90px)">
          <el-select
            v-model="schedulingQuery.userId"
            placeholder="请选择"
            style="width: 100%"
            multiple
            clearable
            collapse-tags
          >
            <el-option
              v-for="item in personList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            >
          <el-select v-model="schedulingQuery.userId" placeholder="请选择" style="width: 100%" multiple clearable
            collapse-tags>
            <el-option v-for="item in personList" :key="item.id" :label="item.name" :value="item.id">
            </el-option>
          </el-select>
        </div>
@@ -485,26 +291,15 @@
          <span style="color: red; margin-right: 4px">*</span>班次:
        </div>
        <div class="search_input" style="width: calc(100% - 90px)">
          <el-select
            v-model="schedulingQuery.shift"
            placeholder="请选择"
            style="width: 100%"
          >
            <el-option
              v-for="item in classType"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
          <el-select v-model="schedulingQuery.shift" placeholder="请选择" style="width: 100%">
            <el-option v-for="item in classType" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue">
            </el-option>
          </el-select>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="schedulingVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirmScheduling" :loading="loading"
          >确 定</el-button
        >
        <el-button type="primary" @click="confirmScheduling" :loading="loading">确 定</el-button>
      </span>
    </el-dialog>
  </div>
@@ -523,14 +318,12 @@
  exportFile,
  obtainItemParameterList,
  update,
  selectUserList,
  selectUserCondition,
} from "@/api/performance/class";
export default {
  name: 'Class',
  data() {
    return {
      addPower: true,
      upPower: true,
      downPower: true,
      query: {
        userName: "",
        laboratory: "",
@@ -613,7 +406,6 @@
      configTimeVisibleLoading: false, // 时间配置弹框loading
      timeTypeList: [],
      timeQuery: [],
      listPower: false,
    };
  },
  watch: {
@@ -652,7 +444,7 @@
      this.monthList.push(i);
    }
    this.monthList.reverse();
    this.getPower();
    // this.getPower();
  },
  methods: {
    refresh() {
@@ -712,8 +504,8 @@
            (i == 0 && strArr[i] == 0
              ? ""
              : i > 0 && strArr[i] == 0 && strArr[i - 1] == 0
              ? ""
              : changeNum[strArr[i]] + (strArr[i] == 0 ? unit[0] : unit[i])) +
                ? ""
                : changeNum[strArr[i]] + (strArr[i] == 0 ? unit[0] : unit[i])) +
            newNum;
        }
        return newNum;
@@ -797,31 +589,6 @@
        });
      });
    },
    getPower() {
      let power = JSON.parse(sessionStorage.getItem("power"));
      let add = false;
      let up = false;
      let down = false;
      let listPower = false;
      for (var i = 0; i < power.length; i++) {
        if (power[i].menuMethod == "performanceShiftUpdate") {
          up = true;
        }
        if (power[i].menuMethod == "delDeviceParameter") {
          down = true;
        }
        if (power[i].menuMethod == "performanceShiftAdd") {
          add = true;
        }
        if (power[i].menuMethod == "shiftTimeList") {
          listPower = true;
        }
      }
      this.addPower = add;
      this.upPower = up;
      this.downPower = down;
      this.listPower = listPower;
    },
    onMouseEnter(index) {
      this.currentUserIndex = index;
    },
@@ -854,18 +621,22 @@
        endWeek,
        userId: this.schedulingQuery.userId.join(","),
        shift: this.schedulingQuery.shift,
      }).then((res) => {
        this.loading = false;
        if (res.code == 201) return;
        this.$message.success("操作成功");
        this.schedulingVisible = false;
        this.schedulingQuery = {
          week: "",
          userId: null,
          shift: "",
        };
        this.refresh();
      });
      })
        .then((res) => {
          this.loading = false;
          if (res.code == 201) return;
          this.$message.success("操作成功");
          this.schedulingVisible = false;
          this.schedulingQuery = {
            week: "",
            userId: null,
            shift: "",
          };
          this.refresh();
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    configTime() {
      this.getDicts("sys_class_type").then((response) => {
@@ -883,10 +654,10 @@
            res.data.forEach((item) => {
              item.isEdit = false;
              const index = this.timeTypeList.findIndex(
                (val) => val.value === item.shift
                (val) => val.dictValue === item.shift
              );
              if (index > -1) {
                item.type = this.timeTypeList[index].label;
                item.type = this.timeTypeList[index].dictLabel;
              }
            });
            this.timeQuery = res.data;
@@ -909,10 +680,10 @@
    saveEdit(item, index) {
      if (item.shift) {
        const index = this.timeTypeList.findIndex(
          (val) => val.value === item.shift
          (val) => val.dictValue === item.shift
        );
        if (index > -1) {
          item.type = this.timeTypeList[index].label;
          item.type = this.timeTypeList[index].dictLabel;
        }
      }
      delete item.orderBy;
@@ -975,20 +746,24 @@
        userName: this.query.userName,
        laboratory: this.query.laboratory,
        isMonth: this.query.month ? true : false,
      }).then((res) => {
        this.$message.success("下载成功");
        this.downLoading = false;
        const blob = new Blob([res], {
          type: "application/force-download",
      })
        .then((res) => {
          this.$message.success("下载成功");
          this.downLoading = false;
          const blob = new Blob([res], {
            type: "application/force-download",
          });
          let fileName = "";
          if (this.query.month) {
            fileName = year + "-" + this.query.month + " 班次信息";
          } else {
            fileName = year + " 班次汇总";
          }
          this.$download.saveAs(blob, fileName + ".xlsx");
        })
        .catch((err) => {
          this.downLoading = false;
        });
        let fileName = "";
        if (this.query.month) {
          fileName = year + "-" + this.query.month + " 班次信息";
        } else {
          fileName = year + " 班次汇总";
        }
        this.$download.saveAs(blob, fileName + ".xlsx");
      });
    },
    selectEnumByCategory() {
      this.getDicts("sys_class_type").then((response) => {
@@ -1033,63 +808,36 @@
      }
    },
    getUsers() {
      selectUserList({
        current: -1,
        size: -1,
      }).then((res) => {
      selectUserCondition({ type: 1 }).then((res) => {
        if (res.code === 201) {
          return;
        }
        let arr = res.data.body.records;
        let arr = res.data;
        this.personList = arr;
      });
    },
    getDayByDic(e) {
      let obj = this.classType.find((m) => m.label == e);
      let obj = this.classType.find((m) => m.dictLabel == e);
      if (obj) {
        return obj.value;
        return obj.dictValue;
      }
    },
    getShiftByDic(e) {
      let obj = this.classType.find((m) => m.value == e);
      let obj = this.classType.find((m) => m.dictValue == e);
      if (obj) {
        return obj.label;
        return obj.dictLabel;
      }
      return "无";
    },
    scrollInit() {
      // 获取要绑定事件的元素
      const nav = document.getElementById("nav");
      var flag; // 鼠标按下
      var downX; // 鼠标点击的x下标
      var scrollLeft; // 当前元素滚动条的偏移量
      nav.addEventListener("mousedown", function (event) {
        flag = true;
        downX = event.clientX; // 获取到点击的x下标
        scrollLeft = this.scrollLeft; // 获取当前元素滚动条的偏移量
      });
      nav.addEventListener("mousemove", function (event) {
        if (flag) {
          // 判断是否是鼠标按下滚动元素区域
          var moveX = event.clientX; // 获取移动的x轴
          var scrollX = moveX - downX; // 当前移动的x轴下标减去刚点击下去的x轴下标得到鼠标滑动距离
          this.scrollLeft = scrollLeft - scrollX; // 鼠标按下的滚动条偏移量减去当前鼠标的滑动距离
        }
      });
      // 鼠标抬起停止拖动
      nav.addEventListener("mouseup", function () {
        flag = false;
      });
      // 鼠标离开元素停止拖动
      nav.addEventListener("mouseleave", function (event) {
        flag = false;
      });
    },
  },
};
</script>
<style scoped>
.class-page {
  padding: 10px;
}
.form_title {
  height: 36px;
  display: flex;
@@ -1097,6 +845,7 @@
  justify-content: space-between;
  font-weight: 800;
}
.search {
  height: 50px;
  display: flex;
@@ -1115,60 +864,76 @@
  font-size: 14px;
  text-align: right;
}
.search_input {
  display: flex;
  align-items: center;
}
.btns {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translate(0, -50%);
}
.center {
  width: 100%;
  height: calc(100% - 100px);
  height: calc(100vh - 220px);
  background-color: #fff;
  overflow-y: auto;
  display: flex;
}
>>> .scroll-pagination {
>>>.scroll-pagination {
  overflow-y: scroll;
  scrollbar-width: none;
}
>>> .scroll-pagination::-webkit-scrollbar {
>>>.scroll-pagination::-webkit-scrollbar {
  display: none;
}
.fixed-left {
  float: left;
  width: 220px; /* 左边区域宽度 */
  width: 220px;
  /* 左边区域宽度 */
  background-color: #fff;
  box-shadow: 2px -2px 5px rgba(51, 51, 51, 0.12); /* 左边阴影 */
  box-shadow: 2px -2px 5px rgba(51, 51, 51, 0.12);
  /* 左边阴影 */
}
.clearfix::after {
  content: "";
  display: table;
  clear: both;
}
.scroll-right {
  width: calc(100% - 220px); /* 减去左边区域宽度 */
  min-height: calc(100% - 10px); /* 视口高度 */
  width: calc(100% - 220px);
  /* 减去左边区域宽度 */
  min-height: calc(100% - 10px);
  /* 视口高度 */
  margin-left: 220px;
  overflow-x: scroll;
}
.content {
  min-height: calc(100% - 10px); /* 视口高度 */
  min-height: calc(100% - 10px);
  /* 视口高度 */
}
.content-title {
  height: 52px;
  line-height: 52px;
  height: 58px;
  line-height: 58px;
  border-bottom: 1px solid #eeeeee;
}
.content-title-right {
  display: flex;
  align-items: center;
}
.content-title-item {
  height: 100%;
  width: 50px;
@@ -1181,6 +946,7 @@
  flex-direction: column;
  position: relative;
}
.content-title-item .month {
  font-size: 12px;
  color: #3a7bfa;
@@ -1191,18 +957,23 @@
  text-align: center;
  line-height: 22px;
}
.content-title-item .day {
  font-size: 14px;
  color: #333333;
  margin-right: 4px;
}
.content-title-item .week {
  font-size: 12px;
  color: #999999;
}
.content-body {
  display: flex;
  align-items: center;
}
.content-body-item {
  height: 70px;
  width: 50px;
@@ -1213,6 +984,7 @@
  border-right: 1px solid #eeeeee;
  border-bottom: 1px solid #eeeeee;
}
.work-box {
  width: 100%;
  height: 100%;
@@ -1224,61 +996,77 @@
  color: #999;
  font-size: 14px;
}
.work-box.type0 {
  background: rgba(58, 123, 250, 0.15);
  color: #3a7bfa !important;
}
.work-box.type0 span {
  color: #3a7bfa !important;
}
.work-box.type1 {
  background: #e3dcfe;
  color: #635998 !important;
}
.work-box.type1 span {
  color: #635998 !important;
}
.work-box.type2 {
  background: #fae2ca;
  color: #bc8d5e !important;
}
.work-box.type2 span {
  color: #bc8d5e !important;
}
.work-box.type3 {
  background: #e1f3d8;
  color: #67c23a !important;
}
.work-box.type3 span {
  color: #67c23a !important;
}
.work-box.type4 {
  background: #fde2e2;
  color: #f56c6c !important;
}
.work-box.type4 span {
  color: #f56c6c !important;
}
.work-box.type5 {
  background: #ff46c145;
  color: #ff46c0 !important;
}
.work-box.type5 span {
  color: #ff46c0 !important;
}
.work-box.type6 {
  background: #00036418;
  color: #000464 !important;
}
.work-box.type6 span {
  color: #000464 !important;
}
.work-box-left {
  display: flex;
  justify-content: center;
  flex-direction: column;
  line-height: 24px;
}
.content-user {
  width: 100%;
  height: 70px;
@@ -1287,6 +1075,7 @@
  display: flex;
  align-items: center;
}
.user-pic {
  width: 50px;
  height: 50px;
@@ -1298,19 +1087,24 @@
  line-height: 50px;
  margin-left: 10px;
}
.user-info {
  flex: 1;
  margin-left: 10px;
}
.hoverType {
  background: rgba(58, 123, 250, 0.03);
}
.year-table {
  width: 100%;
}
.year-table .scroll-right {
  flex: 1;
}
.year-table .month {
  font-size: 14px;
  color: #3a7bfa;
@@ -1321,9 +1115,11 @@
  text-align: center;
  line-height: 30px;
}
.year-table .content-title-item {
  width: 100%;
}
.year-table .content-body-item {
  width: 100%;
  height: 70px;