<template>
    <global-page-swiper
        title="信息通报"
        isDataList
        refresherEnabled
        loadingMoreEnabled
        auto
        ref="paging"
        :params="searchData"
        @handleRightClick="handleRightClick"
        :api="getMocinfoListApi"
        :padding="24"
        localPaging
        :localPagingCB="localPagingCB"
        :tabList="tabList"
        tabValueField="state"
        tabsWidth="50%"
    >
        <template #="{ dataList }">
            <view
                v-for="item in dataList"
                :key="item.id"
                @tap="goDetails(item)"
                class="item"
            >
                <view class="item-title">
                    <view class="left">
                        <custom-state :value="item.status.toUpperCase()" />
                    </view>
                    <view class="right inforDisTags">
                        <global-tag
                            v-for="tagItem of item.tags"
                            :key="tagItem.text"
                            :type="tagItem.type" class="txt">
                            {{ tagItem.text }}
                        </global-tag>
                        <!--<global-tag type="success" class="txt">
                            {{ getParamNameByValue('MajorCategory', item.majorCategory) }}
                        </global-tag>
                        <global-tag type="info" class="txt">
                            {{ getParamNameByValue('McoCurrentState', item.state) }}
                        </global-tag>-->
                    </view>
                </view>
                <view class="item-content u-line-3 fleetItemCont">
                    <global-icon icon="calendar"></global-icon>
                </view>
            </view>
        </template>

    </global-page-swiper>
</template>

<script setup>
import { ref } from 'vue'
import { timeStampFormat } from 'mocp/utils/tool'
import { useGetDictByValue } from 'mocp/hooks/use-dict/useDict'
import useInforDisclosureStore from 'mocp/store/inforDisclosure'
import { storeToRefs } from 'pinia'
import { onUnload } from '@dcloudio/uni-app'
import { getMocinfoListApi } from 'mocp/api/inforDisclosure'
import { getParamNameByValue, getParamsByType } from 'mocp/hooks/use-params/useParams'


//跳转
const inforDisclosure = useInforDisclosureStore()
const {searchData} = storeToRefs(inforDisclosure)

const tabList = [
    {
        name: '当前通报',
        value: 1
    },
    {
        name: '历史通报',
        value: 2
    }
]

const goDetails = (data) => {
    uni.$mocpJump.navigateTo('/panel/inforDisclosure/details', {id: data.id}).then(() => {
        inforDisclosure.setState('details', data)
    })
}

const localPagingCB = (data) => {
    const RetentionBasisList = getParamsByType('RetentionBasis')
    const OperationPhaseList = getParamsByType('OperationPhase')
    const ReleaseStatuList = getParamsByType('ReleaseStatu')
    data.list = data.list.reduce((q, w) => {
        q.push(w)
        if (Array.isArray(w.cascade) && w.cascade.length > 0) {
            q.push(...w.cascade)
        }
        return q
    }, [])

    const mappedData = data.list.map(item => {
        return {
            time: item.creationTime.replace(/-/g, '/').replace(/:\d+?$/, ''),
            operator: item.filledBy,
            info: item.faultDescription,
            status: item.failureState.toString() === '0' ?
                'open' : item.failureState.toString() === '1' ?
                    'close' : '作废',
            tags: [
                {
                    text: item.pid === '0' ? '主项' : '子项',
                    type: item.pid === '0' ? 'primary' : 'warning'
                },
                {
                    text: RetentionBasisList[item.guarantee * 1]?.label,
                    type: 'primary'
                },
                {
                    text: OperationPhaseList[item.functionInfo * 1]?.label,
                    type: 'primary'
                },
                {
                    text: ReleaseStatuList[item.rleaseState]?.label,
                    type: 'info'
                }
            ],
            id: item.id
        }
    })
    console.log('@@mappedData', mappedData[0])
    return mappedData
}

//筛选
const handleRightClick = () => {
    uni.$mocpJump.redirectTo('/panel/inforDisclosure/search')
}
//刷新
const paging = ref()
uni.$on('inforDisclosureReload', () => {
    paging.value?.reload()
})
onUnload(() => {
    uni.$off('inforDisclosureReload')
})
</script>
<style lang="scss" scoped>
@import 'mocpStatic/css/list.scss';
@import './constants/inforDisclosure.scss';
</style>
