「Uniapp」一些常用方法的封装

弹窗 - showModal

/**
 * 封装 uni.showModal
 * @param {Object|String} options 配置对象或提示内容
 * @param {String} [options.title='提示'] 标题
 * @param {String} options.content 提示内容
 * @param {Boolean} [options.showCancel=true] 是否显示取消按钮
 * @param {String} [options.confirmText='确定'] 确认按钮文字
 * @param {String} [options.cancelText='取消'] 取消按钮文字
 * @param {String} [options.confirmColor='#3CC51F'] 确认按钮颜色
 * @param {String} [options.cancelColor='#999'] 取消按钮颜色
 * @param {Function} [callback] 回调函数，接收 confirm 参数
 * @return {Promise} 返回 Promise 对象
 */
export function showModal(options, callback) {
    // 处理参数，支持直接传入字符串内容
    if (typeof options === 'string') {
        options = {
            content: options
        }
    }

    // 默认配置
    const defaultOptions = {
        title: '提示',
        showCancel: true,
        confirmText: '确定',
        cancelText: '取消',
        confirmColor: '#3CC51F',
        cancelColor: '#999'
    }

    // 合并配置
    const modalOptions = {
        ...defaultOptions,
        ...options
    }

    // 返回 Promise
    return new Promise((resolve, reject) => {
        uni.showModal({
            ...modalOptions,
            success: (res) => {
                // 执行回调函数
                if (typeof callback === 'function') {
                    callback(res.confirm)
                }
                // Promise 处理
                if (res.confirm) {
                    resolve(res)
                } else if (res.cancel) {
                    reject(res)
                }
            },
            fail: (err) => {
                // 执行回调函数
                if (typeof callback === 'function') {
                    callback(false)
                }
                reject(err)
            }
        })
    })
}

// 导出快捷方法
export const modal = {
    // 普通提示
    alert(content, title = '提示') {
        return showModal({
            content,
            title,
            showCancel: false
        })
    },

    // 确认对话框
    confirm(content, title = '提示') {
        return showModal({
            content,
            title
        })
    },

    // 删除确认
    deleteConfirm(content = '确定要删除吗？', title = '删除提示') {
        return showModal({
            content,
            title,
            confirmText: '删除',
            confirmColor: '#DD524D'
        })
    },

    // 错误提示
    error(content, title = '哎呀，出现错误了') {
        return showModal({
            content,
            title,
            showCancel: false,
            confirmText: '我知道了',
            confirmColor: '#DD524D'
        })
    }
}

Toast

/**
 * 封装 uni.showToast
 * @param {Object|String} options 配置对象或提示内容
 * @param {String} options.title 提示内容
 * @param {Number} [options.duration=1500] 显示时长
 * @param {String} [options.icon='none'] 图标类型
 * @param {String} [options.image] 自定义图标的本地路径
 * @param {Boolean} [options.mask=false] 是否显示透明蒙层
 * @param {String} [options.position='center'] 显示位置，可选值: 'top' | 'center' | 'bottom'
 * @return {Promise} 返回 Promise 对象，在 toast 消失后 resolve
 */
export function showToast(options) {
    // 处理参数，支持直接传入字符串内容
    if (typeof options === 'string') {
        options = {
            title: options
        }
    }

    // 默认配置
    const defaultOptions = {
        title: '',
        duration: 1500,
        icon: 'none',
        mask: false,
        position: 'center'
    }

    // 合并配置
    const toastOptions = {
        ...defaultOptions,
        ...options
    }

    // 处理 position (部分平台支持)
    if (toastOptions.position) {
        switch (toastOptions.position) {
            case 'top':
                toastOptions.position = 'top'
                break
            case 'bottom':
                toastOptions.position = 'bottom'
                break
            default:
                toastOptions.position = 'center'
        }
    }

    return new Promise((resolve) => {
        uni.showToast({
            ...toastOptions,
            success: () => {
                // 定时器，在 toast 消失后 resolve
                setTimeout(() => {
                    resolve()
                }, toastOptions.duration)
            },
            fail: (err) => {
                console.error('showToast error:', err)
                resolve() // 即使失败也 resolve
            }
        })
    })
}

// 导出快捷方法
export const toast = {
    // 普通提示
    show(title, duration = 1500) {
        return showToast({
            title,
            duration
        })
    },

    // 成功提示
    success(title, duration = 1500) {
        return showToast({
            title,
            duration,
            icon: 'success'
        })
    },

    // 错误提示
    error(title, duration = 1500) {
        return showToast({
            title,
            duration,
            icon: 'error'
        })
    },

    // 加载中
    loading(title = '加载中...', duration = 0, mask = true) {
        return showToast({
            title,
            duration,
            icon: 'loading',
            mask
        })
    },

    // 隐藏 toast
    hide() {
        uni.hideToast()
    }
}