fix duplicate login

components.d.ts

@@ -17,6 +17,7 @@ declare module 'vue' {
     ASubMenu: typeof import('ant-design-vue/es')['SubMenu']
     ATable: typeof import('ant-design-vue/es')['Table']
     Layout: typeof import('./src/components/Layout.vue')['default']
+    QmButton: typeof import('./src/components/QmButton.vue')['default']
     StateSelect: typeof import('./src/components/StateSelect.vue')['default']
   }
 }

src/api/loginPage.ts

@@ -1,5 +1,4 @@
 import { httpApp } from "@/plugins/axiosApp";
-import { useRouter } from "vue-router";
 
 /** 登录 */
 export function loginByUsername(loginInfo: {
@@ -14,6 +13,5 @@ export function loginByUsername(loginInfo: {
 
 /** 登出 */
 export function logout() {
-  const router = useRouter();
   return httpApp.post("/api/ess/auth/logout").catch(() => {});
 }

src/components/QmButton.vue

@@ -0,0 +1,43 @@
+<template>
+  <!-- FIXED: 从 vue 3.1.5 升级到 3.2.1 时这里出错了，slot也要有key -->
+  <a-button v-bind="newAttrs" :loading="inInterval" @click="insideClick">
+    <template v-for="(_, slot) of $slots" v-slot:[slot]="scope">
+      <slot :name="asAny(slot)" v-bind="asAny(scope)" :key="slot" />
+    </template>
+    <!-- <slot name="default" /> -->
+  </a-button>
+</template>
+
+<script lang="ts">
+import { reactive, ref } from "vue";
+
+// 默认loading一秒，以免重复点击
+export default {
+  name: "QmButton",
+  inheritAttrs: false,
+  props: {
+    clickTimeout: { type: Number, required: false, default: 1000 },
+  },
+  // @ts-ignore
+  setup(props, { attrs }) {
+    let newAttrs = reactive({});
+    Object.assign(newAttrs, attrs);
+    let parentOnClick = attrs.onClick;
+    // @ts-ignore
+    delete newAttrs["onClick"];
+
+    let inInterval = ref(false);
+    const insideClick = (e: MouseEvent) => {
+      inInterval.value = true;
+      setTimeout(() => (inInterval.value = false), props.clickTimeout);
+      parentOnClick(e);
+    };
+    // newAttrs.onClick = insideClick;
+
+    function asAny(input: any): any {
+      return input as any;
+    }
+    return { newAttrs, inInterval, insideClick, asAny };
+  },
+};
+</script>

src/features/Login/Login.vue

@@ -26,7 +26,7 @@
             {{ errorInfo }}
           </div>
 
-          <a-button type="primary" @click="login">立即登录</a-button>
+          <qm-button type="primary" @click="login">立即登录</qm-button>
         </div>
       </div>
     </div>