feat: 考核管理

src/components/ELPicker/index.vue

@@ -0,0 +1,119 @@
+<script lang="ts" setup>
+import { Calendar } from "@element-plus/icons-vue";
+import dayjs from "dayjs";
+import { ref } from "vue";
+const value = ref("");
+const dropdownShow = ref(false);
+const yearTime = ref<any>(dayjs(new Date()).format("YYYY"));
+const decreaseYear = () => {
+  yearTime.value = dayjs().year(yearTime.value).subtract(1, "year").year(); // 减一年
+};
+
+const increaseYear = () => {
+  yearTime.value = dayjs().year(yearTime.value).add(1, "year").year(); // 加一年
+};
+const focusShow = () => {};
+const blurShow = () => {};
+// 季度
+const monthOne = item => {
+  let start = "";
+  let end = "";
+
+  switch (item) {
+    case "一季度":
+      start = `${yearTime.value}-01-01`;
+      end = `${yearTime.value}-03-31`;
+      break;
+    case "二季度":
+      start = `${yearTime.value}-04-01`;
+      end = `${yearTime.value}-06-30`;
+      break;
+    case "三季度":
+      start = `${yearTime.value}-07-01`;
+      end = `${yearTime.value}-09-30`;
+      break;
+    case "四季度":
+      start = `${yearTime.value}-10-01`;
+      end = `${yearTime.value}-12-31`;
+      break;
+    case "上半年":
+      start = `${yearTime.value}-01-01`;
+      end = `${yearTime.value}-06-30`;
+      break;
+    case "下半年":
+      start = `${yearTime.value}-07-01`;
+      end = `${yearTime.value}-12-31`;
+      break;
+  }
+  value.value = `${yearTime.value}年${item}`;
+  console.log(start, end);
+  return `从 ${start} 到 ${end}`; // 设置时间区间
+};
+// 季度 半年
+const quarterValue = ref(false);
+const open = value => {
+  console.log(value);
+  if (value === "quarter") {
+    quarterValue.value = true;
+  } else {
+    quarterValue.value = false;
+  }
+};
+defineExpose({
+  open
+});
+</script>
+<template>
+  <div class="">
+    <el-dropdown trigger="click">
+      <span class="el-dropdown-link navbar-bg-hover select-none">
+        <el-input
+          v-model="value"
+          style="width: 240px"
+          placeholder="请选择日期"
+          :prefix-icon="Calendar"
+          @focus="focusShow"
+          @blur="blurShow"
+        />
+      </span>
+      <template #dropdown>
+        <el-dropdown-menu class="setting" style="width: 300px">
+          <div class="flex justify-between align-center text-base mt-4">
+            <div class="cursor-pointer ml-4 text-xs pt-2" @click="decreaseYear">
+              <el-icon><DArrowLeft /></el-icon>
+            </div>
+            <div>{{ yearTime }}</div>
+            <div class="cursor-pointer mr-4 text-xs pt-2" @click="increaseYear">
+              <el-icon><DArrowRight /></el-icon>
+            </div>
+          </div>
+          <div
+            v-if="quarterValue"
+            class="flex justify-center align-center mt-5 mb-5"
+          >
+            <el-dropdown-item @click="monthOne('一季度')">
+              一季度
+            </el-dropdown-item>
+            <el-dropdown-item @click="monthOne('二季度')">
+              二季度
+            </el-dropdown-item>
+            <el-dropdown-item @click="monthOne('三季度')">
+              三季度
+            </el-dropdown-item>
+            <el-dropdown-item @click="monthOne('四季度')">
+              四季度
+            </el-dropdown-item>
+          </div>
+          <div v-else class="flex justify-around align-center mt-5 mb-5">
+            <el-dropdown-item @click="monthOne('上半年')">
+              上半年
+            </el-dropdown-item>
+            <el-dropdown-item @click="monthOne('下半年')">
+              下半年
+            </el-dropdown-item>
+          </div>
+        </el-dropdown-menu>
+      </template>
+    </el-dropdown>
+  </div>
+</template>

src/views/evaluate/children/change/manage/addExam.vue

@@ -1,7 +1,10 @@
 <script setup lang="ts">
-import { ref, reactive } from "vue";
+import { ref, reactive, nextTick } from "vue";
 import { ElMessageBox, ElMessage } from "element-plus";
+import ElPicker from "@/components/ELPicker/index.vue";
 const dialogVisibleAdd = ref(false);
+// 季度 半年
+const ElPickerRef = ref();
 const form = reactive({
   name: "",
   region: "month",
@@ -72,20 +75,19 @@ const handleRegionChange = (value: any) => {
     case "year":
       format.value = "YYYY";
       break;
-    case "quarter":
-      format.value = "YYYY-Q";
-      break;
     case "month":
       format.value = "YYYY-MM";
       break;
     case "date":
       format.value = "YYYY-MM-DD";
   }
+  if (value === "quarter" || value === "halfYear") {
+    nextTick(() => {
+      ElPickerRef.value.open(value);
+    });
+    // console.log(ElPickerRef.value.open(value));
+  }
 };
-function getQuarter(month) {
-  const monthIndex = parseInt(month) - 1; // 转换为 0 开头的索引
-  return Math.floor(monthIndex / 3) + 1; // 计算季度
-}
 const monthTime = ref("");
 defineExpose({
   open
@@ -100,16 +102,6 @@ defineExpose({
       width="500"
       :before-close="handleClose"
     >
-      <el-date-picker v-model="monthTime" type="month" placeholder="P">
-        <template #default="{ cell }">
-          {{ console.log("cell", cell) }}
-          <div class="el-date-table-cell" :class="{ current: cell.isCurrent }">
-            <span class="el-date-table-cell__text"
-              >{{ cell.text + 1 }}yyyy</span
-            >
-          </div>
-        </template>
-      </el-date-picker>
       <el-form
         :model="form"
         label-width="auto"
@@ -121,11 +113,10 @@ defineExpose({
           <el-input placeholder="请输入" />
         </el-form-item>
         <el-form-item label="考核周期">
-          <!-- <el-radio-group v-model="radio1"> -->
           <el-radio-group v-model="form.region" @change="handleRegionChange">
             <el-radio value="month" size="large">月度</el-radio>
             <el-radio value="quarter" size="large">季度</el-radio>
-            <el-radio value="3" size="large">半年</el-radio>
+            <el-radio value="halfYear" size="large">半年</el-radio>
             <el-radio value="year" size="large">年度</el-radio>
             <el-radio value="date" size="large">日期</el-radio>
           </el-radio-group>
@@ -137,6 +128,11 @@ defineExpose({
             start-placeholder="开始时间"
             end-placeholder="结束时间"
           />
+          <ElPicker
+            v-else-if="timeType === 'quarter' || timeType === 'halfYear'"
+            ref="ElPickerRef"
+            v-model="monthTime"
+          />
           <el-date-picker
             v-else
             v-model="form.date1"
@@ -144,7 +140,6 @@ defineExpose({
             placeholder="请选择日期"
             :format="format"
           />
-          <!-- </el-date-picker> -->
         </el-form-item>
         <el-form-item label="被考核类型">
           <el-select