submit

src/components/operateTitle/index.vue

@@ -1,5 +1,14 @@
 <script setup>
-
+import { useRouter } from 'vue-router';
+import storage from '@/util/storage.js';
+import {computed} from "vue";
+const router = useRouter();
+const goBack=()=>{
+  router.go(-1)
+}
+const topTitle = computed(()=>{
+  return storage.getItem('top-title')
+})
 </script>
 
 <template>
@@ -7,10 +16,10 @@
 
   </div>
 <div class="container">
-<div class="content1">
+<div class="content1" @click="goBack">
   <img src="@/assets/images/back@3x.png"/>
 </div>
-  <div class="content2">登录</div>
+  <div class="content2">{{topTitle}}</div>
 </div>
 </template>
 

src/main.js

@@ -3,6 +3,7 @@ import { createApp } from 'vue';
 import App from './App.vue';
 import router from './router';
 import 'normalize.css';
+import 'vant/lib/index.css';
 
 const app = createApp(App);
 

src/router/index.js

@@ -14,6 +14,10 @@ const routes = [
             {
                 path: 'logon',
                 component: () => import('@/views/logon/index.vue')
+            },
+            {
+                path: 'upload-id-card',
+                component: () => import('@/views/upload-id-card/index.vue')
             }
         ]
     }

src/util/storage.js

@@ -0,0 +1,43 @@
+// storage.js
+
+class StorageService {
+    constructor(storage) {
+        this.storage = storage;
+    }
+
+    setItem(key, value, expire = null) {
+        const obj = {
+            data: value,
+        };
+        if (expire) {
+            const expireTime = new Date().getTime() + expire * 1000;
+            obj.expire = expireTime;
+        }
+        this.storage.setItem(key, JSON.stringify(obj));
+    }
+
+    getItem(key) {
+        const itemStr = this.storage.getItem(key);
+        if (!itemStr) {
+            return null;
+        }
+        const item = JSON.parse(itemStr);
+        if (item.expire && new Date().getTime() > item.expire) {
+            this.storage.removeItem(key);
+            return null;
+        }
+        return item.data;
+    }
+
+    removeItem(key) {
+        this.storage.removeItem(key);
+    }
+
+    clear() {
+        this.storage.clear();
+    }
+}
+
+const localStorageService = new StorageService(window.localStorage);
+
+export default localStorageService;

src/views/logon/index.vue

@@ -3,6 +3,27 @@
 
 const router = useRouter();
 router.go(-1);*/
+import {ref,onBeforeUnmount} from "vue";
+const isCountingDown = ref(false);
+const timeLeft = ref(60);
+const countdownInterval = ref(null);
+
+const sendCode = async () => {
+  isCountingDown.value = true;
+  countdownInterval.value = setInterval(() => {
+    if (timeLeft.value > 0) {
+      timeLeft.value--;
+    } else {
+      clearInterval(countdownInterval.value);
+      isCountingDown.value = false;
+      timeLeft.value = 60;
+    }
+  }, 1000);
+};
+
+onBeforeUnmount(() => {
+  clearInterval(countdownInterval.value);
+});
 </script>
 
 <template>
@@ -19,7 +40,7 @@ router.go(-1);*/
     <div class="wrap2_2" >
       <input placeholder="在此输入">
     </div>
-    <div class="wrap2_3">发送验证码</div>
+    <div class="wrap2_3" @click="sendCode"> {{ isCountingDown ? `(${timeLeft})重新发送` : '发送验证码' }}</div>
   </div>
 </div>
 </div>
@@ -45,6 +66,7 @@ router.go(-1);*/
     padding-left: 16px;
     padding-right: 16px;
     .wrap2{
+      box-sizing: border-box;
       display: flex;
       padding-top: 12px;
       padding-bottom: 12px;
@@ -84,6 +106,7 @@ router.go(-1);*/
       }
     }
     .wrap1{
+      box-sizing: border-box;
       padding-right: 7px;
       display: flex;
       padding-top: 12px;

src/views/signup/index.vue

@@ -1,10 +1,17 @@
 <script setup>
+import { useRouter } from 'vue-router';
+import storage from '@/util/storage.js';
 
+const router = useRouter();
+const goRouter=()=>{
+  storage.setItem('top-title','登录')
+  router.push('/title-forward/logon')
+}
 </script>
 
 <template>
 <div class="container">
-<div class="content1">
+<div class="content1" @click="goRouter">
   报名
 </div>
 </div>

src/views/upload-id-card/index.vue

@@ -0,0 +1,11 @@
+<script setup>
+
+</script>
+
+<template>
+  upload-id-card
+</template>
+
+<style scoped lang="scss">
+
+</style>