/**
 * TODO: 色块图例配置，实际上应该和后端的色斑图，进行动态匹配，可以考虑由后端接口返回
 */
import { cloneDeep } from 'lodash-es'

/**
 * 小时气温图例配置
 */
export const hourTemLegendConfig = {
    expand: false,
    title: '单位: °C',
    option: {
        items: [
            {
                color: '#800000',
                label: '<44',
            },
            {
                color: '#960000',
            },
            {
                color: '#AB0001',
                label: '40',
            },
            {
                color: '#C80100',
            },
            {
                color: '#E70000',
                label: '36',
            },
            {
                color: '#FE371B',
            },
            {
                color: '#FF4B25',
                label: '32',
            },
            {
                color: '#FF7300',
            },
            {
                color: '#FF9A02',
                label: '28',
            },
            {
                color: '#FFC300',
            },
            {
                color: '#FFE703',
                label: '24',
            },
            {
                color: '#FFFF04',
            },
            {
                color: '#F5FF03',
                label: '20',
            },
            {
                color: '#DEFF00',
            },
            {
                color: '#C5FF04',
                label: '16',
            },
            {
                color: '#B5FF00',
            },
            {
                color: '#98FD0F',
                label: '12',
            },
            {
                color: '#8AFA2D',
            },
            {
                color: '#72F806',
                label: '8',
            },
            {
                color: '#00FF73',
            },
            {
                color: '#00FF94',
                label: '4',
            },
            {
                color: '#00FFB4',
            },
            {
                color: '#00FFD6',
                label: '0',
            },
            {
                color: '#06FFF7',
            },
            {
                color: '#00EBFF',
                label: '-4',
            },
            {
                color: '#00CBFF',
            },
            {
                color: '#01A6FF',
                label: '-8',
            },
            {
                color: '#0085FF',
            },
            {
                color: '#0365FF',
                label: '-12',
            },
        ],
    },
}

export const windheaderData = [
    {
        prop: '0~3级',
        label: '0~3级',
        width: '136',
    },
    {
        prop: '4~7级',
        label: '4~7级',
        width: '136',
    },
    {
        prop: '8~10级',
        label: '8~10级',
        width: '136',
    },
    {
        prop: '11~14级',
        label: '11~14级',
        width: '136',
    },
    {
        prop: '15~17级',
        label: '15~17级',
        width: '136',
    },
]
export const windtableData = [
    {
        '0~3级': '0站',
        '4~7级': '0站',
        '8~10级': '0站',
        '11~14级': '0站',
        '15~17级': '0站',
    },
]

export function buildQueryParams(unBuildParams, config?) {
    // const params = unBuildParams
    // for (const key in params) {
    //     if (isRef(params[key])) {
    //         params[key] = unref(params[key])
    //     }
    //     if (isReactive(params[key])) {
    //         params[key] = toRaw(params[key])
    //     }
    // }
    const queryParams = cloneDeep(toRaw(unBuildParams))
    if (config?.isSpot) {
        delete queryParams.numericalBegin
        delete queryParams.numericalEnd
        delete queryParams.symbolBegin
        delete queryParams.symbolEnd
    }
    if (config?.isFirstQuery) {
        delete queryParams.startTime
        delete queryParams.endTime
    }
    return queryParams
}

export function createSplotLayer(type: String) {
    return {
        id: `${type}-splot`,
        type: 'fill',
        source: `${type}-splot`,
        paint: {
            'fill-color': {
                type: 'identity',
                property: 'color',
            },
            'fill-opacity': 1,
        },
    }
}
export function createTextLayer(type: String) {
    return {
        id: `${type}-text`,
        type: 'symbol',
        source: `${type}-text`,
        layout: {
            'text-field': '{value}',
            'text-size': 14,
            'text-offset': [0, 1.2],
            'icon-image': 'point.normal',
            'icon-anchor': 'top',
            'icon-size': 0.4,
        },
        paint: {
            'text-color': '#3766fd',
            'text-halo-color': '#fff',
            'text-halo-width': 1,
        },
    }
}
