2

src/component/datePicker/components/MonthPanel.vue

@@ -16,7 +16,11 @@
         <li
           v-for="item of MONTH_NAME"
           :key="item"
-          :class="{ 'layui-this': MONTH_NAME.indexOf(item) === Month }"
+          :class="{
+            'layui-this': MONTH_NAME.indexOf(item) === Month,
+            'layui-laydate-current':
+              Month === '' && parseInt(item) - 1 === dayjs().month(),
+          }"
           @click="handleMonthClick(item)"
         >
           {{ item.slice(0, 3) }}

src/component/datePicker/components/MonthRange.vue

@@ -36,6 +36,9 @@
                 'laydate-range-hover': ifHasRangeHoverClass(
                   getUnix(item, 'left')
                 ),
+                'layui-laydate-current':
+                  (startTime.unix === -1 || endTime.unix === -1) &&
+                  getUnix(item, 'left') === dayjs().startOf('month').valueOf(),
               }"
               @click="handleMonthClick(getUnix(item, 'left'))"
               @mouseenter="monthItemMouseEnter($event, item)"
@@ -80,6 +83,9 @@
                 'laydate-range-hover': ifHasRangeHoverClass(
                   getUnix(item, 'right')
                 ),
+                'layui-laydate-current':
+                  (startTime.unix === -1 || endTime.unix === -1) &&
+                  getUnix(item, 'right') === dayjs().startOf('month').valueOf(),
               }"
               @click="handleMonthClick(getUnix(item, 'right'))"
               @mouseenter="monthItemMouseEnter($event, item)"

src/component/datePicker/components/YearPanel.vue

@@ -18,7 +18,10 @@
         <li
           v-for="item of yearList"
           :key="item"
-          :class="{ 'layui-this': Year === item }"
+          :class="{
+            'layui-this': Year === item,
+            'layui-laydate-current': !Year && item === dayjs().year(),
+          }"
           @click="handleYearClick(item)"
         >
           {{ item }}

src/component/datePicker/components/components/DateContent.vue

@@ -27,6 +27,9 @@
                     (item.value == startDate || item.value == endDate)),
                 'laydate-range-hover': ifHasRangeHoverClass(item),
                 'layui-disabled': item.type !== 'current' && datePicker.range,
+                'layui-laydate-current':
+                  modelValue === -1 &&
+                  item.value === dayjs().startOf('day').valueOf(),
               }"
               @click="handleDayClick(item)"
               @mouseenter="dayItemMouseEnter($event, item)"
@@ -48,6 +51,7 @@ export default {
 import { useI18n } from "../../../../language";
 import { computed, inject } from "vue";
 import { provideType } from "../../interface";
+import dayjs from "dayjs";
 
 export interface DateContentProps {
   dateList: any;

src/component/datePicker/index.less

@@ -248,6 +248,21 @@ html #layuicss-laydate {
   line-height: 26px;
   padding: 10px;
 }
+
+.layui-laydate-footer .laydate-footer-btns span {
+  border-radius: 0px;
+}
+
+.layui-laydate-footer .laydate-footer-btns span:first-child {
+  border-top-left-radius: 2px;
+  border-bottom-left-radius: 2px;
+}
+
+.layui-laydate-footer .laydate-footer-btns span:last-child {
+  border-top-right-radius: 2px;
+  border-bottom-right-radius: 2px;
+}
+
 .layui-laydate-footer span {
   display: inline-block;
   vertical-align: top;
@@ -576,4 +591,7 @@ html #layuicss-laydate {
   .layui-laydate-main{
     width: 340px;
   }
+}
+.layui-laydate-current{
+  background-color: var(--global-neutral-color-3);
 }