<template>
    <global-page-swiper
        title="我的跟机"
        isDataList
        refresherEnabled
        loadingMoreEnabled
        auto
        ref="paging"
        :padding="24"
        :transformData="transformData"
        :tabList="tabList"
        tabValueField="state"
        tabsWidth="50%"
        chooseDataType="checkbox"
        @handleChooseData="handleChooseData"
        alone
    >
        <template #="{ item }">
            <supportedTaskItem :item="item" />
        </template>

        <template #bottom>
            <view class="footer-btn">
                <up-row gutter="10">
                    <up-col span="6">
                        <global-button type="primary" plain size="large" :radius="5" @tap="handleReset">清空选择</global-button>
                    </up-col>
                    <up-col span="6">
                        <global-button type="primary" size="large" :radius="5" @tap="handleConfirm">确认选择</global-button>
                    </up-col>
                </up-row>
            </view>
        </template>
    </global-page-swiper>

    <global-action-sheet v-model="showAction" :options="followAcTagAllDispose" @select="handleSelect" />
</template>

<script setup>
import { ref } from 'vue'
import useSupportedTaskStore from 'mocp/store/supportedTask'
import { storeToRefs } from 'pinia'
import { userTasksApi, updateFlyFollowAcApi, getMoveListApi } from 'mocp/api/supportedTask'
import supportedTaskItem from './components/supportedTaskItem.vue'
import { followAcTagAll } from 'mocp/utils/getFlightList'
import { orderBy } from 'lodash'
import useUserStore from 'mocp/store/user'

const userStore = useUserStore()
const paging = ref(null)
const showAction = ref(false)
const supportedTaskStore = useSupportedTaskStore()
const { searchData } = storeToRefs(supportedTaskStore)
const followAcTagAllDispose = followAcTagAll.map((item) => {
    return {
        label: item,
        value: item
    }
})
const tabList = [
    {
        name: '今日及次日后跟机任务',
        value: 1,
        params: {},
        api: userTasksApi
    },
    {
        name: '历史跟机任务',
        value: 2,
        params: {
            userId: userStore.userInfo?.id
        },
        api: getMoveListApi
    }
]
const selectList = ref([])

const transformData = (data) => {
    const test = [
        {
            followStatus: 1, //跟机状态
            flightDate: 1, //跟机航班日期
            stdChn: 1, //起飞时间
            depStn: 1, //跟机航站
            acOwn: 1, //航司
            flightNo: 1, //航班号
            ac: 1, //机号
            acType: 1 //机型
        },
        {
            followStatus: 2, //跟机状态
            flightDate: 2, //跟机航班日期
            stdChn: 2, //起飞时间
            depStn: 2, //跟机航站
            acOwn: 2, //航司
            flightNo: 2, //航班号
            ac: 2, //机号
            acType: 2 //机型
        }
    ]
    console.log('@@mappedData', data.followAc)

    return orderBy(data.followAc, 'stdChn')
}
const handleChooseData = (data) => {
    selectList.value = data
}
const handleSelect = async (followStatus) => {
    try {
        const changeStatus = await Promise.all(
            selectList.value.map((item) =>
                updateFlyFollowAcApi({
                    id: item.id,
                    followStatus: followAcTagAll.indexOf(followStatus)
                })
            )
        )
        if (changeStatus.every((a) => a.code.toString() === '200')) {
            uni.$mocpMessage.success('修改成功')
            paging.value.reload()
        }
    } catch (e) {
        console.log('遍历修改状态错误', e)
    }
}
const handleReset = () => {
    paging.value.updateCache()
}
const handleConfirm = () => {
    if (!selectList.value?.length) return uni.$mocpMessage.error('请至少勾选一条数据')
    showAction.value = true
}
</script>
<style lang="scss" scoped>
@import './constants/supportedTask.scss';
</style>
