import {LoadingStatus} from "@/utils/enums";
import {isEmpty, parseLocalUrl} from "@/utils/index";
import {uploadFile} from "@/api/common";

export const $loadList = {
    props: {
        value: {
            type: String,
            default: null,
        },
    },
    computed: {
        /**
         * 加载状态
         * loading: 是否加载中
         * current: 当前值
         * max: 最大值
         */
        loadStatus() {
            return (loading, current, max) => {
                // console.log(loading, current, max)
                if (current == null) {
                    current = 0;
                }
                console.log(`loading ${loading} current ${current} max ${max}`)
                if (loading === true) {
                    return LoadingStatus.LOADING;
                } else if (max != null && current >= max) {
                    return LoadingStatus.NO_MORE;
                } else {
                    return LoadingStatus.MORE;
                }
            }
        }
    },
    methods: {
        /**
         * 加载更多
         * @param func 加载方法回调
         * @param loadStatus 加载状态
         */
        loadMore(func, loadStatus) {
            // console.log("loadStatus", loadStatus);
            if (loadStatus !== LoadingStatus.MORE) {
                return;
            }
            loadStatus = LoadingStatus.LOADING;
            func.apply();
        },
    }
}

export const $upload = {
    props: {
        value: {
            type: String,
            default: null
        }
    },
    data() {
        return {
            fileList: []
        }
    },
    watch: {
        value:  {
            handler(nv, ov) {
                this.initFileList(nv);
            },
            deep: true,
            immediate: true
        }
    },
    mounted() {
        this.initFileList(this.value);
    },
    computed: {
        previewFileList() {
            return this.fileList.map(item => {
                return {
                    ...item,
                    url: parseLocalUrl(item.url),
                }
            })
        }
    },
    methods: {
        // 初始化文件列表
        initFileList(value) {
            console.log('value', value )
            if (isEmpty(value)) {
                this.fileList = [];
            } else {
                let urls = value.split(",");
                this.fileList = urls.map(url => {
                    return {
                        url: url,
                        status: 'success',
                    }
                })
            }
        },
        async afterRead(event) {
            // 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
            let lists = [].concat(event.file);

            // 添加到fileList
            this.fileList.push(
                ...lists.map(item => {
                    return {
                        url: item.url,
                        status: 'uploading',
                        message: '上传中'
                    }
                })
            )

            // 依次上传
            for (let i = 0; i < this.fileList.length; i ++) {
                try {
                    await this.doUpload(this.fileList[i]);
                } catch (e) {
                    console.error(e);
                }
            }

            // 触发事件
            this.emitInputValue();
        },
        async doUpload(file) {
            try {
                let res = await uploadFile(file.url, 60);
                if (res.code === 200) {
                    file.url = res.fileName;
                    file.status = 'success';
                    file.message = '上传成功';
                }
            } catch (e) {
                file.status = 'fail';
                file.message = '上传失败';
            }
        },
        onDelete(e) {
            this.fileList.splice(e.index, 1);
            this.emitInputValue();
        },
        emitInputValue() {
            let successList = this.fileList.filter(item => item.status === 'success');
            let nv = successList.map(item => item.url).join(",");
            this.$emit('input', nv);
        }
    }
}