项目初始化

web-api/src/main/java/com/jeesite/modules/apps/web/SysWorkbenchController.java

@@ -24,10 +24,11 @@ public class SysWorkbenchController {
 
     @RequestMapping(value = "getNoteInfo")
     @ResponseBody
-    public List<NoteInfo> getNoteInfo() {
+    public List<NoteInfo> getNoteInfo(MyNotes myNotes) {
         List<NoteInfo> noteInfos = new ArrayList<>();
+        myNotes.setCreateTime_gte(DateUtils.getFirstDayOfCurrentYear());
         List<DictData> dictDataList = DictUtils.getDictList("note_type");
-        List<MyNotes> myNotesList = myNotesService.findList(new MyNotes());
+        List<MyNotes> myNotesList = myNotesService.findList(myNotes);
         Map<String, Long> totalMap = myNotesList.stream()
                 .collect(Collectors.groupingBy(MyNotes::getType, Collectors.counting()));
         Map<String, Long> ustatusMap = myNotesList.stream()
@@ -46,6 +47,7 @@ public class SysWorkbenchController {
     @RequestMapping(value = "getNoteChart")
     @ResponseBody
     public List<ChartDataItem> getNoteChart(MyNotes myNotes) {
+        myNotes.setCreateTime_gte(DateUtils.getFirstDayOfCurrentYear());
         List<MyNotes> myNotesList = myNotesService.findList(myNotes);
         Map<String, ChartDataItem> chartDataMap = myNotesList.stream()
                 .collect(Collectors.groupingBy(

web-api/src/main/java/com/jeesite/modules/utils/DateUtils.java

@@ -68,4 +68,9 @@ public class DateUtils {
     public static LocalDate dateToLocalDate(Date date) {
         return date.toInstant().atZone(ZoneId.systemDefault()).toLocalDate();
     }
+
+    public static Date getFirstDayOfCurrentYear() {
+        LocalDate firstDayOfYear = LocalDate.now().withDayOfYear(1);
+        return Date.from(firstDayOfYear.atStartOfDay(ZoneId.systemDefault()).toInstant());
+    }
 }

web-vue/packages/core/layouts/views/desktop/workbench/components/NoteInfo.vue

@@ -34,7 +34,12 @@
                 <div class="metric-item__extra">已完成</div>
               </div>
             </div>
-            <div class="metric-item__label" @click="handleMetricClick(item.key)">{{ item.label }}</div>
+            <div
+              :class="['metric-item__label', { 'metric-item__label--active': selectedMetricKey === item.key }]"
+              @click="handleMetricClick(item.key)"
+            >
+              {{ item.label }}
+            </div>
           </div>
         </div>
 
@@ -389,6 +394,7 @@
       justify-content: space-between;
       align-items: stretch;
       padding: 8px;
+      cursor: pointer;
       transition:
         transform 0.2s ease,
         box-shadow 0.2s ease,
@@ -448,16 +454,32 @@
         display: flex;
         align-items: center;
         justify-content: center;
-        width: 100%;
+        width: calc(100% - 16px);
-        min-height: 28px;
+        min-height: 30px;
-        margin-top: 2px;
+        margin-top: 0;
-        padding-top: 4px;
+        margin-left: 8px;
-        border-top: 1px solid rgb(226 232 240);
+        margin-right: 8px;
+        padding: 6px 10px;
+        border: 1px solid rgb(226 232 240);
         color: rgb(71 85 105);
         font-size: 12px;
         line-height: 16px;
         text-align: center;
-        cursor: pointer;
+        border-radius: 999px;
+        box-sizing: border-box;
+        overflow: hidden;
+        background: rgb(248 250 252);
+        transition:
+          background-color 0.2s ease,
+          color 0.2s ease,
+          border-color 0.2s ease;
+      }
+
+      &__label--active {
+        border-color: rgb(191 219 254);
+        background: rgb(239 246 255) !important;
+        color: rgb(59 130 246) !important;
+        font-weight: 600;
       }
     }
 
@@ -491,11 +513,6 @@
     }
 
     .metric-item {
-      &--active {
-        box-shadow: 0 14px 30px rgb(37 99 235 / 20%);
-        outline-color: rgb(96 165 250);
-      }
-
       &__pane {
         background: linear-gradient(180deg, rgb(20, 20, 20) 0%, rgb(28 28 28) 100%);
         box-shadow: 0 10px 24px rgb(0 0 0 / 24%);
@@ -507,7 +524,14 @@
       }
 
       &__label {
-        border-top-color: rgb(51 65 85);
+        border-color: rgb(51 65 85);
+        background: rgb(20, 20, 20);
+      }
+
+      &__label--active {
+        border-color: rgb(59 130 246 / 40%);
+        background: rgb(37 99 235 / 14%) !important;
+        color: rgb(191 219 254) !important;
       }
     }
   }