TODO: 推翻整个项目重新建立根基

client/utils/showSnackbar.ts

@@ -0,0 +1,89 @@
+import { snackbar as mduiSnackbar, Snackbar } from "mdui"
+
+interface Options {
+    /**
+     * Snackbar 出现的位置。默认为 `bottom`。可选值为：
+     * * `top`：位于顶部，居中对齐
+     * * `top-start`：位于顶部，左对齐
+     * * `top-end`：位于顶部，右对齐
+     * * `bottom`：位于底部，居中对齐
+     * * `bottom-start`：位于底部，左对齐
+     * * `bottom-end`：位于底部，右对齐
+     */
+    placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end';
+    /**
+     * 操作按钮的文本
+     */
+    action?: string;
+    /**
+     * 是否在右侧显示关闭按钮
+     */
+    closeable?: boolean;
+    /**
+     * 消息文本最多显示几行。默认不限制行数。可选值为
+     * * `1`：消息文本最多显示一行
+     * * `2`：消息文本最多显示两行
+     */
+    messageLine?: 1 | 2;
+    /**
+     * 在多长时间后自动关闭（单位为毫秒）。设置为 0 时，不自动关闭。默认为 5 秒后自动关闭。
+     */
+    autoCloseDelay?: number;
+    /**
+     * 点击或触摸 Snackbar 以外的区域时是否关闭 Snackbar
+     */
+    closeOnOutsideClick?: boolean;
+    /**
+     * 队列名称。
+     * 默认不启用队列，在多次调用该函数时，将同时显示多个 snackbar。
+     * 可在该参数中传入一个队列名称，具有相同队列名称的 snackbar 函数，将在上一个 snackbar 关闭后才打开下一个 snackbar。
+     */
+    queue?: string;
+    /**
+     * 点击 Snackbar 时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * @param snackbar
+     */
+    onClick?: (snackbar: Snackbar) => void;
+    /**
+     * 点击操作按钮时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * 默认点击后会关闭 snackbar；若返回值为 false，则不关闭 snackbar；若返回值为 promise，则将在 promise 被 resolve 后，关闭 snackbar。
+     * @param snackbar
+     */
+    onActionClick?: (snackbar: Snackbar) => void | boolean | Promise<void>;
+    /**
+     * Snackbar 开始显示时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * @param snackbar
+     */
+    onOpen?: (snackbar: Snackbar) => void;
+    /**
+     * Snackbar 显示动画完成时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * @param snackbar
+     */
+    onOpened?: (snackbar: Snackbar) => void;
+    /**
+     * Snackbar 开始隐藏时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * @param snackbar
+     */
+    onClose?: (snackbar: Snackbar) => void;
+    /**
+     * Snackbar 隐藏动画完成时的回调函数。
+     * 函数参数为 snackbar 实例，`this` 也指向 snackbar 实例。
+     * @param snackbar
+     */
+    onClosed?: (snackbar: Snackbar) => void;
+}
+
+interface SnackbarOptions extends Options {
+    message: string
+}
+
+export default  function showSnackbar(opinions: SnackbarOptions) {
+    opinions.autoCloseDelay == null && (opinions.autoCloseDelay = 3500)
+    opinions.placement == null && (opinions.placement = 'top')
+    return mduiSnackbar(opinions)
+}