Browse Source

perfect_showNotification

ananzhusen 2 years ago
parent
commit
ff3f2d4591
2 changed files with 23 additions and 8 deletions
  1. 22 8
      src/services/utils.ts
  2. 1 0
      src/views/components/Graphics.vue

+ 22 - 8
src/services/utils.ts

@@ -1,6 +1,6 @@
 import { FormItem, Pen, Meta2d, Meta2dData } from "@meta2d/core";
-import { MessagePlugin, NotifyPlugin } from "tdesign-vue-next";
-import { ref } from "vue";
+import { MessagePlugin, NotifyPlugin, Button } from "tdesign-vue-next";
+import { h, ref } from "vue";
 import { cdn } from "./api";
 
 const market = import.meta.env.VITE_MARKET;
@@ -39,21 +39,35 @@ export interface Meta2dBackData extends Meta2dData {
 const notification = ref<any>(null);
 export function showNotification(title: string): Promise<boolean> {
   return new Promise<boolean>((resolve) => {
+    const btnClick = () => {
+      NotifyPlugin.close(notification.value);
+      notification.value = null;
+      resolve(true);
+    };
     if (!notification.value) {
       notification.value = NotifyPlugin.info({
         title: "提示",
         content: title,
-        closeBtn: "确定",
+        closeBtn: true,
         onCloseBtnClick: () => {
           //关闭按钮
-          NotifyPlugin.close(notification.value);
           notification.value = null;
-          resolve(true);
-        },
-        onDurationEnd: () => {
-          //计时结束
           resolve(false);
         },
+        duration: 1000000,
+        footer: h(
+          Button,
+          {
+            theme: "primary",
+            size: "small",
+            style: {
+              "margin-top": "16px",
+              "margin-left": "256px",
+            },
+            onClick: btnClick,
+          },
+          "确定"
+        ),
       });
     }
   });

+ 1 - 0
src/views/components/Graphics.vue

@@ -373,6 +373,7 @@ onUnmounted(() => {
       overflow-y: auto;
       max-height: calc(100vh - 100px);
       background-color: var(--color-background-active);
+      padding-top: 16px;
 
       * {
         background-color: var(--color-background-active);