dialogControl.js 2.51 KB
/*
 * @Date: 2025-09-10 10:54:52
 * @LastEditors: hookehuyr hookehuyr@gmail.com
 * @LastEditTime: 2025-11-19 14:17:17
 * @FilePath: /data-table/src/utils/dialogControl.js
 * @Description: 文件描述
 */
import { showConfirmDialog } from 'vant';
import { styleColor } from '@/constant.js';

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

/**
 * 检查弹框是否已经显示过
 * @param {string} currentCode - 当前表单的code参数
 * @returns {boolean} 是否已显示过
 */
export function hasDialogShown(currentCode) {
    const isShown = sessionStorage.getItem(DIALOG_SHOWN_KEY) === 'true';
    const lastCode = sessionStorage.getItem(DIALOG_CODE_KEY);

    // 如果当前code与上次显示弹框的code不同,则重置状态
    if (currentCode && lastCode && currentCode !== lastCode) {
        resetDialogState();
        return false;
    }

    return isShown;
}

/**
 * 标记弹框已显示
 * @param {string} currentCode - 当前表单的code参数
 */
export function markDialogShown(currentCode) {
    sessionStorage.setItem(DIALOG_SHOWN_KEY, 'true');
    if (currentCode) {
        sessionStorage.setItem(DIALOG_CODE_KEY, currentCode);
    }
}

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

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

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

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