124

2025-06-08 22:44:18 +08:00
commit b718751a88
1045 changed files with 314795 additions and 0 deletions
--- a/src/views/home/layout/head.vue
+++ b/src/views/home/layout/head.vue
@ -0,0 +1,147 @@
+<template>
+  <div class="home-head-box relative">
+    <div class="time absolute">
+      <div class="f20">{{ datatime }}</div>
+      <div class="f18 pl104">{{ hour + ":" + minute + ":" + second }}</div>
+    </div>
+    <div class="title absolute" @click="goPath">{{ props.title }}</div>
+    <div>
+      <div class="min_title absolute">
+        <span class="title_text">林芝市</span>
+      </div>
+    </div>
+
+    <div class="wd absolute">
+      <el-icon size="25px" style="top: 6px" color="#86C8EB"><Sunny /></el-icon>
+      <span> 温度 1~7°C </span>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { useRouter } from "vue-router";
+import { getRecentDay, timeValidate } from "@/utils/tools.js";
+import { ref, onMounted, defineProps, onUnmounted } from "vue";
+const props = defineProps({
+  title: {
+    type: String,
+    default: "公交系统"
+  }
+});
+const datatime = ref(getRecentDay(0));
+const minute = ref("00"); //分
+const second = ref("00"); //秒
+const hour = ref("00"); //时
+const day = ref(0);
+const timersfm = ref(null);
+
+const router = useRouter();
+
+onMounted(() => {
+  timersfm.value = setInterval(() => {
+    CurrentTime();
+  }, 1000);
+});
+// 获取时分秒
+function CurrentTime() {
+  const date = new Date();
+  hour.value = date.getHours();
+  minute.value = date.getMinutes();
+  second.value = date.getSeconds();
+  day.value = day.value < 10 ? "0" + day.value : day.value;
+  hour.value = hour.value < 10 ? "0" + hour.value : hour.value;
+  minute.value = minute.value < 10 ? "0" + minute.value : minute.value;
+  second.value = second.value < 10 ? "0" + second.value : second.value;
+}
+
+function goPath() {
+  router.push("/editPassword");
+}
+</script>
+
+<style lang="scss" scoped>
+.zdybg {
+  width: 100%;
+  height: 65px;
+  position: relative;
+  background: #071629;
+  z-index: 2;
+}
+.home-head-box {
+  position: relative;
+  width: 100%;
+  height: 65px;
+  z-index: 2;
+  background: #071629;
+  &::after {
+    content: "";
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    width: 100%;
+    height: 138px;
+    z-index: -1;
+    background: url("~@/assets/images/home_head.png") no-repeat center center;
+    background-size: 100% 100%;
+  }
+  .title {
+    font-size: 36px;
+    left: 50%;
+    top: 10px;
+    transform: translateX(-50%);
+    font-family: "YSBTH";
+    background: linear-gradient(0deg, #59a6f4 0%, #ffffff 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    cursor: pointer;
+  }
+  .min_title {
+    font-size: 36px;
+    background: url("~@/assets/images/qt11/min_title.png") no-repeat center
+      center;
+    left: 50%;
+    top: 65px;
+    z-index: -2;
+    background-color: #0a1d35;
+    height: 60px;
+    width: 100%;
+    text-align: center;
+    transform: translateX(-50%);
+    font-family: "YSBTH";
+    .title_text {
+      background: linear-gradient(0deg, #59a6f4 0%, #ffffff 100%);
+      -webkit-background-clip: text;
+      -webkit-text-fill-color: transparent;
+      line-height: 80px;
+    }
+  }
+  .time {
+    font-family: "DigifaceWide";
+    color: #fff;
+    left: 25%;
+    top: 10px;
+  }
+  .wd {
+    right: 25%;
+    top: 12px;
+    font-size: 16px;
+    font-family: "DigifaceWide";
+    color: #fff;
+  }
+  .zbbb {
+    position: absolute;
+    right: 20px;
+    top: 14px;
+    font-size: 16px;
+    width: 162px;
+    height: 48px;
+    text-align: center;
+    line-height: 48px;
+    font-size: 16px;
+    background: url("~@/assets/images/btnbb.png") no-repeat center center;
+    background-size: 100% 100%;
+    cursor: pointer;
+  }
+}
+</style>