dialogControl.js 1.56 KB
import { showConfirmDialog } from 'vant';
import { styleColor } from '@/constant.js';

// 弹框显示状态管理
const DIALOG_SHOWN_KEY = 'unfinished_form_dialog_shown';

/**
 * 检查弹框是否已经显示过
 * @returns {boolean} 是否已显示过
 */
export function hasDialogShown() {
    return sessionStorage.getItem(DIALOG_SHOWN_KEY) === 'true';
}

/**
 * 标记弹框已显示
 */
export function markDialogShown() {
    sessionStorage.setItem(DIALOG_SHOWN_KEY, 'true');
}

/**
 * 重置弹框状态(用于新的会话)
 */
export function resetDialogState() {
    sessionStorage.removeItem(DIALOG_SHOWN_KEY);
}

/**
 * 显示未完成表单确认弹框(带全局控制)
 * @param {Function} onConfirm - 确认回调
 * @param {Function} onCancel - 取消回调
 * @returns {Promise|null} 如果已显示过则返回null,否则返回弹框Promise
 */
export function showUnfinishedFormDialog(onConfirm, onCancel) {
    // 如果已经显示过,直接执行确认回调
    if (hasDialogShown()) {
        if (onConfirm) {
            onConfirm();
        }
        return null;
    }

    // 标记为已显示
    markDialogShown();

    // 显示弹框
    return showConfirmDialog({
        title: '温馨提示',
        message: '您还未完成的表单,是否继续?',
        confirmButtonColor: styleColor.baseColor,
        cancelButtonText: '删除',
        closeOnPopstate: false,
    })
    .then(() => {
        if (onConfirm) {
            onConfirm();
        }
    })
    .catch(() => {
        if (onCancel) {
            onCancel();
        }
    });
}