From 66a2c1fde29c7faa94cb7ac917d61ed526ef1eb2 Mon Sep 17 00:00:00 2001
From: shijingjing <1789544664@qq.com>
Date: Thu, 2 Feb 2023 16:09:24 +0800
Subject: [PATCH] =?UTF-8?q?=E7=AD=BE=E5=88=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/project/qianxinan/AppSignIn/AppSignIn.vue | 185 ++++++++++++++++++
 1 file changed, 185 insertions(+)
 create mode 100644 src/project/qianxinan/AppSignIn/AppSignIn.vue

diff --git a/src/project/qianxinan/AppSignIn/AppSignIn.vue b/src/project/qianxinan/AppSignIn/AppSignIn.vue
new file mode 100644
index 00000000..9bd3dd01
--- /dev/null
+++ b/src/project/qianxinan/AppSignIn/AppSignIn.vue
@@ -0,0 +1,185 @@
+<template>
+  <div class="AppSignIn">
+    <div class="title">签到记录</div>
+
+    <div class="sign_list">
+      <div class="sign_card">
+        <div class="sign_left">08:26</div>
+        <div class="sign_right">
+          <div class="time">2023-01-03</div>
+          <div class="tips">签到成功</div>
+        </div>
+      </div>
+
+      <div class="sign_card">
+        <div class="sign_left">08:26</div>
+        <div class="sign_right">
+          <div class="time">2023-01-03</div>
+          <div class="tips">签到成功</div>
+        </div>
+      </div>
+
+      <div class="sign_card">
+        <div class="sign_left">08:26</div>
+        <div class="sign_right">
+          <div class="time">2023-01-03</div>
+          <div class="tips">签到成功</div>
+        </div>
+      </div>
+
+      <div class="sign_card">
+        <div class="sign_left">08:26</div>
+        <div class="sign_right">
+          <div class="time">2023-01-03</div>
+          <div class="tips">签到成功</div>
+        </div>
+      </div>
+
+      <div class="sign_card">
+        <div class="sign_left">08:26</div>
+        <div class="sign_right">
+          <div class="time">2023-01-03</div>
+          <div class="tips">签到成功</div>
+        </div>
+      </div>
+
+      <div class="sign_card">
+        <div class="sign_left">08:26</div>
+        <div class="sign_right">
+          <div class="time">2023-01-03</div>
+          <div class="tips">签到成功</div>
+        </div>
+      </div>
+
+      <div class="sign_card">
+        <div class="sign_left">08:26</div>
+        <div class="sign_right">
+          <div class="time">2023-01-03</div>
+          <div class="tips">签到成功</div>
+        </div>
+      </div>
+    </div>
+
+    <div class="sign_btn">
+      <div class="btn">
+        <div>签到</div>
+        <div>{{ time }}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import dayjs from "dayjs"
+export default {
+  appName: "签到",
+  data() {
+    return {
+      time: '',
+    }
+  },
+  methods: {
+  },
+  onShow() {
+    document.title = '签到'
+    setInterval(() => {
+      this.time = dayjs(new Date()).format('HH:mm:ss')
+    }, 1000)
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AppSignIn {
+  padding: 100px 32px 420px 32px;
+  box-sizing: border-box;
+
+  .title {
+    font-weight: 600;
+    font-size: 28px;
+    color: #333333;
+    width: 100%;
+    height: 100px;
+    line-height: 100px;
+    padding-left: 32px;
+    box-sizing: border-box;
+    background: #F5F5F5;
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 9;
+  }
+
+  .sign_list {
+    .sign_card {
+      display: flex;
+      background: #FFFFFF;
+      padding: 24px;
+      box-sizing: border-box;
+      box-shadow: 0 0 8px 0 rgba(0,0,0,0.02);
+      border-radius: 16px;
+      margin-bottom: 24px;
+
+      .sign_left {
+        align-self: center;
+        font-weight: 600;
+        font-size: 40rpx;
+        color: #333333;
+        margin-right: 32px;
+      }
+
+      .sign_right {
+        font-weight: 400;
+        font-size: 26px;
+        color: #333333;
+
+        .tips {
+          color: #999999;
+          margin-top: 8px;
+        }
+      }
+    }
+  }
+
+  .sign_btn {
+    position: relative;
+    width: 100%;
+    height: 400px;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    background: #F5F5F5;
+    box-shadow: 0 -4px 8px 0 rgba(0,0,0,0.02);
+    z-index: 9;
+
+    .btn {
+      position: absolute;
+      left: 50%;
+      top: 50%;
+      transform: translate(-50%, -50%);
+      width: 240px;
+      height: 240px;
+      text-align: center;
+      // background-image: linear-gradient(180deg, #75BDFF 0%, #4783FF 100%);
+      background-image: linear-gradient(180deg, #bcff75 0%, hsl(132, 87%, 30%) 100%);
+
+      border: 8px solid #FFFFFF;
+      box-shadow: 0 8px 12px -4px rgba(133,196,255,0.65);
+      border-radius: 50%;
+      color: #FFFFFF;
+
+      & > div:first-child {
+        font-weight: 500;
+        font-size: 40px;
+        margin-top: 72px;
+      }
+
+      & > div:last-child {
+        margin-top: 10px;
+        font-weight: 400;
+        font-size: 28px;
+      }
+    }
+  }
+}
+</style>
\ No newline at end of file