diff --git a/src/components/Widget/index.vue b/src/components/Widget/index.vue
index 49d6f53b8ff3cc16b7d4f54f79bfe1cc36f37daf..6a64d75bcf68753e00ee74d5cfff290f36580020 100644
--- a/src/components/Widget/index.vue
+++ b/src/components/Widget/index.vue
@@ -10,7 +10,7 @@
     </div>
 </template>
 <script>
-import { watch, ref } from 'vue'
+import { ref, watchEffect } from 'vue'
 import {useStore} from 'vuex'
 export default {
   setup(){
@@ -25,8 +25,8 @@ export default {
     }
     let timer = null
     // 小工具显示 / 隐藏 及时间处理
-    watch(()=>store.state.taskbar.widgetShow,()=>{
-      if(store.state.taskbar.widgetShow&&store.state.taskbar.widgetOrNotice){
+    watchEffect(()=>{
+      if(store.state.taskbar.widgetShow && store.state.taskbar.widgetOrNotice){
         currentTime = new Date().getTime()
         let hours = new Date(currentTime).getHours(),minutes = new Date(currentTime).getMinutes()>9?new Date(currentTime).getMinutes():`0${new Date(currentTime).getMinutes()}`,seconds = new Date(currentTime).getSeconds()>9?new Date(currentTime).getSeconds():`0${new Date(currentTime).getSeconds()}`
         drawerTime.value = `${hours} : ${minutes} : ${seconds}`
diff --git a/src/main.js b/src/main.js
index 21fb3ffe0bc2890603528a500fbf977d21a63ed2..2ab0a54d27740561ddb36cd837ad74323508feee 100644
--- a/src/main.js
+++ b/src/main.js
@@ -3,6 +3,7 @@ import App from './App.vue'
 import router from './router'
 import store from './store'
 import ElementPlus from 'element-plus';
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
 import 'element-plus/lib/theme-chalk/index.css';
 import '@/assets/css/reset.min.css'
 import Directive from './directive'
@@ -10,4 +11,6 @@ import Directive from './directive'
 import 'normalize.css/normalize.css'
 import '@/styles/index.scss'
 
-createApp(App).use(store).use(router).use(ElementPlus).use(Directive).mount('#app')
+createApp(App).use(store).use(router).use(ElementPlus,{
+  locale: zhCn
+}).use(Directive).mount('#app')
diff --git a/src/store/modules/taskbar.js b/src/store/modules/taskbar.js
index b0eadf4f84b1c8f07043148b374db13004ce11f2..d28b2e2b2653f76b8ba631129a30b798a7d12224 100644
--- a/src/store/modules/taskbar.js
+++ b/src/store/modules/taskbar.js
@@ -2,7 +2,8 @@ const state = {
 	startMapShow: false,
 	currentPag: 'start',
 	widgetShow: false,
-	widgetOrNotice: true  // true -> widget   false -> notice
+	widgetOrNotice: undefined,  // true -> widget   false -> notice
+	dateBoxShow: false
 }
 
 const mutations = {
@@ -33,6 +34,10 @@ const mutations = {
 	// 小工具 还是 通知中心
 	WIDGETORNOTICE(state,val){
 		state.widgetOrNotice = val
+	},
+	// 日期窗口显示/隐藏
+	DATEBOXSHOW(state,val){
+		state.dateBoxShow=val
 	}
 }
 
@@ -45,6 +50,9 @@ const actions = {
 	},
 	changeWidgetOrNotice({commit},val){
 		commit('WIDGETORNOTICE',val)
+	},
+	changeDateBoxShow({commit},val){
+		commit('DATEBOXSHOW',val)
 	}
 }
 
diff --git a/src/views/desktop/Home.vue b/src/views/desktop/Home.vue
index 9f1eb1863bd5191bddb36aa93376c3bcebdfff66..16cb7408e351a594a109e003d966f113ea1319d7 100644
--- a/src/views/desktop/Home.vue
+++ b/src/views/desktop/Home.vue
@@ -107,6 +107,9 @@ export default {
       if(store.state.taskbar.widgetShow){
         store.dispatch('taskbar/changeWidgetShow',false)
       }
+      if(store.state.taskbar.dateBoxShow){
+        store.dispatch('taskbar/changeDateBoxShow',false)
+      }
     }
     return {
       dataList,
diff --git a/src/views/taskbar/index.vue b/src/views/taskbar/index.vue
index 1b9dc76e3a5a9eb2a76f5c7918d60ca2810d2990..900e606ba4f45c9edb489dab0a48194e00f031ec 100644
--- a/src/views/taskbar/index.vue
+++ b/src/views/taskbar/index.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="taskbar">
+  <div class="taskbar" @click="taskbarBtn">
     <!-- 任务栏中间部分 -->
-    <div class="taskbarCenter flex" id="taskbar" @click="taskbarBtn">
+    <div class="taskbarCenter flex" id="taskbar">
       <!-- 开始按钮 -->
       <div class="startMenu flex" id="startMenu">
         <img :src="windowsImg" v-ClickAnimation alt="" id="startMenuImg" />
@@ -39,18 +39,24 @@
       <div class="startMenu rightMenu"><img class="rightImg" :src="wifiImg" alt="wifi"></div>
       <div class="startMenu rightMenu"><img class="rightImg" :src="batteryImg" alt="battery"></div>
       <div class="startMenu rightMenu"><img class="audoiImg" :src="audioImg" alt="audio"></div>
-      <div class="rightTime">
-        <span>{{time}}</span>
-        <span>{{date}}</span>
+      <div class="rightTime" id="rightTime">
+        <span id="rightTimeTime">{{time}}</span>
+        <span id="rightTimeDate">{{date}}</span>
       </div>
       <div class="startMenu rightMenu" @click="showNotice"><img class="rightImg sidebar" :src="sidebarImg" alt="sidebar"></div>
     </div>
     <!-- 开始按钮和搜索按钮弹框 -->
     <transition name="el-zoom-in-bottom">
-      <div v-show="isShow" class="box" @click.stop='aaa'>
+      <div v-show="isShow" class="box" @click.stop>
         <component :is='componentTag'></component>
       </div>
     </transition>
+    <!-- 任务栏时间弹窗 -->
+    <transition name="el-zoom-in-bottom">
+      <div v-show="dateBoxShow" class="dateBox" @click.stop>
+        <el-calendar ref="calendar"></el-calendar>
+      </div>
+    </transition>
   </div>
 </template>
 
@@ -68,8 +74,9 @@ export default {
   setup() {
     const store = useStore();
     const componentTag = ref('search')
-    const isShow = computed(() => store.state.taskbar.startMapShow);
-    // 任务栏中间部分点击事件监听
+    const isShow = computed(() => store.state.taskbar.startMapShow)
+    const dateBoxShow = computed(()=>store.state.taskbar.dateBoxShow)
+    // 任务栏点击事件监听
     const taskbarBtn = async e=>{
       if(e.target.id.indexOf('widget')>=0){
         if(store.state.taskbar.widgetShow&&store.state.taskbar.widgetOrNotice){
@@ -80,6 +87,13 @@ export default {
         store.dispatch('taskbar/changeWidgetOrNotice',true)
         await nextTick()
         store.dispatch('taskbar/changeWidgetShow',true)
+        return
+      }
+      if(e.target.id.indexOf('rightTime')>=0){
+        store.dispatch('taskbar/changeDateBoxShow',!store.state.taskbar.dateBoxShow)
+        return
+      }else{
+        store.dispatch('taskbar/changeDateBoxShow',false)
       }
       switch(0){
         case e.target.id.indexOf('startMenu'):
@@ -130,8 +144,8 @@ export default {
     }
     // 时间数据
     let currentTime = new Date().getTime()
-    const time = ref(0)
-    const date = ref(0)
+    const date = ref('1970/01/01')
+    const time = ref('00:00')
     const fn = () =>{
       currentTime+=1000
       const minus = new Date(currentTime).getMinutes()>9?new Date(currentTime).getMinutes():`0${new Date(currentTime).getMinutes()}`
@@ -140,17 +154,15 @@ export default {
       date.value = `${new Date(currentTime).getFullYear()}/${new Date(currentTime).getMonth()+1}/${new Date(currentTime).getDate()}`
     }
     setInterval(fn,1000)
-    // 阻止事件冒泡，防止关闭弹窗
-    const aaa=()=>{}
     return {
       isShow,
       ...imgUrl,
       componentTag,
-      aaa,
       taskbarBtn,
       showNotice,
       time,
-      date
+      date,
+      dateBoxShow
     };
   },
 };
@@ -219,4 +231,29 @@ export default {
     justify-items: center;
   }
 }
+.dateBox{
+  box-sizing: border-box;
+  width: 360px;
+  position: absolute;
+  right: 12px;
+  top: -434px;
+  border-radius: 8px;
+  overflow: hidden;
+  ::v-deep .el-calendar__body{
+    padding: 12px 20px 0;
+    font-size: 14px;
+  }
+  ::v-deep .el-calendar-table{
+    transition: none;
+    .el-calendar-day{
+      height: 52px;
+      &:hover{
+        background-color: transparent !important;
+      }
+    }
+    td.is-selected{
+      background-color: cyan !important;
+    }
+  }
+}
 </style>
\ No newline at end of file