浏览代码

fix: 加班逻辑处理

chenzhen2 2 年之前
父节点
当前提交
0ed0650afb

+ 0 - 250
src/views/envmonitor/components/WorkConfig.vue

@@ -1,250 +0,0 @@
-<template>
-  <div class="scene-config">
-    <!--开放办公区-->
-    <div class="time-box">
-      <img :src="parseImgUrl('page-officehome', 'work.svg')" alt="" />
-      <div class="time-text">
-        <span>工作时间</span>
-        <span>09:00~20:00</span>
-      </div>
-      <div class="time-btn" @click="triggerWork">
-        <span> 预约</span>
-        <span>延时</span>
-      </div>
-    </div>
-    <div class="time-del">
-      <img :src="parseImgUrl('page-officehome', 'goOffWork.svg')" alt="" />
-      <div class="del-text">
-        <span>我要</span>
-        <span>离开</span>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import {
-  defineComponent,
-  reactive,
-  toRefs,
-  onBeforeMount,
-  onMounted,
-  ref,
-  watch,
-} from "vue";
-import { useRouter } from "vue-router";
-import {
-  formatDate,
-  formatDateStr,
-  formatTimerStr,
-  getRelNowTime,
-  parseImgUrl,
-} from "@/utils";
-import { UserActionTypes } from "@/store/modules/user/action-types";
-import { useStore } from "@/store";
-
-export default defineComponent({
-  props: {
-    scenarioArr: {
-      type: Array,
-      default: () => [],
-    },
-    workkArr: {
-      type: Array,
-      default: () => [],
-    },
-  },
-  setup(props, contx) {
-    let router: any = useRouter();
-    let timerText: any = {
-      timer: "", // 工作时间
-      showDel: false, // 是否展示我要离开按钮
-      classColor: "grey",
-    };
-    const store = useStore();
-    const proxyData = reactive({
-      parseImgUrl: parseImgUrl,
-      scenarioArr: props.scenarioArr,
-      workkArr: props.workkArr,
-      onSubmit(values: any) {
-        router.push({ path: "/choice-project" });
-      },
-      // 触发加班按钮
-      triggerWork() {
-        contx.emit("triggerWork");
-      },
-      timerText: timerText,
-      // 格式化日期
-      formateWorkTime() {
-        let data: any = proxyData.workkArr;
-        let nowDate: any = formatDate("YYYY-MM-DD");
-        for (let i = 0; i < data.length; i++) {
-          let date: any = formatDateStr(data[i].date);
-          let cusStartTime: any = data[i].cusStartTime;
-          let cusEndTime: any = data[i].cusEndTime;
-          let customSceneList: any = data[i]?.customSceneList ?? [];
-          let nowTime: any = getRelNowTime();
-          console.log("nowTime===" + nowTime);
-          if (date === nowDate) {
-            // 1.当天没有服务定制时间和加班时间
-               /**a.未来有服务定制和加班**/
-            // 2.当天有服务定制时间无加班时间
-             // 当天在服务定制之内+加班+和未来的时间连续  
-            // a.在服务定制之内
-            // b.已过了服务定制和1相同处理
-            // 3.当天有服务定制和加班时间
-            // a.在服务定制之内,并和加班时间不连着
-            // b.在服务定制之内,并和加班连续
-            // c.在加班时间之内,并和后面加班时间连续
-            // d.在加班时间之内,并且和后面加班不连续
-            // e.不在服务定制之内,也不在加班时间内,但是当天和未来都有预约时间
-            /**f.不在服务定制之内,也不在加班时间内,但是当天没有预约时间,未来有预约加班 */
-
-            if ((!cusStartTime || !cusEndTime) && !customSceneList.length) {
-              proxyData.timerText.timer ===
-                "请选择工作时间段将自动开启办公服务";
-              proxyData.timerText.showDel = false;
-              proxyData.timerText.classColor = "grey";
-            } else if (cusStartTime && cusEndTime && !customSceneList.length) {
-              if (nowTime >= cusStartTime && nowTime <= cusEndTime) {
-                proxyData.timerText.timer =
-                  formatTimerStr(cusStartTime) +
-                  "~" +
-                  formatTimerStr(cusEndTime);
-                proxyData.timerText.showDel = false;
-                proxyData.timerText.classColor = "yellow";
-              } else {
-                proxyData.timerText.timer ===
-                  "请选择工作时间段将自动开启办公服务";
-                proxyData.timerText.showDel = false;
-                proxyData.timerText.classColor = "grey";
-              }
-            } else if (cusStartTime && cusEndTime && customSceneList.length) {
-              
-            }
-          }
-        }
-      },
-    });
-    watch(props, (newProps: any) => {
-      proxyData.scenarioArr = newProps.scenarioArr;
-      proxyData.workkArr = newProps.workkArr;
-    });
-    return {
-      ...toRefs(proxyData),
-    };
-  },
-});
-</script>
-<style lang="scss" scoped>
-.scene-config {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-between;
-  padding: 20px;
-  width: 100%;
-  height: 100%;
-  background: #ffffff;
-  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.07), 0px 4px 10px rgba(0, 0, 0, 0.05);
-  border-radius: 25px;
-  .grey {
-    background: rgba(159, 183, 205, 0.15) !important;
-  }
-  .yellow {
-    background: #ffe723;
-  }
-  .time-box {
-    position: relative;
-    // width: 69%;
-    flex: 2.4;
-    height: 100%;
-    line-height: 58px;
-    background: rgba(206, 159, 39, 0.4);
-    // opacity: 0.4;
-    border-radius: 16px;
-    img {
-      display: inline-block;
-      vertical-align: middle;
-      width: 20px;
-      height: 20px;
-      margin-left: 10px;
-    }
-    .time-text {
-      display: inline-block;
-      vertical-align: middle;
-      padding-left: 10px;
-      span {
-        display: block;
-        &:nth-child(1) {
-          font-family: "Montserrat";
-          font-style: normal;
-          font-weight: 500;
-          font-size: 12px;
-          line-height: 15px;
-          color: #4d5262;
-        }
-        &:nth-child(2) {
-          font-family: "Montserrat";
-          font-style: normal;
-          font-weight: 500;
-          font-size: 15px;
-          line-height: 18px;
-          color: #1f2429;
-        }
-      }
-    }
-    .time-btn {
-      position: absolute;
-      padding-top: 9px;
-      right: 4px;
-      top: 50%;
-      transform: translateY(-50%);
-      display: inline-block;
-      width: 48px;
-      height: 50px;
-      background: #ffffff;
-      box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.1),
-        0px 4px 10px rgba(0, 0, 0, 0.07);
-      border-radius: 12px;
-      span {
-        display: block;
-        font-size: 13px;
-        line-height: 16px;
-        text-align: center;
-        color: #000000;
-      }
-    }
-  }
-
-  .time-del {
-    // width: 27%;
-    padding-top: 13px;
-    flex: 1;
-    margin-left: 10px;
-    background: #f1f4f8;
-    border-radius: 16px;
-    img {
-      display: inline-block;
-      vertical-align: middle;
-      width: 20px;
-      height: 20px;
-      margin-left: 10px;
-    }
-    .del-text {
-      display: inline-block;
-      vertical-align: middle;
-      padding-left: 10px;
-      //   padding-top: 9px;
-      span {
-        display: block;
-        font-size: 13px;
-        line-height: 16px;
-        text-align: center;
-        color: #000000;
-      }
-    }
-  }
-}
-</style>
-<style lang="scss">
-</style>

+ 423 - 0
src/views/envmonitor/components/workOvertime/WorkConfig.vue

@@ -0,0 +1,423 @@
+<template>
+  <div class="scene-config">
+    <!--开放办公区-->
+    <div class="time-box">
+      <img :src="parseImgUrl('page-officehome', 'work.svg')" alt="" />
+      <div class="time-text">
+        <span>{{ timerText.text }}</span>
+        <span>{{ timerText.timer }}</span>
+      </div>
+      <div
+        class="time-btn"
+        :class="timerText.showDel ? 'time-btn-small' : ''"
+        @click="triggerWork"
+      >
+        <span> {{ timerText.btnText }}</span>
+      </div>
+    </div>
+    <div class="time-del" v-if="timerText.showDel">
+      <img :src="parseImgUrl('page-officehome', 'goOffWork.svg')" alt="" />
+      <div class="del-text">
+        <span>我要</span>
+        <span>离开</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import {
+  defineComponent,
+  reactive,
+  toRefs,
+  onBeforeMount,
+  onMounted,
+  ref,
+  watch,
+} from "vue";
+import { useRouter } from "vue-router";
+import {
+  formatDate,
+  formatDateStr,
+  formatTimerStr,
+  getRelNowTime,
+  parseImgUrl,
+} from "@/utils";
+import { UserActionTypes } from "@/store/modules/user/action-types";
+import { useStore } from "@/store";
+
+export default defineComponent({
+  props: {
+    scenarioArr: {
+      type: Array,
+      default: () => [],
+    },
+    workkArr: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  setup(props, contx) {
+    let router: any = useRouter();
+    let timerText: any = {
+      text: "",
+      timer: "", // 工作时间
+      btnText: "",
+      showDel: false, // 是否展示我要离开按钮
+      classColor: "grey",
+    };
+    const store = useStore();
+    const proxyData = reactive({
+      parseImgUrl: parseImgUrl,
+      scenarioArr: props.scenarioArr,
+      workkArr: props.workkArr,
+      forcedOverTimeFlag: false, // 强制加班标记 false:不需要强制加班
+      onSubmit(values: any) {
+        router.push({ path: "/choice-project" });
+      },
+      // 触发加班按钮
+      triggerWork() {
+        contx.emit("triggerWork");
+      },
+      timerText: timerText,
+      // 处理时间和第二天和未来连续的问题
+      formateTimeContinuous() {},
+      // 判断当前时间在不在加班时间里面
+      beforeWorkTime(data: any, nowTime: any) {
+        let flag: any = true; // 是否在所有加班时间之前
+        for (let i = 0; i < data.length; i++) {
+          if (data[i].startTime < nowTime) {
+            flag = false;
+          }
+        }
+        return flag;
+      },
+      // 当前时间是否在所有加班时间之后
+      afterWorkTime(data: any, nowTime: any) {
+        let flag: any = true; // 是否在所有加班时间之前
+        for (let i = 0; i < data.length; i++) {
+          if (data[i].endTime > nowTime) {
+            flag = false;
+          }
+        }
+        return flag;
+      },
+      // 查询时间段的范围
+      checkWorkTime(data: any, nowTime: any) {
+        let obj: any = {
+          type: 0, // type=1 当前时间在所有加班时间之前 type=2 当前时间在所有加班时间后 type=3 当前时间在某段加班时间 type=4 当前时间在加班之外,在某一段中间
+          startTime: 0,
+          endTime: 0,
+        };
+        if (proxyData.beforeWorkTime(data, nowTime)) {
+          obj.type = 1;
+        } else if (proxyData.afterWorkTime(data, nowTime)) {
+          obj.type = 2;
+        } else {
+          let flag = true;
+          for (let i = 0; i < data.length; i++) {
+            if (nowTime >= data[i].startTime && nowTime <= data[i].endTime) {
+              obj.startTime = data[i].startTime;
+              obj.endTime = data[i].endTime;
+              obj.type = 3;
+              flag = false;
+              break;
+            }
+          }
+          if (flag) {
+            obj.type = 4;
+          }
+        }
+        return obj;
+      },
+      // 格式化日期
+      formateWorkTime() {
+        // debugger;
+        let data: any = proxyData.workkArr;
+        let nowDate: any = formatDate("YYYY-MM-DD");
+        for (let i = 0; i < data.length; i++) {
+          let date: any = formatDateStr(data[i].date);
+          let cusStartTime: any = data[i].cusStartTime;
+          let cusEndTime: any = data[i].cusEndTime;
+          let customSceneList: any = data[i]?.customSceneList ?? [];
+          let nowTime: any = getRelNowTime();
+          console.log("nowTime===" + nowTime);
+          let delTimeArr: any = [];
+          if (date === nowDate) {
+            // 1.当天没有服务定制时间和加班时间
+            /**a.未来有服务定制和加班**/
+            // 2.当天有服务定制时间无加班时间
+            // 当天在服务定制之内+加班+和未来的时间连续
+            // a.在服务定制之内
+            // b.已过了服务定制和1相同处理
+            // 3.当天有服务定制和加班时间
+            // a.在服务定制之内,并和加班时间不连着
+            // b.在服务定制之内,并和加班连续
+            // c.在加班时间之内,并和后面加班时间连续
+            // d.在加班时间之内,并且和后面加班不连续
+            // e.不在服务定制之内,也不在加班时间内,但是当天和未来都有预约时间
+            /**f.不在服务定制之内,也不在加班时间内,但是当天没有预约时间,未来有预约加班 */
+
+            let startTime: any = "";
+            let endTime: any = "";
+            if ((!cusStartTime || !cusEndTime) && !customSceneList.length) {
+              proxyData.timerText.text = "请选择工作时间段";
+              proxyData.timerText.timer = "将自动开启办公服务";
+              proxyData.timerText.classColor = "grey";
+              proxyData.timerText.btnText = "预约时间";
+              proxyData.timerText.showDel = false;
+              proxyData.forcedOverTimeFlag = true;
+            } else if (cusStartTime && cusEndTime && !customSceneList.length) {
+              if (nowTime >= cusStartTime && nowTime <= cusEndTime) {
+                proxyData.timerText.text = "工作时间";
+                proxyData.timerText.timer =
+                  formatTimerStr(cusStartTime) +
+                  "~" +
+                  formatTimerStr(cusEndTime);
+                proxyData.timerText.classColor = "yellow";
+                proxyData.timerText.btnText = "预约延时";
+                proxyData.timerText.showDel = false;
+                proxyData.forcedOverTimeFlag = false;
+              } else {
+                proxyData.timerText.text = "请选择工作时间段";
+                proxyData.timerText.timer = "将自动开启办公服务";
+                proxyData.timerText.classColor = "grey";
+                proxyData.timerText.btnText = "预约时间";
+                proxyData.timerText.showDel = false;
+                proxyData.forcedOverTimeFlag = true;
+              }
+            } else if (cusStartTime && cusEndTime && customSceneList.length) {
+              if (nowTime < cusStartTime || nowTime > cusEndTime) {
+                // 在服务定制时间之前
+                let obj: any = proxyData.checkWorkTime(
+                  customSceneList,
+                  nowTime
+                );
+                if (obj.type === 3) {
+                  // 在某段预约时间段内
+                  startTime = obj.startTime;
+                  endTime = obj.endTime;
+                  customSceneList.map((item: any) => {
+                    let oldTimeStart: any = startTime;
+                    let oldTimeEnd: any = endTime;
+                    if (
+                      startTime === item.startTime &&
+                      endTime === item.endTime
+                    ) {
+                      delTimeArr.push(item);
+                    } // 点击我要离开的时候需要删除的数据
+                    if (oldTimeEnd === item.startTime) {
+                      endTime = item.endTime;
+                    }
+                  });
+                  if (nowTime < cusEndTime) {
+                    // 在服务定制时间之前的时候需要处理连续时间的问题
+                    if (endTime === cusStartTime) {
+                      endTime = cusEndTime;
+                    }
+                    customSceneList.map((item: any) => {
+                      if (endTime === item.startTime) {
+                        endTime = item.endTime;
+                      }
+                    });
+                  }
+                  /**
+                   * 需要补加上和未来时间连续的问题
+                   */
+                  proxyData.timerText.text = "工作时间";
+                  proxyData.timerText.timer =
+                    formatTimerStr(startTime) + "~" + formatTimerStr(endTime);
+                  proxyData.timerText.classColor = "grey";
+                  proxyData.timerText.btnText = "预约延时";
+                  proxyData.timerText.showDel = true;
+                  proxyData.forcedOverTimeFlag = false;
+                } else {
+                  customSceneList.map((item: any) => {
+                    if (nowTime < item.startTime) {
+                      let oldTimeStart: any = startTime;
+                      let oldTimeEnd: any = endTime;
+                      if (item.startTime < startTime) {
+                        startTime = item.startTime;
+                        endTime = item.endTime;
+                      } else if (endTime === item.startTime) {
+                        endTime = item.endTime;
+                      }
+                    }
+                  });
+                  /**
+                   *需要补加上和未来时间连续的问题
+                   */
+                  proxyData.timerText.text = "已预约~(今日)";
+                  proxyData.timerText.timer =
+                    formatTimerStr(startTime) + "~" + formatTimerStr(endTime);
+                  proxyData.timerText.classColor = "grey";
+                  proxyData.timerText.btnText = "预约时间";
+                  proxyData.timerText.showDel = false;
+                  proxyData.forcedOverTimeFlag = true;
+                }
+              } else if (nowTime >= cusStartTime && nowTime <= cusEndTime) {
+                startTime = cusStartTime;
+                endTime = cusEndTime;
+                customSceneList.map((item: any) => {
+                  if ((endTime = item.startTime)) {
+                    endTime = item.endTime;
+                  }
+                });
+                /**
+                 * 需要补加上和未来时间连续的问题
+                 */
+                proxyData.timerText.text = "工作时间";
+                proxyData.timerText.timer =
+                  formatTimerStr(startTime) + "~" + formatTimerStr(endTime);
+                proxyData.timerText.classColor = "grey";
+                proxyData.timerText.btnText = "预约延时";
+                proxyData.timerText.showDel = true;
+                proxyData.forcedOverTimeFlag = false;
+              }
+            }
+          }
+        }
+      },
+    });
+    watch(
+      props,
+      (newProps: any) => {
+        proxyData.scenarioArr = newProps.scenarioArr;
+        proxyData.workkArr = newProps.workkArr;
+        if (proxyData.workkArr && proxyData.workkArr.length) {
+          proxyData.formateWorkTime();
+        }
+      },
+      {
+        deep: false,
+        immediate: true,
+      }
+    );
+    return {
+      ...toRefs(proxyData),
+    };
+  },
+});
+</script>
+<style lang="scss" scoped>
+.scene-config {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  padding: 20px;
+  width: 100%;
+  height: 100%;
+  background: #ffffff;
+  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.07), 0px 4px 10px rgba(0, 0, 0, 0.05);
+  border-radius: 25px;
+  .grey {
+    background: rgba(159, 183, 205, 0.15) !important;
+  }
+  .yellow {
+    background: #ffe723;
+  }
+  .time-box {
+    position: relative;
+    // width: 69%;
+    flex: 2.4;
+    height: 100%;
+    line-height: 58px;
+    background: rgba(206, 159, 39, 0.4);
+    // opacity: 0.4;
+    border-radius: 16px;
+    img {
+      display: inline-block;
+      vertical-align: middle;
+      width: 20px;
+      height: 20px;
+      margin-left: 10px;
+    }
+    .time-text {
+      display: inline-block;
+      vertical-align: middle;
+      padding-left: 10px;
+      span {
+        display: block;
+        &:nth-child(1) {
+          font-family: "Montserrat";
+          font-style: normal;
+          font-weight: 500;
+          font-size: 12px;
+          line-height: 15px;
+          color: #4d5262;
+        }
+        &:nth-child(2) {
+          font-family: "Montserrat";
+          font-style: normal;
+          font-weight: 500;
+          font-size: 15px;
+          line-height: 18px;
+          color: #1f2429;
+        }
+      }
+    }
+    .time-btn {
+      position: absolute;
+      // padding-top: 9px;
+      right: 4px;
+      top: 50%;
+      transform: translateY(-50%);
+      display: inline-block;
+      width: 98px;
+      // width: 64px;
+      height: 50px;
+      line-height: 20px;
+      background: #ffffff;
+      box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.1),
+        0px 4px 10px rgba(0, 0, 0, 0.07);
+      border-radius: 12px;
+      span {
+        position: absolute;
+        padding: 0 8px;
+        width: 100%;
+        top: 50%;
+        transform: translateY(-50%);
+        display: block;
+        font-size: 13px;
+        // line-height: 16px;
+        text-align: center;
+        color: #000000;
+      }
+    }
+    .time-btn-small {
+      width: 64px;
+    }
+  }
+
+  .time-del {
+    // width: 27%;
+    padding-top: 13px;
+    flex: 1;
+    margin-left: 10px;
+    background: #f1f4f8;
+    border-radius: 16px;
+    img {
+      display: inline-block;
+      vertical-align: middle;
+      width: 20px;
+      height: 20px;
+      margin-left: 10px;
+    }
+    .del-text {
+      display: inline-block;
+      vertical-align: middle;
+      padding-left: 10px;
+      //   padding-top: 9px;
+      span {
+        display: block;
+        font-size: 13px;
+        line-height: 16px;
+        text-align: center;
+        color: #000000;
+      }
+    }
+  }
+}
+</style>
+<style lang="scss">
+</style>

+ 50 - 1
src/views/envmonitor/components/workOvertime/index.vue

@@ -843,7 +843,7 @@ export default defineComponent({
                 addTimeArr.push(addObj2);
               }
             } else if (item.startTime === item.startTime) {
-              if (item.endTime === endTime) {
+              if (item.endTime <= endTime) {
                 // 整段删除
                 let delObj: any = proxyData.formaTimeObj(
                   item,
@@ -852,9 +852,57 @@ export default defineComponent({
                   item.endTime
                 );
                 delTimerArr.push(delObj);
+              } else if (item.endTime > endTime) {
+                let delObj: any = proxyData.formaTimeObj(
+                  item,
+                  "1",
+                  item.startTime,
+                  item.endTime
+                );
+                delTimerArr.push(delObj);
+                let addObj1: any = proxyData.formaTimeObj(
+                  customSceneList[0],
+                  "0",
+                  endTime,
+                  item.endTime
+                );
+                addTimeArr.push(addObj1);
               }
+            } else if (item.startTime > startTime) {
+              if (item.endTime <= endTime) {
+                // 整段删除
+                let delObj: any = proxyData.formaTimeObj(
+                  item,
+                  "1",
+                  item.startTime,
+                  item.endTime
+                );
+                delTimerArr.push(delObj);
+              } else if (item.endTime > endTime) {
+                let delObj: any = proxyData.formaTimeObj(
+                  item,
+                  "1",
+                  item.startTime,
+                  item.endTime
+                );
+                delTimerArr.push(delObj);
+                let addObj1: any = proxyData.formaTimeObj(
+                  customSceneList[0],
+                  "0",
+                  endTime,
+                  item.endTime
+                );
+                addTimeArr.push(addObj1);
+              }
+            }
+          });
+          addTimeArr.map((item: any) => {
+            let realTime: any = getRelNowTime();
+            if (realTime >= item.startTime && realTime <= item.endTime) {
+              item.type==='2'
             }
           });
+          let formTimeArr:any=addTimeArr.concat(delTimerArr)
           // return formTimeArr;
         } else {
           return [];
@@ -870,6 +918,7 @@ export default defineComponent({
       triggerDelTime() {
         let formTimeArr: any = proxyData.formateDelTimer();
         if (formTimeArr && formTimeArr.length) {
+          console.log(formTimeArr)
           alert("确定删除当前时间吗?");
         }
       },

+ 1 - 1
src/views/envmonitor/index.vue

@@ -190,7 +190,7 @@ import { store } from "@/store";
 import { SpaceInfoModel } from "@/model/userModel";
 import { getWorkType } from "@/utils/mapIcon";
 import WorkOvertime from "./components/workOvertime/index.vue";
-import WorkConfig from "./components/WorkConfig.vue";
+import WorkConfig from "./components/workOvertime/WorkConfig.vue";
 import ScenarioConfig from "./components/ScenarioConfig.vue";
 
 export default defineComponent({