From 967469ffb6bfb096c53e8cad6e9605fe421a174d Mon Sep 17 00:00:00 2001
From: lyt-Top <1105290566@qq.com>
Date: Mon, 11 Jan 2021 23:55:10 +0800
Subject: [PATCH] =?UTF-8?q?'admin-21.01.11:=E5=A2=9E=E5=8A=A0=E8=87=AA?=
 =?UTF-8?q?=E5=8A=A8=E9=94=81=E5=B1=8F=E7=95=8C=E9=9D=A2=EF=BC=88=E6=9C=AA?=
 =?UTF-8?q?=E5=AE=8C=E6=88=90=EF=BC=89'?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 vue-admin-wonderful-next/src/App.vue          |  6 ++
 .../src/views/layout/lockScreen/index.vue     | 57 +++++++++++++++++++
 2 files changed, 63 insertions(+)
 create mode 100644 vue-admin-wonderful-next/src/views/layout/lockScreen/index.vue

diff --git a/vue-admin-wonderful-next/src/App.vue b/vue-admin-wonderful-next/src/App.vue
index 406c134..d56e3d1 100644
--- a/vue-admin-wonderful-next/src/App.vue
+++ b/vue-admin-wonderful-next/src/App.vue
@@ -1,13 +1,19 @@
 <template>
   <router-view />
+  <LockScreen />
 </template>
 
 <script lang="ts">
 import { onBeforeMount } from "vue";
+import { useStore } from "/@/store/index.ts";
 import { setIconfont } from "/@/utils/setIconfont.ts";
+import LockScreen from "/@/views/layout/lockScreen/index.vue";
 export default {
   name: "app",
+  components: { LockScreen },
   setup() {
+    const store = useStore();
+    console.log(store);
     // 设置批量第三方 icon 图标
     onBeforeMount(() => {
       setIconfont(["//at.alicdn.com/t/font_2298093_0fmefamqzj4a.css"]);
diff --git a/vue-admin-wonderful-next/src/views/layout/lockScreen/index.vue b/vue-admin-wonderful-next/src/views/layout/lockScreen/index.vue
new file mode 100644
index 0000000..7b7c860
--- /dev/null
+++ b/vue-admin-wonderful-next/src/views/layout/lockScreen/index.vue
@@ -0,0 +1,57 @@
+<template>
+  <div class="layout-lock-screen layout-lock-screen-mask">
+    <div class="layout-lock-screen-date">
+      <div class="layout-lock-screen-date-box">
+        <div class="layout-lock-screen-date-box-time">22:14</div>
+        <div class="layout-lock-screen-date-box-info">1月11日，星期一</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+export default {
+  name: "layoutLockScreen",
+  setup() {},
+};
+</script>
+
+<style scoped lang="scss">
+.layout-lock-screen-fixed {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+.layout-lock-screen-mask {
+  background: rgba(255, 255, 255, 1);
+  @extend .layout-lock-screen-fixed;
+}
+.layout-lock-screen {
+  @extend .layout-lock-screen-fixed;
+  background-image: url("https://img6.bdstatic.com/img/image/pcindex/sunjunpchuazhoutu.JPG");
+  background-size: 100% 100%;
+  z-index: 9999999;
+  &-date {
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    top: 0;
+    right: 0;
+    color: #ffffff;
+    border: 1px solid red;
+    &-box {
+      position: absolute;
+      left: 30px;
+      bottom: 50px;
+      &-time {
+        font-size: 100px;
+      }
+      &-info {
+        font-size: 40px;
+      }
+    }
+  }
+}
+</style>
\ No newline at end of file