gx

src/components/header.vue

@@ -7,16 +7,15 @@
       <div class="header">
         <div class="headerGo" @click="to('/guide')"></div>
         <!-- <img class="title" src="../assets/img_07.png" alt="" /> -->
-        <!-- <div class="time">
+        <div class="time">
           <div id="date-display"></div>
           <div id="clock" style="margin-top: 4px">加载中...</div>
-    </div> -->
-
+        </div>
         <div class="header-menu">
           <div class="header-menu-item header-menu-left">
             <div
               :class="data.nowTab == item.url ? 'leftItemC' : 'leftItem'"
-              v-for="item in data.urlLeft.slice(0, 4)"
+              v-for="item in data.urlLeft.slice(0, 2)"
               :key="item.name"
             >
               <div class="itemText" @click="to(item.url)">{{ item.name }}</div>
@@ -25,13 +24,16 @@
           <div class="header-menu-item header-menu-right">
             <div
               :class="data.nowTab == item.url ? 'rightItemC' : 'rightItem'"
-              v-for="item in data.urlLeft.slice(4, 8)"
+              v-for="item in data.urlLeft.slice(2, 4)"
               :key="item.name"
             >
               <div class="itemText" @click="to(item.url)">{{ item.name }}</div>
             </div>
           </div>
         </div>
+        <div class="cd">
+          <img class="title" src="../assets/cd.png" alt="" />
+        </div>
         <img src="../assets/RightLine.gif" class="rightLineClass" />
         <img src="../assets/RightLine.gif" class="leftLineClass" />
       </div>
@@ -61,9 +63,9 @@ const updateClock = () => {
   const formattedDate = year + "/" + month + "/" + day;
 
   // 更新页面上的时钟显示
-  // document.getElementById("clock").textContent = timeString;
+  document.getElementById("clock").textContent = timeString;
   // 将格式化后的日期更新到 div 中
-  // document.getElementById("date-display").innerText = formattedDate;
+  document.getElementById("date-display").innerText = formattedDate;
 };
 const to = (url) => {
   router.push({
@@ -88,22 +90,22 @@ const data = reactive({
       name: "总体概览",
       url: "/home/index",
     },
-    {
-      name: "养老",
-      url: "/home/yl",
-    },
-    {
-      name: "卫生",
-      url: "/home/hygiene",
-    },
-    {
-      name: "教育",
-      url: "/home/education",
-    },
-    {
-      name: "救助",
-      url: "/home/work",
-    },
+    // {
+    //   name: "养老",
+    //   url: "/home/yl",
+    // },
+    // {
+    //   name: "卫生",
+    //   url: "/home/hygiene",
+    // },
+    // {
+    //   name: "教育",
+    //   url: "/home/education",
+    // },
+    // {
+    //   name: "救助",
+    //   url: "/home/work",
+    // },
     {
       name: "智能分析",
       url: "/home/analyze",
@@ -149,7 +151,16 @@ onMounted(() => {
     width: 146px;
     height: 55px;
   }
-
+  .cd {
+    position: absolute;
+    right: 50px;
+    top: 38px;
+    cursor: pointer;
+    img {
+      width: 22px;
+      height: 22px;
+    }
+  }
   .time {
     width: 200px;
     height: 70%;
@@ -199,11 +210,11 @@ onMounted(() => {
     }
 
     &-left {
-      left: 2%;
+      left: 10%;
     }
 
     &-right {
-      right: 2%;
+      right: 10%;
     }
 
     .leftItem {

src/view/echart_analyze/FlipClock.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="flipbox">
-    <div class="clock" id="clock">
+    <div class="clock" id="clocks">
       <div v-for="(digit, index) in data.digits" :key="index" class="flip down">
         <div class="digital front number0"></div>
         <div class="digital back number1"></div>