From 2ada816d09e3e6c899b66ada95f03995cb9df4b9 Mon Sep 17 00:00:00 2001
From: mkm <727897186@qq.com>
Date: Mon, 14 Aug 2023 18:18:33 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/task/taskCalendar.vue | 293 ++++++++++++++++----------------
 1 file changed, 146 insertions(+), 147 deletions(-)

diff --git a/src/views/task/taskCalendar.vue b/src/views/task/taskCalendar.vue
index 5e67251..793189c 100644
--- a/src/views/task/taskCalendar.vue
+++ b/src/views/task/taskCalendar.vue
@@ -1,64 +1,64 @@
 <template>
-  <div>
-    <el-card class="!border-none" v-loading="loading" shadow="never">
-      <el-button v-perms="['flow_type/add']" type="primary" @click="handleAdd">
-        <template #icon>
-          <icon name="el-icon-Plus" />
-        </template>
-        新增
-      </el-button>
-      <div class="mt-4">
-        <el-calendar v-model="dateValue">
-          <template #dateCell="{ data }">
-            <div style="width: 100%; height: 100%">
-              <p
-                :class="data.isSelected ? 'is-selected' : ''"
-                style="padding: 8px 8px 0 8px"
-              >
-                {{ data.day.split("-").slice(1).join("-") }}
-              </p>
-              <div
-                class="task"
-                @click="clickTask(item)"
-                v-for="(item, index) in taskListFilter(data.day)"
-                :key="index"
-              >
-                {{ item.template_name }}
-              </div>
+    <div>
+        <el-card class="!border-none" v-loading="loading" shadow="never">
+            <el-button v-perms="['flow_type/add']" type="primary" @click="handleAdd">
+                <template #icon>
+                    <icon name="el-icon-Plus" />
+                </template>
+                新增
+            </el-button>
+            <div class="mt-4">
+                <el-calendar v-model="dateValue">
+                    <template #dateCell="{ data }">
+                        <div style="width: 100%; height: 100%">
+                            <p
+                                :class="data.isSelected ? 'is-selected' : ''"
+                                style="padding: 8px 8px 0 8px"
+                            >
+                                {{ data.day.split('-').slice(1).join('-') }}
+                            </p>
+                            <div
+                                class="task"
+                                @click="clickTask(item)"
+                                v-for="(item, index) in taskListFilter(data.day)"
+                                :key="index"
+                            >
+                                {{ item.template_name }}
+                            </div>
+                        </div>
+                    </template>
+                </el-calendar>
             </div>
-          </template>
-        </el-calendar>
-      </div>
-    </el-card>
+        </el-card>
 
-    <edit-popup
-      ref="editRef"
-      :dateValue="dateValue"
-      @success="loadTask"
-      @close="showEdit = false"
-    />
-    <EditTowPopup
-      ref="editTowRef"
-      :task="task"
-      :type="popupType"
-      @success="loadTask"
-      @close="showEditTow = false"
-    />
-  </div>
+        <edit-popup
+            ref="editRef"
+            :dateValue="dateValue"
+            @success="loadTask"
+            @close="showEdit = false"
+        />
+        <EditTowPopup
+            ref="editTowRef"
+            :task="task"
+            :type="popupType"
+            @success="loadTask"
+            @close="showEditTow = false"
+        />
+    </div>
 </template>
 
 <script lang="ts" setup name="task">
-import { timeFormat } from "@/utils/util";
-import feedback from "@/utils/feedback";
+import { timeFormat } from '@/utils/util'
+import feedback from '@/utils/feedback'
 // import { getRoutePath } from "router";
-import EditPopup from "./edit.vue";
-import EditTowPopup from "./editTow.vue";
-import { reactive, watch } from "vue";
-import { apiTaskList, apiTaskDetails } from "@/api/task";
-import { apiTaskSchedulingPlanAdd } from "@/api/task_scheduling_plan";
-const route = useRoute();
+import EditPopup from './edit.vue'
+import EditTowPopup from './editTow.vue'
+import { reactive, watch } from 'vue'
+import { apiTaskList, apiTaskDetails } from '@/api/task'
+import { apiTaskSchedulingPlanAdd } from '@/api/task_scheduling_plan'
+const route = useRoute()
 
-const dateValue = ref(new Date());
+const dateValue = ref(new Date())
 // watch(
 //   () => dateValue,
 //   async (newValue, oldValue) => {
@@ -80,134 +80,133 @@ const dateValue = ref(new Date());
 
 // 当前点击的任务
 const task = ref({
-  create_user_id: 0,
-  end_time: "",
-  id: 0,
-  scheduling_id: 0,
-  start_time: "",
-  status: 0,
-  template_id: 0,
-  template_name: "",
-});
-const popupType = ref("add");
+    create_user_id: 0,
+    end_time: '',
+    id: 0,
+    scheduling_id: 0,
+    start_time: '',
+    status: 0,
+    template_id: 0,
+    template_name: ''
+})
+const popupType = ref('add')
 const clickTask = (e: any) => {
-  popupType.value = "show";
-  task.value = e;
-  handleSelect();
-};
+    popupType.value = 'show'
+    task.value = e
+    handleSelect()
+}
 
 // 加载
-const loading = ref(true);
+const loading = ref(true)
 
-const editRef = shallowRef<InstanceType<typeof EditPopup>>();
-const editTowRef = shallowRef<InstanceType<typeof EditPopup>>();
+const editRef = shallowRef<InstanceType<typeof EditPopup>>()
+const editTowRef = shallowRef<InstanceType<typeof EditPopup>>()
 // 是否显示编辑框
-const showEdit = ref(false);
-const showEditTow = ref(false);
+const showEdit = ref(false)
+const showEditTow = ref(false)
 
 // 查询条件
 const queryParams = reactive({
-  start_time: "",
-  end_time: "",
-  page_no: 1,
-  pageSize: 150,
-});
-
-const taskList = ref<any>([]);
+    scheduling_id: '',
+    start_time: '',
+    end_time: '',
+    page_no: 1,
+    pageSize: 150
+})
+if (route.query.id) {
+    queryParams.scheduling_id = route.query.id.toString()
+}
+const taskList = ref<any>([])
 
 // 查询
 const loadTask = async () => {
-  apiTaskList(queryParams).then((res) => {
-    taskList.value = res.lists;
-  });
-  loading.value = false;
-};
+    apiTaskList(queryParams).then((res) => {
+        taskList.value = res.lists
+    })
+    loading.value = false
+}
 
-const start_date = ref("");
-const end_date = ref("");
+const start_date = ref('')
+const end_date = ref('')
 // 计算当前显示的第一天和最后一天
-const initShowDate = (dateStr = "") => {
-  const currentDate = dateStr ? new Date(dateStr) : new Date();
-  const currentYear = currentDate.getFullYear();
-  const currentMonth = currentDate.getMonth();
-  const lastDay = new Date(currentYear, currentMonth + 1, 0).getDay(); //获取第一天星期
-  const startDay = new Date(currentYear, currentMonth, 1).getDay(); //获取最后一天星期
-  // console.log(new Date(currentYear, currentMonth, 1-startDay).getDate());
-  // console.log(new Date(currentYear, currentMonth + 1, 6-lastDay).getDate());
-  start_date.value = timeFormat(
-    new Date(currentYear, currentMonth, 1 - startDay).getTime()
-  ); //获取第一天时间
-  end_date.value = timeFormat(
-    new Date(currentYear, currentMonth + 1, 6 - lastDay).getTime()
-  ); //获取最后一天时间
-  if (queryParams.start_time != start_date.value) {
-    queryParams.start_time = start_date.value;
-    queryParams.end_time = end_date.value;
-    loading.value = true;
-    loadTask();
-  }
-};
-initShowDate();
+const initShowDate = (dateStr = '') => {
+    const currentDate = dateStr ? new Date(dateStr) : new Date()
+    const currentYear = currentDate.getFullYear()
+    const currentMonth = currentDate.getMonth()
+    const lastDay = new Date(currentYear, currentMonth + 1, 0).getDay() //获取第一天星期
+    const startDay = new Date(currentYear, currentMonth, 1).getDay() //获取最后一天星期
+    // console.log(new Date(currentYear, currentMonth, 1-startDay).getDate());
+    // console.log(new Date(currentYear, currentMonth + 1, 6-lastDay).getDate());
+    start_date.value = timeFormat(new Date(currentYear, currentMonth, 1 - startDay).getTime()) //获取第一天时间
+    end_date.value = timeFormat(new Date(currentYear, currentMonth + 1, 6 - lastDay).getTime()) //获取最后一天时间
+    if (queryParams.start_time != start_date.value) {
+        queryParams.start_time = start_date.value
+        queryParams.end_time = end_date.value
+        loading.value = true
+        loadTask()
+    }
+}
+initShowDate()
 
 // 过滤的任务列表
 const taskListFilter = (e: any) => {
-  return taskList.value
-    .filter((item: any) => {
-      let now = new Date(e).getTime() / 1000;
-      let start = new Date(item.start_time).getTime() / 1000;
-      let end = new Date(item.end_time).getTime() / 1000;
-      return now - start >= 0 && now - end <= 0;
-    })
-    .slice(0, 5);
-};
+    return taskList.value
+        .filter((item: any) => {
+            const now = new Date(e).getTime() / 1000
+            const start = new Date(item.start_time).getTime() / 1000
+            const end = new Date(item.end_time).getTime() / 1000
+            return now - start >= 0 && now - end <= 0
+        })
+        .slice(0, 5)
+}
 
 // 添加
 const handleAdd = async () => {
-  popupType.value = "add";
-  showEditTow.value = true;
-  await nextTick();
-  editTowRef.value?.open("add");
-  editTowRef.value?.updatedForm();
-};
+    popupType.value = 'add'
+    showEditTow.value = true
+    await nextTick()
+    editTowRef.value?.open('add')
+    editTowRef.value?.updatedForm()
+}
 // 查询
 const handleSelect = async () => {
-  popupType.value = "show";
-  showEditTow.value = true;
-  await nextTick();
-  editTowRef.value?.open("show");
-  editTowRef.value?.updatedForm();
-};
+    popupType.value = 'show'
+    showEditTow.value = true
+    await nextTick()
+    editTowRef.value?.open('show')
+    editTowRef.value?.updatedForm()
+}
 </script>
 
 <style lang="scss">
 .is-selected {
-  color: #1989fa;
+    color: #1989fa;
 }
 .el-calendar-table .el-calendar-day {
-  min-height: 8.2rem;
-  padding: 0;
+    min-height: 8.2rem;
+    padding: 0;
 }
 .task {
-  font-size: 0.8rem;
-  /* color: #f7ba2a; */
-  color: #1989fa;
-  padding: 0 8px;
-  white-space: nowrap; /* 设置文本不换行 */
-  overflow: hidden; /* 隐藏溢出的部分 */
-  text-overflow: ellipsis; /* 在溢出的部分显示省略号 */
-  &:hover {
-    background-color: rgba($color: #f38200, $alpha: 0.7);
-    border-radius: 4px;
-    color: #fff;
-  }
+    font-size: 0.8rem;
+    /* color: #f7ba2a; */
+    color: #1989fa;
+    padding: 0 8px;
+    white-space: nowrap; /* 设置文本不换行 */
+    overflow: hidden; /* 隐藏溢出的部分 */
+    text-overflow: ellipsis; /* 在溢出的部分显示省略号 */
+    &:hover {
+        background-color: rgba($color: #f38200, $alpha: 0.7);
+        border-radius: 4px;
+        color: #fff;
+    }
 }
 .the {
-  color: #ff5100;
+    color: #ff5100;
 }
 .tow {
-  color: #f38200;
+    color: #f38200;
 }
 .fou {
-  color: red;
+    color: red;
 }
 </style>