image-resolution-checker/src/index.ts

A Vue 3 plugin for checking image resolutions with per - page settings

/**
 * @Author: mamba_mac dengzhifeng_63@163.com
 * @Date: 2025-02-07 15:22:54
 * @LastEditors: mamba_mac dengzhifeng_63@163.com
 * @LastEditTime: 2025-02-17 14:16:02
 * @FilePath: src/index.ts
 * @Description: 这是默认设置,可以在设置》工具》File Description中进行配置
 */

import { App } from 'vue';

// 检查单张图片分辨率的函数
const checkSingleImageResolution = (file: File, minWidth: number, minHeight: number): Promise<boolean> => {
    return new Promise((resolve, reject) => {
        const reader = new FileReader();

        reader.onload = (e: ProgressEvent<FileReader>) => {
            const img = new Image();

            img.onload = () => {
                const widthValid = img.width >= minWidth;
                const heightValid = img.height >= minHeight;
                resolve(widthValid && heightValid);
            };

            img.onerror = () => {
                reject(new Error('Failed to load the image.'));
            };

            img.src = e.target?.result as string;
        };

        reader.onerror = () => {
            reject(new Error('Failed to read the image file.'));
        };

        reader.readAsDataURL(file);
    });
};

// 检查多张图片分辨率的函数
const checkImageResolutions = async (files: FileList | null, minWidth: number, minHeight: number): Promise<{ file: File; isValid: boolean }[]> => {
    if (!files) return [];
    const results: { file: File; isValid: boolean }[] = [];
    for (let i = 0; i < files.length; i++) {
        try {
            const isValid = await checkSingleImageResolution(files[i], minWidth, minHeight);
            results.push({ file: files[i], isValid });
        } catch (error) {
            console.error(`Error checking resolution of file ${files[i].name}:`, error);
            results.push({ file: files[i], isValid: false });
        }
    }
    return results;
};

// 定义 Vue 3 插件
const ImageResolutionChecker = {
    install: (app: App) => {
        app.config.globalProperties.$checkImageResolutions = checkImageResolutions;
    },
};

export default ImageResolutionChecker;
export { checkImageResolutions, checkSingleImageResolution };